/* olethabrekarc.com: Beijing cloisonne enamel. Source with `Nu` units (desktop module), compiled by olethabrekarc.com.css.py */
@property --rv{syntax:'<percentage>';inherits:false;initial-value:0%}
:root{--ink:#0E2236;--ink2:#24425C;--lapis:#13324F;--lapisD:#0B2238;--turq:#2F9E9B;--turqL:#7ECDC1;--turqD:#1F7C7A;--gilt:#D6A640;--giltL:#F1D27A;--giltD:#9C7424;
--coral:#D4523E;--yellow:#F1C33C;--white:#F4EFDF;--cream:#FBF7EC;
--wire:linear-gradient(135deg,#F1D27A,#D6A640 50%,#9C7424);--glint:0 0 12px rgba(214,166,64,.35);--lift:0 2px 6px rgba(11,34,56,.25);
--u:min(1px,calc(100vw/1368));--ox:max(0px,calc(50% - 684*var(--u)));
--d:'Varela Round','Maven Pro',system-ui,sans-serif;--t:'Maven Pro',system-ui,-apple-system,'Segoe UI',sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:500 15px/1.6 var(--t);color:var(--ink);background:var(--cream);overflow-x:clip}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:var(--d);font-weight:400;margin:0;line-height:1.08;letter-spacing:-.02em;color:inherit}
p{margin:0}a{color:inherit}
ul,ol,dl,dd{list-style:none;margin:0;padding:0}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:8px;top:-60px;z-index:200;background:var(--cream);border:2px solid var(--gilt);border-radius:999px;padding:8px 16px;font-weight:700}
.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--giltL);outline-offset:3px}
.in{width:min(100% - 32px,720px);margin-inline:auto}
.lead{font-size:15px;line-height:1.6}

/* enamel: radial from the polish point (top left), centre lighter, deeper against the wire */
.e-turq{--e:radial-gradient(farthest-corner at 30% 22%,#7FD3C6,#2F9E9B 55%,#1C7471);background:var(--e)}
.e-turqL{--e:radial-gradient(farthest-corner at 30% 22%,#D6F0E8,#9ED9CC 55%,#6CBDB0);background:var(--e)}
.e-lapis{--e:radial-gradient(farthest-corner at 30% 22%,#2E6690,#13324F 55%,#0A1F33);background:var(--e)}
.e-coral{--e:radial-gradient(farthest-corner at 30% 22%,#F09A7C,#D4523E 55%,#A43626);background:var(--e)}
.e-yellow{--e:radial-gradient(farthest-corner at 30% 22%,#FBE69A,#F1C33C 55%,#C99520);background:var(--e)}
.e-white{--e:radial-gradient(farthest-corner at 30% 22%,#FFFFFA,#F4EFDF 55%,#DCD2B4);background:var(--e)}
.e-green{--e:radial-gradient(farthest-corner at 30% 22%,#8CC474,#4E8F3A 55%,#336623);background:var(--e)}
.e-cobalt{--e:radial-gradient(farthest-corner at 30% 22%,#5F86CF,#2C55A0 55%,#1B3A75);background:var(--e)}
.t-white{color:#fff}.t-ink{color:var(--ink)}
/* cell: outer gilt wire, gilt bed, inner wire, enamel (border: double) */
.cel{position:relative;border:4px solid transparent;border-radius:24px;background:var(--e) padding-box,var(--wire) border-box;box-shadow:inset 0 0 0 1.5px var(--giltD),inset 0 0 16px rgba(11,34,56,.28),var(--lift)}
.cel.gl{box-shadow:inset 0 0 0 1.5px var(--giltD),inset 0 0 16px rgba(11,34,56,.28),var(--glint),var(--lift)}
/* wire-spiral ground */
.grd{position:absolute;inset:0;z-index:0;pointer-events:none;background:url(/assets/img/spiral-gilt.svg) 0 0/230px 230px;opacity:.28}
.grd.light{background-image:url(/assets/img/spiral-light.svg)}
.grd.o14{opacity:.14}.grd.o16{opacity:.16}.grd.o18{opacity:.18}.grd.o25{opacity:.25}.grd.o30{opacity:.3}.grd.s36{background-size:180px 180px}
.ruyi{display:none;position:absolute;z-index:0;pointer-events:none;width:calc(var(--s)*var(--u));height:auto;left:calc(var(--ox) + var(--x)*var(--u));top:calc(var(--y)*var(--u));opacity:var(--o);transform:rotate(var(--r))}
.lap{height:34px;background:url(/assets/img/lappets.svg) 0 0/auto 100% repeat-x}
.lap.down{transform:scaleY(-1);height:30px}

/* dot, chip, pill, bead */
.dt{display:inline-block;flex:none;width:12px;height:12px;border-radius:50%;border:1.5px solid var(--gilt);vertical-align:-1px}
.chip{display:inline-flex;align-items:center;gap:8px;font:600 13px/1.35 var(--t)}
.chip.gold{color:var(--giltL)}
.chips{display:flex;flex-wrap:wrap;gap:6px 16px}
.pill{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 22px;border:2.5px solid var(--gilt);border-radius:999px;color:var(--ink);font:700 15px/1.2 var(--t);text-decoration:none;cursor:pointer;box-shadow:0 0 14px rgba(214,166,64,.45)}
.pill.e-lapis,.pill.e-cobalt,.pill.e-coral,.pill.e-green{color:#fff}
.pill.q{box-shadow:none}
.pill:hover{filter:brightness(1.06);box-shadow:0 0 18px rgba(214,166,64,.6)}
.bead{flex:none;width:30px;height:30px}
.mark{flex:none;width:34px;height:34px}

/* header */
.hd{border-bottom:3px solid var(--gilt);color:#fff}
.hdi{display:flex;flex-direction:column;gap:12px;padding:14px 0}
.logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.lt{font:400 20px/1 var(--d)}
.nav{display:flex;flex-wrap:wrap;gap:6px}
.nv{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;font:600 14px/1.2 var(--t);text-decoration:none;color:#fff;border:2px solid transparent}
.nv .dt{width:8px;height:8px;border-width:1px}
.nv.on{background:radial-gradient(farthest-corner at 30% 22%,#7FD3C6,#2F9E9B 55%,#1C7471);border-color:var(--gilt);color:var(--ink)}
.nv:not(.on):hover{text-decoration:underline;text-underline-offset:4px}

/* hero */
.hero{position:relative;overflow:clip;padding:20px 16px 0}
.hero .bands,.hero .links{display:none}
.panel{display:flex;flex-direction:column;gap:16px;padding:22px 16px 20px;color:#fff}
.panel h1{font-size:38px;line-height:1.1}
.stf{font-size:15px;line-height:1.6}
.hlist{position:relative;width:min(280px,100%);padding:4px;border-radius:20px;background:var(--wire);box-shadow:var(--lift)}
.hlist::after{content:"";position:absolute;inset:4px;border-radius:16px;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.26),rgba(255,255,255,.06) 35%,transparent 60%);box-shadow:inset 0 0 22px rgba(11,34,56,.45)}
.hrow{display:flex;align-items:center;gap:12px;padding:10px 14px;font:700 14px/1.3 var(--t)}
.hrow+.hrow{margin-top:2px}
.hlist .hrow:first-child{border-radius:16px 16px 0 0}.hlist .hrow:last-child{border-radius:0 0 16px 16px}
.hlist{background:var(--wire);}
.hrow a{text-decoration:none;position:relative;z-index:1}
.hrow a:hover{text-decoration:underline}
.hrow span{display:none}
.hrow .dt{width:10px;height:10px}
.e2-coral{background:linear-gradient(#D4523E 60%,#A43626)}.e2-yellow{background:linear-gradient(#F1C33C 60%,#C99520)}.e2-white{background:linear-gradient(#F4EFDF 60%,#DCD2B4)}
.e2-green{background:linear-gradient(#4E8F3A 60%,#336623)}.e2-cobalt{background:linear-gradient(#2C55A0 60%,#1B3A75)}.e2-lapis{background:linear-gradient(#13324F 60%,#0A1F33)}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}
.chk{font-size:14px;color:var(--giltL)}
.stage{position:relative;width:328px;height:300px;margin:0 auto}
.plinth{position:absolute;left:0;top:160px;width:328px;height:130px;overflow:hidden}
.pcl{position:absolute;inset:0;overflow:hidden;border-radius:20px}
.pcl .ruyi{display:block;left:-10px;top:20px;width:150px}
.pcl .ruyi+.ruyi{left:200px;top:30px;width:120px}
.sheen{position:absolute;left:0;top:0;width:100%;height:70%;background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,.04) 45%,transparent 70%)}
.ele{position:absolute;left:20px;top:4px;width:290px;height:290px;z-index:2}
.ele img{position:absolute;inset:0;width:100%;height:100%}
.ele>img:first-child{filter:drop-shadow(6px 14px 18px rgba(11,34,56,.22))}
.ele .saddle{left:16.02%;top:50%;width:25.78%;height:auto;transform:rotate(-4deg);filter:drop-shadow(4px 10px 16px rgba(11,34,56,.3))}

/* G cards */
.sec{position:relative;overflow:clip;padding:48px 0 56px}
.sec>.in{position:relative;z-index:1}
.sg{background:linear-gradient(var(--turq),var(--turqD))}
.shd{display:grid;gap:12px}
.sg h2,.sk h2,.sy h2,.sf h2{font-size:30px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin-top:24px}
.card{aspect-ratio:158/177;overflow:hidden;border-radius:24px}
.cvc{position:absolute;inset:0;border-radius:20px;overflow:hidden}
.cvc img{width:100%;aspect-ratio:1;object-fit:cover}
.strip{position:absolute;left:0;right:0;bottom:-14px;height:114px;padding:12px 14px 26px;display:flex;flex-direction:column;gap:6px;border-top:2.5px solid var(--gilt);isolation:isolate}
.strip h3{font-size:16px;line-height:1.15;letter-spacing:0}
.strip h3 a{text-decoration:none}
.strip h3 a::after{content:"";position:absolute;inset:-200px 0 0;z-index:2}
.strip .chip{font-size:13px}
.strip .chip.dk{display:none}
.card:hover,.card:focus-within{box-shadow:inset 0 0 0 1.5px var(--giltD),inset 0 0 16px rgba(11,34,56,.28),0 0 12px rgba(214,166,64,.35),0 0 0 2px rgba(241,210,122,.55),var(--lift)}
.card:hover .strip,.card:focus-within .strip{transform:translateY(-14px)}

/* K contact */
.sk{background:var(--cream)}
.krow{display:grid;gap:20px}
.kl{display:grid;gap:20px}
.sk h2{font-size:28px}
.reasons{display:grid;gap:12px}
.reasons .chip{font-size:14px}.reasons .dt{width:14px;height:14px}
.kc{display:flex;flex-direction:column;gap:18px;padding:22px 16px;color:#fff}
.ek{font:700 14px/1 var(--t);letter-spacing:.06em;text-transform:uppercase;color:var(--giltL)}
.em{font:400 18px/1.2 var(--d);overflow-wrap:anywhere}.em a{text-decoration:none}.em a:hover{text-decoration:underline}
.kp{font-size:14px}
.kc .pill{align-self:flex-start}

/* Y gallery */
.sy{color:#fff}
.sy .lead{margin-top:12px}
.gal{position:relative;z-index:1;display:flex;gap:16px;margin-top:24px;padding:0 16px 8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:thin;scrollbar-color:var(--gilt) transparent}
.med{flex:none;width:208px;scroll-snap-align:start}
.med a{display:grid;gap:16px;text-decoration:none}
.mc{display:block;width:208px;height:208px;border-radius:50%;overflow:hidden}
.mc img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.med b{font:400 18px/1.2 var(--d)}
.med a:hover b{text-decoration:underline}
.med .chip{margin-top:16px}
.med p{margin-top:16px;font-size:14px;line-height:1.45}

/* F questions */
.sf{padding-top:0}
.sf .lap{position:relative;z-index:1}
.sf .in{padding-top:30px}
.faq{margin-top:24px}
.qa{display:grid;gap:10px;padding:16px 0;border-bottom:1.5px solid var(--turqD)}
.qa:first-child{border-top:1.5px solid var(--turqD)}
.q{display:flex;align-items:center;gap:16px}
.q h3{font:700 16px/1.4 var(--t);letter-spacing:0}
.qa p{font-size:15px;line-height:1.6}

/* footer: index grid */
.ft{color:#fff;overflow:clip}
.fbody{padding:28px 0}
.ftop{display:grid;gap:16px}
.fid{display:grid;gap:14px;justify-items:start}
.fid p{font-size:15px}
.fem{font-weight:700;font-size:16px;color:var(--giltL);text-underline-offset:3px}
.fgrid ul{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fgrid a{display:flex;align-items:center;gap:10px;height:100%;padding:12px 14px;border-radius:14px;background:var(--lapisD);border:1.5px solid var(--giltD);font:600 13px/1.35 var(--t);text-decoration:none}
.fgrid a:hover{border-color:var(--giltL)}
.fgrid .dt{width:10px;height:10px}
.wire{height:2px;margin:24px 0;background:var(--wire)}
.fbot{display:grid;gap:10px;font-size:13px}
.fbot p:first-child{opacity:.85}
.soc{color:var(--giltL)}
.fck{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* cookie */
.cookie{position:fixed;left:16px;bottom:16px;z-index:90;width:min(468px,100% - 32px);display:flex;flex-direction:column;gap:14px;padding:20px 18px}
.ckh{display:flex;align-items:center;gap:12px}.ckh .mark{width:30px;height:30px}
.cookie h2{font-size:20px}
.cookie p{font-size:14px}
.ck-acts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ck-acts .pill,.ck-manage .pill{padding:12px 10px}
.ck-manage{display:grid;gap:8px;font-size:14px}.ck-manage label{display:flex;gap:8px;align-items:flex-start}.ck-manage .pill{justify-self:start;padding:10px 20px}
.ckl{font-weight:700;font-size:14px;text-underline-offset:3px;align-self:flex-start}

/* page heads */
.phead{position:relative;overflow:clip;padding:28px 0 32px;color:#fff}
.phead .in,.ahead .in,.gtop .in{position:relative;z-index:1}
.crumbs ol{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:14px;font-weight:500}
.crumbs li+li::before{content:"›";margin-right:10px}
.crumbs li[aria-current]{font-weight:700}
.crumbs a{text-underline-offset:3px}
.crumbs.gold{color:var(--giltL)}
.phead h1{font-size:36px;margin:18px 0 0}
.phead .lead{margin-top:18px}
.upd{margin-top:16px;font-size:14px;font-weight:600;color:var(--giltL)}

/* games: one per screen */
.scr{position:relative;overflow:clip;padding:36px 0}
.srow{display:grid;gap:20px;align-items:center}
.scv{display:block;overflow:hidden;aspect-ratio:1}
.scv img{width:100%;height:100%;object-fit:cover;border-radius:20px}
.sinfo{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.sinfo h2{font-size:32px}
.sum{font-size:15px;line-height:1.6}
.facts{width:100%;padding:8px 16px;border-radius:20px}
.facts>div{display:grid;grid-template-columns:92px 1fr;gap:16px;padding:10px 0;border-bottom:1.2px solid var(--gilt)}
.facts>div:last-child{border-bottom:0}
.facts dt{font-weight:700;font-size:14px}.facts dd{font-size:14px;font-weight:400}

/* guide */
.guide main{background:var(--cream)}
.gtop{position:relative;overflow:clip;padding:24px 0 32px}
.grow{display:grid;gap:18px}
.crumbs.gd{display:none}
.gcv{display:block;overflow:hidden;aspect-ratio:1}
.gcv img{width:100%;height:100%;object-fit:cover;border-radius:20px}
.gt{display:flex;flex-direction:column;gap:20px}
.gt h1{font-size:40px}
.gt .sum{font-size:16px}
.gt .chips{gap:8px 18px}
.meta{font-size:14px;font-weight:600;color:var(--ink2)}
.fband{padding:24px 0;color:#fff}
.fl{font:700 15px/1.3 var(--t);letter-spacing:0;color:var(--giltL)}
.fxg{display:grid;gap:10px;margin-top:16px}
.fx{display:grid;gap:6px;padding:14px 18px;border-radius:16px;background:var(--lapisD);border:1.5px solid var(--giltD)}
.fx dt{font-size:13px}.fx dd{font-size:15px}
.art{position:relative;overflow:clip;padding:32px 16px 24px}
.col{position:relative;z-index:1;width:min(100%,720px);margin:0 auto;display:flex;flex-direction:column;gap:22px}
.col h2{font-size:26px}
.tx{font-size:15px;line-height:1.6}
.pq{margin:0;padding:22px 20px}.pq p{font:400 21px/1.3 var(--d)}
.keys{padding:8px 22px;border-radius:20px}
.kr{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:center;padding:12px 0;border-bottom:1.2px solid var(--gilt)}
.kr:last-child{border-bottom:0}
.kr dt{padding:6px 14px;border-radius:999px;background:radial-gradient(farthest-corner at 30% 22%,#2E6690,#13324F 55%,#0A1F33);border:1.5px solid var(--gilt);color:#fff;font-weight:700;font-size:14px;line-height:1.3}
.kr dd{font-size:14px}
.tips{display:grid;gap:16px}.tips li{display:flex;gap:16px;align-items:flex-start}.tips .bead{width:26px;height:26px}
.brk{display:grid;gap:16px;justify-items:start;padding:8px 0}
.md{display:block;width:168px;height:168px;border-radius:50%;overflow:hidden}
.md img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.brk h2{font-size:24px;margin-bottom:12px}
.tx.big{font-size:16px}
.weigh{display:grid;gap:14px}.weigh .chip{font-size:14px;align-items:flex-start}.weigh .dt{margin-top:3px}
.sim{display:grid;gap:20px}
.sm{display:flex;gap:14px;align-items:center;padding:12px;border-radius:20px;text-decoration:none}
.sm img{flex:none;width:72px;height:72px;border-radius:14px}
.sm b{display:block;font-size:16px}.sm span span{display:block;font-size:13px;line-height:1.4;color:var(--ink2)}
.sm:hover b{text-decoration:underline}
.where{display:flex;flex-direction:column;gap:12px;padding:20px 18px}
.wt{font-weight:700;font-size:17px}
.where a{font-weight:700;font-size:16px;text-underline-offset:3px}
.gq{display:grid;gap:6px}.gq h3{font:700 16px/1.4 var(--t);letter-spacing:0}

/* about */
.ahead{position:relative;overflow:clip;padding:28px 0 32px}
.arow{display:grid;gap:32px}
.atl{display:flex;flex-direction:column;gap:18px}
.ahead h1{font-size:36px}
.ahead .lead{font-size:16px}
.acl{display:none}
.abody{padding:32px 0}
.abody .in{display:flex;flex-direction:column;gap:20px}
.as{display:flex;flex-direction:column;gap:12px;padding:20px 18px}
.as h2{font-size:22px}
.as p,.ac p{font-size:15px;line-height:1.6}
.ac{display:flex;flex-direction:column;gap:14px;padding:24px 18px;color:#fff}
.ac h2{font-size:24px}
.ac .reasons .chip{font-size:13px}.ac .reasons .dt{width:12px;height:12px}
.ac dl{display:grid;gap:10px}
.ac dl div{display:grid;grid-template-columns:90px 1fr;gap:16px}
.ac dt{font-weight:700;font-size:15px;color:var(--giltL)}.ac dd{font-weight:600;font-size:16px;overflow-wrap:anywhere}

/* legal */
.lbody{position:relative;overflow:clip;padding:28px 0 40px}
.lcol{position:relative;z-index:1;display:flex;flex-direction:column;gap:26px}
.lsum{padding:18px 16px}.lsum p{font-weight:600;font-size:15px}
.ls h2{display:flex;align-items:center;gap:12px;font-size:19px;line-height:1.2;margin-bottom:10px}
.ls p{font-size:15px;line-height:1.6}.ls p+p{margin-top:10px}

/* scroll-driven reveal: the enamel fills from the centre to the wire, 400 ms, once */
.rvw .cel{isolation:isolate}
.rvw .cel::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:#E9E2CC;
-webkit-mask-image:radial-gradient(circle at 50% 50%,transparent var(--rv),#000 calc(var(--rv) + 1%));mask-image:radial-gradient(circle at 50% 50%,transparent var(--rv),#000 calc(var(--rv) + 1%));transition:--rv .4s ease-out}
.rvw .cel.on::before{--rv:120%}
@media (prefers-reduced-motion:no-preference){
.strip,.card,.pill{transition:transform .22s ease-out,box-shadow .22s ease-out}
.sh::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,transparent 35%,rgba(255,255,255,.16) 48%,transparent 62%) 0 0/260% 260%;animation:glint 6s ease-in-out infinite alternate}
}
@keyframes glint{from{background-position:0 0}to{background-position:100% 100%}}

@media (max-width:380px){.cards{gap:12px 10px}.strip{padding:10px 12px 24px}.strip h3{font-size:15px}}
@media (min-width:600px){.hrow span{display:block;margin-left:auto;font-weight:500;font-size:13px;text-align:right}.hlist{width:100%}.fgrid ul{grid-template-columns:repeat(4,1fr)}}

/* ---------------- desktop: 1368 column, module u ---------------- */
@media (min-width:1024px){
.in{width:calc(1208*var(--u))}
.lead{font-size:calc(17*var(--u))}
body{font-size:calc(17*var(--u))}
.dt{width:calc(12*var(--u));height:calc(12*var(--u))}
.chip{font-size:calc(14*var(--u));gap:calc(8*var(--u))}
.pill{min-height:calc(56*var(--u));padding:calc(15*var(--u)) calc(28*var(--u));font-size:calc(17*var(--u))}
.mark{width:calc(42*var(--u));height:calc(42*var(--u))}
.grd{background-size:calc(230*var(--u)) calc(230*var(--u))}.grd.s36{background-size:calc(180*var(--u)) calc(180*var(--u))}
.ruyi{display:block}
.lap{height:calc(54*var(--u))}.lap.down{height:calc(46*var(--u))}
.bead{width:calc(30*var(--u));height:calc(30*var(--u))}
/* header */
.hdi{flex-direction:row;justify-content:space-between;align-items:center;padding:calc(20*var(--u)) 0}
.lt{font-size:calc(24*var(--u))}
.nav{gap:calc(10*var(--u))}
.nv{padding:calc(10*var(--u)) calc(18*var(--u));font-size:calc(16*var(--u))}
/* hero */
.hero{height:calc(900*var(--u));padding:0}
.hero>*{position:absolute}
.hero .grd{position:absolute}
.hero .bands{display:block;inset:0;background:linear-gradient(var(--gilt),var(--gilt)) 0 calc(34*var(--u))/100% calc(3*var(--u)) no-repeat,linear-gradient(var(--gilt),var(--gilt)) 0 calc(42*var(--u))/100% calc(3*var(--u)) no-repeat,linear-gradient(var(--gilt),var(--gilt)) 0 calc(100% - 42*var(--u))/100% calc(3*var(--u)) no-repeat,linear-gradient(var(--gilt),var(--gilt)) 0 calc(100% - 34*var(--u))/100% calc(3*var(--u)) no-repeat}
.hero .links{display:block;left:calc(var(--ox) + calc(600*var(--u)));top:calc(470*var(--u));width:calc(48*var(--u));height:calc(130*var(--u));background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 130'%3E%3Cpath d='M0 50C20 50 30 0 48 0M0 70C28 70 34 130 48 130' fill='none' stroke='%23D6A640' stroke-width='4'/%3E%3C/svg%3E") 0 0/100% 100%}
.panel{left:calc(var(--ox) + calc(648*var(--u)));top:calc(64*var(--u));width:calc(640*var(--u));gap:calc(20*var(--u));padding:calc(44*var(--u)) calc(48*var(--u)) calc(40*var(--u)) calc(52*var(--u));z-index:2}
.panel h1{font-size:calc(66*var(--u));line-height:1.06;max-width:calc(520*var(--u))}
.stf{font-size:calc(18*var(--u));max-width:calc(520*var(--u))}
.hlist{width:calc(528*var(--u))}
.hrow{gap:calc(12*var(--u));padding:calc(10*var(--u)) calc(18*var(--u));font-size:calc(16*var(--u))}
.hrow .dt{width:calc(12*var(--u));height:calc(12*var(--u))}
.hrow span{font-size:calc(14*var(--u))}
.cta{gap:calc(20*var(--u))}.chk{font-size:calc(14*var(--u))}
.stage{left:var(--ox);top:0;width:calc(700*var(--u));height:calc(900*var(--u));margin:0}
.plinth{left:calc(80*var(--u));top:calc(640*var(--u));width:calc(520*var(--u));height:calc(230*var(--u))}
.pcl .ruyi{left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--s)*var(--u))}
.pcl .ruyi+.ruyi{left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--s)*var(--u))}
.ele{left:calc(70*var(--u));top:calc(200*var(--u));width:calc(560*var(--u));height:calc(560*var(--u))}
/* sections */
.sec{padding:calc(88*var(--u)) 0 calc(104*var(--u))}
.sg h2,.sy h2,.sf h2{font-size:calc(52*var(--u))}
.shd{grid-template-columns:calc(640*var(--u)) calc(420*var(--u));justify-content:space-between;align-items:end;gap:calc(60*var(--u))}
.sg .lead{font-size:calc(18*var(--u))}
.cards{grid-template-columns:repeat(3,calc(384*var(--u)));gap:calc(32*var(--u)) calc(28*var(--u));margin-top:calc(40*var(--u))}
.card{aspect-ratio:384/430}
.strip{bottom:calc(-14*var(--u));height:calc(114*var(--u));padding:calc(16*var(--u)) calc(20*var(--u)) calc(30*var(--u));gap:calc(8*var(--u))}
.strip h3{font-size:calc(22*var(--u))}
.strip .chip{font-size:calc(14*var(--u))}.strip .chip.dk{display:inline-flex}
.card:hover .strip,.card:focus-within .strip{transform:translateY(calc(-14*var(--u)))}
.sk{padding:calc(96*var(--u)) 0}
.krow{grid-template-columns:calc(560*var(--u)) calc(560*var(--u));gap:calc(40*var(--u));align-items:center}
.sk h2{font-size:calc(46*var(--u))}
.kl p{max-width:calc(520*var(--u))}
.reasons .chip{font-size:calc(16*var(--u))}.reasons .dt{width:calc(14*var(--u));height:calc(14*var(--u))}
.kc{padding:calc(44*var(--u))}
.ek{font-size:calc(14*var(--u))}.em{font-size:calc(34*var(--u))}.kp{font-size:calc(15*var(--u))}
.sy{padding:calc(96*var(--u)) 0 calc(104*var(--u))}
.sy h2{max-width:calc(760*var(--u))}.sy .lead{max-width:calc(600*var(--u))}
.gal{gap:calc(32*var(--u));margin-top:calc(44*var(--u));padding:0 calc(80*var(--u)) calc(16*var(--u)) calc(var(--ox) + calc(140*var(--u)));scroll-padding-inline:calc(var(--ox) + calc(140*var(--u))) calc(80*var(--u))}
.med{width:calc(268*var(--u))}
.med.lo{padding-top:calc(56*var(--u))}
.mc{width:calc(268*var(--u));height:calc(268*var(--u))}
.med b{font-size:calc(21*var(--u))}
.med p{font-size:calc(14*var(--u));max-width:calc(260*var(--u))}
.sf{padding:0 0 calc(104*var(--u))}
.sf .in{padding-top:calc(60*var(--u))}
.sf h2{max-width:calc(820*var(--u))}
.faq{margin-top:calc(44*var(--u))}
.qa{grid-template-columns:calc(480*var(--u)) calc(640*var(--u));gap:calc(48*var(--u));padding:calc(24*var(--u)) 0;align-items:start}
.q h3{font-size:calc(19*var(--u))}
.q .bead{width:calc(30*var(--u));height:calc(30*var(--u))}
.qa p{font-size:calc(17*var(--u))}
/* footer */
.fbody{padding:calc(56*var(--u)) 0 calc(40*var(--u))}
.ftop{grid-template-columns:calc(380*var(--u)) calc(760*var(--u));justify-content:space-between;gap:calc(48*var(--u))}
.fid p{font-size:calc(15*var(--u))}.fem{font-size:calc(16*var(--u))}
.fgrid ul{grid-template-columns:repeat(4,calc(181*var(--u)));gap:calc(12*var(--u))}
.fgrid a{padding:calc(12*var(--u)) calc(14*var(--u));font-size:calc(14*var(--u))}
.wire{margin:calc(36*var(--u)) 0}
.fbot{grid-template-columns:calc(820*var(--u)) auto;justify-content:space-between;font-size:calc(13*var(--u))}
/* cookie stays px */
/* page heads */
.phead{padding:calc(56*var(--u)) 0 calc(64*var(--u))}
.crumbs ol{font-size:calc(14*var(--u))}
.phead h1{font-size:calc(72*var(--u));max-width:calc(900*var(--u))}
.phead .lead{max-width:calc(700*var(--u))}
.lg h1{font-size:calc(64*var(--u))}
.upd{font-size:calc(14*var(--u))}
/* games */
.scr{padding:calc(88*var(--u)) 0}
.srow{grid-template-columns:calc(560*var(--u)) calc(584*var(--u));gap:calc(64*var(--u))}
.scr.flip .srow{grid-template-columns:calc(584*var(--u)) calc(560*var(--u))}
.scr.flip .scv{order:2}
.sinfo h2{font-size:calc(56*var(--u))}
.sum{font-size:calc(18*var(--u));max-width:calc(560*var(--u))}
.facts{padding:calc(10*var(--u)) calc(24*var(--u))}
.facts>div{grid-template-columns:calc(120*var(--u)) 1fr}
.facts dt{font-size:calc(14*var(--u))}.facts dd{font-size:calc(15*var(--u))}
.scr .ruyi{left:calc(var(--ox) + var(--x)*var(--u))}
/* guide */
.gtop{padding:calc(56*var(--u)) 0 calc(72*var(--u))}
.grow{grid-template-columns:calc(500*var(--u)) calc(640*var(--u));gap:calc(64*var(--u));align-items:center}
.crumbs.gc{display:none}.crumbs.gd{display:block}
.gt h1{font-size:calc(80*var(--u))}
.gt .sum{font-size:calc(20*var(--u));max-width:calc(600*var(--u))}
.meta{font-size:calc(14*var(--u))}
.fband{padding:calc(40*var(--u)) 0}
.fl{font-size:calc(15*var(--u))}
.fxg{grid-template-columns:repeat(4,1fr);gap:calc(16*var(--u))}
.fx{padding:calc(14*var(--u)) calc(18*var(--u))}.fx dt{font-size:calc(13*var(--u))}.fx dd{font-size:calc(15*var(--u))}
.art{padding:calc(72*var(--u)) 0 calc(40*var(--u))}
.col{width:calc(720*var(--u));gap:calc(36*var(--u))}
.col h2{font-size:calc(40*var(--u))}
.tx{font-size:calc(17*var(--u))}
.pq{width:calc(1000*var(--u));margin-left:calc(-140*var(--u));padding:calc(40*var(--u)) calc(56*var(--u))}.pq p{font-size:calc(32*var(--u))}
.kr{grid-template-columns:calc(200*var(--u)) 1fr}.kr dd{font-size:calc(16*var(--u))}
.tips .bead{width:calc(26*var(--u));height:calc(26*var(--u))}
.brk{width:calc(1000*var(--u));margin-left:calc(-140*var(--u));grid-template-columns:calc(220*var(--u)) calc(700*var(--u));gap:calc(40*var(--u));align-items:center;padding:calc(24*var(--u)) 0}
.md{width:calc(220*var(--u));height:calc(220*var(--u))}
.brk h2{font-size:calc(36*var(--u))}
.tx.big{font-size:calc(19*var(--u))}
.weigh .chip{font-size:calc(16*var(--u))}
.sim{grid-template-columns:calc(350*var(--u)) calc(350*var(--u))}
.where{padding:calc(28*var(--u)) calc(32*var(--u))}.wt{font-size:calc(20*var(--u))}
.gq h3{font-size:calc(18*var(--u))}
/* about */
.ahead{padding:calc(64*var(--u)) 0 calc(72*var(--u))}
.arow{grid-template-columns:calc(720*var(--u)) calc(420*var(--u));justify-content:space-between;align-items:center}
.ahead h1{font-size:calc(72*var(--u))}
.ahead .lead{font-size:calc(20*var(--u));max-width:calc(640*var(--u))}
.acl{display:block;position:relative;width:calc(420*var(--u));height:calc(300*var(--u))}
.acl .ruyi{left:calc(var(--x)*var(--u))}
.abody{padding:calc(72*var(--u)) 0}
.abody .in{gap:calc(32*var(--u))}
.as{width:calc(900*var(--u));padding:calc(32*var(--u)) calc(40*var(--u))}
.as.o1{margin-left:calc(180*var(--u))}.as.o2{margin-left:calc(60*var(--u))}.as.o3{margin-left:calc(300*var(--u))}
.as h2{font-size:calc(30*var(--u))}
.as p,.ac p{font-size:calc(17*var(--u))}
.ac{padding:calc(40*var(--u)) calc(48*var(--u))}
.ac h2{font-size:calc(36*var(--u))}
.ac .reasons{display:flex;gap:calc(28*var(--u))}
.ac dl div{grid-template-columns:calc(90*var(--u)) 1fr}
/* legal */
.lbody{padding:calc(56*var(--u)) 0 calc(72*var(--u))}
.lcol{width:calc(760*var(--u));margin-left:calc(var(--ox) + calc(260*var(--u)))}
.lsum{padding:calc(24*var(--u)) calc(30*var(--u))}.lsum p{font-size:calc(18*var(--u))}
.ls h2{font-size:calc(24*var(--u))}
.ls p{font-size:calc(17*var(--u))}
}

/* social icons (footer) */
.soc{display:flex;flex-wrap:wrap;align-items:center;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(241,210,122,.4);border-radius:50%;color:var(--giltL)}
.sic:hover{background:var(--gilt);border-color:var(--gilt);color:var(--lapisD)}
.sic .si{width:17px;height:17px}
