/* تقييم الحسابات — own look: a TV voting show. 🎯 عادي = night stage (spotlights, gold), 🎨 كارتون (default) = pink studio + sunshine paddles, thick outlines */
:root{--bg:#14112b;--bg2:#2b1d5c;--ink:#f7f3ff;--muted:#b9b0d9;--card:#1d1840;--line:#3d3470;--hot:#ff3d7f;--gold:#ffc83d;--gold2:#b8860b;--field:#120e2a;--paper:#241e4d;--out:transparent;color-scheme:dark;font-family:"Baloo Bhaijaan 2","Segoe UI",Tahoma,system-ui,sans-serif}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;overflow-x:hidden;color:var(--ink)}
body{min-height:100vh;user-select:none;background:radial-gradient(60% 45% at 18% 0,#ff3d7f33,transparent 70%) fixed,radial-gradient(60% 45% at 85% 0,#00b4d833,transparent 70%) fixed,radial-gradient(110% 70% at 50% 0,var(--bg2),var(--bg) 70%) fixed,var(--bg)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.5;background:radial-gradient(1.5px 1.5px at 20% 30%,#fff8 50%,transparent 51%),radial-gradient(1.5px 1.5px at 70% 18%,#fff6 50%,transparent 51%),radial-gradient(2px 2px at 85% 60%,#fff5 50%,transparent 51%),radial-gradient(1.5px 1.5px at 35% 75%,#fff6 50%,transparent 51%)}
.page{position:relative;width:min(100%,560px);margin:auto;padding:max(10px,env(safe-area-inset-top)) 16px max(26px,env(safe-area-inset-bottom))}
.topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.topline .brand-line{margin:0;min-width:0}
.icon{flex:none;width:40px;height:40px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font-size:17px;cursor:pointer}
.sinan-credit{margin:18px auto 0;text-align:center;color:var(--muted);font-size:11px;letter-spacing:1.5px;font-weight:800}
.sinan-credit b{color:var(--gold);font-size:14px;letter-spacing:2px}
.theme-switch{display:flex;width:max-content;margin:0 auto 14px;padding:4px;gap:4px;border:1px solid var(--line);border-radius:999px;background:var(--card)}
.theme-switch button{border:0;border-radius:999px;padding:8px 16px;background:transparent;color:var(--muted);font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.theme-switch button[aria-pressed="true"]{background:linear-gradient(180deg,#ff7aa8,var(--hot));color:#fff}

/* hero: a profile badge holding up a golden 12 */
.hero{display:flex;align-items:center;gap:16px;margin:0 0 16px;padding:14px 16px;border:1px solid #ff3d7f55;border-radius:22px;background:linear-gradient(135deg,#3a1d6e,#1b1440);box-shadow:0 12px 28px #0006}
.hero h1{margin:0;font-size:32px;line-height:1.1;color:#fff;text-shadow:0 2px 0 #0008}
.hero p{margin:4px 0 0;color:var(--muted);font-size:14px;font-weight:700}
.hero-badge{position:relative;flex:none;width:78px;height:72px}
.hb-face{position:absolute;inset:0 12px 8px 0;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffd1e3 60%,#ff8fb6);font-size:34px;box-shadow:0 0 0 4px var(--hot),0 8px 16px #0006}
.hb-12{position:absolute;right:-2px;bottom:-2px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff3b0,var(--gold) 55%,#e09a00);color:#5a3200;font-size:19px;font-weight:800;box-shadow:0 4px 0 #0005;animation:wob 2.6s ease-in-out infinite}
.hb-star{position:absolute;color:var(--gold);font-style:normal;font-size:16px;animation:tw 1.8s ease-in-out infinite}
.hb-star.s1{top:-4px;right:6px}.hb-star.s2{bottom:6px;left:-6px;animation-delay:-.9s;font-size:12px}
@keyframes wob{0%,100%{rotate:-8deg}50%{rotate:10deg;scale:1.08}}
@keyframes tw{0%,100%{opacity:.3;scale:.8}50%{opacity:1;scale:1.2}}
.hero .hero-turn{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:6px;font-size:16px;font-weight:800}
.hero-name{display:inline-block;max-width:180px;overflow:hidden;padding:3px 13px;border:0;border-radius:999px;background:#ffffff1a;color:#fff;font:inherit;font-size:16px;line-height:1.5;font-weight:800;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.hero-name.empty{outline:2px dashed currentColor;outline-offset:-2px}
.hero-name.set{background:var(--hot);animation:hn 2.4s ease-in-out infinite}
.hero-name.go{animation:hn .5s ease 2}
@keyframes hn{0%,100%{transform:rotate(0)}25%{transform:rotate(-4deg) scale(1.06)}75%{transform:rotate(4deg) scale(1.06)}}

.card{padding:14px;border:1px solid var(--line);border-radius:22px;background:var(--card);box-shadow:0 14px 30px #0005}
.card[hidden],[hidden]{display:none!important}
.sec-title{margin:2px 0 4px;font-size:21px;text-align:center}
.sec-hint{margin:0 0 12px;text-align:center;color:var(--muted);font-size:14px;font-weight:700}
.add-form,.user-form{display:flex;gap:8px;margin-bottom:12px}
.add-form input,.user-form input{flex:1;min-width:0;height:52px;padding:0 14px;border:1px solid var(--line);border-radius:14px;background:var(--field);color:var(--ink);font:inherit;font-size:18px;user-select:text}
.add-form input:focus,.user-form input:focus{outline:2px solid var(--hot);outline-offset:1px}
.add-form button,.user-form button{flex:none;padding:0 18px;border:0;border-radius:14px;background:linear-gradient(180deg,#ff7aa8,var(--hot));color:#fff;font:inherit;font-size:18px;font-weight:800;cursor:pointer}
.user-form{position:relative;direction:ltr}
.user-form .at{position:absolute;left:14px;top:50%;translate:0 -50%;color:var(--hot);font-size:20px;font-weight:800;pointer-events:none}
.user-form input{padding-left:36px;text-align:left}
.user-form button{direction:rtl}

/* judges */
.judges{display:flex;flex-wrap:wrap;gap:8px;max-height:300px;overflow:auto}
.jd{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 10px;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-size:17px;font-weight:800}
.jd.new{animation:pop .35s ease}
.jd .num{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff;font-size:13px}
.jd .del{width:26px;height:26px;border:0;border-radius:50%;background:#ffffff14;color:#ff8a8a;font-size:17px;cursor:pointer}
.empty{width:100%;padding:18px;text-align:center;color:var(--muted);font-size:15px}
.status{min-height:20px;margin:10px 0;text-align:center;color:var(--muted);font-size:15px;font-weight:700}
.btn{display:block;width:100%;border:0;font:inherit;cursor:pointer;transition:transform .12s,box-shadow .12s}
.btn:disabled{opacity:.5;cursor:default}
.btn-main{padding:15px;border-radius:18px;background:linear-gradient(180deg,#ffe07a,var(--gold));color:#3a2200;font-size:22px;font-weight:800;box-shadow:0 6px 0 var(--gold2),0 12px 24px #0006}
.btn-main:active:not(:disabled){transform:translateY(4px);box-shadow:0 2px 0 var(--gold2)}
.btn-ghost{margin-top:10px;padding:12px;border-radius:16px;background:transparent;border:1px solid var(--line);color:var(--ink);font-size:16px;font-weight:800}

/* the account on stage */
.stage{margin-top:4px}
.profile{position:relative;padding:22px 16px 16px;border-radius:24px;text-align:center;background:radial-gradient(90% 70% at 50% 0,#ff3d7f40,transparent 70%),linear-gradient(180deg,#2c2462,#1a1540);border:1px solid #ff3d7f66;overflow:hidden}
.profile:before{content:"";position:absolute;inset:-40% -20% auto;height:120%;background:conic-gradient(from 0deg,transparent 0 20deg,#ffffff10 20deg 30deg,transparent 30deg 60deg,#ffffff10 60deg 70deg,transparent 70deg 110deg,#ffffff10 110deg 120deg,transparent 120deg);animation:spin 18s linear infinite;pointer-events:none}
.profile.pop{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{from{transform:scale(.85);opacity:0}}
@keyframes spin{to{rotate:360deg}}
.pf-ring{position:relative;width:132px;height:132px;margin:0 auto 10px;border-radius:50%;padding:5px;background:conic-gradient(var(--hot),var(--gold),#00b4d8,var(--hot));animation:spin 6s linear infinite}
.pf-ring img,.pf-ring span{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;border:4px solid var(--card);animation:spin 6s linear infinite reverse}
.pf-ring span{display:grid;place-items:center;color:#fff;font-size:54px;font-weight:800}
.profile h2{position:relative;margin:0;font-size:26px;line-height:1.2;word-break:break-word}
.pf-user{position:relative;display:inline-block;margin-top:2px;color:#7fdcff;font-size:17px;font-weight:800;text-decoration:none}
.pf-kind{position:relative;display:inline-block;margin:6px 6px 0;padding:2px 10px;border-radius:999px;background:#ffffff14;font-size:13px;font-weight:800;color:var(--muted)}
.pf-bio{position:relative;margin:10px auto 0;max-width:420px;max-height:96px;overflow:auto;color:#ddd5ff;font-size:15px;line-height:1.5;white-space:pre-line;user-select:text}
.float{position:absolute;left:50%;top:38%;translate:-50% 0;z-index:3;padding:4px 16px;border-radius:999px;background:var(--hot);color:#fff;font-size:30px;font-weight:800;animation:up 1.1s ease forwards;pointer-events:none}
.float.max{background:linear-gradient(180deg,#fff3b0,var(--gold));color:#5a3200}
@keyframes up{0%{opacity:0;transform:translateY(20px) scale(.6)}20%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-70px) scale(1.15)}}

/* whose turn + the 12 voting paddles */
.turn{margin:14px 0 10px;text-align:center}
.turn small{display:block;color:var(--muted);font-size:14px;font-weight:700}
.turn h3{margin:0;font-size:28px;color:var(--jc,#fff);text-shadow:0 2px 0 #0006}
.paddles{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.pd{aspect-ratio:1/.95;border:0;border-radius:18px;background:linear-gradient(180deg,#3b3180,#2a2260);color:#fff;font:inherit;font-size:28px;font-weight:800;box-shadow:0 5px 0 #15103a;cursor:pointer;transition:transform .1s}
.pd:active{transform:translateY(4px);box-shadow:0 1px 0 #15103a}
.pd.top{background:linear-gradient(180deg,#fff3b0,var(--gold));color:#5a3200;box-shadow:0 5px 0 var(--gold2)}
.pd.hit{animation:hit .4s ease}
@keyframes hit{50%{transform:scale(1.18)}}
.tools,.play-foot{display:flex;gap:8px;margin-top:12px}
.tools button,.play-foot button{flex:1;padding:10px 4px;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);font:inherit;font-size:14px;font-weight:800;cursor:pointer}
.tools button:disabled,.play-foot button:disabled{opacity:.45}
.play-foot{margin-top:16px}
.play-foot .finish{flex:1.4;background:linear-gradient(180deg,#ff7aa8,var(--hot));border-color:transparent;color:#fff}

/* judges' votes strip */
.votes{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:12px}
.vt{display:flex;align-items:center;gap:6px;padding:4px 4px 4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--field);font-size:14px;font-weight:800;color:var(--muted)}
.vt b{display:grid;place-items:center;min-width:30px;height:30px;padding:0 6px;border-radius:999px;background:#ffffff12;color:var(--muted)}
.vt.on{color:var(--ink)}.vt.on b{background:var(--jc);color:#fff;animation:pop .3s ease}
.vt.now{outline:2px solid var(--jc);color:#fff}
.vt.sk{opacity:.5}

/* reveal */
.reveal{margin-top:14px;padding:14px;border-radius:22px;text-align:center;background:linear-gradient(180deg,#ffe07a22,transparent);border:1px solid #ffc83d66}
.reveal small{color:var(--muted);font-size:15px;font-weight:800}
.reveal b{display:block;font-size:72px;line-height:1;color:var(--gold);text-shadow:0 4px 0 #0006}
.reveal .avg{display:block;margin:4px 0 12px;color:var(--ink);font-size:16px;font-weight:800;min-height:24px}
.reveal.boom b{animation:boom .6s cubic-bezier(.3,1.8,.5,1)}
@keyframes boom{40%{transform:scale(1.35)}}

/* ranking */
.board-title{margin:20px 4px 8px;font-size:19px}
.board{display:grid;gap:7px}
.br{display:grid;grid-template-columns:30px 44px 1fr auto;align-items:center;gap:8px;padding:7px 10px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.br .rk{text-align:center;font-size:18px;font-weight:800}
.bimg{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;overflow:hidden;color:#fff;font-weight:800}
.bimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bimg em{font-style:normal}
.bn{min-width:0;overflow:hidden;font-size:16px;font-weight:800;white-space:nowrap;text-overflow:ellipsis}
.bn small{display:block;color:var(--muted);font-size:12px;text-align:right}
.br b{color:var(--gold);font-size:22px}

/* overlays */
.overlay{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:#0009;backdrop-filter:blur(3px)}
.modal{position:relative;width:min(100%,420px);max-height:90vh;overflow:auto;padding:20px;border:1px solid var(--line);border-radius:24px;background:var(--card);text-align:center;box-shadow:0 20px 50px #000a}
.modal h2{margin:4px 0 8px}
.modal ol{text-align:right;padding-right:20px;line-height:1.7;font-weight:700}
.modal p{color:var(--muted);font-weight:700}
.win{overflow:hidden}
.win-ring{position:relative;width:150px;height:150px;margin:18px auto 8px;padding:6px;border-radius:50%;background:conic-gradient(var(--gold),#fff3b0,var(--gold),#e09a00,var(--gold));box-shadow:0 0 40px #ffc83d88}
.win-ring img,.win-ring #winLetter{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;object-fit:cover;border:4px solid var(--card);color:#fff;font-size:60px;font-weight:800}
.crown{position:absolute;top:-34px;left:50%;translate:-50% 0;font-size:46px;animation:wob 2s ease-in-out infinite}
.win small{color:var(--muted);font-weight:800}
.win h2{margin:0;font-size:28px;word-break:break-word}
.win-user{display:block;color:#7fdcff;font-weight:800}
.win-total{display:block;margin:6px 0 10px;color:var(--gold);font-size:30px}
.podium{display:grid;gap:6px;margin-bottom:14px}
.pod{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:14px;background:var(--paper);font-weight:800}
.pod b{flex:1;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod small{color:var(--gold)}
#confetti{position:absolute;inset:0;pointer-events:none}
#confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;background:var(--c);animation:fall var(--d) linear infinite var(--delay)}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}

/* 🎨 كارتون (default): pink studio, white cards, thick ink outlines */
body.kids{--bg:#ffd6e7;--bg2:#fff0a8;--ink:#2a1840;--muted:#6b5a85;--card:#ffffff;--line:#2a1840;--paper:#fff7fb;--field:#fff;color-scheme:light;background:radial-gradient(circle at 15% 10%,#fff6 0 60px,transparent 61px),radial-gradient(circle at 85% 30%,#fff5 0 40px,transparent 41px),linear-gradient(180deg,#fff0a8,#ffd6e7 45%,#c9b6ff) fixed}
body.kids:before{opacity:.35;background:repeating-conic-gradient(from 0deg at 50% -10%,#ffffff 0 6deg,transparent 6deg 18deg)}
.kids .icon,.kids .theme-switch{border:3px solid var(--line);background:#fff;box-shadow:0 3px 0 var(--line)}
.kids .hero{border:3px solid var(--line);background:linear-gradient(135deg,#ff5c97,#ff3d7f 55%,#ff8a3d);box-shadow:0 6px 0 var(--line)}
.kids .hero p{color:#fff}
.kids .hero h1{color:#fff;text-shadow:0 3px 0 var(--line)}
.kids .hb-face{box-shadow:0 0 0 4px #fff,0 0 0 7px var(--line)}
.kids .hb-12{border:3px solid var(--line)}
.kids .hero-name{background:#ffffff40}.kids .hero-name.set{background:var(--line)}
.kids .card{border:3px solid var(--line);box-shadow:0 7px 0 var(--line)}
.kids .add-form input,.kids .user-form input{border:3px solid var(--line);background:#fff}
.kids .add-form button,.kids .user-form button{border:3px solid var(--line);box-shadow:0 4px 0 var(--line)}
.kids .jd{border:2px solid var(--line);background:#fff}
.kids .btn-main{border:3px solid var(--line);box-shadow:0 6px 0 var(--line)}
.kids .btn-main:active:not(:disabled){box-shadow:0 2px 0 var(--line)}
.kids .btn-ghost{border:3px solid var(--line);background:#fff}
.kids .profile{border:3px solid var(--line);background:radial-gradient(90% 70% at 50% 0,#ffffff,#ffe3ef 60%,#ffd0e4);box-shadow:0 6px 0 var(--line)}
.kids .profile:before{background:conic-gradient(from 0deg,transparent 0 20deg,#ff3d7f14 20deg 30deg,transparent 30deg 60deg,#ffc83d22 60deg 70deg,transparent 70deg 110deg,#00b4d814 110deg 120deg,transparent 120deg)}
.kids .pf-ring img,.kids .pf-ring span{border-color:#fff}
.kids .pf-user{color:#0077b6}
.kids .pf-kind{background:#fff;border:2px solid var(--line);color:var(--ink)}
.kids .pf-bio{color:#4a3a63}
.kids .pd{border:3px solid var(--line);background:linear-gradient(180deg,#8fdcff,#00b4d8);color:#fff;text-shadow:0 2px 0 var(--line);box-shadow:0 5px 0 var(--line)}
.kids .pd:nth-child(3n+2){background:linear-gradient(180deg,#ffa3c4,var(--hot))}
.kids .pd:nth-child(3n){background:linear-gradient(180deg,#b9f28a,#57b829)}
.kids .pd.top{background:linear-gradient(180deg,#fff3b0,var(--gold));color:#5a3200;text-shadow:none}
.kids .pd:active{box-shadow:0 1px 0 var(--line)}
.kids .turn h3{text-shadow:0 2px 0 #fff,0 0 0 var(--line);-webkit-text-stroke:1px var(--line)}
.kids .tools button,.kids .play-foot button{border:3px solid var(--line);background:#fff;box-shadow:0 3px 0 var(--line)}
.kids .play-foot .finish{background:linear-gradient(180deg,#ff7aa8,var(--hot));color:#fff}
.kids .vt{border:2px solid var(--line);background:#fff}
.kids .reveal{border:3px solid var(--line);background:linear-gradient(180deg,#fff3b0,#fff);box-shadow:0 5px 0 var(--line)}
.kids .reveal b{color:var(--hot);text-shadow:0 4px 0 var(--line)}
.kids .br{border:2px solid var(--line);background:#fff}
.kids .br b{color:var(--hot)}
.kids .modal{border:3px solid var(--line);background:#fff;box-shadow:0 8px 0 var(--line)}
.kids .pod{background:#fff7fb;border:2px solid var(--line)}
.kids .pod small{color:var(--hot)}
.kids .win-total{color:var(--hot)}
.kids .sinan-credit b{color:var(--hot)}
.kids .theme-switch button{color:var(--muted)}
.kids .vt.now{color:var(--ink)}
.kids .hero-name.empty{background:#fff8;color:#3a1030}

/* the account as its Telegram profile screen (light = Telegram day, عادي = Telegram night) */
.tgp{position:relative;overflow:hidden;border-radius:22px;background:#17212b;color:#fff;text-align:right;box-shadow:0 14px 30px #0006;font-family:-apple-system,"SF Pro Text","Segoe UI",Roboto,Tahoma,sans-serif}
.tgp.pop{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
.tgp-head{position:relative;aspect-ratio:1/.9;background:#2b5278}
.tgp-head img,.tgp-head #pfLetter{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgp-head #pfLetter{display:grid;place-items:center;color:#fff;font-size:120px;font-weight:700;background-image:linear-gradient(160deg,#ffffff33,#0000)}
.tgp-shade{position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(180deg,#0000,#0009)}
.tgp-title{position:absolute;right:16px;left:16px;bottom:12px}
.tgp-title h2{margin:0;color:#fff;font-size:24px;font-weight:700;line-height:1.25;word-break:break-word;text-shadow:0 1px 4px #0008}
.tgp-title span{display:block;margin-top:2px;color:#ffffffcc;font-size:15px}
.tgp-info{padding:6px 0}
.tgp-row{padding:10px 18px;border-bottom:1px solid #ffffff12}
.tgp-row:last-child{border:0}
.tgp-row p,.tgp-row a{display:block;margin:0;color:#fff;font-size:16px;line-height:1.45;white-space:pre-line;word-break:break-word;text-decoration:none;user-select:text}
.tgp-row a{color:#6ab3f3;text-align:right}
.tgp-row small{display:block;margin-top:2px;color:#708499;font-size:13px}
.tgp .float{top:30%}
.kids .tgp{background:#fff;color:#000;border:3px solid var(--line);box-shadow:0 6px 0 var(--line)}
.kids .tgp-row{border-color:#0000000f}
.kids .tgp-row p{color:#000}
.kids .tgp-row a{color:#3390ec}
.kids .tgp-row small{color:#707579}
.tgp-row p,.tgp-title h2{unicode-bidi:plaintext}
.reset{display:block;width:100%;margin-top:10px;padding:11px;border:1px dashed var(--line);border-radius:14px;background:transparent;color:var(--muted);font:inherit;font-size:15px;font-weight:800;cursor:pointer}
.kids .reset{border:3px dashed var(--line);background:#fff;color:var(--ink)}

/* the account as a phone screenshot of its Telegram profile (كارتون = Telegram day, عادي = night) */
.shot{--tg:#f1f1f6;--tc:#fff;--tt:#000;--tm:#8e8e93;--tl:#3390ec;--ts:#c6c6c8;position:relative;overflow:hidden;padding:0 0 14px;border-radius:30px;background:var(--tg);color:var(--tt);text-align:center;font-family:-apple-system,"SF Pro Text","Segoe UI",Roboto,Tahoma,sans-serif;box-shadow:0 0 0 7px #111,0 0 0 9px #444,0 18px 34px #0007;margin:10px 6px}
body:not(.kids) .shot{--tg:#000;--tc:#1c1c1e;--tt:#fff;--tm:#8d8e93;--tl:#3e88f7;--ts:#38383a}
.shot.pop{animation:pop .5s cubic-bezier(.3,1.6,.5,1)}
.sb{display:flex;justify-content:space-between;align-items:center;direction:ltr;padding:10px 22px 2px;font-size:15px}
.sb b{font-weight:600}
.sb-ic{display:flex;gap:5px;align-items:center}
.sb-ic i{display:block;background:var(--tt)}
.sig{width:16px;height:10px;clip-path:polygon(0 100%,100% 0,100% 100%)}
.wifi{width:14px;height:10px;border-radius:14px 14px 0 0;clip-path:polygon(50% 100%,0 0,100% 0)}
.bat{width:24px;height:11px;border-radius:3px;box-shadow:inset 0 0 0 1.5px var(--tg),inset -6px 0 0 0 var(--tg)}
.tb{display:flex;justify-content:space-between;padding:4px 14px;color:var(--tl);font-size:17px}
.tb-more{font-weight:700}
.ava{display:block;width:104px;height:104px;margin:6px auto 10px;padding:0;border:0;border-radius:50%;overflow:hidden;background:none;cursor:zoom-in}
.ava img,.ava span{display:grid;place-items:center;width:100%;height:100%;object-fit:cover;color:#fff;font-size:44px;font-weight:600}
.shot h2{margin:0 16px;font-size:23px;font-weight:600;line-height:1.25;word-break:break-word;unicode-bidi:plaintext}
.pf-status{display:block;margin-top:3px;color:var(--tm);font-size:15px}
.acts{display:flex;gap:7px;margin:14px 12px 12px}
.acts span{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;border-radius:12px;background:var(--tc);color:var(--tl);font-size:12px}
.acts i{font-style:normal;font-size:19px;filter:saturate(0) brightness(.9) sepia(1) hue-rotate(180deg) saturate(5)}
.info{margin:0 12px;border-radius:12px;background:var(--tc);text-align:right;overflow:hidden}
.info .row{padding:10px 14px;border-bottom:.5px solid var(--ts)}
.info .row:last-child{border:0}
.info p,.info a{display:block;margin:0;color:var(--tt);font-size:16px;line-height:1.4;white-space:pre-line;word-break:break-word;text-decoration:none;unicode-bidi:plaintext;user-select:text}
.info a{color:var(--tl);text-align:right}
.info small{display:block;margin-top:2px;color:var(--tm);font-size:13px}
.tabs{display:flex;justify-content:space-around;margin:12px 12px 0;padding:10px 0 0;border-radius:12px 12px 0 0;background:var(--tc);color:var(--tm);font-size:14px}
.tabs span{padding-bottom:8px}
.tabs .on{color:var(--tl);border-bottom:3px solid var(--tl)}
.shot .float{top:22%}
.photo-view{flex-direction:column;gap:12px;background:#000e}
.photo-view img{max-width:100%;max-height:78vh;border-radius:14px}
.photo-view .btn{width:auto;padding:10px 26px;color:#fff;border-color:#fff6}
.hb-face{overflow:hidden}.hb-face img{width:100%;height:100%;object-fit:cover}.hb-face em{font-style:normal}

/* v3: header like Telegram's own profile (colour + pattern + gifts around the photo + emoji status) */
.shot{padding-bottom:12px}
.hdr{position:relative;padding-bottom:16px;overflow:hidden}
.hdr .pat{position:absolute;inset:0;pointer-events:none}
.hdr .pat i{position:absolute;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}
.hdr.colored,.hdr.colored .tb,.hdr.colored h2,.hdr.colored .pf-status,.hdr.colored .sb{color:#fff}
.hdr.colored .sb-ic i{background:#fff}.hdr.colored .bat{box-shadow:inset 0 0 0 1.5px #0000,inset -6px 0 0 0 #0000;opacity:.95}
.hdr.colored .pf-status{color:#ffffffcc}
.hdr .sb,.hdr .tb,.ava-wrap,.hdr h2,.hdr .pf-status{position:relative}
.ava-wrap{width:100%;height:116px;margin-top:2px}
.ava-wrap .ava{position:absolute;left:50%;top:0;margin:0;translate:-50% 0;box-shadow:0 0 0 3px #ffffff40}
.gifts{position:absolute;inset:0;pointer-events:none}
.gift{position:absolute;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle,var(--gb) 0,transparent 70%);animation:gfloat 3.2s ease-in-out infinite}
.gift svg,.gift img,.gift video{width:100%!important;height:100%!important;object-fit:contain}
@keyframes gfloat{50%{transform:translateY(-5px)}}
.hdr h2{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap}
.stat{display:inline-block;width:26px;height:26px;flex:none}
.stat svg,.stat img,.stat video{width:100%!important;height:100%!important}
.info{margin-top:0}