/* ============================================================
   СИЗЫЙ БОМБЕР — стили. Тема: объявления на двери подъезда
   ============================================================ */
@font-face{font-family:"DVC";src:url(../fonts/dvc-bold.woff) format("woff");font-weight:700;font-display:swap}
@font-face{font-family:"DVC";src:url(../fonts/dvc.woff) format("woff");font-weight:400;font-display:swap}
:root{--ink:#24212e;--paper:#f4eedc;--tape:rgba(255,232,140,.82);--mint:#35c489;--violet:#8a55d8;--vest:#ff7a1a;--pink:#ff5c8a;--sky:#4ea9e6;--red:#d8342c;
  --ff:"DVC",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:var(--ff);color:var(--ink);user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button{font-family:inherit;color:inherit;border:0;background:none;padding:0;margin:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
#pcbg{position:fixed;inset:0;background:radial-gradient(circle at 50% 30%,#2c4a6e,#141a28 70%)}
#app{position:fixed;top:0;left:0;transform-origin:0 0;overflow:hidden;background:#7fc4ee}
#cv{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
#ui{position:absolute;left:0;top:0;transform-origin:0 0;overflow:hidden}
#touch{position:absolute;inset:0;touch-action:none;pointer-events:none}

/* ---------------- HUD ---------------- */
#hud{position:absolute;inset:0;pointer-events:none;display:none}
#hud.on{display:block}
#hud.hit{animation:hit .5s}
@keyframes hit{0%{box-shadow:inset 0 0 0 200px rgba(255,40,30,.4)}100%{box-shadow:inset 0 0 0 0 rgba(255,40,30,0)}}
#hTop{position:absolute;left:8px;right:8px;top:8px;display:flex;align-items:flex-start;gap:8px}
#hScoreBox{background:url(../img/paper.png);border-radius:4px;padding:4px 10px 5px;min-width:86px;box-shadow:0 3px 0 rgba(0,0,0,.35);rotate:-2deg}
#hScoreBox span{display:block;font-size:10px;font-weight:400;opacity:.7;line-height:1}
#hScoreBox b{display:block;font-size:24px;line-height:1.05}
#hScoreBox em{display:flex;align-items:center;gap:3px;font-style:normal;font-size:12px;font-weight:700}
#hScoreBox em img{width:14px;height:14px}
#hScoreBox em i{font-style:normal}
#hMid{flex:1;padding-top:6px;min-width:0}
#hProg{position:relative;height:10px;border-radius:6px;background:rgba(20,24,36,.6);box-shadow:0 0 0 2px rgba(255,255,255,.75)}
#hProgFill{height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,var(--mint),var(--violet))}
#hProgBird{position:absolute;top:-6px;left:0;width:22px;height:22px;margin-left:-11px;background:url(../img/ic_feather.png) center/contain no-repeat;filter:drop-shadow(0 1px 0 rgba(0,0,0,.5))}
#hQuest{margin-top:9px;font-size:11.5px;line-height:1.2;color:#fff;text-align:center;text-shadow:0 1px 0 #000,0 0 6px rgba(0,0,0,.8);max-height:28px;overflow:hidden}
#hQuest.done{color:#b6ff9c}
#btnPause{pointer-events:auto;width:42px;height:42px;border-radius:50%;background:rgba(24,26,38,.78);box-shadow:0 0 0 2px rgba(255,255,255,.8),0 3px 0 rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center}
#btnPause:active{scale:.92}
#hLives{position:absolute;left:8px;top:74px;display:flex;gap:1px}
#hLives img{width:24px;height:24px;filter:drop-shadow(0 2px 0 rgba(0,0,0,.4))}
#hLives img.off{filter:grayscale(1) brightness(.35);opacity:.6}
#hLives img.sh{margin-left:4px}
#hCombo{position:absolute;right:10px;top:60px;width:58px;height:58px;border-radius:50%;display:none;align-items:center;justify-content:center;font-size:26px;color:#fff;
  background:radial-gradient(circle at 35% 30%,#ffb648,#ff5a1a);box-shadow:0 0 0 3px #fff,0 4px 0 rgba(0,0,0,.4);text-shadow:0 2px 0 rgba(0,0,0,.4);rotate:8deg}
#hCombo.on{display:flex}
#hCombo.bump{animation:bump .35s}
#hCombo[data-m="5"],#hCombo[data-m="6"]{background:radial-gradient(circle at 35% 30%,#ff7ab0,#d81a6a)}
#hCombo[data-m="7"],#hCombo[data-m="8"]{background:radial-gradient(circle at 35% 30%,#b58cff,#6a22d8)}
@keyframes bump{0%{scale:1.7}100%{scale:1}}
#hBride,#hBoss{position:absolute;left:50%;translate:-50% 0;width:210px;display:none;text-align:center}
#hBride{top:98px}
#hBoss{top:38px}
#hud.boss #hQuest{display:none}
#hBride.on,#hBoss.on{display:block}
#hBride span,#hBoss span{display:block;font-size:12px;color:#fff;text-shadow:0 1px 0 #000,0 0 6px rgba(0,0,0,.9);margin-bottom:3px}
#hBride b,#hBoss b{display:block;height:9px;border-radius:5px;background:rgba(20,24,36,.65);box-shadow:0 0 0 2px #fff;overflow:hidden}
#hBride u{display:block;height:100%;background:linear-gradient(90deg,#ff9cc0,#ff3d7f)}
#hBoss u{display:block;height:100%;background:linear-gradient(90deg,#ff5a3a,#b8140e);transition:width .25s}
#hBoss.on ~ #hBride{top:122px}
#hEff{position:absolute;left:8px;top:108px;display:flex;flex-direction:column;gap:6px}
.eff{width:40px;padding:3px 3px 4px;border-radius:8px;background:rgba(255,246,214,.92);box-shadow:0 2px 0 rgba(0,0,0,.35)}
.eff.bad{background:rgba(225,190,255,.92)}
.eff img{display:block;width:34px;height:34px}
.eff b{display:block;height:4px;border-radius:2px;background:rgba(0,0,0,.25);overflow:hidden}
.eff u{display:block;height:100%;background:var(--mint)}
.eff.bad u{background:var(--violet)}
#hAlt{position:absolute;right:9px;top:33%;height:27%;width:9px;border-radius:5px;background:rgba(20,24,36,.5);box-shadow:0 0 0 2px rgba(255,255,255,.7)}
#hAlt:before,#hAlt:after{content:"";position:absolute;left:0;right:0;border-radius:5px}
#hAlt:before{top:0;height:32%;background:rgba(138,85,216,.85)}
#hAlt:after{bottom:0;height:21%;background:rgba(53,196,137,.9)}
#hAlt span{position:absolute;right:15px;font-size:11px;color:#fff;text-shadow:0 1px 0 #000,0 0 5px rgba(0,0,0,.9);white-space:nowrap;opacity:.55}
#hAlt .zh{top:6%}#hAlt .zl{bottom:4%}
#hAlt[data-z="high"] .zh,#hAlt[data-z="low"] .zl{opacity:1;font-size:14px}
#hAltDot{position:absolute;left:50%;width:17px;height:17px;margin:0 0 -8px -8.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px var(--ink);z-index:1}
#hWarn{position:absolute;left:50%;top:150px;translate:-50% 0;padding:5px 14px;border-radius:14px;background:var(--red);color:#fff;font-size:13px;box-shadow:0 0 0 2px #fff;opacity:0}
#hWarn.on{animation:warn 1.6s}
@keyframes warn{0%,30%,60%{opacity:1}15%,45%{opacity:.3}100%{opacity:0}}
#banner{position:absolute;left:8px;right:8px;top:31%;text-align:center;font-size:25px;line-height:1.1;color:#fff;opacity:0;
  text-shadow:-2px -2px 0 var(--ink),2px -2px 0 var(--ink),-2px 2px 0 var(--ink),2px 2px 0 var(--ink),0 5px 0 rgba(0,0,0,.4)}
#banner.on{animation:ban 1.7s both}
#banner.title{font-size:30px;animation-duration:2.4s}
#banner.good{color:#baff8a}
#banner.bad{color:#ff9c8e}
#banner.warn{color:#ffe14a}
#banner.bride{color:#ffb3d2;font-size:31px;animation-duration:2.2s}
@keyframes ban{0%{opacity:0;scale:.4;rotate:-6deg}12%{opacity:1;scale:1.12;rotate:2deg}20%{scale:1;rotate:-1deg}80%{opacity:1}100%{opacity:0;translate:0 -18px}}
#hint{position:absolute;left:50%;top:108px;translate:-50% -12px;width:300px;padding:10px 14px;background:url(../img/paper.png);border-radius:4px;font-size:15px;font-weight:400;line-height:1.3;text-align:center;
  box-shadow:0 4px 0 rgba(0,0,0,.35);opacity:0;transition:opacity .3s,translate .3s;rotate:-1deg}
#hint:before{content:"";position:absolute;left:50%;top:-8px;width:70px;height:18px;margin-left:-35px;background:var(--tape);rotate:2deg}
#hint.on{opacity:1;translate:-50% 0}
#hAmmo{position:absolute;left:10px;bottom:18px;max-width:190px;display:flex;flex-wrap:wrap-reverse;gap:3px}
#hAmmo i{width:17px;height:22px;background:url(../img/ic_drop.png) center/contain no-repeat;filter:grayscale(1) brightness(.4);opacity:.55}
#hAmmo i.h{filter:grayscale(.7) brightness(.8);opacity:.8}
#hAmmo i.f{filter:drop-shadow(0 2px 0 rgba(0,0,0,.4));opacity:1}
#hAmmo i.inf{filter:drop-shadow(0 0 4px #ffb648) hue-rotate(-30deg) saturate(3)}
#hAmmo.empty{animation:shk .3s}
@keyframes shk{25%{translate:-5px 0}75%{translate:5px 0}}
#btnBomb{pointer-events:auto;touch-action:none;position:absolute;right:14px;bottom:16px;width:96px;height:96px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 38% 30%,#6a7a95,#3b4760 70%);
  box-shadow:0 0 0 5px #ffd028,0 0 0 9px var(--ink),0 9px 0 4px rgba(0,0,0,.4)}
#btnBomb svg{filter:drop-shadow(0 3px 0 rgba(0,0,0,.35))}
#btnBomb.down{translate:0 5px;box-shadow:0 0 0 5px #ffd028,0 0 0 9px var(--ink),0 4px 0 4px rgba(0,0,0,.4)}
#btnBomb.no{filter:grayscale(.9) brightness(.8)}

#pops{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.pop{position:absolute;translate:-50% -50%;font-size:22px;color:#fff;text-align:center;white-space:nowrap;opacity:0;
  text-shadow:-1.5px -1.5px 0 var(--ink),1.5px -1.5px 0 var(--ink),-1.5px 1.5px 0 var(--ink),1.5px 1.5px 0 var(--ink),0 3px 0 rgba(0,0,0,.4)}
.pop small{display:block;font-size:12px;color:#ffe9a0}
.pop.on{animation:pop .95s both}
.pop.mid{font-size:27px;color:#ffe14a}
.pop.big{font-size:34px;color:#ff9ad0}
.pop.miss{font-size:15px;color:#d5dbe6}
@keyframes pop{0%{opacity:0;scale:.3}15%{opacity:1;scale:1.25}28%{scale:1}75%{opacity:1}100%{opacity:0;transform:translateY(-46px)}}
.bub{position:absolute;left:0;top:0;width:150px;padding:5px 8px;border-radius:12px;background:#fff;color:var(--ink);font-size:12.5px;line-height:1.15;text-align:center;box-shadow:0 0 0 2px var(--ink),0 3px 0 2px rgba(0,0,0,.3);display:none}
.bub:after{content:"";position:absolute;left:50%;bottom:-9px;margin-left:-6px;border:6px solid transparent;border-top:8px solid var(--ink)}
.bub.on{display:block}

/* ---------------- экраны ---------------- */
#screens{position:absolute;inset:0;display:none}
#screens.on{display:block;background:rgba(18,20,32,.62)}
#screens.s-menu{background:linear-gradient(rgba(20,30,54,.05) 30%,rgba(20,26,44,.55))}
#ov{position:absolute;inset:0;background:rgba(18,20,32,.7)}
#toast{position:absolute;left:50%;bottom:40px;translate:-50% 20px;max-width:330px;padding:9px 16px;border-radius:18px;background:var(--ink);color:#fff;font-size:14px;text-align:center;opacity:0;transition:.25s;pointer-events:none;box-shadow:0 0 0 2px #ffd028}
#toast.on{opacity:1;translate:-50% 0}

.menuIn{position:absolute;left:50%;top:4px;width:390px;padding:6px 20px 8px;transform-origin:50% 0;text-align:center}
.mTop{display:flex;justify-content:space-between}
.chip{display:flex;align-items:center;gap:5px;padding:4px 11px 4px 6px;border-radius:16px;background:rgba(24,26,38,.78);color:#fff;font-size:15px;box-shadow:0 0 0 2px rgba(255,255,255,.8)}
.chip img{width:20px;height:20px}
.chip small{opacity:.6;font-size:11px;margin-left:-3px}
.mLogo{display:block;width:290px;height:auto;margin:2px auto -6px;filter:drop-shadow(0 6px 0 rgba(0,0,0,.25));animation:logo 3.6s ease-in-out infinite}
@keyframes logo{50%{translate:0 -5px;rotate:.6deg}}
.mTag{font-size:13px;font-weight:400;color:#fff;text-shadow:0 1px 0 #000,0 0 8px rgba(0,0,0,.7);letter-spacing:.04em;margin-bottom:12px}
.note{position:relative;display:block;background:url(../img/paper.png);border-radius:3px;box-shadow:0 5px 0 rgba(0,0,0,.3),0 12px 18px rgba(0,0,0,.25);transition:translate .08s,box-shadow .08s}
.note:active{translate:0 4px;box-shadow:0 1px 0 rgba(0,0,0,.3),0 4px 8px rgba(0,0,0,.25)}
.tape{position:absolute;left:50%;top:-9px;width:84px;height:20px;margin-left:-42px;background:var(--tape);rotate:-2deg;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.pin{position:absolute;left:50%;top:5px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff8a80,#b8140e);box-shadow:0 2px 0 rgba(0,0,0,.3)}
.note.go{width:100%;padding:14px 12px 12px;rotate:-1.2deg;border:4px solid transparent;border-image:repeating-linear-gradient(-45deg,#ffd028 0 10px,#24212e 10px 20px) 4;background-clip:padding-box}
.note.go small{display:block;font-size:11.5px;font-weight:400;text-transform:lowercase;opacity:.75}
.note.go b{display:flex;align-items:center;justify-content:center;gap:8px;font-size:38px;line-height:1.1;color:var(--red)}
.note.go b svg path{fill:var(--red)}
.note.go span{display:block;font-size:14px}
.mGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px;margin:16px 4px 12px}
.mGrid .note{padding:18px 6px 9px;display:flex;flex-direction:column;align-items:center;gap:3px}
.mGrid .note svg{filter:drop-shadow(0 0 0 #000)}
.mGrid .note svg *{fill:var(--ink);stroke:var(--ink)}
.mGrid .note svg [fill="none"]{fill:none}
.mGrid b{font-size:15.5px}
.n1{rotate:1.4deg;background-color:#dff0ff;background-blend-mode:multiply}
.n2{rotate:-1.6deg;background-color:#fff0c4;background-blend-mode:multiply}
.n3{rotate:-.8deg;background-color:#e2f7dc;background-blend-mode:multiply}
.n4{rotate:1.8deg;background-color:#ffe0ea;background-blend-mode:multiply}
.note.wide{width:calc(100% - 8px);margin:4px;padding:13px 10px 11px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:18px;rotate:.6deg}
.note.wide svg *{fill:var(--ink);stroke:var(--ink)}
.note.wide svg [fill="none"]{fill:none}
.tabs{display:flex;justify-content:center;gap:3px;margin-top:10px}
.tabs button{width:78px;padding:8px 2px 10px;background:url(../img/paper.png);border-radius:0 0 3px 3px;border-top:2px dashed rgba(36,33,46,.45);box-shadow:0 4px 0 rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11px;font-weight:400}
.tabs button:nth-child(odd){rotate:-1.5deg}.tabs button:nth-child(even){rotate:1.5deg;translate:0 2px}
.tabs button:active{translate:0 4px}
.tabs svg *{fill:var(--ink);stroke:var(--ink)}
.tabs svg [fill="none"]{fill:none}
.tabs button.off{opacity:.5}
.tabs.in{margin-top:14px}
.link{margin-top:9px;padding:6px 10px;font-size:12.5px;font-weight:400;color:#fff;text-decoration:underline;text-shadow:0 1px 0 #000,0 0 6px rgba(0,0,0,.8)}

.panel{position:absolute;left:50%;top:50%;translate:-50% -50%;width:354px;padding:18px 18px 16px;background:url(../img/paper.png);border-radius:4px;box-shadow:0 8px 0 rgba(0,0,0,.35),0 20px 40px rgba(0,0,0,.4);animation:pin .28s both}
.panel:before{content:"";position:absolute;left:50%;top:-10px;width:110px;height:22px;margin-left:-55px;background:var(--tape);rotate:-1.5deg}
@keyframes pin{0%{opacity:0;transform:translateY(26px) rotate(-3deg)}100%{opacity:1;transform:none}}
.panel.tall{display:flex;flex-direction:column;height:min(640px,calc(var(--uih) - 28px))}
.panel.small{width:320px}
.panel h2{margin:0 30px 10px;font-size:24px;line-height:1.1;text-align:center}
.panel h2 small{font-size:14px;font-weight:400;opacity:.6}
.panel p{margin:0 0 12px;font-size:15px;font-weight:400;line-height:1.38}
.panel p.ctr{text-align:center}
.kicker{font-size:12px;font-weight:400;text-align:center;opacity:.7;margin-bottom:2px}
.x{position:absolute;left:10px;top:12px;width:38px;height:38px;border-radius:50%;background:var(--ink);display:flex;align-items:center;justify-content:center;box-shadow:0 3px 0 rgba(0,0,0,.3)}
.x:active{scale:.9}
.scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;margin:0 -8px;padding:2px 8px 8px;scrollbar-width:thin;scrollbar-color:rgba(36,33,46,.4) transparent}
.scroll::-webkit-scrollbar{width:5px}.scroll::-webkit-scrollbar-thumb{background:rgba(36,33,46,.35);border-radius:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 12px;border-radius:8px;background:var(--ink);color:#fff;font-size:14px;box-shadow:0 4px 0 rgba(0,0,0,.35)}
.btn:active{translate:0 3px;box-shadow:0 1px 0 rgba(0,0,0,.35)}
.btn.big{display:flex;width:100%;padding:14px;font-size:22px;background:var(--vest);box-shadow:0 5px 0 #b34f08;border-radius:10px;margin-top:6px}
.btn.big:active{box-shadow:0 1px 0 #b34f08;translate:0 4px}
.btns{display:flex;gap:8px;margin-top:12px}
.btns .btn{flex:1;padding:10px 4px;font-size:13px}

.dist{margin-bottom:14px}
.dist h3{margin:0 0 7px;padding:5px 10px;font-size:16px;color:#fff;background:var(--dc);border-radius:3px;rotate:-.6deg;box-shadow:0 3px 0 rgba(0,0,0,.2);text-shadow:0 1px 0 rgba(0,0,0,.35)}
.dist h3 small{display:block;font-size:11px;font-weight:400;opacity:.9}
.mis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mcard{position:relative;padding:8px 8px 7px 34px;min-height:62px;text-align:left;background:rgba(255,255,255,.6);border:2px solid var(--ink);border-radius:6px;box-shadow:0 3px 0 var(--ink)}
.mcard:active{translate:0 3px;box-shadow:0 0 0 var(--ink)}
.mcard em{position:absolute;left:5px;top:6px;width:24px;height:24px;border-radius:50%;background:var(--dc);color:#fff;font-style:normal;font-size:13px;display:flex;align-items:center;justify-content:center}
.mcard.boss em{width:auto;padding:0 5px;border-radius:5px;background:var(--red);font-size:10px;left:4px}
.mcard.boss{padding-left:44px}
.mcard b{display:block;font-size:13px;line-height:1.15}
.mcard .st{display:flex;gap:2px;margin-top:4px}
.mcard .st i,.s{display:inline-block;width:15px;height:15px;background:url(../img/ic_star.png) center/contain no-repeat;filter:grayscale(1) brightness(.5);opacity:.4}
.mcard .st i.on,.s.on{filter:none;opacity:1}
.mcard u{position:absolute;right:5px;bottom:5px;width:14px;height:14px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 2px #fff}
.mcard.lock{opacity:.5;box-shadow:none}
.mcard.lock svg *{fill:var(--ink)}

.panel.brief h2{margin:0 20px 10px}
.quest{margin:0 0 10px;padding:8px 10px;border-left:5px solid var(--vest);background:rgba(255,255,255,.55);font-size:14px;font-weight:400;line-height:1.3}
.quest b{display:block;font-size:11px;opacity:.65}
.quest strong{color:#1c8a4a}
.quest.done{border-color:var(--mint)}
.quest.fail{border-color:#9a9a9a;opacity:.85}
.goals{display:flex;justify-content:space-between;gap:6px;margin-bottom:10px;font-size:13px}
.goals span{display:flex;align-items:center;gap:1px}
.goals .s{width:14px;height:14px}
.panel.small .goals{justify-content:center;gap:22px}
.best{text-align:center;font-size:13px;margin-bottom:6px}

.wallet{position:absolute;right:14px;top:16px;display:flex;align-items:center;gap:4px;font-size:17px}
.wallet img{width:20px;height:20px}
.seg{display:flex;margin:0 0 10px;border:2px solid var(--ink);border-radius:8px;overflow:hidden}
.seg button{flex:1;padding:8px 4px;font-size:14px}
.seg button.on{background:var(--ink);color:#fff}
.row{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:2px dashed rgba(36,33,46,.25)}
.rin{flex:1;min-width:0}
.rin b{display:block;font-size:15px;line-height:1.15}
.rin small{display:block;font-size:12px;font-weight:400;line-height:1.25;opacity:.8}
.rin em{display:block;font-style:normal;font-size:12px;font-weight:400;margin-top:2px}
.rin em strong{color:#1c8a4a}
.pips{display:flex;gap:3px;margin:4px 0 1px}
.pips i{width:20px;height:7px;border-radius:2px;background:rgba(36,33,46,.2)}
.pips i.on{background:var(--mint)}
.buy{display:flex;align-items:center;gap:4px;min-width:76px;justify-content:center;padding:9px 8px;border-radius:8px;background:var(--vest);color:#fff;font-size:15px;box-shadow:0 4px 0 #b34f08}
.buy img{width:18px;height:18px}
.buy:active{translate:0 3px;box-shadow:0 1px 0 #b34f08}
.buy.no{background:#9b978c;box-shadow:0 4px 0 #6f6c64}
.buy.sel{background:var(--ink);box-shadow:0 4px 0 #000;font-size:13px}
.maxed{min-width:76px;text-align:center;font-size:12px;color:#1c8a4a}
.sw{position:relative;width:46px;height:46px;border-radius:50%;box-shadow:0 0 0 2px var(--ink);flex:none}
.sw i{position:absolute;right:9px;top:13px;width:8px;height:8px;border-radius:50%;box-shadow:0 0 0 1.5px #111}
.sw u{position:absolute;right:-7px;top:19px;border:5px solid transparent;border-left-width:10px}
.row.skin.cur{background:rgba(53,196,137,.16)}

.ach{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:2px dashed rgba(36,33,46,.25);opacity:.62}
.ach.got{opacity:1}
.badge{flex:none;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 28%,rgba(255,255,255,.55),transparent 55%),var(--bc);box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ink),0 6px 0 rgba(0,0,0,.25)}
.ach:not(.got) .badge{filter:grayscale(1)}
.bar{height:6px;border-radius:3px;background:rgba(36,33,46,.2);margin-top:4px;overflow:hidden}
.bar u{display:block;height:100%;background:var(--violet)}

.lbme{text-align:center;font-size:14px;font-weight:400;margin-bottom:8px}
.lbme b{font-size:18px}
.lbme small{display:block;font-size:11px;opacity:.65}
.lb-row{display:flex;align-items:center;gap:9px;padding:7px 6px;border-bottom:2px dashed rgba(36,33,46,.22)}
.lb-row.top-1{background:rgba(255,208,40,.28)}.lb-row.top-2{background:rgba(190,198,210,.35)}.lb-row.top-3{background:rgba(216,140,80,.25)}
.lb-medal{flex:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;background:rgba(36,33,46,.12)}
.lb-medal.gold{background:radial-gradient(circle at 35% 30%,#fff3a8,#f2b820);box-shadow:0 0 0 2px #a8760a}
.lb-medal.silver{background:radial-gradient(circle at 35% 30%,#fff,#aeb6c2);box-shadow:0 0 0 2px #6f7887}
.lb-medal.bronze{background:radial-gradient(circle at 35% 30%,#ffd2a8,#c8783a);box-shadow:0 0 0 2px #8a4a1c}
.lb-avatar{flex:none;width:36px;height:36px;border-radius:50%;overflow:hidden;background:var(--sky);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:0 0 0 2px var(--ink)}
.lb-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.lb-name{flex:1;min-width:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb-score{font-size:16px;color:var(--red)}
.lb-empty{padding:40px 10px;text-align:center;font-size:15px;font-weight:400;opacity:.75}

.panel.result{padding-top:20px}
.panel.result h2{margin:0 0 6px}
.stamp{position:absolute;right:12px;top:54px;padding:3px 9px;border:3px solid var(--red);border-radius:6px;color:var(--red);font-size:15px;text-transform:uppercase;letter-spacing:.06em;rotate:14deg;opacity:.82;animation:stamp .35s .5s both}
.panel.win .stamp{border-color:#1c8a4a;color:#1c8a4a}
@keyframes stamp{0%{opacity:0;scale:3}100%{opacity:.82;scale:1}}
.stars{display:flex;justify-content:center;gap:8px;min-height:6px;margin:4px 0}
.s.big{width:56px;height:56px;transition:filter .2s,opacity .2s}
.s.big.on{animation:bump .4s}
.s.big[data-k="2"]{translate:0 -8px}
.score{text-align:center;line-height:1}
.score span{display:block;font-size:11px;font-weight:400;opacity:.65}
.score b{font-size:42px}
.score em{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:5px;background:var(--pink);color:#fff;font-style:normal;font-size:12px;vertical-align:top;rotate:6deg}
.next{margin:5px 0 9px;font-size:13px;font-weight:400;text-align:center}
.stat{display:grid;grid-template-columns:auto auto auto auto auto auto;gap:3px 5px;justify-content:center;align-items:baseline;font-size:12px;font-weight:400;margin-bottom:9px}
.stat b{font-size:15px;margin-right:6px}
.rew{display:flex;align-items:center;justify-content:center;gap:5px;font-size:22px;margin:2px 0 6px}
.rew img{width:26px;height:26px}
.rew small{font-size:12px;font-weight:400;opacity:.7}
.newach{display:flex;align-items:center;gap:9px;margin:0 0 7px;padding:5px 8px;background:rgba(138,85,216,.14);border-radius:8px;font-size:13px;font-weight:400}
.newach .badge{width:34px;height:34px;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--ink)}
.panel.final{background-color:#fff3c4;background-blend-mode:multiply}
.streak{display:flex;justify-content:center;gap:5px;margin:6px 0 10px}
.streak i{width:30px;height:30px;border-radius:50%;border:2px solid var(--ink);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:13px;opacity:.4}
.streak i.on{background:var(--mint);color:#fff;opacity:1}