/* lorvaxardoxeno.com: Lauscha mouth-blown glass ornaments. Silvered glass under translucent lacquer, crimped caps,
   wire loops, threads, a tissue-lined compartment box; one workshop window reflected on every glass thing.
   Devices: floating-objects (spheres on threads, lift 1-3) + glass-blur (frosted plates with a double rim).
   Breakpoints: <768 mobile (Figma 360), 768-1199 tablet, >=1200 desktop (Figma 1368). --u scales decor only. */
:root{
  --lac:#3B3C8F;--lacDeep:#22225A;--lacSoft:#4E4FA8;--ink:#1B1A38;--tissue:#F4F0E6;--tissue2:#E8E1CF;--mist:#D3D4F0;
  --silver:#ECEDF6;--silverMid:#A9ABCB;--silverDark:#5D5F8E;--gold:#C9A24A;--goldLt:#F2DA94;--goldDk:#86661F;
  --serif:'Instrument Serif',Georgia,serif;--sans:'Inclusive Sans',system-ui,sans-serif;
  --lift1:0 5px 12px rgba(34,34,90,.45);--lift2:0 12px 28px rgba(34,34,90,.5);--lift3:0 24px 52px rgba(34,34,90,.55);
  --u:1px;--pad:20px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:linear-gradient(180deg,var(--lac),var(--lacDeep));color:#fff;font:400 15px/1.6 var(--sans);overflow-x:hidden}
h1,h2,h3,p,ul,ol,dl,dd,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--goldLt);outline-offset:3px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--tissue);color:var(--ink);padding:10px 16px;border-radius:999px}
.skip:focus{top:12px}
.w{position:relative;z-index:1;width:min(100%,1368px);margin-inline:auto;padding-inline:var(--pad)}
.ar{width:16px;height:11px;flex:none}

/* ---------- glass: bauble, bead, window glint, hanger ---------- */
.bb{position:absolute;display:block;width:var(--d);transform-origin:50% 0;z-index:0}
.bb>i{display:block}
.bb .th{width:1.5px;height:calc(var(--th) + 2px);margin:0 auto -2px;background:var(--silverMid);opacity:.85}
.cp{position:relative;height:calc(var(--d) * .2)}
.cp::before{content:"";position:absolute;left:calc(50% - var(--d) * .05);top:0;width:calc(var(--d) * .1);height:calc(var(--d) * .1);border:max(1.5px,calc(var(--d) * .014)) solid var(--goldLt);border-radius:50%}
.cp::after{content:"";position:absolute;left:calc(50% - var(--d) * .12);top:calc(var(--d) * .08);width:calc(var(--d) * .24);height:calc(var(--d) * .12);border-radius:calc(var(--d) * .025);
  background:repeating-linear-gradient(90deg,transparent 0 calc(var(--d) * .048 - max(1px,calc(var(--d) * .008))),rgba(134,102,31,.55) 0 calc(var(--d) * .048)),linear-gradient(90deg,var(--goldDk),var(--goldLt) 32%,var(--gold) 62%,var(--goldDk))}
.sph{position:relative;width:var(--d);height:var(--d);border-radius:50%;background:radial-gradient(circle calc(var(--d) * .78) at 36% 30%,var(--c1),var(--c2) 42%,var(--c3) 100%)}
.sph::after{content:"";position:absolute;left:20%;top:74%;width:60%;height:18%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--cb) 55%,transparent),transparent)}
.l1 .sph,.l1.cvr{box-shadow:var(--lift1)}.l2 .sph,.l2.cvr{box-shadow:var(--lift2)}.l3 .sph,.l3.cvr{box-shadow:var(--lift3)}
/* the workshop window: four rounded panes tilted 28deg, the right column dimmer; follows the cursor by ±12 px */
.gl{position:absolute;display:block;left:calc(var(--gd) * .24);top:calc(var(--gd) * .1);width:calc(var(--gd) * .34);height:calc(var(--gd) * .26);transform:rotate(-28deg);transform-origin:0 0;filter:blur(max(.5px,calc(var(--gd) * .006)));translate:var(--mx,0px) var(--my,0px);transition:translate .35s ease-out;pointer-events:none;--gd:var(--d);--go:.85}
.gl>i{position:absolute;display:block;width:calc(var(--gd) * .11);height:calc(var(--gd) * .095);border-radius:calc(var(--gd) * .035);background:#fff}
.gl>i:nth-child(1){left:0;top:0;opacity:var(--go)}
.gl>i:nth-child(2){left:0;top:calc(var(--gd) * .117);opacity:calc(var(--go) * .9)}
.gl>i:nth-child(3){left:calc(var(--gd) * .132);top:calc(var(--gd) * .012);width:calc(var(--gd) * .0935);opacity:calc(var(--go) * .7)}
.gl>i:nth-child(4){left:calc(var(--gd) * .132);top:calc(var(--gd) * .129);width:calc(var(--gd) * .0935);opacity:calc(var(--go) * .6)}
.bd{display:inline-block;flex:none;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--c1),var(--c2) 50%,var(--c3))}
@keyframes sway{from{transform:rotate(-2deg)}to{transform:rotate(2deg)}}
.bb:hover,.mb:hover .bb{animation:sway 1.8s ease-in-out infinite alternate}
.sec>.w,.hero>.w{pointer-events:none}
.sec>.w *,.hero>.w *{pointer-events:auto}
.dk{display:none}

/* frosted plate (glass-blur) with the double rim */
.fr{position:relative;background:rgba(244,240,230,var(--fa,.16));-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.5);border-radius:24px}
.fr::after{content:"";position:absolute;inset:5px;border:1px solid rgba(255,255,255,.22);border-radius:19px;pointer-events:none}

/* a cover hung like an ornament */
.hung{display:flex;flex-direction:column;align-items:center}
.hg{position:relative;width:60px;height:calc(var(--ht) + 20px)}
.hg .th{position:absolute;left:29.25px;top:0;width:1.5px;height:calc(var(--ht) + 1px);background:var(--silverMid);opacity:.85}
.hg .cp{position:absolute;left:0;right:0;top:calc(var(--ht) - 2px);--d:92px}
.cvr{position:relative;width:100%;aspect-ratio:416/300;border-radius:24px;overflow:hidden;container-type:size;transition:transform .3s ease-out,box-shadow .3s ease-out}
.big .cvr{aspect-ratio:600/440}
.cvr>img{width:100%;height:100%;object-fit:cover}
.cvr::after{content:"";position:absolute;inset:0;border:2px solid rgba(255,255,255,.65);border-radius:24px}
.cvr .rim{position:absolute;inset:7px;border:1px solid rgba(255,255,255,.35);border-radius:18px}
.cvr .gl{--gd:calc(min(100cqw,100cqh) * .9);--go:.22;left:5cqw;top:4cqh}

/* buttons and links */
.pill{display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:linear-gradient(180deg,#fff,var(--silver) 50%,var(--silverMid));color:var(--ink);font:600 14px/1.25 var(--sans);text-decoration:none;cursor:pointer;box-shadow:var(--lift1);transition:box-shadow .25s,background .25s}
.pill:hover{box-shadow:var(--lift2);background:linear-gradient(180deg,#fff,#fff 50%,var(--silver))}
.lk{display:inline-flex;align-items:center;gap:8px;font:600 15px/1.3 var(--sans);text-decoration:underline}
.lk.sm{font-size:14px}
.lk.gold{color:var(--goldLt)}
.lk:hover .ar{translate:3px 0}
.lk .ar{transition:translate .2s}
.chip{display:inline-flex;align-items:center;gap:8px;font:500 14px/1.3 var(--sans);color:#fff;white-space:nowrap}
.crumbs ol{display:flex;flex-wrap:wrap;gap:10px;font-size:14px;color:var(--mist)}
.crumbs li{display:flex;gap:10px}
.crumbs li+li::before{content:"›"}
.crumbs [aria-current]{color:#fff;font-weight:600}
.h2{font:400 40px/1 var(--serif);letter-spacing:-.015em}
.h3{font:400 28px/1.05 var(--serif);letter-spacing:-.01em}
.ld{color:var(--mist);max-width:640px}

/* header + floating menu bauble */
.top{height:88px}
.top .w{height:100%}
.logo{position:absolute;top:26px;left:var(--pad);display:flex;align-items:center;gap:10px;font:400 24px/1 var(--serif);letter-spacing:-.005em;text-decoration:none}
.mk{position:relative;display:block;width:19px;height:19px}
.mk .bd{width:100%;height:100%;border:1px solid rgba(255,255,255,.6)}
.mk .gl{--gd:19px;--go:.9;left:3px;top:2px}
.cur{position:absolute;top:58px;left:var(--pad);display:flex;align-items:center;gap:8px;font:500 13px/1.2 var(--sans);color:var(--mist)}
.cur .bd{width:8px;height:8px}
.mnu{position:fixed;top:0;right:var(--pad);z-index:60;--u:1px}
.mb{position:relative;display:flex;align-items:flex-start;padding:0;border:0;background:none;cursor:pointer}
.mb .bb{position:relative;--d:52px !important;--th:8px !important}
.mbl{display:none}
.ml{position:absolute;right:calc(52px * .32);top:calc(8px + 52px * .2 + 52px * .38);width:calc(52px * .36);display:grid;gap:calc(52px * .11 - 2px)}
.ml i{display:block;height:2px;border-radius:1px;background:var(--ink)}
.panel{position:absolute;right:0;top:84px;min-width:220px;padding:14px 22px;--fa:.2;background-color:rgba(34,34,90,.55)}
.panel[hidden]{display:none}
.panel a{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px 0;font:400 30px/1.1 var(--serif);text-decoration:none}
.panel li+li{border-top:1px solid rgba(255,255,255,.2)}
.panel a[aria-current]{color:var(--goldLt)}
.panel a:hover span,.panel a:hover{text-decoration:underline;text-decoration-thickness:1px}

/* ---------- hero: the glass robin, cropped by the edges ---------- */
.hero{position:relative;overflow:hidden;min-height:860px}
.hero .bb{z-index:1}
.ht{padding-top:92px;z-index:3}
.hero h1{font:400 54px/.92 var(--serif);letter-spacing:-.025em;max-width:320px}
.hero h1 em{font-style:italic}
.ht p{margin-top:18px;font-size:15px;color:var(--mist);max-width:320px}
.ht .pill{margin-top:18px}
.robin{position:absolute;left:110px;top:450px;width:300px;z-index:2;filter:drop-shadow(0 24px 40px rgba(34,34,90,.55))}
.robin img{width:100%;height:auto}
.rgl{position:absolute;left:150px;top:580px;z-index:2}
.rgl .gl{--gd:120px;--go:.45;left:0;top:0}
.tth{position:absolute;left:103px;top:578px;width:1.5px;height:48px;background:var(--silverMid);opacity:.8;z-index:3}
.tag{position:absolute;left:20px;top:612px;width:168px;padding:24px 14px 14px;z-index:4;--fa:.2;box-shadow:var(--lift2)}
.tag .hole{position:absolute;left:calc(50% - 6px);top:10px;width:12px;height:12px;border:1.5px solid rgba(255,255,255,.8);border-radius:50%}
.tag div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0}
.tag div+div{border-top:1px solid rgba(255,255,255,.25)}
.tag dt{font-size:12px;color:var(--mist)}
.tag dd{font:400 16px/1.2 var(--serif);text-align:right}
.tray{display:none}

/* G: two hung covers per row */
.sec{position:relative;overflow:hidden;padding:64px 0}
.sec.gs{padding:24px 0 64px}
.gw{display:grid;gap:28px}
.side{display:grid;gap:18px;align-content:start}
.side p{color:var(--mist)}
.cards{display:grid;gap:36px 24px}
.card{position:relative}
.pl{display:grid;gap:10px;padding:18px 18px 20px;transition:background-color .3s}
.pt{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pt h3{font:400 30px/1.05 var(--serif);letter-spacing:-.01em}
.pl .ol{color:#fff}
.pl .mt{font-size:13px;color:var(--mist)}
.st::after{content:"";position:absolute;inset:0;z-index:2}
.card:hover .cvr,.card:focus-within .cvr{transform:translateY(-8px);box-shadow:var(--lift3)}
.card:hover .cvr .gl,.card:focus-within .cvr .gl{translate:calc(var(--mx,0px) + 12px) var(--my,0px)}
.card:hover .pl,.card:focus-within .pl{--fa:.3}

/* X: side-by-side table */
.w8{max-width:820px}
.xs .ld{margin-top:32px}
.tbl{margin-top:32px;padding:8px 16px;--fa:.14}
.tbl table{width:100%;border-collapse:collapse}
.tbl thead{display:none}
.tbl tr{display:grid;gap:6px;padding:16px 0}
.tbl tr+tr{border-top:1px solid rgba(255,255,255,.2)}
.tbl th[scope=row] a{display:flex;align-items:center;gap:12px;text-decoration:none;font:400 22px/1.1 var(--serif)}
.tbl th[scope=row] a:hover span{text-decoration:underline;text-decoration-thickness:1px}
.tbl .tb{width:48px;height:36px;object-fit:cover;border-radius:10px}
.tbl td{font-size:14px;color:var(--mist);text-align:left}
.tbl td[data-l]::before{content:attr(data-l) ": "}
.tbl td.dv{display:none}

/* C: four lacquers */
.cs{background:var(--lacDeep)}
.cs .ld{margin-top:32px}
.gens{display:grid;grid-template-columns:repeat(2,1fr);align-items:start;gap:16px;margin-top:32px;--u:.625px}
.gens li{display:grid;gap:14px;align-content:start;padding:18px 14px;--fa:.1}
.hold{position:relative;display:block;width:76px;height:96px}
.hold .bb{left:0;top:0}
.gens h3{font:400 26px/1.05 var(--serif)}
.gens .lq{font:500 13px/1.3 var(--sans);color:var(--goldLt)}
.gens p:last-child{font-size:13px;color:var(--mist)}

/* L: glossary on tissue */
.ls{background:var(--tissue);color:var(--ink)}
.ls .ld{margin-top:32px;color:var(--silverDark)}
.ring{position:absolute;right:-50px;top:40px;width:160px;height:160px;border:1.5px solid var(--silverMid);border-radius:50%;z-index:0}
.terms{display:grid;margin-top:32px}
.terms div{padding:22px 0;border-top:1px solid rgba(169,171,203,.8)}
.terms dt{font:italic 400 26px/1.15 var(--serif)}
.terms dd{margin-top:8px}

/* F: accordion of frosted plates */
.fs .h2{margin-bottom:32px}
.faq{display:grid;gap:12px;max-width:920px}
.faq details{--fa:.1;padding:16px}
.faq details[open]{--fa:.22}
.faq summary{display:flex;align-items:center;gap:16px;font:600 16px/1.35 var(--sans);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{flex:1}
.faq summary .ar{width:18px;height:12px;color:var(--goldLt);transition:transform .25s}
.faq details[open] .ar{transform:rotate(90deg)}
.faq details p{margin-top:12px;color:#fff}
.faq summary:hover span{text-decoration:underline;text-decoration-thickness:1px}

/* footer */
.foot{position:relative;overflow:hidden;background:var(--lacDeep);padding:72px 0 32px}
.fbb{top:0}
.fc{display:grid;gap:28px}
.f1 .logo{position:static;font-size:26px}
.f1 .mk{width:21px;height:21px}
.f1 p{margin-top:16px;color:var(--mist)}
.foot h2{font:400 26px/1.1 var(--serif);margin-bottom:12px}
.foot ul{display:grid;gap:12px}
.foot li a,.foot li span,.foot button{font-size:15px;color:var(--mist)}
.foot li a,.foot li span,.foot button{text-decoration:underline}
.foot button{background:none;border:0;padding:0;cursor:pointer;text-align:left}
.foot li a:hover,.foot button:hover{color:#fff}
.fb{display:grid;gap:12px;margin-top:32px;padding-top:32px;border-top:1px solid rgba(255,255,255,.25);font-size:13px;color:var(--mist)}

/* inner page intros */
.sec.intro{padding:16px 0 40px}
.intro .w{display:grid;gap:20px}
.intro h1{font:400 48px/.95 var(--serif);letter-spacing:-.02em;max-width:900px}
.ai .ld{color:#fff;font-size:16px;max-width:620px}
.li .ld{color:#fff;max-width:680px}
.li .w{gap:16px}
.upd{font-size:14px;color:var(--goldLt)}
.legend{display:flex;flex-wrap:wrap;gap:10px 20px}

/* games: one game per screen */
.sec.scr{padding:48px 0}
.scr.dp{background:var(--lacDeep)}
.sr{display:flex;flex-direction:column;gap:20px}
.hung.big{width:100%}
.stx{display:grid;gap:16px;justify-items:start}
.stx h2{font:400 44px/.95 var(--serif);letter-spacing:-.02em}
.facts{justify-self:stretch;padding:14px 20px;--fa:.1}
.facts div{display:flex;gap:16px;padding:8px 0}
.facts div+div{border-top:1px solid rgba(255,255,255,.18)}
.facts dt{flex:none;width:100px;font-size:13px;color:var(--goldLt)}
.facts dd{font-size:14px}

/* game page */
.sec.op{padding:12px 0 40px}
.op .w{display:grid;gap:28px}
.orow{display:flex;flex-direction:column;gap:24px}
.otx{display:grid;gap:20px;justify-items:start;align-content:start}
.otx h1{font:400 54px/.92 var(--serif);letter-spacing:-.025em}
.otx p{font-size:16px}
.otx .mt{font-size:13px;color:var(--mist)}
.sec.fband{background:var(--lacDeep);padding:32px 0}
.fgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:20px}
.fgrid div{display:grid;gap:6px;align-content:start;padding:14px 16px 16px;--fa:.1}
.fgrid dt{font:500 12px/1.3 var(--sans);color:var(--goldLt)}
.fgrid dd{font-size:13px}
.sec.art{padding:48px 0 56px}
.col{display:grid;gap:22px;max-width:720px;margin-inline:auto}
.col .a2{font-size:36px}
.col>p{color:#fff}
.col>p.mist{color:var(--mist)}
.keys{padding:10px 20px;--fa:.12}
.keys div{display:flex;align-items:center;gap:16px;padding:10px 0}
.keys div+div{border-top:1px solid rgba(255,255,255,.18)}
.keys dt{flex:none;width:130px}
kbd{display:block;padding:6px 14px;border-radius:999px;background:linear-gradient(180deg,#fff,var(--silverMid));color:var(--ink);font:600 13px/1.3 var(--sans)}
.pq{padding:28px 0;border-block:1px solid rgba(242,218,148,.6)}
.pq p{font:italic 400 30px/1.05 var(--serif)}
.tips{display:grid;gap:22px}
.tips li{display:flex;gap:14px}
.tips .ar{width:18px;height:12px;margin-top:6px;color:var(--goldLt)}
.faq.sm details{padding:16px 20px}
.faq.sm summary{font-size:16px}
.faq.sm p{font-size:15px}
.sim{display:grid;gap:20px}
.sim a{display:grid;gap:10px;text-decoration:none;max-width:350px}
.sim img{width:120px;height:90px;object-fit:cover;border-radius:16px}
.sim b{font:400 26px/1.05 var(--serif)}
.sim span{font-size:14px;color:var(--mist)}
.sim a:hover b{text-decoration:underline;text-decoration-thickness:1px}
.where{display:grid;gap:10px;justify-items:start;padding:20px 22px 22px;--fa:.08}
.where h2{font:600 15px/1.4 var(--sans)}
.where p{font-size:14px;color:var(--mist)}
.where .lk{font-size:14px}

/* about + legal */
.sec.abs{padding:24px 0 56px}
.ab2{display:grid;gap:24px;align-items:start}
.ab2 section{display:grid;gap:12px;align-content:start;padding:20px 18px;--fa:.1}
.kc .ld{color:var(--ink);font-size:15px}
.kc .ld a{color:var(--ink)}
.rs{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:24px}
.rs li{display:flex;align-items:center;gap:8px;font-size:15px}
.rs .bd{width:10px;height:10px}
.kt{max-width:720px;margin-top:24px}
.kt div{display:flex;gap:20px;padding:14px 0;border-top:1px solid var(--silverMid)}
.kt dt{flex:none;width:90px;font:600 14px/1.5 var(--sans);color:var(--silverDark)}
.kt dd{font-size:16px}
.sec.lgl{padding:8px 0 56px}
.lp{display:grid;gap:22px;max-width:840px;padding:20px 18px;--fa:.1}
.lp h2{font:400 24px/1.1 var(--serif)}

/* cookie: a frosted plate with a gold bauble */
.cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:80;display:grid;gap:16px;max-width:500px;max-height:calc(100vh - 24px);overflow:auto;padding:28px 20px 24px;background:linear-gradient(180deg,rgba(78,79,168,.92),rgba(34,34,90,.94));--u:1px}
.cookie[hidden]{display:none}
.ck-t{display:flex;align-items:center;gap:14px}
.ck-t .bb{position:relative;flex:none}
.cookie h2{font:400 30px/1.05 var(--serif)}
.cookie p{font-size:15px}
.ck-acts{display:grid;gap:12px}
.ck-acts .pill{justify-content:center}
.ck-manage{display:grid;gap:8px;padding:10px 0;border-block:1px solid rgba(255,255,255,.25)}
.ck-manage[hidden]{display:none}
.ck-manage label{display:flex;align-items:center;gap:10px;font-size:15px}
.ck-manage input{width:18px;height:18px;accent-color:var(--goldLt)}
.ck-manage .pill{justify-self:start}
.cookie .lk{justify-self:start;font-size:14px}

/* ---------- tablet ---------- */
@media (min-width:768px){
  :root{--pad:40px;--u:min(1px,calc(100vw / 1368))}
  body{font-size:16px}
  .dk{display:block}.mo{display:none}
  .top{height:112px}
  .logo{top:34px;font-size:30px}
  .mk{width:24px;height:24px}
  .mk .gl{--gd:24px;left:4px;top:2.4px}
  .cur{top:76px;left:calc(var(--pad) + 2px)}
  .mb .bb{--d:64px !important;--th:14px !important}
  .ml{right:calc(64px * .32);top:calc(14px + 64px * .2 + 64px * .38);width:calc(64px * .36);gap:calc(64px * .11 - 2px)}
  .mbl{display:block;margin:60px 14px 0 0;font:600 15px/1.2 var(--sans);color:#fff}
  .panel{top:108px}
  .hero{min-height:calc(820 * var(--u));padding-bottom:calc(100 * var(--u))}
  .ht{padding-top:calc(150 * var(--u))}
  .hero h1{font-size:max(64px,calc(112 * var(--u)));max-width:600px}
  .ht p{margin-top:28px;font-size:max(16px,calc(20 * var(--u)));max-width:470px}
  .ht .pill{margin-top:28px;padding:16px 26px;font-size:16px}
  .robin{left:auto;right:calc(-72 * var(--u));top:calc(40 * var(--u));width:calc(760 * var(--u))}
  .rgl{left:auto;right:calc(336 * var(--u));top:calc(330 * var(--u))}
  .rgl .gl{--gd:calc(300 * var(--u))}
  .tth{left:auto;right:calc(153 * var(--u));top:0;height:calc(534 * var(--u))}
  .tag{left:auto;right:calc(28 * var(--u));top:calc(520 * var(--u));width:max(200px,calc(250 * var(--u)));padding:30px 22px 22px}
  .tag dd{font-size:max(18px,calc(24 * var(--u)))}
  .tray{position:absolute;left:calc(64 * var(--u));bottom:calc(-54 * var(--u));z-index:2;display:flex;gap:calc(8 * var(--u));width:calc(600 * var(--u));height:calc(150 * var(--u));padding:calc(12 * var(--u));border:2px solid rgba(255,255,255,.7);border-radius:calc(20 * var(--u));background:linear-gradient(180deg,var(--tissue),var(--tissue2));box-shadow:var(--lift3)}
  .tray li{position:relative;width:calc(88 * var(--u));height:calc(130 * var(--u));border-radius:calc(14 * var(--u));background:linear-gradient(180deg,var(--tissue2),#D9D0BA);box-shadow:inset 0 4px 10px rgba(134,102,31,.25)}
  .tray .bb{left:calc(15 * var(--u));top:calc(-6 * var(--u))}
  .h2{font-size:52px}.h3{font-size:32px}
  .sec{padding:88px 0}
  .sec.gs{padding:32px 0 96px}
  .cards{grid-template-columns:repeat(2,1fr);gap:48px 24px}
  .pl{padding:22px 22px 24px}
  .tbl{padding:10px 24px}
  .gens{--u:.8px}
  .gens li{padding:24px 20px}
  .hold{width:96px;height:120px}
  .gens h3{font-size:30px}
  .ring{right:-140px;top:120px;width:420px;height:420px}
  .terms{grid-template-columns:repeat(2,minmax(0,444px));column-gap:56px;row-gap:40px}
  .terms dt{font-size:30px}
  .faq details{padding:22px 28px}
  .faq summary{font-size:18px}
  .foot{padding:88px 0 40px}
  .fc{grid-template-columns:repeat(3,1fr);gap:40px}
  .f1{grid-column:1/-1}
  .fb{display:flex;justify-content:space-between;gap:24px}
  .sec.intro{padding:32px 0 64px}
  .intro h1{font-size:72px}
  .sec.scr{padding:72px 0}
  .stx h2{font-size:60px}
  .facts dt{width:130px}
  .otx h1{font-size:80px}
  .otx p{font-size:18px}
  .sec.fband{padding:48px 0}
  .sec.art{padding:72px 0 96px}
  .col .a2{font-size:44px}
  .keys dt{width:220px}
  .pq p{font-size:38px}
  .sim{grid-template-columns:repeat(2,minmax(0,350px))}
  .sim img{width:160px;height:120px}
  .ab2{grid-template-columns:repeat(2,1fr)}
  .ab2 section{padding:28px}
  .kc .ld{font-size:17px}
  .kt dt{width:160px}
  .lp{padding:32px 40px}
  .cookie{left:24px;right:auto;bottom:24px;width:min(500px,calc(100% - 48px));padding:36px 32px 32px}
  .ck-acts{display:flex}
}
@media (min-width:1024px){
  .tbl{padding:12px 28px}
  .tbl thead{display:table-header-group}
  .tbl tr{display:table-row;padding:0}
  .tbl th,.tbl td{padding:16px 16px 16px 0;vertical-align:middle;text-align:left}
  .tbl thead th{padding:18px 16px 14px 0;font:600 13px/1.3 var(--sans);color:var(--goldLt)}
  .tbl tbody tr{border-top:1px solid rgba(255,255,255,.2)}
  .tbl tr>*:first-child{width:266px}
  .tbl th[scope=row] a{font-size:24px}
  .tbl .tb{width:56px;height:42px}
  .tbl td{font-size:15px;color:#fff}
  .tbl td[data-l]::before{content:none}
  .tbl td.dv{display:table-cell}
  .tbl table{table-layout:fixed}
  .tbl tr>*:nth-child(2){width:146px}.tbl tr>*:nth-child(3){width:266px}.tbl tr>*:nth-child(4){width:226px}.tbl tr>*:nth-child(5){width:166px}
  .gens{grid-template-columns:repeat(4,1fr);gap:24px}
  .sr{flex-direction:row;align-items:center;gap:72px}
  .sr .hung.big{flex:0 0 min(600px,48%);width:auto}
  .orow{flex-direction:row;gap:64px}
  .otx{flex:0 0 min(520px,42%)}
  .orow .hung.big{flex:1;max-width:640px}
  .fgrid{grid-template-columns:repeat(4,1fr)}
}
/* ---------- desktop ---------- */
@media (min-width:1200px){
  :root{--pad:72px}
  body{font-size:17px}
  .h2{font-size:64px}.h3{font-size:36px}
  .sec{padding:112px 0}
  .sec.gs{padding:40px 0 120px}
  .gw{grid-template-columns:320px 1fr;gap:48px}
  .cards{gap:56px 24px}
  .pl{padding:24px 26px 26px}
  .pt h3{font-size:36px}
  .pl .ol{font-size:16px}
  .xs .ld,.cs .ld,.ls .ld{margin-top:48px}
  .tbl,.gens,.terms{margin-top:48px}
  .gens{--u:1px}
  .gens li{padding:28px 24px}
  .hold{width:120px;height:150px}
  .gens h3{font-size:34px}
  .gens p:last-child{font-size:15px}
  .terms div{padding:22px 0}
  .terms dd{font-size:16px}
  .fs .h2{margin-bottom:48px}
  .faq summary{font-size:19px}
  .faq details p{font-size:16px}
  .foot{padding:96px 0 40px}
  .fc{grid-template-columns:400px repeat(3,1fr);gap:56px}
  .f1{grid-column:auto}
  .f1 .logo{font-size:34px}
  .f1 .mk{width:27px;height:27px}
  .fb{margin-top:48px;padding-top:48px}
  .intro h1{font-size:96px}
  .ai h1{font-size:104px;max-width:820px}
  .ai .ld{font-size:20px}
  .sec.scr{padding:88px 0}
  .stx h2{font-size:80px}
  .sec.op{padding:24px 0 80px}
  .otx h1{font-size:104px}
  .otx p{font-size:19px}
  .otx .mt{font-size:13px}
  .sec.art{padding:88px 0 96px}
  .col .a2{font-size:52px}
  .pq p{font-size:44px}
  .ab2 section{padding:32px}
  .kc .ld{font-size:18px}
  .lp{padding:40px 48px}
  .lp h2{font-size:30px}
  .lp p{font-size:15px}
  .sec.abs{padding-top:32px}
  .rs{margin-top:40px}
  .kt{margin-top:48px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .bb:hover,.mb:hover .bb{animation:none}
  .gl{translate:none !important;transition:none}
  .cvr,.pl,.pill,.faq summary .ar{transition:none}
}

/* social icons (footer) */
.soc{display:flex;gap:10px}
.sic{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;transition:background .16s,color .16s,border-color .16s;border:1px solid rgba(211,212,240,.3);border-radius:50%;color:var(--mist)}
.sic:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.sic .si{width:17px;height:17px}