@font-face{font-family:Baloo;src:url(fonts/baloo2_extrabold.ttf);font-weight:800}
@font-face{font-family:Baloo;src:url(fonts/baloo2_bold.ttf);font-weight:600}
:root{--u:1px;--ink:#3a2a22;--orange:#f26a1b;--wood:#7a3a10}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%;margin:0;height:100%;overflow:hidden;background:#5a2a0c url(img/bg_result_wood.webp) center/cover;font-family:Baloo,system-ui,sans-serif;font-weight:800;color:var(--ink);overscroll-behavior:none;user-select:none;-webkit-user-select:none}
button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer}
#backdrop{position:fixed;inset:-6%;background-size:cover;background-position:center;filter:blur(34px) brightness(.72) saturate(.6);pointer-events:none}
.edge{position:fixed;display:none;transform:scaleX(-1);background-repeat:no-repeat;pointer-events:none}
#stage{position:absolute;overflow:hidden;background:#7a3a10}
.screen{position:absolute;inset:0;display:none}
.screen.on{display:block}
.bg{position:absolute;inset:0 -3px;width:calc(100% + 6px);max-width:none;height:100%;display:block}
.screen>*{position:absolute}
.screen>.bg,.screen>.wood{position:absolute}
.txt{display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.02;font-size:calc(var(--u)*34);overflow:hidden}
.txt.ink{color:var(--ink)}
.txt.note{color:#fff;font-size:calc(var(--u)*26);font-weight:600;text-shadow:0 2px 4px #0008}
.txt.sign{color:#fff;font-size:calc(var(--u)*64);text-shadow:0 calc(var(--u)*3) 0 #7a2a08,0 0 calc(var(--u)*8) #7a2a08;-webkit-text-stroke:calc(var(--u)*5) #7a2a08;paint-order:stroke fill}
.txt.xp{color:#e8650f;font-size:calc(var(--u)*38)}
/* The live speed-bonus pill of the guess screen (LiveXpBonusBadge): a solid pill whose colour follows how fast the answer is. */
#g-bonus{color:#fff;font-size:calc(var(--u)*30);border-radius:99px;border:calc(var(--u)*3) solid #ffffffd9;transition:background .4s;text-shadow:0 calc(var(--u)*3) calc(var(--u)*4) #0008;white-space:nowrap}
#d-prog .sw{display:inline-block;width:calc(var(--u)*34);height:calc(var(--u)*34);margin-right:calc(var(--u)*12);vertical-align:-12%}
.hit{background:none}
.pill{display:flex;align-items:center;justify-content:center;color:#fff;border-radius:999px;transition:transform .08s}
.pill span{font-size:calc(var(--u)*52);-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill;text-shadow:0 calc(var(--u)*4) 0 #8a3a05}
.pill.orange{background:linear-gradient(#ffa13a,#f26a1b);border:calc(var(--u)*6) solid #b5510f;box-shadow:0 calc(var(--u)*8) 0 #8a3a05,inset 0 calc(var(--u)*5) 0 #ffc27a}
.pill.cream{background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*6) solid #b5510f;box-shadow:0 calc(var(--u)*8) 0 #8a3a05;color:var(--ink)}
.pill.cream span{-webkit-text-stroke:0;text-shadow:none}
.pill.small span{font-size:calc(var(--u)*40)}
.pill:active,.tool:active,.chip:active,.hit:active{transform:translateY(calc(var(--u)*7)) scale(.97);box-shadow:0 calc(var(--u)*1) 0 #8a3a05}
.chips{display:flex;gap:calc(var(--u)*16);justify-content:center;align-items:center}
.chip{background:#fff6e2;border:calc(var(--u)*5) solid #b5510f;border-radius:999px;padding:0 calc(var(--u)*34);height:100%;font-size:calc(var(--u)*34);color:var(--ink);box-shadow:0 calc(var(--u)*5) 0 #b5510f}
.chip.on{background:linear-gradient(#ffa13a,#f26a1b);color:#fff}
.tool{width:calc(var(--u)*98);height:calc(var(--u)*98);border-radius:50%;background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*6) solid #b5510f;box-shadow:0 calc(var(--u)*7) 0 #8a3a05;display:flex;align-items:center;justify-content:center}
.tool svg{width:55%;height:55%;fill:#7a3a10}
.tool.on{background:linear-gradient(#ffa13a,#f26a1b)}
.tool.on svg{fill:#fff}
.tool:disabled{opacity:.45}
.paper{background:#fffdf4;border-radius:calc(var(--u)*20);overflow:hidden;background-image:radial-gradient(#e6dcc4 calc(var(--u)*1.4),transparent calc(var(--u)*1.6));background-size:calc(var(--u)*34) calc(var(--u)*34)}
canvas{width:100%;height:100%;display:block;touch-action:none}
.ring{border-radius:50%;background:#fff;border:1px solid #0003;display:flex;align-items:center;justify-content:center}
.ring svg{position:absolute;inset:3%;width:94%;height:94%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:9}
.ring .trk{stroke:#ffe3cc}
.ring .arc{stroke:var(--orange);stroke-linecap:round;stroke-dasharray:276.5;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear,stroke .3s}
.ring.warn .arc{stroke:#d92b2b}
.ring span{position:relative;font-size:calc(var(--u)*46);color:var(--orange)}
.ring.warn span{color:#d92b2b}
#d-line{background:#f58a1f;border-radius:99px;transform-origin:left;animation:ul .5s .15s both}
@keyframes ul{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.slice{background-image:url(img/bg_guess.webp);background-repeat:no-repeat}
#g-form{display:block}
#g-form input{position:absolute;inset:0 auto auto 0;width:100%;height:100%;border:0;border-radius:calc(var(--u)*30);background:#fffaf0;font:inherit;font-size:calc(var(--u)*42);padding:0 calc(var(--u)*30);color:var(--ink);outline:0;box-shadow:inset 0 0 0 calc(var(--u)*5) #d9a566;user-select:text;-webkit-user-select:text}
#g-ok{position:absolute}
.wood{inset:0;background:url(img/bg_result_wood.webp) center/cover}
.scroll{overflow-y:auto;overflow-x:hidden}
.scroll>.wood{position:fixed;inset:0}
#result.on{display:block}
#r-col{position:relative;margin:0 auto;width:calc(var(--u)*800);padding-bottom:calc(var(--u)*80)}
#r-head{position:relative;width:100%;height:calc(var(--u)*470)}
#r-head img{width:100%;display:block}
#r-title{position:absolute;left:calc(var(--u)*130);top:calc(var(--u)*300);width:calc(var(--u)*540);height:calc(var(--u)*100)}
#r-vs{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*14);color:#fff;text-shadow:0 2px 0 #7a2a08;font-size:calc(var(--u)*40);text-align:center;min-height:calc(var(--u)*120);flex-wrap:wrap;padding:0 calc(var(--u)*20);-webkit-text-stroke:calc(var(--u)*4) #7a2a08;paint-order:stroke fill}
.row-card{position:relative;display:flex;align-items:center;gap:calc(var(--u)*20);height:calc(var(--u)*170);margin:calc(var(--u)*12) 0;padding:0 calc(var(--u)*60) 0 calc(var(--u)*50);background:url(img/rs_card_b.webp) center/100% 100% no-repeat}
.row-card canvas{width:calc(var(--u)*130);height:calc(var(--u)*130);flex:none;background:#fffdf4;border-radius:calc(var(--u)*16);border:calc(var(--u)*3) solid #d9a566}
.row-card .lbl{flex:1;font-size:calc(var(--u)*38);line-height:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.row-card .lbl small{display:block;font-weight:600;color:#7a5a40;font-size:calc(var(--u)*28)}
.row-card img{width:calc(var(--u)*64);height:calc(var(--u)*64)}
.who{color:#fff;font-size:calc(var(--u)*44);margin:calc(var(--u)*20) 0 calc(var(--u)*4);text-align:center;-webkit-text-stroke:calc(var(--u)*5) #7a2a08;paint-order:stroke fill}
#again{position:relative;display:flex;width:calc(var(--u)*591);height:calc(var(--u)*134);margin:calc(var(--u)*40) auto 0}
#dialog{position:absolute;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:9}
#dialog.hidden{display:none}
.box{width:calc(var(--u)*640);background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*8) solid #b5510f;border-radius:calc(var(--u)*40);padding:calc(var(--u)*50) calc(var(--u)*40);text-align:center;font-size:calc(var(--u)*44)}
.box .row{display:flex;gap:calc(var(--u)*24);margin-top:calc(var(--u)*40)}
.box .pill{flex:1;height:calc(var(--u)*110);position:relative}

.txt.cap{color:var(--ink);font-size:calc(var(--u)*30);font-weight:600;line-height:1.1;padding:0 calc(var(--u)*30)}
#search .txt.cap{background:linear-gradient(#fff8e8,#fce9c8);border:calc(var(--u)*3) solid #e9a23b;border-radius:99px}
#s-paper{background:linear-gradient(#fffcf2,#f7ecd4);border:1.5px solid #e2c89c;border-radius:6px;transform:rotate(-3deg);box-shadow:0 calc(var(--u)*10) calc(var(--u)*20) #0006}
#s-paper svg{width:100%;height:100%}
@keyframes dd{0%{stroke-dashoffset:100;opacity:1}65%{stroke-dashoffset:0;opacity:1}90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
#r-back{position:absolute;left:calc(var(--u)*20);top:calc(var(--u)*20);width:calc(var(--u)*150);height:calc(var(--u)*150)}

.txt.lt{color:#fff;-webkit-text-stroke:calc(var(--u)*6) #3a1e08;paint-order:stroke fill;text-shadow:0 calc(var(--u)*3) 0 #3a1e08;font-size:calc(var(--u)*31)}
.txt.left{justify-content:flex-start;gap:calc(var(--u)*14);align-items:baseline;white-space:nowrap}
.txt.right{justify-content:flex-end;font-size:calc(var(--u)*29);font-weight:600;color:#7a5a40}
#h-name{font-size:calc(var(--u)*36)}
#h-name small{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}
#h-rank{justify-content:flex-start}
#h-rank span{background:linear-gradient(90deg,#8a62f0,#5b3fc4);color:#fff;border-radius:99px;padding:calc(var(--u)*4) calc(var(--u)*22);font-size:calc(var(--u)*31);white-space:nowrap}
#h-avatar{position:absolute}
#h-avatar img{position:absolute;display:block}
#h-bar{border-radius:99px;background:#3a2a22;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 2px 0 #0006}
#h-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#ffd25a,#f2a100);border-radius:99px;transition:width .8s}
#h-barlabel{position:relative;color:#fff;font-size:calc(var(--u)*26);-webkit-text-stroke:calc(var(--u)*4) #3a1e08;paint-order:stroke fill}
.tile{border-radius:calc(var(--u)*30);transition:background .1s,transform .1s}
.tile:active{background:#0003;transform:scale(.97)}
.veil{background:#eadbc470;border-radius:calc(var(--u)*30)}
.txt.cap2{color:#3a2a22;font-size:calc(var(--u)*21);font-weight:600;background:#fff6e2e0;border-radius:99px;padding:0 calc(var(--u)*10)}
#dlg-extra{margin-top:calc(var(--u)*26);display:flex;gap:calc(var(--u)*16);justify-content:center}
#dlg-extra .chip{height:calc(var(--u)*80)}
#h-ttl-gold,#h-ttl-daily,#h-ttl-chest{font-size:calc(var(--u)*30);line-height:1}

.txt.sign2{color:#fff;font-size:calc(var(--u)*78);-webkit-text-stroke:calc(var(--u)*10) #4e2406;paint-order:stroke fill;text-shadow:0 calc(var(--u)*4) 0 #4e2406}
#st-back{padding:0}#st-back img{width:100%;height:100%;display:block}
#st-gold{display:flex;align-items:center;gap:calc(var(--u)*22);background:#2b1708;border-radius:99px;padding:0 calc(var(--u)*34) 0 calc(var(--u)*14);color:#fff;font-size:calc(var(--u)*44);font-weight:800;justify-content:center;box-sizing:border-box}
#st-gold img{height:calc(var(--u)*72);width:auto}
#st-tabs{display:flex;gap:calc(var(--u)*19)}
.tab{flex:1;position:relative;color:#fff;font-size:calc(var(--u)*34);display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*8);background-size:100% 100%;background-repeat:no-repeat;-webkit-text-stroke:calc(var(--u)*5) #4e2406;paint-order:stroke fill}
.tab.on{background-image:url(img/st_tab_on.webp)}.tab.off{background-image:url(img/st_tab_off.webp);opacity:.9}
.tab img{height:calc(var(--u)*54)}
#st-shelf{overflow-y:auto;overflow-x:hidden;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u)*20);align-content:start;padding:calc(var(--u)*16) 0 calc(var(--u)*60);-webkit-mask-image:linear-gradient(transparent,#000 calc(var(--u)*20))}
#st-shelf::-webkit-scrollbar{display:none}
.pcard{position:relative;aspect-ratio:860/540;background-size:100% 100%;color:#3a2a22}
.pcard .nm{position:absolute;left:42%;top:49%;width:48%;height:19%;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;font-size:calc(var(--u)*30);line-height:1.1}
.pcard .nm small{font-size:calc(var(--u)*20);font-weight:600;opacity:.7}
.pcard .btn{position:absolute;left:45%;top:66.5%;width:46%;height:23.5%;background:url(img/st_pill_orange.webp) 0 0/100% 100%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:calc(var(--u)*30);gap:calc(var(--u)*6);-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill}
.pcard .btn.green{background-image:url(img/st_pill_green.webp)}
.pcard .btn.dis{filter:grayscale(.7) brightness(.85)}
.pcard .btn:active{transform:translateY(calc(var(--u)*5))}
.pcard .btn img{height:calc(var(--u)*34)}
.fcard{position:relative;aspect-ratio:764/552;background:url(img/st_card_frame.webp) 0 0/100% 100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*4);color:#3a2a22;padding:8% 6% 6%}
.fcard .frm{position:relative;width:46%;aspect-ratio:1;background:none;border:0;border-radius:0}
.fcard .frm img{position:absolute}
.fcard .nm{font-size:calc(var(--u)*26);line-height:1;text-align:center}
.fcard .btn{width:80%;height:calc(var(--u)*62);background:url(img/st_pill_orange.webp) 0 0/100% 100%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:calc(var(--u)*28);gap:calc(var(--u)*6);-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill}
.fcard .btn.green{background-image:url(img/st_pill_green.webp)}.fcard .btn.dis{filter:grayscale(.7) brightness(.85)}
.fcard .btn img{height:calc(var(--u)*30)}
#st-toast{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--u)*140);background:#3a1e08;color:#fff;padding:calc(var(--u)*16) calc(var(--u)*36);border-radius:99px;font-size:calc(var(--u)*30);z-index:5}
#st-toast.err{background:#a82020}

.txt.sign3{color:#fff;font-size:calc(var(--u)*36);-webkit-text-stroke:calc(var(--u)*6) #4e2406;paint-order:stroke fill;justify-content:flex-start}
.se-row{display:flex;align-items:center;justify-content:space-between;padding:0 calc(var(--u)*30) 0 calc(var(--u)*127);font-size:calc(var(--u)*31);color:var(--ink);cursor:pointer}
.sw{width:calc(var(--u)*106);height:calc(var(--u)*58);border-radius:99px;background:linear-gradient(#cfc6b8,#b4aa9b);position:relative;transition:background .18s;box-shadow:inset 0 2px 3px #0004}
.sw::after{content:"";position:absolute;top:calc(var(--u)*5);left:calc(var(--u)*5);width:calc(var(--u)*48);height:calc(var(--u)*48);border-radius:50%;background:#fff;transition:transform .18s;box-shadow:0 2px 3px #0005}
.sw.on{background:linear-gradient(#ff9a3c,#f26a1b)}.sw.on::after{transform:translateX(calc(var(--u)*48))}
#se-code{border:calc(var(--u)*4) solid #d9a566;border-radius:calc(var(--u)*30);background:#fffaf0;font:inherit;font-size:calc(var(--u)*34);padding:0 calc(var(--u)*20);color:var(--ink);outline:0;text-transform:uppercase;user-select:text;-webkit-user-select:text}
.txt.cap3{color:#5a3a20;font-size:calc(var(--u)*26);font-weight:600;line-height:1.15;justify-content:flex-start;text-align:left;align-items:flex-start}
.se-link{color:#8a4e12;text-decoration:underline;font-size:calc(var(--u)*26);font-weight:600;text-align:left}
.se-nav{display:flex;align-items:center;justify-content:space-between;padding:0 calc(var(--u)*70) 0 calc(var(--u)*126);font-size:calc(var(--u)*31);color:var(--ink);border-radius:calc(var(--u)*40);text-align:left}
.se-nav:active{background:#0002;transform:scale(.98)}
.se-priv{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--u)*10);padding:0 calc(var(--u)*24);background:linear-gradient(#fff3d6,#ffd98a);border:calc(var(--u)*3) solid #e08a1b;border-radius:99px;color:var(--ink);text-decoration:none;font-size:calc(var(--u)*25)}
.se-priv small{font-size:calc(var(--u)*18);font-weight:600;opacity:.75}
#se-use span{font-size:calc(var(--u)*32)}

#ac-list{overflow-y:auto;overflow-x:hidden;padding:calc(var(--u)*14) 0 calc(var(--u)*70);-webkit-mask-image:linear-gradient(transparent,#000 calc(var(--u)*40))}
#ac-list::-webkit-scrollbar{display:none}
#ac-back{padding:0}#ac-back img{width:100%;height:100%}
#ac-sign{display:block}
.ac-head{background:url(img/ach_panel.webp) 0 0/100% 100%;padding:calc(var(--u)*46) calc(var(--u)*60) calc(var(--u)*40);display:grid;grid-template-columns:auto 1fr auto;gap:calc(var(--u)*6) calc(var(--u)*22);align-items:center;margin-bottom:calc(var(--u)*16);color:#3b2314}
.ac-trophy{width:calc(var(--u)*88);height:calc(var(--u)*88);border-radius:50%;background:#ffe9b0;border:calc(var(--u)*4) solid #e0a030;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*44)}
.ac-ht b{font-size:calc(var(--u)*50);display:block;line-height:1}.ac-ht small{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}
.ac-pct{background:linear-gradient(#ffa64d,#f26a1b);color:#fff;border:calc(var(--u)*3) solid #b04a0e;border-radius:99px;padding:calc(var(--u)*6) calc(var(--u)*24);font-size:calc(var(--u)*32)}
.ac-bar{grid-column:1/4;height:calc(var(--u)*24);background:#e2cdaa;border-radius:99px;overflow:hidden}
.ac-bar i{display:block;height:100%;background:linear-gradient(#ffd04d,#f5a300);border-radius:99px}
.ac-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u)*14)}
.ac-card{position:relative;height:calc(var(--u)*262);background-size:100% 100%;background-repeat:no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;padding:calc(var(--u)*24) calc(var(--u)*22) calc(var(--u)*26);color:#3b2314;text-align:center;transition:transform .1s}
.ac-card:active{transform:scale(.95)}
.ac-card .em{font-size:calc(var(--u)*52)}.ac-card.lock .em{opacity:.6}.ac-card.lock{filter:saturate(.55)}
.ac-card b{font-size:calc(var(--u)*25);line-height:1.05;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ac-card small{font-size:calc(var(--u)*22);font-weight:600;color:#7a5a40}.ac-card .cl{color:#b8740a;font-weight:800}.ac-card .gr{color:#14602a;font-weight:800}
.ac-card .rw{font-style:normal;background:linear-gradient(#4cb3ff,#1b7fe0);border:calc(var(--u)*2.5) solid #0e4fa0;color:#fff;border-radius:99px;height:calc(var(--u)*41);display:flex;align-items:center;padding:0 calc(var(--u)*16);font-weight:800;font-size:calc(var(--u)*23);-webkit-text-stroke:calc(var(--u)*4) #0e4fa0;paint-order:stroke fill;box-sizing:border-box}.ac-card .rw.g{background:linear-gradient(#ffa64d,#f97316);border-color:#b04a0e;-webkit-text-stroke-color:#b04a0e}
.ac-card.got{filter:url(#ach-green)}
.ac-card .ck{position:absolute;right:calc(var(--u)*10);top:calc(var(--u)*10);width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:50%;background:linear-gradient(#5fd068,#2ea043);border:calc(var(--u)*3) solid #fff;color:#fff;font-style:normal;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*26)}
.ac-card.pulse{animation:acp .65s ease-in-out infinite alternate}
@keyframes acp{to{transform:scale(1.04);filter:brightness(1.15)}}
#ac-dlg{background:#000a;display:flex;align-items:center;justify-content:center;z-index:9}
#ac-dlg.hidden{display:none}
.acd{position:relative;background:url(img/ach_dialog.webp) 0 0/100% 100%}
.acd>div{position:absolute}
.acd-em{display:flex;align-items:center;justify-content:center}
.acd-t{display:flex;align-items:center;justify-content:center;color:#fff;-webkit-text-stroke:calc(var(--u)*7) #8a2a10;paint-order:stroke fill;text-align:center;line-height:1}
.acd-b{display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;color:#3b2314}
.acd-b .tag{background:#efe3cf;color:#7a5a40;border-radius:99px;padding:.2em .9em}.acd-b .tag.ok{background:#dff3d9;color:#14602a}
.acd-b .pr{color:#7a5a40;font-size:1.1em}
.acd-b .ds{background:#fff6;border:2px solid #c9854355;border-radius:18px;padding:.5em .8em;text-align:center;font-weight:600;width:100%}.acd-b .ds small{display:block;color:#7a5a40;font-size:.7em}
.acd-b .rwp{background:#f2a10038;border-radius:99px;padding:.15em .9em}
.acd-b .pill{position:relative}

#lg-back,#lg-refresh{padding:0;position:absolute}#lg-back img{width:100%;height:100%}
#lg-refresh img{width:100%;height:100%}#lg-refresh span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:calc(var(--u)*60)}
#lg-sign{display:block}
#lg-tabs{display:flex;gap:calc(var(--u)*20)}
.lg-pill{flex:1;background-size:100% 100%;background-repeat:no-repeat;font-size:calc(var(--u)*36);color:#3b2314}
.lg-pill.on{background-image:url(img/league_pill_on.webp);color:#fff;-webkit-text-stroke:calc(var(--u)*6) #8a3a05;paint-order:stroke fill}.lg-pill.off{background-image:url(img/league_pill_off.webp)}
.lg-timer{background:none;justify-content:center}
.lg-timer .chip{box-sizing:border-box;height:100%;min-width:calc(var(--u)*390);display:flex;align-items:center;justify-content:center;white-space:nowrap;color:#3b2314;font-size:calc(var(--u)*30);font-weight:800;padding:0 calc(var(--u)*0) 0 calc(var(--u)*0);border-style:solid;border-width:calc(var(--u)*18.5) calc(var(--u)*80.6) calc(var(--u)*18.5) calc(var(--u)*80.6);border-image:url(img/league_timer.webp) 40 170 40 170 fill/calc(var(--u)*18.5) calc(var(--u)*80.6) stretch;margin-left:0}
.lg-timer.star .chip{border-image-source:url(img/league_timer_star.webp)}
#lg-list{overflow-y:auto;overflow-x:hidden;padding:calc(var(--u)*34) 0 calc(var(--u)*70);display:flex;flex-direction:column;gap:calc(var(--u)*14);-webkit-mask-image:linear-gradient(transparent,#000 calc(var(--u)*30))}
#lg-list::-webkit-scrollbar{display:none}
.lg-note{color:#fff;text-align:center;font-size:calc(var(--u)*28);font-weight:600;text-shadow:0 2px 4px #000a;padding:calc(var(--u)*20)}
.lg-card{background:url(img/league_card.webp) 0 0/100% 100%;padding:calc(var(--u)*44) calc(var(--u)*60);color:#3b2314;display:flex;flex-direction:column;gap:calc(var(--u)*6)}
.lc-h{display:flex;justify-content:space-between;font-size:calc(var(--u)*36)}.lc-h span{color:#f26a1b}
.lg-hint{align-items:center;text-align:center;cursor:pointer;font-size:calc(var(--u)*28);gap:calc(var(--u)*10)}.lg-hint b{color:#f26a1b;font-size:calc(var(--u)*32)}
.lc-r{font-size:calc(var(--u)*44)}.lc-s{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}
.lg-row{position:relative;display:flex;align-items:center;height:calc(var(--u)*100);background:url(img/league_row.webp) 0 0/100% 100%;padding:0 calc(var(--u)*34) 0 calc(var(--u)*220);color:#3b2314;gap:calc(var(--u)*16)}
.lg-row.s1{background-image:url(img/league_row1.webp);height:calc(var(--u)*112)}.lg-row.s2{background-image:url(img/league_row2.webp);height:calc(var(--u)*112)}.lg-row.s3{background-image:url(img/league_row3.webp);height:calc(var(--u)*112)}
.lg-row.me{box-shadow:0 0 0 calc(var(--u)*5) #ffd84d,0 0 calc(var(--u)*24) #ffd84d}
.lg-rk{position:absolute;left:0;top:0;bottom:0;width:calc(var(--u)*100);display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*34);color:#7a5a40}
.lg-av{left:calc(var(--u)*104);top:50%;width:calc(var(--u)*88);height:calc(var(--u)*88);transform:translateY(-50%)}
.lg-nm{flex:1;min-width:0;font-size:calc(var(--u)*34);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lg-nm small{font-size:calc(var(--u)*22);color:#7a5a40;margin-left:calc(var(--u)*10);font-weight:600}
.lg-xp{color:#f26a1b;font-size:calc(var(--u)*34);white-space:nowrap}

#ak-back{padding:0;position:absolute}#ak-back img{width:100%;height:100%}
#ak-sign{display:block}
.txt.sm{font-size:calc(var(--u)*27);font-weight:600;color:#7a5a40}.txt.sm2{font-size:calc(var(--u)*27);font-weight:600;color:#3b5a2a;line-height:1.1}
#ak-name{font-size:calc(var(--u)*48)}
.txt.badge{color:#fff;font-size:calc(var(--u)*26)}.txt.badge span{background:linear-gradient(90deg,#5b9bf0,#3a6fd8);border-radius:99px;padding:calc(var(--u)*4) calc(var(--u)*20);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.txt.badge.guest span{background:linear-gradient(90deg,#c8a878,#a88850)}
#ak-bar{border-radius:99px;background:#3a2a22;overflow:hidden;display:flex;align-items:center;justify-content:center}
#ak-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#ffd25a,#f2a100);border-radius:99px}
#ak-barl{position:relative;color:#fff;font-size:calc(var(--u)*24);-webkit-text-stroke:calc(var(--u)*4) #3a1e08;paint-order:stroke fill}
.ak-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#3b2314}
.ak-stat b{font-size:calc(var(--u)*46);line-height:1}.ak-stat small{font-size:calc(var(--u)*25);font-weight:700;margin-top:calc(var(--u)*6)}
#ak-sec{font-size:calc(var(--u)*44)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*18);background:#fff;border:calc(var(--u)*4) solid #d9a566;border-radius:99px;font-size:calc(var(--u)*40);color:#3c4043;box-shadow:0 calc(var(--u)*8) 0 #b5510f}
.gbtn:active{transform:translateY(calc(var(--u)*6));box-shadow:0 calc(var(--u)*2) 0 #b5510f}
.gbtn svg{width:calc(var(--u)*56);height:calc(var(--u)*56)}
#ak-out{background:url(img/account_btn.webp) 0 0/100% 100%;border:0;box-shadow:none}
#ak-out span{font-size:calc(var(--u)*56)}
.delbtn{background:#fff6ee;border:calc(var(--u)*4) solid #d63a2e;border-radius:99px;color:#d63a2e;font-size:calc(var(--u)*31)}
.txt.capmsg{background:#fff6e4f2;border-radius:20px;font-size:calc(var(--u)*30);color:#14602a;padding:0 calc(var(--u)*14)}
.txt.sm2{white-space:normal;font-size:calc(var(--u)*23)}
.ak-stat small{font-size:calc(var(--u)*21)}

#wl-back,#lm-back{padding:0;position:absolute}#wl-back img,#lm-back img{width:100%;height:100%}
#wl-list{overflow-y:auto;overflow-x:hidden;padding:calc(var(--u)*40) calc(var(--u)*28) calc(var(--u)*70);display:flex;flex-direction:column;gap:calc(var(--u)*16);-webkit-mask-image:linear-gradient(transparent,#000 calc(var(--u)*100))}
#wl-list::-webkit-scrollbar{display:none}
.wl-banner{position:relative;display:block;width:100%;flex:none}.wl-banner img{width:100%;display:block}.wl-banner.lock img{filter:saturate(.2) brightness(.55)}
.wl-tag{position:absolute;right:calc(var(--u)*44);bottom:calc(var(--u)*22);background:#0007;color:#fff;border-radius:calc(var(--u)*20);padding:calc(var(--u)*4) calc(var(--u)*18);font-size:calc(var(--u)*26)}
@keyframes nx{to{transform:scale(1.1)}}

#fr-back,#fr-duel{padding:0;position:absolute}#fr-back img,#fr-duel img{width:100%;height:100%}.hidden-x{display:none}
#fr-sign,#fr-panel,#fr-frame,#fr-ribbon1,#fr-ribbon2,#fr-bigpanel{display:block}
.txt.cap4{color:#6b5a48;font-size:calc(var(--u)*29);font-weight:600;line-height:1.1}
#fr-codel{font-size:calc(var(--u)*46)}.txt.dg{font-size:calc(var(--u)*50)}
.txt.sign4{color:#fff;font-size:calc(var(--u)*30);-webkit-text-stroke:calc(var(--u)*6) #5a2815;paint-order:stroke fill}.txt.sign4.m{font-size:calc(var(--u)*26)}
.frbtn{background-size:100% 100%;background-repeat:no-repeat;color:#fff;display:flex;align-items:center;justify-content:center;-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill;transition:transform .08s}
.frbtn.w{background-image:url(img/fr_orange_w.webp);font-size:calc(var(--u)*28)}.frbtn.s{background-image:url(img/fr_orange_s.webp);font-size:calc(var(--u)*30)}
.frbtn:active{transform:scale(.94)}
#fr-input{background:url(img/fr_cream_b.webp) 0 0/100% 100%;border:0;font:inherit;font-size:calc(var(--u)*36);letter-spacing:calc(var(--u)*6);padding:0 calc(var(--u)*50);color:var(--ink);outline:0;user-select:text;-webkit-user-select:text}
#fr-list{overflow-y:auto;display:flex;flex-direction:column;gap:calc(var(--u)*10)}#fr-list::-webkit-scrollbar{display:none}
.fr-sec{color:#7a5a40;font-size:calc(var(--u)*24);margin-top:calc(var(--u)*8)}
.fr-row{display:flex;align-items:center;gap:calc(var(--u)*10);background:#fff6e2;border:calc(var(--u)*3) solid #e0b878;border-radius:calc(var(--u)*30);padding:calc(var(--u)*10) calc(var(--u)*20);min-height:calc(var(--u)*80);flex:none}
.fr-row .nm{flex:1;min-width:0;font-size:calc(var(--u)*32);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#3b2314}
.fr-pill{background:linear-gradient(#ff9a3c,#f26a1b);border:calc(var(--u)*3) solid #b04a0e;border-radius:99px;color:#fff;font-size:calc(var(--u)*24);padding:calc(var(--u)*6) calc(var(--u)*22);-webkit-text-stroke:calc(var(--u)*3) #8a3a05;paint-order:stroke fill}
.fr-q{color:#7a5a40;font-size:calc(var(--u)*24);padding:calc(var(--u)*6) calc(var(--u)*10)}.fr-more{font-size:calc(var(--u)*44);color:#3b2314;padding:0 calc(var(--u)*10)}
.fr-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*10);text-align:center;color:#5a3a20;font-size:calc(var(--u)*28);font-weight:600;height:100%}.fr-empty img{width:calc(var(--u)*150)}
#fr-menu{position:absolute;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:9}#fr-menu.hidden{display:none}
.fr-mbox{width:calc(var(--u)*560);background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*8) solid #b5510f;border-radius:calc(var(--u)*40);padding:calc(var(--u)*40);display:flex;flex-direction:column;gap:calc(var(--u)*20);font-size:calc(var(--u)*40);text-align:center}
.fr-mbox .pill{height:calc(var(--u)*90);position:relative}

#on-back,#oj-back,#oc-back,#ow-back,#os-back{padding:0;position:absolute}#on-back img,#oj-back img,#oc-back img,#ow-back img,#os-back img{width:100%;height:100%}
#os-paper{display:block}#os-title,#oc-title{font-size:calc(var(--u)*46)}
/* Play Offline setup: centred captions over equal-width pill grids, a short last row centred (WordCountScreen / ChoiceGrid). */
#os-body{overflow-y:auto;display:flex;flex-direction:column;gap:calc(var(--u)*28)}.os-g{display:flex;flex-direction:column;gap:calc(var(--u)*8)}#os-body::-webkit-scrollbar{display:none}
.os-l{text-align:center;color:#3b2314;font-weight:700;font-size:calc(var(--u)*28);line-height:1.5;white-space:nowrap}
.os-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--u)*10)}
.os-pill{width:calc((100% - (var(--cols) - 1)*var(--u)*10)/var(--cols));height:var(--ph);position:relative;isolation:isolate;padding:0 calc(var(--u)*8);background:none;color:#3b2314;font-weight:800;white-space:nowrap;overflow:hidden;transition:transform .12s}
.os-pill::before{content:"";position:absolute;inset:0;z-index:-1;background:url(img/offline_pill_off.webp) 0 0/100% 100%;filter:sepia(.75) saturate(.9) brightness(.9)}
.os-pill.on::before{background-image:url(img/offline_pill_on.webp);filter:none}.os-pill.on{color:#fff;transform:scale(1.04);text-shadow:0 calc(var(--u)*2) calc(var(--u)*3) #8a3a05}
.os-pill:active{transform:scale(.92)}.os-pill.dis{pointer-events:none;opacity:.75;color:#6b5a4a}
#on-sign,#on-paper,#oj-panel,#oc-paper,#ow-codep{display:block}
.txt.col{flex-direction:column;gap:calc(var(--u)*4);font-size:calc(var(--u)*32);font-weight:600}.txt.col b{font-weight:800;margin-top:calc(var(--u)*10)}
.txt.capw{color:#fff;font-size:calc(var(--u)*28);font-weight:600;text-shadow:0 2px 4px #000a}
.txt.codebig{font-size:calc(var(--u)*92);letter-spacing:calc(var(--u)*8)}
.imgbtn{background-size:100% 100%;background-repeat:no-repeat;color:#fff;font-size:calc(var(--u)*56);display:flex;align-items:center;justify-content:center;-webkit-text-stroke:calc(var(--u)*7) #8a3a05;paint-order:stroke fill;transition:transform .08s}
.imgbtn:active{transform:scale(.96) translateY(calc(var(--u)*5))}.imgbtn.dis{filter:grayscale(.8) brightness(.9)}
.imgbtn.o{background-image:url(img/race2_btn_orange.webp)}.imgbtn.b{background-image:url(img/race2_btn_blue.webp)}.imgbtn.j{background-image:url(img/join_btn.webp)}.imgbtn.s{background-image:url(img/offline_start.webp)}.imgbtn.g{background-image:url(img/lobby_btn_green.webp);-webkit-text-stroke-color:#14602a}
.inp{border:0;background:transparent;font:inherit;font-size:calc(var(--u)*40);color:var(--ink);padding:0 calc(var(--u)*30);outline:0;user-select:text;-webkit-user-select:text}
#oc-body{overflow-y:auto;display:flex;flex-direction:column;gap:calc(var(--u)*8)}#oc-body::-webkit-scrollbar{display:none}
.oc-l{color:#3b2314;font-size:calc(var(--u)*32);margin-top:calc(var(--u)*4)}.oc-row{display:flex;gap:calc(var(--u)*10);flex-wrap:wrap}
.oc-pill{min-width:calc(var(--u)*90);padding:calc(var(--u)*8) calc(var(--u)*20);background:url(img/offline_pill_off.webp) 0 0/100% 100%;color:#3b2314;font-size:calc(var(--u)*28)}.oc-pill.on{background-image:url(img/offline_pill_on.webp);color:#fff;-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill}
#ow-sheet{position:absolute;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:9}#ow-sheet.hidden{display:none}
.ow-sbox{width:calc(var(--u)*700);max-height:80%;overflow:auto;background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*8) solid #b5510f;border-radius:calc(var(--u)*40);padding:calc(var(--u)*36);display:flex;flex-direction:column;gap:calc(var(--u)*16);font-size:calc(var(--u)*38);text-align:center;color:#3b2314}
.ow-sbox p{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}.ow-sbox .pill{height:calc(var(--u)*86);position:relative;flex:none}
.row-card.ro{border:0;text-align:left;color:#3b2314;cursor:pointer}.ro-rk{font-size:calc(var(--u)*40);width:calc(var(--u)*56);flex:none}.ro-sc{font-size:calc(var(--u)*46);color:#f26a1b}

.mus{display:flex;align-items:center;justify-content:center}.mus svg{width:55%;height:55%;fill:#3a2a22}.mus.off svg{opacity:.45}
.jt{position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*2);color:#fff;font-size:calc(var(--u)*27);-webkit-text-stroke:calc(var(--u)*5) #4a1f8a;paint-order:stroke fill;transition:transform .08s}
.jt:active{transform:scale(.94)}.jt img{width:calc(var(--u)*92);height:calc(var(--u)*92);object-fit:contain}.jt svg{width:calc(var(--u)*80);height:calc(var(--u)*80);fill:#4a2a10}
.jt.dis{opacity:.45}.jt#jt-ad span,.jt#jt-skip span{color:#4a2a10;-webkit-text-stroke:0;font-weight:700}.jt#jt-count{-webkit-text-stroke-color:#0b4f8a}.jt#jt-first{-webkit-text-stroke-color:#4a1f8a}
.jt i{position:absolute;top:calc(var(--u)*6);right:calc(var(--u)*10);min-width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:99px;background:#6a2dbf;border:calc(var(--u)*3) solid #fff;color:#fff;font-style:normal;font-size:calc(var(--u)*26);display:flex;align-items:center;justify-content:center;-webkit-text-stroke:0;padding:0 calc(var(--u)*6)}
#jt-count i{background:#1b7fe0}
.timej{position:absolute;right:calc(var(--u)*14);top:calc(var(--u)*14);height:calc(var(--u)*80);padding:0 calc(var(--u)*30) 0 calc(var(--u)*12);background:url(img/st_pill_orange.webp) 0 0/100% 100%;display:flex;align-items:center;gap:calc(var(--u)*8);color:#fff;font-size:calc(var(--u)*30);-webkit-text-stroke:calc(var(--u)*4) #8a3a00;paint-order:stroke fill;z-index:2}
.timej img{height:calc(var(--u)*56)}.timej i{position:absolute;top:calc(var(--u)*-10);right:calc(var(--u)*-6);min-width:calc(var(--u)*40);height:calc(var(--u)*40);border-radius:50%;background:#3a2112;border:calc(var(--u)*3) solid #ffc94d;color:#fff;font-style:normal;font-size:calc(var(--u)*24);display:flex;align-items:center;justify-content:center;-webkit-text-stroke:0}
.timej.dis{opacity:.55}
#g-blanks{position:absolute;left:0;right:0;top:calc(var(--u)*14);display:flex;justify-content:center;gap:calc(var(--u)*30);flex-wrap:wrap;padding:0 calc(var(--u)*20);pointer-events:none}
#g-blanks .grp{display:flex;gap:calc(var(--u)*8)}#g-blanks .ch{width:calc(var(--u)*46);height:calc(var(--u)*62);border-bottom:calc(var(--u)*6) solid #3a2a22;color:#e8650f;font-size:calc(var(--u)*46);text-align:center;line-height:calc(var(--u)*56)}
#g-flash{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*150);pointer-events:none;opacity:0}
#g-flash.go{animation:fl .8s ease-out}@keyframes fl{0%{opacity:0;transform:scale(.5)}25%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1)}}

#pick{position:absolute;inset:0;background:#000a;display:flex;align-items:center;justify-content:center;z-index:10}#pick.hidden{display:none}
.pk-box{width:calc(var(--u)*760);max-height:86%;overflow:auto;background:linear-gradient(#fff6e2,#ffe3b0);border:calc(var(--u)*8) solid #b5510f;border-radius:calc(var(--u)*40);padding:calc(var(--u)*36);display:flex;flex-direction:column;gap:calc(var(--u)*18);color:#3b2314;text-align:center}
.pk-box>b{font-size:calc(var(--u)*44)}.pk-box .pill{height:calc(var(--u)*90);position:relative;flex:none}
.pk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u)*14)}
.pk-pen,.pk-fr{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*8);padding:calc(var(--u)*14);border-radius:calc(var(--u)*26);background:#fff;border:calc(var(--u)*4) solid #e0b878;font-size:calc(var(--u)*26)}
.pk-pen.on,.pk-fr.on{border-color:#f26a1b;background:#ffe9c9}.pk-pen.lock,.pk-fr.lock{opacity:.55}
.pk-pen i{display:block;width:100%;height:calc(var(--u)*30);border-radius:99px}.pk-pen small,.pk-fr small{font-size:calc(var(--u)*20);color:#7a5a40}
.pk-ring{width:calc(var(--u)*130);height:calc(var(--u)*130)}
.pk-in{height:calc(var(--u)*100);border:calc(var(--u)*4) solid #d9a566;border-radius:calc(var(--u)*30);background:#fffaf0;font:inherit;font-size:calc(var(--u)*42);text-align:center;color:#3b2314;outline:0;user-select:text;-webkit-user-select:text}
#h-avatar{padding:0}#h-pen,#h-name{cursor:pointer}

#h-dcard{filter:hue-rotate(135deg);display:block;border-radius:calc(var(--u)*30)}
.txt.dm{background:linear-gradient(#ffe9b0,#ffc04a);border:calc(var(--u)*4) solid #e08a1b;border-radius:99px;color:#8a3a00;font-size:calc(var(--u)*30)}
#h-dpips{display:flex;gap:calc(var(--u)*7);align-items:center;justify-content:center}
#h-dpips i{width:calc(var(--u)*33);height:calc(var(--u)*33);border-radius:50%;background:#fff6;border:calc(var(--u)*3) solid #fff;display:flex;align-items:center;justify-content:center;font-style:normal;color:#fff;font-size:calc(var(--u)*22)}
#h-dpips i.ok{background:#2ea043;border-color:#14602a}#h-dpips i.no{background:#d63a2e;border-color:#7a1a10}
.dplay{background:linear-gradient(#ffe27a,#ffb300);border:calc(var(--u)*4) solid #b36b00;border-radius:99px;color:#4a2600;font-size:calc(var(--u)*34);animation:br 1.1s ease-in-out infinite alternate}
@keyframes br{to{transform:scale(1.03)}}.dplay:active{transform:scale(.95)}

#found>img:not(.bg),.mcard>img,.tip>img,#f-plank>img{display:block}
.mcard{position:absolute;transition:transform .6s cubic-bezier(.2,1.3,.4,1),opacity .4s}.mcard>img{position:absolute;inset:0;width:100%;height:100%}
.mcard.in-l{transform:translateX(-120%);opacity:0}.mcard.in-r{transform:translateX(120%);opacity:0}
.mc-av{position:absolute}.mc-rb{position:absolute;display:flex;align-items:center;justify-content:center}.mc-rb img{position:absolute;inset:0;width:100%;height:100%}
.mc-rb span{position:relative;color:#fff;font-size:calc(var(--u)*30);text-shadow:0 2px 4px #0009;max-width:80%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-xp{position:absolute;display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*8);color:#3b2314;font-size:calc(var(--u)*30)}.mc-xp img{height:calc(var(--u)*40)}
#f-vs{transform:scale(0);transition:transform .5s cubic-bezier(.3,1.6,.5,1)}#f-vs.pop{transform:scale(1)}
#f-plank{position:absolute}#f-plank>img{position:absolute;inset:0;width:100%;height:100%}
#f-pt{font-size:calc(var(--u)*34);position:absolute;left:21%;top:23%;width:70%;height:27%}
#f-bar{position:absolute;left:25%;top:51%;width:73%;height:24%;border-radius:99px;background:linear-gradient(#3a1f0e,#5a3418);border:calc(var(--u)*3) solid #f2b33a;padding:calc(var(--u)*4)}
#f-fill{display:block;height:100%;width:3%;border-radius:99px;background:linear-gradient(#ffe867,#f7b500);transition:width 5s linear}
.tip{position:absolute}.tip>img{position:absolute;inset:0;width:100%;height:100%}.tip>span{position:absolute;left:13%;right:13%;top:50%;height:48%;display:flex;align-items:center;justify-content:center;text-align:center;color:#3b2314;font-size:calc(var(--u)*29);line-height:1.1}
.pk-note{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40;margin:0}

#ch-title{font-size:calc(var(--u)*42)}#ch-tag{font-size:calc(var(--u)*23);font-weight:600;color:#4a3426}
.ch-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*2);color:#3b2314;font-size:calc(var(--u)*25);text-align:center;transition:transform .1s}
.ch-slot:active{transform:scale(.95)}
.ch-slot .ch-e{color:#4a3426;font-weight:600}
.ch-big{width:calc(var(--u)*220);height:calc(var(--u)*220);object-fit:contain;margin:0 auto}.ch-big.pop{animation:pp .6s cubic-bezier(.3,1.6,.5,1)}@keyframes pp{from{transform:scale(0)}}
.pk-box p{margin:0;font-size:calc(var(--u)*28);font-weight:600;color:#5a3a20}.ch-loot{font-size:calc(var(--u)*24)!important}
.rwbox .rw-gold{font-size:calc(var(--u)*50);color:#e8a000}.rwbox .rw-j,.rwbox .rw-pen{font-size:calc(var(--u)*34)}.pill.dis{filter:grayscale(.7);opacity:.7}

#rp-back{padding:0;position:absolute}#rp-back img{width:100%;height:100%}#rp-sign{display:block}
#rp-body{overflow-y:auto;padding:0 0 calc(var(--u)*80);display:flex;flex-direction:column;gap:calc(var(--u)*16);-webkit-mask-image:linear-gradient(transparent,#000 calc(var(--u)*30))}#rp-body::-webkit-scrollbar{display:none}
.rp-card{background:url(img/rp_card_big.webp) 0 0/100% 100%;padding:calc(var(--u)*120) calc(var(--u)*100) calc(var(--u)*110);display:flex;flex-direction:column;gap:calc(var(--u)*12);color:#3b2314;flex:none}
.rp-card b{font-size:calc(var(--u)*40);margin-top:calc(var(--u)*14)}.rp-card p{margin:0;font-size:calc(var(--u)*27);font-weight:600;color:#6b4a30}.rp-l{font-size:calc(var(--u)*30);margin-top:calc(var(--u)*8)}
.rp-row{display:flex;gap:calc(var(--u)*14)}.rp-pill{flex:1;height:calc(var(--u)*86);background-size:100% 100%;background-repeat:no-repeat;color:#fff;font-size:calc(var(--u)*32);opacity:.6;-webkit-text-stroke:calc(var(--u)*5) #5a2a08;paint-order:stroke fill}.rp-pill.on{opacity:1}
.rp-ta{height:calc(var(--u)*300);border:calc(var(--u)*4) solid #d9a566;border-radius:calc(var(--u)*24);background:#fffaf0;font:inherit;font-weight:600;font-size:calc(var(--u)*30);padding:calc(var(--u)*18);color:#3b2314;resize:none;outline:0;user-select:text;-webkit-user-select:text}
.rp-cnt{text-align:right;font-size:calc(var(--u)*22);color:#7a5a40}.rp-note{font-size:calc(var(--u)*28);color:#14602a;min-height:calc(var(--u)*34)}
.rp-send{height:calc(var(--u)*100);border-radius:99px;background:linear-gradient(#ffa13a,#f26a1b);border:calc(var(--u)*5) solid #b5510f;box-shadow:0 calc(var(--u)*7) 0 #8a3a05;color:#fff;font-size:calc(var(--u)*42);-webkit-text-stroke:calc(var(--u)*5) #8a3a05;paint-order:stroke fill}.rp-send:active{transform:translateY(calc(var(--u)*6))}
.rp-h{color:#fff;font-size:calc(var(--u)*38);-webkit-text-stroke:calc(var(--u)*5) #5a2815;paint-order:stroke fill;margin-top:calc(var(--u)*10)}
.rp-item{background:#fff6e2;border:calc(var(--u)*3) solid #e0b878;border-radius:calc(var(--u)*30);padding:calc(var(--u)*24) calc(var(--u)*30);color:#3b2314;flex:none}
.rp-t{display:flex;justify-content:space-between;font-size:calc(var(--u)*28)}.rp-t em{font-style:normal;font-size:calc(var(--u)*24);color:#9a6a30}.rp-t em.ok{color:#14602a}.rp-item p{margin:calc(var(--u)*8) 0;font-size:calc(var(--u)*26);font-weight:600;white-space:pre-wrap;word-break:break-word}
.rp-del{color:#a82020;font-size:calc(var(--u)*24)}

/* Karalak Runes (RunesScreen.kt): the map, the info card and the status window. 1 dp of the app = 2.05 art units. */
#ru-back{padding:0;position:absolute}#ru-back img{width:100%;height:100%}
#ru-title{justify-content:flex-start;font-size:calc(var(--u)*53);white-space:nowrap}
#ru-gold{display:flex;align-items:center;gap:calc(var(--u)*10);background:#2b1a12cc;border-radius:99px;padding:0 calc(var(--u)*20) 0 calc(var(--u)*8);color:#fff;font-weight:800;font-size:calc(var(--u)*29);white-space:nowrap}#ru-gold img{height:calc(var(--u)*45);width:auto}
#ru-map{position:absolute;overflow:hidden;border-radius:calc(var(--u)*53);background:#e9d3a6 url(img/rune_map_bg.webp) center/cover;touch-action:none;cursor:grab}
.ru-layer{position:absolute;left:0;top:0;transform-origin:50% 50%;will-change:transform}
.ru-rope{position:absolute;transform-origin:0 50%;background-repeat:repeat-x;background-size:auto 100%;pointer-events:none}
.ru-rope.lock{background-image:url(img/rune_path_locked.webp)}.ru-rope.open{background-image:url(img/rune_path_open.webp)}.ru-rope.own{background-image:url(img/rune_path_owned.webp)}
.ru-n{position:absolute;padding:0;transition:transform .1s;touch-action:none}.ru-n:active{transform:scale(.92)}
.ru-n .pl,.ru-n .halo,.ru-n .bdg{position:absolute;display:block;pointer-events:none}.ru-n .ic{position:absolute;display:flex;align-items:center;justify-content:center;pointer-events:none}
.ru-n .halo{opacity:.35;animation:rhalo .9s ease-in-out infinite alternate}@keyframes rhalo{to{opacity:1}}
.ru-n .pips{position:absolute;left:50%;transform:translateX(-50%);display:flex;pointer-events:none}
.ru-n .lvl{position:absolute;left:50%;bottom:calc(var(--u)*-18);transform:translateX(-50%);background:#3a2416cc;color:#fff;border-radius:99px;padding:0 calc(var(--u)*12);font-style:normal;font-weight:800;font-size:calc(var(--u)*22)}
#ru-detail{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:calc(var(--u)*10);padding:calc(var(--u)*41) calc(var(--u)*49);color:#3a2416;box-sizing:border-box;isolation:isolate}
#ru-detail::before{content:"";position:absolute;inset:0;z-index:-1;border:calc(var(--u)*53) solid transparent;border-image:url(img/rune_ui_card.webp) 58 fill/calc(var(--u)*53) stretch}
.ru-hint{font-weight:700;font-size:calc(var(--u)*37);text-align:center;line-height:1.15}.ru-hint2{font-style:italic;font-size:calc(var(--u)*26);color:#8a5a2b;text-align:center;margin-top:calc(var(--u)*6)}
.ru-row{display:flex;align-items:center;gap:calc(var(--u)*25)}.ru-ico{flex:none;width:calc(var(--u)*135);height:calc(var(--u)*135);display:block;position:relative}.ru-ico.plate{overflow:visible}
.ru-col{flex:1;min-width:0;display:flex;flex-direction:column}.ru-namerow{display:flex;align-items:center;gap:calc(var(--u)*16)}
.ru-t{font-weight:800;font-size:calc(var(--u)*43);line-height:1.4;flex:1}.ru-b{font-size:calc(var(--u)*29);line-height:1.42;color:#3a2416d9;font-weight:600}.ru-n2{font-style:italic;font-size:calc(var(--u)*25);color:#8a5a2b;margin-top:calc(var(--u)*4)}
.ru-fl{font-style:italic;font-size:calc(var(--u)*25);color:#8a5a2b;line-height:1.35}
.ru-lvpill{flex:none;background:#7a4a22;color:#fff;border-radius:99px;padding:calc(var(--u)*6) calc(var(--u)*21);font-weight:800;font-size:calc(var(--u)*25);white-space:nowrap}
.ru-boxes{display:flex;gap:calc(var(--u)*16);margin-top:calc(var(--u)*6)}
.ru-box{flex:1;position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;padding:calc(var(--u)*16) calc(var(--u)*8);min-width:0}.ru-box .n{line-height:1.5}
.ru-box::before{content:"";position:absolute;inset:0;z-index:-1;border:calc(var(--u)*29) solid transparent;border-image:url(img/rune_ui_box_gold.webp) 40 fill/calc(var(--u)*29) stretch}
.ru-box.empty::before{border-image-source:url(img/rune_ui_box_empty.webp)}.ru-box.gray::before{border-image-source:url(img/rune_ui_box_gray.webp)}
.ru-box img{width:calc(var(--u)*29);height:calc(var(--u)*29)}.ru-box .n{font-size:calc(var(--u)*22);color:#3a2416cc;white-space:nowrap;line-height:1.1}
.ru-box b{font-weight:800;font-size:calc(var(--u)*37);white-space:nowrap;line-height:1.55}.ru-box.many b{font-size:calc(var(--u)*31)}
.ru-box b.r{color:#3a2416}.ru-box b.x{color:#3a2416d9}.ru-box b.g{color:#fff}
.ru-state{text-align:center;font-weight:800;font-size:calc(var(--u)*29);margin-top:calc(var(--u)*6)}.ru-state.ok{color:#1e7a45}.ru-state.bad{color:#b3401a;font-weight:600}
.ru-buy{position:relative;isolation:isolate;height:calc(var(--u)*111);margin-top:calc(var(--u)*8);display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*12);padding:0;transition:transform .08s}
.ru-buy::before{content:"";position:absolute;inset:0;z-index:-1;border:calc(var(--u)*55) solid transparent;border-image:url(img/rune_ui_btn_green.webp) 73 fill/calc(var(--u)*55) stretch}
.ru-buy.off::before{border-image-source:url(img/rune_ui_btn_gray.webp)}.ru-buy:active{transform:scale(.96)}
.ru-buy img{width:calc(var(--u)*53);height:calc(var(--u)*53)}.ru-buy span{color:#fff;font-weight:800;font-size:calc(var(--u)*41);text-shadow:0 calc(var(--u)*2) calc(var(--u)*3) #0006}
/* the status window */
#ru-status{position:absolute;inset:0;z-index:30;background:#0007;display:flex;align-items:center;justify-content:center}#ru-status.hidden{display:none}
.st-card{position:relative;isolation:isolate;width:calc(var(--u)*648);max-width:92%;padding:calc(var(--u)*41) calc(var(--u)*45);box-sizing:border-box;display:flex;flex-direction:column;align-items:center}
.st-card::before{content:"";position:absolute;inset:0;z-index:-1;border:calc(var(--u)*53) solid transparent;border-image:url(img/rune_ui_card.webp) 58 fill/calc(var(--u)*53) stretch}
.st-title{font-size:calc(var(--u)*53);line-height:1.1;margin-bottom:calc(var(--u)*20)}
.st-list{width:100%;max-height:calc(var(--u)*960);overflow-y:auto;display:flex;flex-direction:column;gap:calc(var(--u)*6)}.st-list::-webkit-scrollbar{display:none}
.st-sec{margin-top:calc(var(--u)*12);padding:calc(var(--u)*10) 0;line-height:1.5;border-radius:calc(var(--u)*20);background:#e2c48e;color:#3a2416;text-align:center;font-weight:800;font-size:calc(var(--u)*33)}
.st-row{display:flex;align-items:baseline;padding:0 calc(var(--u)*8);font-weight:700;font-size:calc(var(--u)*29);line-height:1.68;color:#b0641e}.st-row .l{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.st-row .v{color:#3a2416;font-weight:800;white-space:nowrap}.st-row .x{color:#9a8670;font-size:calc(var(--u)*25);white-space:nowrap}
.st-row.dim .l,.st-row.dim .v{color:#9a8670}
.st-close{margin-top:calc(var(--u)*28);width:100%;height:calc(var(--u)*119);border-radius:99px;background:#f97316;display:flex;align-items:center;justify-content:center;padding:0;box-shadow:0 calc(var(--u)*6) 0 #c2570c}
.st-close:active{transform:translateY(calc(var(--u)*4));box-shadow:0 calc(var(--u)*2) 0 #c2570c}
.st-close span{color:#fff;font-weight:800;font-size:calc(var(--u)*37);-webkit-text-stroke:0}
.txt.body{font-size:calc(var(--u)*31);font-weight:600;line-height:1.22}.wskip{color:#5a4636;font-size:calc(var(--u)*34);text-decoration:underline}
/* Giriş Serisi */
.ls-wrap{width:min(94vw,calc(100dvh/1.5));aspect-ratio:1024/1536;container-type:inline-size;position:relative;max-height:96%}
.ls-frame{position:absolute;inset:0}.ls-bg{position:absolute;inset:0;width:100%;height:100%}
.ls-head{position:absolute;left:8%;right:8%;top:27%;text-align:center;font:800 5.2cqw Baloo,sans-serif;color:#4a2a10}
.ls-hint{position:absolute;left:8.2%;width:83.5%;top:28.4%;height:4.6%;display:flex;align-items:center;justify-content:center;text-align:center;font:600 2.9cqw/1.2 Baloo,sans-serif;color:#4a2a10}
.ls-hint.big{font-size:4.4cqw}.ls-hint.ok{color:#1f9a3a}.ls-hint.mile{color:#8e44d6}
.ls-grid{position:absolute;left:8.2%;top:33%;width:83.5%;height:44.3%;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:1fr 1fr;gap:0 1.4cqw;align-items:center}
.ls-card{grid-column:span 2;align-self:center;position:relative;aspect-ratio:998/1343;font-family:Baloo,sans-serif}
.ls-card:nth-child(5){grid-column:2/4}.ls-card:nth-child(6){grid-column:4/6}.ls-card:nth-child(7){grid-column:6/8}
.ls-card img{width:100%;height:100%;display:block}
.ls-card span{position:absolute;text-align:center;color:#4a2a10;font-weight:800;display:flex;align-items:center;justify-content:center;white-space:nowrap}
.ls-card .l1{left:18.3%;top:14.85%;width:64%;height:13.6%;font-size:2.7cqw}.ls-card .l2{left:16.3%;top:73.45%;width:67.5%;height:13.3%;font-size:3.1cqw}
.ls-card.done{opacity:.78}.ls-card.today{animation:lsp .65s ease-in-out infinite alternate;z-index:1}.ls-card.just{animation:pp .6s cubic-bezier(.3,1.6,.5,1);z-index:1}
@keyframes lsp{to{transform:scale(1.07)}}
.ls-card .tick{position:absolute;left:50%;bottom:-5%;width:12%;aspect-ratio:1;margin-left:-6%;border-radius:50%;background:#e6d0a2;border:1.5px solid #c9a46a;color:#fff;font:700 2.4cqw/1 sans-serif;display:flex;align-items:center;justify-content:center}
.ls-card.done .tick{background:#2ea043;border-color:#1b7a30}
.ls-act{position:absolute;left:8.2%;width:83.5%;top:77.6%;height:9.6%;display:flex;gap:2cqw;align-items:center;justify-content:center}
.ls-act .pill{flex:1;max-width:70%;height:100%!important;font-size:3.4cqw}
.ls-claim{height:100%;background:none;border:0;padding:0}.ls-claim img{height:100%;display:block}
.ls-x{position:absolute;left:85.5%;top:15.6%;width:12.5%;height:8.4%;background:none;border:0}

/* Store: joker cards (Android JokerCard / DailyJokerCard) */
.jcard{grid-column:1/3;position:relative;aspect-ratio:1300/538;container-type:inline-size;color:#3a2a22;font-family:Baloo,sans-serif}
.jcard>.bg,.djoker>.bg{position:absolute;inset:0;width:100%;height:100%}
.jcard .ja{position:absolute;left:10cqw;top:12.4cqw;width:17.4cqw;height:17.4cqw;border-radius:24%;overflow:hidden}.jcard .ja img{width:100%;height:100%;transform:scale(1.22);object-fit:cover}
.jcard .jn{position:absolute;left:34cqw;top:5cqw;width:33cqw;height:8.3cqw;display:flex;align-items:center;font-size:3.9cqw;font-weight:800;white-space:nowrap}
.jcard .jo{position:absolute;left:10cqw;top:30.6cqw;width:17.4cqw;text-align:center;font-size:2.8cqw;font-weight:800;color:#9a3412;white-space:nowrap}
.jcard .jd{position:absolute;left:34cqw;top:13.2cqw;width:33cqw;font-size:2.6cqw;line-height:1.15;font-weight:500;opacity:.8}
.jcard .jb{position:absolute;left:34cqw;top:24cqw;width:56cqw;height:11.2cqw;display:flex;gap:2cqw}
.jcard .jb button{flex:1;border:0;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;background:0 0 center/100% 100% no-repeat;font-family:inherit;font-weight:800;-webkit-text-stroke:.45cqw #8a3a05;paint-order:stroke fill}
.jcard .jb button{border:5.3cqw solid transparent;box-sizing:border-box;background:none;border-image-slice:72 fill;border-image-width:5.3cqw;border-image-repeat:stretch}.jcard .jb .pillo{border-image-source:url(img/st_pill_orange.webp);border-image-slice:44 fill}.jcard .jb .pillb{border-image-source:url(img/st_pill_blue.webp);-webkit-text-stroke-color:#1b4f8a}
.jcard .jb .pr{display:flex;align-items:center;gap:1cqw;font-size:3.6cqw}.jcard .jb .pr img{height:3.8cqw}.jcard .jb .pr.s{font-size:3.4cqw;margin-top:-.4cqw}.jcard .jb .pr.s img{height:3.4cqw}
.jcard .jb .bk{font-size:2.1cqw;margin-top:.8cqw;white-space:nowrap}.jcard .jb .dis{opacity:.55}
.djoker{grid-column:1/3;position:relative;aspect-ratio:1300/665;container-type:inline-size;font-family:Baloo,sans-serif}
.djoker .dj-tag{position:absolute;left:33.8cqw;top:6cqw;width:43cqw;height:6cqw;display:flex;align-items:center;justify-content:center;color:#fff4d6;font-weight:800;font-size:4.1cqw;text-shadow:0 .25cqw .3cqw #5a2410;white-space:nowrap}
.djoker .dj-art{position:absolute;left:10.4cqw;top:18.6cqw;width:16.9cqw;height:16.9cqw;border-radius:24%;overflow:hidden}.djoker .dj-art img{width:100%;height:100%;transform:scale(1.22);object-fit:cover}
.djoker .dj-txt{position:absolute;left:30.8cqw;top:19.2cqw;width:36cqw;height:17.7cqw;display:flex;flex-direction:column;justify-content:center;color:#3a2a22}
.djoker .dj-txt b{font-size:3.5cqw;font-weight:800;line-height:1.3;white-space:nowrap}.djoker .dj-txt small{font-size:2.75cqw;line-height:1.2;font-weight:600;opacity:.85}
.djoker .dj-btn{position:absolute;left:23.8cqw;top:39.2cqw;width:52.7cqw;height:8.2cqw;background:0 0;border:0;display:flex;align-items:center;justify-content:center;gap:1.2cqw;color:#fff;font:800 4cqw Baloo,sans-serif;text-shadow:0 .25cqw .25cqw #0e3a06;padding:0}
.djoker .dj-btn svg{width:4.8cqw;height:4.8cqw}.djoker .dj-btn:active{transform:scale(.95)}

/* Store: painted purchase window + joker bought celebration */
.bd-wrap{width:min(94vw,calc((100dvh - 24px)*1086/1448));aspect-ratio:1086/1448;container-type:inline-size;position:relative;animation:bdin .26s ease-out}
@keyframes bdin{from{transform:translateY(60%);opacity:0}}
.bd-frame{position:absolute;inset:0}.bd-art{position:absolute;inset:0;width:100%;height:100%}
.bd-hit{position:absolute;background:none;border:0;padding:0;border-radius:8cqw}.bd-hit:active{background:rgba(0,0,0,.12)}.bd-hit.dis{background:rgba(255,255,255,.45)}
.bd-price{position:absolute;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:7cqw;-webkit-text-stroke:.9cqw #1a0e08;paint-order:stroke fill;white-space:nowrap}
.bd-coin{position:absolute;aspect-ratio:1}
.bd-warn{position:absolute;display:flex;align-items:center;justify-content:center;background:#ffe3d6;border-radius:2.3cqw;color:#b3401a;font-weight:800;font-size:3.1cqw;white-space:nowrap}
.bd-qty{position:absolute;left:11%;top:22.8%;width:13.8%;aspect-ratio:1;border-radius:50%;background:linear-gradient(#ffb14e,#f47a16);border:.65cqw solid #fff;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:5.7cqw;-webkit-text-stroke:.7cqw #8a3a06;paint-order:stroke fill}
.bd-prev{position:absolute;display:flex;align-items:center;justify-content:center}.bd-prev>img{width:100%;height:100%;object-fit:contain}.bd-prev .bd-frm{width:48%;aspect-ratio:1}
.bd-name{position:absolute;display:flex;align-items:center;justify-content:center;color:#3a2a22;font-weight:800;font-size:5.9cqw;white-space:nowrap}
.bc{position:fixed;inset:0;background:rgba(27,14,4,.8);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;overflow:hidden;animation:bcf .25s}
@keyframes bcf{from{opacity:0}}
.bc-art{position:relative;width:min(70vw,280px);aspect-ratio:1;display:flex;align-items:center;justify-content:center}
.bc-rays{position:absolute;inset:0;border-radius:50%;background:radial-gradient(#ffe08acc,transparent 70%);animation:bcb .7s ease-in-out infinite alternate}
.bc-rays::after{content:"";position:absolute;inset:0;background:repeating-conic-gradient(#ffe9a88c 0 7deg,transparent 7deg 30deg);-webkit-mask:radial-gradient(transparent 18%,#000 19%,#000 50%,transparent 51%);mask:radial-gradient(transparent 18%,#000 19%,#000 50%,transparent 51%);animation:bcs 9s linear infinite}
@keyframes bcb{to{transform:scale(1.1)}}@keyframes bcs{to{transform:rotate(360deg)}}
.bc-j{position:relative;width:46%;aspect-ratio:1;border-radius:24%;overflow:hidden;animation:bcp .9s cubic-bezier(.3,1.7,.5,1)}.bc-j img{width:100%;height:100%;object-fit:cover;transform:scale(1.22)}
@keyframes bcp{from{transform:scale(.15) rotate(-25deg)}}
.bc h2{margin:10px 0 0;font-size:28px;animation:bct .5s .3s backwards}.bc h3{margin:6px 0 0;font-size:30px;color:#ffd75e;animation:bct .5s .35s backwards}
@keyframes bct{from{opacity:0;transform:translateY(30px)}}
.cf{position:absolute;top:42%;width:9px;height:14px;border-radius:2px;animation:cff 1.7s ease-out forwards}
@keyframes cff{to{transform:translate(var(--dx),var(--dy)) rotate(720deg);opacity:0}}

/* Result screen (Android ResultScreen) */
#res2>.bg{inset:0;width:100%;height:100%;object-fit:cover;object-position:top}.shade{position:absolute;inset:0;background:#180a0233}
#rs-wrap{position:absolute;inset:0;display:flex;flex-direction:column}
#rs-scroll{flex:1;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}#rs-scroll::-webkit-scrollbar{display:none}
.rs-head{position:relative;width:100%;aspect-ratio:841/434;animation:rsin .5s cubic-bezier(.3,1.4,.5,1)}
.rs-head img{position:absolute;left:9.8%;top:0;width:82%;height:99.5%}
.rs-back{position:absolute;left:calc(var(--u)*84.5);top:calc(var(--u)*19);width:calc(var(--u)*121);height:calc(var(--u)*123);background:none;border:0}
.rs-title{position:absolute;left:calc(var(--u)*181);top:calc(var(--u)*279);width:calc(var(--u)*479);height:calc(var(--u)*85);display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*80);line-height:1;white-space:nowrap}
.lt{color:#fff;-webkit-text-stroke:calc(var(--u)*7) #4a2410;paint-order:stroke fill;font-weight:800}
.rs-inner{padding:0 calc(var(--u)*40) calc(var(--u)*10);display:flex;flex-direction:column;gap:calc(var(--u)*10)}
@keyframes rsin{from{transform:translateY(-40px);opacity:0}}
.rs-grid{display:flex;flex-direction:column;gap:calc(var(--u)*8);animation:rsin .45s .09s backwards}
.rs-row{display:flex;gap:calc(var(--u)*12)}.rs-row.one{padding:0 25%}
.rs-card{flex:1;height:calc(var(--u)*108);position:relative;display:flex;align-items:center;color:#3b2314;min-width:0}
.rs-card.ra{background:url(img/rs_card_a.webp) 0 0/100% 100%;padding:calc(var(--u)*6) calc(var(--u)*46) 0 calc(var(--u)*22)}
.rs-card.rb{background:url(img/rs_card_b.webp) 0 0/100% 100%;padding:calc(var(--u)*6) calc(var(--u)*22) 0 calc(var(--u)*36)}
.rs-card img{width:calc(var(--u)*74);height:calc(var(--u)*74);object-fit:contain;flex:none;margin-right:calc(var(--u)*6)}
.rs-card .tx{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}
.rs-card .tx span{font-size:calc(var(--u)*25);font-weight:700;line-height:1.1;white-space:nowrap}
.rs-card .tx b{font-size:calc(var(--u)*46);line-height:1.1;white-space:nowrap;font-weight:800}
.rs-card.hl{justify-content:center;padding:calc(var(--u)*6) calc(var(--u)*40) 0}.rs-card.hl b{font-size:calc(var(--u)*46);white-space:nowrap}
.rs-level{position:relative;width:100%;aspect-ratio:698/140;animation:rsin .45s .18s backwards;font-weight:800}
.rs-level .bgi{position:absolute;inset:0;width:100%;height:100%}
.rs-level>*{--s:calc(var(--u)*761/698)}
.rs-level .crown{position:absolute;left:calc(var(--s)*88);top:calc(var(--s)*21);width:calc(var(--s)*46);height:calc(var(--s)*40);object-fit:contain}
.rs-level .lv{position:absolute;left:calc(var(--s)*146);top:calc(var(--s)*17);width:calc(var(--s)*240);height:calc(var(--s)*48);display:flex;align-items:center;font-size:calc(var(--s)*38);color:#3b2314;white-space:nowrap}
.rs-level .nx{position:absolute;left:calc(var(--s)*380);top:calc(var(--s)*20);width:calc(var(--s)*262);height:calc(var(--s)*42);display:flex;align-items:center;justify-content:flex-end;font-size:calc(var(--s)*25);font-weight:700;color:#3b2314;white-space:nowrap}
.rs-level .nx i{font-style:normal;background:linear-gradient(#ffa64d,#f47a16);border-radius:99px;padding:0 calc(var(--s)*12);color:#fff;font-size:calc(var(--s)*26);-webkit-text-stroke:calc(var(--s)*4) #8a3a00;paint-order:stroke fill}
.rs-level .bar{position:absolute;left:calc(var(--s)*84);top:calc(var(--s)*71);width:calc(var(--s)*534);height:calc(var(--s)*27);background:#e6d3b3;border:calc(var(--s)*1.5) solid #c9ae86;border-radius:99px;overflow:hidden}
.rs-level .fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#ffa23a,#f2701a);border-radius:99px;transition:width 1.1s cubic-bezier(.4,0,.2,1)}
.rs-level .bar em{position:absolute;right:calc(var(--s)*9);top:50%;width:calc(var(--s)*9);height:calc(var(--s)*9);margin-top:calc(var(--s)*-4.5);border-radius:50%;background:#f58a1f}
.rs-level .bar span{position:absolute;left:calc(var(--s)*14);top:0;bottom:0;display:flex;align-items:center;color:#fff;font-size:calc(var(--s)*19);font-weight:700;text-shadow:0 1.5px 3px #5a2a08aa}
.rs-vs{position:relative;width:100%;height:calc(var(--u)*128);border:solid transparent;border-width:calc(var(--u)*52) calc(var(--u)*65);box-sizing:border-box;border-image:url(img/rs_vs.webp) 64 80 fill/calc(var(--u)*52) calc(var(--u)*65) stretch;font-weight:800;color:#3b2314}
.rs-vs>*{position:absolute}
.rs-vs .av{top:calc(var(--u)*(22 - 52));width:calc(var(--u)*84);height:calc(var(--u)*84)}.rs-vs .av.l{left:calc(var(--u)*(44 - 65))}.rs-vs .av.r{right:calc(var(--u)*(44 - 65))}
.rs-vs .nm,.rs-vs .sc{width:calc(var(--u)*190);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-vs .nm{top:calc(var(--u)*(22 - 52));height:calc(var(--u)*36);font-size:calc(var(--u)*30);line-height:calc(var(--u)*36)}
.rs-vs .sc{top:calc(var(--u)*(44 - 52));height:calc(var(--u)*60);font-size:calc(var(--u)*58);line-height:calc(var(--u)*60)}
.rs-vs .l{left:calc(var(--u)*(148 - 65))}.rs-vs .r{right:calc(var(--u)*(148 - 65));text-align:right}
.rs-vs .out{left:50%;margin-left:calc(var(--u)*-95 - var(--u)*0);top:calc(var(--u)*(22 - 52));width:calc(var(--u)*190);height:calc(var(--u)*38);border-radius:99px;border:2px solid #fff5;display:flex;align-items:center;justify-content:center;color:#fff;font-size:calc(var(--u)*28);-webkit-text-stroke:calc(var(--u)*4) #1b3a10;paint-order:stroke fill}
.rs-vs .vs{left:50%;margin-left:calc(var(--u)*-95);width:calc(var(--u)*190);top:calc(var(--u)*(60 - 52));text-align:center;font-size:calc(var(--u)*32);color:#8a6a50}
.rs-vs .cr{left:50%;margin-left:calc(var(--u)*-38);top:calc(var(--u)*-32 - var(--u)*52);width:calc(var(--u)*76);height:calc(var(--u)*66);object-fit:contain}
.rs-daily{background:linear-gradient(#fff8e6,#fceacb);border:calc(var(--u)*5) solid #e8a13a;border-radius:calc(var(--u)*36);padding:calc(var(--u)*14) calc(var(--u)*24);text-align:center;color:#3b2314;box-shadow:0 calc(var(--u)*6) calc(var(--u)*10) #0003}
.rs-daily h4{margin:0 0 calc(var(--u)*8);font-size:calc(var(--u)*34);font-weight:800}
.rs-daily .pips{display:flex;gap:calc(var(--u)*8);justify-content:center}.rs-daily .pips i{width:calc(var(--u)*44);height:calc(var(--u)*44);border-radius:50%;font-style:normal;color:#fff;font-size:calc(var(--u)*28);display:flex;align-items:center;justify-content:center;border:calc(var(--u)*3) solid #fff6e6}
.rs-daily .pips .ok{background:#34b24a}.rs-daily .pips .no{background:#e53935}
.rs-daily .pl{display:flex;gap:calc(var(--u)*16);margin-top:calc(var(--u)*10)}.rs-daily .pl>div{flex:1;background:#fff;border:calc(var(--u)*3) solid #ebcb9a;border-radius:calc(var(--u)*28);padding:calc(var(--u)*6);display:flex;flex-direction:column;align-items:center}
.rs-daily .pl span{font-size:calc(var(--u)*30);color:#e8650f}.rs-daily .pl b{font-weight:800}.rs-daily .pl small{display:block;margin:0;font-size:calc(var(--u)*22);font-weight:700}
.rs-board{position:relative;width:100%;--k:calc(var(--u)*761/714);animation:rsin .45s .36s backwards;--gap:calc(var(--k)*8);--sw:calc((var(--k)*632 - var(--gap)*4)/5)}
.rs-board .bd-art{position:absolute;inset:0;border:solid transparent;border-width:calc(var(--k)*170) 0 calc(var(--k)*129);border-image:url(img/rs_board.webp) 170 0 129 fill/calc(var(--k)*170) 0 calc(var(--k)*129) stretch}
.rs-board .plank{position:absolute;left:calc(var(--k)*272);top:calc(var(--k)*56);width:calc(var(--k)*316);height:calc(var(--k)*58);display:flex;align-items:center;justify-content:center;gap:calc(var(--k)*6);padding:0 calc(var(--k)*6);box-sizing:border-box}
.rs-board .plank>span{font-size:calc(var(--k)*36);white-space:nowrap}
.rs-board .chip{height:calc(var(--k)*50);border-radius:99px;border:calc(var(--k)*3) solid #a9440a;background:linear-gradient(#ffb14e,#f47a16);min-width:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--k)*30);padding:0 calc(var(--k)*8);overflow:hidden}
.rs-board .chip.sel{background:linear-gradient(#fffbf0,#f3dfba);border-color:#8a5a2e}.rs-board .chip.sel .lt{color:#3b2314;-webkit-text-stroke:0}.rs-board .chip.dis{opacity:.6}
.rs-board .chip span{white-space:nowrap;-webkit-text-stroke-width:calc(var(--k)*5);overflow:hidden;text-overflow:ellipsis}
.rs-sheets{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap);padding:calc(var(--k)*139) calc(var(--k)*42) calc(var(--k)*70) calc(var(--k)*40);min-height:calc(var(--k)*300)}
.rs-sheets.scr{height:calc(var(--k)*139 + (var(--sw)/.95*2 + var(--gap)) + var(--k)*70);overflow-y:auto;align-content:start;box-sizing:border-box}
.rs-sheets.scr{padding-bottom:0}
.sheet{position:relative;aspect-ratio:.95}
.sheet .pg{position:absolute;inset:calc(var(--k)*6) calc(var(--k)*4) 0 0;background:#fff6e2;border:1px solid #d9bc8c;border-radius:calc(var(--k)*8);box-shadow:0 1px 3px #0003;display:flex;flex-direction:column;padding:calc(var(--k)*12) calc(var(--k)*3) calc(var(--k)*2) calc(var(--k)*8);box-sizing:border-box;overflow:hidden}
.sheet.empty .pg{display:none}.sheet.empty{background:#fff3da99;border-radius:calc(var(--k)*8);margin:calc(var(--k)*6) calc(var(--k)*4) 0 0}
.sheet .dots{position:absolute;left:calc(var(--k)*3);top:30%;bottom:30%;width:calc(var(--k)*3);background:radial-gradient(#b59a7a calc(var(--k)*1.5),transparent calc(var(--k)*1.6)) 0 0/100% calc(var(--k)*9)}
.sheet em{position:absolute;left:calc(var(--k)*5);top:calc(var(--k)*2);font-style:normal;font-size:calc(var(--k)*12);color:#3b2314}
.sheet canvas{flex:1;min-height:0;width:100%}
.sheet b{height:calc(var(--k)*16);font-size:calc(var(--k)*12);text-align:center;color:#3b2314;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
.sheet .mk{position:absolute;right:0;top:0;width:calc(var(--k)*20);height:calc(var(--k)*20)}
#rs-foot{padding:calc(var(--u)*8) calc(var(--u)*40) calc(var(--u)*36);display:flex;flex-direction:column;gap:calc(var(--u)*8)}
.rs-btns{display:flex;gap:calc(var(--u)*14)}
.rs-art{flex:1;height:calc(var(--u)*100);background:none;border:0;padding:0 calc(var(--u)*38);position:relative;color:#fff;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*2)}
.rs-art::before{content:"";position:absolute;inset:0;border:solid transparent;border-width:calc(var(--u)*38) calc(var(--u)*144);box-sizing:border-box;border-image:url(img/rs_btn_claim.webp) 40 150 fill/calc(var(--u)*38) calc(var(--u)*144) stretch}
.rs-art>span{position:relative;text-align:center;white-space:nowrap;line-height:1.05;max-width:100%}
.rs-art .l1{font-size:calc(var(--u)*38);-webkit-text-stroke:calc(var(--u)*7) #8a3a00}
.rs-btns .rs-art:first-child .l1{font-size:calc(var(--u)*34)}.rs-btns .rs-art:first-child .l2{font-size:calc(var(--u)*22);font-weight:700}
.rs-art.dis{opacity:.55}.rs-art:active{transform:scale(.94)}
.rs-next{height:calc(var(--u)*100);border-radius:99px;border:calc(var(--u)*5) solid #d08a2e;background:linear-gradient(#fff7e6,#fce3b4,#f5cd8a);color:#a83a18;font-size:calc(var(--u)*40);font-weight:800;box-shadow:0 calc(var(--u)*8) calc(var(--u)*10) #0004}
.pv{position:absolute;inset:0;background:#2a1708;overflow:hidden}.pv-bg{position:absolute}.pv-word{position:absolute;display:flex;align-items:center;justify-content:center;white-space:nowrap}
.pv-cv{position:absolute;background:#fffdf4}.pv-hit{position:absolute;background:none;border:0;padding:0}.pv-act{display:flex;align-items:center;justify-content:center;-webkit-text-stroke-color:#8a3a00}
.pv-ar{background:#4a2410cc;border-radius:50%;color:#fff;display:flex;align-items:center;justify-content:center;padding-bottom:.1em}.pv-ar.dis{opacity:.35}.pv-cnt{position:absolute;display:flex;align-items:center;justify-content:center}
.rs-conf{position:absolute;inset:0;pointer-events:none;overflow:hidden}.rs-conf i{position:absolute;top:-20px;width:10px;height:16px;border-radius:2px;animation:rsf linear forwards}
@keyframes rsf{to{transform:translateY(110vh) rotate(900deg)}}
.rs-share{margin:calc(var(--u)*10) auto 0;height:calc(var(--u)*76);width:80%;border-radius:99px;border:calc(var(--u)*5) solid #1b6e25;background:linear-gradient(#7edc5c,#34a83a,#248a2e);display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*14);box-shadow:0 calc(var(--u)*8) calc(var(--u)*10) #0004}
.rs-share svg{width:calc(var(--u)*40);height:calc(var(--u)*40)}.rs-share .lt{font-size:calc(var(--u)*34);-webkit-text-stroke:calc(var(--u)*6) #1b5e20}.rs-share:active{transform:scale(.95)}

/* Brand splash */
#splash{position:fixed;inset:0;z-index:9999;background:#b07f34;overflow:hidden;transition:opacity .26s linear}
#splash img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform-origin:center}
#sp-bar{position:absolute;border-radius:99px;background:#3f2210;border:3px solid #ffe08a;box-shadow:0 0 0 2px #8a4e12 inset;box-sizing:border-box}
#sp-bar i{display:block;height:100%;min-width:12%;border-radius:99px;background:linear-gradient(#ffc04a,#f58a1f);box-shadow:inset 0 .35em 0 #ffffff47}
/* Chat dock + history (Android ReactionBar) */
.cd-dock{position:absolute;container-type:inline-size;aspect-ratio:1740/904}
.cd-bg{position:absolute;inset:0;width:100%;height:100%}.cd-dock>div{position:absolute}
.cd-circ{border-radius:50%;background:linear-gradient(#ffb14e,#f47a16);border:.29cqw solid #a9440a;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.cd-circ svg{width:57%;height:57%}.cd-circ.cd-sq{border-radius:1.7cqw}.cd-circ.cd-sq svg{width:53%;height:53%}.cd-circ.brown{background:linear-gradient(#8a5530,#6a3e1e);border-color:#d9a55a}
.cd-row{display:flex;align-items:center;overflow-x:auto;scrollbar-width:none;gap:.8cqw}.cd-row::-webkit-scrollbar{display:none}.cd-row.phr{gap:.8cqw}.cd-row.emo{gap:.46cqw}
.cd-chip{flex:none;height:86%;border-radius:99px;border:.23cqw solid #a9440a;background:linear-gradient(#ffb14e,#f47a16);color:#fff;font:800 3.3cqw Baloo,sans-serif;padding:0 2cqw;white-space:nowrap}
.cd-chip.big{height:auto;padding:.9em 1em;font-size:calc(var(--u)*34);width:100%;border-width:2px}
.cd-emo{flex:none;width:7.4cqw;height:7.4cqw;border:0;background:none;font-size:4.8cqw;padding:0;line-height:1}
.cd-sheet{max-height:80%}.cd-list{display:flex;flex-direction:column;gap:calc(var(--u)*14);overflow-y:auto}.cd-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:calc(var(--u)*14)}
.cd-emo2{aspect-ratio:1;border-radius:50%;border:0;background:#f8e3b4;font-size:calc(var(--u)*56)}
.ch-wrap{width:min(96vw,calc((100dvh - 16px)*941/1672));aspect-ratio:941/1672;container-type:inline-size;position:relative}
.ch-frame{position:absolute;inset:0}.ch-bg{position:absolute;inset:0;width:100%;height:100%}.ch-frame>*:not(.ch-bg){position:absolute}
.ch-title{display:flex;align-items:center;justify-content:center;font-size:8.9cqw;white-space:nowrap}
.ch-x{border-radius:50%;background:linear-gradient(#ff6a5a,#d42a1e);border:.64cqw solid #fff;color:#fff;font:800 5.7cqw sans-serif;padding:0}
.ch-list{overflow-y:auto;display:flex;flex-direction:column;gap:1.5cqw;scrollbar-width:none}.ch-list::-webkit-scrollbar{display:none}
.ch-empty{margin:auto;text-align:center;color:#8a5a2e;font-size:3.6cqw;font-weight:600;padding:0 4cqw}
.ch-msg{display:flex;align-items:center;gap:1cqw;flex:none}.ch-msg .av{width:7.4cqw;height:7.4cqw;flex:none;position:relative}
.ch-msg .bub{max-width:42cqw;background:#f8e3b4;border-radius:2.8cqw;padding:1cqw 2.3cqw;color:#3a2416;font-size:3.6cqw;font-weight:600}.ch-msg .bub.me{background:#cfe4fa}
.ch-msg .bub small{display:block;font-size:3.2cqw;font-weight:800;color:#e8650f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ch-msg .bub.me small{color:#1f5fa8}
.ch-msg time{margin-left:auto;font-size:2.8cqw;color:#8a5a2e}
.ch-bar{display:flex;align-items:center;gap:1.3cqw;overflow-x:auto;scrollbar-width:none}.ch-bar::-webkit-scrollbar{display:none}.ch-bar .cd-chip{height:70%;font-size:3.2cqw}
.cd-row1{display:flex;align-items:center;gap:calc(var(--u)*14);width:100%;background:#fff6e2;border:calc(var(--u)*4) solid #e8a13a;border-radius:calc(var(--u)*30);padding:calc(var(--u)*12) calc(var(--u)*22);font:600 calc(var(--u)*28) Baloo,sans-serif;color:#3b2314;text-align:left;box-shadow:0 calc(var(--u)*6) calc(var(--u)*8) #0003}
.cd-row1 svg{width:calc(var(--u)*34);height:calc(var(--u)*34);flex:none}.cd-row1 span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cd-row1 em{font-style:normal;font-size:calc(var(--u)*22);color:#8a6a50}
.bubble{position:absolute;right:calc(var(--u)*110);top:50%;transform:translateY(-50%);max-width:55%;overflow:hidden;text-overflow:ellipsis;background:#fffaf0;border:calc(var(--u)*4) solid #e8650f;border-radius:calc(var(--u)*24);padding:calc(var(--u)*6) calc(var(--u)*18);font-size:calc(var(--u)*28);font-weight:700;color:#3b2314;z-index:3;white-space:nowrap;animation:bpop .35s cubic-bezier(.3,1.6,.5,1);box-shadow:0 calc(var(--u)*6) calc(var(--u)*8) #0004}
@keyframes bpop{from{transform:translateY(-50%) scale(.3);opacity:0}}
.rs-pair{display:flex;gap:calc(var(--u)*12)}.rs-pair.one{padding:0 12.5%}.rs-pair .rs-card{height:calc(var(--u)*96)}
.rs-pair .rs-card.ra{padding:calc(var(--u)*6) calc(var(--u)*50) 0 calc(var(--u)*22)}.rs-pair .rs-card.rb{padding:calc(var(--u)*6) calc(var(--u)*22) 0 calc(var(--u)*40)}
.rs-pair .mrow{flex:1;display:flex;justify-content:space-evenly;align-items:center}.rs-pair .mn{display:flex;align-items:center;gap:calc(var(--u)*4)}
.rs-pair .mn img{width:calc(var(--u)*54);height:calc(var(--u)*54);object-fit:contain}.rs-pair .mn b{font-size:calc(var(--u)*38);white-space:nowrap}
.rs-stand{border:solid transparent;border-width:calc(var(--u)*45);border-image:url(img/league_card.webp) 100 fill/calc(var(--u)*45) stretch;padding:0;margin:0;display:flex;flex-direction:column;gap:calc(var(--u)*6);color:#3b2314;box-sizing:border-box}
.rs-stand h4{margin:0;text-align:center;font-size:calc(var(--u)*38);font-weight:800}
.st-row{display:flex;align-items:center;gap:calc(var(--u)*12)}.st-row .rk{width:calc(var(--u)*58);text-align:center;font-size:calc(var(--u)*34)}
.st-row .av{width:calc(var(--u)*66);height:calc(var(--u)*66);position:relative;flex:none}.st-row .who{flex:1;min-width:0;display:flex;flex-direction:column}
.st-row .who b{font-size:calc(var(--u)*30);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.st-row .who small{display:block;margin:0;font-size:calc(var(--u)*22);color:#8a6a50;font-weight:600}
.st-row .pt{font-size:calc(var(--u)*46);color:#f2541b}.st-row .ok{color:#2ea043;text-decoration:none;font-size:calc(var(--u)*34)}.st-row.gone *{color:#8e1f1f}
.rs-note{text-align:center;color:#3b2314;font-size:calc(var(--u)*28);font-weight:700;background:#fff6e2cc;border-radius:99px;padding:calc(var(--u)*6) 0}.rs-note.ok{color:#1f9a3a}
.rsv-ring{position:relative;width:100%;height:100%}
.rs-board .plank.scrl{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}.rs-board .plank.scrl::-webkit-scrollbar{display:none}
.rs-inner>.cd-dock{position:relative;width:100%}
.ow-sec{color:#fff;font-size:calc(var(--u)*34);text-align:center;margin-top:calc(var(--u)*6);-webkit-text-stroke:calc(var(--u)*5) #7a2a08;paint-order:stroke fill}
.rs-vs .tn.l{left:calc(var(--u)*(50 - 65))}.rs-vs .tn.r{right:calc(var(--u)*(50 - 65))}
#team-pill{position:absolute;top:calc(var(--u)*6);left:50%;transform:translateX(-50%);z-index:5;background:#fff6e2e6;border:calc(var(--u)*3) solid #e8a13a;border-radius:99px;padding:calc(var(--u)*2) calc(var(--u)*20);font-size:calc(var(--u)*22);color:#3b2314;white-space:nowrap;max-width:90%;overflow:hidden;text-overflow:ellipsis;font-weight:700;pointer-events:none}

/* ---- shared window (AppWindowDialog) and button (PrimaryButton) ---- */
.prim{height:calc(var(--u)*119);border-radius:99px;background:#f97316;box-shadow:0 calc(var(--u)*8) 0 #b94b06;color:#fff;font-weight:800;font-size:calc(var(--u)*37);display:flex;align-items:center;justify-content:center;padding:0 calc(var(--u)*40);width:100%;margin-bottom:calc(var(--u)*8);transition:transform .08s,box-shadow .08s}
.prim:active{transform:translateY(calc(var(--u)*6));box-shadow:0 calc(var(--u)*2) 0 #b94b06}.prim span{white-space:nowrap}
.aw-ov{position:absolute;inset:0;z-index:40;background:#0009;display:flex;align-items:center;justify-content:center;padding:calc(var(--u)*49) calc(var(--u)*33)}
.aw-card{position:relative;isolation:isolate;width:100%;max-width:calc(var(--u)*984);max-height:100%;display:flex;animation:awin .22s ease-out}@keyframes awin{from{transform:translateY(calc(var(--u)*44));opacity:0}}
.aw-card::before{content:"";position:absolute;inset:0;z-index:-1;border:calc(var(--u)*49) solid transparent;border-image:url(img/league_card.webp) 100 fill/calc(var(--u)*49) stretch}
.aw-in{display:flex;flex-direction:column;min-height:0;width:100%;padding:calc(var(--u)*33) calc(var(--u)*37);box-sizing:border-box}
.aw-head{display:flex;align-items:center;gap:calc(var(--u)*12)}.aw-head.ctr{justify-content:center}
.aw-title{flex:1;font-weight:800;font-size:calc(var(--u)*47);color:#3a2416;line-height:1.25}.aw-head.ctr .aw-title{text-align:center}
.aw-x{flex:none;width:calc(var(--u)*74);height:calc(var(--u)*74);border-radius:50%;background:#3a24161a;color:#3a2416;font-weight:800;font-size:calc(var(--u)*33);display:flex;align-items:center;justify-content:center;padding:0}
.aw-body{margin-top:calc(var(--u)*16);overflow-y:auto;min-height:0;flex:1 1 auto}.aw-body::-webkit-scrollbar{display:none}.aw-foot{margin-top:calc(var(--u)*20);flex:none}
/* ---- the chest window (ChestDetail.kt) ---- */
.cd-stage{position:relative;border-radius:calc(var(--u)*45);border:calc(var(--u)*6) solid #d7b48a;overflow:hidden;display:flex;align-items:center;justify-content:center}
.cd-cv{position:absolute;inset:0;width:100%;height:100%}.cd-chest{position:relative;display:block;transform-origin:50% 80%}.cd-chest.wig{animation:wig .56s}@keyframes wig{0%,100%{transform:rotate(0)}14%{transform:rotate(6deg)}28%{transform:rotate(-6deg)}42%{transform:rotate(6deg)}56%{transform:rotate(-6deg)}70%{transform:rotate(6deg)}84%{transform:rotate(-6deg)}}
.cd-bubble{position:absolute;top:calc(var(--u)*20);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;animation:bpop .18s ease-out}.cd-bubble.hidden{display:none}@keyframes bpop{from{transform:translateX(-50%) scale(.7);opacity:0}}
.cd-bubble span{background:#fff;border:calc(var(--u)*4) solid #3a241640;border-radius:calc(var(--u)*33);padding:calc(var(--u)*20) calc(var(--u)*33);font-weight:700;font-size:calc(var(--u)*29);color:#3a2416;text-align:center;line-height:1.3;max-width:calc(var(--u)*600)}
.cd-bubble i{width:calc(var(--u)*45);height:calc(var(--u)*22);background:#fff;clip-path:polygon(0 0,100% 0,50% 100%)}
.cd-contents{margin-top:calc(var(--u)*29);border:calc(var(--u)*3) solid;border-radius:calc(var(--u)*37);padding:calc(var(--u)*25) calc(var(--u)*29);display:flex;flex-direction:column;gap:calc(var(--u)*18)}
.cd-ch{display:flex;align-items:center}.cd-ch b{flex:1;font-size:calc(var(--u)*33);font-weight:800;color:#3a2416}.cd-ch span{font-weight:800;font-size:calc(var(--u)*25);border-radius:99px;padding:calc(var(--u)*6) calc(var(--u)*20)}
.cd-cr{display:flex;align-items:center;gap:calc(var(--u)*20)}.cd-cr i{flex:none;width:calc(var(--u)*57);height:calc(var(--u)*57);border-radius:50%;background:#ffffffd9;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:calc(var(--u)*31)}.cd-cr span{font-weight:600;font-size:calc(var(--u)*29);color:#4a3426}
.cd-plate{margin-top:calc(var(--u)*25);border-radius:calc(var(--u)*41);border:calc(var(--u)*4) solid #ffc94dd9;background:linear-gradient(#3b2617,#1c1109);padding:calc(var(--u)*29) calc(var(--u)*37);display:flex;flex-direction:column;align-items:center}
.cd-pl{display:flex;align-items:center;gap:calc(var(--u)*12);color:#ffc94de6;font-weight:800;font-size:calc(var(--u)*25);letter-spacing:.1em}.cd-pl svg{width:calc(var(--u)*33);height:calc(var(--u)*33)}
.cd-pt{font-weight:800;font-size:calc(var(--u)*82);color:#ffe08a;line-height:1.2;margin-top:calc(var(--u)*8)}.cd-ph{color:#ffffffb3;font-size:calc(var(--u)*27);text-align:center;margin-top:calc(var(--u)*8)}
.cd-bar{width:100%;height:calc(var(--u)*18);border-radius:calc(var(--u)*10);background:#ffffff29;overflow:hidden;margin-top:calc(var(--u)*16)}.cd-bar i{display:block;height:100%;background:#ffc94d}
.cd-ok{text-align:center;font-weight:800;font-size:calc(var(--u)*37);color:#2e8b45;margin-bottom:calc(var(--u)*20)}.cd-busy{text-align:center;font-size:calc(var(--u)*31);color:#7a6a5a}.cd-lost{font-size:calc(var(--u)*31);color:#3a2416;line-height:1.35}
/* ---- the home slots ---- */
.ch-slot.filled{overflow:hidden;border-radius:calc(var(--u)*25);border:calc(var(--u)*4) solid var(--bc,#d7b48a);background:none;padding:0;display:block}.ch-slot.ready{border-width:calc(var(--u)*7);animation:slotglow 1.2s ease-in-out infinite alternate}@keyframes slotglow{to{filter:drop-shadow(0 0 calc(var(--u)*14) #5be08a)}}
.sl-cv{position:absolute;inset:0;width:100%;height:100%}.sl-img{position:absolute;left:50%;top:calc(var(--u)*10);transform:translateX(-50%);width:62%;pointer-events:none}
.sl-n{position:absolute;left:0;right:0;top:calc(var(--u)*96);text-align:center;font-weight:800;font-size:calc(var(--u)*21);color:#3a2416;white-space:nowrap;padding:0 calc(var(--u)*4)}
.sl-plate{position:absolute;left:calc(var(--u)*14);right:calc(var(--u)*14);bottom:calc(var(--u)*10);height:calc(var(--u)*46);border-radius:calc(var(--u)*22);border:calc(var(--u)*3) solid var(--ac);display:flex;align-items:center;justify-content:center;background:linear-gradient(#352218f2,#1a1108f2);overflow:hidden}
.sl-plate::before{content:"";position:absolute;left:0;right:0;top:0;height:55%;background:linear-gradient(#ffffff4d,#ffffff0a)}.sl-plate span{position:relative;color:#fff;font-weight:800;font-size:calc(var(--u)*24);text-shadow:0 calc(var(--u)*3) calc(var(--u)*4) #0007;white-space:nowrap}
.sl-plate.going{background:linear-gradient(#4a2b14,#1f1008);border-color:#ffc94d}.sl-plate.going span{color:#ffe08a}.sl-plate.ready{background:linear-gradient(#5be08a,#1e9e52);border-color:#b8f5cf}
/* ---- the opening scene and the win scene ---- */
.os2,.won{position:absolute;inset:0;z-index:60;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.os2.white{background:#fff}.os2-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.os2-cv,.won-cv{position:absolute;inset:0;width:100%;height:100%}.os2-col{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:calc(var(--u)*49) calc(var(--u)*49);box-sizing:border-box;max-height:100%;overflow-y:auto}
.os2-title{font-weight:800;font-size:calc(var(--u)*53);color:#3a2416;animation:rvl .5s cubic-bezier(.3,1.5,.5,1) both}.os2-tier{margin-top:calc(var(--u)*16);font-weight:800;font-size:calc(var(--u)*31);border-radius:99px;padding:calc(var(--u)*8) calc(var(--u)*29);animation:rvl .5s .05s cubic-bezier(.3,1.5,.5,1) both}@keyframes rvl{from{transform:scale(0);opacity:0}}
.os2-card{margin-top:calc(var(--u)*37);width:100%;box-sizing:border-box;background:#fff;border:calc(var(--u)*5) solid;border-radius:calc(var(--u)*57);padding:calc(var(--u)*45) calc(var(--u)*41);display:flex;flex-direction:column;align-items:center;animation:card .6s cubic-bezier(.3,1.4,.5,1) both}@keyframes card{from{transform:scale(.85);opacity:0}}
.os2-coin{width:calc(var(--u)*254);height:calc(var(--u)*254);animation:spinc .9s ease-out both}.os2-coin.sm{width:calc(var(--u)*189);height:calc(var(--u)*189)}@keyframes spinc{from{transform:rotateY(540deg)}}
.os2-gold{font-weight:800;font-size:calc(var(--u)*98);color:#c77f00;margin-top:calc(var(--u)*12)}.os2-gold.sm{font-size:calc(var(--u)*82)}
.os2-extras{display:flex;flex-wrap:wrap;gap:calc(var(--u)*20);justify-content:center;margin-top:calc(var(--u)*8)}.os2-extras:not(:empty){margin-top:calc(var(--u)*33)}
.os2-j{border-radius:calc(var(--u)*33);padding:calc(var(--u)*16) calc(var(--u)*25);display:flex;flex-direction:column;align-items:center;color:#fff;animation:rvl .4s cubic-bezier(.3,1.5,.5,1) both}.os2-j .ja{width:calc(var(--u)*82);height:calc(var(--u)*82);border-radius:24%;overflow:hidden;display:block}.os2-j .ja img{width:100%;height:100%;transform:scale(1.22)}.os2-j b{font-weight:800;font-size:calc(var(--u)*37)}.os2-j small{font-size:calc(var(--u)*23);opacity:.95}
.os2-pen{margin-top:calc(var(--u)*25);width:100%;display:flex;align-items:center;gap:calc(var(--u)*20);justify-content:center;background:#3a241612;border-radius:99px;padding:calc(var(--u)*16) calc(var(--u)*33);animation:rvl .4s both}.os2-pen i{width:calc(var(--u)*94);height:calc(var(--u)*25);border-radius:99px}.os2-pen span{font-weight:700;font-size:calc(var(--u)*29);color:#3a2416}
.os2-btn{width:calc(var(--u)*492)!important;margin-top:calc(var(--u)*45)}
.won{background:#120a22}.won-col{position:absolute;left:0;right:0;top:calc(34% + var(--u)*359);bottom:0;display:flex;flex-direction:column;align-items:center;padding:0 calc(var(--u)*49);opacity:0;transform:scale(.8);transition:opacity .45s,transform .5s cubic-bezier(.3,1.5,.5,1);pointer-events:none}.won-col.in{opacity:1;transform:none;pointer-events:auto}
.won-title{font-weight:800;font-size:calc(var(--u)*78);text-align:center;background:linear-gradient(#fff3b0,#ffc72e,#ff8a00);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 calc(var(--u)*6) calc(var(--u)*8) #3a1a00)}
.won-tier{margin-top:calc(var(--u)*25);display:flex;align-items:center;gap:calc(var(--u)*16);border-radius:99px;padding:calc(var(--u)*16) calc(var(--u)*37);color:#fff}.won-tier .st{color:#ffe066;font-size:calc(var(--u)*33)}.won-tier b{font-weight:800;font-size:calc(var(--u)*37)}.won-tier small{font-size:calc(var(--u)*27);opacity:.9;font-weight:700}
.won-info{margin-top:calc(var(--u)*29);display:flex;flex-direction:column;align-items:center;color:#fff}.won-t{display:flex;align-items:center;gap:calc(var(--u)*12);font-weight:700;font-size:calc(var(--u)*37)}.won-t svg{width:calc(var(--u)*41);height:calc(var(--u)*41)}.won-info small{margin-top:calc(var(--u)*8);color:#ffffffbf;font-size:calc(var(--u)*27);text-align:center}
.won-btn{width:calc(var(--u)*492)!important;margin-top:calc(var(--u)*45);animation:wpulse .8s ease-in-out infinite alternate}@keyframes wpulse{to{transform:scale(1.05)}}
/* ---- the chest info window (ChestInfoDialog) ---- */
.ci-step{display:flex;gap:calc(var(--u)*20);min-height:calc(var(--u)*100)}.ci-rail{flex:none;width:calc(var(--u)*66);position:relative;display:flex;align-items:center;justify-content:center}
.ci-rail::before{content:"";position:absolute;left:50%;width:calc(var(--u)*6);margin-left:calc(var(--u)*-3);top:0;bottom:0;background:#ff7a2173}.ci-step.first .ci-rail::before{top:50%}.ci-step.last .ci-rail::before{bottom:50%}
.ci-rail i{position:relative;width:calc(var(--u)*57);height:calc(var(--u)*57);border-radius:50%;background:linear-gradient(#ffa24d,#f2611b);border:calc(var(--u)*4) solid #fff;box-shadow:0 calc(var(--u)*6) calc(var(--u)*8) #0004;color:#fff;font-style:normal;font-weight:800;font-size:calc(var(--u)*33);display:flex;align-items:center;justify-content:center}
.ci-tx{flex:1;padding:calc(var(--u)*4) 0}.ci-tx b{display:block;font-size:calc(var(--u)*29);line-height:1.2;color:#3a2416}.ci-tx span{display:block;font-size:calc(var(--u)*24);line-height:1.2;color:#6b5646}
.ci-h{text-align:center;font-weight:800;font-size:calc(var(--u)*29);color:#3a2416;margin:calc(var(--u)*12) 0 calc(var(--u)*8)}
.ci-card{display:flex;align-items:center;gap:calc(var(--u)*20);border:calc(var(--u)*3) solid;border-radius:calc(var(--u)*33);padding:calc(var(--u)*6) calc(var(--u)*20);margin-bottom:calc(var(--u)*8)}.ci-card img{width:calc(var(--u)*70);flex:none}
.ci-n{display:flex;align-items:center;gap:calc(var(--u)*16)}.ci-n b{font-size:calc(var(--u)*29);color:#3a2416}.ci-n span{color:#fff;font-weight:800;font-size:calc(var(--u)*23);border-radius:99px;padding:0 calc(var(--u)*16)}.ci-l{font-size:calc(var(--u)*23);line-height:1.2;color:#3a2416}

#h-rbadge{position:absolute;display:none;pointer-events:none;animation:rbp .7s ease-in-out infinite alternate}@keyframes rbp{from{transform:scale(.9)}to{transform:scale(1.15)}}

.lg-banner{display:flex;align-items:center;gap:calc(var(--u)*16);background:url(img/league_banner.webp) 0 0/100% 100%;padding:calc(var(--u)*44) calc(var(--u)*60);color:#3b2314}
.lb-i{font-size:calc(var(--u)*80);width:calc(var(--u)*100);display:flex;justify-content:center}.lb-fr{position:relative;width:calc(var(--u)*80);height:calc(var(--u)*80)}
.lb-m{flex:1;min-width:0;display:flex;flex-direction:column}.lb-m small{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}.lb-m b{font-size:calc(var(--u)*52)}.lb-m i{display:block;height:calc(var(--u)*24);margin-top:calc(var(--u)*10);border-radius:99px;width:60%;transform:rotate(-3deg)}
.lb-r{display:flex;flex-direction:column;align-items:flex-end;font-size:calc(var(--u)*30)}.lb-r span:first-child{color:#c77a00}.lb-r span+span{color:#f26a1b}.lb-r small{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}
.lc-h small{display:block;font-size:calc(var(--u)*30);font-weight:600}.lc-h b{display:block;font-size:calc(var(--u)*68);color:#f26a1b}.lc-h>span{font-size:calc(var(--u)*38);color:#3b2314;max-width:58%;text-align:right}
.lc-bar{height:calc(var(--u)*20);border-radius:99px;background:#e2cdaa;margin:calc(var(--u)*8) 0}.lc-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(#ff9a3c,#f97316)}
.lg-row,.lg-card,.lg-banner{flex:none}
.fr-empty img{width:calc(var(--u)*150);height:calc(var(--u)*150)}.fr-empty b{font-size:calc(var(--u)*36);margin-top:calc(var(--u)*16)}.fr-empty span{font-size:calc(var(--u)*32);color:#7a5a40;line-height:1.25}#fr-sharet{display:inline-flex;align-items:center;gap:calc(var(--u)*10)}#fr-sharet svg{width:calc(var(--u)*34);height:calc(var(--u)*34)}

/* ---- Duels (DuelListScreen / CreateDuelScreen) ---- */
#duels .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
#du-title{position:absolute;left:9%;top:calc(var(--u)*46);width:82%;display:block}
#du-back{padding:0;position:absolute}#du-back img{width:100%;height:100%}
#du-scroll{position:absolute;left:0;right:0;top:calc(var(--u)*370);bottom:0;overflow-y:auto;padding:calc(var(--u)*16) calc(var(--u)*32) calc(var(--u)*80);display:flex;flex-direction:column;gap:calc(var(--u)*34)}
#du-scroll::-webkit-scrollbar{display:none}
.du-card{position:relative;flex:none;container-type:inline-size;color:#3b2314}
.du-bgp{position:absolute;inset:0;border-style:solid;border-width:17.44cqw 12.79cqw 10.47cqw;border-image:url(img/du_card_a.webp) 150 110 90 110 fill/17.44cqw 12.79cqw 10.47cqw stretch;pointer-events:none}
.du-card.b .du-bgp{border-image-source:url(img/du_card_b.webp)}.du-card.c .du-bgp{border-image-source:url(img/du_card_c.webp)}
.du-ct{position:absolute;left:10.5cqw;top:2.3cqw;width:51cqw;height:9cqw;display:flex;align-items:center;justify-content:center;color:#fff;font-size:5.3cqw;-webkit-text-stroke:.9cqw #5a2815;paint-order:stroke fill;white-space:nowrap}
.du-cb{position:relative;min-height:50.5cqw;padding:17.44cqw 8.14cqw 10.47cqw;display:flex;flex-direction:column;gap:calc(var(--u)*18);align-items:stretch;box-sizing:border-box}
.du-card.b .du-cb{min-height:51.2cqw}.du-card.c .du-cb{min-height:50.1cqw}
.du-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:calc(var(--u)*10);color:#7a5a40;font-weight:600;font-size:calc(var(--u)*30);padding:calc(var(--u)*10) 0}.du-empty img{width:calc(var(--u)*180);height:calc(var(--u)*180)}
.du-row{display:flex;align-items:center;gap:calc(var(--u)*20)}.du-row>img{width:calc(var(--u)*100);height:calc(var(--u)*100)}.du-row>img.x{width:calc(var(--u)*72);height:calc(var(--u)*72)}
.du-nm{flex:1;min-width:0;display:flex;flex-direction:column}.du-nm b{font-size:calc(var(--u)*38);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.du-nm small{font-size:calc(var(--u)*30);font-weight:600;color:#7a5a40}
.du-pill{height:calc(var(--u)*84);background-size:100% 100%;background-repeat:no-repeat;color:#fff;font-size:calc(var(--u)*32);padding:0 calc(var(--u)*24);display:flex;align-items:center;justify-content:center}
.du-pill.o{background-image:url(img/du_pill_orange.webp)}.du-pill.b{background-image:url(img/du_pill_blue.webp)}.du-pill.g{background-image:url(img/du_pill_green.webp)}.du-pill.w{width:calc(var(--u)*190)}
.du-pill span{-webkit-text-stroke:calc(var(--u)*5) #5a2815;paint-order:stroke fill;white-space:nowrap}
.du-req{display:flex;flex-direction:column;gap:calc(var(--u)*14)}.du-two{display:flex;gap:calc(var(--u)*20)}.du-two .du-pill{flex:1}
.du-rec{cursor:pointer}.du-vh{display:flex;align-items:center;gap:calc(var(--u)*16)}.du-vh b{flex:1;font-size:calc(var(--u)*44);color:#7a5a40}.du-vh b.win{color:#1e8a3a}.du-vh b.loss{color:#c0392b}.du-vh .x{width:calc(var(--u)*70);height:calc(var(--u)*70)}.du-vh .dot{width:calc(var(--u)*20);height:calc(var(--u)*20);border-radius:50%;background:#c0392b}
.du-vr{display:flex;align-items:center;justify-content:space-between;margin-top:calc(var(--u)*8)}.du-vr>img{width:calc(var(--u)*114);height:calc(var(--u)*114)}
.du-sc{flex:1;min-width:0;text-align:center;display:flex;flex-direction:column}.du-sc span{font-size:calc(var(--u)*32);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.du-sc b{font-size:calc(var(--u)*58)}.du-sc b.win{color:#1e8a3a}.du-sc small{font-size:calc(var(--u)*26);font-weight:600;color:#7a5a40}
.du-dlg p{margin:calc(var(--u)*8) 0;font-size:calc(var(--u)*36);text-align:center;color:#5a3a20;font-weight:600}
#fr-duel{display:flex;flex-direction:column;align-items:center}#fr-duelt{position:absolute;left:50%;top:100%;transform:translateX(-50%);white-space:nowrap;color:#fff;font-size:calc(var(--u)*32);text-shadow:0 2px 4px #000c}
.dn-hero{text-align:center;display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*10)}.dn-hero b{font-size:calc(var(--u)*46)}.dn-hero p{margin:0;font-size:calc(var(--u)*32);color:#7a5a40;font-weight:600}.dn-ic{font-size:calc(var(--u)*90)}
.dn-q{text-align:center;font-size:calc(var(--u)*40);margin:calc(var(--u)*34) 0 calc(var(--u)*16)}.dn-c{display:flex;gap:calc(var(--u)*12)}.dn-c button{flex:1;height:calc(var(--u)*110);border-radius:calc(var(--u)*30);background:#fff6e2;border:calc(var(--u)*5) solid #e0b878;font-size:calc(var(--u)*44);color:#3b2314}.dn-c button.on{background:linear-gradient(#ff9a3c,#f26a1b);border-color:#b04a0e;color:#fff}
.rs-note{background:#fff6e2;border:calc(var(--u)*4) solid #e0b878;border-radius:calc(var(--u)*30);padding:calc(var(--u)*24);text-align:center;font-size:calc(var(--u)*34);color:#3b2314}

/* ---- level map (LevelMapScreen.kt) ---- */
#lm-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden}#lm-scroll::-webkit-scrollbar{display:none}
#lm-map{position:relative;width:100%;overflow:hidden}#lm-bg{position:absolute;top:0;display:block;max-width:none}
#lm-fog{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
#lm-nodes{position:absolute;inset:0;pointer-events:none}
#lm-ring{position:absolute;border:calc(var(--u)*10) solid #ffe066;border-radius:50%;pointer-events:none;animation:rgp .9s ease-in-out infinite alternate;transition:left .65s cubic-bezier(.4,0,.2,1),top .65s cubic-bezier(.4,0,.2,1)}
@keyframes rgp{from{transform:scale(.9)}to{transform:scale(1.08)}}
.lm-node{pointer-events:auto;position:absolute;display:flex;align-items:center;justify-content:center;padding:0}
.lm-node .coin{position:relative;width:calc(var(--u)*119);height:calc(var(--u)*119);margin-top:calc(var(--u)*25);border-radius:50%;background:linear-gradient(#ffb347,#e9801d);border:calc(var(--u)*6) solid #7a4313;box-shadow:0 calc(var(--u)*8) calc(var(--u)*8) #0006;display:flex;align-items:center;justify-content:center;transition:transform .35s cubic-bezier(.3,1.6,.5,1);box-sizing:border-box}
.lm-node.open .coin{transform:scale(1.14)}
.lm-node .coin b{color:#fff;font-size:calc(var(--u)*53);font-weight:800;text-shadow:0 calc(var(--u)*6) calc(var(--u)*6) #5a300c}
.lm-node.next .coin{background:linear-gradient(#52b3ff,#1f73d3)}
.lm-node.lock .coin{background:linear-gradient(#6c7686,#3a4250);border-color:#aeb9ca}.lm-node.lock .coin svg{width:calc(var(--u)*62);height:calc(var(--u)*62)}
.lm-node .plate{position:absolute;bottom:calc(var(--u)*2);left:50%;transform:translateX(-50%);text-decoration:none;color:#eaf0f7;font-size:calc(var(--u)*25);font-weight:800;padding:0 calc(var(--u)*14);border-radius:calc(var(--u)*16);background:linear-gradient(#4a5362,#2b323d);border:calc(var(--u)*3) solid #9aa6b8}
.lm-node .stars{position:absolute;top:calc(var(--u)*-8);left:0;right:0;display:flex;justify-content:center;font-style:normal;gap:calc(var(--u)*2)}
.lm-node .stars s{text-decoration:none;color:#7a4313;line-height:1}.lm-node .stars s.on{color:#ffd43b}
.lm-node .glow{position:absolute;inset:calc(var(--u)*-10);border-radius:50%;background:radial-gradient(circle,#ffe9a8aa 0,#ffd34a55 45%,transparent 70%);animation:gl 3.2s ease-in-out infinite alternate}@keyframes gl{from{opacity:.45;transform:scale(.9)}to{opacity:1;transform:scale(1.15)}}
#lm-world{position:absolute;display:flex;align-items:center;gap:calc(var(--u)*16);background:#fff;border-radius:calc(var(--u)*37);padding:calc(var(--u)*16) calc(var(--u)*29);box-shadow:0 calc(var(--u)*8) 0 #0003}
#lm-world span{font-size:calc(var(--u)*50)}#lm-world b{display:block;font-size:calc(var(--u)*40);line-height:1.15;color:#2b2b2b}#lm-world small{font-size:calc(var(--u)*30);font-weight:600;color:#6b6b6b}
#lm-panel{position:absolute;background:url(img/level_panel.webp) 0 0/100% 100%;color:#4a2a10;display:flex;align-items:center;gap:calc(var(--u)*24);padding:calc(var(--u)*25) calc(var(--u)*37) calc(var(--u)*25) calc(var(--u)*41);box-sizing:border-box}
#lm-panel.hidden{display:none}
.lp-ic{width:calc(var(--u)*144);height:calc(var(--u)*144);border-radius:calc(var(--u)*29);border:calc(var(--u)*4) solid #9c5a1b;object-fit:cover;flex:none}
.lp-t{flex:1;min-width:0;display:flex;flex-direction:column}.lp-t b{font-size:calc(var(--u)*41);font-weight:800;line-height:1.15}.lp-t em{font-style:normal;font-size:calc(var(--u)*25);font-weight:600;color:#5a321f;line-height:1.25}
.lp-t i{font-style:normal;display:flex;gap:calc(var(--u)*4);margin-top:calc(var(--u)*8)}.lp-t s{text-decoration:none;font-size:calc(var(--u)*45);color:#8a6a4a;line-height:1}.lp-t s.on{color:#ffc107}
.lp-play{flex:none;width:calc(var(--u)*230);height:calc(var(--u)*111);border-radius:calc(var(--u)*37);background:linear-gradient(#7be042,#2fa524);border:calc(var(--u)*6) solid #1f7a1a;box-shadow:0 calc(var(--u)*6) calc(var(--u)*6) #0004;color:#fff;font-size:calc(var(--u)*45);font-weight:800;-webkit-text-stroke:calc(var(--u)*7) #14540f;paint-order:stroke fill}
.lp-play.cd{font-size:calc(var(--u)*62)}
#ak-strip b{display:block;font-size:calc(var(--u)*34)}#ak-strip small{display:block;font-size:calc(var(--u)*28);font-weight:600;opacity:.75}

#se-code{text-transform:none;padding-left:calc(var(--u)*72);background:#fffaf0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23c98a2b' d='M22 10V6a2 2 0 00-2-2H4a2 2 0 00-2 2v4a2 2 0 010 4v4a2 2 0 002 2h16a2 2 0 002-2v-4a2 2 0 010-4z'/%3E%3C/svg%3E") calc(var(--u)*20) 50%/calc(var(--u)*34) no-repeat;font-weight:700;color:#7a5a40}
#se-code::placeholder{color:#a8977f}
#se-use.dis{filter:grayscale(1) brightness(1.25);opacity:.7}
#se-how{display:flex;align-items:center;gap:calc(var(--u)*10);justify-content:center;text-decoration:none;text-align:left;background:#fff6dd;border:calc(var(--u)*4) solid #e9a21c;border-radius:99px;color:#3b2314;font-size:calc(var(--u)*20);font-weight:800;line-height:1.1;padding:0 calc(var(--u)*10)}
#se-how i{flex:none;width:calc(var(--u)*34);height:calc(var(--u)*34);border-radius:50%;background:#3b2314;color:#fff;font-style:normal;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*24)}
#on-text{display:flex;flex-direction:column;justify-content:space-around;align-items:center;text-align:center;font-size:calc(var(--u)*43);font-weight:600;color:#4a2814;line-height:1.14}#on-text span,#on-text b{display:block;white-space:nowrap;font-weight:600;font-size:1em}#on-title{font-size:calc(var(--u)*70)}

.oj-l{color:#5a321f;font-size:calc(var(--u)*35);font-weight:800;display:flex;align-items:center}
#oj-nick,#oj-code{font-size:calc(var(--u)*41);font-weight:800;color:#5a321f;padding:0 calc(var(--u)*45)}#oj-code::placeholder{color:#5a321f61;font-weight:700;font-size:calc(var(--u)*39)}
#oj-title{font-size:calc(var(--u)*46)}

.paper9{position:absolute;border-style:solid;border-width:calc(var(--u)*324) calc(var(--u)*156);border-image:url(img/offline_paper.webp) 520 250 fill/calc(var(--u)*324) calc(var(--u)*156) stretch;box-sizing:border-box;pointer-events:none}
#os-body{gap:calc(var(--u)*16)}#oc-body{gap:calc(var(--u)*16)}
.os-l{padding-bottom:calc(var(--u)*6)}

/* ---- waiting room (WaitingRoomScreen.kt) ---- */
#ow-col{position:absolute;display:flex;flex-direction:column}
#ow-main{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*8);scrollbar-width:none;padding-bottom:calc(var(--u)*34)}#ow-main::-webkit-scrollbar{display:none}
#ow-bottom{flex:none;display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*8)}
#ow-dock{width:100%}#ow-dock .cd-dock{left:0;top:0;width:100%}
#ow-hints{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*8)}
.ow-hint{background:#3b1e08cc;color:#fff1d6;border-radius:calc(var(--u)*29);padding:calc(var(--u)*12) calc(var(--u)*25);font-size:calc(var(--u)*29);font-weight:700;text-align:center}
#ow-wait{display:flex;flex:none;align-items:center;gap:calc(var(--u)*16);background:#3b1e08cc;border-radius:calc(var(--u)*33);padding:calc(var(--u)*4) calc(var(--u)*29);color:#fff1d6;font-size:calc(var(--u)*29);font-weight:700;white-space:nowrap;z-index:3}#ow-wait img{height:calc(var(--u)*41)}
.ow-rb{position:relative;width:100%;height:calc(var(--u)*115);flex:none;isolation:isolate;color:#fff;font-size:calc(var(--u)*49);-webkit-text-stroke:calc(var(--u)*8) #8a3a00;paint-order:stroke fill;transition:transform .12s}
.ow-rb::before{content:"";position:absolute;inset:0;z-index:-1;border-style:solid;border-width:calc(var(--u)*55);border-image:url(img/lobby_btn.webp) 86 fill/calc(var(--u)*55) stretch}
.ow-rb.g::before{border-image-source:url(img/lobby_btn_green.webp)}.ow-rb.g{-webkit-text-stroke-color:#1b6b12}
.ow-rb:active{transform:scale(.94)}.ow-rb.blink::before{animation:owb 2.6s ease-in-out infinite alternate}@keyframes owb{to{opacity:.88}}
.ow-rb.g{filter:drop-shadow(0 0 calc(var(--u)*14) #3dd13a66)}.ow-rb.cd{filter:drop-shadow(0 0 calc(var(--u)*24) #3dd13aaa)}
/* code card */
.ow-cp{position:relative;flex:none;width:calc(var(--u)*637.6);aspect-ratio:753/388;background:url(img/lobby_codepanel.webp) 0 0/100% 100%;container-type:inline-size;color:#5a321f}
.ow-cp .h{position:absolute;left:0;right:0;top:10%;text-align:center;font-size:4.9cqw;font-weight:600;white-space:nowrap}
.ow-cp .n{position:absolute;left:17.5%;top:25.8%;width:67.5%;height:25.8%;display:flex;align-items:center;justify-content:center;font-size:9.6cqw;font-weight:800;letter-spacing:2.6cqw;padding-left:2.6cqw;box-sizing:border-box}
.ow-cp .b{position:absolute;left:20%;top:58.5%;width:62%;height:27%;display:flex;align-items:center;justify-content:center;cursor:pointer}
.ow-cp .b span{color:#fff;font-size:6.5cqw;-webkit-text-stroke:1.3cqw #8a3a00;paint-order:stroke fill}
.ow-note{background:#fff6e2;border:calc(var(--u)*4) solid #e0b878;border-radius:calc(var(--u)*40);padding:calc(var(--u)*24);width:100%;box-sizing:border-box;text-align:center;font-size:calc(var(--u)*30);color:#3b2314}
/* occupancy */
.ow-head{width:100%;display:flex;justify-content:space-between;align-items:center;flex:none}
.ow-head .band{height:calc(var(--u)*78);aspect-ratio:720/233;background:url(img/lobby_band.webp) 0 0/100% 100%;display:flex;align-items:center;justify-content:center}
.ow-head .band span{color:#fff;font-size:calc(var(--u)*35);-webkit-text-stroke:calc(var(--u)*7) #5a2815;paint-order:stroke fill}
.ow-head .owp,.ow-col .owp.t{height:calc(var(--u)*70);aspect-ratio:568/173;background:url(img/lobby_pill.webp) 0 0/100% 100%;display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*8);color:#5a321f;font-size:calc(var(--u)*29);font-weight:800;white-space:nowrap}
.ow-head .owp svg{width:calc(var(--u)*37);height:calc(var(--u)*37)}
/* seats */
.ow-grid{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*8) calc(var(--u)*20.5)}
.ow-teams{width:100%;display:flex;gap:calc(var(--u)*20.5)}.ow-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:calc(var(--u)*20.5);align-items:stretch}.ow-col .owp.t{align-self:center;height:calc(var(--u)*74)}
.ow-card,.ow-slot{position:relative;min-height:calc(var(--u)*111);box-sizing:border-box;isolation:isolate;display:flex;align-items:center;min-width:0}
.ow-card::before,.ow-slot::before{content:"";position:absolute;inset:0;z-index:-1;border-style:solid;border-width:calc(var(--u)*45);border-image:url(img/lobby_card.webp) 90 fill/calc(var(--u)*45) stretch}
.ow-slot::before{border-width:calc(var(--u)*43);border-image:url(img/lobby_slot.webp) 90 fill/calc(var(--u)*43) stretch}
.ow-card.rdy::before{filter:url(#lobby-ready)}
.ow-card{padding:calc(var(--u)*6) calc(var(--u)*16);gap:calc(var(--u)*12)}
.ow-av{width:calc(var(--u)*78);height:calc(var(--u)*78);flex:none}
.ow-tx{flex:1;min-width:0;transform:translateY(calc(var(--u)*-6));color:#3b2314}
.ow-n{display:flex;align-items:center;gap:calc(var(--u)*6);font-size:calc(var(--u)*29);font-weight:800;line-height:calc(var(--u)*33)}.ow-n span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ow-n img{width:calc(var(--u)*33);height:calc(var(--u)*33);flex:none}
.ow-rk{position:relative;height:calc(var(--u)*29);font-size:calc(var(--u)*23);line-height:calc(var(--u)*29);font-weight:700;color:#7a5a40}
.ow-rk i{position:absolute;left:0;font-style:normal;white-space:nowrap;animation:owr 10s infinite}.ow-rk i+i{animation-delay:5s}
@keyframes owr{0%{opacity:0}6%,44%{opacity:1}50%,100%{opacity:0}}
.ow-s{height:calc(var(--u)*35);font-size:calc(var(--u)*23);line-height:calc(var(--u)*33);font-weight:700;color:#d26a12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ow-ico{position:absolute;top:calc(var(--u)*4);right:calc(var(--u)*4);width:calc(var(--u)*53);height:calc(var(--u)*53);font-size:calc(var(--u)*32);display:flex;align-items:center;justify-content:center;padding:0;background:none;border:0}
.ow-slot{justify-content:center;gap:calc(var(--u)*12);padding:calc(var(--u)*8) calc(var(--u)*16);cursor:pointer}.ow-slot img{width:calc(var(--u)*53);height:calc(var(--u)*53)}
.ow-slot span{font-size:calc(var(--u)*25);font-weight:800;color:#5a321f;line-height:1.1;text-align:left}
.ow-sec{color:#fff;font-size:calc(var(--u)*34);margin-top:calc(var(--u)*6);-webkit-text-stroke:calc(var(--u)*5) #7a2a08;paint-order:stroke fill}
.ow-kk{display:flex;align-items:center;justify-content:space-between;width:100%;background:#fff6e2;border-radius:calc(var(--u)*30);padding:calc(var(--u)*10) calc(var(--u)*24);font-size:calc(var(--u)*30);color:#3b2314}
#ow-title{font-size:calc(var(--u)*70)}
.cd-wrap1{position:relative;display:flex;flex-direction:column;gap:calc(var(--u)*8)}.cd-wrap1>.cd-dock{position:relative;width:100%}
#ow-dock{position:relative;width:100%;aspect-ratio:720/374;flex:none}
.ow-rk i{opacity:0;animation-fill-mode:both}
/* store frame cards (StoreScreen.kt): the bare ring, no face; taller card */
.fcard{aspect-ratio:397/342;padding:7% 6% 5%;gap:calc(var(--u)*10)}
.fcard .frm{width:50%}.fcard .frm>img:first-child{display:none}
.fcard .nm{font-size:calc(var(--u)*30);font-weight:800}
.fcard .btn{width:84%;height:calc(var(--u)*68);font-size:calc(var(--u)*32)}
.lock .wl-tag{background:#1a1a1ad9;border-radius:50%;width:calc(var(--u)*80);height:calc(var(--u)*80);padding:0;display:flex;align-items:center;justify-content:center;right:calc(var(--u)*60);bottom:calc(var(--u)*40)}.lock .wl-tag svg{width:calc(var(--u)*46);height:calc(var(--u)*46)}
.rl-body p{margin:0 0 calc(var(--u)*20);font-size:calc(var(--u)*30);color:#7a5a40;font-weight:600}
.rl-row{display:flex;align-items:center;gap:calc(var(--u)*24);background:#fff6e2;border:calc(var(--u)*4) solid #e0b878;border-radius:calc(var(--u)*37);padding:calc(var(--u)*20) calc(var(--u)*28);margin-bottom:calc(var(--u)*16);color:#3b2314}
.rl-row.cur{background:#ffe3b0;border-color:#f26a1b}.rl-row.dim{opacity:.55}
.rl-row .e{font-size:calc(var(--u)*60)}.rl-row div{flex:1;min-width:0}.rl-row b{display:block;font-size:calc(var(--u)*38)}.rl-row small{font-size:calc(var(--u)*28);color:#7a5a40;font-weight:600}.rl-row em{font-style:normal;font-size:calc(var(--u)*28);font-weight:700;color:#7a5a40}

#s-paper{padding:0}#s-paper canvas{width:100%;height:100%;display:block}
#s-text{flex-direction:column;overflow:visible;line-height:calc(var(--u)*96);font-size:calc(var(--u)*72)}#s-text span{display:block;white-space:nowrap}
#s-dots i{font-style:normal;opacity:.18}
#s-sub{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*4);background:linear-gradient(#fff8e8,#fce9c8);border:calc(var(--u)*4) solid #e9a23b;border-radius:99px;box-shadow:0 calc(var(--u)*6) calc(var(--u)*12) #0004;padding:calc(var(--u)*10) calc(var(--u)*34);box-sizing:border-box;color:#3b2314}
#s-sub b{font-size:calc(var(--u)*26);font-weight:700;text-align:center;line-height:1.15}#s-sub small{font-size:calc(var(--u)*20);font-weight:600;color:#b5531a;text-align:center}
#s-text #s-dots{display:inline}#s-text{transform:translateY(calc(var(--u)*-14))}
.mc-av{overflow:visible}.mc-lv{position:absolute;right:-4%;bottom:-6%;width:34%;aspect-ratio:1;border-radius:50%;background:#3b2314;border:calc(var(--u)*5) solid #fff;color:#fff;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*40);font-weight:800;box-sizing:border-box}

/* avatar frame picker (AvatarFramePickerSheet) */
.fp-h{font-size:calc(var(--u)*40);font-weight:800;color:#3b2314;margin:calc(var(--u)*24) 0 calc(var(--u)*16)}
.fp-src{display:flex;gap:calc(var(--u)*30)}.fp-src button{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*10);width:calc(var(--u)*260);color:#3b2314;font-size:calc(var(--u)*30)}
.fp-src .av{width:calc(var(--u)*160);height:calc(var(--u)*160);border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#e9801d}.fp-src .av img{width:100%;height:100%;object-fit:cover}.fp-src .av.g{background:#2f6b18;color:#fff;font-size:calc(var(--u)*80);font-weight:700}.fp-src .dim b{font-weight:500}
.fp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--u)*30)}
.fp-card{position:relative;aspect-ratio:1/0.89;background:#fff;border-radius:calc(var(--u)*50);border:calc(var(--u)*6) solid transparent;display:flex;align-items:center;justify-content:center;padding:0}
.fp-card.on{border-color:#f26a1b}.fp-ring{position:relative;width:60%;aspect-ratio:1}.fp-card.lock .fp-ring{opacity:.45}
.fp-lk{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*4);color:#2b2b2b;font-weight:800;font-size:calc(var(--u)*30)}.fp-lk svg{width:calc(var(--u)*50);height:calc(var(--u)*50)}.fp-lk span{-webkit-text-stroke:calc(var(--u)*6) #fffc;paint-order:stroke fill}
/* home: the small pencil badges that say "tap to change" (MainMenuScreen) */
#h-avatar::after{content:"";position:absolute;left:-2%;top:-6%;width:30%;height:30%;border-radius:50%;background:#f4811f url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04a1 1 0 000-1.41l-2.34-2.34a1 1 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z'/%3E%3C/svg%3E") center/58% no-repeat;border:calc(var(--u)*5) solid #fff;box-sizing:border-box;box-shadow:0 2px 4px #0005}
#h-pen{position:absolute;padding-left:calc(var(--u)*50)!important}
#h-pen::before{content:"";position:absolute;left:calc(var(--u)*10);top:50%;width:calc(var(--u)*50);height:calc(var(--u)*50);transform:translateY(-50%);border-radius:50%;background:#7a4313 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ffe9c2' d='M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04a1 1 0 000-1.41l-2.34-2.34a1 1 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z'/%3E%3C/svg%3E") center/62% no-repeat}
#fr-hint{font-size:calc(var(--u)*26);padding:0 calc(var(--u)*50)}
#fr-input::placeholder{letter-spacing:0;color:#9c8f82;font-weight:600}
.ow-head .owp span,.ow-col .owp.t span{color:#5a321f;font-size:calc(var(--u)*29);-webkit-text-stroke:0;text-shadow:none;font-weight:800}
.ow-card.rdy{filter:none}
/* painted exit window (PaintedExitDialog) */
.ex-ov{position:absolute;inset:0;z-index:60;background:#000a;display:flex;align-items:center;justify-content:center;padding:0 calc(var(--u)*16)}
.ex-card{position:relative;width:100%;max-width:calc(var(--u)*820);animation:awin .22s ease-out}.ex-card>img{width:100%;height:100%;display:block}
.ex-card>div{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center}
.ex-t span,.ex-m span{display:block;font-weight:800;color:#3a2416}.ex-m span{font-weight:600;color:#7a4a24;line-height:1.12}.ex-t span{line-height:1.05}
.ex-card>div{overflow:hidden}.ex-b{cursor:pointer}.ex-b span{font-weight:800;color:#3a2416;white-space:nowrap}
.ex-b.r span{color:#fff;-webkit-text-stroke:calc(var(--u)*7) #7a0e0e;paint-order:stroke fill}.ex-b:active{transform:scale(.94)}
.ex-t span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ao-body{text-align:center}.ao-ic{font-size:calc(var(--u)*150)}.ao-body p{margin:calc(var(--u)*10) 0 0;font-size:calc(var(--u)*36);color:#5a3a20;font-weight:600;line-height:1.25}
#h-veil-gold,#h-veil-chest{cursor:pointer}
.rs-btns.one{justify-content:center}.rs-btns.one .rs-art{width:100%}
/* empty chest slot: the painted "+" circle sits in the upper half, the words go below it */
.ch-slot:not(.filled){justify-content:flex-end;padding-bottom:calc(var(--u)*10);box-sizing:border-box}
.ch-slot:not(.filled) .ch-e{display:block;line-height:1.05;font-size:calc(var(--u)*23)}
.pp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--u)*20)}
.pp-card{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*8);padding:calc(var(--u)*24) calc(var(--u)*10);border-radius:calc(var(--u)*32);background:#fff;border:calc(var(--u)*3) solid #d9c9b0;color:#3b2314}
.pp-card.on{border:calc(var(--u)*6) solid #ff7a21}.pp-card svg{width:100%;height:calc(var(--u)*70)}.pp-card.lock svg{opacity:.35}
.pp-card b{font-size:calc(var(--u)*30);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.pp-card small{font-size:calc(var(--u)*23);color:#7a5a40}
.lb-m canvas{display:block;width:100%;height:calc(var(--u)*62);margin-top:calc(var(--u)*6)}

/* break between drawing and guessing (BreakScreen.kt) */
.bk-t{color:#fff;font-size:calc(var(--u)*52);font-weight:800;display:flex;align-items:center;justify-content:center;white-space:nowrap;-webkit-text-stroke:calc(var(--u)*7) #5a2815;paint-order:stroke fill;text-shadow:0 calc(var(--u)*4) 0 #5a2815}
#bk-sub{display:flex;align-items:center;justify-content:center;text-align:center;color:#3b2314;font-size:calc(var(--u)*29);font-weight:700;line-height:1.1}
#bk-dial{position:absolute}#bk-dial svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#bk-dial .trk{fill:none;stroke:#f6d9a6;stroke-width:26}#bk-dial .arc{fill:none;stroke:#f58a24;stroke-width:26;stroke-linecap:round;stroke-dasharray:1169;stroke-dashoffset:0}
#bk-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--u)*210);color:#ffb21e;-webkit-text-stroke:calc(var(--u)*14) #4a2410;paint-order:stroke fill}
#bk-num.pop{animation:bkpop .45s cubic-bezier(.3,1.6,.5,1)}@keyframes bkpop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
#bk-dial .rip{position:absolute;left:50%;top:50%;width:calc(var(--u)*464);height:calc(var(--u)*464);margin:calc(var(--u)*-232) 0 0 calc(var(--u)*-232);border-radius:50%;border:calc(var(--u)*7) solid #ffe08a;animation:bkrip 1.4s ease-out infinite}@keyframes bkrip{from{transform:scale(1);opacity:.6}to{transform:scale(1.27);opacity:0}}
#bk-dial .glow{position:absolute;left:50%;top:50%;width:calc(var(--u)*320);height:calc(var(--u)*320);margin:calc(var(--u)*-160) 0 0 calc(var(--u)*-160);border-radius:50%;background:radial-gradient(circle,#fff4c2bf,transparent 70%);animation:bkglow 1.8s ease-in-out infinite alternate}@keyframes bkglow{from{opacity:.55}to{opacity:1}}
/* screens fade in (GameScreen's phase change) */
.screen.on{animation:scrin .28s ease-out}@keyframes scrin{from{opacity:0}to{opacity:1}}
/* answer feedback over the drawing (GuessFeedbackOverlay) */
#g-fb{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:3}
#g-fb .card{background:#fffaf0eb;border-radius:calc(var(--u)*40);padding:calc(var(--u)*28) calc(var(--u)*40);display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*10);animation:fbin .35s cubic-bezier(.3,1.5,.5,1),var(--shake,none);box-shadow:0 calc(var(--u)*8) calc(var(--u)*24) #0004}
#g-fb .ic{width:calc(var(--u)*130);height:calc(var(--u)*130);border-radius:50%;display:flex;align-items:center;justify-content:center}#g-fb .ic svg{width:60%;height:60%}
#g-fb .ok .ic{background:#d6f5df}#g-fb .no .ic{background:#fbdcd8}
#g-fb .xp{font-size:calc(var(--u)*42);font-weight:800;color:#c77a00}#g-fb .ans{font-size:calc(var(--u)*42);font-weight:700;color:#5a3a20;text-align:center}
#g-fb .no .card{animation:fbin .35s cubic-bezier(.3,1.5,.5,1),shk .4s}
@keyframes fbin{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}@keyframes shk{0%{translate:0}12%{translate:-16px}25%{translate:16px}37%{translate:-12px}50%{translate:12px}62%{translate:-6px}75%{translate:6px}100%{translate:0}}
#guess.fb button,#guess.fb input{pointer-events:none}

/* browser account form (account.js) */
#ak-form{display:flex;flex-direction:column;gap:calc(var(--u)*18)}
.ak-in{height:calc(var(--u)*96);border-radius:99px;border:calc(var(--u)*5) solid #d9a566;background:#fffaf0;font:inherit;font-size:calc(var(--u)*38);font-weight:700;color:#3b2314;padding:0 calc(var(--u)*40);outline:0;user-select:text;-webkit-user-select:text}
.ak-in::placeholder{color:#a8977f;font-weight:600}.ak-in:focus{border-color:#f26a1b}
.ak-btns{display:flex;gap:calc(var(--u)*18)}.ak-btns .pill{flex:1;height:calc(var(--u)*104);position:relative}.ak-btns .pill span{font-size:calc(var(--u)*38);white-space:nowrap}
/* the word plate drops in with a little spring on every new word (springIn fromY=-26) */
#d-word{animation:wdrop .45s cubic-bezier(.3,1.5,.5,1)}@keyframes wdrop{from{transform:translateY(calc(var(--u)*-52));opacity:0}to{transform:none;opacity:1}}
.lg-hint{flex-direction:row!important;align-items:center;text-align:left!important;gap:calc(var(--u)*30)}.lg-hint img{width:calc(var(--u)*120);height:calc(var(--u)*120);flex:none}.lh-t{display:flex;flex-direction:column;gap:calc(var(--u)*10);font-size:calc(var(--u)*34);font-weight:600;color:#3b2314}.lh-t b{color:#f26a1b;font-size:calc(var(--u)*34)}
.lh-t{font-size:calc(var(--u)*30)!important}.lg-hint img{width:calc(var(--u)*100);height:calc(var(--u)*100)}
/* RankLevelLabel: level and rank take turns every 5 s */
.lg-nm small.rl{display:inline-grid;vertical-align:baseline}.lg-nm small.rl i{grid-area:1/1;font-style:normal;opacity:0;animation:owr 10s infinite}.lg-nm small.rl i+i{animation-delay:5s}