:root{color-scheme:light dark;--bg:#edf5f0;--panel:#fff;--ink:#10251d;--muted:#52675e;--line:#b9d0c5;--green:#147a47;--green2:#20a464;--gold:#f0b72f;--red:#c74646;--blue:#2a70c9;--shadow:0 14px 38px #163d2a22;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 0,#d9f2e4,transparent 38%),var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit}.skip{position:fixed;left:8px;top:-100px;z-index:9999;background:#fff;color:#000;padding:12px}.skip:focus{top:8px}.app-head{min-height:96px;display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:14px;align-items:center;padding:14px clamp(14px,4vw,38px);background:#10261e;color:#f7fff9;border-bottom:4px solid var(--gold)}.app-head h1{margin:2px 0;font-size:clamp(1.55rem,4vw,2.35rem);line-height:1.05}.app-head p{margin:3px 0;color:#bdd5c8}.app-head small{color:#75dda7;font-weight:800;letter-spacing:.08em}.back,.icon-button{display:grid;place-items:center;min-width:48px;min-height:48px;border:1px solid #ffffff44;border-radius:12px;background:#ffffff12;color:#fff;text-decoration:none;font-size:1.45rem;cursor:pointer}.back:focus-visible,.icon-button:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
main{width:min(1180px,100%);margin:0 auto;padding:clamp(14px,3vw,34px);min-height:calc(100vh - 156px)}.panel{background:color-mix(in srgb,var(--panel) 96%,transparent);border:1px solid var(--line);border-radius:18px;padding:clamp(16px,3vw,28px);box-shadow:var(--shadow)}.controls{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-bottom:18px}.controls label{display:grid;gap:5px;font-weight:750}.controls input,.controls select,.input{min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--ink);padding:10px 12px;min-width:150px}button.primary,button.secondary,.action{min-height:48px;padding:10px 18px;border-radius:10px;border:1px solid #0e6138;background:var(--green);color:#fff;font-weight:850;cursor:pointer}button.secondary{background:var(--panel);color:var(--ink);border-color:var(--line)}button:disabled{opacity:.55;cursor:not-allowed}.status{min-height:50px;padding:12px 14px;border-radius:12px;background:#e5f4eb;border:1px solid #b6dac5;font-weight:750}.result{padding:22px;border-radius:18px;background:linear-gradient(135deg,#17382a,#235541);color:white;text-align:center}.result strong.big{display:block;font-size:clamp(2.7rem,10vw,6rem);color:#ffe08a}.meter-grid,.stats-grid,.topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.stat,.topic-card{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.stat b{display:block;font-size:1.35rem;color:var(--green)}.notice{padding:12px;border-radius:10px;background:#fff4cc;color:#593f00;border:1px solid #dfbd4d}.danger{background:#fee9e7;color:#6e1814;border-color:#eaa4a0}.hidden{display:none!important}footer{min-height:60px;display:flex;gap:18px;justify-content:space-between;align-items:center;padding:12px clamp(14px,4vw,38px);background:#10261e;color:#c9ddd3}footer a{color:#fff}
.board-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,320px);gap:20px;align-items:start}.board{width:min(100%,700px);aspect-ratio:1;display:grid;margin:auto;touch-action:manipulation;user-select:none}.cell{min-width:0;min-height:0;border:1px solid #1a3d2d;background:#f6fff9;color:var(--ink);display:grid;place-items:center;padding:0;cursor:pointer}.cell.dark{background:#47705d}.cell.light{background:#dae9e1}.piece{width:72%;height:72%;border-radius:50%;box-shadow:inset 0 -5px 9px #0004,0 3px 5px #0005}.p1{background:#f2c13c}.p2{background:#db4f4f}.piece.king::after{content:"★";display:grid;place-items:center;width:100%;height:100%;color:#fff;font-size:clamp(.8rem,4vw,1.5rem)}.winning{animation:pulse .7s alternate infinite;outline:4px solid #fff}.connect-board{aspect-ratio:7/6;grid-template-columns:repeat(7,1fr);background:#2366b5;padding:7px;gap:4px;border-radius:14px}.connect-board .cell{border-radius:50%;border:0;background:#eaf2ee}.connect-board .piece{width:86%;height:86%}.connect-board .piece.just-dropped{animation:drop .28s ease-out}.gomoku-board{grid-template-columns:repeat(15,1fr);background:#d8ad69;padding:8px}.gomoku-board .cell{position:relative;border:0;background:linear-gradient(90deg,transparent 47%,#664a27 48% 52%,transparent 53%),linear-gradient(transparent 47%,#664a27 48% 52%,transparent 53%)}.gomoku-board .piece{position:absolute;width:82%;height:82%}.dots-board{grid-template-columns:repeat(11,1fr);background:#fff}.dot,.edge,.box{display:grid;place-items:center}.dot::after{content:"";width:36%;height:36%;border-radius:50%;background:#17382a}.edge{border:0;background:transparent;cursor:pointer}.edge:hover,.edge:focus-visible{background:#a9dbc0}.edge.taken{background:var(--green)}.box.p1{background:#ffe49a}.box.p2{background:#ffc2c2}.master-row{display:grid;grid-template-columns:minmax(100px,1fr) auto;gap:10px;align-items:center;margin:8px 0}.peg-list{display:flex;gap:7px;flex-wrap:wrap}.peg{width:42px;height:42px;border-radius:50%;border:2px solid #ffffff88}.palette{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.palette button{width:48px;height:48px;border:3px solid transparent;border-radius:50%;cursor:pointer}.palette button[aria-pressed=true]{border-color:#111;outline:3px solid var(--gold)}
.name-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.question-card{padding:18px;border-radius:16px;border:1px solid var(--line);background:var(--panel)}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice-grid button[aria-pressed=true]{background:var(--green);color:#fff}.share-card{position:relative;overflow:hidden}.share-card::before{content:"";position:absolute;inset:-50%;background:conic-gradient(#1b7048,#f0b72f,#2379b8,#1b7048);opacity:.13;animation:spin 12s linear infinite}.share-card>*{position:relative}.mixer-stage{position:relative;display:grid;place-items:center;min-height:clamp(500px,72vh,680px);margin-top:16px;padding:24px 12px;background:radial-gradient(circle at 50% 28%,#f8fff7 0,#b8f2d0 32%,#58b887 70%,#174f37 100%);border-radius:20px;overflow:hidden;isolation:isolate}.mixer-stage::before,.mixer-stage::after{content:"";position:absolute;border-radius:50%;filter:blur(2px);opacity:.32;z-index:-1}.mixer-stage::before{width:420px;height:420px;background:#ffdd70;left:-150px;top:-180px}.mixer-stage::after{width:360px;height:360px;background:#56bdf5;right:-130px;bottom:-140px}.mixer-figure{position:relative;height:clamp(440px,64vh,620px);width:auto;max-width:86vw;aspect-ratio:.46;display:grid;grid-template-rows:29fr 27fr 28fr 16fr;overflow:hidden;border-radius:42% 42% 20% 20%;filter:drop-shadow(0 24px 18px #081c1466);user-select:none;touch-action:pan-y;animation:mixer-float 4.6s ease-in-out infinite}.mixer-photo-stack{position:absolute;inset:0;z-index:1;pointer-events:none}.mixer-row{position:relative;z-index:2;min-height:0;cursor:ew-resize}.mixer-photo-part{position:absolute;left:0;right:0;top:var(--part-top);bottom:var(--part-bottom);background-image:var(--atlas);background-repeat:no-repeat;background-size:500% var(--bg-h);background-position:var(--x) var(--y);will-change:background-position}.mixer-layer-head{-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--fade)),transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--fade)),transparent 100%);z-index:1}.mixer-layer-torso,.mixer-layer-legs{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade),#000 calc(100% - var(--fade)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade),#000 calc(100% - var(--fade)),transparent 100%)}.mixer-layer-torso{z-index:2}.mixer-layer-legs{z-index:3}.mixer-layer-feet{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade),#000 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade),#000 100%);z-index:4}.mixer-controls{display:grid;grid-template-columns:48px 1fr 48px;gap:8px;align-items:center;margin:8px 0}.mixer-controls button{min-height:48px}.mixer-controls span{text-align:center;font-weight:800}.legendary{display:inline-block;padding:8px 14px;border-radius:999px;background:#4b1b73;color:#fff6ad;font-weight:900}.favorite-list{display:grid;gap:8px}.favorite-list li{display:flex;justify-content:space-between;align-items:center;gap:12px}.topic-card button{width:100%;text-align:left;background:transparent;color:inherit;border:0;cursor:pointer}.topic-detail img{width:100%;max-height:360px;object-fit:cover;border-radius:14px}.quiz-options{display:grid;gap:8px}.quiz-options button{text-align:left}.offline-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#dff4e8;color:#155b37;font-weight:800}
.opponent-picker{display:grid;grid-template-columns:repeat(2,minmax(150px,230px));gap:10px;margin-bottom:18px}.mode-button{min-height:52px;border:2px solid var(--line);border-radius:13px;background:var(--panel);color:var(--ink);font-weight:850;cursor:pointer}.mode-button.active{border-color:var(--green);background:var(--green);color:#fff;box-shadow:0 7px 18px #147a4733}.friend-lobby{margin:0 0 20px;padding:16px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--panel) 82%,var(--green) 18%)}.friend-lobby .controls{margin-bottom:8px}.room-message{min-height:28px;margin:6px 0;font-weight:800}.invite-card{display:grid;grid-template-columns:minmax(150px,1fr) minmax(240px,2fr);gap:16px;align-items:center;padding:16px;border-radius:14px;background:var(--panel);border:1px solid var(--line)}.invite-card strong{display:block;font-size:clamp(2rem,7vw,3.6rem);letter-spacing:.15em;color:var(--green)}.invite-card p{margin:4px 0}.invite-actions{display:flex;flex-wrap:wrap;gap:9px}.invite-actions>*{flex:1 1 130px;text-align:center}.whatsapp{display:flex;align-items:center;justify-content:center;background:#168a48;text-decoration:none}.room-qr{grid-column:1/-1;width:min(280px,100%);margin:auto;padding:12px;background:#fff;border-radius:13px}.room-qr svg{display:block;width:100%;height:auto}.player-chip{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:4px 9px;border-radius:999px;font-size:.78rem;font-weight:900}.player-chip.p1{background:#f2c13c;color:#332600}.player-chip.p2{background:#db4f4f;color:#fff}.master-row:has(.player-chip){grid-template-columns:auto minmax(100px,1fr) auto}
@keyframes drop{from{transform:translateY(-400%)}to{transform:none}}@keyframes pulse{to{filter:brightness(1.5)}}@keyframes spin{to{transform:rotate(1turn)}}@keyframes mixer-float{50%{transform:translateY(-7px) rotate(.35deg)}}
@media(prefers-color-scheme:dark){:root{--bg:#07110d;--panel:#122019;--ink:#effaf4;--muted:#a6bbb0;--line:#334b40;--shadow:0 14px 38px #0008}.status{background:#173526;border-color:#316748}.notice{background:#3a3015;color:#ffe9a4}.danger{background:#3f1c1c;color:#ffceca}.connect-board .cell{background:#13211b}.dots-board{background:#d8e9df;color:#10251d}}
@media(max-width:760px){.app-head{grid-template-columns:48px minmax(0,1fr) 48px}.app-head p{display:none}.board-wrap{grid-template-columns:1fr}.board{width:100%}.cell{touch-action:manipulation}.mixer-stage{min-height:clamp(430px,58vh,520px);padding-inline:4px}.mixer-figure{height:clamp(360px,50vh,430px);width:auto;max-width:82vw}.controls>*{flex:1 1 145px}.controls button{flex:1 1 145px}.opponent-picker{grid-template-columns:1fr 1fr}.invite-card{grid-template-columns:1fr}.invite-actions>*{flex:1 1 120px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
@media print{.app-head,.controls,footer,.rk-help-trigger{display:none!important}main{padding:0}.panel{box-shadow:none;border:0}}
.checkers-board{grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr))}.checkers-board .cell{overflow:hidden}.checkers-board .piece{display:grid;min-width:0;min-height:0}