:root{
  --lacquer:#0A0D0B; --lacquer-2:#121714; --rail:#070908; --void:#040605;
  --felt:#0F4630; --felt-hi:#17694A; --felt-deep:#082519; --felt-glow:rgba(23,105,74,.5);
  --brass:#C9A24B; --brass-hi:#E3C272; --brass-deep:#8E6B1F; --brass-text:#1B1404;
  --stock:#F7F1E1; --stock-2:#EDE4CC; --ink:#121512; --ink-2:#45503F;
  --oxblood:#7A1F2B; --oxblood-hi:#93283A; --mute:#A9B5AC; --mute-2:#7C8A80; --line:rgba(201,162,75,.28); --line-ink:rgba(142,107,31,.32);
  --on-felt:rgba(247,241,225,.8);
  --ok:#4ADE80; --aging:#E8C877; --stale:#C2410C; --stale-text:#FDBA74;
  --serif:'Playfair Display',Georgia,serif; --sans:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  --micro:.6875rem; --t-sm:.8125rem; --t-base:.9375rem; --t-md:1.125rem; --t-lg:1.375rem; --t-xl:1.875rem; --t-in:1rem;
  --col:430px;                                             
  --tab-h:calc(72px + env(safe-area-inset-bottom, 0px));   
  --dock-h:0px;                                            
}
*{box-sizing:border-box; margin:0;}

html{background:var(--void); scrollbar-width:none;}
html::-webkit-scrollbar, body::-webkit-scrollbar{display:none; width:0; height:0;}
body{font-family:var(--sans); font-size:var(--t-base); color:var(--stock); background:var(--lacquer); max-width:var(--col); margin:0 auto; min-height:100vh; min-height:100dvh; position:relative; isolation:isolate;
  padding-bottom:calc(var(--tab-h) + var(--dock-h) + 28px); -webkit-font-smoothing:antialiased; overflow-x:hidden; font-variant-numeric:lining-nums;}

body::before{content:""; position:fixed; z-index:-1; top:0; bottom:0; left:50%; width:100%; max-width:var(--col); transform:translateX(-50%); pointer-events:none;
  background:
    radial-gradient(72% 30% at 16% 0%, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 72%),
    linear-gradient(112deg, rgba(255,255,255,0) 31%, rgba(255,255,255,.045) 39%, rgba(255,255,255,.012) 45%, rgba(255,255,255,0) 53%),
    radial-gradient(100% 34% at 78% 100%, rgba(23,105,74,.13) 0%, rgba(23,105,74,0) 72%);}
a{color:inherit;} button{font:inherit; color:inherit;}
:focus-visible{outline:2px solid var(--brass); outline-offset:3px; border-radius:6px;}

.fresh, h2.sec small, .now b, .seal, .tag, .flag, .tabs a, .fact dt, .next small, .tl, .more h4, .pick .pv small, .bank small, .lim, .who, .ring, .advice b{
  font-family:var(--sans); font-weight:600; font-size:var(--micro); letter-spacing:.12em; text-transform:uppercase;}

.top{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:calc(6px + env(safe-area-inset-top, 0px)) 18px 6px; min-height:56px;}

.mark{display:inline-flex; flex-wrap:wrap; align-items:baseline; align-content:center; gap:.26em; min-height:44px; white-space:nowrap; text-decoration:none; font-size:1.8125rem;}
.mark b, .mark i{font-family:'Grand Hotel',cursive; font-style:normal; font-weight:400; font-size:inherit; line-height:30px; color:#FFEBDD; text-shadow:0 0 .03em #FFEBDD, 0 0 .12em #FF5A36, 0 0 .32em #FF5A36, 0 0 .8em rgba(255,90,54,.55);}
.top > .fresh:not(.aging):not(.stale):not(.plain){display:none;}
.top:has(> .mark){display:grid; grid-template-columns:44px minmax(0,1fr) 44px; grid-template-rows:44px; justify-items:center; align-items:center; gap:0; min-height:0;}
.top:has(> .mark) > .mark{grid-column:2; grid-row:1; margin:0; padding:0 12px;}
.top:has(> .mark) > .info{grid-column:3; grid-row:1 / -1; justify-self:end; margin:0 -12px 0 0;}
.top:has(> .mark):has(> .fresh.aging, > .fresh.stale, > .fresh.plain){grid-template-rows:30px 14px;}
.top:has(> .fresh.aging, > .fresh.stale, > .fresh.plain) > .mark{grid-row:1 / 3; align-self:stretch; align-content:flex-start; font-size:1.5625rem;}
.top:has(> .fresh.aging, > .fresh.stale, > .fresh.plain) > .mark b, .top:has(> .fresh.aging, > .fresh.stale, > .fresh.plain) > .mark i{line-height:24px;}
.top:has(> .mark) > .fresh{grid-column:2; grid-row:2; align-self:end; pointer-events:none;}

.checked, .lgChecked{margin:26px 18px 8px; text-align:center; font-size:var(--micro); line-height:1.4; letter-spacing:.02em; color:var(--mute-2);}

.checked .lnk{display:flex; width:max-content; margin:0 auto; font-size:var(--t-sm); letter-spacing:0;}
.back{display:inline-flex; align-items:center; gap:8px; min-height:44px; font-size:var(--t-sm); font-weight:500; text-decoration:none; color:var(--stock);}
.back::before{content:""; width:9px; height:9px; border-left:2px solid var(--mute); border-bottom:2px solid var(--mute); transform:rotate(45deg);}
.fresh{color:var(--mute); display:flex; align-items:center; gap:6px; min-width:0; line-height:1.3; text-wrap:balance;}   
.top .fresh{font-weight:500; letter-spacing:.02em; text-transform:none; gap:5px;}   
.fresh::before{content:""; flex:none; width:5px; height:5px; border-radius:50%; background:var(--ok);}
.fresh.aging{color:var(--aging);} .fresh.aging::before{background:var(--aging);}
.fresh.stale{color:var(--stale-text);} .fresh.stale::before{background:var(--stale);}
.fresh.plain::before{display:none;}

.top > :first-child{margin-right:auto;}
.info{flex:none; display:grid; place-items:center; width:44px; height:44px; margin:0 -12px 0 -8px; border-radius:50%; color:var(--mute);}
.info svg{display:block; width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round;}
.info .dot{fill:currentColor; stroke:none;}
.info[aria-current]{color:var(--stock);}
.info:focus-visible{outline:2px solid var(--stock); outline-offset:-6px;}

.old{margin:0 18px 10px; padding:10px 12px; border:1px solid rgba(194,65,12,.55); border-radius:10px; font-size:var(--t-sm); line-height:1.4; color:var(--stale-text);}
h1.title{font-family:var(--serif); font-weight:700; font-size:var(--t-xl); letter-spacing:-.01em; padding:6px 18px 2px;}
.sub{padding:0 18px; color:var(--mute); font-size:var(--t-sm); line-height:1.4;}
h2.sec{font-family:var(--serif); font-weight:700; font-size:var(--t-md); padding:26px 18px 12px; display:flex; align-items:baseline; justify-content:space-between; gap:12px;}
h2.sec small{color:var(--mute); white-space:nowrap;}

.now{margin:0 18px; padding:11px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"b t c" "e t c"; column-gap:14px; align-items:center; font-size:var(--t-sm); color:inherit; text-decoration:none;}
.now b{grid-area:b; align-self:end; color:var(--mute);}
.now b.live{color:var(--ok);}
.now span{grid-area:t; line-height:1.35; min-width:0;} .now em{grid-area:e; align-self:start; margin-top:1px; font-style:normal; font-size:var(--micro); color:var(--mute); font-variant-numeric:lining-nums tabular-nums;}
.now .chev{grid-area:c; margin:0 2px 0 0;}

.felt{position:relative; overflow-x:clip; isolation:isolate; background:radial-gradient(120% 90% at 50% 0%, var(--felt-hi) 0%, var(--felt) 42%, var(--felt-deep) 100%);
  box-shadow:inset 0 14px 16px -14px rgba(0,0,0,.8), inset 0 -16px 18px -14px rgba(0,0,0,.75), 0 -1px 0 var(--brass-deep), 0 1px 0 var(--brass-deep), 0 44px 56px -44px var(--felt-glow);}
.felt::before{content:""; position:absolute; inset:0; opacity:.5; mix-blend-mode:overlay; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");}
.felt > *{position:relative;}

.band{padding:18px 0 22px;}
.felt h1.title, .felt h2.sec{padding-top:0;} .felt .sub, .felt h2.sec small{color:var(--on-felt);}

.flushT{text-align:center; font-family:var(--serif); font-weight:700; font-size:var(--t-lg); line-height:1.15; letter-spacing:.01em;}

.pull{position:relative; z-index:2; width:var(--pull, min(78%, 300px)); aspect-ratio:5 / 7; margin:0 auto; container-type:inline-size; --vsd-radius:4.8cqw; --vsd-focus:var(--stock);}
.pull.dealing .pc-fp{visibility:hidden;}   

.rail{display:flex; gap:14px; overflow-x:auto; padding:4px 18px 20px; scroll-snap-type:x mandatory; scroll-padding-left:18px; scrollbar-width:none;}
.rail::-webkit-scrollbar{display:none;}
.rail > .pc{flex:none; width:204px; scroll-snap-align:start;}
.rail > .pc[data-face="quiet"]{width:156px;}

.rail > .keep{flex:none; width:204px; scroll-snap-align:start;}
.rail > .keep[data-face="quiet"]{width:156px;}
.cap{margin-top:14px; text-align:center; font-size:var(--t-sm); line-height:1.4; color:var(--on-felt); overflow-wrap:anywhere; font-variant-numeric:lining-nums tabular-nums;}

.dist, .row b .dist{display:inline; font-size:var(--micro); line-height:inherit; color:var(--mute); font-variant-numeric:lining-nums tabular-nums; margin:0 0 0 6px; font-weight:500; white-space:nowrap;}
.geo-note{margin:12px 18px 0; font-size:var(--t-sm); line-height:1.45; color:var(--mute);}
.felt .geo-note{color:var(--on-felt);}
.geo-note[hidden], .say[hidden]{display:none;}
.lnk{display:inline-flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding:0; background:none; border:0; cursor:pointer; font-size:var(--t-sm); font-weight:600; color:var(--stock); text-decoration:underline; text-decoration-color:var(--mute-2); text-underline-offset:3px;}
.felt .lnk{text-decoration-color:var(--on-felt);}

.list{margin:0 18px; border-top:1px solid var(--line);}
.row{display:flex; gap:14px; align-items:center; padding:13px 0; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; min-height:64px;}
.row .tx{min-width:0; flex:1; overflow-wrap:anywhere;}
.row b{display:block; font-weight:600; font-size:var(--t-base); line-height:1.25;}
.row span{display:block; font-size:var(--t-sm); color:var(--mute); margin-top:2px; line-height:1.35;}
.chev{flex:none; width:8px; height:8px; border-right:2px solid var(--mute-2); border-bottom:2px solid var(--mute-2); transform:rotate(-45deg); margin-right:4px;}

span.logo{flex:none; margin:0; position:relative; display:grid; place-items:center; width:34px; height:34px; border-radius:9px; overflow:hidden; background:var(--stock); box-shadow:0 0 0 1px var(--line);
  font-family:var(--serif); font-weight:700; font-size:var(--t-md); line-height:1; color:var(--ink);}
.logo img{position:absolute; inset:0; width:100%; height:100%; background:#fff; object-fit:contain; padding:3px; opacity:0;}
.logo img.on{opacity:1;}

.seal{display:inline-flex; align-items:center; gap:6px; color:var(--mute); margin-top:4px;}
.seal::before{content:""; width:7px; height:7px; border-radius:50%; border:1px solid var(--mute);}

.tag, .flag{display:inline-block; font-style:normal; margin-left:8px; color:var(--stock); background:var(--oxblood); border-radius:4px; padding:2px 6px 1px; vertical-align:1px;}

.save{flex:none; width:44px; height:44px; display:grid; place-items:center; background:none; border:0; padding:0; cursor:pointer;}
.save svg{width:22px; height:22px; fill:none; stroke:var(--mute); stroke-width:1.7; stroke-linejoin:round;}
.save[aria-pressed="true"] svg{fill:var(--oxblood-hi); stroke:var(--oxblood-hi);}

.btn{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:52px; border-radius:12px; border:0; text-decoration:none; font-weight:600; font-size:var(--t-base); cursor:pointer;
  color:var(--brass-text); background:linear-gradient(180deg, var(--brass-hi) 0%, var(--brass) 46%); box-shadow:0 1px 0 rgba(255,255,255,.4) inset, 0 10px 18px -10px rgba(0,0,0,.8);}
.btn.ghost{background:none; color:var(--stock); border:1px solid var(--line); box-shadow:none;}
.field{display:flex; align-items:center; gap:10px; margin:14px 18px 0; min-height:48px; padding:0 14px; background:var(--lacquer-2); border:1px solid var(--line); border-radius:12px; box-shadow:inset 0 2px 6px rgba(0,0,0,.6);}
.field:focus-within, .dock form input:focus-visible{border-color:var(--stock); box-shadow:0 0 0 2px rgba(247,241,225,.3);}
.field input{flex:1; min-width:0; min-height:46px; background:none; border:0; outline:0; color:var(--stock); font:inherit; font-size:var(--t-in);}
.field input::placeholder{color:var(--mute-2);}
.opts{display:flex; gap:8px; padding:12px 18px 0; overflow-x:auto; scrollbar-width:none;} .opts::-webkit-scrollbar{display:none;}
.opt{flex:none; min-height:40px; padding:0 14px; border-radius:10px; border:1px solid var(--line); background:none; font-size:var(--t-sm); font-weight:500; color:var(--mute); cursor:pointer;}
.opt[aria-pressed="true"]{color:var(--ink); background:var(--stock); border-color:var(--stock); font-weight:600;}

.stage{min-height:calc(100dvh - var(--tab-h) - 56px);}

#ageGate{position:fixed; inset:0; z-index:1000; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; padding:24px; background:radial-gradient(120% 90% at 50% 0%, var(--felt-hi) 0%, var(--felt) 42%, var(--felt-deep) 100%);}
#ageGate .gate{position:relative; width:100%; max-width:340px; padding:30px 26px 26px; background:var(--stock); color:var(--ink); border-radius:18px; text-align:center; box-shadow:0 26px 40px -18px rgba(0,0,0,.75);}

#ageGate .mark{min-height:0; font-size:3.25rem; padding-bottom:.14em;} #ageGate .mark b, #ageGate .mark i{line-height:1.05; text-shadow:0 0 .03em #FFEBDD, 0 0 .12em #FF5A36, 0 0 .32em #FF5A36, 0 0 .8em rgba(255,90,54,.55), .04em .06em .04em rgba(4,6,5,.6);}
@media (max-height:640px){ #ageGate{gap:12px;} #ageGate .mark{font-size:2.5rem;} }
#ageGate h2{font-family:var(--serif); font-weight:800; font-size:var(--t-xl); color:var(--oxblood);}
#ageGate p{margin:10px 0 20px; font-size:var(--t-base); line-height:1.45; color:var(--ink-2);}
#ageGate .btn{position:relative; z-index:1;} #ageGate .btn + .btn{margin-top:10px;}
#ageGate .btn.ghost{color:var(--ink-2); border-color:var(--line-ink);}

#ageGate .fine{margin:16px 0 0; font-size:var(--micro); line-height:1.45; color:var(--ink-2);}
#ageGate .agree{margin-top:6px;}
#ageGate .agree span{white-space:nowrap;}
#ageGate .lnk{min-width:0; padding:0 8px; margin:0 -8px; font-size:inherit; color:var(--ink); text-decoration-color:var(--line-ink);}   

.dock{position:fixed; left:50%; transform:translateX(-50%); width:100%; max-width:var(--col); bottom:var(--tab-h); z-index:15; background:linear-gradient(180deg,rgba(10,13,11,0) 0,var(--lacquer) 22px); padding-top:26px;}
.flank{display:flex; justify-content:space-between; align-items:center; height:34px; padding:0 18px; font-size:var(--micro); color:var(--mute-2); font-variant-numeric:lining-nums tabular-nums;}
.flank span{max-width:calc(50% - 34px); white-space:nowrap;}

.tabs{position:fixed; left:50%; transform:translateX(-50%); width:100%; max-width:var(--col); bottom:0; height:var(--tab-h); padding-bottom:calc(8px + env(safe-area-inset-bottom, 0px)); background:linear-gradient(180deg, var(--lacquer-2) 0, var(--rail) 14px); border-top:1px solid var(--brass-deep); box-shadow:0 1px 0 rgba(255,255,255,.06) inset; display:flex; z-index:20;}
.tabs::before{content:""; position:absolute; left:0; right:0; bottom:100%; height:46px; pointer-events:none; background:linear-gradient(180deg, rgba(7,9,8,0) 0%, rgba(7,9,8,.94) 100%);}
body.has-dock .tabs::before{display:none;}
.tabs a{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:var(--mute-2); text-decoration:none; position:relative;}
.tabs a.on{color:var(--stock);}
.tabs a > svg{width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
.tabs a.ask{color:var(--stock); gap:5px;}

.tabs .dot{position:absolute; left:50%; top:50%; width:9px; height:9px; margin:-25px 0 0 7px; border-radius:50%; background:var(--oxblood-hi); box-shadow:0 0 0 2px var(--rail);}

.ztab{display:block; width:42px; margin-top:-32px; border-radius:3px; box-shadow:0 0 0 4px var(--rail), 0 0 0 5px var(--line-ink), 0 12px 18px -8px rgba(0,0,0,.9);}
.tabs a.ask.on .ztab{box-shadow:0 0 0 4px var(--rail), 0 0 0 6px var(--stock), 0 12px 18px -8px rgba(0,0,0,.9);}

@media (max-width:340px){ .top{padding-left:14px; padding-right:14px; gap:8px;} }

@media (max-height:700px){

  .now{padding:5px 0;}

  .top:has(> .mark){padding-top:calc(3px + env(safe-area-inset-top, 0px)); padding-bottom:3px;}
  .mark{font-size:1.6875rem;}
  .flushT{font-size:var(--t-md);}
}