*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
:root{--bg:#0d081e;--bg-soft:#150e2e;--surface:#1d1240;--surface-2:#261a52;--border:#3b2a70;--text:#eef1ff;--text-dim:#9aa3c7;--primary:#7c5cff;--primary-2:#5a3df5;--accent:#00e5a8;--accent-2:#00c2ff;--danger:#ff5470;--warning:#ffb547;--gold:#ffd166;--radius:14px;--shadow:0 10px 40px #00000073;--font:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;--card-spin:0deg;--pill-spin:0deg}
@property --card-spin{syntax:"<angle>";inherits:false;initial-value:0deg}
@property --pill-spin{syntax:"<angle>";inherits:false;initial-value:0deg}
html,body{height:100%}
body{font-family:var(--font);background:radial-gradient(1200px 600px at 80% -10%,#a855f738,transparent 60%),radial-gradient(900px 500px at -10% 30%,#d84aff1f,transparent 55%),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
a{color:var(--accent)}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1{font-size:1.6rem}h2{font-size:1.35rem;margin-bottom:8px}
h3{letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin:18px 0 8px;font-size:.72rem;font-weight:800}
.muted{color:var(--text-dim);font-size:.95rem;margin-bottom:24px}
.hint{color:var(--text-dim);font-size:.82rem;line-height:1.45;margin:6px 0 10px}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:.85rem;color:var(--text-dim);margin:2px 0 14px}
.chk input{width:auto;margin-top:2px}
code{font-size:.8em;color:#d9ccff}

/* fondo mágico (sustituye la imagen del sitio) */
.auth-shell:before,.panel-shell:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:
 radial-gradient(60px 60px at 12% 12%,#8b5cf6cc 0 45%,transparent 50%),radial-gradient(38px 38px at 86% 10%,#22c55ecc 0 45%,transparent 50%),
 radial-gradient(46px 46px at 80% 70%,#f59e0bcc 0 45%,transparent 50%),radial-gradient(30px 30px at 8% 60%,#3b82f6cc 0 45%,transparent 50%),
 radial-gradient(24px 24px at 55% 6%,#ec4899cc 0 45%,transparent 50%),
 radial-gradient(70% 45% at 50% 100%,#7a2a9c 0%,transparent 60%),radial-gradient(120% 70% at 50% 0%,#6a35b4 0%,#2f1a5e 45%,#120a2a 100%)}
.auth-shell>*,.panel-shell>*{position:relative;z-index:1}

/* inputs */
input,select{font-family:inherit;font-size:17px}
.input-group{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.input-group label{color:var(--text-dim);font-size:.85rem;font-weight:600}
.input{background:var(--bg-soft);border:1px solid var(--border);width:100%;color:var(--text);border-radius:10px;outline:none;padding:13px 14px;transition:border-color .15s}
.input:focus{border-color:var(--primary)}
.input::placeholder{color:#8f7db3}
.input-error{color:var(--danger);font-size:.8rem;min-height:1em;margin-bottom:8px}
.input-error:empty{display:none}
.input-password{position:relative}.input-password .input{padding-right:46px}
.input-eye{width:44px;height:100%;color:var(--text-dim);display:flex;align-items:center;justify-content:center;position:absolute;top:0;right:0}
select.input{appearance:none}

/* buttons */
.btn{cursor:pointer;text-transform:uppercase;letter-spacing:.04em;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:13px 26px;font-size:1rem;font-weight:700;transition:transform .12s,box-shadow .12s,opacity .12s;display:inline-flex}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn:not(:disabled):hover{transform:translateY(-2px)}
.btn:not(:disabled):active{transform:translateY(0)}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 8px 24px #7c5cff66}
.btn-accent{color:#042818;background:linear-gradient(135deg,#0f8,#00e055);box-shadow:0 8px 24px #00ff7873}
.btn-gold{color:#3d2a00;background:linear-gradient(135deg,#ffe082,#ffb300);box-shadow:0 8px 28px #ffb30073}
.btn-ghost{color:var(--text);border:1px solid var(--border);background:0 0}
.btn-danger{background:linear-gradient(135deg,var(--danger),#d63356);color:#fff}
.btn-sm{padding:9px 16px;font-size:.85rem}.btn-lg{padding:16px 36px;font-size:1.1rem}.btn-block{width:100%}

/* auth */
.auth-shell{position:fixed;inset:0;display:flex;flex-direction:column;height:100dvh;overflow:hidden}
.auth-page{height:100%;padding:calc(24px + env(safe-area-inset-top,0px)) 16px calc(24px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:22px;overflow:auto}
.site-logo-img{height:72px;width:auto;max-width:280px;object-fit:contain;object-position:left center;filter:drop-shadow(0 4px 10px #00000080)}
.site-logo-img.big{height:110px;max-width:80vw}
.site-logo{display:flex;flex-direction:column;line-height:.9;font-weight:900;letter-spacing:-.02em;font-style:italic;filter:drop-shadow(0 4px 10px #00000099)}
.site-logo .l1{font-size:1.5rem;color:#fff;-webkit-text-stroke:1px #4b1a9e;text-shadow:0 2px 0 #4b1a9e,0 0 14px #d84aff}
.site-logo .l2{font-size:1.25rem;color:#ffd83d;-webkit-text-stroke:1px #7a4d00;text-shadow:0 2px 0 #7a4d00;margin-left:14px}
.site-logo.big .l1{font-size:2.6rem}.site-logo.big .l2{font-size:2.2rem;margin-left:26px}
.auth-card{backdrop-filter:blur(14px);background:#180d2ed9;border:1px solid #d84aff47;width:100%;max-width:420px;box-shadow:0 24px 60px #00000073,0 0 32px #8c3cdc38;border-radius:18px;padding:28px}
.auth-card h1{margin-bottom:6px}
.auth-switch{text-align:center;color:var(--text-dim);margin-top:14px;font-size:.9rem}

/* panel */
.panel-shell{display:flex;flex-direction:column;min-height:100dvh}
.panel-topbar{z-index:40;justify-content:space-between;align-items:center;padding:12px 20px 10px;display:flex;position:sticky;top:0}
.panel-theme-btn{border:2px solid var(--border);width:42px;height:42px;color:var(--gold);background:#180d2eb8;border-radius:50%;flex-shrink:0;place-items:center;display:grid}
.panel-theme-btn svg{width:20px;height:20px}
html[data-theme=light]{--bg:#f3eefc;--bg-soft:#ffffff;--surface:#ffffff;--surface-2:#efe8ff;--border:#d9cdf5;--text:#1b1233;--text-dim:#6b6390}
html[data-theme=light] body{background:radial-gradient(1200px 600px at 80% -10%,#c9b2ff88,transparent 60%),#f3eefc}
html[data-theme=light] .panel-shell:before,html[data-theme=light] .auth-shell:before{opacity:.35}
html[data-theme=light] .panel-card{background:#ffffffd9}
html[data-theme=light] .money-input,html[data-theme=light] .entry-chip{background:#f4f0ff;color:#1b1233}
html[data-theme=light] .reward-box{background:#eef4ff}
html[data-theme=light] .bottom-nav{background:#ffffffee;border-top-color:#d9cdf5}
.panel-topbar-actions{align-items:center;gap:10px;display:flex}
.panel-balance{flex-direction:column;align-items:flex-end;gap:1px;display:flex;cursor:pointer}
.panel-balance-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);font-size:.62rem;font-weight:800}
.panel-balance-value{color:var(--accent);font-size:1rem;font-weight:800}
.panel-profile-btn{border:2px solid var(--border);background:linear-gradient(135deg,var(--primary),var(--accent-2));color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:42px;height:42px;font-size:1rem;font-weight:800;display:grid}
.demo-bar{background:#ffd16622;border:1px solid #ffd16688;color:#ffd166;font-size:.78rem;font-weight:800;text-align:center;padding:7px 10px;margin:0 16px;border-radius:10px;display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap}
.demo-bar button{background:#ffd166;color:#3d2a00;border-radius:999px;padding:4px 10px;font-size:.72rem;font-weight:800}
.panel-page{flex:1;width:100%;max-width:560px;margin:0 auto;padding:20px 16px 110px}
@media (min-width:900px){.panel-page{max-width:562px;padding-top:36px}}
.panel-card{isolation:isolate;background:#12102bd9;backdrop-filter:blur(16px);border:1px solid #d84aff47;border-radius:20px;padding:16px;position:relative;box-shadow:0 8px 32px #00000040}
.panel-card:before{content:"";pointer-events:none;z-index:0;position:absolute;inset:-2px;border-radius:22px;padding:2px;background:conic-gradient(from var(--card-spin),transparent 0deg 230deg,#a855f733 260deg,#a855f7 300deg,#ffd166 325deg,#d84aff 345deg,#8b5cf6 355deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:2.2s linear infinite card-border-spin}
.panel-card:after{content:"";pointer-events:none;z-index:-1;border-radius:26px;position:absolute;inset:-6px;box-shadow:0 0 14px #a855f773,0 0 28px #d84aff47;animation:1.3s ease-in-out infinite alternate fire-glow-pulse}
.panel-card>*{z-index:1;position:relative}
@keyframes card-border-spin{to{--card-spin:360deg}}
@keyframes pill-border-spin{to{--pill-spin:360deg}}
@keyframes fire-glow-pulse{from{opacity:.55}to{opacity:1}}
.panel-banner{border-radius:20px 20px 0 0;margin:-16px -16px 14px;position:relative;overflow:hidden;line-height:0}
.panel-banner img{width:100%;height:auto;display:block;object-fit:cover}
.panel-banner .online-fire-pill{top:14px;right:14px}
.online-fire-pill{z-index:2;isolation:isolate;background:#080a12e0;border-radius:999px;align-items:center;gap:7px;padding:7px 14px;font-size:.78rem;font-weight:700;display:inline-flex;position:absolute;top:12px;right:12px}
.online-fire-pill:before{content:"";pointer-events:none;z-index:-1;position:absolute;inset:-2px;border-radius:999px;padding:2px;background:conic-gradient(from var(--pill-spin),transparent 0deg 210deg,#ff64008c 250deg,#f50 290deg,#fd4 320deg,#f20 340deg,#f80 352deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:1.6s linear infinite pill-border-spin}
.online-fire-pill:after{content:"";pointer-events:none;z-index:-2;border-radius:999px;position:absolute;inset:-6px;box-shadow:0 0 10px #ff6400d9,0 0 20px #ff32008c;animation:.9s ease-in-out infinite alternate fire-glow-pulse}
.online-fire-pill .online-label{color:#ffffffb8;text-transform:lowercase}
.live-count{color:#ff2a2a;font-variant-numeric:tabular-nums;font-weight:900;text-shadow:0 0 8px #ff282899}
.panel-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin-bottom:8px;font-size:.72rem;font-weight:800}
.entry-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px;display:grid}
.entry-chip{border:1px solid var(--border);color:var(--text);text-align:center;background:#ffffff0d;border-radius:10px;padding:11px 6px;font-size:.9rem;font-weight:800;transition:all .15s}
.entry-chip{background:#151a3a;border-color:#2a3260}
.entry-chip:hover{border-color:#7db5ff}
.entry-chip.active{border-color:#bcd7ff;background:linear-gradient(180deg,#d6e6ff,#8fbcff);color:#0b1a33;box-shadow:0 6px 18px #7db5ff59}
.money-input{display:flex;align-items:center;gap:8px;background:#151a3a;border:1px solid #2a3260;border-radius:10px;padding:0 14px;margin-bottom:12px}
.money-input .prefix{font-weight:800;color:var(--text-dim)}
.money-input input{background:none;border:0;outline:none;color:var(--text);width:100%;padding:11px 0;font-weight:800}
.reward-box{background:#141c3d;border:1px solid #3a5ea8;border-radius:12px;text-align:center;margin-bottom:14px;padding:12px;box-shadow:inset 0 0 20px #3a5ea833}
.reward-box .label{color:var(--text-dim);font-size:.82rem}
.reward-box .value{color:#ffe045;font-size:1.5rem;font-weight:900;text-shadow:0 0 18px #ffd16659}
.panel-cta{width:100%;cursor:pointer;color:#042818;background:linear-gradient(180deg,#2bff7a,#12e352);border:none;border-radius:12px;padding:14px;font-size:1rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;box-shadow:0 8px 24px #00ff7873;transition:transform .12s}
.panel-cta:active{transform:scale(.98)}
.panel-cta:disabled{opacity:.5}
.bonus-line{text-align:center;color:var(--gold);font-size:.82rem;font-weight:700;margin-top:10px}
.bonus-line:empty{display:none}
.bonus-line .bar{height:6px;border-radius:99px;background:#ffffff14;margin-top:8px;overflow:hidden}
.bonus-line .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--gold))}

.bottom-nav{z-index:60;padding:10px 8px calc(10px + env(safe-area-inset-bottom));backdrop-filter:blur(12px);background:linear-gradient(#a855f71a,#0000 45%),#0f0b26f2;border-top:1px solid #d84aff47;justify-content:center;align-items:center;gap:clamp(6px,4vw,34px);display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -6px 24px #5a1ea04d}
.nav-item{color:var(--text-dim);flex-direction:column;align-items:center;gap:4px;min-width:60px;padding:4px 8px;font-size:.72rem;font-weight:600;display:flex}
.nav-item svg{width:22px;height:22px}
.nav-item.center{align-self:flex-end;margin-top:-30px}
.nav-item.center .nav-circle{isolation:isolate;background:radial-gradient(circle at 35% 30%,#35205e,#150a2c);border-radius:50%;place-items:center;width:60px;height:60px;display:grid;position:relative;box-shadow:0 0 18px #a855f766}
.nav-item.center .nav-circle:before{content:"";position:absolute;inset:-2px;border-radius:50%;padding:2px;background:conic-gradient(from var(--card-spin),transparent 0deg 220deg,#d84aff40 260deg,#d84aff 300deg,#ffd166 330deg,#a855f7 350deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:1.8s linear infinite card-border-spin}
.nav-bubble{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#d84aff 40%,#5a1ea0 100%);filter:drop-shadow(0 0 6px #d84aff8c);display:block;position:relative;z-index:1}
.nav-item.center span:last-child{color:#ffd166}

.live-toast{position:fixed;top:14px;left:50%;transform:translateX(-50%);background:#0e061af2;border:1px solid var(--border);border-radius:14px;padding:10px 16px;font-size:.85rem;z-index:80;box-shadow:0 10px 30px #00000099;white-space:nowrap;animation:pop .3s;display:flex;align-items:center;gap:10px}
.live-toast b{color:var(--accent)}
.live-toast.err b{color:var(--danger)}
.live-toast .live-toast-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:var(--gold);background:#ffd16624;border:1px solid #ffd16659;font-size:.8rem}
@keyframes pop{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}

/* ---------- game page ---------- */
html.game-active,html.game-active body{overscroll-behavior:none;touch-action:none;height:100dvh;overflow:hidden}
.game-page{width:100%;height:100dvh;box-sizing:border-box;padding:max(env(safe-area-inset-top,0px),58px) 12px max(env(safe-area-inset-bottom,0px),10px);touch-action:none;user-select:none;-webkit-user-select:none;flex-direction:column;align-items:center;display:flex;position:relative;overflow:hidden}
.game-bg{z-index:-1;position:fixed;inset:0;background:linear-gradient(180deg,#8ed3ff 0%,#63b6f4 40%,#a7dbf7 72%,#7cc48a 100%)}
.game-bg:before{content:"";position:absolute;inset:0;background:radial-gradient(160px 90px at 12% 78%,#ffffffcc,transparent 70%),radial-gradient(220px 110px at 80% 84%,#ffffffbb,transparent 70%),radial-gradient(120px 70px at 50% 70%,#ffffff99,transparent 70%),radial-gradient(240px 260px at 4% 45%,#2f9a5acc,transparent 70%),radial-gradient(200px 220px at 100% 40%,#3a8b4dbb,transparent 70%)}
.game-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#1b0a3a,#4a1040);opacity:var(--p,0);transition:opacity .8s}
.bb-hud{flex-shrink:0;width:100%;max-width:460px;margin-bottom:4px;padding:4px 4px 6px}
.bb-hud-top{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:6px;width:100%;display:grid}
.bb-hud-corner{color:#ffd23f;text-shadow:0 1px #000000a6,0 2px 8px #00000073;-webkit-text-stroke:.45px #050f23cc;white-space:nowrap;background:#0b2440a8;border-radius:999px;justify-self:start;align-items:center;gap:5px;padding:2px 8px;font-size:clamp(.82rem,3.6vw,1.05rem);font-weight:800;display:flex}
.bb-hud-corner--right{flex-direction:row-reverse;justify-self:end}
.bb-hud-icon{color:#ffc107;filter:drop-shadow(0 1px 2px #00000059);width:20px;height:20px}
.bb-hud-score{text-align:center;color:#00e676;letter-spacing:-.03em;-webkit-text-stroke:1.2px #0a1223cc;text-shadow:0 2px #0a1223bf,0 4px 14px #00000080,0 2px 10px #00e67659;font-size:clamp(1.35rem,6.2vw,2.2rem);font-weight:800;line-height:1;transition:color .5s}
.bb-hud-score.rising{animation:.5s hud-score-pop}
.bb-hud-score.ready{color:#ffc107;text-shadow:0 2px #0a1223c7,0 4px 16px #00000085,0 2px 14px #ffc1078c}
@keyframes hud-score-pop{0%{transform:scale(1)}40%{transform:scale(1.16)}to{transform:scale(1)}}
.bb-hud-progress{background:#08142c7a;border:1px solid #ffffff80;border-radius:999px;width:min(220px,58%);height:10px;margin:6px auto 0;position:relative;overflow:hidden;box-shadow:inset 0 1px 2px #00000059}
.bb-hud-progress.complete{border-color:#ffe678cc;box-shadow:inset 0 1px 2px #00000059,0 0 14px #ffc10773}
.bb-hud-progress.complete:after{content:"";background:linear-gradient(110deg,#0000 0%,#ffffff0d 30%,#ffffffbf 50%,#ffffff0d 70%,#0000 100%);animation:1.2s linear infinite progress-sweep;position:absolute;inset:0;transform:translate(-140%)}
@keyframes progress-sweep{to{transform:translate(140%)}}
.bb-hud-progress-fill{background:#ffffff8c;border-radius:999px;height:100%;transition:width .12s linear}
.bb-hud-progress-fill.complete{background:linear-gradient(90deg,#ffc107,#ffe082);box-shadow:0 0 8px #ffc1078c}
.board-wrap.bubble-wrap{flex:1 1 0;justify-content:center;align-items:center;width:100%;max-width:460px;min-height:0;display:flex}
.bubble-stage{aspect-ratio:360/510;width:auto;max-width:100%;height:100%;max-height:100%;position:relative}
.bubble-canvas{aspect-ratio:360/510;touch-action:none;cursor:crosshair;border-radius:18px;width:100%;height:100%;display:block;background:#0b2a4a4d;box-shadow:inset 0 0 0 1px #ffffff22}
.demo-badge{position:absolute;top:8px;left:8px;background:#ffd166;color:#3d2a00;font-size:.62rem;font-weight:900;letter-spacing:.1em;padding:3px 8px;border-radius:999px;z-index:5}
.game-dock{flex-shrink:0;justify-content:center;align-items:center;width:100%;max-width:460px;min-height:48px;margin-top:8px;display:flex;position:relative}
.game-dock .cashout-btn{width:min(100%,340px);margin:0 auto}
.game-dock .game-mute-btn{position:absolute;bottom:0;right:0}
.game-mute-btn{z-index:85;width:clamp(42px,11vw,48px);height:clamp(42px,11vw,48px);color:var(--text);background:#080c18b8;border:1px solid #ffffff24;border-radius:50%;place-items:center;display:grid;box-shadow:0 6px 20px #00000059}
.game-mute-btn svg{width:22px;height:22px}
.game-mute-btn.muted{color:var(--danger);border-color:#ff547059}
.cashout-ready{animation:1.1s infinite cashout-pulse;position:relative}
@keyframes cashout-pulse{0%,to{box-shadow:0 8px 28px #ffb30073,0 0 #ffc1078c}50%{box-shadow:0 8px 28px #ffb30073,0 0 0 14px #ffc10700}}
.game-page.cashout-ready-page:after{content:"";pointer-events:none;z-index:70;position:absolute;inset:0;box-shadow:inset 0 0 42px 10px #ffb30057,inset 0 0 88px 22px #ffc10729;animation:1.8s ease-in-out infinite cashout-screen-glow}
@keyframes cashout-screen-glow{0%,to{opacity:.55}50%{opacity:1}}
.board-locked-msg{text-align:center;color:#fff;text-shadow:0 2px 14px #ff5470a6,0 1px 3px #00000080;margin-top:6px;font-size:1rem;font-weight:900;animation:.45s cubic-bezier(.34,1.56,.64,1) both locked-msg-in}
@keyframes locked-msg-in{0%{opacity:0;transform:translateY(10px)scale(.7)}to{opacity:1;transform:none}}
.gain-float{left:var(--gx,50%);top:var(--gy,50%);color:#0f8;text-shadow:0 0 12px #00ff888c,0 2px 8px #00000073;pointer-events:none;z-index:30;font-size:1.35rem;font-weight:900;animation:1.1s forwards gain-rise;position:absolute;transform:translate(-50%,-50%)}
@keyframes gain-rise{0%{opacity:0;transform:translate(-50%,10px)scale(.8)}20%{opacity:1}to{opacity:0;transform:translate(-50%,-46px)scale(1.15)}}
.clear-shout{pointer-events:none;z-index:32;flex-direction:column;align-items:center;gap:6px;display:flex;position:absolute;top:38%;left:50%;transform:translate(-50%);animation:1.2s cubic-bezier(.34,1.45,.64,1) forwards clear-shout-bubble}
.clear-shout.shout-good{--shout-c:#00e676}.clear-shout.shout-cool{--shout-c:#3b82f6}.clear-shout.shout-strong{--shout-c:#ffa726}.clear-shout.shout-awesome{--shout-c:#9b59d0}.clear-shout.shout-amazing{--shout-c:#f7d54a}.clear-shout.shout-best{--shout-c:#f2455c}.clear-shout.shout-boom{--shout-c:#ff6b35}
.clear-shout-word{letter-spacing:-.03em;color:var(--shout-c,#00e676);-webkit-text-stroke:1.35px #0a1223d1;paint-order:stroke fill;text-shadow:0 2px 0 #0a1223bf,0 4px 14px #00000080;font-size:clamp(1.7rem,7.4vw,2.35rem);font-weight:800;white-space:nowrap}
.clear-shout-combo{letter-spacing:.08em;text-transform:uppercase;color:#ffb84d;-webkit-text-stroke:.45px #050f23cc;background:#08122a6b;border:1px solid #ffffff6b;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:clamp(.72rem,3.2vw,.88rem);font-weight:800;display:inline-flex}
.clear-shout-combo span{color:#00e676;font-size:1.15em}
@keyframes clear-shout-bubble{0%{opacity:0;transform:translate(-50%,14px)scale(.42)}20%{opacity:1;transform:translate(-50%)scale(1.16)}38%{transform:translate(-50%,-3px)scale(1)}78%{opacity:1}to{opacity:0;transform:translate(-50%,-30px)scale(1.05)}}

/* ---------- modals ---------- */
.modal-overlay{backdrop-filter:blur(6px);z-index:100;background:#05070fbf;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}
.modal-overlay--clear{backdrop-filter:none;background:#05070f59}
.modal{background:var(--surface);border:1px solid var(--border);width:100%;max-width:440px;box-shadow:var(--shadow);border-radius:18px;padding:28px;animation:.25s modal-pop;position:relative;overflow:hidden}
@keyframes modal-pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
.result-modal{text-align:center}
.result-value{margin:10px 0;font-size:2.2rem;font-weight:900}
.result-value.win{background:linear-gradient(135deg,#ffe600 0%,#ffb800 50%,#ff9500 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 2px 10px #ffd20099);font-size:3rem;animation:.45s .28s both win-fade-up}
.result-value.lose{color:var(--danger);text-shadow:0 2px 18px #ff547073}
.result-modal--win:before{content:"";pointer-events:none;background:radial-gradient(at 50% -10%,#ffd2002e 0%,#0000 65%);position:absolute;inset:-30px}
.win-trophy{background:radial-gradient(circle at 38% 30%,#ffdc004d,#ffa00014);border:1.5px solid #ffd70080;border-radius:50%;place-items:center;width:88px;height:88px;margin:0 auto 14px;font-size:2.6rem;animation:.55s cubic-bezier(.34,1.56,.64,1) both win-pop;display:grid;box-shadow:0 0 20px #ffd70059,0 0 55px #ffd70026}
@keyframes win-pop{0%{opacity:0;transform:scale(.25)rotate(-12deg)}to{opacity:1;transform:none}}
.result-modal--win h2{letter-spacing:-.03em;font-size:2rem;animation:.4s .14s both win-fade-up}
@keyframes win-fade-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.win-note-top{color:var(--text-dim);margin-bottom:4px}
.win-note{color:var(--text-dim);margin-bottom:22px;font-size:.88rem}
.win-actions{gap:10px;display:flex}
.win-confetti-piece{width:7px;height:11px;top:0;left:calc(8% + var(--i,0) * 12%);background:hsl(calc(var(--i,0) * 47deg),92%,62%);animation:confetti-fall calc(.7s + var(--i,0) * 80ms) ease-in calc(var(--i,0) * 60ms) both;pointer-events:none;border-radius:2px;position:absolute}
@keyframes confetti-fall{0%{opacity:1;transform:translateY(-18px)rotate(0)}to{transform:translateY(200px) rotate(calc(90deg + var(--i,0) * 35deg));opacity:0}}
.result-modal--lose h2{letter-spacing:-.02em;font-size:1.5rem}
.lose-badge{width:78px;height:78px;color:var(--danger);background:radial-gradient(circle at 35% 28%,#ff547052,#ff547014);border:1px solid #ff547066;border-radius:50%;place-items:center;margin:2px auto 16px;animation:.55s cubic-bezier(.36,.07,.19,.97) .18s both lose-shake;display:grid;box-shadow:0 0 30px #ff547047}
@keyframes lose-shake{0%,to{transform:none}20%{transform:translate(-7px)rotate(-5deg)}40%{transform:translate(7px)rotate(4deg)}60%{transform:translate(-5px)rotate(-2deg)}80%{transform:translate(3px)rotate(1deg)}}
.result-note{color:var(--text-dim);margin-bottom:22px;font-size:.95rem;line-height:1.55}
.result-note b{color:var(--gold)}
.result-actions{flex-direction:column;gap:10px;display:flex}
.replay-picker-modal{max-width:460px}

/* sheets */
.sheet-overlay{backdrop-filter:blur(5px);z-index:110;background:#05070fb8;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}
.sheet{border:1px solid var(--border);width:100%;max-width:560px;max-height:88vh;padding:8px 20px calc(24px + env(safe-area-inset-bottom,0px));background:#10141f;border-bottom:none;border-radius:26px 26px 0 0;animation:.3s cubic-bezier(.22,1,.36,1) sheet-up;overflow:hidden auto;position:relative}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@media (min-width:600px){.sheet-overlay{align-items:center;padding:16px}.sheet{border-radius:26px;border-bottom:1px solid var(--border)}}
.sheet-header{justify-content:space-between;align-items:center;margin:10px 0 18px;display:flex}
.sheet-hero{border-radius:26px 26px 0 0;margin:-8px -20px 18px;height:150px;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:900;font-size:1.5rem;line-height:1.05;text-shadow:0 3px 0 #0000005c;position:relative;overflow:hidden}
.hero-green{background:linear-gradient(135deg,#0f7a4a,#1ed77a 60%,#9dffd0)}
.hero-gold{background:linear-gradient(135deg,#7a4d0f,#ffc83d 60%,#fff0b8);color:#2b1a00;text-shadow:none}
.hero-purple{background:linear-gradient(135deg,#3b1f9a,#8d3bff 60%,#e0b3ff)}
.sheet-close{color:#fff;background:#b414148c;border:none;border-radius:50%;place-items:center;width:40px;height:40px;font-size:1.1rem;display:grid;backdrop-filter:blur(4px)}
.sheet-close-overlay{position:absolute;top:12px;right:12px}
.sheet-section{border:1px solid var(--border);background:#ffffff0a;border-radius:16px;margin-bottom:14px;padding:16px}
.sheet-cta{cursor:pointer;color:#05281e;background:linear-gradient(135deg,var(--accent),#00b386);border:none;border-radius:999px;width:100%;margin-top:6px;padding:17px;font-size:1.05rem;font-weight:800;box-shadow:0 8px 26px #00e5a84d}
.sheet-cta:disabled{opacity:.5}
.seg{display:flex;background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:4px;gap:4px;margin-bottom:10px}
.seg button{flex:1;padding:11px;border-radius:9px;font-weight:700;font-size:.85rem;color:var(--text-dim)}
.seg button.on{background:var(--primary);color:#fff}
.quick-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0;display:grid}
.quick-value{border:1px solid var(--border);color:var(--text);text-align:center;background:#ffffff0a;border-radius:14px;padding:20px 8px 14px;font-size:1.05rem;font-weight:800;transition:all .15s;position:relative}
.quick-value.active,.quick-value:hover{border-color:var(--accent);background:#00e5a814}
.quick-badge{letter-spacing:.05em;color:#fff;white-space:nowrap;border-radius:999px;padding:3px 10px;font-size:.62rem;font-weight:800;position:absolute;top:-9px;left:50%;transform:translate(-50%)}
.quick-value.bonus-glow{border-color:#f5c518cc}
.pix-view{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:4px 0 8px;display:flex}
.big-amount{font-size:2rem;font-weight:900;color:var(--gold)}
.instr{background:var(--bg-soft);border:1px solid var(--border);border-radius:12px;padding:12px;font-size:.9rem;width:100%}
.instr div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border)}
.instr div:last-child{border:0}
.instr small{color:var(--text-dim)}.instr code{font-size:.95rem;font-weight:800;color:#fff;letter-spacing:.04em}
.instr button{color:var(--accent);font-weight:800;font-size:.75rem}
.pix-new-btn{border:1px solid var(--border);width:100%;color:var(--text);border-radius:12px;margin-top:4px;padding:14px;font-size:15px;font-weight:600}
.row-balance{display:flex;align-items:center;gap:12px;background:#00e5a814;border:1px solid #00e5a84d;border-radius:14px;padding:12px 14px;margin:0 0 12px}
.row-balance .ico{width:36px;height:36px;border-radius:50%;background:var(--accent);color:#042818;font-weight:900;display:grid;place-items:center}
.row-balance small{display:block;color:var(--text-dim);font-size:.7rem;letter-spacing:.08em;font-weight:800}
.row-balance b{color:var(--danger);font-size:1.3rem}
.withdraw-restriction{background:#ffffff0a;border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:.78rem;color:var(--text-dim);line-height:1.45;margin-bottom:10px}
.list{list-style:none}
.list li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border);font-size:.85rem}
.list li small{display:block;color:var(--text-dim);font-size:.72rem}
.list li b{white-space:nowrap}
.tag{font-size:.65rem;padding:3px 8px;border-radius:99px;background:#ffffff14;color:var(--text-dim);white-space:nowrap}
.tag.paid,.tag.completed,.tag.WON{background:#00e5a824;color:var(--accent)}
.tag.pending,.tag.processing,.tag.active{background:#ffd16624;color:var(--gold)}
.tag.rejected,.tag.expired,.tag.failed,.tag.LOST,.tag.FORFEIT{background:#ff547024;color:var(--danger)}
.list .pos{color:var(--accent)}.list .neg{color:var(--danger)}
.list li.empty{justify-content:center;color:var(--text-dim);padding:18px}
.ref-card{color:#fff;background:linear-gradient(135deg,#0e9c62,#16b874);border-radius:18px;margin-bottom:14px;padding:20px}
.ref-card .row{justify-content:space-between;gap:12px;margin-bottom:14px;display:flex}
.ref-card .label{letter-spacing:.08em;text-transform:uppercase;opacity:.85;font-size:.7rem;font-weight:800}
.ref-card .big{font-size:1.6rem;font-weight:900}.ref-card .small{opacity:.85;font-size:.78rem}
.ref-card .cta{color:#fff;background:#ffffff38;border-radius:999px;width:100%;padding:13px;font-weight:800}
.ref-card .cta:disabled{opacity:.5}
.copy-row{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.copy-row .input{margin:0;font-size:.8rem}
.ref-levels{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:8px;display:grid}
.ref-level{text-align:center;background:#00e5a80f;border:1px solid #00e5a84d;border-radius:16px;padding:16px}
.ref-level .tier{color:var(--accent);font-size:1.05rem;font-weight:900}
.ref-level .tier-sub{color:var(--text-dim);margin-bottom:4px;font-size:.75rem}
.ref-level .rate{color:var(--gold);font-size:.7rem;font-weight:700;margin-bottom:8px}
.ref-level .count{font-size:1.6rem;font-weight:900}
.ref-level .count-sub{color:var(--text-dim);letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px;font-size:.7rem}
.ref-level .vol{font-size:.95rem;font-weight:800}
.who{display:flex;gap:12px;align-items:center}
.winner-avatar{background:linear-gradient(135deg,var(--primary),var(--accent-2));color:#fff;border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;font-weight:800;display:grid}
.winner-avatar.big{width:52px;height:52px;font-size:1.3rem}
.profile-user-info{min-width:0;flex:1}
.profile-user-name{text-overflow:ellipsis;white-space:nowrap;font-weight:800;overflow:hidden;text-transform:uppercase}
.profile-user-phone{color:var(--text-dim);font-size:.85rem}
.profile-ref-row{align-items:center;gap:8px;margin-top:8px;display:flex}
.profile-ref-link{min-width:0;color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;flex:1;font-family:monospace;font-size:.72rem;overflow:hidden}
.profile-ref-copy{border:1px solid var(--border);color:var(--text);background:#ffffff0d;border-radius:999px;flex-shrink:0;padding:5px 10px;font-size:.72rem;font-weight:700}
.quick-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 14px;display:grid}
.quick-stat{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:12px;padding:14px 10px}
.quick-stat .v{font-size:clamp(.95rem,4.2vw,1.15rem);font-weight:800}
.quick-stat .l{color:var(--text-dim);margin-top:4px;font-size:.72rem}
details.sheet-section summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-size:.72rem;letter-spacing:.1em;font-weight:800;color:var(--text-dim)}
details.sheet-section summary::-webkit-details-marker{display:none}
.profile-history-toggle{border:1px solid var(--border);color:var(--text-dim);background:#ffffff0d;border-radius:999px;padding:5px 12px;font-size:.72rem;font-weight:700;letter-spacing:0;text-transform:none}
details[open] summary{margin-bottom:10px}