:root{--indigo: #6d00ff;--blue-purple: #8631e8;--lilac: #b56dc7;--turquoise: #00ffce;--viking: #62d0d1;--jelly: #2e7d9b;--navy: #1d2a5b;--goldenrod: #ffde65;--mikado: #ffc011;--tangerine: #ffaa15;--mandy: #eb5065;--leaf: #00a255;--coral: #e57373;--ink: #040503;--gray: #818280;--paper: #f1f3f7;--white: #ffffff;--text: #232a3d;--muted: #5e6578;--grad-base: linear-gradient(135deg, #3fd3cf 0%, #2e7d9b 45%, #29306b 100%);--grad-gold: linear-gradient(135deg, #ffe46b 0%, #ffaa15 60%, #f07b16 100%);--grad-purple: linear-gradient(135deg, #b55ce6 0%, #6d00ff 100%);--font-display: "Nunito", system-ui, sans-serif;--font-ui: "Ubuntu", system-ui, sans-serif;--radius-s: 10px;--radius-m: 18px;--radius-l: 28px;--shadow-pop: 0 6px 0 rgba(29, 42, 91, .18);--focus: 0 0 0 3px #fff, 0 0 0 6px var(--indigo)}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font-ui);font-size:16px;line-height:1.5;color:var(--text);background:var(--paper);-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:var(--jelly)}h1,h2,h3{font-family:var(--font-display);line-height:1.1;margin:0 0 .4em;color:var(--navy)}h1{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:900;letter-spacing:-.01em}h2{font-size:clamp(1.4rem,2.6vw,1.9rem);font-weight:900}h3{font-size:1.15rem;font-weight:800}p{margin:0 0 1em}:focus-visible{outline:none;box-shadow:var(--focus);border-radius:6px}.container{width:min(1180px,100% - 32px);margin-inline:auto}.muted{color:var(--muted)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.topbar{background:var(--grad-base);color:#fff;position:relative;z-index:5}.topbar__inner{display:flex;align-items:center;gap:24px;min-height:72px}.topbar__logo img{height:40px;width:auto}.topbar nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;align-items:center}.topbar nav a{color:#fff;text-decoration:none;font-weight:500;padding:8px 14px;border-radius:999px}.topbar nav a:hover{background:#ffffff24}.topbar nav a.active{background:#fff;color:var(--navy)}.topbar__me{display:flex;align-items:center;gap:8px}@media(max-width:720px){.topbar__inner{flex-wrap:wrap;padding:10px 0;gap:8px}.topbar__logo img{height:32px}.topbar nav{margin-left:0;width:100%}.topbar nav a{padding:6px 10px;font-size:.92rem}}.footer{background:var(--navy);color:#fffc;margin-top:64px;padding:28px 0;font-size:.9rem}.footer .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.footer img{height:34px;width:auto}.btn{--btn-bg: var(--indigo);--btn-fg: #fff;--btn-edge: #4a00ad;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-display);font-weight:800;font-size:1.05rem;padding:12px 22px;border-radius:999px;border:0;cursor:pointer;text-decoration:none;color:var(--btn-fg);background:var(--btn-bg);box-shadow:0 5px 0 var(--btn-edge);transition:transform .08s ease,box-shadow .08s ease}.btn:hover{filter:brightness(1.06)}.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--btn-edge)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn--gold{--btn-bg: var(--mikado);--btn-fg: var(--navy);--btn-edge: #d18a00}.btn--leaf{--btn-bg: var(--leaf);--btn-edge: #00733c}.btn--ghost{--btn-bg: #fff;--btn-fg: var(--navy);--btn-edge: #c9cfdc}.btn--danger{--btn-bg: #fff;--btn-fg: var(--mandy);--btn-edge: #f2b8c0}.btn--small{font-size:.92rem;padding:8px 14px;box-shadow:0 3px 0 var(--btn-edge)}.btn--big{font-size:1.3rem;padding:16px 30px}.field{display:grid;gap:6px}.field label{font-weight:700;font-family:var(--font-display);color:var(--navy)}.field small{color:var(--muted)}.field input,.field select,.field textarea{font:inherit;padding:12px 14px;border-radius:var(--radius-s);border:2px solid #d5dae6;background:#fff;color:var(--text)}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--indigo)}.field--error input{border-color:var(--mandy)}.field .error{color:#c22a40;font-size:.88rem}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-grid .span-2{grid-column:1 / -1}@media(max-width:600px){.form-grid{grid-template-columns:1fr}}.alert{padding:12px 16px;border-radius:var(--radius-s);background:#fde7ea;color:#9b1c30;font-weight:500}.alert--ok{background:#dff6ea;color:#00663a}.panel{background:#fff;border-radius:var(--radius-l);padding:24px;border:2px solid #e3e7f0}.page{padding:40px 0 0}.page-head{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}.page-head p{margin:0;color:var(--muted);max-width:60ch}.clouds{position:relative;overflow:hidden}.clouds:before,.clouds:after{content:"";position:absolute;z-index:0;border-radius:50%;pointer-events:none}.clouds:before{width:360px;height:220px;right:-120px;top:-90px;background:radial-gradient(circle at 30% 60%,var(--coral) 0 38%,transparent 39%),radial-gradient(circle at 62% 45%,var(--coral) 0 34%,transparent 35%),radial-gradient(circle at 85% 70%,#fc9651 0 30%,transparent 31%);opacity:.9}.clouds:after{width:300px;height:200px;left:-130px;bottom:-110px;background:radial-gradient(circle at 40% 40%,var(--leaf) 0 36%,transparent 37%),radial-gradient(circle at 70% 55%,var(--leaf) 0 30%,transparent 31%)}.clouds>*{position:relative;z-index:1}.avatar{border-radius:50%;background:radial-gradient(circle at 50% 35%,#fff 0 45%,#dfe9f5);border:3px solid #fff;box-shadow:0 2px #0000001f;object-fit:contain;flex:none}.hero{background:var(--grad-base);color:#fff;padding:56px 0 120px;position:relative;overflow:hidden}.hero h1{color:#fff;font-size:clamp(2.4rem,6vw,4.4rem);max-width:12ch}.hero p{font-size:1.15rem;max-width:46ch;color:#ffffffeb}.hero__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:32px;align-items:center}.hero__cast{position:relative;height:380px}.hero__cast img{position:absolute;width:44%;filter:drop-shadow(0 10px 14px rgba(0,0,0,.25))}.hero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}@media(max-width:820px){.hero__grid{grid-template-columns:1fr}.hero__cast{height:260px}}.games-shelf{margin-top:-80px;position:relative;z-index:2}.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}@media(max-width:1000px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.game-grid{grid-template-columns:1fr}}.game-box{display:block;text-decoration:none;color:inherit;background:#fff;border-radius:var(--radius-m);overflow:hidden;border:3px solid #fff;box-shadow:0 10px #1d2a5b1f,0 18px 30px #1d2a5b1f;transform:rotate(var(--tilt, 0deg));transition:transform .18s ease}.game-box:hover,.game-box:focus-visible{transform:rotate(0) translateY(-6px)}.game-box img{aspect-ratio:4 / 3;object-fit:cover;width:100%}.game-box__body{padding:14px 16px 18px}.game-box__body h3{margin:0 0 2px}.game-box__theme{font-weight:700;color:var(--jelly);font-size:.95rem}.game-box__dots{display:flex;gap:6px;margin-top:10px}.game-box__dots span{width:18px;height:18px;border-radius:5px;border:2px solid var(--ink)}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.steps>div{background:#fff;border-radius:var(--radius-m);padding:20px;border:2px solid #e3e7f0}.steps strong{font-family:var(--font-display);font-size:2rem;color:var(--indigo);display:block;line-height:1}@media(max-width:760px){.steps{grid-template-columns:1fr}}.lobby{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;align-items:start}@media(max-width:900px){.lobby{grid-template-columns:1fr}}.lobby__board{border-radius:var(--radius-l);overflow:hidden;border:4px solid #fff;box-shadow:var(--shadow-pop)}.cast{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.cast figure{margin:0;text-align:center}.cast img{aspect-ratio:1;object-fit:contain;width:100%}.cast figcaption{font-size:.78rem;font-weight:700;line-height:1.2}.cast .tag{display:inline-block;font-size:.7rem;padding:1px 8px;border-radius:999px;color:#fff;margin-top:3px}.tag--guardian{background:var(--leaf)}.tag--villain{background:var(--mandy)}@media(max-width:520px){.cast{grid-template-columns:repeat(3,minmax(0,1fr))}}.legend{display:grid;gap:8px;padding:0;margin:0;list-style:none}.legend li{display:flex;align-items:center;gap:10px;font-weight:500}.swatch{width:26px;height:26px;border-radius:7px;border:3px solid var(--ink);flex:none}.opponents{display:flex;gap:8px;flex-wrap:wrap}.opponents button{font:inherit;font-weight:700;border:2px solid #d5dae6;background:#fff;border-radius:var(--radius-s);padding:10px 14px;cursor:pointer;color:var(--navy)}.opponents button[aria-pressed=true]{border-color:var(--indigo);background:#f1e8ff}.play{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start;padding-top:22px}@media(max-width:980px){.play{grid-template-columns:1fr}}.board{position:relative;width:100%;aspect-ratio:1866 / 1800;border-radius:var(--radius-l);overflow:hidden;background:var(--navy) center / cover no-repeat;border:4px solid #fff;box-shadow:var(--shadow-pop)}.pawn{position:absolute;width:6.2%;aspect-ratio:1;transform:translate(-50%,-78%);transition:left .2s ease-out,top .2s ease-out;z-index:3;pointer-events:none}.pawn__head{width:100%;height:100%;border-radius:50%;border:3px solid #fff;overflow:hidden;background:var(--pin);box-shadow:0 4px #00000059}.pawn__head img{width:100%;height:100%;object-fit:contain;background:#ffffffd9}.pawn__pin{position:absolute;left:50%;bottom:-26%;transform:translate(-50%);width:34%;height:34%;background:var(--pin);clip-path:polygon(50% 100%,0 0,100% 0)}.pawn--active .pawn__head{animation:bob .9s ease-in-out infinite;border-color:var(--mikado)}.pawn--hop{animation:hop .23s ease-out infinite}@keyframes bob{50%{transform:translateY(-14%)}}@keyframes hop{50%{transform:translate(-50%,-110%)}}.sidebar{display:grid;gap:16px}.turn-card{background:#fff;border-radius:var(--radius-l);padding:18px;border:2px solid #e3e7f0;display:grid;gap:14px}.turn-card__who{display:flex;align-items:center;gap:12px}.turn-card__who strong{font-family:var(--font-display);font-size:1.25rem;color:var(--navy);display:block;line-height:1.1}.players{list-style:none;margin:0;padding:0;display:grid;gap:8px}.players li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--radius-s);background:var(--paper)}.players li.current{background:#fff6d6;outline:2px solid var(--mikado)}.players .pin-dot{width:14px;height:14px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:-1px}.players .tile{font-family:var(--font-display);font-weight:900;font-size:1.2rem;color:var(--navy)}.players small{color:var(--muted)}.log{max-height:240px;overflow:auto;padding:0;margin:0;list-style:none;font-size:.9rem;display:grid;gap:6px}.log li{padding:6px 10px;border-radius:8px;background:var(--paper)}.dice-wrap{display:flex;align-items:center;gap:16px}.dice{width:74px;height:74px;border-radius:16px;background:#fff;border:3px solid var(--ink);display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:9px;gap:2px;box-shadow:0 5px 0 var(--ink);flex:none}.dice span{border-radius:50%;background:var(--ink);margin:2px;visibility:hidden}.dice span.on{visibility:visible}.dice--rolling{animation:tumble .5s linear infinite}@keyframes tumble{0%{transform:rotate(0)}25%{transform:rotate(14deg) translateY(-6px)}75%{transform:rotate(-14deg)}to{transform:rotate(0)}}.overlay{position:fixed;inset:0;background:#0f14309e;display:grid;place-items:center;z-index:50;padding:16px;animation:fade .15s ease-out}@keyframes fade{0%{opacity:0}}.modal{background:#fff;border-radius:var(--radius-l);width:min(620px,100%);max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 14px #0003;animation:pop .22s cubic-bezier(.2,1.4,.4,1)}@keyframes pop{0%{transform:scale(.85);opacity:0}}.modal__band{padding:16px 24px;color:#fff;font-family:var(--font-display);font-weight:900;font-size:1.2rem;display:flex;align-items:center;gap:10px}.modal__band--light{color:var(--ink)}.modal__body{padding:22px 24px 26px}.question{font-family:var(--font-display);font-weight:800;font-size:clamp(1.25rem,2.6vw,1.6rem);color:var(--navy);line-height:1.25;margin-bottom:18px}.options{display:grid;gap:12px}.option{display:grid;grid-template-columns:40px 1fr;align-items:center;gap:12px;text-align:left;font:inherit;font-size:1.05rem;padding:14px 16px;border-radius:var(--radius-m);border:3px solid #d5dae6;background:#fff;cursor:pointer;color:var(--text)}.option:hover:not(:disabled){border-color:var(--indigo);background:#f6f0ff}.option b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:#fff;font-family:var(--font-display)}.option--right{border-color:var(--leaf);background:#e2f7ec}.option--right b{background:var(--leaf)}.option--wrong{border-color:var(--mandy);background:#fde8eb}.option--wrong b{background:var(--mandy)}.option:disabled{cursor:default}.feedback{margin-top:18px;padding:14px 16px;border-radius:var(--radius-m);font-weight:500}.feedback--right{background:#e2f7ec;color:#00592f}.feedback--wrong{background:#fde8eb;color:#8c1427}.feedback strong{font-family:var(--font-display);font-size:1.15rem;display:block}.modal__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.category-btn{font:inherit;font-family:var(--font-display);font-weight:800;font-size:1.1rem;padding:18px 14px;border-radius:var(--radius-m);border:3px solid var(--ink);cursor:pointer;color:#fff;box-shadow:0 5px 0 var(--ink)}.category-btn--light{color:var(--ink)}.category-btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ink)}.character-card{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center}.character-card img{width:180px;height:180px;object-fit:contain}.character-card .effect{font-family:var(--font-display);font-weight:900;font-size:1.6rem}@media(max-width:520px){.character-card{grid-template-columns:1fr;text-align:center}.character-card img{margin:0 auto}}.burst{display:inline-block;padding:6px 14px;color:#fff;font-family:var(--font-display);font-weight:900;border-radius:6px;transform:rotate(-3deg)}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs button{font:inherit;font-weight:700;padding:8px 16px;border-radius:999px;border:2px solid #d5dae6;background:#fff;cursor:pointer;color:var(--navy)}.tabs button[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}.podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;align-items:end;margin:24px 0}.podium>div{text-align:center;background:#fff;border-radius:var(--radius-l) var(--radius-l) 0 0;padding:18px 10px;border:2px solid #e3e7f0;border-bottom:0}.podium .place{font-family:var(--font-display);font-weight:900;font-size:2.6rem;line-height:1}.podium .p1{background:var(--grad-gold);border-color:transparent;padding-top:28px}.podium .p1 .place{color:var(--navy)}.podium .p2 .place{color:var(--gray)}.podium .p3 .place{color:#c07a3a}.podium a{color:inherit;text-decoration:none;font-weight:800;font-family:var(--font-display)}.podium .avatar{margin:8px auto}.rank-table{width:100%;border-collapse:separate;border-spacing:0 6px}.rank-table th{text-align:left;font-size:.85rem;color:var(--muted);font-weight:500;padding:0 12px}.rank-table td{background:#fff;padding:10px 12px}.rank-table td:first-child{border-radius:12px 0 0 12px;font-family:var(--font-display);font-weight:900;font-size:1.15rem;color:var(--navy);width:56px;text-align:center}.rank-table td:last-child{border-radius:0 12px 12px 0}.rank-table tr.me td{background:#fff6d6}.rank-table .who{display:flex;align-items:center;gap:10px}.rank-table .who a{color:var(--navy);font-weight:700;text-decoration:none}.rank-table .num{text-align:right;font-variant-numeric:tabular-nums}.rank-table .score{font-family:var(--font-display);font-weight:900;font-size:1.1rem;color:var(--indigo)}@media(max-width:640px){.rank-table .hide-sm{display:none}}.profile-head{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;background:var(--grad-base);color:#fff;border-radius:var(--radius-l);padding:24px}.profile-head h1{color:#fff;margin:0;font-size:clamp(1.8rem,4vw,2.6rem)}.profile-head p{margin:4px 0 0;color:#ffffffe6}@media(max-width:700px){.profile-head{grid-template-columns:1fr;text-align:center}.profile-head .avatar{margin:0 auto}}.stat-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:18px 0}.stat-row>div{background:#fff;border-radius:var(--radius-m);padding:14px;border:2px solid #e3e7f0}.stat-row b{font-family:var(--font-display);font-size:1.8rem;font-weight:900;color:var(--navy);display:block;line-height:1.1}.stat-row span{color:var(--muted);font-size:.9rem}@media(max-width:760px){.stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media(max-width:860px){.two-col{grid-template-columns:1fr}}.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}.badge{border-radius:var(--radius-m);padding:12px;background:var(--paper);border:2px dashed #cfd5e3;opacity:.55}.badge--on{opacity:1;background:#fff6d6;border:2px solid var(--mikado)}.badge strong{font-family:var(--font-display);display:block;color:var(--navy)}.badge small{color:var(--muted)}.bar{height:12px;border-radius:999px;background:var(--paper);overflow:hidden;border:1px solid #dde2ec}.bar>i{display:block;height:100%}.cat-stats{display:grid;gap:10px}.cat-stats .row{display:grid;grid-template-columns:1fr 70px;gap:8px;align-items:center;font-size:.92rem}.history{list-style:none;padding:0;margin:0;display:grid;gap:8px}.history li{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;background:var(--paper);padding:8px 12px;border-radius:var(--radius-s)}.history img{width:44px;height:33px;object-fit:cover;border-radius:6px}.avatar-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px}.avatar-picker button{border:3px solid transparent;background:var(--paper);border-radius:var(--radius-m);padding:4px;cursor:pointer}.avatar-picker button[aria-pressed=true]{border-color:var(--indigo);background:#f1e8ff}.avatar-picker img{aspect-ratio:1;object-fit:contain;width:100%}.auth{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 72px)}.auth__art{background:var(--grad-purple);display:grid;place-items:center;padding:32px;color:#fff;text-align:center}.auth__art img{width:min(320px,70%);filter:drop-shadow(0 12px 18px rgba(0,0,0,.3))}.auth__art h2{color:#fff}.auth__form{padding:48px clamp(16px,5vw,64px);display:grid;align-content:center;gap:18px;max-width:640px}@media(max-width:820px){.auth{grid-template-columns:1fr}.auth__art{display:none}}.center-msg{text-align:center;padding:64px 0}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}