@font-face { font-family:"Manrope"; src:url("/assets/manrope-variable.woff2") format("woff2"); font-weight:200 800; font-style:normal; font-display:swap; }
.bottom-nav a[hidden] { display:none; }
.catalog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-2); }
.catalog-card { position:relative; min-width:0; padding:0 0 14px; overflow:hidden; }
.catalog-card h2,.catalog-card .catalog-price { margin-left:14px; margin-right:14px; }
.catalog-card .catalog-photo-frame { border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.catalog-card h2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:12px 14px 0; font-size:16px; line-height:22px; font-weight:500; overflow-wrap:anywhere; }
.catalog-card-open { position:absolute; inset:0; width:100%; border:0; border-radius:var(--radius-lg); background:transparent; cursor:pointer; }
.catalog-card .catalog-photo-retry { position:relative; z-index:1; }
.catalog-photo-frame { display:grid; place-items:center; position:relative; aspect-ratio:1; min-width:0; border-radius:var(--radius); background:var(--surface-2); overflow:hidden; }
.catalog-photo-frame p { padding:8px; text-align:center; font-size:14px; line-height:20px; color:var(--muted); }
.catalog-photo { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.catalog-loading { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:160px; color:var(--muted); font-size:13px; line-height:20px; font-weight:400; }
#catalog-status > .catalog-loading,#catalog-product-status > .catalog-loading { min-height:45dvh; }
#catalog-status:empty,#catalog-product-status:empty { display:none; }
.session-status { display:grid; place-items:center; min-height:45dvh; text-align:center; }
.session-status[hidden] { display:none; }
.session-status h2 { margin:0 0 12px; font-size:20px; line-height:26px; }
.session-status p { max-width:32ch; margin:0 auto 24px; color:var(--muted); font-size:14px; line-height:22px; }
.catalog-photo-ready { animation:catalog-reveal 100ms ease-out; }
.catalog-gallery { display:flex; position:relative; gap:12px; min-width:0; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
.catalog-gallery::-webkit-scrollbar { display:none; }
.catalog-gallery > .catalog-photo-frame { flex:0 0 100%; scroll-snap-align:start; scroll-snap-stop:always; }
.catalog-photo-open { width:100%; height:100%; min-height:44px; padding:0; border:0; border-radius:var(--radius); background:transparent; cursor:zoom-in; }
.catalog-gallery-controls { display:flex; align-items:center; justify-content:center; gap:16px; margin:14px 0 16px; color:var(--muted); font-size:13px; line-height:20px; }
.catalog-gallery-controls[hidden] { display:none; }
.catalog-gallery-controls .catalog-gallery-arrow { display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:10px; border-radius:50%; color:var(--muted); }
.catalog-gallery-arrow .icon { width:20px; height:20px; }
#catalog-photo-dialog { position:fixed; inset:0; width:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; background:transparent; color:var(--muted); }
#catalog-photo-dialog::backdrop { background:rgba(7,5,10,.6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
#catalog-photo-content { display:grid; place-items:center; width:100%; height:100%; padding:calc(8px + var(--app-safe-top)) 8px calc(8px + env(safe-area-inset-bottom)); }
#catalog-photo-content img { display:block; max-width:100%; max-height:calc(100dvh - 16px - var(--app-safe-top) - env(safe-area-inset-bottom)); object-fit:contain; }
[data-close-catalog-photo] { position:absolute; top:calc(8px + var(--app-safe-top)); right:calc(8px + env(safe-area-inset-right)); display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:10px; border:0; background:transparent; color:var(--muted); cursor:pointer; }
[data-close-catalog-photo] .icon { width:24px; height:24px; }
body.catalog-photo-modal { overflow:hidden; }
.catalog-dialog { width:min(calc(100% - 32px),320px); max-height:calc(100dvh - 32px); overflow-y:auto; padding:20px; border:1px solid var(--line); border-radius:var(--radius); color:var(--text); background:var(--surface); overflow-wrap:anywhere; }
.catalog-dialog::backdrop { background:rgba(7,5,10,.6); }
.catalog-dialog h2 { font-size:18px; line-height:24px; }
.catalog-dialog button { min-height:44px; width:100%; margin-top:8px; white-space:normal; }
#catalog-product h1,#catalog-order-title,.catalog-detail-price { max-width:100%; overflow-wrap:anywhere; }
@media (prefers-reduced-motion:reduce) { .catalog-gallery { scroll-snap-type:none; } .catalog-photo-ready,.catalog-screen-ready { animation:none; } }
@media (forced-colors:active) { .catalog-card,.catalog-sizes label,.catalog-dialog,.catalog-gallery-arrow { border:1px solid CanvasText; } .catalog-sizes label:has(input:checked) { border:2px solid Highlight; } .catalog-gallery-arrow:disabled,[data-route^="catalog"] button:disabled { color:GrayText; opacity:1; } }
.catalog-price { margin:10px 0 0; font-size:16px; line-height:22px; font-weight:700; overflow-wrap:anywhere; }
.catalog-card .catalog-price { margin-top:4px; }
.catalog-sale-old,.catalog-sale-price { display:block; max-width:100%; min-width:0; overflow-wrap:anywhere; }
.catalog-sale-old { color:var(--muted); font-size:14px; line-height:20px; font-weight:400; }
.catalog-sale-price { color:#FF7A92; font-size:16px; line-height:22px; font-weight:700; }
.catalog-card .catalog-price:has(.catalog-sale-price) { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; }
.catalog-card .catalog-sale-price { order:-1; }
#catalog-product-price:has(.catalog-sale-price),#catalog-order-price:has(.catalog-sale-price) { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
#catalog-product-price .catalog-sale-price,#catalog-order-price .catalog-sale-price { order:-1; font-size:24px; line-height:30px; }
.catalog-price-row .catalog-sale-old { font-size:16px; line-height:24px; }
.catalog-sale-timer { margin:4px 0 0; max-width:100%; min-width:0; color:var(--muted); font-size:14px; line-height:20px; font-weight:400; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.catalog-sale-timer[hidden] { display:none; }
.catalog-card .catalog-sale-timer { margin-left:14px; margin-right:14px; }
.catalog-card .catalog-sale-timer:not([hidden]) { display:flex; align-items:center; gap:6px; }
.catalog-price-row .catalog-sale-timer:not([hidden]) { display:flex; align-items:center; gap:8px; margin-top:10px; font-size:16px; line-height:24px; }
.catalog-card .catalog-sale-timer::before,.catalog-price-row .catalog-sale-timer::before { content:""; flex:0 0 16px; height:16px; background:currentColor; --sale-clock-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); -webkit-mask:var(--sale-clock-icon) center/contain no-repeat; mask:var(--sale-clock-icon) center/contain no-repeat; }
.catalog-order-mode .delivery-note { display:none; }
#catalog-form-delivery { white-space:normal; overflow-wrap:anywhere; text-align:center; }
@media (forced-colors:active) { .catalog-sale-price,.catalog-sale-old { color:CanvasText; } }
.catalog-price-error { color:var(--muted); font-size:14px; line-height:20px; }
.catalog-description { margin:8px 0 0; white-space:pre-wrap; overflow-wrap:anywhere; font-size:15px; line-height:24px; font-weight:400; color:var(--muted); }
.catalog-description-section { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
.catalog-description-section h2 { margin:0; font-size:16px; line-height:24px; }
.catalog-price-row { margin:8px 0 24px; }
.catalog-detail-price { font-size:20px; line-height:24px; font-weight:700; margin:0; }
.catalog-delivery { margin:8px 0 0; color:var(--muted); font-size:11px; line-height:16px; font-weight:400; white-space:nowrap; }
#catalog-product .catalog-price-row { margin-top:12px; }
#catalog-order-delivery { margin-top:12px; text-align:center; }
.catalog-sizes { padding:0; border:0; margin:24px 0; display:flex; flex-wrap:wrap; gap:8px; }
.catalog-sizes legend { margin-bottom:8px; }
.catalog-sizes label { margin:0; min-width:52px; min-height:44px; padding:10px; border:1px solid var(--line); border-radius:10px; font-size:14px; }
.catalog-sizes label:has(input:checked) { border:2px solid var(--accent-2); padding:9px; }
.catalog-sizes label { position:relative; display:flex; align-items:center; justify-content:center; }
.catalog-sizes input { position:absolute; width:1px; height:1px; padding:0; margin:0; opacity:0; }
.catalog-sizes input:focus-visible { outline:none; }
#catalog-more,#catalog-retry,#catalog-product-retry,.catalog-photo-retry { min-height:44px; margin-top:16px; }
.catalog-screen-loading #catalog-list,.catalog-screen-loading #catalog-product { visibility:hidden; }
.catalog-screen-ready { animation:catalog-reveal 100ms ease-out; }
@keyframes catalog-reveal { from { opacity:0; } to { opacity:1; } }
.buyer-catalog-enabled .shell { padding-bottom:calc(var(--buyer-nav-height,84px) + 24px + env(safe-area-inset-bottom)); }
.buyer-catalog-enabled .bottom-nav a { flex:1 1 0; min-width:0; min-height:44px; white-space:normal; overflow-wrap:anywhere; line-height:16px; }
.buyer-catalog-enabled .bottom-nav .icon { flex:none; }
.buyer-catalog-enabled.buyer-keyboard .bottom-nav { position:static; width:100%; transform:none; padding-bottom:10px; }
.buyer-catalog-enabled.buyer-keyboard .shell { padding-bottom:calc(24px + env(safe-area-inset-bottom)); }
.buyer-catalog-enabled #order-form input:not([type="radio"]):not([type="checkbox"]),.buyer-catalog-enabled #order-form textarea,.buyer-catalog-enabled #order-form > button { min-height:52px; }
.buyer-catalog-enabled #order-form,.buyer-catalog-enabled .order-row,.buyer-catalog-enabled .detail { min-width:0; overflow-wrap:anywhere; }
.buyer-catalog-enabled #order-form input,.buyer-catalog-enabled #order-form textarea { min-width:0; scroll-margin-block:24px; }
.buyer-catalog-enabled #order-form label { overflow-wrap:anywhere; }
#order-form.catalog-order-mode label { font-size:16px; }
[data-route="new-order"] .back-link { margin-bottom:4px; }
[data-route="new-order"] h1 { max-width:none; margin:4px 0 16px; font-size:26px; line-height:32px; letter-spacing:-.035em; }
#catalog-product #catalog-product-title,#catalog-order-title { max-width:none; margin:16px 0 0; font-size:22px; line-height:28px; letter-spacing:-.02em; }
#catalog-product #catalog-product-title { font-weight:600; }
#catalog-order-size { margin:20px 0 16px; }
#catalog-order-size legend { font-size:16px; line-height:24px; font-weight:800; }
#catalog-order-price { margin:0; font-size:20px; line-height:24px; font-weight:700; color:var(--text); }
#catalog-order-price.catalog-price-error { font-size:14px; line-height:20px; font-weight:400; color:var(--muted); }
#order-form.catalog-order-mode .delivery-note { display:none; }
#order-form > label,#order-form .reveal-inner > label:not(.checkbox-card),#order-form #address-field > label { display:block; margin:24px 0 8px; }
#order-form > label { margin-bottom:2px; }
#order-form .field-error:empty { display:none; }
#order-form .field-error:not(:empty) { display:flex; align-items:flex-start; gap:8px; margin:8px 0 4px; line-height:20px; }
#order-form .field-error:not(:empty)::before { content:"!"; display:inline-grid; place-items:center; flex:none; width:18px; height:18px; margin-top:1px; border:1.5px solid currentColor; border-radius:50%; font-size:12px; line-height:16px; font-weight:800; }
#order-form [aria-invalid="true"] { border-color:var(--danger); }
#order-form > button[type="submit"] { margin-top:24px; }
#order-form label:not(.radio-card):not(.checkbox-card) > span { color:var(--muted); font-size:12px; line-height:18px; font-weight:400; }
#order-form .radio-card-caption { color:var(--muted); font-size:12px; line-height:18px; font-weight:400; }
#order-form .checkbox-card { margin-top:24px; }
#order-form .checkbox-card > span { color:var(--muted); font-size:14px; line-height:20px; font-weight:400; }
.buyer-catalog-enabled [data-route="catalog-product"] .back-link,.buyer-catalog-enabled [data-route="new-order"] .back-link { min-height:44px; }
.buyer-catalog-enabled #order-form button,.buyer-catalog-enabled [data-route^="catalog"] button { min-width:44px; white-space:normal; }
.buyer-catalog-enabled .order-photo button { min-height:44px; }
.buyer-catalog-enabled .order-photo figcaption,.buyer-catalog-enabled .timeline li,.buyer-catalog-enabled #catalog-order-title { overflow-wrap:anywhere; }
.buyer-catalog-enabled .catalog-sizes label:has(input:focus-visible) { outline:2px solid var(--accent-2); outline-offset:3px; }
.buyer-catalog-enabled .catalog-sizes input { min-height:0; }
.buyer-catalog-enabled button:disabled { cursor:default; }
:root { --app-safe-top:calc(max(env(safe-area-inset-top,0px),var(--tg-safe-area-inset-top,0px)) + var(--tg-content-safe-area-inset-top,0px)); --ink:#07050A; --surface:#100C15; --surface-2:#191220; --line:#34263E; --text:#F5EFFA; --muted:#B8ADC2; --accent:#6F3DFF; --accent-2:#A88BFF; --danger:#FF7A92; --success:#66D6A3; --premium:#E8C468; --radius:14px; --space-1:8px; --space-2:16px; --space-3:24px; --control-height:52px; --motion:160ms; --surface-glass:rgba(245,239,250,0.045); --surface-glass-border:rgba(245,239,250,0.08); --accent-tint:rgba(111,61,255,0.07); --accent-border-strong:rgba(111,61,255,0.46); --radius-lg:18px; font-family:"Manrope","Helvetica Neue",Arial,sans-serif; color:var(--text); background:var(--ink); overscroll-behavior-y:none; }
* { box-sizing:border-box; } body { margin:0; min-width:0; background:var(--ink); overscroll-behavior-y:none; } button,input,textarea { font:inherit; } button,a { -webkit-tap-highlight-color:transparent; } a { color:inherit; } .shell { width:min(100%,560px); min-height:100dvh; margin:auto; padding:calc(16px + var(--app-safe-top)) 16px calc(84px + env(safe-area-inset-bottom)); }
.topbar { display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); padding-bottom:15px; } .brand { display:flex; align-items:center; gap:10px; text-decoration:none; } .brand img { display:block; width:42px; height:42px; object-fit:contain; } .brand-tagline { font-family:-apple-system,BlinkMacSystemFont,"San Francisco","Helvetica Neue",Arial,sans-serif; font-size:13.5px; font-weight:400; font-style:normal; letter-spacing:.01em; color:var(--muted); } .eyebrow { font-size:11px; font-weight:800; letter-spacing:.13em; } .eyebrow,.lead,label span { color:var(--muted); }
main { padding:16px 0 20px; } section[hidden] { display:none; } h1 { max-width:12ch; margin:8px 0 16px; font-size:clamp(30px,8vw,44px); line-height:1.02; letter-spacing:-.06em; } .lead { max-width:32ch; margin:0 0 28px; font-size:16px; line-height:1.5; } .primary,.quiet,.cta { border:0; border-radius:var(--radius); cursor:pointer; font-weight:800; } .primary { width:100%; padding:16px; color:white; background:var(--accent); } .quiet { padding:10px 12px; color:var(--accent-2); background:transparent; border:1px solid var(--line); } .cta { padding:10px 16px; color:#fff; background:var(--accent); white-space:nowrap; } .icon-button { display:inline-flex; align-items:center; gap:6px; } .icon-button .icon { width:16px; height:16px; flex:none; }
.resource-links { display:grid; margin-top:26px; border-top:1px solid var(--line); } .resource-links a { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:15px 0; text-decoration:none; border-bottom:1px solid var(--line); font-weight:700; } .resource-links .icon { flex:none; width:16px; height:16px; color:var(--accent-2); } .profile-credit { margin:16px 0 0; color:var(--muted); text-align:center; font-size:11px; } .profile-credit a { color:inherit; }
form { display:grid; gap:6px; } label { margin-top:10px; font-size:14px; font-weight:800; } input,textarea { width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 14px; color:var(--text); background:var(--surface); } textarea { resize:vertical; } .field-error { min-height:1.2em; margin:0; color:var(--danger); font-size:13px; } .order-estimate { color:var(--success); font-size:16px; font-weight:800; } .detail { display:block; margin-top:22px; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); } .result { display:block; margin-top:10px; color:var(--success); font-size:28px; font-weight:800; } #estimate-caption { margin:6px 0 0; color:var(--muted); font-size:14px; line-height:1.4; } #calculate-order { margin-top:20px; }
.section-heading { display:flex; align-items:start; justify-content:space-between; gap:12px; } .order-list { display:grid; gap:14px; } .order-row { display:grid; gap:8px; width:100%; margin:0; padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); text-align:left; color:var(--text); cursor:pointer; } .order-row strong,.order-row span { display:block; } .order-row .order-row-head { display:flex; align-items:center; justify-content:space-between; gap:10px; } .order-row-head strong { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:18px; } .order-row span,.detail p { color:var(--muted); font-size:14px; line-height:1.45; } .detail > .status { margin:4px 0 6px; } .detail > .status + p { margin-top:6px; } .status { display:inline-block; flex:none; text-transform:uppercase; font-size:11px!important; font-weight:800; letter-spacing:.08em; padding:4px 9px; border-radius:8px; border:1px solid currentColor; }.status--pending { color:var(--accent-2)!important; }.status--success { color:var(--success)!important; }.status--danger { color:var(--danger)!important; }.status--unknown { color:var(--muted)!important; }#detail-title { color:#fff; letter-spacing:-.02em; margin-bottom:20px; }.back-link { display:inline-flex; align-items:center; gap:6px; margin-bottom:12px; padding:4px 2px; color:var(--accent-2); font-weight:800; font-size:14px; text-decoration:none; } .back-link .icon { width:17px; height:17px; }.timeline { margin:20px 0 0; padding:0; list-style:none; }.timeline li { position:relative; padding:0 0 18px 20px; color:var(--muted); }.timeline li::before { content:""; position:absolute; left:0; top:6px; width:8px; height:8px; border-radius:50%; background:var(--accent-2); }.timeline li:not(:last-child)::after { content:""; position:absolute; left:3px; top:14px; bottom:0; width:1px; background:var(--line); }.photos { display:flex; gap:8px; overflow:auto; }.photos img { width:160px; aspect-ratio:1; object-fit:cover; border-radius:10px; }.empty,.partial { color:var(--muted); }.summary { margin-bottom:18px; padding:14px; border:1px solid var(--danger); border-radius:10px; color:var(--danger); background:var(--surface); }
.subscription-gate { padding:22px; margin:22px 0; } .subscription-gate h1 { margin-top:10px; } .subscription-gate .lead { margin-bottom:16px; } .subscription-status { min-height:1.4em; margin:0 0 16px; color:var(--danger); font-size:14px; line-height:1.4; } .subscription-actions { display:grid; gap:10px; } .subscription-actions a { display:block; text-align:center; text-decoration:none; } .subscription-actions .quiet { width:100%; }
.bottom-nav { position:fixed; z-index:2; bottom:0; left:50%; display:flex; width:min(100%,560px); padding:10px 16px calc(10px + env(safe-area-inset-bottom)); transform:translateX(-50%); border-top:1px solid var(--line); background:var(--ink); } .bottom-nav a { display:flex; flex-direction:column; align-items:center; gap:4px; flex:1; padding:9px 4px; color:var(--muted); text-align:center; text-decoration:none; font-size:12px; font-weight:800; } .bottom-nav .icon { width:22px; height:22px; } .bottom-nav a[aria-current="page"] { color:var(--accent-2); }
:focus-visible { outline:3px solid var(--accent-2); outline-offset:3px; } #app:focus-visible { outline:none; } button:disabled { cursor:wait; opacity:.55; } .is-loading { opacity:.65; } [data-state="error"] { color:var(--danger); } @media (min-width:361px) { .shell { padding-left:24px; padding-right:24px; } } @media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } } @media (prefers-contrast:more) { :root { --surface:#000; --surface-2:#000; --line:#fff; --text:#fff; --muted:#fff; --accent:#B9A7FF; --accent-2:#D8D0FF; --danger:#FFB3C1; --success:#9CFFD0; } input,textarea,.detail,.order-row,.summary { border-width:2px; } .result { border:2px solid var(--line); border-radius:var(--radius); padding:10px 14px; } } @media (forced-colors:active) { :root { --accent:Highlight; --text:CanvasText; --surface:Canvas; --line:CanvasText; } input,textarea,.result,.detail,.order-row { forced-color-adjust:auto; } }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.photos { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px; overflow:visible; margin-top:16px; } .order-photo { margin:0; min-width:0; } .order-photo button { width:100%; padding:0; border:0; background:transparent; cursor:zoom-in; } .order-photo img { display:block; width:100%; aspect-ratio:1; object-fit:cover; border-radius:10px; } .order-photo figcaption { margin-top:6px; color:var(--muted); font-size:12px; line-height:1.35; } #photo-viewer { width:min(100% - 32px, 560px); padding:16px; border:1px solid var(--line); border-radius:var(--radius); color:var(--text); background:var(--surface); } #photo-viewer::backdrop { background:rgba(0,0,0,.75); } #photo-viewer-image { display:block; max-width:90vw; max-height:75dvh; margin:14px auto 0; object-fit:contain; } #photo-viewer-caption { margin:10px 0 0; color:var(--muted); }
.glass-card { background:var(--surface-glass); border:1px solid var(--surface-glass-border); border-radius:var(--radius-lg); }
.hero { position:relative; overflow:hidden; padding:20px; margin-bottom:22px; } .hero::before { content:""; position:absolute; top:-60px; right:-60px; width:180px; height:180px; border-radius:50%; background:radial-gradient(circle, var(--accent-tint), transparent 70%); pointer-events:none; } .hero > * { position:relative; } .hero-greeting { margin:10px 0 18px; font-size:20px; font-weight:800; }
.carousel { overflow-x:auto; margin-bottom:10px; scroll-snap-type:x mandatory; } .carousel-track { display:flex; gap:10px; width:max-content; padding-bottom:2px; } .carousel-card { display:flex; align-items:center; gap:10px; scroll-snap-align:start; width:200px; height:92px; padding:0 16px; text-decoration:none; font-size:14px; line-height:1.4; } .carousel-card .icon { flex:none; width:22px; height:22px; color:var(--accent-2); } .carousel-card span { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; } .carousel-dots { display:flex; justify-content:center; gap:6px; margin-bottom:26px; } .carousel-dots span { width:6px; height:6px; border-radius:50%; background:var(--line); transition:background var(--motion),width var(--motion); } .carousel-dots span.is-active { width:16px; border-radius:3px; background:var(--accent-2); }
.section-label { margin:0 0 12px; font-size:20px; font-weight:800; }
.quick-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:20px; } .quick-action { display:grid; grid-template-rows:auto auto auto; align-content:center; min-width:0; height:132px; gap:6px; padding:12px; text-decoration:none; color:var(--text); } .quick-action .icon { width:22px; height:22px; color:var(--muted); } .quick-action-title { color:var(--text); font-weight:800; line-height:1.2; } .quick-action-caption { color:var(--muted); font-size:12px; line-height:1.25; }
@media (max-width:360px) { .quick-action { height:144px; } }
.radio-group { display:grid; gap:6px; margin:12px 0; border:0; padding:0; min-inline-size:auto; } .radio-group legend { padding:0; margin-bottom:4px; font-size:14px; font-weight:800; } .radio-card { display:grid; grid-template-columns:auto 1fr; column-gap:10px; align-items:center; padding:14px; border:1px solid var(--line); border-radius:var(--radius); cursor:pointer; } .radio-card input { grid-row:1 / 3; width:20px; height:20px; accent-color:var(--accent); } .radio-card-title { font-weight:800; } .radio-card-caption { grid-column:2; color:var(--muted); font-size:13px; } .radio-card:has(input:checked) { background:var(--accent-tint); border-color:var(--accent-border-strong); border-width:2px; padding:13px; }
.reveal { display:none; opacity:0; } .reveal.is-visible { display:block; opacity:1; animation:reveal-opacity var(--motion) ease; } .reveal-inner { min-height:0; } @keyframes reveal-opacity { from { opacity:0; } to { opacity:1; } }
.checkbox-card { display:flex; align-items:center; gap:10px; margin-top:14px; padding:14px; border:1px solid var(--line); border-radius:var(--radius); cursor:pointer; font-size:14px; font-weight:700; } .checkbox-card input { width:20px; height:20px; flex:none; accent-color:var(--accent); }
.form-help-trigger { justify-self:start; margin:4px 0 10px; padding:2px 0; border:0; color:var(--accent-2); background:transparent; cursor:pointer; font-size:13px; font-weight:700; text-decoration:underline; text-decoration-color:currentColor; text-underline-offset:3px; transition:color var(--motion); } .form-help-trigger:hover,.form-help-trigger:focus-visible { color:var(--text); } .delivery-note { margin:0 0 10px; color:var(--muted); font-size:13px; } .form-support { margin:12px 0 0; color:var(--muted); text-align:center; font-size:13px; } .form-support a,.link-help-support a { color:var(--accent-2); } .form-support a { font-weight:800; } .link-help-support a { font-weight:400; }
#link-help-dialog { position:relative; width:min(calc(100% - 24px),420px); max-height:calc(100dvh - 24px); overflow:auto; padding:18px 16px 16px; border:1px solid var(--line); border-radius:var(--radius-lg); color:var(--text); background:var(--surface); } #link-help-dialog::backdrop { background:rgba(0,0,0,.78); } .link-help-head { padding:0 48px 14px 0; border-bottom:1px solid var(--line); } .link-help-head h2 { margin:0; font-size:20px; line-height:1.2; } .link-help-close { position:absolute; top:8px; right:8px; display:flex; width:44px; height:44px; align-items:center; justify-content:center; padding:0; border:0; color:var(--muted); background:transparent; cursor:pointer; font-size:30px; line-height:1; } .link-help-close:hover,.link-help-close:focus-visible { color:var(--text); } .link-help-steps { display:grid; gap:12px; margin:16px 0; padding-left:20px; } .link-help-steps li { padding-left:2px; color:var(--text); font-size:13px; line-height:1.4; } .link-help-steps li::marker { color:var(--muted); font-weight:800; } .link-help-images { display:flex; align-items:center; gap:8px; margin-top:8px; } .link-help-images img { display:block; width:64px; height:58px; border:1px solid var(--line); border-radius:10px; background:#fff; object-fit:contain; } .link-help-images--copy img { width:84px; height:115px; } .link-help-support { margin:0; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius); color:var(--muted); background:var(--ink); font-size:13px; line-height:1.4; }
.profile-card { display:grid; justify-items:center; gap:12px; padding:20px 18px; margin-bottom:16px; text-align:center; } .avatar { display:flex; align-items:center; justify-content:center; width:56px; height:56px; border-radius:50%; background:var(--accent); font-weight:800; font-size:22px; flex:none; color:#fff; } #profile-avatar-image { width:56px; height:56px; border-radius:50%; object-fit:cover; } #profile-name { font-size:20px; font-weight:800; line-height:1.3; }
.stat-tile { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:100%; padding-top:16px; border-top:1px solid var(--line); text-align:center; } .stat-tile strong { display:block; font-size:20px; font-weight:800; line-height:1.3; } .stat-tile span { color:var(--muted); font-size:12px; }
.tier-card { padding:16px; margin-bottom:16px; } .tier-status { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--line); } .tier-status span:first-child { color:var(--muted); font-size:13px; font-weight:700; } .tier-status span:last-child { font-size:13px; font-weight:800; }
.tier-progress { list-style:none; margin:0; padding:0; display:grid; gap:14px; } .tier-progress li { display:grid; gap:2px; color:var(--muted); } .tier-row { display:flex; align-items:center; gap:6px; } .tier-icon { flex:none; font-weight:800; } .tier-name { font-weight:700; } .tier-caption { color:var(--muted); font-size:14px; font-weight:500; } .tier-progress li.is-current { color:var(--text); } .tier-progress li.is-current .tier-name { font-weight:800; } .tier-progress li[data-tier="regular"] .tier-row { color:var(--success); } .tier-progress li[data-tier="premium"] .tier-row { color:var(--premium); }
.promo-share { padding:18px; margin-bottom:16px; } .promo-label { margin:0 0 8px; font-size:13px; color:var(--muted); font-weight:700; } .promo-code-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid var(--line); } .promo-code { margin:0; font-size:22px; font-weight:800; color:var(--accent-2); letter-spacing:.04em; } .copy-btn { flex:none; width:36px; height:36px; padding:0; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:50%; background:transparent; color:var(--accent-2); cursor:pointer; transition:color var(--motion),border-color var(--motion); } .copy-btn .icon { width:18px; height:18px; } .copy-btn .icon-check { display:none; } .copy-btn.is-copied { color:var(--success); border-color:var(--success); } .copy-btn.is-copied .icon-copy { display:none; } .copy-btn.is-copied .icon-check { display:block; } .promo-share > p.muted { margin:0; font-size:14px; } .pending-bonus { margin-top:10px; color:var(--success); font-size:13px; font-weight:800; }
.collection-list { display:grid; gap:12px; } .collection-card { display:grid; grid-template-columns:120px 1fr; gap:14px; padding:12px; align-items:start; } .collection-card > div:last-child { margin-top:6px; } .collection-photo { display:block; width:120px; height:120px; border-radius:var(--radius); background:var(--surface-2); object-fit:cover; } .collection-photo--empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:var(--muted); } .collection-photo--empty .icon { width:26px; height:26px; } .collection-photo--empty em { font-style:normal; font-size:11px; font-weight:700; } .collection-card h2 { margin:0; font-size:17px; line-height:1.3; } .collection-card p { margin:10px 0 0; color:var(--muted); font-size:14px; line-height:1.4; }
[hidden] { display:none; }
.admin-body { font-size:16px; line-height:24px; --admin-nav-height:86px; }
.admin-body [hidden] { display:none; }
.admin-shell { width:min(100%,560px); min-height:100dvh; margin:auto; padding:calc(16px + var(--app-safe-top)) 16px calc(var(--admin-nav-height) + 24px + env(safe-area-inset-bottom)); }
.admin-shell h1 { max-width:none; font-size:clamp(28px,7vw,34px); line-height:1.15; letter-spacing:-.035em; overflow-wrap:anywhere; }
.admin-shell h2,.admin-dialog h2 { font-size:20px; font-weight:800; line-height:26px; overflow-wrap:anywhere; }
.admin-shell p,.admin-dialog p { overflow-wrap:anywhere; }
.admin-shell button,.admin-shell a.quiet,.admin-dialog button { min-height:var(--control-height); min-width:44px; white-space:normal; overflow-wrap:anywhere; font-size:16px; line-height:24px; }
.admin-shell :focus-visible,.admin-dialog :focus-visible,.admin-bottom-nav :focus-visible { outline:3px solid var(--accent-2); outline-offset:3px; }
.admin-catalog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.admin-catalog-card { position:relative; min-width:0; overflow:hidden; padding:10px; }
.admin-catalog-card h2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:10px 0 6px; font-size:15px; line-height:20px; }
.admin-card-open { position:absolute; inset:0; z-index:1; width:100%; height:100%; border:0; border-radius:var(--radius-lg); background:transparent; cursor:pointer; }
.admin-catalog-card .admin-photo button { position:relative; z-index:2; }
.admin-catalog-card .admin-price { margin:6px 0 0; gap:6px 8px; }
.admin-catalog-card .admin-price .admin-amount { font-size:18px; line-height:24px; }
.admin-catalog-card .admin-yuan { font-size:12px; line-height:18px; }
.admin-title-link { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; padding:0; border:0; background:transparent; color:var(--text); text-align:left; font-weight:800; cursor:pointer; }
.admin-photo { display:flex; position:relative; flex-direction:column; align-items:center; justify-content:center; min-width:0; aspect-ratio:1; overflow:hidden; background:var(--surface-2); border-radius:var(--radius); }
.admin-photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; border-radius:var(--radius); }
.admin-photo .admin-photo-open { display:block; width:100%; height:100%; padding:0; border:0; color:var(--text); background:transparent; cursor:zoom-in; }
.admin-photo p { padding:0 8px; }
.admin-product-gallery { align-items:center; aspect-ratio:1; gap:12px; border-radius:var(--radius-lg); }
.admin-product-gallery .admin-photo { height:100%; aspect-ratio:1; }
.admin-product-gallery img { height:100%; max-height:100%; object-fit:cover; }
.admin-product-gallery .admin-photo-open { height:100%; min-height:0; }
.admin-caption { font-size:14px; font-weight:500; line-height:20px; color:var(--muted); }
.admin-price { display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 12px; margin:12px 0; }
.admin-price p { margin:0; }
.admin-amount { font-size:28px; font-weight:800; line-height:34px; }
.admin-yuan { font-size:15px; line-height:22px; font-weight:400; color:var(--muted); }
.admin-sale-prices { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; width:100%; min-width:0; }
.admin-sale-current,.admin-sale-percent { color:#FF7A92; }
.admin-sale-old { color:var(--muted); font-size:16px; line-height:24px; font-weight:400; overflow-wrap:anywhere; }
.admin-catalog-card .admin-sale-old { font-size:14px; line-height:20px; }
.admin-sale-percent { font-size:14px; line-height:20px; font-weight:500; }
.admin-product-section { margin-top:24px; }
.admin-product-section h2 { margin:0 0 12px; font-size:17px; line-height:24px; }
.admin-product-section p { margin:0; line-height:1.6; }
.admin-section-heading { letter-spacing:-.01em; }
.admin-ai-details { margin-top:24px; padding:14px 0; border-top:1px solid var(--line); color:var(--muted); font-size:14px; }
.admin-ai-details summary { cursor:pointer; font-weight:700; }
.admin-ai-details p { margin:12px 0 0; line-height:1.5; }
.admin-shell .admin-delete-product { margin-top:20px; min-height:44px; padding:8px 12px; color:var(--danger); border-color:var(--danger); font-size:13px; }
.admin-gallery-controls { display:flex; justify-content:center; align-items:center; gap:16px; margin:8px 0 16px; color:var(--muted); font-size:13px; }
.admin-shell .admin-gallery-arrow,.admin-dialog .admin-gallery-arrow { display:flex; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; padding:10px; border-radius:50%; }
.admin-gallery-arrow .icon { width:20px; height:20px; }
.admin-shell .admin-edit { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; padding:10px; }
#admin-product-content > .section-heading { align-items:center; margin:16px 0 10px; }
#admin-product-title { flex:1; margin:0; }
.admin-preview { padding:16px; border:1px solid var(--line); border-radius:var(--radius-lg); background:var(--surface-glass); }
.admin-preview .admin-preview-title { margin:0 0 16px; font-size:24px; line-height:1.2; }
.admin-preview .admin-upload-row { padding:0; border:0; }
.admin-preview .admin-photo-footer { display:none; }
.admin-ai-status { margin:6px 0 0; font-size:13px; }
.admin-long-text { white-space:pre-wrap; }
.admin-gallery { display:flex; position:relative; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; margin-top:16px; }
.admin-gallery::-webkit-scrollbar { display:none; }
.admin-gallery .admin-photo { flex:0 0 100%; scroll-snap-align:start; scroll-snap-stop:always; }
.admin-photo-enter { animation:admin-photo-in 100ms ease-out; }
@keyframes admin-photo-in { from { opacity:.65; } to { opacity:1; } }
.admin-screen-loading { visibility:hidden; pointer-events:none; }
.admin-catalog-loading { display:grid; place-items:center; min-height:140px; }
.admin-loading-spinner { width:24px; height:24px; border:2px solid var(--line); border-top-color:var(--accent-2); border-radius:50%; animation:admin-spin 600ms linear infinite; }
.admin-screen-ready { animation:admin-photo-in 100ms ease-out; }
@keyframes admin-spin { to { transform:rotate(360deg); } }
.admin-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin:16px 0; }
.admin-actions > * { min-width:0; }
.admin-actions .primary { width:auto; flex:1; }
.admin-edit { flex:none; width:52px; height:52px; padding:12px; }
.admin-edit svg { display:block; width:20px; height:20px; flex:none; }
.admin-bottom-nav { position:fixed; z-index:2; bottom:0; left:50%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:min(100%,560px); padding:10px 16px calc(10px + env(safe-area-inset-bottom)); transform:translateX(-50%); border-top:1px solid var(--line); background:var(--ink); }
.admin-bottom-nav button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-width:44px; min-height:60px; padding:9px 4px; border:0; background:transparent; color:var(--muted); font-size:12px; line-height:16px; font-weight:800; white-space:normal; overflow-wrap:anywhere; cursor:pointer; }
.admin-bottom-nav .icon { width:22px; height:22px; flex:none; }
.admin-bottom-nav button[aria-current="page"] { color:var(--accent-2); }
.admin-bottom-nav.admin-owner-nav { grid-template-columns:repeat(5,minmax(0,1fr)); padding-inline:8px; }
.admin-owner-nav button { padding-inline:2px; font-size:11px; }
.admin-helper-workspace,.admin-price-editor { display:grid; gap:24px; min-width:0; font-size:16px; line-height:24px; font-weight:500; overflow-wrap:anywhere; }
.admin-helper-workspace h1,.admin-price-editor h1 { margin:0; font-size:20px; line-height:26px; font-weight:800; letter-spacing:normal; }
.admin-helper-workspace form,.admin-price-editor form { display:grid; gap:16px; min-width:0; }
.admin-helper-workspace label,.admin-price-editor label { margin:0; font-size:16px; line-height:24px; font-weight:800; }
.admin-helper-workspace p,.admin-price-editor p { margin:0; }
.admin-helper-workspace .admin-caption,.admin-price-editor .admin-caption { color:var(--muted); font-size:14px; line-height:20px; font-weight:500; }
.admin-helper-workspace button,.admin-price-editor button,.admin-helper-workspace input,.admin-price-editor input { min-width:0; min-height:52px; white-space:normal; overflow-wrap:anywhere; }
.admin-helper-workspace .field-error,.admin-price-editor .field-error { font-size:14px; line-height:20px; }
.admin-sale-workspace h1 { font-size:20px; line-height:24px; font-weight:700; }
.admin-sale-workspace { font-weight:400; }
.admin-sale-workspace form { gap:20px; }
.admin-sale-field { display:grid; gap:8px; min-width:0; }
.admin-sale-summary { display:grid; gap:8px; min-width:0; padding:16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface-glass); }
.admin-sale-summary h2 { margin:0; font-size:15px; line-height:20px; font-weight:700; }
.admin-sale-workspace .admin-back { justify-self:start; width:auto; }
.admin-sale-banner { margin:16px 0; color:#FF7A92; }
.admin-sale-workspace label { font-weight:700; }
.admin-sale-workspace .admin-caption,.admin-sale-workspace .field-error { font-size:14px; line-height:20px; font-weight:400; }
.admin-sale-workspace input { width:100%; max-width:100%; min-width:0; font-size:16px; }
.admin-sale-workspace button.quiet { min-height:44px; }
.admin-sale-workspace .admin-delete-product { margin-top:0; font-size:16px; }
.admin-sale-workspace [hidden] { display:none; }
.admin-helper-list { display:grid; gap:16px; }
.admin-helper-row { display:grid; grid-template-columns:44px minmax(0,1fr); gap:12px; align-items:center; padding:16px; border:1px solid var(--line); border-radius:var(--radius); }
.admin-helper-avatar { display:flex; align-items:center; justify-content:center; width:44px; height:44px; overflow:hidden; border-radius:50%; background:var(--surface-2); color:var(--accent-2); font-weight:700; }
.admin-helper-avatar img { width:100%; height:100%; object-fit:cover; }
.admin-helper-info { display:grid; gap:2px; min-width:0; }
.admin-helper-name { font-weight:700; }
.admin-helper-row p { min-width:0; overflow-wrap:anywhere; }
.admin-helper-row button { grid-column:1/-1; }
.admin-helper-revoke { color:var(--danger); border-color:var(--danger); }
.admin-shell .admin-edit.admin-price-action { width:auto; height:auto; min-height:52px; max-width:100%; padding:8px 16px; color:var(--accent-2); white-space:normal; overflow-wrap:anywhere; }
.admin-dialog { width:min(calc(100% - 32px),528px); max-height:calc(100dvh - 32px); overflow:auto; padding:20px; border:1px solid var(--line); border-radius:var(--radius-lg); color:var(--text); background:var(--surface); font-size:16px; line-height:24px; }
.admin-dialog::backdrop { background:rgba(0,0,0,.75); }
#admin-add-dialog { width:min(calc(100% - 40px),320px); padding:18px; border-radius:var(--radius); }
#admin-add-dialog h2 { margin:0 0 8px; font-size:18px; line-height:24px; }
#admin-add-dialog > p { margin:0; color:var(--muted); font-size:13px; line-height:20px; }
#admin-add-dialog .admin-actions,#admin-confirm-dialog .admin-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
#admin-add-dialog button { width:100%; min-height:44px; padding:8px 12px; font-size:13px; line-height:18px; }
#admin-confirm-dialog { width:min(calc(100% - 40px),320px); padding:18px; border-radius:var(--radius); }
#admin-confirm-dialog h2 { margin:0 0 8px; font-size:18px; line-height:24px; }
#admin-confirm-dialog > p { margin:0; color:var(--muted); font-size:13px; line-height:20px; }
#admin-confirm-dialog .admin-actions { justify-content:flex-end; gap:8px; margin:18px 0 0; }
#admin-confirm-dialog button { flex:none; width:100%; min-height:44px; padding:8px 12px; font-size:13px; line-height:18px; font-weight:700; }
#admin-confirm-dialog button:focus-visible { outline-width:2px; outline-offset:2px; }
#admin-confirm-dialog[data-action="discard"] #admin-confirm-cancel { border-color:var(--accent); color:white; background:var(--accent); }
#admin-confirm-dialog[data-action="discard"] #admin-confirm-accept { border:1px solid var(--danger); color:var(--danger); background:transparent; }
.admin-photo-viewer { position:fixed; inset:0; width:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; overflow:hidden; background:transparent; }
.admin-photo-viewer::backdrop { background:rgba(7,5,10,.6); backdrop-filter:blur(8px); }
html:has(#admin-photo-dialog[open]) { overflow:hidden; }
#admin-photo-content { display:grid; place-items:center; width:100%; height:100%; padding-top:var(--app-safe-top); }
#admin-photo-content img { display:block; width:auto; height:auto; max-width:100%; max-height:calc(100dvh - var(--app-safe-top)); min-width:0; min-height:0; object-fit:contain; }
.admin-photo-close { position:absolute; z-index:2; top:calc(8px + var(--app-safe-top)); right:calc(8px + env(safe-area-inset-right)); display:flex; align-items:center; justify-content:center; width:44px; height:44px; padding:10px; border:0; border-radius:50%; color:var(--muted); background:rgba(7,5,10,.55); cursor:pointer; }
.admin-photo-close svg { display:block; width:24px; height:24px; }
.admin-keyboard .admin-bottom-nav { position:static; width:100%; transform:none; }
.admin-keyboard .admin-shell { min-height:0; padding-bottom:24px; }
@media (min-width:360px) { .admin-shell { padding-left:24px; padding-right:24px; } }
@media (prefers-reduced-motion:reduce) { .admin-gallery { scroll-snap-type:none; } }
.admin-shell form { gap:8px; min-width:0; }
.admin-shell input,.admin-shell textarea { min-width:0; min-height:52px; font-size:16px; line-height:24px; }
.admin-shell textarea { resize:none; overflow:hidden; white-space:pre-wrap; overflow-wrap:anywhere; }
.admin-shell .field-error { font-size:14px; line-height:20px; }
.admin-size-options { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0; }
.admin-size-options button { min-width:52px; border-radius:50%; }
.admin-size-options button[aria-pressed="true"] { border:2px solid var(--accent-2); background:var(--accent-tint); color:var(--text); }
.admin-upload-row { min-width:0; margin:12px 0; padding:16px; border:1px solid var(--line); border-radius:var(--radius); }
.admin-upload-row > img,.admin-upload-row .admin-photo { width:100%; aspect-ratio:1; }
.admin-upload-row > img { height:auto; object-fit:cover; object-position:center; border-radius:var(--radius); }
.admin-upload-row .admin-actions { justify-content:flex-start; }
.admin-upload-row .admin-caption:empty { display:none; }
.admin-upload-carousel { gap:12px; margin:0; padding:0 0 4px; }
.admin-upload-carousel .admin-upload-row { flex:0 0 92%; margin:0; scroll-snap-align:start; }
.admin-upload-carousel .admin-upload-row:only-child { flex-basis:100%; }
.admin-upload-carousel .admin-actions { margin-bottom:0; }
.admin-upload-row .admin-photo-footer { justify-content:space-between; margin-top:12px; }
.admin-shell .admin-photo-remove { min-height:44px; padding:6px 10px; font-size:13px; line-height:20px; font-weight:700; }
#wizard-photos { outline-offset:3px; }
#wizard-form .primary { flex-basis:100%; }
#wizard-form[aria-busy="true"] { cursor:progress; }
.admin-body { font-weight:500; --admin-visible-height:100dvh; }
.admin-shell .brand-tagline { font-family:inherit; font-size:14px; line-height:20px; font-weight:500; overflow-wrap:anywhere; }
.admin-shell .topbar,.admin-shell .brand,.admin-shell .section-heading h1 { min-width:0; }
.admin-shell .brand img { flex:none; }
.admin-shell fieldset { min-inline-size:0; }
.admin-shell label { font-size:16px; line-height:24px; }
.admin-shell main { padding-top:8px; }
.admin-step-header { margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.admin-step-header h1 { margin:12px 0 8px; }
.admin-step-header > p { margin:0; }
.admin-step-motion { animation:admin-step-in var(--motion) ease-out; }
@keyframes admin-step-in { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
.admin-wizard-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.admin-shell .admin-back { margin:0; padding:8px 0; border:0; background:transparent; font-size:14px; cursor:pointer; }
.admin-back .icon { transition:transform var(--motion); }
.admin-back:active .icon { transform:translateX(-3px); }
.admin-step-count { margin:0; }
.admin-wizard-next { margin-top:12px; }
.admin-field-help { margin:0 0 12px; }
.admin-photo-picker { display:flex; position:relative; align-items:center; justify-content:center; min-height:var(--control-height); background:var(--accent-tint); }
.admin-photo-picker input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.admin-photo-picker:focus-within { outline:3px solid var(--accent-2); outline-offset:3px; }
.admin-shell .field-error:empty { min-height:0; }
.admin-shell .radio-card input { min-height:20px; }
.admin-shell .admin-size-options button { width:52px; height:44px; flex:0 0 52px; min-width:52px; min-height:44px; padding:0; border-radius:10px; font-size:14px; line-height:20px; }
.admin-size-display { display:flex; flex-wrap:wrap; gap:8px; }
.admin-size-chip { display:inline-flex; justify-content:center; align-items:center; width:52px; min-height:44px; border:1px solid var(--accent-border-strong); border-radius:10px; background:var(--accent-tint); font-size:14px; font-weight:700; }
.admin-shell .admin-size-options .admin-custom-size,.admin-size-chip.admin-custom-size { width:auto; flex-basis:auto; padding:0 12px; }
.admin-size-modes { grid-template-columns:repeat(3,minmax(0,1fr)); }
.admin-size-modes .radio-card { display:flex; gap:6px; align-items:center; justify-content:center; margin-top:0; min-height:52px; padding:10px 6px; font-size:13px; line-height:18px; }
.admin-size-modes .radio-card:has(input:checked) { padding:9px 5px; }
.admin-size-modes .radio-card input { width:16px; height:16px; min-height:16px; flex:none; }
.admin-shoe-range { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.admin-shoe-range label { display:block; margin:0 0 8px; font-size:14px; }
.admin-shell select { width:100%; min-height:52px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font:inherit; }
.admin-shell button:disabled,.admin-dialog button:disabled { cursor:default; }
.admin-shell button[aria-busy="true"],.admin-dialog button[aria-busy="true"] { cursor:progress; }
.admin-shell input:focus,.admin-shell textarea:focus { scroll-margin-block:24px; }
.admin-conflict { color:var(--text); }
.admin-conflict-version { min-width:0; margin:16px 0; padding:16px; border:1px solid var(--line); border-radius:var(--radius); }
.admin-conflict-version dt { margin-top:16px; font-weight:800; }
.admin-conflict-version dd { margin:8px 0 0; overflow-wrap:anywhere; }
.admin-conflict-version .admin-photo { max-width:320px; margin-top:8px; }
.admin-dialog { max-height:calc(var(--admin-visible-height) - 32px); }
.admin-body .admin-dialog button { transition:opacity 160ms,transform 160ms; }
@media (forced-colors:active) {
  .admin-catalog-card,.admin-conflict-version,.admin-dialog,.admin-bottom-nav { border:1px solid CanvasText; forced-color-adjust:auto; }
  .admin-shell button:disabled,.admin-dialog button:disabled { color:GrayText; opacity:1; }
  .admin-size-options button[aria-pressed="true"] { border:2px solid Highlight; }
}
@media (prefers-reduced-motion:reduce) {
  .admin-gallery { scroll-behavior:auto; scroll-snap-type:none; }
  .admin-body .admin-dialog button { transition:none; }
}
/* Description generation stays within the existing wizard width. */
.admin-description-ai { min-width: 0; display: grid; gap: 8px; overflow-wrap: anywhere; }
.admin-description-ai p { margin: 0; }
.admin-description-actions { display: flex; flex-wrap: wrap; gap: 8px; min-width: 0; margin-bottom: 8px; }
.admin-description-actions button { min-width: 0; white-space: normal; min-height: 52px; }
.admin-description-proposal { min-width: 0; margin-top: 8px; display: grid; gap: 8px; }
.admin-description-proposal h2 { font-size: 20px; }
.admin-description-proposal .admin-long-text { white-space: pre-wrap; overflow-wrap: anywhere; }
#wizard-description { overflow-y: hidden; max-height: none; }
/* Optional home images keep their intrinsic ratio, including during first decode. */
.home-banner { width: 100%; margin: 0; border-radius: 14px; overflow: hidden; background: var(--surface-2); }
.home-banner-carousel { position: relative; display: grid; min-width: 0; margin-bottom: 16px; border-radius: 14px; overflow: hidden; isolation: isolate; background: var(--surface-2); touch-action: pan-y pinch-zoom; user-select: none; cursor: grab; }
.home-banner-carousel:active { cursor: grabbing; }
.home-banner-carousel[hidden] { display: none; }
.home-banner-carousel .home-banner { grid-area: 1 / 1; min-width: 0; align-self: center; opacity: 0; transform: translateX(100%); pointer-events: none; }
.home-banner-carousel .home-banner.is-active { opacity: 1; transform: translateX(0); }
.home-banner.is-entering { animation: home-banner-enter 650ms cubic-bezier(.22,1,.36,1) both; }
.home-banner.is-leaving { animation: home-banner-leave 650ms cubic-bezier(.22,1,.36,1) both; }
@keyframes home-banner-enter { from { transform: translateX(calc(100% * var(--home-banner-direction, 1))); opacity: 1; } to { transform: translateX(0); opacity: 1; } }
@keyframes home-banner-leave { from { transform: translateX(0); opacity: 1; } to { transform: translateX(calc(-100% * var(--home-banner-direction, 1))); opacity: 1; } }
.home-banner img, .admin-banner-preview img { display: block; width: 100%; height: auto; border-radius: 14px; }
.home-banner[hidden] { display: none; margin: 0; }
.admin-banner-workspace { min-width: 0; display: grid; gap: 16px; }
.admin-banner-workspace > h1, .admin-banner-workspace > p { margin: 0; }
.admin-banner-workspace p:empty { display: none; }
.admin-banner-workspace .admin-back { justify-self: start; width: auto; }
.admin-banner-workspace > .admin-caption { font-size: 14px; line-height: 20px; color: var(--muted); }
.admin-banner-workspace h1, .admin-banner-slot h2 { font-size: 20px; line-height: 24px; font-weight: 700; }
.admin-banner-slot { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.admin-banner-slot p, .admin-banner-slot h2 { margin: 0; overflow-wrap: anywhere; }
.admin-banner-slot .admin-caption, .admin-banner-slot .field-error { font-size: 14px; line-height: 20px; font-weight: 400; }
.admin-banner-slot button, .admin-banner-file { font-size: 16px; line-height: 24px; font-weight: 700; white-space: normal; min-height: 44px; }
.admin-banner-slot .primary { min-height: 52px; }
.admin-banner-slot .admin-delete-product { margin-top: 0; }
.admin-banner-slot input { max-width: 100%; min-width: 0; width: 100%; font-size: 16px; }
.admin-banner-file { gap: 8px; padding: 12px 16px; cursor: pointer; color: var(--accent-2); }
.admin-banner-file .icon { width: 20px; height: 20px; flex: none; }
.admin-banner-file[data-disabled="true"] { opacity: .5; }
.admin-banner-file input:disabled { cursor: default; }
.admin-banner-preview { min-width: 0; border-radius: 14px; overflow: hidden; }
.admin-banner-empty-title { font-size: 16px; line-height: 24px; font-weight: 700; }