:root{--logo:url('/assets/logo-mask.webp')}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}

/* Layout: Marp "uncover" in web form. Each section is a centred slide with generous air;
   one sticky bar; an inverted band (uncover's .invert) for emphasis; photos carry the colour. */
:root{
  --paper:#fcfcfd;
  --ink:#111214;
  --mute:#62656c;
  --line:#dfe0e4;
  --wash:#eceef1;
  --wash-2:#d6d9de;
  --wash-3:#c2c6cd;
  --scrim:rgba(17,18,20,.32);
  --display:"Jost","Futura","Century Gothic",system-ui,sans-serif;
  --body:"Lato","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --max:1200px;
  --bar:64px;
}
/* White is always the default; the menu's "Invert colours" switches to black */
:root{color-scheme:light}
:root.inverted{
  --paper:#0b0c0e; --ink:#f1f2f4; --mute:#9a9da5; --line:#2a2c31;
  --wash:#16171a; --wash-2:#202226; --wash-3:#2c2f35; --scrim:rgba(0,0,0,.6);
  color-scheme:dark;
}

*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;font-weight:400;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--paper)}
h1,h2,h3{font-family:var(--display);font-weight:300;line-height:1.15;margin:0;text-wrap:balance;letter-spacing:.01em}
p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.mute{color:var(--mute)}
.small{font-size:14px}
.eyebrow{font-family:var(--display);font-size:12px;font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--mute)}
.gutter{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.wrap{max-width:var(--max);margin:0 auto;width:100%}

/* ---------- bar ---------- */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
.bar-in{height:var(--bar);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;position:relative}
.icon-btn svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.4}
.bar-brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:400;letter-spacing:.38em;text-transform:uppercase;font-size:14px;padding-left:.38em}
.bar-brand #barMark{display:flex}
.lg{display:block;aspect-ratio:1100/913;background:currentColor;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat}
.bar-brand .lg{height:34px;width:auto}
.bar-right{justify-self:end;display:flex;align-items:center;gap:4px}
.bar-left{justify-self:start}
.count{position:absolute;top:4px;right:2px;min-width:18px;height:18px;border-radius:9px;background:var(--ink);color:var(--paper);font:500 11px/18px var(--mono);text-align:center;padding:0 4px}
.count[hidden]{display:none!important}
@media (max-width:520px){.bar-brand .bt{display:none}}

/* ---------- menu overlay ---------- */
.menu{position:fixed;inset:0;z-index:50;background:var(--paper);display:grid;grid-template-rows:auto 1fr auto;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:max(24px,env(safe-area-inset-bottom,0px));
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.menu-top{height:var(--bar);display:flex;align-items:center}
.menu nav{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(4px,1.4vh,14px);overflow-y:auto}
.menu nav button{font-family:var(--display);font-weight:200;font-size:clamp(24px,min(6vw,5.2vh),44px);letter-spacing:.06em;text-transform:uppercase;line-height:1.2;padding:4px 12px}
.menu nav button:hover,.menu nav button[aria-current="page"]{font-weight:400}
.menu-foot{display:flex;justify-content:center;gap:24px;flex-wrap:wrap}
.menu-foot button{font-family:var(--display);letter-spacing:.24em;text-transform:uppercase;font-size:12px;color:var(--mute);padding:8px}
.menu-foot button:hover{color:var(--ink)}

/* ---------- slides ---------- */
.slide{padding-block:clamp(64px,11vw,128px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px}
.slide.compact{padding-block:clamp(48px,8vw,88px) clamp(24px,4vw,40px)}
.slide h2{font-size:clamp(28px,4.4vw,44px);max-width:22ch}
.slide .lede{max-width:56ch;color:var(--mute);font-size:17px}
.page-title{font-size:clamp(40px,7vw,72px);font-weight:200;letter-spacing:.04em}
.invert{background:var(--ink);color:var(--paper)}
.invert .eyebrow,.invert .mute{color:var(--paper);opacity:.66}

.hero{padding-block:clamp(56px,10vw,120px) clamp(48px,8vw,88px);gap:24px}
.hero .mark{display:flex;justify-content:center}
.hero .mark .lg{width:clamp(156px,25.92vw,272px);height:auto;max-width:100%}
.wordmark{font-size:clamp(26px,6.4vw,72px);font-weight:200;letter-spacing:.24em;text-transform:uppercase;line-height:1.15;display:flex;flex-direction:column;align-items:center;gap:.1em}
.wordmark span{padding-left:.24em}
.wordmark .first{font-size:.75em;letter-spacing:.5em;padding-left:.5em}
.hero .lede{font-family:var(--display);font-weight:300;letter-spacing:.2em;text-transform:uppercase;font-size:13px;color:var(--mute)}
.rule{width:48px;height:1px;background:var(--ink);opacity:.5}

.btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.btn{font-family:var(--display);font-weight:400;font-size:13px;letter-spacing:.24em;text-transform:uppercase;padding:14px 28px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);transition:background .2s,color .2s}
.btn:hover{background:transparent;color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.invert .btn.ghost{border-color:var(--paper);color:var(--paper)}
.invert .btn.ghost:hover{background:var(--paper);color:var(--ink)}
.btn.block{width:100%}

/* ---------- photos & placeholders ---------- */
.photo{position:relative;overflow:hidden;width:100%;max-width:100%;aspect-ratio:var(--ar,3/2);
  background:linear-gradient(180deg,var(--wash) 0%,var(--wash) calc(var(--h,58%) - 1px),var(--wash-3) var(--h,58%),var(--wash-2) calc(var(--h,58%) + 8%),var(--wash) 100%);
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.photo .wm{position:absolute;inset:0;background-image:var(--wm);background-size:300px 170px;pointer-events:none}
.ph-label{position:absolute;left:12px;bottom:10px;font:400 11px/1 var(--mono);letter-spacing:.08em;color:var(--mute);text-transform:uppercase}
.photo.wide{--ar:16/7}
@media (max-width:600px){.photo.wide{--ar:4/3}}

.feature{padding-block:0}
.feature figcaption{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:12px;font-size:14px;color:var(--mute)}

/* ---------- grid ---------- */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px) clamp(16px,2.4vw,32px);width:100%;text-align:left}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:460px){.grid{grid-template-columns:minmax(0,1fr)}}
.card{display:flex;flex-direction:column;gap:12px;text-align:left;width:100%}
.card .photo{transition:transform .5s ease}
.card .frame-box{overflow:hidden}
.card:hover .photo{transform:scale(1.025)}
.card-meta{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card-title{font-family:var(--display);font-weight:400;font-size:17px;letter-spacing:.02em}
.card-sub{font-size:13px;color:var(--mute)}
.card-price{font:400 13px var(--mono);color:var(--mute);white-space:nowrap}
.grid-section{padding-block:0 clamp(64px,10vw,120px)}

.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.chip{font-family:var(--display);font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:9px 16px;border:1px solid var(--line);color:var(--mute)}
.chip:hover{color:var(--ink);border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}

.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);width:100%;max-width:960px;margin-top:16px;text-align:left}
.trio > div{background:var(--paper);padding:28px 24px;display:flex;flex-direction:column;gap:8px}
.trio h3{font-size:22px;font-weight:300}
.trio .spec{font:400 12px var(--mono);color:var(--mute);letter-spacing:.04em}
.trio p{font-size:15px;color:var(--mute)}
@media (max-width:760px){.trio{grid-template-columns:minmax(0,1fr)}}

blockquote{margin:0;font-family:var(--display);font-weight:200;font-size:clamp(24px,3.6vw,38px);line-height:1.35;max-width:26ch;text-wrap:balance}

/* ---------- product ---------- */
.product{padding-block:24px clamp(64px,10vw,112px)}
.back{font-family:var(--display);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute);padding:8px 0;margin-bottom:16px}
.back:hover{color:var(--ink)}
.pgrid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start}
@media (max-width:860px){.pgrid{grid-template-columns:minmax(0,1fr)}}
.preview{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--bar) + 24px);display:flex;flex-direction:column;gap:14px}
@media (max-width:860px){.preview{position:static}}
.stage{background:var(--wash);aspect-ratio:5/4;max-width:100%;display:grid;place-items:center;padding:clamp(20px,6%,56px);overflow:hidden}
.stage-inner{display:grid;place-items:center;transition:width .35s ease}
.moulding{padding:var(--mw,10px);background:var(--mould);box-shadow:0 1px 0 rgba(0,0,0,.08),0 14px 30px -12px rgba(0,0,0,.45);outline:1px solid var(--line);width:100%}
.f-white{--mould:#eeede9}
.f-black{--mould:#18191b}
.f-oak{--mould:repeating-linear-gradient(90deg,#b69163 0 3px,#a8834f 3px 5px,#bc9a6d 5px 9px,#a98552 9px 11px)}
.mat{background:#f6f6f3;width:100%}
.mat .photo{box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.loose{box-shadow:0 12px 26px -14px rgba(0,0,0,.5);width:100%;background:#f6f6f3;padding:2.5%}
.dims{display:flex;gap:6px 20px;flex-wrap:wrap;justify-content:center;font-size:13px;color:var(--mute)}
.dims b{font-weight:500;color:var(--ink)}

.config{display:flex;flex-direction:column;gap:28px}
.ptitle{font-size:clamp(30px,4vw,44px);font-weight:300}
.price-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.price{font:400 26px var(--mono);letter-spacing:-.01em}
fieldset{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;min-width:0}
legend{font-family:var(--display);font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--mute);padding:0;margin-bottom:10px}
.opts{display:grid;gap:8px}
.opts.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.opts.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.opt{position:relative;display:block}
.opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.opt .face{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);padding:12px 14px;height:100%;transition:border-color .15s}
.opt:hover .face{border-color:var(--mute)}
.opt input:checked + .face{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.opt input:focus-visible + .face{outline:2px solid var(--ink);outline-offset:2px}
.opt .t{font-family:var(--display);font-size:15px;font-weight:400;display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.opt .t .mono{font-size:12px;color:var(--mute);font-weight:400}
.opt .d{font-size:13px;color:var(--mute);line-height:1.45}
.sw{width:22px;height:22px;border-radius:50%;outline:1px solid var(--line);flex:none}
.opt.swatch .face{flex-direction:row;align-items:center;gap:10px}
.qty-row{display:flex;gap:12px;align-items:stretch}
.stepper{display:flex;border:1px solid var(--line)}
.stepper button{width:44px;font-size:18px}
.stepper button:hover{background:var(--wash)}
.stepper output{min-width:36px;display:grid;place-items:center;font-family:var(--mono)}
.qty-row .btn{flex:1}
.notes{border-top:1px solid var(--line);display:flex;flex-direction:column}
.notes div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.notes dt,.notes .k{font-family:var(--display);letter-spacing:.18em;text-transform:uppercase;font-size:11px;color:var(--mute);padding-top:3px}

/* ---------- info / about / contact ---------- */
.prose{max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:18px;text-align:left}
.prose p{color:var(--mute)}
.prose h2{font-size:28px;margin-top:24px;text-align:left}
.table-wrap{overflow-x:auto;width:100%;max-width:760px;margin:0 auto}
table{border-collapse:collapse;width:100%;font-size:14px;text-align:left}
th{font-family:var(--display);font-weight:400;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute);padding:10px 12px;border-bottom:1px solid var(--ink)}
td{padding:12px;border-bottom:1px solid var(--line);font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
td:first-child,th:first-child{padding-left:0}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,6vw,80px);align-items:center;text-align:left;padding-block:clamp(48px,8vw,96px)}
@media (max-width:760px){.split{grid-template-columns:minmax(0,1fr)}}
.split .prose{margin:0}
form{display:flex;flex-direction:column;gap:18px;width:100%;max-width:560px;margin:0 auto;text-align:left}
label.f{display:flex;flex-direction:column;gap:6px;font-family:var(--display);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--mute)}
input.i,select.i,textarea.i{font:16px var(--body);color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line);padding:10px 0;border-radius:0;width:100%;letter-spacing:0;text-transform:none}
input.i:focus,select.i:focus,textarea.i:focus{outline:0;border-bottom-color:var(--ink)}
select.i option{background:var(--paper);color:var(--ink)}
textarea.i{min-height:120px;resize:vertical}
.status{font-size:14px;color:var(--ink);border-left:2px solid var(--ink);padding:4px 0 4px 12px}
.copy-line{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}
.linkish{font-family:var(--display);font-size:12px;letter-spacing:.2em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:2px}

/* ---------- cart drawer ---------- */
.scrim{position:fixed;inset:0;background:var(--scrim);z-index:60}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--paper);z-index:61;border-left:1px solid var(--line);display:flex;flex-direction:column;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-right:env(safe-area-inset-right,0px)}
.drawer-head{height:var(--bar);display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 24px;border-bottom:1px solid var(--line)}
.drawer-head h2{font-size:14px;font-weight:400;letter-spacing:.32em;text-transform:uppercase}
.drawer-body{flex:1;overflow-y:auto;padding:8px 24px}
.drawer-foot{border-top:1px solid var(--line);padding:20px 24px;display:flex;flex-direction:column;gap:12px}
.line{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);align-items:start}
.line .photo{--ar:1/1}
.line h3{font-size:15px;font-weight:400}
.line .spec{font-size:12px;color:var(--mute);line-height:1.5}
.line .mini{display:flex;gap:12px;align-items:center;margin-top:8px}
.line .mini .stepper button{width:30px;height:30px;font-size:15px}
.line .mini .stepper output{min-width:26px;font-size:13px}
.line .rm{font-size:12px;color:var(--mute);text-decoration:underline}
.line .amt{font:400 14px var(--mono)}
.sum{display:flex;justify-content:space-between;font-size:14px}
.sum.total{font-size:16px}
.sum .mono{font-weight:500}
.empty{padding:48px 0;text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center;color:var(--mute)}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding-block:48px max(32px,env(safe-area-inset-bottom,0px))}
.foot{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:700px){.foot{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.foot > :first-child{grid-column:1/-1}}
.foot h4{margin:0 0 12px;font-family:var(--display);font-weight:400;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mute)}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;font-size:14px}
.foot ul button:hover{text-decoration:underline}
.foot .wordmark-s{font-family:var(--display);font-weight:300;letter-spacing:.32em;text-transform:uppercase;font-size:18px}
.legal{margin-top:40px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--mute)}

.toast{position:fixed;left:50%;bottom:max(24px,calc(env(safe-area-inset-bottom,0px) + 16px));transform:translateX(-50%);z-index:70;background:var(--ink);color:var(--paper);padding:12px 20px;font-size:14px;display:flex;gap:16px;align-items:center;max-width:calc(100% - 32px)}
.toast button{text-decoration:underline;font-size:13px}

/* ---------- sale ---------- */
.was{color:var(--mute);margin-right:8px;font-size:.85em}
.price .was{font-size:18px}
.pct-tag{position:absolute;top:10px;left:10px;z-index:2;background:var(--ink);color:var(--paper);font:500 11px/1 var(--mono);letter-spacing:.06em;padding:6px 8px}
.frame-box{position:relative}
.pct-pill{font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--ink);padding:5px 8px}
.notice-strip{background:var(--ink);color:var(--paper);text-align:center;padding-block:14px}
.notice-strip p{font-family:var(--display);letter-spacing:.22em;text-transform:uppercase;font-size:13px;max-width:var(--max);margin:0 auto}
.feature-link{display:block;width:100%}

/* ---------- admin ---------- */
.mg{display:flex;flex-direction:column;gap:48px;padding-block:8px clamp(64px,10vw,120px)}
.mg-sec{border-top:1px solid var(--ink);padding-top:20px;display:flex;flex-direction:column;gap:18px}
.mg-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px 20px;flex-wrap:wrap}
.mg-head h2{font-size:26px;font-weight:300}
.mg-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.mg-box{border:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
@media (max-width:720px){.mg-grid{grid-template-columns:minmax(0,1fr)}}
.mg-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mg-lbl{font-family:var(--display);font-size:13px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}
.mg-lbl.sm{font-size:11px;color:var(--mute)}
.mg-mini{font-size:13px;color:var(--mute);line-height:1.45}
.mg-status{font-size:14px;border-left:2px solid var(--line);padding:2px 0 2px 12px;color:var(--mute)}
.mg-status.err{border-left-color:var(--ink);color:var(--ink)}
.i.num{width:84px;font-family:var(--mono);font-variant-numeric:tabular-nums}
.btn.sm{padding:11px 18px;font-size:11px}
.btn[disabled]{opacity:.5;cursor:default}
.btn.danger{background:var(--ink);color:var(--paper)}
.switch{width:44px;height:24px;border-radius:12px;background:var(--line);position:relative;flex:none;transition:background .2s}
.switch span{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--paper);box-shadow:0 1px 2px rgba(0,0,0,.3);transition:transform .2s}
.switch[aria-checked="true"]{background:var(--ink)}
.switch[aria-checked="true"] span{transform:translateX(20px)}
.mg-add{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:760px){.mg-add{grid-template-columns:minmax(0,1fr)}}
.drop{position:relative;border:1px dashed var(--mute);min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px;text-align:center;cursor:pointer;background:var(--wash)}
.drop:hover{border-color:var(--ink)}
.drop:focus-within{outline:2px solid var(--ink);outline-offset:2px}
.drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:2;font-size:0}
.drop.over{border-color:var(--ink);border-style:solid}
.drop-status{font-size:14px;color:var(--ink)}
.drop img{max-height:320px;width:auto;max-width:100%}
.drop-t{font-family:var(--display);font-size:13px;letter-spacing:.24em;text-transform:uppercase}
.mg-fields{display:flex;flex-direction:column;gap:12px;min-width:0}
.mg-list{display:flex;flex-direction:column}
.mg-row{display:grid;grid-template-columns:88px minmax(0,1fr) auto auto;gap:16px 20px;padding:16px 0;border-bottom:1px solid var(--line);align-items:start}
.mg-row.off .mg-thumb,.mg-row.off .mg-title{opacity:.45}
.mg-thumb .photo{--ar:1/1}
.mg-title{font-family:var(--display);font-size:17px}
.mg-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.mg-ctrl{display:flex;flex-direction:column;gap:8px}
.mg-act{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.mg-ic{width:34px;height:30px;border:1px solid var(--line);font-size:14px}
.mg-ic:hover:not([disabled]){border-color:var(--ink)}
.mg-ic[disabled]{opacity:.3;cursor:default}
.mg-rep{position:relative;cursor:pointer;white-space:nowrap}
.mg-rep input{position:absolute;inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px);opacity:0;cursor:pointer;z-index:2;font-size:0}
.mg-rep:focus-within{outline:2px solid var(--ink);outline-offset:3px}
@media (max-width:860px){
  .mg-row{grid-template-columns:72px minmax(0,1fr)}
  .mg-ctrl,.mg-act{grid-column:1/-1}
  .mg-ctrl{flex-direction:row;flex-wrap:wrap;gap:12px 20px}
  .mg-act{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start}
}
@media (max-width:460px){.mg-two{grid-template-columns:minmax(0,1fr)}}
.mg-table td{white-space:nowrap}
.mg-table .i.num{padding:4px 0}
.mg-papers{gap:12px 24px}
.mg-pap{display:flex;align-items:center;gap:8px}

/* ---------- product views ---------- */
.shop-from{font-size:15px;letter-spacing:.02em}
.view-main .stage,.view-main .room{width:100%}
.flat{width:100%;box-shadow:0 10px 24px -14px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.06);background:#f6f6f3;padding:2%}
.thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.thumb{display:flex;flex-direction:column;gap:6px;text-align:left;min-width:0}
.thumb-box{display:block;border:1px solid var(--line);overflow:hidden;pointer-events:none}
.thumb[aria-selected="true"] .thumb-box{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.thumb:hover .thumb-box{border-color:var(--mute)}
.thumb-box .stage{padding:8%}
.thumb-box .ph-label,.thumb-box .wm{display:none}
.thumb-box .moulding,.thumb-box .flat,.thumb-box .loose{box-shadow:0 3px 6px -3px rgba(0,0,0,.5)}
.thumb-l{font-family:var(--display);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thumb[aria-selected="true"] .thumb-l{color:var(--ink)}
.room{position:relative;overflow:hidden;width:100%;max-width:100%;background:#e9e5df}
.room-wall{position:absolute;inset:0;background:radial-gradient(120% 90% at 30% 10%,#f3f0eb 0%,#e8e3dc 55%,#ddd7cf 100%)}
.room-floor{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg,#b9a48a 0%,#a48d72 100%);border-top:3px solid #f4f1ec}
.room-console{position:absolute;background:linear-gradient(180deg,#5b4636 0%,#4a382b 100%);box-shadow:0 10px 16px -8px rgba(0,0,0,.45)}
.room-console::after{content:"";position:absolute;left:0;right:0;top:0;height:9%;background:#6b5442}
.room-vase{position:absolute;background:#efece6;border-radius:40% 40% 18% 18%/30% 30% 14% 14%;box-shadow:inset -4px 0 8px rgba(0,0,0,.12)}
.room-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.room-art{position:absolute}
.room .moulding{box-shadow:0 8px 14px -8px rgba(0,0,0,.55);outline:0}
.room .loose{box-shadow:0 6px 12px -8px rgba(0,0,0,.5);padding:1.5%}
.room .ph-label{display:none}
.room-cap{font-size:13px;color:var(--mute);text-align:center}
.sw-white{background:#eeede9}.sw-black{background:#18191b}
.sw-oak,.f-oak{background:repeating-linear-gradient(90deg,#c29d6d 0 3px,#b38d5b 3px 5px,#c8a676 5px 9px,#b6905f 9px 11px)}
.f-oak{--mould:none}
.opt.dis{opacity:.45}.opt.dis input{cursor:not-allowed}
.pdesc{display:flex;flex-direction:column;gap:10px;color:var(--mute);font-size:15px;max-width:60ch}
.config label.f{margin-top:-6px}

/* ---------- faq & legal ---------- */
.faq{display:flex;flex-direction:column;gap:40px;max-width:760px}
.faq-g h2{font-size:24px;font-weight:300;margin-bottom:8px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:16px 32px 16px 0;position:relative;font-family:var(--display);font-size:17px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:12px;font-size:22px;font-weight:200}
.faq details[open] summary::after{content:"−"}
.faq-a{padding:0 0 20px;display:flex;flex-direction:column;gap:12px;color:var(--mute);font-size:15px}
.faq-a b{color:var(--ink);font-weight:700}
.faq-a .table-wrap{margin:4px 0}
.faq-a td{white-space:normal;font-family:var(--body)}
.legal-prose ul{margin:0;padding-left:20px;color:var(--mute);display:flex;flex-direction:column;gap:8px}
.legal-prose b{color:var(--ink)}

/* ---------- gift ---------- */
.gift-wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start;padding-bottom:clamp(64px,10vw,120px)}
@media (max-width:860px){.gift-wrap{grid-template-columns:minmax(0,1fr)}}
.gift-prev{position:sticky;top:calc(env(safe-area-inset-top,0px) + var(--bar) + 24px);display:flex;flex-direction:column;gap:10px}
@media (max-width:860px){.gift-prev{position:static}}
.gift-prev img,.gift-out img{width:100%;max-width:100%;aspect-ratio:8/5;background:#111214;box-shadow:0 18px 40px -22px rgba(0,0,0,.6)}
.gift-wrap form{margin:0;max-width:none}
.gift-amts{justify-content:flex-start}
.gift-out{display:flex;flex-direction:column;gap:10px;min-width:0}
.gift-thumb{width:72px;aspect-ratio:1/1;background:#111214;color:#f1f2f4;display:grid;place-items:center}
.gift-thumb .lg{width:70%;height:auto}
.code-form{gap:6px;max-width:none;margin:0}
.code-row{display:flex;gap:8px;align-items:end}
.code-row .i{flex:1;min-width:0;font-family:var(--mono);text-transform:uppercase}
.code-row .btn{flex:none}
.socials{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:8px;font-size:15px}
.soc{display:inline-flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center;text-decoration:none}
a.soc:hover{text-decoration:underline}
.foot a{text-decoration:none}.foot a:hover{text-decoration:underline}

/* ---------- admin extras ---------- */
.mg-how{max-width:60ch;text-align:center}.mg-how b{color:var(--ink)}
.mg-savebar{position:fixed;left:0;right:0;bottom:0;z-index:35;background:var(--ink);color:var(--paper);padding-top:12px;padding-bottom:max(12px,env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.mg-savebar-in{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.mg-savebar p{font-size:14px}
.mg-savebar .btn{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.mg-savebar .btn:hover{background:transparent;color:var(--paper)}
.mg-jump{display:flex;gap:10px 20px;flex-wrap:wrap;justify-content:center}
.mg-h3{font-family:var(--display);font-size:13px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin-top:8px}
.mg-table .i.num{width:76px}
.mg-table.out td{font-size:13px}
.mg-profit{display:block;font-size:11px;color:var(--mute)}
.mg-desc{min-height:54px;font-size:14px}
.room-test{max-width:520px}
.gift-row{grid-template-columns:minmax(0,1fr) auto auto}
@media (max-width:860px){.gift-row{grid-template-columns:minmax(0,1fr)}}
.mg-fields select.i{padding:8px 0}

/* ---------- launching soon ---------- */
.soon{position:fixed;inset:0;z-index:90;background:#fcfcfd;color:#111214;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(28px,5vh,48px);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));text-align:center}
.soon[hidden]{display:none!important}
.soon .lg{width:clamp(180px,30vw,320px);height:auto;max-width:100%}
.soon p{font-family:var(--display);font-weight:300;font-size:clamp(18px,3vw,30px);letter-spacing:.42em;padding-left:.42em;text-transform:uppercase}
body.soon-on{overflow:hidden}
.soon-note{background:var(--ink);color:var(--paper);text-align:center;padding-block:10px;font-size:13px}
.soon-note button{text-decoration:underline;font-size:13px}
main{min-height:60vh}
.view{animation:fade .45s ease both}
@keyframes fade{from{opacity:.25}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- launch build additions ---------- */
a.chip,a.card,a.back,a.linkish,.menu nav a,a.icon-btn,a.bar-brand,a.feature-link,.foot ul a,.soon-note a{text-decoration:none;color:inherit}
a.chip{color:var(--mute)}a.chip:hover{color:var(--ink)}
a.back{color:var(--mute)}
a.btn{display:inline-block;text-align:center;text-decoration:none;color:var(--paper)}
a.btn:hover{color:var(--ink)}
a.btn.ghost{color:var(--ink)}
a.btn.ghost:hover{color:var(--paper)}
.invert a.btn.ghost{color:var(--paper)}
.invert a.btn.ghost:hover{color:var(--ink)}
.menu nav a{font-family:var(--display);font-weight:200;font-size:clamp(24px,min(6vw,5.2vh),44px);letter-spacing:.06em;text-transform:uppercase;line-height:1.2;padding:4px 12px}
.menu nav a:hover,.menu nav a[aria-current="page"]{font-weight:400}
a.chip[aria-current="page"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
a.back{display:inline-block}
.foot ul a:hover{text-decoration:underline}
.soon-note a{text-decoration:underline}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.login{max-width:420px}
.mg-order.new{border-left:3px solid var(--ink);padding-left:12px}
.order-lines{margin:6px 0 0;padding-left:18px;font-size:14px;display:flex;flex-direction:column;gap:4px}
.msg-body{font-size:15px;margin-top:6px;white-space:normal}
.mg-msg,.mg-order{grid-template-columns:minmax(0,1fr) auto}
@media (max-width:860px){.mg-msg,.mg-order{grid-template-columns:minmax(0,1fr)}}
.mg-order select.i{min-width:180px}