/* Hallmark · macrostructure: Reels canvas · tone: atmospheric · anchor hue: coral · pre-emit: P5 H5 E5 S5 R5 V5 · mobile: pass */
:root{
  --color-ink:#fffaf5;
  --color-muted:#bdb4bd;
  --color-canvas:#111;
  --color-panel:#211b22;
  --color-panel-raised:#302731;
  --color-panel-hover:#392f3a;
  --color-accent:#ff7062;
  --color-focus:#ffd1cb;
  --color-danger:#ff8f87;
  --color-border:rgba(255,250,245,.16);
  --color-border-strong:rgba(255,250,245,.3);
  --color-guide:rgba(255,250,245,.2);
  --color-overlay:rgba(23,19,24,.72);
  --color-overlay-strong:rgba(23,19,24,.8);
  --color-glass:rgba(23,19,24,.54);
  --color-glass-hover:rgba(48,39,49,.72);
  --color-sheet:#fffdf9;
  --color-sheet-soft:#faf7f4;
  --color-sheet-ink:#221f24;
  --color-sheet-muted:#706970;
  --color-sheet-line:#e8dfda;
  --color-sheet-plum:#4b2142;
  --color-action:#111;
  --color-action-ink:#fff;
  --settings-surface:#0c0c0d;
  --settings-surface-soft:#1c1c1e;
  --settings-ink:#f5f5f7;
  --settings-muted:#a1a1a6;
  --settings-line:#38383a;
  --font-body:"Cairo",sans-serif;
  --radius-stage:28px;
  --radius-control:999px;
  --space-1:6px;
  --space-2:10px;
  --space-3:16px;
  --space-4:24px;
  --shadow-stage:0 24px 70px rgba(0,0,0,.34);
  --shadow-hud:0 14px 34px rgba(0,0,0,.24);
}
:root[data-theme="light"]{--color-ink:#271f26;--color-muted:#665d64;--color-canvas:#f8f5f2;--color-panel:#fffaf6;--color-panel-raised:#f1e8eb;--color-panel-hover:#eadde3;--color-border:rgba(75,33,66,.18);--color-border-strong:rgba(75,33,66,.34);--color-guide:rgba(75,33,66,.24);--color-overlay:rgba(255,250,246,.84);--color-overlay-strong:rgba(255,250,246,.94);--color-glass:rgba(255,250,246,.78);--color-glass-hover:rgba(255,255,255,.9);--settings-surface:#fffdf9;--settings-surface-soft:#faf7f4;--settings-ink:#221f24;--settings-muted:#706970;--settings-line:#e8dfda;--shadow-stage:0 24px 70px rgba(75,33,66,.16);--shadow-hud:0 14px 34px rgba(75,33,66,.14)}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;overflow-x:clip;background:var(--color-canvas);color:var(--color-ink);font-family:var(--font-body)}
body{min-height:100vh;min-height:100svh;display:grid;place-items:center;padding:0}
button,a,label{font:inherit;-webkit-tap-highlight-color:transparent}
.reels-shell{position:relative;width:min(100%,480px);height:100vh;height:100svh;max-height:960px;min-height:568px;overflow:hidden;background:var(--color-panel);isolation:isolate}
.boot-fallback{height:100%;display:grid;place-items:center;align-content:center;gap:8px;padding:24px;color:var(--color-ink);text-align:center}.boot-fallback strong{font-size:.9rem}.boot-fallback small{color:var(--color-muted);font-size:.58rem}
.upload-stage{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;background:var(--color-panel)}
.upload-stage[hidden]{display:none}
.upload-stage::before{content:"";position:absolute;inset:var(--space-3);border:1px dashed var(--color-guide);border-radius:var(--radius-stage);pointer-events:none}
.upload-trigger{position:relative;z-index:2;width:176px;min-height:176px;display:grid;place-items:center;align-content:center;gap:var(--space-2);border:1px solid var(--color-border);border-radius:50%;background:var(--color-panel-raised);color:var(--color-ink);cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease}
.upload-trigger:hover{background:var(--color-panel-hover);border-color:var(--color-border-strong)}
.upload-trigger:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.upload-trigger:active{transform:scale(.97)}
.upload-trigger svg{width:58px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.upload-trigger strong{font-size:1rem;white-space:nowrap}
.upload-stage.is-loading .upload-trigger{pointer-events:none;opacity:.68}
.upload-stage.is-error .upload-trigger{border-color:var(--color-danger)}
.upload-stage.is-success .upload-trigger{display:none}
#uploaded-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--color-canvas)}
#uploaded-preview:not([hidden]){cursor:pointer}
#uploaded-preview[hidden]{display:none}
.photo-change-trigger{display:none!important}
.upload-status{position:absolute;z-index:3;right:var(--space-4);bottom:calc(var(--space-4) + env(safe-area-inset-bottom));left:88px;margin:0;color:var(--color-muted);font-size:.68rem;text-align:right}
.upload-stage.is-error .upload-status{color:var(--color-danger)}
.upload-stage.is-success .upload-status{padding:10px 14px;border-radius:var(--radius-control);background:var(--color-overlay-strong);color:var(--color-ink);backdrop-filter:blur(10px)}
.photo-source-sheet{position:fixed;z-index:30;top:auto;right:50%;bottom:max(14px,env(safe-area-inset-bottom));left:auto;width:min(calc(100% - 24px),440px);max-width:none;margin:0;padding:20px;border:1px solid var(--settings-line);border-radius:28px;background:var(--settings-surface);color:var(--settings-ink);box-shadow:var(--shadow-stage);transform:translateX(50%)}
.photo-source-sheet:not([open]),.favorite-sheet:not([open]),.reel-settings-sheet:not([open]){display:none!important}
.photo-source-sheet::backdrop{background:var(--color-overlay);backdrop-filter:blur(5px)}
.photo-source-head{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 14px}.photo-source-head>strong{font-size:.9rem}.photo-source-head button{width:40px;height:40px;padding:0;border:1px solid var(--settings-line);border-radius:50%;background:var(--settings-surface-soft);color:var(--settings-ink);font-size:1.25rem;cursor:pointer}
.photo-source-options{display:grid;gap:0;overflow:hidden;border:1px solid var(--settings-line);border-radius:24px;background:var(--settings-surface)}.photo-source-options>button{width:100%;min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;border:0;border-bottom:1px solid var(--settings-line);border-radius:0;background:transparent;color:var(--settings-ink);text-align:right;cursor:pointer}.photo-source-options>button:last-child{border-bottom:0}.photo-source-options>button:hover{background:var(--settings-surface-soft)}.photo-source-options>button:focus-visible,.photo-source-head button:focus-visible{outline:3px solid var(--color-focus);outline-offset:-3px}.photo-source-options>button:active,.photo-source-head button:active{opacity:.78}.photo-source-options>button:disabled{opacity:.55;cursor:not-allowed}.photo-source-options span{display:grid;gap:2px}.photo-source-options strong{font-size:.78rem;white-space:nowrap}.photo-source-options small{color:var(--settings-muted);font-size:.55rem}.photo-source-options svg{width:30px;height:30px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rail-nav{position:absolute;z-index:5;top:50%;right:max(var(--space-2),env(safe-area-inset-right));display:flex;flex-direction:column;align-items:flex-end;gap:var(--space-2);transform:translateY(-50%);touch-action:pan-y}
.rail-action{position:relative;width:46px;height:46px;display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 12px;border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-overlay);color:var(--color-ink);text-decoration:none;cursor:pointer;backdrop-filter:blur(12px);transition:width .22s ease,background .18s ease,border-color .18s ease}
.rail-action svg{width:20px;min-width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rail-action span{min-width:max-content;margin-right:12px;font-size:.62rem;font-weight:700;opacity:0;transform:translateX(6px);transition:opacity .15s ease,transform .15s ease;white-space:nowrap}
.rail-action.active{border-color:var(--color-accent);color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent)}
.rail-action.is-revealed{width:142px;background:var(--color-ink);border-color:var(--color-ink);color:var(--color-canvas)}
.rail-action.is-revealed span{opacity:1;transform:none}
.rail-action:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.rail-action:active{transform:scale(.96)}
.rail-nav>.rail-action:not(.active){opacity:0;pointer-events:none;transform:translateX(10px)}.rail-nav>.rail-action.rail-neighbor{opacity:.24;pointer-events:none;transform:none}.rail-nav>.rail-action.active{opacity:1;pointer-events:auto;transform:none}.rail-nav.is-expanded>.rail-action{opacity:1;pointer-events:auto;transform:none}.rail-companion{position:absolute;right:54px;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--color-border-strong);border-radius:50%;background:var(--color-overlay-strong);color:var(--color-ink);box-shadow:var(--shadow-hud);backdrop-filter:blur(12px);opacity:0;pointer-events:none;transform:translateX(10px);transition:opacity .18s ease,transform .18s ease}.rail-companion svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.filter-companion{top:1px}.grid-companion{top:calc(46px + var(--space-2))}.rail-nav.show-upload-options .filter-companion,.rail-nav.show-explore-options .grid-companion,.rail-companion:focus-visible{opacity:1;pointer-events:auto;transform:none}.rail-companion:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.rail-companion:active{transform:scale(.95)}
@media (min-width:481px){body{padding:var(--space-4)}.reels-shell{aspect-ratio:9/16;height:min(calc(100svh - 48px),900px);border-radius:var(--radius-stage);box-shadow:var(--shadow-stage)}}
@media (max-width:374px){.rail-action{width:50px;height:50px;padding-inline:13px}.rail-action.active,.rail-action.is-revealed{width:132px}.upload-trigger{width:158px;min-height:158px}}
@media (hover:hover) and (pointer:fine){.rail-nav>.rail-action{opacity:1!important;pointer-events:auto!important;transform:none!important}.rail-nav>.rail-action:hover{border-color:var(--color-accent);color:var(--color-accent)}}

/* Hallmark · component: filters and size summary · genre: atmospheric · theme: Maraya
 * states: default · hover · focus · active · disabled · loading · error · success
 * contrast: pass
 */
.grid-card-copy .compact-sizes{display:grid;justify-items:start;gap:5px}.grid-card-copy .compact-sizes .more-sizes{border:0;padding:0;color:var(--color-muted);font-size:.5rem;white-space:nowrap}
.audience-step{display:grid;gap:14px;padding:16px;border:1px solid var(--color-border);border-radius:22px;background:var(--color-panel-raised)}.audience-step>strong{font-size:.78rem}.audience-step>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.audience-step button{min-width:0;min-height:50px;border:1px solid var(--color-border-strong);border-radius:999px;background:var(--color-panel);color:var(--color-ink);font-weight:700;white-space:nowrap}.audience-step button:hover{border-color:var(--color-ink)}.audience-step button.active{border-color:var(--color-ink);background:var(--color-ink);color:var(--color-canvas)}
.coordination-fields{display:grid;gap:var(--space-2);margin-top:var(--space-2)}.coordination-fields[hidden]{display:none}.filter-field{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:start;gap:var(--space-2);min-height:64px;padding:10px 14px;border:1px solid var(--color-border);border-radius:18px;background:var(--color-panel-raised)}.filter-field>span{padding-top:12px;color:var(--color-muted);font-size:.62rem}.filter-select{position:relative;min-width:0}.filter-select summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-panel);color:var(--color-ink);cursor:pointer;list-style:none}.filter-select summary::-webkit-details-marker{display:none}.filter-select summary b{font-size:.68rem}.filter-select summary i{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px)}.filter-select[open] summary i{transform:rotate(225deg) translateY(-2px)}.filter-select [role="listbox"]{position:relative;z-index:2;display:grid;gap:4px;margin-top:6px;padding:6px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-panel);box-shadow:var(--shadow-hud)}.filter-select [data-value]{min-height:42px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:var(--color-ink);text-align:right}.filter-select [data-value]:hover{background:var(--color-panel-hover)}.filter-select [aria-selected="true"]{background:var(--color-ink);color:var(--color-canvas)}
.confirm-coordination{width:100%;min-height:52px;margin-top:var(--space-3);border:1px solid var(--color-ink);border-radius:var(--radius-control);background:var(--color-ink);color:var(--color-canvas);font-weight:700;cursor:pointer}.confirm-coordination:hover{opacity:.9}.confirm-coordination:focus-visible,.audience-step button:focus-visible,.filter-select summary:focus-visible,.filter-select button:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.confirm-coordination:active,.audience-step button:active,.filter-select button:active{transform:scale(.98)}.confirm-coordination:disabled,.audience-step button:disabled,.filter-select button:disabled{opacity:.45;cursor:not-allowed}
#coordination-details[hidden]+.confirm-coordination{display:none}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.reel-stage{position:absolute;inset:0;background:var(--color-canvas)}
.reel-stage[hidden]{display:none}
.product-reels{height:100%;overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch;touch-action:pan-y;scroll-snap-type:y proximity;overscroll-behavior-y:contain;scrollbar-width:none;transition:background .2s ease}
.product-reels::-webkit-scrollbar{display:none}
/* Hallmark · selected size stays tied to the cart variant; keyboard/touch parity. */
.reel-hud .reel-identity>strong{font-size:var(--reel-product-title-size)}
.reel-hud .reel-identity>b{font-size:var(--reel-product-price-size)}
.reel-hud .reel-identity>small{font-size:var(--reel-product-store-size)}
.reel-copy .product-sizes button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:4px 7px;border:1px solid var(--color-border-strong);border-radius:999px;background:var(--color-panel);color:var(--color-ink);font:700 12px var(--font-body);cursor:pointer;text-shadow:none}
.reel-copy .product-sizes button[aria-pressed=true]{background:var(--color-ink);color:var(--color-panel)}
.reel-copy .product-sizes button:focus-visible{outline:2px solid var(--color-ink);outline-offset:3px}
.reel-copy .product-sizes button:active{opacity:.7}
@media(hover:hover){.reel-copy .product-sizes button:hover{border-color:var(--color-ink)}}
.product-reel{position:relative;width:100%;height:100%;min-height:100%;scroll-snap-align:start;scroll-snap-stop:normal;overflow:hidden;background:var(--color-canvas);touch-action:pan-y}
.product-reel>img{width:100%;height:100%;display:block;object-fit:cover}
.product-reel::after{content:"";position:absolute;inset:54% 0 0;background:linear-gradient(to bottom,transparent,var(--color-overlay-strong));pointer-events:none}
.reel-hud{position:absolute;z-index:3;right:18px;bottom:max(50px,calc(env(safe-area-inset-bottom) + 44px));left:18px;min-height:0;padding:14px 16px 40px;border:1px solid var(--color-border-strong);border-radius:24px;background:var(--color-glass);box-shadow:var(--shadow-hud);backdrop-filter:blur(16px) saturate(1.12);-webkit-backdrop-filter:blur(16px) saturate(1.12)}
.reel-copy{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 4px 6px;text-align:right;text-shadow:0 2px 14px var(--color-canvas)}.reel-identity{min-width:0}.reel-copy small,.reel-copy strong,.reel-copy b{display:block}.reel-copy small{color:var(--color-muted);font-size:.54rem}.reel-copy strong{margin-top:2px;overflow-wrap:anywhere;font-size:.9rem;line-height:1.4}.reel-copy b{margin-top:4px;color:var(--color-ink);font-size:.82rem;white-space:nowrap}.reel-copy>.product-sizes{max-width:46%;justify-content:flex-start;margin:0}
.product-sizes{display:flex;flex-wrap:wrap;gap:5px;direction:ltr}.product-sizes span{min-width:28px;padding:3px 7px;border:1px solid var(--color-border-strong);border-radius:999px;color:var(--color-ink);font-size:.45rem;font-weight:700;text-align:center;text-shadow:none}.product-gallery-dots{position:absolute;z-index:4;right:50%;bottom:178px;display:flex;gap:6px;transform:translateX(50%)}.product-gallery-dots button{width:18px;height:18px;display:grid;place-items:center;padding:0;border:0;background:transparent;cursor:pointer}.product-gallery-dots button::after{content:"";width:6px;height:6px;border:1px solid rgba(255,255,255,.75);border-radius:50%;background:rgba(0,0,0,.28);box-shadow:0 1px 4px rgba(0,0,0,.4)}.product-gallery-dots button.active::after{width:18px;border-radius:999px;background:var(--color-accent);border-color:var(--color-accent)}.product-gallery-dots button:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px;border-radius:999px}
.hud-controls{position:absolute;right:14px;bottom:-25px;left:14px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);align-items:center;direction:rtl}.hud-controls::before,.hud-controls::after{display:none}.hud-action,.hud-cart>button{position:relative;z-index:1;width:50px;height:50px;display:grid;place-items:center;padding:0;border:1px solid var(--color-border-strong);border-radius:50%;background:var(--color-panel);color:var(--color-ink);box-shadow:0 0 0 7px var(--color-glass),var(--shadow-hud);cursor:pointer}.hud-action::before,.hud-action::after,.hud-cart>button::before,.hud-cart>button::after{display:none}.hud-action{width:50px}.favorite-action{grid-row:1;grid-column:3;justify-self:center}.favorite-action.active{border-color:var(--color-border-strong);color:var(--color-danger);background:var(--color-panel)}.favorite-action.active svg{fill:var(--color-danger);stroke:var(--color-danger)}.try-action{grid-row:1;grid-column:2;position:relative;width:50px;height:50px;justify-self:center;background:var(--color-panel);box-shadow:0 0 0 7px var(--color-glass),var(--shadow-hud);transform:none}.hud-action:hover,.hud-cart>button:hover,.try-action:hover{color:var(--color-accent);background:var(--color-panel-hover)}.favorite-action.active:hover{color:var(--color-danger)}.hud-action:focus-visible,.hud-cart>button:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.hud-action:active,.hud-cart>button:active,.try-action:active{transform:scale(.94)}.hud-action:disabled,.hud-cart>button:disabled{opacity:.55;cursor:not-allowed}
.hud-action svg,.hud-cart svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.hud-cart{grid-row:1;grid-column:1;display:grid;place-items:center;justify-self:center;direction:rtl}.hud-cart>button:not(.cart-stepper){width:50px;height:50px}.cart-stepper{width:124px!important;min-width:124px!important;min-height:58px!important;padding:4px 8px!important;grid-template-columns:34px minmax(30px,1fr) 34px!important;grid-template-rows:1fr!important;gap:3px;direction:rtl;font-weight:800;border-radius:999px!important}.cart-stepper span{font-size:1.05rem;line-height:1;white-space:nowrap}.cart-stepper i{display:grid;place-items:center;width:34px;height:46px;font-style:normal;font-size:1.55rem;font-weight:800;line-height:1;cursor:pointer}
.view-tools{position:absolute;z-index:9;top:max(8px,env(safe-area-inset-top));right:10px;left:auto;display:flex;flex-direction:row;gap:8px;transform:none}
.reel-stage.is-grid~.rail-nav{opacity:1;pointer-events:auto}
.tool-button{position:relative;width:42px;height:42px;display:grid;place-items:center;padding:0;border:1px solid var(--color-border);border-radius:50%;background:var(--color-overlay-strong);color:var(--color-ink);cursor:pointer;backdrop-filter:blur(12px)}
.tool-button[hidden]{display:none}
.tool-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tool-button.active{border-color:var(--color-accent);color:var(--color-accent)}.tool-button:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.tool-button:active{transform:scale(.95)}
.tool-button::after{display:none}
.theme-toggle .theme-sun{display:none}:root[data-theme="light"] .theme-toggle .theme-sun{display:block}:root[data-theme="light"] .theme-toggle .theme-moon{display:none}.grid-back{position:absolute;z-index:11;top:max(62px,calc(env(safe-area-inset-top) + 54px));left:12px;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--color-border-strong);border-radius:50%;background:var(--color-overlay-strong);color:var(--color-ink);box-shadow:var(--shadow-hud);backdrop-filter:blur(12px);cursor:pointer}.grid-back[hidden]{display:none}.grid-back svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.live-tool{width:54px;border-radius:var(--radius-control);border-color:var(--color-accent);color:var(--color-accent)}.live-tool span{font-size:.55rem;font-weight:700;letter-spacing:.08em}
.product-reels.grid-view{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;column-gap:12px;row-gap:20px;padding:62px 12px 28px;scroll-snap-type:none;background:var(--color-canvas)}
.grid-card{min-width:0;display:grid;gap:8px;cursor:pointer;outline:none}.grid-card:focus-visible .grid-card-visual{outline:3px solid var(--color-focus);outline-offset:3px}.grid-card-visual{position:relative;overflow:hidden;border:1px solid var(--color-border);border-radius:18px;background:var(--color-panel-raised);box-shadow:0 10px 24px rgba(0,0,0,.2)}.grid-card-visual>img{width:100%;aspect-ratio:4/5;display:block;object-fit:cover}.grid-card-visual .product-gallery-dots{bottom:10px}.grid-card-copy{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 11px;border:1px solid var(--color-border);border-radius:16px;background:var(--color-panel);box-shadow:var(--shadow-hud);text-align:right}.grid-card-copy small,.grid-card-copy strong,.grid-card-copy b{display:block}.grid-card-copy small{color:var(--color-muted);font-size:.44rem}.grid-card-copy strong{margin-top:3px;overflow-wrap:anywhere;font-size:.67rem;line-height:1.45}.grid-card-copy b{margin-top:4px;font-size:.62rem}.grid-card-copy .product-sizes{max-width:48%;justify-content:flex-start}.grid-card-copy .product-sizes span{min-width:24px;padding:2px 5px;font-size:.4rem}
:root[data-theme="light"] .reel-copy{color:var(--color-ink);text-shadow:none}:root[data-theme="light"] .tool-button,:root[data-theme="light"] .rail-action,:root[data-theme="light"] .rail-companion,:root[data-theme="light"] .hud-action,:root[data-theme="light"] .hud-cart>button{color:#3b2735}:root[data-theme="light"] .reel-copy small{color:#5f555d}:root[data-theme="light"] .reel-copy strong,:root[data-theme="light"] .reel-copy b{color:#211a20}
:root[data-theme="light"] .cart-stepper{border-color:var(--color-border-strong)!important;background:var(--color-panel)!important;color:var(--color-ink)!important}:root[data-theme="dark"] .cart-stepper{border-color:var(--color-sheet)!important;background:var(--color-sheet)!important;color:var(--color-sheet-ink)!important}
:root[data-theme="dark"] .grid-card-copy :is(small,strong,b),:root[data-theme="dark"] .grid-card-copy .product-sizes :is(span,.more-sizes){color:var(--color-ink)!important}
:root[data-theme="dark"] .grid-card-copy{border-color:var(--color-border-strong);background:var(--color-panel);color:var(--color-ink)}
.share-action{border-color:var(--color-border-strong)!important;background:var(--color-panel)!important;color:var(--color-ink)!important}
.share-action svg{transform:translateY(-1px)}
.coordination-panel{position:absolute;z-index:10;top:0;right:0;left:0;max-height:86%;overflow-y:auto;padding:max(18px,env(safe-area-inset-top)) var(--space-3) var(--space-4);border-radius:0 0 var(--radius-stage) var(--radius-stage);background:var(--color-panel);box-shadow:var(--shadow-stage);transform-origin:top;animation:coordination-down .24s ease both}
.coordination-panel[hidden]{display:none}
@keyframes coordination-down{from{opacity:0;transform:translateY(-24px) scaleY(.94)}to{opacity:1;transform:none}}
.coordination-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3)}.coordination-head strong{font-size:.92rem}.coordination-head button{width:44px;height:44px;padding:0;border:1px solid var(--color-border);border-radius:50%;background:transparent;color:var(--color-ink);font-size:1.3rem;cursor:pointer}
.coordination-fields{display:grid;gap:var(--space-2)}.coordination-fields label{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:var(--space-2);min-height:58px;padding:8px 14px;border:1px solid var(--color-border);border-radius:18px;background:var(--color-panel-raised)}.coordination-fields span{color:var(--color-muted);font-size:.58rem}.coordination-fields select{width:100%;min-height:42px;border:0;background:transparent;color:var(--color-ink);font:600 .68rem var(--font-body);text-align:right;outline:0}.coordination-fields option{color:var(--color-canvas)}
.confirm-coordination{width:100%;min-height:52px;margin-top:var(--space-3);border:0;border-radius:var(--radius-control);background:var(--color-accent);color:var(--color-ink);font-weight:700;cursor:pointer}.confirm-coordination:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.confirm-coordination:active{transform:scale(.98)}
.empty-reels{height:100%;display:grid;place-items:center;padding:var(--space-4);color:var(--color-muted);text-align:center}
.reel-toast{position:absolute;z-index:12;right:50%;bottom:98px;width:max-content;max-width:calc(100% - 120px);margin:0;padding:10px 16px;border-radius:var(--radius-control);background:var(--color-ink);color:var(--color-canvas);font-size:.6rem;font-weight:700;opacity:0;transform:translate(50%,12px);pointer-events:none;transition:opacity .18s ease,transform .18s ease}.reel-toast.show{opacity:1;transform:translate(50%,0)}
.try-loading{position:absolute;z-index:14;inset:0;display:grid;place-items:center;align-content:center;gap:10px;padding:var(--space-4);background:var(--color-overlay-strong);text-align:center;backdrop-filter:blur(14px)}.try-loading[hidden]{display:none}.try-loading strong{font-size:1rem}.try-loading small{color:var(--color-muted);font-size:.6rem}.try-spinner{width:54px;height:54px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:try-spin .8s linear infinite}@keyframes try-spin{to{transform:rotate(1turn)}}
@media (max-width:374px){.view-tools{right:8px}.tool-button{width:40px;height:40px}.product-reels.grid-view{column-gap:8px;row-gap:16px;padding-inline:8px}.rail-action{width:44px;height:44px}.reel-hud{right:12px;left:12px}.reel-copy{padding-inline:6px}.reel-copy strong{font-size:.84rem}.hud-controls{right:10px;left:10px;grid-template-columns:48px minmax(0,1fr) 116px}.hud-action,.hud-cart>button:not(.cart-stepper),.try-action{width:48px;height:48px}.cart-stepper{width:116px!important;min-width:116px!important}.grid-card-copy strong{font-size:.62rem}}
.favorite-sheet{position:fixed;z-index:31;inset:auto auto max(14px,env(safe-area-inset-bottom)) 50%;width:min(calc(100% - 24px),440px);max-width:none;max-height:min(82svh,650px);margin:0;padding:20px;border:0;border-radius:28px;background:var(--color-sheet);color:var(--color-sheet-ink);box-shadow:var(--shadow-stage);transform:translateX(-50%);overflow:auto}.favorite-sheet::backdrop{background:var(--color-overlay);backdrop-filter:blur(7px)}
.favorite-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.favorite-sheet-head>div{display:grid}.favorite-sheet-head small{color:var(--color-accent);font-size:.58rem}.favorite-sheet-head strong{color:var(--color-sheet-plum);font-size:1rem}.favorite-sheet-head>button{width:42px;height:42px;padding:0;border:0;border-radius:50%;background:var(--color-sheet-soft);color:var(--color-sheet-ink);font-size:1.25rem;cursor:pointer}
.favorite-collections-list{display:grid;gap:9px}.favorite-collection-choice{width:100%;min-height:52px;display:flex;align-items:center;justify-content:space-between;padding:9px 18px;border:1px solid var(--color-sheet-line);border-radius:999px;background:var(--color-sheet);color:var(--color-sheet-ink);cursor:pointer;text-align:right}.favorite-collection-choice span{min-width:max-content;color:var(--color-sheet-muted);font-size:.58rem}.favorite-collection-choice.active{border-color:var(--color-sheet-plum);background:var(--color-sheet-plum);color:var(--color-sheet)}.favorite-collection-choice.active span{color:var(--color-sheet)}.favorite-empty{margin:0 0 4px;padding:18px 26px;border:0;border-radius:18px;background:var(--color-sheet-soft);color:var(--color-sheet-muted);font-size:.65rem;text-align:center}
.favorite-sheet-action,.favorite-edit-action{width:100%;min-height:52px;margin-top:10px;border-radius:999px;font:inherit;font-weight:700;white-space:nowrap;cursor:pointer}.favorite-sheet-action{border:1px solid var(--color-action);background:var(--color-action);color:var(--color-action-ink)}.favorite-edit-action{border:1px solid var(--color-sheet-line);background:var(--color-sheet-soft);color:var(--color-sheet-plum)}
.create-favorite-form{margin-top:12px;padding:14px;border:1px solid var(--color-sheet-line);border-radius:20px}.create-favorite-form label{display:block;margin-bottom:6px;color:var(--color-action);font-size:.62rem;font-weight:700}.create-favorite-form>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.create-favorite-form input{min-width:0;height:48px;padding:0 12px;border:1px solid var(--color-sheet-line);border-radius:14px;background:var(--color-sheet);color:var(--color-action);font:inherit}.create-favorite-form button{min-height:48px;padding:0 16px;border:1px solid var(--color-action);border-radius:14px;background:var(--color-action);color:var(--color-action-ink);font:inherit;font-weight:700}
.favorite-edit-choice{display:grid;grid-template-columns:minmax(0,1fr) 46px;gap:8px;padding:8px;border-radius:18px;background:var(--color-sheet-soft)}.favorite-edit-choice>[data-favorite-collection]{min-width:0;min-height:50px;padding:0 16px;border:0;border-radius:14px;background:var(--color-sheet);color:var(--color-sheet-ink);font:inherit;text-align:right;cursor:pointer}.favorite-edit-choice strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.favorite-delete-icon{width:46px;height:46px;align-self:center;display:grid;place-items:center;padding:0;border:1px solid var(--color-sheet-line);border-radius:50%;background:var(--color-sheet);color:var(--color-danger);cursor:pointer}.favorite-delete-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.favorite-editor{display:grid;gap:8px;margin-top:12px;padding:14px;border-radius:20px;background:var(--color-sheet-soft)}.favorite-editor-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px;border-radius:14px;background:var(--color-sheet)}.favorite-editor-row input{min-width:0;height:50px;margin:0;padding:0 14px;border:1px solid var(--color-sheet-line);border-radius:14px;background:var(--color-sheet);color:var(--color-sheet-ink);font:inherit;font-weight:700}.favorite-editor-row button{min-height:50px;padding:0 18px;border:0;border-radius:14px;background:var(--color-accent);color:var(--color-sheet);font:inherit;font-weight:700;white-space:nowrap}
.favorite-sheet [hidden]{display:none!important}.favorite-sheet button:focus-visible,.favorite-sheet input:focus-visible{outline:3px solid var(--color-sheet-plum);outline-offset:2px}.favorite-sheet button:active{transform:scale(.98)}

/* Hallmark · component: reel settings sheet · theme: studied-DNA (Maraya reels) · pre-emit critique: P5 H5 E5 S5 R5 V5 · contrast: pass (40–41) */
.reel-settings-sheet{position:fixed;z-index:32;inset:auto auto max(14px,env(safe-area-inset-bottom)) 50%;width:min(calc(100% - 24px),440px);max-width:none;max-height:min(86svh,700px);margin:0;padding:20px;border:1px solid var(--settings-line);border-radius:28px;background:var(--settings-surface);color:var(--settings-ink);box-shadow:var(--shadow-stage);transform:translateX(-50%);overflow:auto}.reel-settings-sheet::backdrop{background:var(--color-overlay);backdrop-filter:blur(7px)}
.reel-settings-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.reel-settings-head>div{display:grid}.reel-settings-head strong{color:var(--settings-ink);font-size:1rem}.reel-settings-head>button{width:42px;height:42px;padding:0;border:1px solid var(--settings-line);border-radius:50%;background:var(--settings-surface-soft);color:var(--settings-ink);font-size:1.25rem;cursor:pointer}
.reel-settings-links{display:grid;padding:10px 16px;border:1px solid var(--settings-line);border-radius:24px}.reel-settings-links>a,.reel-settings-links>button{width:100%;min-height:66px;display:grid;grid-template-columns:44px minmax(0,1fr) 18px;align-items:center;gap:12px;padding:9px 2px;border:0;border-bottom:1px solid var(--settings-line);border-radius:0;background:transparent;color:var(--settings-ink);font:700 .68rem var(--font-body);text-align:right;text-decoration:none;white-space:nowrap;cursor:pointer}.reel-settings-links>:nth-last-child(2){border-bottom:0}.reel-settings-links i{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--settings-ink);border-radius:13px;font-style:normal}.reel-settings-links i svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reel-settings-links .settings-letter{font-size:1.05rem;font-weight:800}.reel-settings-links span{min-width:0;display:flex;flex-direction:column;align-items:flex-start;line-height:1.45}.reel-settings-links span strong{font-size:.72rem}.reel-settings-links span small{margin-top:2px;color:var(--settings-muted);font-size:.54rem;font-weight:500}.reel-settings-links b{color:var(--settings-muted);font-size:1rem}.reel-settings-links>.reel-settings-logout{color:var(--settings-ink)}.reel-settings-links>.reel-settings-login{min-height:52px;display:flex;justify-content:center;margin-top:14px;border:1px solid var(--settings-ink);border-radius:999px;background:var(--settings-ink);color:var(--settings-surface)}.reel-settings-links>[hidden]{display:none!important}.reel-settings-links>a:hover,.reel-settings-links>button:hover{background:var(--settings-surface-soft)}.reel-settings-links>.reel-settings-login:hover{background:var(--settings-ink);color:var(--settings-surface)}.reel-settings-links>a:focus-visible,.reel-settings-links>button:focus-visible,.reel-settings-head>button:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.reel-settings-links>a:active,.reel-settings-links>button:active,.reel-settings-head>button:active{opacity:.78}.reel-settings-links>a[aria-disabled="true"],.reel-settings-links>button:disabled{opacity:.55;cursor:not-allowed}
.reel-settings-legal{min-height:48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;margin-top:10px;padding-block:12px;color:var(--settings-muted);font:600 .56rem var(--font-body)}.reel-settings-legal a{color:var(--settings-ink);text-decoration:none;white-space:nowrap}.reel-settings-legal a:hover{text-decoration:underline;text-underline-offset:3px}.reel-settings-legal a:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.reel-settings-legal a:active{opacity:.72}

/* All close controls share the monochrome filter-control treatment. */
.reels-shell [aria-label^="إغلاق"]{border:1px solid var(--color-sheet-ink)!important;background:var(--color-sheet)!important;color:var(--color-sheet-ink)!important;box-shadow:none!important}.reels-shell [aria-label^="إغلاق"]:focus-visible{outline:2px solid var(--color-sheet-ink)!important;outline-offset:3px}
.filter-select summary,.filter-select [role="listbox"],.filter-select [data-value]{border-color:var(--color-sheet-line)!important;background:var(--color-sheet)!important;color:var(--color-sheet-ink)!important}.filter-select [data-value]:hover,.filter-select [aria-selected="true"]{background:var(--color-sheet-soft)!important;color:var(--color-sheet-ink)!important}
.live-tryon{position:absolute;z-index:40;inset:0;overflow:hidden;background:var(--color-canvas)}.live-tryon[hidden]{display:none}.live-camera{position:absolute;inset:0;overflow:hidden;background:var(--color-panel)}.live-camera video,.live-camera canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:none}.live-camera canvas{z-index:2;pointer-events:none}
.live-head{position:absolute;z-index:5;top:max(12px,env(safe-area-inset-top));right:14px;left:14px;display:flex;align-items:center;justify-content:space-between;direction:ltr}.live-head>button{width:46px;height:46px;padding:0;border:1px solid var(--color-border);border-radius:50%;background:var(--color-overlay-strong);color:var(--color-ink);font-size:1.45rem;line-height:1;cursor:pointer;backdrop-filter:blur(12px)}.live-head>div{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-overlay);direction:rtl;backdrop-filter:blur(12px)}.live-head strong{font-size:.62rem;white-space:nowrap}.live-dot{width:8px;height:8px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--color-accent) 22%,transparent);animation:live-pulse 1.4s ease-in-out infinite}@keyframes live-pulse{50%{opacity:.45}}
.live-guide{position:absolute;z-index:4;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;padding:28px;text-align:center;background:var(--color-overlay-strong);backdrop-filter:blur(7px)}.live-guide.is-ready{pointer-events:none;background:transparent;backdrop-filter:none}.live-guide.is-ready>*{opacity:0}.live-guide strong{font-size:1rem}.live-guide span{color:var(--color-muted);font-size:.62rem}.live-guide button{min-width:168px;min-height:52px;margin-top:12px;padding:0 22px;border:0;border-radius:var(--radius-control);background:var(--color-accent);color:var(--color-canvas);font-weight:700;cursor:pointer}
.live-product-card{position:absolute;z-index:5;right:18px;bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px));left:18px;min-height:112px;display:grid;grid-template-columns:50px minmax(0,1fr) 50px;align-items:center;gap:8px;padding:12px;border:1px solid var(--color-border-strong);border-radius:24px;background:var(--color-glass);box-shadow:var(--shadow-hud);backdrop-filter:blur(18px) saturate(1.12);-webkit-backdrop-filter:blur(18px) saturate(1.12)}.live-product-card>button{width:46px;height:46px;padding:0;border:1px solid var(--color-border);border-radius:16px;background:var(--color-panel);color:var(--color-ink);font-size:1.7rem;cursor:pointer}.live-product-card>div{min-width:0;display:grid;justify-items:center;text-align:center}.live-product-card small{color:var(--color-muted);font-size:.5rem}.live-product-card strong{max-width:100%;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}.live-product-card span{margin-top:2px;font-size:.7rem;font-weight:700}.live-status{position:absolute;z-index:6;right:70px;bottom:148px;left:70px;margin:0;padding:8px 12px;border-radius:var(--radius-control);background:var(--color-overlay);color:var(--color-muted);font-size:.5rem;text-align:center;backdrop-filter:blur(10px)}.live-status.is-error{color:var(--color-danger)}
.live-head button:focus-visible,.live-guide button:focus-visible,.live-product-card button:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.live-head button:active,.live-guide button:active,.live-product-card button:active{transform:scale(.95)}@media (max-width:374px){.live-product-card{right:12px;left:12px}.live-status{right:42px;left:42px}}@media (prefers-reduced-motion:reduce){.live-dot{animation:none}}

/* 0069 · reel navigation */
.reel-quick-actions{position:absolute;z-index:10;top:max(12px,env(safe-area-inset-top));left:12px;display:flex;gap:8px;direction:ltr}.reel-quick-actions a{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--color-border-strong);border-radius:50%;background:var(--color-overlay-strong);color:var(--color-ink);box-shadow:var(--shadow-hud);backdrop-filter:blur(12px)}.reel-quick-actions svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.reel-quick-actions a:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}
.reel-quick-actions a[aria-label="السلة"]{position:relative}.reel-cart-count{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;display:grid;place-items:center;padding:0 5px;border:2px solid var(--color-canvas);border-radius:999px;background:#111;color:#fff;font:800 .52rem var(--font-body);line-height:1}.reel-cart-count[hidden]{display:none}
.reels-shell [data-reel-auth][hidden],.reels-shell [data-reel-guest][hidden]{display:none!important}
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V4 */
.discount-companion{top:calc(46px + var(--space-2));right:106px;text-decoration:none}.discount-companion svg{fill:none;stroke:currentColor;stroke-width:2.4}.store-companion{top:calc(46px + var(--space-2));right:158px;text-decoration:none}.rail-nav.show-explore-options .grid-companion,.rail-nav.show-explore-options .discount-companion,.rail-nav.show-explore-options .store-companion{opacity:1;pointer-events:auto;transform:none}
.groups-companion{top:108px;right:54px;text-decoration:none}.rail-nav.show-looks-options .groups-companion{opacity:1;pointer-events:auto;transform:none}
.groups-companion{position:absolute}.reel-alert-dot{position:absolute;top:1px;right:1px;width:11px;height:11px;border:2px solid var(--color-canvas);border-radius:50%;background:var(--color-danger);pointer-events:none}
@media (hover:hover) and (pointer:fine){.grid-companion,.discount-companion,.store-companion{opacity:1;pointer-events:auto;transform:none}}

/* 0064 · final cascade for progressive filters */
.grid-card-copy .compact-sizes{display:grid;justify-items:start;gap:5px}.grid-card-copy .compact-sizes .more-sizes{border:0;padding:0;color:var(--color-muted);font-size:.5rem;white-space:nowrap}
.audience-step{display:grid;gap:14px;padding:16px;border:1px solid var(--color-border);border-radius:22px;background:var(--color-panel-raised)}.audience-step>strong{font-size:.78rem}.audience-step>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.audience-step button{min-width:0;min-height:50px;border:1px solid var(--color-border-strong);border-radius:999px;background:var(--color-panel);color:var(--color-ink);font-weight:700;white-space:nowrap}.audience-step button.active{border-color:var(--color-ink);background:var(--color-ink);color:var(--color-canvas)}
.coordination-fields{display:grid;gap:var(--space-2);margin-top:var(--space-2)}.coordination-fields[hidden]{display:none}.filter-field{display:grid;grid-template-columns:78px minmax(0,1fr);align-items:start;gap:var(--space-2);min-height:64px;padding:10px 14px;border:1px solid var(--color-border);border-radius:18px;background:var(--color-panel-raised)}.filter-field>span{padding-top:12px;color:var(--color-muted);font-size:.62rem}.filter-select{position:relative;min-width:0}.filter-select summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-panel);color:var(--color-ink);cursor:pointer;list-style:none}.filter-select summary::-webkit-details-marker{display:none}.filter-select summary b{font-size:.68rem}.filter-select summary i{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px)}.filter-select[open] summary i{transform:rotate(225deg) translateY(-2px)}.filter-select [role="listbox"]{position:relative;z-index:2;display:grid;gap:4px;margin-top:6px;padding:6px;border:1px solid var(--color-border);border-radius:14px;background:var(--color-panel);box-shadow:var(--shadow-hud)}.filter-select [data-value]{min-height:42px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:var(--color-ink);text-align:right}.filter-select [aria-selected="true"]{background:var(--color-ink);color:var(--color-canvas)}
.confirm-coordination{width:100%;min-height:52px;margin-top:var(--space-3);border:1px solid var(--color-ink);border-radius:var(--radius-control);background:var(--color-ink);color:var(--color-canvas);font-weight:700;cursor:pointer}.confirm-coordination:focus-visible,.audience-step button:focus-visible,.filter-select summary:focus-visible,.filter-select button:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.confirm-coordination:active,.audience-step button:active,.filter-select button:active{transform:scale(.98)}#coordination-details[hidden]+.confirm-coordination{display:none}

/* Hallmark · component: persistent reel controls and compact filters · genre: atmospheric · theme: Maraya
 * states: default · hover · focus · active · disabled · loading · error · success
 * pre-emit critique: P5 H5 E5 S5 R5 V5 · contrast: pass (40–41)
 */
.rail-nav{right:max(8px,env(safe-area-inset-right));gap:8px}
.coordination-panel{z-index:20}
.rail-action{width:50px;height:50px;padding-inline:14px;transition:background-color .18s ease,border-color .18s ease,color .18s ease,opacity .18s ease,transform .18s ease}
.rail-action.is-revealed{width:50px}.rail-action.is-revealed span{opacity:0;transform:none}
.rail-nav.is-expanded>.rail-action{opacity:1;pointer-events:auto;transform:none}
.rail-nav.is-expanded .rail-companion{opacity:1;pointer-events:auto;transform:none}
.rail-companion{width:48px;height:48px;right:58px}
.filter-companion{top:1px}.grid-companion{top:58px}.discount-companion{top:58px;right:114px}.store-companion{top:58px;right:170px}.groups-companion{top:116px;right:58px}
.rail-action:disabled,.rail-companion:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.rail-action[aria-busy="true"],.rail-companion[aria-busy="true"]{cursor:progress;opacity:.68}
.rail-action[data-state="error"],.rail-companion[data-state="error"]{border-color:var(--color-danger)}
.rail-action[data-state="success"],.rail-companion[data-state="success"]{border-color:var(--color-focus)}
.audience-step{gap:12px;padding:0;border:0;border-radius:0;background:transparent}
.audience-step-heading{display:flex!important;grid-template-columns:none!important;align-items:center;justify-content:space-between;gap:12px}
.audience-step-heading>strong{font-size:.76rem}
.audience-filter-mark{width:44px;height:44px;display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--color-sheet-line);border-radius:14px;background:var(--color-sheet);color:var(--color-sheet-ink)}
.audience-filter-mark svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.audience-step>div:last-of-type{gap:8px}
.audience-step button{min-height:46px;border-color:var(--color-sheet-line);background:var(--color-sheet);color:var(--color-sheet-ink)}
.audience-step button:hover{border-color:var(--color-sheet-ink);background:var(--color-sheet-soft)}
.audience-step button.active{border-color:var(--color-sheet-ink);background:var(--color-sheet-ink);color:var(--color-sheet)}
.coordination-fields{gap:0;margin-top:14px;border-top:1px solid var(--color-border)}
.filter-field{display:flex;grid-template-columns:none;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:2px 4px;border:0;border-bottom:1px solid var(--color-border);border-radius:0;background:transparent}
.filter-field>span{padding:0;color:var(--color-ink);font-size:.68rem;font-weight:700}
.filter-select{min-width:92px}
.filter-select summary{min-height:46px;justify-content:flex-start;gap:10px;padding:0 4px;border:0!important;border-radius:0;background:transparent!important;color:var(--color-ink)!important}
.filter-select summary b{color:inherit;font-size:.66rem;font-weight:600}
.filter-select [role="listbox"]{min-width:176px;margin-top:4px;border-color:var(--color-sheet-line)!important;background:var(--color-sheet)!important}
.filter-select [data-value]{background:transparent!important;color:var(--color-sheet-ink)!important}
.filter-select [data-value]:hover,.filter-select [aria-selected="true"]{background:var(--color-sheet-soft)!important;color:var(--color-sheet-ink)!important}
.audience-step-heading{justify-content:flex-start}
.filter-field:has(.filter-select[open]){display:grid;grid-template-columns:minmax(0,1fr);align-items:start;gap:7px;padding-top:10px;padding-bottom:12px}
.filter-field:has(.filter-select[open])>span{grid-column:1;grid-row:1;padding-inline:4px}
.filter-field:has(.filter-select[open])>.filter-select{grid-column:1;grid-row:2;width:100%;min-width:0}
.filter-field:has(.filter-select[open]) .filter-select summary{width:100%;min-height:44px;justify-content:space-between;padding-inline:12px;border:1px solid var(--color-sheet-line)!important;border-radius:12px;background:var(--color-sheet)!important}
.filter-field:has(.filter-select[open]) .filter-select [role="listbox"]{width:100%;min-width:0;grid-template-columns:minmax(0,1fr);margin-top:7px;padding:7px}
.filter-field:has(.filter-select[open]) .filter-select [data-value]{width:100%;min-height:46px;text-align:right}
@media(max-width:374px){.rail-action,.rail-action.is-revealed{width:46px;height:46px;padding-inline:12px}.rail-companion{width:44px;height:44px;right:54px}.grid-companion{top:54px}.discount-companion{top:54px;right:106px}.store-companion{top:54px;right:158px}.groups-companion{top:108px;right:54px}}

/* Hallmark · component: mobile product-card typography · genre: atmospheric · theme: Maraya
 * states: default · hover · focus · active · disabled · loading · error · success
 * pre-emit critique: P5 H5 E5 S5 R5 V5 · contrast: pass (40–41) · mobile: pass
 */
.grid-card-copy{min-height:124px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px;padding:12px}
.grid-card-copy>div{min-width:0}
.grid-card-copy small{font-size:.75rem;line-height:1.5}
.grid-card-copy strong{margin-top:4px;font-size:.92rem;line-height:1.45}
.grid-card-copy b{margin-top:5px;font-size:.86rem;line-height:1.35;font-variant-numeric:tabular-nums}
.grid-card-copy .product-sizes{max-width:52px}
.grid-card-copy .product-sizes span{min-width:30px;min-height:26px;padding:2px 7px;font-size:.68rem}
.grid-card-copy .compact-sizes .more-sizes{font-size:.68rem;line-height:1.4}
@media(max-width:374px){.grid-card-copy{min-height:120px;gap:7px;padding:10px 9px}.grid-card-copy small{font-size:.7rem}.grid-card-copy strong{font-size:.88rem}.grid-card-copy b{font-size:.82rem}.grid-card-copy .product-sizes span,.grid-card-copy .compact-sizes .more-sizes{font-size:.66rem}}
.reel-settings-links>.reel-settings-logout{border-bottom:0}

/* Buyer settings: icon-free rows, matching the latest settings direction. */
.reel-settings-links{padding:0 20px;border:0;border-radius:0}
.reel-settings-links>a,.reel-settings-links>button{min-height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 4px;border:0;border-bottom:1px solid var(--settings-line);background:transparent;color:var(--settings-ink);font:700 16px/1.5 var(--font-body);text-decoration:none;text-align:right}
.reel-settings-links>a>span,.reel-settings-links>button>span{display:block;width:auto;color:inherit;font:inherit}
.reel-settings-links>button>small{margin-inline-start:auto;color:var(--settings-muted);font:500 14px/1.5 var(--font-body)}
.reel-settings-links>.reel-settings-login{margin-top:18px;border:1px solid var(--settings-ink);border-radius:999px}
/* Compact shared row: sizes left, gallery center, description right. */
.reel-hud{display:grid;grid-template-columns:96px minmax(0,1fr) 96px;grid-template-rows:auto auto auto;direction:ltr;row-gap:4px;padding-top:12px;padding-bottom:32px}
.reel-hud .reel-copy{display:contents;direction:rtl}
.reel-hud .reel-identity{grid-column:1/-1;grid-row:1;direction:rtl;text-align:right}
.reel-copy>.product-description-button{grid-column:3;grid-row:2;justify-self:end;align-self:center}
.reel-copy .reel-size-picker{grid-column:1;grid-row:2;align-self:center;width:96px;min-width:0;position:relative;text-align:center}
.reel-copy .reel-size-picker .product-sizes{display:grid;grid-template-columns:repeat(2,44px);grid-auto-rows:44px;gap:8px;width:96px;height:44px;max-width:100%;margin:0;padding:0;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none}
.reel-copy .reel-size-picker .product-sizes::-webkit-scrollbar{display:none}
.reel-copy .reel-size-picker .product-sizes button{box-sizing:border-box;flex:0 0 44px;width:44px;height:44px;min-width:44px;scroll-snap-align:start}
.reel-size-picker .reel-size-hint{position:absolute;left:50%;top:100%;transform:translateX(-50%);display:block;margin:2px 0 0;font-size:14px;line-height:1;font-weight:500;pointer-events:none}
/* Gallery dots participate in the HUD flow, so expanding Live lifts them too. */
.reel-hud>.product-gallery-dots{grid-column:2;grid-row:2;align-self:center;position:static;transform:none;justify-content:center;margin:0;min-height:24px;gap:4px;direction:rtl}
.reel-hud>.product-gallery-dots button{width:24px;height:24px}
.reel-hud>.reel-capture-settings{grid-column:1/-1;grid-row:3;width:100%;direction:rtl}

/* Two visible size choices, stacked and independently scrollable. */
.reel-hud{grid-template-columns:44px minmax(0,1fr) 44px;column-gap:12px}
.reel-hud .reel-identity{grid-column:2/-1}
.reel-copy .reel-size-picker{grid-column:1;grid-row:1/3;width:44px;align-self:end}
.reel-copy .reel-size-picker .product-sizes{grid-template-columns:44px;width:44px;height:96px;max-height:96px;align-content:start}
.reel-copy .reel-size-picker[hidden]{display:none!important}
.product-reel.is-product-fullview .reel-hud{visibility:hidden!important;opacity:0!important;pointer-events:none!important}
.product-reel>img{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.product-reel>img:focus-visible{outline:2px solid var(--app-brand,#4b2142);outline-offset:-4px}

/* Pagination is separate from the HUD and remains available in full-image mode. */
.product-reel>.product-gallery-dots{position:absolute;bottom:var(--gallery-dots-bottom,300px);left:50%;right:auto;transform:translateX(-50%);display:flex;gap:0;min-height:44px;align-items:center;justify-content:center}
.product-reel>.product-gallery-dots button{width:44px;height:44px;flex:0 0 44px}
.product-reel.is-product-fullview>.product-gallery-dots{bottom:max(16px,env(safe-area-inset-bottom));visibility:visible!important;opacity:1!important;pointer-events:auto!important}
.reel-variants{grid-column:1;grid-row:1/3;display:flex;gap:8px;align-self:end;direction:ltr}
.reel-copy .reel-variants .reel-size-picker{position:static;flex:0 0 44px;width:44px}
.has-product-colors .reel-hud{grid-template-columns:96px minmax(0,1fr) 44px}
.reel-color-picker{display:grid;grid-template-columns:44px;grid-auto-rows:44px;gap:8px;flex:0 0 44px;width:44px;height:96px;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none}
.reel-color-picker::-webkit-scrollbar{display:none}
.reel-color-picker button{display:grid;place-items:center;box-sizing:border-box;min-width:44px;width:44px;height:44px;padding:5px;border:1px solid var(--color-border-strong);border-radius:50%;background:var(--color-panel);scroll-snap-align:start}
.reel-color-picker button span{display:block;width:30px;height:30px;border-radius:50%;background:var(--swatch);border:1px solid #0003}
.reel-color-picker button[aria-pressed="true"]{border:2px solid var(--color-ink)}
.reel-color-picker button:focus-visible{outline:2px solid var(--color-focus);outline-offset:-2px}

.reel-identity>strong,.grid-card-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;overflow-wrap:normal}
.reel-identity{overflow:hidden}

/* Two compact picker wheels; the center row is selected, like a time picker. */
.reel-variants{position:relative;height:132px;align-self:center;gap:4px}
.reel-variants::before,.reel-variants:has(.reel-size-picker):has(.reel-color-picker)::after{content:"";position:absolute;top:44px;left:0;width:48px;height:44px;border-radius:12px;background:rgba(128,128,128,.14);pointer-events:none}
.reel-variants:has(.reel-size-picker):has(.reel-color-picker)::after{left:auto;right:0}
.reel-copy .reel-variants .reel-size-picker{width:48px;flex-basis:48px;height:132px;overflow:visible}
.has-product-colors .reel-hud{grid-template-columns:100px minmax(0,1fr) 44px}
.reel-color-picker.variant-wheel{flex:0 0 48px}
.reel-variants .variant-wheel{box-sizing:border-box;display:flex!important;flex-direction:column;flex-wrap:nowrap!important;gap:0!important;width:48px!important;height:132px!important;min-height:0;max-height:132px!important;padding:44px 0!important;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none;-webkit-mask-image:linear-gradient(transparent,#000 35%,#000 65%,transparent);mask-image:linear-gradient(transparent,#000 35%,#000 65%,transparent)}
.reel-variants .variant-wheel::-webkit-scrollbar{display:none}
.reel-copy .variant-wheel button,.reel-color-picker.variant-wheel button{box-sizing:border-box;flex:0 0 44px!important;width:48px!important;min-width:48px!important;height:44px!important;min-height:44px!important;margin:0!important;padding:6px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--color-ink)!important;font:400 20px/1 var(--font-body);scroll-snap-align:center!important;scroll-snap-stop:always;user-select:none}
.reel-copy .variant-wheel button[aria-pressed="true"],.reel-color-picker.variant-wheel button[aria-pressed="true"]{font-weight:600;box-shadow:none}
.reel-color-picker.variant-wheel button span{width:28px;height:28px;border:1px solid var(--color-border-strong)}
.reel-color-picker.variant-wheel button[aria-pressed="true"] span{outline:2px solid var(--color-ink);outline-offset:2px}
#uploaded-video-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#111;z-index:2}
#uploaded-media-tabs{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:5;background:white;border-radius:30px;padding:6px}
#uploaded-media-tabs button{border:0;border-radius:24px;padding:10px 24px;background:white;color:#211d21;cursor:pointer}
#uploaded-media-tabs button[aria-pressed="true"]{background:#211d21;color:white}
#uploaded-media-tabs button:disabled{opacity:.35;cursor:default}
#uploaded-media-tabs[hidden],#uploaded-video-preview[hidden]{display:none!important}
#uploaded-media-tabs{display:none!important}
#upload-status:empty{display:none}
#upload-stage:has(#uploaded-video-preview:not([hidden])) #upload-status:not(:empty){z-index:6;background:#fff;padding:12px;border-radius:12px}