:root{--u:calc(min(100vw,177.7dvh)/1672);--ink:#2a1a0e;--gold:#ffc21a;--navy:rgba(16,26,44,.84);--navy2:rgba(26,40,66,.9);--edge:rgba(255,255,255,.16);--blue:#2b8cff;--green:#4ccf3a}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#7fb5e6;overflow:hidden;font-family:"Segoe UI","Trebuchet MS",system-ui,sans-serif;color:#fff;user-select:none;-webkit-user-select:none}
body.embed-mode{height:100vh;height:100dvh;overflow:hidden}
#stage{position:fixed;inset:0}
#c{width:100%;height:100%;display:block;touch-action:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
.edge{position:fixed;top:0;bottom:0;width:7%;pointer-events:none;z-index:2;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);transition:opacity .4s}
#blurL{left:0;-webkit-mask-image:linear-gradient(90deg,#000,transparent);mask-image:linear-gradient(90deg,#000,transparent)}
#blurR{right:0;-webkit-mask-image:linear-gradient(270deg,#000,transparent);mask-image:linear-gradient(270deg,#000,transparent)}
body.playing .edge{opacity:0}
#loading{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;background:linear-gradient(#7fc1f2,#cfe8c0);transition:opacity .5s}
#loading.done{opacity:0;pointer-events:none}
.ld-card{text-align:center;color:#2a1a0e;font-weight:700}.ld-paw{font-size:56px;animation:bob 1s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
.ld-bar{width:min(260px,60vw);height:10px;border-radius:9px;background:#fff8;margin:10px auto 0;overflow:hidden}.ld-bar i{display:block;height:100%;width:5%;background:#ff9d1c;border-radius:9px;transition:width .2s}
#fade{position:fixed;inset:0;background:#0b1220;opacity:0;pointer-events:none;z-index:40;transition:opacity .35s}#fade.on{opacity:1}
#tags{position:fixed;inset:0;pointer-events:none;z-index:6;overflow:hidden}
.tag{position:absolute;display:flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;border-radius:7px;background:rgba(18,26,40,.72);color:#fff;font-weight:700;font-size:clamp(11px,calc(var(--u)*22),20px);white-space:nowrap;transform:translate(-50%,-100%);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.tag svg{width:1.6em;height:1.1em;border-radius:2px;flex:none}

/* ---------------- menu ---------------- */
#menu{position:fixed;inset:0;z-index:8;pointer-events:none}
#menu>*{pointer-events:auto}
body.playing #menu{display:none}
#logo{position:absolute;left:calc(var(--u)*18);top:calc(var(--u)*18);width:calc(var(--u)*340);height:calc(var(--u)*200);pointer-events:none;filter:drop-shadow(0 calc(var(--u)*6) calc(var(--u)*8) rgba(0,0,0,.5))}
#logo .wood{position:absolute;left:calc(var(--u)*6);top:calc(var(--u)*6);right:calc(var(--u)*6);bottom:calc(var(--u)*6);border-radius:calc(var(--u)*16);background:repeating-linear-gradient(92deg,#8a5a2c 0 calc(var(--u)*9),#7a4d24 calc(var(--u)*9) calc(var(--u)*17),#94622f calc(var(--u)*17) calc(var(--u)*26));border:calc(var(--u)*5) solid #4f2f14;box-shadow:inset 0 0 calc(var(--u)*14) rgba(0,0,0,.45)}
#logo b{position:absolute;left:0;right:0;text-align:center;font-family:"Arial Rounded MT Bold","Arial Black","Trebuchet MS",system-ui,sans-serif;font-weight:900;line-height:1;white-space:nowrap}
#logo b u,#logo b s{text-decoration:none;display:block}#logo b u{position:absolute;left:0;right:0;top:0}
#logo .l-dog{top:calc(var(--u)*6);font-size:calc(var(--u)*104)}#logo .l-park{top:calc(var(--u)*92);font-size:calc(var(--u)*88)}
#logo .l-dog u{color:#3a1d08;-webkit-text-stroke:calc(var(--u)*14) #3a1d08;text-shadow:0 calc(var(--u)*7) 0 #3a1d08}
#logo .l-dog s{background:linear-gradient(#ffe066 6%,#ffb21c 55%,#ff8a00 96%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;position:relative}
#logo .l-park u{color:#1d4a10;-webkit-text-stroke:calc(var(--u)*14) #1d4a10;text-shadow:0 calc(var(--u)*7) 0 #1d4a10}
#logo .l-park s{background:linear-gradient(#c8ff6a 6%,#72d62a 55%,#3fa51c 96%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;position:relative}
#logo .leaf{position:absolute;font-size:calc(var(--u)*50);filter:saturate(1.4)}#logo .l1{left:calc(var(--u)*-12);top:calc(var(--u)*110);transform:rotate(-30deg)}#logo .l2{right:calc(var(--u)*-8);top:calc(var(--u)*0);transform:scaleX(-1) rotate(-30deg)}
#profile{position:absolute;left:calc(var(--u)*443);top:calc(var(--u)*19);width:calc(var(--u)*297);height:calc(var(--u)*86);display:flex;gap:calc(var(--u)*12);align-items:center;padding:calc(var(--u)*8) calc(var(--u)*10);background:var(--navy);border:calc(var(--u)*2) solid var(--edge);border-radius:calc(var(--u)*10);cursor:pointer}
#avatar{width:calc(var(--u)*66);height:calc(var(--u)*66);border-radius:50%;border:calc(var(--u)*3) solid #6aa8ff;object-fit:cover;background:#345}
.pf{flex:1;min-width:0}.pf b{display:block;font-size:calc(var(--u)*24);line-height:1.1}.pf span{display:block;font-size:calc(var(--u)*17);color:#c9d6ea;margin-bottom:calc(var(--u)*4)}
.xpbar{position:relative;height:calc(var(--u)*17);background:#0b1626;border-radius:calc(var(--u)*5);overflow:hidden}.xpbar i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#52b6ff,#1f7be6);width:78%}.xpbar em{position:absolute;inset:0;font-style:normal;text-align:center;font-size:calc(var(--u)*14);line-height:calc(var(--u)*17);font-weight:700}
.cur{position:absolute;top:calc(var(--u)*22);height:calc(var(--u)*54);width:calc(var(--u)*186);display:flex;align-items:center;gap:calc(var(--u)*10);padding:0 calc(var(--u)*8) 0 calc(var(--u)*10);background:var(--navy);border:calc(var(--u)*2) solid var(--edge);border-radius:calc(var(--u)*10)}
#p-coin{left:calc(var(--u)*765)}#p-gem{left:calc(var(--u)*973)}
.cur b{flex:1;font-size:calc(var(--u)*27);font-weight:700}
.coin,.gem{display:inline-block;width:calc(var(--u)*38);height:calc(var(--u)*38);flex:none}
.coin{border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3a0,#ffc21a 45%,#d98a00);border:calc(var(--u)*3) solid #c07a00;box-shadow:inset 0 0 0 calc(var(--u)*4) #ffd84a}
.gem{background:linear-gradient(135deg,#ff9bff,#b13bff 55%,#6a14b8);clip-path:polygon(50% 0,92% 30%,75% 100%,25% 100%,8% 30%);filter:drop-shadow(0 0 2px #e6a0ff)}
.plus{width:calc(var(--u)*36);height:calc(var(--u)*36);font-size:calc(var(--u)*32);line-height:1;font-weight:700;color:#fff}
#icons{position:absolute;right:calc(var(--u)*22);top:calc(var(--u)*22);display:flex;gap:calc(var(--u)*17)}
.sq{position:relative;width:calc(var(--u)*86);height:calc(var(--u)*58);background:var(--navy);border:calc(var(--u)*2) solid var(--edge);border-radius:calc(var(--u)*10);display:flex;align-items:center;justify-content:center}
.sq svg{width:calc(var(--u)*34);height:calc(var(--u)*34);fill:#f3f6fb}
#mail-badge{position:absolute;right:calc(var(--u)*-6);top:calc(var(--u)*-8);min-width:calc(var(--u)*24);height:calc(var(--u)*24);padding:0 calc(var(--u)*5);border-radius:calc(var(--u)*12);background:#e8312f;font-style:normal;font-weight:700;font-size:calc(var(--u)*16);line-height:calc(var(--u)*24);text-align:center}
#nav{position:absolute;left:calc(var(--u)*22);top:calc(var(--u)*212);width:calc(var(--u)*256);display:flex;flex-direction:column;gap:calc(var(--u)*2)}
#nav button{display:flex;align-items:center;gap:calc(var(--u)*18);height:calc(var(--u)*51);padding:0 calc(var(--u)*18);background:var(--navy);border:calc(var(--u)*2) solid var(--edge);border-radius:calc(var(--u)*7);text-align:left;font-size:calc(var(--u)*23);font-weight:600;transition:transform .12s,background .12s}
#nav button svg{width:calc(var(--u)*32);height:calc(var(--u)*32);fill:#f3f6fb;flex:none}
#nav button:hover{background:var(--navy2);transform:translateX(calc(var(--u)*4))}
#nav button.on{background:linear-gradient(#34a0ff,#1676ec);border-color:#9bd0ff;box-shadow:0 0 calc(var(--u)*18) rgba(60,160,255,.75)}
#cards{position:absolute;right:calc(var(--u)*22);top:calc(var(--u)*100);width:calc(var(--u)*462);display:flex;flex-direction:column;gap:calc(var(--u)*10)}
.card{display:flex;align-items:center;gap:calc(var(--u)*16);height:calc(var(--u)*126);padding:calc(var(--u)*12) calc(var(--u)*14);background:var(--navy);border:calc(var(--u)*2) solid var(--edge);border-radius:calc(var(--u)*12);text-align:left;width:100%}
.card img{width:calc(var(--u)*170);height:calc(var(--u)*100);object-fit:cover;border-radius:calc(var(--u)*8);border:calc(var(--u)*2) solid rgba(255,255,255,.25);flex:none}
.card div{flex:1;min-width:0}.card b{display:block;font-size:calc(var(--u)*25);margin-bottom:calc(var(--u)*6)}.card span{display:block;font-size:calc(var(--u)*17.5);color:#d6e0f0;line-height:1.3}
.card svg{width:calc(var(--u)*34);height:calc(var(--u)*34);flex:none}.card:hover{background:var(--navy2)}
#playnow{position:absolute;right:calc(var(--u)*22);top:calc(var(--u)*650);width:calc(var(--u)*388);height:calc(var(--u)*98);display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*22);border-radius:calc(var(--u)*12);background:linear-gradient(#ffe04a,#ffc21a 60%,#f5ac00);border:calc(var(--u)*3) solid #fff1a0;color:#1b1406;font-weight:900;font-size:calc(var(--u)*40);letter-spacing:.01em;box-shadow:0 calc(var(--u)*8) calc(var(--u)*18) rgba(0,0,0,.4),0 0 calc(var(--u)*22) rgba(255,210,40,.5);transition:transform .12s;animation:pulse 2.2s ease-in-out infinite}
#playnow:hover{transform:scale(1.03)}#playnow svg{width:calc(var(--u)*40);height:calc(var(--u)*40);fill:#1b1406}#playnow .chev{width:calc(var(--u)*34);height:calc(var(--u)*34)}
@keyframes pulse{50%{box-shadow:0 calc(var(--u)*8) calc(var(--u)*18) rgba(0,0,0,.4),0 0 calc(var(--u)*36) rgba(255,210,40,.85)}}
#sci-link{position:absolute;right:calc(var(--u)*24);top:calc(var(--u)*760);font-size:calc(var(--u)*17);color:#fff;background:rgba(16,26,44,.7);padding:calc(var(--u)*5) calc(var(--u)*12);border-radius:calc(var(--u)*14);border:1px solid var(--edge)}
#q-toggle{position:absolute;right:calc(var(--u)*212);top:calc(var(--u)*760);font-size:calc(var(--u)*17);color:#fff;background:rgba(16,26,44,.7);padding:calc(var(--u)*5) calc(var(--u)*12);border-radius:calc(var(--u)*14);border:1px solid var(--edge)}
#carousel{position:absolute;left:calc(var(--u)*22);right:calc(var(--u)*22);bottom:calc(var(--u)*18);height:calc(var(--u)*124);display:flex;align-items:center;gap:calc(var(--u)*14)}
#c-track{flex:1;display:flex;gap:calc(var(--u)*16);overflow:hidden;height:100%}
.arrow{width:calc(var(--u)*54);height:calc(var(--u)*54);border-radius:50%;background:rgba(14,22,36,.88);border:calc(var(--u)*2) solid var(--edge);font-size:calc(var(--u)*44);line-height:calc(var(--u)*46);flex:none}
.tile{position:relative;flex:1 0 calc((100% - var(--u)*80)/6);height:100%;border-radius:calc(var(--u)*8);overflow:hidden;border:calc(var(--u)*3) solid rgba(255,255,255,.18);background:#0e1626}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile span{position:absolute;left:0;right:0;bottom:0;padding:calc(var(--u)*4) 0 calc(var(--u)*5);background:rgba(10,16,28,.86);text-align:center;font-weight:600;font-size:calc(var(--u)*21)}
.tile.on{border-color:#5ab4ff;box-shadow:0 0 calc(var(--u)*16) rgba(70,170,255,.9),inset 0 0 0 calc(var(--u)*2) rgba(120,200,255,.6)}
.tile:hover{border-color:#a9d9ff}

/* ---------------- HUD ---------------- */
#hud{position:fixed;inset:0;pointer-events:none;z-index:7}#hud>*{pointer-events:none}
#hud button,#hud #touch>*{pointer-events:auto}
#h-left{position:absolute;left:12px;top:12px;display:flex;flex-direction:column;gap:8px;width:min(230px,46vw)}
#h-pause{pointer-events:auto;width:40px;height:40px;border-radius:9px;background:var(--navy);border:1px solid var(--edge);font-size:15px;letter-spacing:-2px}
#h-who{background:var(--navy);border:1px solid var(--edge);border-radius:9px;padding:5px 10px;display:flex;justify-content:space-between;font-weight:700}#h-who span{color:#ffd86a}
#h-bars{background:var(--navy);border:1px solid var(--edge);border-radius:9px;padding:7px 9px;display:flex;flex-direction:column;gap:6px}
.hb{display:grid;grid-template-columns:54px 1fr 42px;gap:6px;align-items:center;font-size:12px;font-weight:600}.hb .bar{height:9px;border-radius:5px;background:#0b1626;overflow:hidden}.hb .bar i{display:block;height:100%;border-radius:5px;width:50%}.hb em{font-style:normal;text-align:right;color:#cfdcf0}
#h-banner{position:absolute;left:50%;top:10px;transform:translateX(-50%);text-align:center;text-shadow:0 2px 6px rgba(0,0,0,.7)}
#h-mode{display:inline-block;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:3px 12px;border-radius:12px;background:rgba(16,26,44,.8)}
#h-timer{font-size:clamp(28px,5vw,44px);font-weight:900;font-variant-numeric:tabular-nums;line-height:1.1}#h-sub{font-size:14px;font-weight:600;color:#fff6c8}
#h-right{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:8px;align-items:flex-end;width:min(230px,44vw)}
#mini{width:min(160px,34vw);height:auto;border-radius:10px;border:2px solid rgba(255,255,255,.35);background:#1a3a24;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.cur.sm{position:static;width:auto;height:34px;padding:0 12px 0 8px}.cur.sm .coin{width:22px;height:22px}.cur.sm b{font-size:16px;flex:none}
#h-missions{background:var(--navy);border:1px solid var(--edge);border-radius:9px;padding:7px 10px;font-size:12px;width:100%}
#h-missions h4{margin:0 0 4px;font-size:12px;color:#ffd86a;letter-spacing:.06em}.ms{display:flex;justify-content:space-between;gap:6px;padding:1px 0}.ms.ok{color:#8dff9a}
#h-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);font-size:13px;background:rgba(16,26,44,.75);padding:5px 12px;border-radius:12px;text-align:center;max-width:90vw}
#h-arrow{position:absolute;left:50%;top:70px;width:46px;height:46px;margin-left:-23px;opacity:0;transition:opacity .2s}#h-arrow svg{width:100%;height:100%;fill:#ffd23c;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
#h-pos{position:absolute;left:12px;top:216px;font-weight:800;font-size:13px;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 4px #000}#h-pos div{background:rgba(16,26,44,.72);padding:2px 9px;border-radius:7px;display:flex;gap:8px}#h-pos .me{background:rgba(255,194,26,.88);color:#241800}
#toast{position:absolute;left:50%;top:104px;transform:translate(-50%,-10px);background:rgba(16,26,44,.92);border:1px solid #ffd86a;padding:7px 16px;border-radius:14px;font-weight:700;opacity:0;transition:.25s;text-align:center;max-width:90vw}#toast.on{opacity:1;transform:translate(-50%,0)}
#count{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(80px,22vw,200px);font-weight:900;color:#ffe066;text-shadow:0 6px 0 #5a3a00,0 0 30px rgba(0,0,0,.5);opacity:0}
#touch{display:none;position:absolute;inset:auto 0 0 0;height:210px}
body.touch #touch{display:block}body.touch #h-hint{bottom:auto;top:62px;font-size:11px;display:none}
#stick{position:absolute;left:22px;bottom:24px;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.14);border:2px solid rgba(255,255,255,.35)}#stick i{position:absolute;left:35px;top:35px;width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.55)}
#tbtns{position:absolute;right:14px;bottom:20px;display:grid;grid-template-columns:repeat(3,64px);gap:8px}
#tbtns button{height:56px;border-radius:14px;background:rgba(20,30,50,.72);border:2px solid rgba(255,255,255,.4);font-weight:800;font-size:13px}#tbtns button:active{background:rgba(255,194,26,.85);color:#241800}

/* ---------------- editor ---------------- */
#editor{position:fixed;inset:0;z-index:9;pointer-events:none}#editor>*{pointer-events:auto}
#ed-tools{position:absolute;left:10px;top:10px;bottom:70px;overflow:auto;display:flex;flex-direction:column;gap:5px;width:132px}
#ed-tools button{background:var(--navy);border:1px solid var(--edge);border-radius:8px;padding:8px 6px;font-size:13px;font-weight:600;text-align:left}#ed-tools button.on{background:linear-gradient(#34a0ff,#1676ec);border-color:#9bd0ff}
#ed-bar{position:absolute;left:150px;right:10px;bottom:10px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
#ed-bar button{background:var(--navy);border:1px solid var(--edge);border-radius:8px;padding:9px 12px;font-weight:700;font-size:13px}#ed-bar #ed-test{background:#ffc21a;color:#1b1406}#ed-info{font-size:12px;background:rgba(16,26,44,.75);padding:5px 9px;border-radius:8px}

/* ---------------- modal ---------------- */
#modal{position:fixed;inset:0;z-index:30;background:rgba(5,10,20,.55);display:flex;align-items:center;justify-content:center;padding:10px}#modal[hidden]{display:none}
.m-card{position:relative;width:min(920px,96vw);max-height:92dvh;overflow:auto;background:linear-gradient(#17233a,#101a2c);border:2px solid var(--edge);border-radius:14px;padding:18px 20px 20px;box-shadow:0 12px 40px rgba(0,0,0,.6)}
.m-x{position:absolute;right:10px;top:6px;font-size:32px;color:#cfe}
.m-card h2{margin:0 0 10px;font-size:24px}.m-card h3{margin:14px 0 6px;font-size:16px;color:#ffd86a}.m-card p,.m-card li{font-size:14px;line-height:1.5;color:#d9e4f4}
.tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}.tabs button{padding:7px 14px;border-radius:9px;background:#223350;font-weight:700;font-size:14px}.tabs button.on{background:var(--blue)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.box{background:#1b2a46;border:1px solid var(--edge);border-radius:10px;padding:10px 12px}.box h4{margin:0 0 4px;font-size:15px}.box small{color:#a9bad4}
.btn{display:inline-block;padding:7px 14px;border-radius:9px;background:var(--blue);font-weight:700;font-size:13px;margin-top:6px}.btn.gold{background:#ffc21a;color:#1b1406}.btn.off{background:#3a4660;color:#97a5bf;pointer-events:none}.btn.red{background:#d83a3a}
.stat{display:grid;grid-template-columns:70px 1fr 38px;gap:6px;font-size:12px;align-items:center;margin:3px 0}.stat .bar{height:8px;background:#0b1626;border-radius:5px;overflow:hidden}.stat .bar i{display:block;height:100%;background:linear-gradient(#52b6ff,#1f7be6)}
.dogcard img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px;margin-bottom:6px}
.sw{display:flex;gap:7px;flex-wrap:wrap}.sw button{width:38px;height:38px;border-radius:50%;border:3px solid transparent;position:relative}.sw button.on{border-color:#fff}.sw button.lock::after{content:'\1F512';font-size:13px;position:absolute;right:-5px;bottom:-5px}
.sw.pic button{width:auto;height:auto;border-radius:9px;padding:7px 12px;background:#223350;font-weight:700;font-size:13px;border:2px solid transparent}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:5px 8px;text-align:left;border-bottom:1px solid rgba(255,255,255,.1)}tr.me td{background:rgba(255,194,26,.2);color:#ffe9a0;font-weight:700}
.chk td.ok{color:#8dff9a;font-weight:800}.chk td.bad{color:#ff8c8c;font-weight:800}
.prog{height:7px;background:#0b1626;border-radius:4px;overflow:hidden;margin:4px 0}.prog i{display:block;height:100%;background:linear-gradient(#7cf06a,#22b52f)}
details{background:#1b2a46;border-radius:9px;padding:8px 12px;margin:8px 0}summary{cursor:pointer;font-weight:700}
input[type=range]{width:100%}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.08)}
kbd{background:#2c3d5e;border-radius:4px;padding:1px 6px;font-size:12px}

#modal:has(.side){background:none;pointer-events:none;justify-content:flex-end;align-items:center}.m-card.side{pointer-events:auto;width:min(380px,92vw);max-height:78dvh}
@media (max-width:820px),(max-aspect-ratio:1/1){#modal:has(.side){align-items:flex-end;justify-content:center}.m-card.side{width:100%;max-height:46dvh}}
/* ---------------- phones ---------------- */
@media (max-width:820px),(max-aspect-ratio:1/1){
  :root{--u:calc(100vw/430)}
  #logo{left:4px;top:4px;width:150px;height:92px}#logo b{font-size:1px}#logo .l-dog{font-size:58px}#logo .l-park{top:40px;font-size:48px}#logo .leaf{display:none}
  #logo b u{-webkit-text-stroke-width:7px!important}
  #profile{left:auto;right:6px;top:6px;width:150px;height:46px;padding:4px 6px;gap:6px}#avatar{width:34px;height:34px}.pf b{font-size:13px}.pf span{font-size:10px;margin:0}.xpbar{height:10px}.xpbar em{font-size:8px;line-height:10px}
  .cur{top:56px;height:30px;width:96px;gap:4px;padding:0 3px}.cur b{font-size:14px}.coin,.gem{width:20px;height:20px}.plus{width:20px;height:20px;font-size:18px}#p-coin{left:auto;right:106px}#p-gem{left:auto;right:6px}
  #icons{right:6px;top:92px;gap:5px}.sq{width:40px;height:32px}.sq svg{width:18px;height:18px}
  #nav{left:0;right:0;top:auto;bottom:96px;width:auto;flex-direction:row;overflow-x:auto;gap:5px;padding:0 6px}
  #nav button{flex:none;height:38px;padding:0 10px;font-size:13px;gap:6px;border-radius:19px}#nav button svg{width:16px;height:16px}
  #cards{display:none}
  #playnow{right:8px;top:auto;bottom:146px;width:150px;height:46px;font-size:18px;gap:8px}#playnow svg{width:18px;height:18px}#playnow .chev{width:16px;height:16px}
  #sci-link{top:auto;bottom:154px;right:auto;left:8px;font-size:11px;padding:4px 9px}
  #q-toggle{top:auto;bottom:154px;right:auto;left:150px;font-size:11px;padding:4px 9px}
  #carousel{left:4px;right:4px;bottom:8px;height:82px;gap:4px}.arrow{width:28px;height:28px;font-size:24px;line-height:24px}#c-track{gap:6px;overflow-x:auto}.tile{flex:0 0 112px}.tile span{font-size:11px;padding:2px 0}
  .tag{font-size:10px}
  #h-left{width:150px}.hb{grid-template-columns:44px 1fr 34px;font-size:10px}#h-right{width:120px}#mini{width:100px}#h-missions{display:none}
  #h-pos{top:200px}
}
@media (max-height:520px) and (min-aspect-ratio:1/1){#h-missions{display:none}#h-left{width:190px}}