/* ================= APP FRAME (390) ================= */
.f{--g1:#0CAADE;--g2:#92BE7F;--g3:#ffcc01;--g4:#F06400;--kgrad:linear-gradient(135deg,var(--g1) 0%,var(--g2) 38%,var(--g3) 66%,var(--g4) 100%);--fg:#000;--bg:#fff;--card:#EBEBEB;--card2:#F4F4F4;--hdr:#fff;--foot:#F4F4F4;--mute:#5f5f62;--line:#D7D7D8;--pri:var(--brand,#51BE96);--pri-ink:#0d4d35;--org:var(--g4);--ok:#2f9e6f;--bad:#d9480f;--scrim:rgba(255,255,255,.72);
  width:390px;min-height:844px;display:flex;flex-direction:column;background:var(--bg);color:var(--fg);font:400 16px/1.4 Cygre,system-ui,sans-serif;border-radius:28px;overflow:hidden;position:relative;cursor:default;
  box-shadow:0 2px 6px rgba(0,0,0,.08),0 30px 60px -24px rgba(0,0,0,.35)}
/* dark: cool graphite with layered surfaces (GitHub / Linear / iOS approach) */
.f[data-theme="dark"]{--fg:#E8EDF3;--bg:#0E1217;--card:#1A2028;--card2:#151A21;--hdr:transparent;--foot:#12171D;--mute:#9AA5B4;--line:#2A323D;--edge:rgba(255,255,255,.06);--pri:color-mix(in srgb,var(--brand,#51BE96) 90%,#fff);--pri-ink:#062e1f;--ok:#5fd3a2;--bad:#ff8a4c;--scrim:rgba(8,10,14,.72);
  background:radial-gradient(140% 38% at 50% -6%,rgba(79,195,152,.16),transparent 62%),radial-gradient(90% 30% at 100% 0%,rgba(12,170,222,.10),transparent 60%),var(--bg)}
.f[data-theme="dark"] :is(.card,.mcard,.li,.thl,.act:not(.pri),.opt:not(.sel):not(.ok):not(.bad),.lbtn,.svc>div,.stat,.player,.post,.search,.fact,.facts>div,.copy,.chips span:not(.on),.about,.tog){box-shadow:inset 0 0 0 1px var(--edge)}
.f[data-theme="dark"] .mcard{background:linear-gradient(180deg,#1D242D,#171C23)}
.f[data-theme="dark"] .act .ico,.f[data-theme="dark"] .li .ib{background:#232A34}
.f[data-theme="dark"] .tb{border-top-color:var(--edge);background:rgba(18,23,29,.92)}
.f[data-theme="dark"] .menu,.f[data-theme="dark"] .sheet,.f[data-theme="dark"] .modal{background:#141920;box-shadow:inset 0 1px 0 var(--edge),0 -20px 50px rgba(0,0,0,.45)}
.f[data-theme="dark"] .chip{background:#232A34}
.f[data-theme="dark"] .tic .chip{background:rgba(255,255,255,.18)}
.f.wide{width:1440px;min-height:900px;border-radius:20px}
.f a{color:inherit;text-decoration:none}
.f svg{width:24px;height:24px;flex:none}
.f button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
.ph{background:#888 center/cover no-repeat}

/* header */
.hd{position:relative;z-index:3;height:68px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:var(--hdr)}
.hd .logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:118px;height:41px}
.hd .rt{display:flex;gap:10px;align-items:center}
.ib{width:40px;height:40px;border-radius:50%;display:grid;place-items:center}
.lang{width:40px;height:40px;border-radius:50%;border:2px solid var(--fg);display:grid;place-items:center;font:700 13px/1 Cygre,sans-serif}
.f .i-sun{display:none}.f[data-theme="dark"] .i-sun{display:block}.f[data-theme="dark"] .i-moon{display:none}

/* tab bar */
.tb{flex:none;height:80px;background:var(--foot);display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:center;padding:0 16px 8px;margin-top:auto;border-top:1px solid var(--line)}
.f .tb a{height:56px;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--mute);font:500 12px/1 Cygre,sans-serif}
.f .tb a.on{background:var(--pri);color:#fff;box-shadow:0 6px 16px -6px color-mix(in srgb,var(--pri) 80%,transparent)}
.f .tb a.on svg path,.f .tb a.on svg circle:first-of-type{fill:rgba(255,255,255,.22)}
.tb svg{width:26px;height:26px;stroke-width:1.8}
.main{flex:1;padding:8px 16px 28px;display:flex;flex-direction:column;gap:12px}
.h1{font:700 44px/1.08 Cygre,sans-serif;letter-spacing:-.01em;margin:6px 0 8px}
.h1 span{display:block}
.h1 small{display:block;font-size:34px;font-weight:500}
.t1{font:700 30px/1.15 Cygre,sans-serif;margin:6px 0 6px}
.t2{font:700 22px/1.2 Cygre,sans-serif}
.lead{color:var(--mute);font-size:15px}
.row{display:flex;align-items:center;gap:12px}
.between{display:flex;align-items:center;justify-content:space-between;gap:12px}
.eyebrow{font:500 13px/1 Cygre,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}

/* cards */
.card{background:var(--card);border-radius:20px;overflow:hidden}
.mcard{display:block;padding:12px 12px 16px;border-radius:24px;background:var(--card)}
.mcard .ph{height:176px;border-radius:16px}
.mcard h2{font:700 24px/1.15 Cygre,sans-serif;margin:14px 6px 4px}
.mcard p{margin:0 6px;font-size:15px;line-height:1.35}
.mcard .go{display:flex;align-items:center;justify-content:space-between;margin:12px 6px 0}
.chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:15px;background:var(--bg);font:500 13px/1 Cygre,sans-serif}
.circ{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--fg)}
.circ.fill{background:var(--fg);color:var(--bg);border:0}
.circ.pri{background:var(--pri);color:#fff;border:0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stat{background:var(--card2);border-radius:18px;padding:14px 12px}
.stat b{display:block;font:700 26px/1 Cygre,sans-serif}
.stat span{display:block;margin-top:6px;font-size:13px;color:var(--mute)}
.logo-dots{display:flex;gap:4px}.logo-dots i{width:8px;height:8px;border-radius:50%}

.li{display:flex;align-items:center;gap:14px;min-height:72px;padding:12px 12px 12px 16px;border-radius:18px;background:var(--card);font:500 17px/1.25 Cygre,sans-serif}
.li .tx{flex:1}
.li small{display:block;font:400 13px/1.3 Cygre,sans-serif;color:var(--mute);margin-top:3px}
.li .rb{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--fg);display:grid;place-items:center;flex:none}
.li .rb svg{width:20px;height:20px}
.gpin{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;flex:none;background:var(--bg);position:relative}
.gpin svg{width:28px;height:28px}
.gring{border:2px solid transparent!important;background:linear-gradient(var(--ringbg,var(--card)),var(--ringbg,var(--card))) padding-box,var(--kgrad) border-box!important}
.f .main>.li .rb{border:2px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,var(--kgrad) border-box}
.thl{display:flex;align-items:center;gap:16px;padding:10px;border-radius:20px;background:var(--card);font:500 17px/1.25 Cygre,sans-serif}
.thl .ph{width:88px;height:88px;border-radius:14px;flex:none}
.thl .tx{flex:1}
.thl small{display:block;font:400 13px/1.3 Cygre,sans-serif;color:var(--mute);margin-top:4px}
.search{display:flex;align-items:center;gap:12px;min-height:58px;border-radius:29px;padding:16px 20px;margin-block:6px 8px;background:var(--card2);color:var(--mute);font-size:15px}
.chips{display:flex;gap:8px;overflow:hidden}
.chips span{flex:none;height:36px;padding:0 16px;border-radius:18px;display:inline-flex;align-items:center;background:var(--card2);font:500 14px/1 Cygre,sans-serif}
.chips span.on{background:var(--fg);color:var(--bg)}

/* action tiles (stand) */
.act{display:flex;align-items:center;gap:16px;min-height:76px;padding:14px 16px;border-radius:20px;background:var(--card);font:500 18px/1.2 Cygre,sans-serif}
.act .ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--bg)}
.act .ico svg{width:28px;height:28px}
.act .tx{flex:1}
.act small{display:block;font:400 13px/1.3 Cygre,sans-serif;color:var(--mute);margin-top:4px}
.act:not(.pri) .ico{border:2px solid transparent;background:linear-gradient(var(--bg),var(--bg)) padding-box,var(--kgrad) border-box}
.f[data-theme="dark"] .act:not(.pri) .ico{background:linear-gradient(#232A34,#232A34) padding-box,var(--kgrad) border-box}
.act.pri{background:var(--pri);color:#fff}.act.pri small{color:rgba(255,255,255,.85)}.act.pri .ico{background:rgba(255,255,255,.2)}
.hero{height:236px;border-radius:24px;position:relative;overflow:hidden}
.hero .badge{position:absolute;left:12px;top:12px;height:32px;padding:0 12px;border-radius:16px;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);color:#fff;font:500 13px/32px Cygre,sans-serif;display:flex;gap:6px;align-items:center}
.hero .badge svg{width:16px;height:16px}

.f .btn{height:58px;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:10px;font:500 17px/1 Cygre,sans-serif;background:var(--fg);color:var(--bg);width:100%}
.f .btn.ghost{background:transparent;color:var(--fg);border:1.5px solid var(--fg)}
.f .btn.pri{background:var(--pri);color:#fff}
.f .btn.mute{background:var(--card);color:var(--mute)}
.btn svg{width:20px;height:20px}
.f .btn.hintbtn{height:60px;background:color-mix(in srgb,var(--g3) 20%,var(--bg));color:var(--fg);border:1.5px solid color-mix(in srgb,var(--g3) 70%,transparent);margin-block:4px}
.f .btn.hintbtn svg{width:22px;height:22px}
.f .btn.answer{height:62px;border-radius:20px;font-size:18px;font-weight:700;margin-top:8px;gap:12px}
.f .btn.answer svg{width:22px;height:22px;stroke-width:2.4}
.f .btn.answer.is-off{opacity:.32}
.fbtns{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.f .btn.tall{height:62px;border-radius:20px;font-size:18px;font-weight:700;gap:12px}
.f .btn.tall svg{width:22px;height:22px}
.btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}

/* audio */
.player{background:var(--card);border-radius:24px;padding:18px 18px 20px}
.prog{height:6px;border-radius:3px;background:var(--line);margin:18px 0 10px;position:relative}
.prog i{position:absolute;left:0;top:0;bottom:0;width:38%;border-radius:3px;background:linear-gradient(90deg,var(--g1),var(--g2))}
.prog i::after{content:"";position:absolute;right:-8px;top:-5px;width:16px;height:16px;border-radius:50%;background:var(--pri);box-shadow:0 0 0 4px color-mix(in srgb,var(--pri) 25%,transparent)}
.times{display:flex;justify-content:space-between;align-items:center;font:500 13px/1 Cygre,sans-serif;color:var(--mute);font-variant-numeric:tabular-nums}
.speed{height:28px;padding:0 10px;border-radius:14px;border:1.5px solid var(--line);display:grid;place-items:center;color:var(--fg)}
.ctrls{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding:0 4px}
.ctrls .pp{width:72px;height:72px;border-radius:50%;background:var(--fg);color:var(--bg);display:grid;place-items:center}
.ctrls .pp svg{width:30px;height:30px}
.ctrls .pp{box-shadow:0 0 0 3px var(--card),0 0 0 6px transparent;position:relative}
.ctrls .pp::before{content:"";position:absolute;inset:-7px;border-radius:50%;padding:3px;background:var(--kgrad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.ctrls .sm{width:44px;height:44px;display:grid;place-items:center}
.ctrls .sm svg{width:28px;height:28px}
.fade{position:relative;max-height:150px;overflow:hidden;font-size:16px;line-height:1.5}
.fade::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(transparent,var(--bg))}
.f .more{display:flex;align-items:center;gap:6px;font:500 15px/1 Cygre,sans-serif;color:var(--pri)}
.f[data-theme="light"] .f .more,.f[data-theme="light"] .more{color:#1c7a57}

/* quest */
.qhead{display:flex;justify-content:space-between;align-items:center;font:500 15px/1 Cygre,sans-serif}
.segs{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin:10px 0 6px}
.segs i{height:6px;border-radius:3px;background:var(--line)}
.segs i.on{background:var(--kgrad);background-size:900% 100%}
.qimg{height:220px;border-radius:24px}
.qplace{display:flex;align-items:center;gap:6px;color:var(--mute);font:500 14px/1 Cygre,sans-serif}
.qplace svg{width:16px;height:16px}
.qn{font:700 15px/1 Cygre,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-top:4px}
.qq{font:700 22px/1.25 Cygre,sans-serif}
.hint{border-radius:18px;padding:14px 16px;background:color-mix(in srgb,var(--g3) 22%,var(--bg));border:1.5px solid color-mix(in srgb,var(--g3) 70%,transparent);display:flex;gap:12px;font-size:15px;line-height:1.4}
.hint b{display:block;font-weight:700;margin-bottom:2px}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{display:flex;align-items:center;gap:14px;min-height:56px;padding:0 16px;border-radius:16px;background:var(--card);font:500 17px/1.2 Cygre,sans-serif;border:2px solid transparent}
.opt .mk{width:24px;height:24px;border-radius:50%;border:2px solid var(--mute);flex:none;display:grid;place-items:center}
.opt .mk svg{width:16px;height:16px}
.opt.sel{border-color:var(--fg)}.opt.sel .mk{border-color:var(--fg);background:var(--fg);color:var(--bg)}
.opt.ok{border-color:var(--ok);background:color-mix(in srgb,var(--ok) 16%,var(--bg))}.opt.ok .mk{border-color:var(--ok);background:var(--ok);color:#fff}
.opt.bad{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 14%,var(--bg))}.opt.bad .mk{border-color:var(--bad);background:var(--bad);color:#fff}
.dim{opacity:.55}
.sheet{position:absolute;left:0;right:0;bottom:0;z-index:6;background:var(--bg);border-radius:28px 28px 0 0;padding:12px 20px 26px;box-shadow:0 -20px 50px rgba(0,0,0,.25)}
.sheet .grab{width:44px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 18px}
.scrim{position:absolute;inset:0;z-index:5;background:rgba(0,0,0,.45)}
.res{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.res .rc{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}
.res .rc svg{width:30px;height:30px}
.res h3{font:700 24px/1.15 Cygre,sans-serif}
.res small{display:block;color:var(--mute);font-size:14px;margin-top:4px}
.fact{border-radius:16px;background:var(--card2);padding:14px 16px;font-size:15px;line-height:1.45;margin:6px 0 16px}
.final{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding-top:12px}
.medal{width:200px;height:200px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(from 200deg,var(--g1),var(--g2),var(--g3),var(--g4),var(--g1))}
.medal::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--bg)}
.medal div{position:relative;font:700 64px/1 Cygre,sans-serif}
.medal small{display:block;font:500 15px/1.2 Cygre,sans-serif;color:var(--mute);margin-top:6px}
.stars{display:flex;gap:6px;color:var(--g3)}
.stars svg{width:32px;height:32px}
.stars .off{color:var(--line)}

/* location single */
.share-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.prose p{font-size:16px;line-height:1.55;margin-bottom:12px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.facts div{background:var(--card2);border-radius:16px;padding:12px 14px;font-size:13px;color:var(--mute)}
.facts b{display:block;font:700 18px/1.2 Cygre,sans-serif;color:var(--fg);margin-bottom:2px}
.soc{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0 6px}
.soc a{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px}
.soc i{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;color:#fff;font:700 20px/1 Cygre,sans-serif;font-style:normal}
.copy{display:flex;align-items:center;gap:10px;height:54px;border-radius:16px;background:var(--card);padding:0 8px 0 16px;font-size:14px;color:var(--mute)}
.copy span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.copy button{height:40px;padding:0 14px;border-radius:12px;background:var(--fg);color:var(--bg);display:flex;align-items:center;gap:6px;font-size:14px}
.copy button svg{width:18px;height:18px}

/* map */
.map{position:relative;flex:1;min-height:560px;background:#222 center/cover}
.map .pin{position:absolute;width:30px;height:38px;transform:translate(-50%,-100%)}
.map .tools{position:absolute;right:16px;top:16px;display:flex;flex-direction:column;gap:8px}
.map .tools span{width:44px;height:44px;border-radius:14px;background:var(--bg);display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.map .chips{position:absolute;left:16px;right:0;top:16px}
.map .chips span{box-shadow:0 4px 14px rgba(0,0,0,.2);background:var(--bg)}
.map .chips span.on{background:var(--fg);color:var(--bg)}
.pcard{position:absolute;left:16px;right:16px;bottom:16px;display:flex;gap:12px;padding:10px;border-radius:22px;background:var(--bg);box-shadow:0 12px 30px rgba(0,0,0,.35);align-items:center}
.pcard .ph{width:92px;height:92px;border-radius:16px;flex:none}
.pcard .tx{flex:1;font:500 16px/1.25 Cygre,sans-serif}
.pcard small{display:block;font-size:13px;color:var(--mute);margin-top:4px;font-weight:400}

/* info */
.tic{border-radius:24px;padding:20px;background:linear-gradient(135deg,#1f8f66,#156b4d);color:#fff}
.tic .eyebrow{color:rgba(255,255,255,.8)}
.tic h3{font:700 26px/1.15 Cygre,sans-serif;margin:8px 0 4px}
.tic p{font-size:15px;color:rgba(255,255,255,.92)}
.tic .row{margin-top:16px}
.tic .chip{background:rgba(255,255,255,.18);color:#fff;height:34px;padding:0 14px}
.svc{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.svc div{background:var(--card);border-radius:18px;padding:14px;font:500 14px/1.3 Cygre,sans-serif;min-height:112px;display:flex;flex-direction:column;gap:10px}
.svc svg{width:28px;height:28px;color:var(--fg)}

.lbtn{display:flex;align-items:center;gap:14px;height:66px;padding:0 16px;border-radius:18px;background:var(--card);font:500 17px/1 Cygre,sans-serif}
.lbtn .bi{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#fff;font:700 15px/1 Cygre,sans-serif;flex:none}
.lbtn .tx{flex:1}
.lbtn small{display:block;font:400 13px/1.2 Cygre,sans-serif;color:var(--mute);margin-top:4px}
.credit{margin-top:auto;padding-top:24px;text-align:center;font-size:13px;color:var(--mute)}

/* blog */
.post{border-radius:24px;background:var(--card);overflow:hidden}
.post .ph{height:200px;border-radius:0}
.post .bd{padding:16px 18px 18px}
.post h2{font:700 22px/1.2 Cygre,sans-serif;margin:8px 0 6px}
.post p{font-size:15px;line-height:1.4;color:var(--mute)}
.meta{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--mute)}
.meta i{width:4px;height:4px;border-radius:50%;background:var(--mute)}
.art-hero{height:260px;border-radius:24px;position:relative;overflow:hidden;background:linear-gradient(135deg,var(--g1),var(--g2) 55%,var(--g3))}
.art-hero svg{position:absolute;inset:0;width:100%;height:100%}
.tagc{display:inline-flex;height:30px;align-items:center;padding:0 12px;border-radius:15px;border:1.5px solid var(--fg);font:500 13px/1 Cygre,sans-serif;align-self:flex-start}

/* menu modal */
.menu{position:absolute;inset:0;z-index:8;background:var(--bg);display:flex;flex-direction:column;padding:0 16px 24px}
.menu .hd{padding:0;background:transparent}
.menu nav{display:flex;flex-direction:column;gap:2px;margin:10px 0 18px}
.menu nav a{display:flex;align-items:center;justify-content:space-between;height:60px;font:700 26px/1 Cygre,sans-serif;border-bottom:1px solid var(--line)}
.about{background:var(--card2);border-radius:22px;padding:18px;font-size:15px;line-height:1.5}
.about h3{font:700 22px/1.2 Cygre,sans-serif;margin-bottom:8px}
.tog{display:flex;background:var(--card);border-radius:14px;padding:4px;gap:4px}
.tog span{flex:1;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;gap:6px;font:500 14px/1 Cygre,sans-serif}
.tog span.on{background:var(--bg);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.tog svg{width:18px;height:18px}

/* modal (AR) */
.modal{position:absolute;left:20px;right:20px;top:50%;transform:translateY(-50%);z-index:7;background:var(--bg);border-radius:28px;padding:26px 22px 22px;text-align:center;box-shadow:0 30px 60px rgba(0,0,0,.4)}
.modal .mi{width:84px;height:84px;margin:0 auto 16px;border-radius:26px;background:var(--card);display:grid;place-items:center}
.modal .mi svg{width:44px;height:44px}
.modal h3{font:700 22px/1.25 Cygre,sans-serif;margin-bottom:8px}
.modal p{font-size:15px;color:var(--mute);margin-bottom:18px}
.modal .x{position:absolute;right:12px;top:12px;width:40px;height:40px;border-radius:50%;background:var(--card);display:grid;place-items:center}
.modal .x svg{width:20px;height:20px}

/* 404 */
.e404{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:0 10px}
.e404 .big{font:700 120px/1 Cygre,sans-serif;display:flex;gap:4px;align-items:center}
.e404 .big i{display:block;width:96px;height:96px;border-radius:50%;background:conic-gradient(var(--g1),var(--g2),var(--g3),var(--g4),var(--g1));position:relative}
.e404 .big i::after{content:"";position:absolute;inset:22px;border-radius:50%;background:var(--bg)}

/* desktop wrapper */
.dsk{flex:1;display:flex;align-items:center;justify-content:center;position:relative;background:var(--card2)}
.f[data-theme="dark"] .dsk{background:radial-gradient(60% 50% at 50% 0%,rgba(79,195,152,.12),transparent 70%),#0A0D11}
.dsk .phone{transform:scale(.94);transform-origin:center}
.dsk .phone .f{box-shadow:0 30px 80px rgba(0,0,0,.35)}
.qr{position:absolute;right:56px;bottom:48px;width:180px;text-align:center;font:500 14px/1.3 Cygre,sans-serif}
.qr .q{width:180px;height:180px;border-radius:20px;background:#161616 center/84% no-repeat;margin-top:10px;box-shadow:0 10px 30px rgba(0,0,0,.15)}

.dsk .brand{position:absolute;left:56px;top:48px;display:flex;flex-direction:column;gap:14px;max-width:340px}
.dsk .brand img{width:150px}
.dsk .brand h2{font:700 40px/1.1 Cygre,sans-serif}
.dsk .brand p{color:var(--mute);font-size:16px}