:root{color-scheme:light;--ink:#17221d;--muted:#6e7771;--green:#254f3d;--paper:#f4f3ee}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}header{padding:24px 18px 16px;display:flex;justify-content:space-between;gap:15px;align-items:center}h1{font-size:28px;margin:4px 0}h2{margin:5px 0 8px}small{color:var(--muted);letter-spacing:.08em}button,a,input,select,textarea{font:inherit}button,a{border:1px solid #d6d9d3;border-radius:10px;background:white;color:inherit;padding:10px 13px;text-decoration:none}button.active,.primary{background:var(--green);color:white;border-color:var(--green)}nav{display:flex;gap:8px;overflow:auto;padding:4px 18px 16px}main{padding:0 18px 30px;display:grid;gap:16px}article,section,form{background:white;border:1px solid #e0e2dc;border-radius:16px;padding:15px}article{display:grid;grid-template-columns:110px 1fr;gap:15px}article>img{width:110px;height:130px;object-fit:contain;background:#eeece5;border-radius:12px}article p{color:var(--muted);margin:6px 0 12px}dialog{border:0;border-radius:20px;width:min(520px,94vw);max-height:92vh;padding:22px}dialog::backdrop{background:#101b16aa}.close{float:right}.hero{width:100%;height:270px;object-fit:contain;background:#efede7;border-radius:14px}dl>div{display:flex;justify-content:space-between;border-bottom:1px solid #eee;padding:8px 0}dt{color:var(--muted)}dd{margin:0}label{display:block;margin:12px 0}input,select,textarea{display:block;width:100%;margin-top:5px;padding:11px;border:1px solid #d6d9d3;border-radius:9px}textarea{min-height:80px}.notice{font-size:12px;color:var(--muted)}form .primary{width:100%;font-weight:650}#toast{position:fixed;left:18px;right:18px;bottom:18px;background:#183f30;color:white;padding:14px;border-radius:12px}.empty{text-align:center;color:var(--muted);padding:40px}@media(min-width:760px){main{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1100px;margin:auto}header,nav{max-width:1136px;margin:auto}}
/* Luxury storefront. Scoped to keep operator screens independent. */
.storefront {
 --paper:#faf8f5; --ink:#28201d; --muted:#746963; --accent:#672f3b;
 --champagne:#c5ad86; --line:#e4ddd5; --green:var(--accent);
 background:var(--paper); padding-bottom:calc(100px + env(safe-area-inset-bottom));
 font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 -webkit-font-smoothing:antialiased;
}
.storefront header {max-width:800px;padding:28px 24px 24px;margin:auto;align-items:center}
.storefront header small {font-size:9px;letter-spacing:.26em;color:var(--muted)}
.storefront h1 {font:400 38px/1.1 Georgia,"Times New Roman",serif;letter-spacing:-1.5px;margin:7px 0 0}
.storefront #recent {display:flex;align-items:center;gap:6px;font-size:11px;background:transparent;border:0;color:var(--muted);padding:12px 0 12px 8px;min-height:44px}
.storefront #recent[aria-pressed=true] {color:var(--accent)}
.storefront svg {width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.storefront .intro {max-width:752px;margin:0 auto 28px;padding:30px 32px 26px;background:#302320;color:#f9f3e9;position:relative;overflow:hidden;border:1px solid #493631}
.storefront .intro::after {content:'';position:absolute;inset:12px;border:1px solid #c5ad8638;pointer-events:none}
.storefront .intro .eyebrow {display:block;font-size:9px;letter-spacing:.25em;color:#d1b995;margin-bottom:18px}
.storefront .intro p {font:400 40px/1.1 Georgia,"Times New Roman",serif;letter-spacing:-1.2px;margin:0 0 22px}
.storefront .intro em {color:#d6bf9e;font-weight:400}
.storefront .intro-footer {display:flex;align-items:end;justify-content:space-between;gap:18px}
.storefront .intro-footer span {color:#e0d5cd;font-size:12px;line-height:1.6;max-width:280px}
.storefront .intro-footer small {color:#d1b995;font-size:9px;letter-spacing:.2em;white-space:nowrap}
.storefront .filters {max-width:800px;margin:auto}
.storefront nav {display:flex;padding:0 24px 14px;gap:8px;max-width:none;scrollbar-width:none}
.storefront nav::-webkit-scrollbar {display:none}
.storefront nav button {white-space:nowrap;flex-shrink:0;border-radius:3px;font-size:12px;padding:10px 16px;min-height:44px;border-color:var(--line);background:transparent;transition:background .18s,color .18s}
.storefront nav button.active {background:var(--ink);color:#fffaf3;border-color:var(--ink)}
.storefront #genders {gap:0;margin:0 24px 16px;padding:0;border-bottom:1px solid var(--line)}
.storefront #genders button {flex:1;border:0;border-bottom:2px solid transparent;border-radius:0;font-size:12px;padding:12px 5px;color:var(--muted);letter-spacing:.025em}
.storefront #genders button.active {background:transparent;color:var(--ink);border-bottom-color:var(--accent)}
.storefront #brands {padding-top:0;padding-bottom:14px;gap:16px}
.storefront #brands button {border:0;border-radius:0;background:transparent;padding:8px 0;min-height:40px;color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.storefront #brands button.active {color:var(--accent);box-shadow:inset 0 -1px var(--accent)}
.storefront .section-heading {display:flex;align-items:center;justify-content:space-between;gap:12px}
.storefront .section-heading h2 {font:400 25px/1.2 Georgia,"Times New Roman",serif;letter-spacing:-.5px;margin:0}
.storefront .section-heading>span,.storefront .section-heading>small {font-size:10px;color:var(--muted)}
.storefront .catalog-heading {max-width:800px;padding:0 24px;margin:20px auto}
.storefront main {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px;max-width:800px;margin:auto;padding:0 24px 32px}
.storefront .product-tile {padding:0;border:0;border-radius:0;background:transparent;display:block;position:relative;min-width:0}
.storefront .product-open {display:block;width:100%;border:0;border-radius:0;background:transparent;padding:0;text-align:left}
.storefront .product-image {aspect-ratio:4/5;background:#f0ebe5;border-radius:2px;overflow:hidden;display:grid;place-items:center}
.storefront .product-image img {width:100%;height:100%;object-fit:contain;transition:transform .3s}
.storefront .product-image>span {font-size:11px;color:var(--muted);padding:16px;text-align:center}
.storefront .product-info {padding:13px 0 0}
.storefront .product-info small {display:block;color:var(--ink);font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.1em}
.storefront .product-info h2 {font-size:13px;font-weight:400;line-height:1.5;margin:5px 0;overflow-wrap:anywhere}
.storefront .product-info p {font-size:11px;margin:0 0 10px;color:var(--muted)}
.storefront .product-info>span {font-size:11px;color:var(--accent)}
.storefront .favorite {position:absolute;right:8px;top:8px;display:grid;place-items:center;border:1px solid #e4ddd580;border-radius:50%;width:44px;height:44px;padding:0;background:#faf8f5ed;font-size:25px;line-height:1;color:var(--ink)}
.storefront .favorite[aria-pressed=true] {color:var(--accent)}
.storefront .bottom-nav {position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:64px;padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:#faf8f5f5;border-top:1px solid var(--line);backdrop-filter:blur(16px);z-index:3}
.storefront .bottom-nav button {display:flex;flex-direction:column;align-items:center;gap:6px;min-height:44px;border:0;border-radius:0;padding:2px 18px;background:transparent;color:var(--muted)}
.storefront .bottom-nav button span {display:block;font-size:10px;letter-spacing:.025em}
.storefront .bottom-nav button.active {color:var(--accent)}
.storefront .bottom-nav b {font-weight:500}
.storefront .empty {grid-column:1/-1;text-align:center;padding:48px 16px;border:1px solid var(--line);background:#f5f0e9;color:var(--muted)}
.storefront .empty h2 {color:var(--ink);font:400 24px/1.3 Georgia,"Times New Roman",serif;margin:0 0 12px}
.storefront .empty p {font-size:13px;max-width:320px;margin:auto;line-height:1.7}
.storefront .hit-section {max-width:752px;margin:8px auto 28px;padding:24px;background:#eee6db;border:0;border-radius:2px}
.storefront .hit-section[hidden] {display:none}
.storefront .hit-products {display:flex;gap:16px;overflow:auto;margin-top:20px}
.storefront .hit-products .product-tile {flex:0 0 160px}
.storefront dialog {background:var(--paper);color:var(--ink);padding:24px;border:1px solid var(--line);border-radius:4px;width:min(560px,96vw);max-height:92vh}
.storefront dialog::backdrop {background:#221916b8;backdrop-filter:blur(4px)}
.storefront dialog h2 {font:400 28px/1.25 Georgia,"Times New Roman",serif;letter-spacing:-.5px}
.storefront dialog .close {position:sticky;top:0;z-index:2;border-radius:50%;height:44px;width:44px;padding:0;background:var(--paper);border-color:var(--line);font-size:26px}
.storefront .hero {width:100%;height:auto;max-height:460px;min-height:200px;object-fit:contain;background:#f0ebe5;border-radius:2px;margin-bottom:12px}
.storefront dl>div {gap:24px;border-color:var(--line);font-size:12px}
.storefront dd {text-align:right;overflow-wrap:anywhere}
.storefront .card-actions {display:flex;gap:12px;margin:24px 0}
.storefront .card-actions button {flex:1;font-size:12px;min-height:44px;border-color:var(--line);border-radius:2px;background:transparent}
.storefront form {padding:20px;background:#f1eae1;border:0;border-radius:2px}
.storefront form label {font-size:12px}
.storefront input,.storefront select {background:var(--paper);color:var(--ink);border-color:#cfc3b7;border-radius:2px;min-height:44px;font-size:16px}
.storefront .notice {color:#685b52;line-height:1.7;font-size:11px}
.storefront form .primary {background:var(--accent);border-color:var(--accent);border-radius:2px;min-height:48px;color:#fffaf3;font-size:13px;font-weight:500}
.storefront .similar {background:transparent;border:0;border-radius:0;padding:28px 0 0}
.storefront .similar-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;margin-top:20px}
.storefront .similar-grid h2 {font:400 13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:0}
.storefront #toast {bottom:calc(90px + env(safe-area-inset-bottom));z-index:5;background:var(--ink);color:#fffaf3;border:1px solid #655246;border-radius:3px}
.storefront button {cursor:pointer}
.storefront button:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
@media(hover:hover) {.storefront .product-open:hover img {transform:scale(1.025)}.storefront .product-open:hover .product-info>span {text-decoration:underline}}
@media(max-width:799px) {.storefront .intro {margin:0 24px 28px}.storefront .hit-section {margin:8px 24px 28px}}
@media(max-width:420px) {.storefront header {padding:24px 20px 20px}.storefront h1 {font-size:34px}.storefront .intro {margin:0 20px 24px;padding:28px 24px 24px}.storefront .intro p {font-size:36px}.storefront .intro-footer {align-items:start;flex-direction:column;gap:14px}.storefront nav {padding-left:20px;padding-right:20px}.storefront #genders {margin-left:20px;margin-right:20px}.storefront main,.storefront .catalog-heading {padding-left:20px;padding-right:20px}.storefront .hit-section {margin-left:20px;margin-right:20px}.storefront .favorite {width:40px;height:40px}.storefront #recent {font-size:10px}.storefront .section-heading h2 {font-size:23px}}
@media(prefers-reduced-motion:reduce) {.storefront * {transition:none!important}}
.storefront .cart-row{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.storefront .cart-row>div{grid-column:2;min-width:0}.storefront .cart-row img{width:72px;height:92px;object-fit:contain}.storefront .cart-row h3{overflow-wrap:anywhere;font-size:16px;margin:0 0 8px}.storefront .cart-row label,.storefront .cart-add label{display:block;margin:10px 0}.storefront .cart-row select,.storefront .cart-row input,.storefront .cart-add select,.storefront .cart-add input{width:100%;box-sizing:border-box}.storefront .cart-add{border:1px solid var(--line);padding:16px;margin:20px 0}.storefront #cart-draft{width:100%;box-sizing:border-box;min-height:160px;font-size:14px}.storefront #cart-dialog>button:not(.close){min-height:44px;margin:8px 8px 8px 0}.storefront #cart-total{font-weight:600}.storefront .bottom-nav{gap:0}.storefront .bottom-nav button{min-width:0;flex:1}.storefront #cart-count{font-weight:600}
