@layer components{.status-picker{min-width:11rem;padding:var(--space-1)}.status-picker-title{text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:var(--font-bold);color:var(--text-muted);margin-bottom:var(--space-2);padding:0 var(--space-1)}.status-picker-grid{flex-direction:column;gap:2px;display:flex}.status-picker-grid .dropdown-menu__item{background:0 0;padding:0}@media (hover:hover){.status-picker-grid .dropdown-menu__item:hover{background:0 0}}.status-option{border-radius:var(--radius-md);cursor:pointer;text-align:left;width:100%;color:var(--text-primary);transition:background var(--transition-fast) ease;background:0 0;border:0;align-items:center;gap:6px;padding:8px 10px;font-family:inherit;font-size:.82rem;display:flex}.dropdown-menu__item:focus-visible .status-option,.status-option:focus-visible{background:var(--opt-bg);outline:none}@media (hover:hover){.dropdown-menu__item:hover .status-option,.status-option:hover{background:var(--opt-bg);outline:none}}.status-option.active{background:var(--opt-bg);color:var(--opt-color);font-weight:var(--font-semibold)}.status-option-dot{background:var(--opt-bg);width:22px;height:22px;color:var(--opt-color);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.status-option-label{white-space:nowrap;flex:1}.status-option-check{color:var(--opt-color);flex-shrink:0}@media (prefers-reduced-motion:reduce){.status-option{transition:none}}:root{--shelf-color-skincare:var(--color-success);--shelf-color-complement:var(--color-primary);--shelf-color-huile:var(--color-warning);--shelf-color-vitamine:var(--color-info);--shelf-color-default:var(--color-accent)}.prod-card-wrapper{--pcc-accent:var(--color-primary);isolation:isolate;transition:transform var(--transition-fast) ease, filter var(--transition-fast) ease;position:relative}.prod-card-wrapper.pcc--select-mode:not(.pcc--selected){opacity:.88}.prod-card-wrapper.pcc--selected{transform:scale(.98)}.prod-card{cursor:pointer;touch-action:manipulation;border-top:3px solid var(--pcc-accent);width:100%;box-shadow:var(--shadow-card);transition:box-shadow var(--transition-fast) ease, border-color var(--transition-fast) ease;flex-direction:column;display:flex}.prod-card-wrapper:active .prod-card{box-shadow:none}.prod-card-wrapper.pcc--selected .prod-card{border-color:var(--pcc-accent);box-shadow:0 0 0 1.5px var(--pcc-accent), 0 6px 18px color-mix(in oklch, var(--pcc-accent) 22%, transparent)}.prod-card-top{align-items:center;gap:var(--space-4);padding:var(--space-2) var(--space-3);flex:1;min-height:4.75rem;display:flex}.prod-icon-wrap{transition:transform var(--transition-base) ease;flex-shrink:0}@media (hover:hover){.prod-card:hover .prod-card-top .prod-icon-wrap{transform:scale(1.1)}}.prod-sentiment-toggle{z-index:100;border:1px solid var(--border-default);background:var(--bg-card);box-shadow:var(--shadow-sm);cursor:pointer;color:var(--text-primary);transition:transform var(--transition-base) var(--ease-bounce);border-radius:50%;justify-content:center;align-items:center;padding:3px;line-height:0;display:flex;position:absolute;top:-10px;right:-8px}.prod-sentiment-toggle.empty{color:var(--text-secondary)}@media (hover:hover){.prod-sentiment-toggle:hover{transform:scale(1.12)}}.prod-sentiment-toggle.popping{animation:sentimentPop .35s var(--ease-bounce)}.prod-sentiment-badge{background:var(--bg-card);width:26px;height:26px;color:var(--text-primary);z-index:100;border:1px solid var(--border-default);box-shadow:var(--shadow-card);cursor:pointer;transition:all var(--transition-base) var(--ease-bounce);border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:18px;line-height:1;display:flex;position:absolute;top:-13px;right:-13px}.prod-sentiment-badge.empty{opacity:.4}.prod-sentiment-badge.has-sentiment{background:oklch(from var(--sentiment-color) l c h / .14);border-color:oklch(from var(--sentiment-color) l c h / .4)}@media (hover:hover){.prod-sentiment-badge:hover{border-color:var(--color-primary);z-index:10;transform:scale(1.2)}}.pcc-check{background:var(--bg-card);border:1.5px solid var(--border-strong);color:oklch(100% 0 0);opacity:0;width:24px;height:24px;transition:opacity var(--transition-fast) ease, transform var(--transition-fast) ease, background var(--transition-fast) ease, border-color var(--transition-fast) ease;z-index:99;pointer-events:none;box-shadow:var(--shadow-sm);border-radius:6px;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:10px;left:10px;transform:scale(.85)}.pcc-check--visible{opacity:1;transform:scale(1)}.pcc--selected .pcc-check{background:var(--pcc-accent);border-color:var(--pcc-accent)}.prod-body{text-align:left;min-width:0;font:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;flex:1;justify-content:flex-start;align-items:stretch;gap:6px;padding:0;display:flex;overflow:hidden}.prod-card .card__footer{border-top:var(--rule-section);color:var(--text-primary);padding:var(--space-3) var(--space-5);background:0 0;position:relative}.prod-brand{text-transform:uppercase;letter-spacing:1.2px;color:var(--text-secondary);font-size:11px;font-weight:var(--font-bold);white-space:nowrap;text-overflow:ellipsis;min-width:0;max-width:100%;min-height:1.2em;line-height:1.2;overflow:hidden}.prod-name{font-family:var(--font-display);font-size:1.0625rem;font-weight:var(--font-medium);color:var(--text-primary);letter-spacing:-.01em;-webkit-line-clamp:2;line-clamp:2;word-break:break-word;-webkit-box-orient:vertical;min-width:0;max-width:100%;line-height:1.3;display:-webkit-box;overflow:hidden}.prod-comment{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.75rem;font-style:italic;line-height:1.4;overflow:hidden}.prod-chips{gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.pcc-compat{font-size:var(--text-xs);font-weight:var(--font-medium,500);border-radius:999px;align-items:center;gap:4px;padding:3px 9px;line-height:1.25;display:inline-flex}.pcc-compat--favorite{color:var(--color-success);background:oklch(from var(--color-success) l c h / .12)}.pcc-compat--watch{color:var(--text-secondary);background:oklch(from var(--text-muted) l c h / .12)}.pcc-status-wrap{display:inline-flex}.pcc-status-pill{min-height:var(--space-10);background:color-mix(in oklch, var(--pcc-accent) 12%, transparent);color:var(--pcc-accent);border:1px solid color-mix(in oklch, var(--pcc-accent) 25%, transparent);font-size:var(--text-xs);font-weight:var(--font-semibold);cursor:pointer;transition:background var(--transition-fast) ease, transform var(--transition-fast) ease;border-radius:999px;align-items:center;gap:5px;padding:4px 10px;font-family:inherit;display:inline-flex}.pcc-status-pill:focus-visible{background:color-mix(in oklch, var(--pcc-accent) 20%, transparent)}@media (hover:hover){.pcc-status-pill:hover{background:color-mix(in oklch, var(--pcc-accent) 20%, transparent)}}.pcc-status-pill:focus-visible{outline:2px solid var(--color-focus,var(--color-primary));outline-offset:-2px}.pcc-status-pill:active{transform:scale(.96)}.pcc-status-pill-chevron{opacity:.6;margin-left:1px}.pcc-picker{max-width:calc(100vw - 32px)}.prod-price{color:var(--text-secondary);white-space:nowrap;font-size:.9rem;font-weight:var(--font-semibold)}.prod-card.status-archived{filter:saturate(.4);opacity:.65}.prod-score-corner{pointer-events:none;border-style:solid;width:0;height:0;position:absolute;top:0;right:0}.prod-score-corner.score-gold{border-width:0 28px 28px 0;border-color:#0000 oklch(80% .18 80) #0000 #0000}.prod-score-corner.score-rare{border-width:0 28px 28px 0;border-color:#0000 oklch(75% .18 300) #0000 #0000}@keyframes sentimentPop{0%{transform:scale(1)}30%{transform:scale(1.6)rotate(-10deg)}60%{transform:scale(.85)rotate(5deg)}to{transform:scale(1)rotate(0)}}.prod-sentiment-badge.popping{animation:sentimentPop .35s var(--ease-bounce)}@media (prefers-reduced-motion:reduce){.prod-sentiment-badge.popping{animation:none}.prod-card,.prod-card-wrapper,.prod-sentiment-badge,.pcc-check,.pcc-status-pill{transition:none}@media (hover:hover){.prod-card:hover .prod-icon-wrap{transform:none}}}.bulk-bar-wrap{left:0;right:0;bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0));z-index:var(--z-dropdown);padding:0 var(--space-4);pointer-events:none;animation:bulk-bar-in .24s var(--ease-soft-bounce);justify-content:center;display:flex;position:fixed}@keyframes bulk-bar-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.bulk-bar{pointer-events:auto;align-items:center;gap:var(--space-3);color:oklch(98% 0 0);background:oklch(20% .02 60);border-radius:999px;width:100%;max-width:540px;padding:8px 8px 8px 14px;display:flex;box-shadow:0 10px 32px oklch(0% 0 0/.3),0 2px 6px oklch(0% 0 0/.2)}.bulk-bar-close{color:oklch(100% 0 0/.8);cursor:pointer;width:32px;height:32px;transition:background var(--transition-fast) ease;background:oklch(100% 0 0/.1);border:0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.bulk-bar-close:focus-visible{background:oklch(100% 0 0/.18);outline:none}@media (hover:hover){.bulk-bar-close:hover{background:oklch(100% 0 0/.18);outline:none}}.bulk-bar-label{flex:1;align-items:baseline;gap:6px;min-width:0;font-size:.9rem;display:flex}.bulk-bar-label strong{font-size:1.05rem;font-weight:var(--font-bold);font-variant-numeric:tabular-nums}.bulk-bar-label span{color:oklch(100% 0 0/.7);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.bulk-bar-action{flex-shrink:0;align-items:center;gap:6px;display:inline-flex;position:relative}.bulk-bar-compare{color:oklch(100% 0 0);cursor:pointer;font:inherit;font-size:.9rem;font-weight:var(--font-semibold);transition:background var(--transition-fast) ease;background:oklch(100% 0 0/.12);border:0;border-radius:999px;align-items:center;gap:6px;padding:8px 14px;display:inline-flex}.bulk-bar-compare:focus-visible{background:oklch(100% 0 0/.2);outline:none}@media (hover:hover){.bulk-bar-compare:hover{background:oklch(100% 0 0/.2);outline:none}}.bulk-bar-move{background:var(--color-primary);color:oklch(100% 0 0);cursor:pointer;font:inherit;font-size:.9rem;font-weight:var(--font-semibold);transition:filter var(--transition-fast) ease;border:0;border-radius:999px;align-items:center;gap:6px;padding:8px 14px;display:inline-flex}.bulk-bar-move:focus-visible{filter:brightness(1.08);outline:none}@media (hover:hover){.bulk-bar-move:hover{filter:brightness(1.08);outline:none}}@media (width<=420px){.bulk-bar-label span,.bulk-bar-move span,.bulk-bar-compare span{display:none}}@media (prefers-reduced-motion:reduce){.bulk-bar-wrap{animation:none}}.first-empty{text-align:center;padding:var(--space-6) var(--space-6) var(--space-12);max-width:520px;margin:0 auto}.first-empty-art{width:260px;height:150px;margin:0 0 var(--space-10);display:inline-block;position:relative}.first-empty-shelf{background:linear-gradient(oklch(55% .08 45),oklch(42% .07 35));border-radius:0 0 6px 6px;height:12px;position:absolute;bottom:0;left:0;right:0;box-shadow:inset 0 1px oklch(70% .08 55/.6)}.first-empty-bottle{border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:transform var(--transition-slow) ease;background:oklch(100% 0 0/.15);border:1px solid oklch(100% 0 0/.2);justify-content:center;align-items:center;display:flex;position:absolute;bottom:12px;box-shadow:inset 0 1px 1px oklch(100% 0 0/.3),0 4px 12px oklch(0% 0 0/.05)}.first-empty-bottle--b1{color:oklch(71% .16 154);background:oklch(92% .04 154/.4);border-color:oklch(71% .16 154/.2);width:48px;height:76px;animation:3.2s ease-in-out infinite first-empty-float;left:38px}.first-empty-bottle--b2{color:oklch(75% .15 65);background:oklch(93% .04 65/.4);border-color:oklch(75% .15 65/.2);width:54px;height:98px;animation:3.6s ease-in-out .4s infinite first-empty-float;left:106px}.first-empty-bottle--b3{color:oklch(60% .15 260);background:oklch(91% .04 260/.4);border-color:oklch(60% .15 260/.2);width:44px;height:70px;animation:2.8s ease-in-out .2s infinite first-empty-float;left:178px}@keyframes first-empty-float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.first-empty-sparkle{color:oklch(80% .18 80);font-size:16px;animation:2.4s ease-in-out infinite first-empty-sparkle;position:absolute}.first-empty-sparkle--s1{top:20px;left:20px}.first-empty-sparkle--s2{animation-delay:.8s;top:10px;right:30px}@keyframes first-empty-sparkle{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)rotate(10deg)}}.first-empty-title{font-family:var(--font-display);font-size:1.75rem;font-weight:var(--font-medium);margin:0 0 var(--space-2);letter-spacing:-.01em;color:var(--text-primary)}.first-empty-sub{color:var(--text-secondary);margin:0 auto var(--space-6);max-width:420px;line-height:1.55}.first-empty-cta{align-items:center;gap:var(--space-2);display:inline-flex}.first-empty-hints{gap:var(--space-2);margin-top:var(--space-8);text-align:left;grid-template-columns:1fr;display:grid}.first-empty-hint{align-items:center;gap:var(--space-2);padding:var(--space-3);background:var(--bg-muted);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.78rem;display:flex}.first-empty-hint b{color:var(--text-primary);font-weight:var(--font-bold)}.first-empty-hint-icon{flex-shrink:0;font-size:18px}@media (width<=639px){.first-empty{padding:var(--space-6) var(--space-3) var(--space-10)}.first-empty-title{font-size:1.5rem}}@media (prefers-reduced-motion:reduce){.first-empty-bottle,.first-empty-sparkle{animation:none}}.shelf-empty{padding:var(--space-10) var(--space-4);text-align:center;color:var(--text-secondary);flex-direction:column;justify-content:center;align-items:center;display:flex}.shelf-empty-art{margin-bottom:var(--space-3);color:oklch(from var(--color-primary) l c h / .9)}.shelf-empty[data-kind=in_stock] .shelf-empty-art{color:var(--status-color-in-stock)}.shelf-empty[data-kind=wishlist] .shelf-empty-art{color:var(--status-color-wishlist)}.shelf-empty[data-kind=watched] .shelf-empty-art{color:var(--status-color-watched)}.shelf-empty[data-kind=archived] .shelf-empty-art{color:var(--status-color-archived)}.shelf-empty[data-kind=avoided] .shelf-empty-art{color:var(--status-color-avoided)}.shelf-empty[data-kind=holy_grail] .shelf-empty-art{color:var(--status-color-holy-grail)}.shelf-empty[data-kind=repurchase] .shelf-empty-art{color:var(--status-color-repurchase)}.shelf-empty-title{font-family:var(--font-display);font-size:1.25rem;font-weight:var(--font-medium);color:var(--text-primary);margin:0 0 var(--space-2);letter-spacing:-.01em}.shelf-empty-hint{max-width:360px;margin:0;font-size:.92rem;line-height:1.5}.shelf-grid{gap:var(--space-3);perspective:1000px;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));display:grid}@media (width>=640px){.shelf-grid{gap:var(--space-4)}}@media (width<=639px){.shelf-grid{gap:var(--space-3);grid-template-columns:1fr}}.shelf-view{gap:var(--space-5);padding-bottom:var(--space-20);flex-direction:column;display:flex}.shelf-tabs-row{align-items:center;gap:var(--space-2);display:flex}.shelf-tabs-primary{flex:1;min-width:0}.shelf-tabs-row .shelf-tabs-primary{border-bottom:none}.shelf-tabs-row .underline-tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 26px),#0000 100%);mask-image:linear-gradient(90deg,#000 calc(100% - 26px),#0000 100%)}.shelf-tabs-plus{align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);border-radius:var(--radius-full);background:var(--bg-muted);border:1px solid var(--border-default);color:var(--text-secondary);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;display:inline-flex}@media (hover:hover){.shelf-tabs-plus:hover{background:var(--border-default);color:var(--text-primary)}}.shelf-tabs-plus--active{background:color-mix(in oklch, var(--shelf-plus-color,var(--color-primary)) 14%, transparent);border-color:var(--shelf-plus-color,var(--color-primary));color:var(--shelf-plus-color,var(--color-primary))}.shelf-tabs-plus--active .shelf-tabs-plus-chevron{opacity:.55}.shelf-tabs-plus-badge{font-size:var(--text-xs);font-weight:var(--font-bold);padding:0 var(--space-2);border-radius:var(--radius-full);background:color-mix(in oklch, currentColor 18%, transparent)}.shelf-tabs-plus-menu{min-width:12rem;padding:var(--space-1)}.shelf-tabs-plus-item{align-items:center;gap:var(--space-2);width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--text-sm);cursor:pointer;text-align:left;background:0 0;border:none;display:flex}@media (hover:hover){.shelf-tabs-plus-item:hover{background:color-mix(in oklch, var(--shelf-plus-color,var(--color-primary)) 10%, transparent)}}.shelf-tabs-plus-item--active{background:color-mix(in oklch, var(--shelf-plus-color,var(--color-primary)) 16%, transparent);color:var(--shelf-plus-color,var(--color-primary));font-weight:var(--font-semibold)}.shelf-tabs-plus-item-dot{border-radius:var(--radius-full);background:var(--shelf-plus-color,var(--color-primary));flex-shrink:0;width:.5rem;height:.5rem}.shelf-tabs-plus-item-label{flex:1}.shelf-tabs-plus-item-count{font-size:var(--text-xs);color:var(--text-muted)}}.coll-toolbar{--coll-green:var(--color-primary);width:100%;margin-bottom:var(--space-3);align-items:stretch;display:flex}.coll-controls{--coll-green:var(--color-primary);background:var(--bg-muted);border-radius:var(--radius-full);border:1px solid var(--border-default);flex:1;align-items:stretch;gap:3px;min-width:0;padding:3px;transition:border-color .2s,box-shadow .2s;display:flex}.coll-controls:focus-within{border-color:var(--coll-green);box-shadow:0 0 0 3px oklch(from var(--coll-green) l c h / .12)}.coll-search-wrapper{flex:1;align-items:stretch;min-width:0;display:flex;position:relative}.coll-search-wrapper .input-wrapper{width:100%;margin:0;display:flex}.coll-search-icon{color:var(--text-muted);pointer-events:none;z-index:2;position:absolute;top:50%;left:.875rem;transform:translateY(-50%)}.coll-search-wrapper .input-wrapper input.coll-search-input{background:var(--bg-card);width:100%;height:100%;min-height:34px;caret-color:var(--coll-green);transition:all var(--transition-base) ease;color:var(--text-primary);border:1px solid #0000;border-radius:9999px 6px 6px 9999px;padding:.25rem .75rem .25rem 2.5rem;font-size:.9rem;font-weight:500;line-height:1.2}@media (width<=639px){.coll-search-wrapper .input-wrapper input.coll-search-input{font-size:var(--input-font-size)}}.coll-search-wrapper .input-wrapper input.coll-search-input::placeholder{color:var(--text-muted)}.coll-search-wrapper .input-wrapper input.coll-search-input:focus-visible{box-shadow:none;background:oklch(100% 0 0);border-color:#0000;outline:none}.coll-sort-btn,.coll-filter-toggle{background:var(--bg-card);width:36px;height:auto;min-height:0;color:var(--text-secondary);flex-shrink:0;align-self:stretch;padding:0}.coll-sort-btn{border-radius:0}.coll-filter-toggle{border-radius:0 9999px 9999px 0}.coll-sort-btn,.coll-filter-toggle{transition:background .18s,color .18s,transform .18s}@media (hover:hover){.coll-sort-btn:hover,.coll-filter-toggle:hover{background:oklch(from var(--coll-green) 96% .03 h);color:var(--coll-green)}}.coll-sort-btn:active,.coll-filter-toggle:active{transform:scale(.94)}.coll-filter-toggle.active{color:oklch(100% 0 0);background:oklch(from var(--coll-green) calc(l - .08) c h)}.coll-loading{flex-direction:column;justify-content:center;align-items:center;min-height:60dvh;display:flex}.coll-spinner{border:var(--border-width) solid var(--bg-muted);border-top-color:var(--color-primary);width:44px;height:44px;animation:coll-spin .8s var(--ease-standard) infinite;border-radius:50%;margin-bottom:1.25rem}@keyframes coll-spin{to{transform:rotate(360deg)}}.coll-compat-error{margin:0 0 var(--space-3);color:var(--text-muted);font-size:var(--text-sm);text-align:center}