:root{--red:#e5484d;--blue:#3b82f6;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{color:#e2e8f0;background:#0f172a;margin:0;font-family:system-ui,sans-serif}main{max-width:460px;margin:0 auto;padding:16px}h1{margin:0 0 4px}.lede{color:#94a3b8;margin:0 0 12px}.red{color:var(--red)}button{font:inherit;color:#0f172a;cursor:pointer;background:#e2e8f0;border:2px solid #0000;border-radius:8px;padding:8px 12px}button.on{border-color:#fff;box-shadow:inset 0 0 0 2px #0f172a}button small{font-size:.7rem;display:block}.brushes,.actions{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}.grid{touch-action:none;-webkit-user-select:none;user-select:none;gap:3px;display:grid}.cell{aspect-ratio:1;background:#1e293b;border-radius:6px;place-items:center;display:grid}.dot{pointer-events:none;border-radius:50%;width:55%;height:55%}.red-dot{background:var(--red);border:3px solid #fff}.blue-dot{background:var(--blue);border:3px solid #fff}.status{min-height:3em}.status.won{color:#34d399;font-weight:600}header{justify-content:space-between;align-items:center;display:flex}header span{gap:4px;display:flex}h2{margin:16px 0 8px;font-size:1rem}.gear{color:inherit;background:0 0;padding:4px 8px;font-size:1.3rem}button.primary{background:#34d399;font-weight:700}button:disabled{opacity:.45;cursor:default}.hint{color:#94a3b8;margin:8px 0 0;font-size:.8rem}.red-mark{color:var(--red);margin-left:2px}.stats{background:#1e293b;border-radius:16px;gap:6px;padding:12px 16px;display:grid}.stats .line{justify-content:space-between;gap:8px;font-weight:700;display:flex}.stats .line span:last-child{opacity:.75;font-weight:400}.meter{background:#ffffff26;border-radius:3px;height:6px;margin-top:4px;display:block;overflow:hidden}.meter>span{background:#34d399;height:100%;display:block}.levels{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.level{text-align:center;gap:2px;padding:10px 4px;display:grid}.level.done{background:#34d399}.badges{gap:8px;display:grid}.badge-card{opacity:.55;background:#1e293b;border-radius:14px;align-items:center;gap:12px;padding:10px 14px;display:flex}.badge-card.got{opacity:1}.badge-card .emoji{font-size:1.8rem}.badge-card>div{flex:1}.badge-card small{opacity:.75;display:block}.muted{opacity:.6;font-weight:400}.reward{color:#fde68a;margin:0 0 8px;font-size:.9rem}.account{flex-direction:column;gap:14px;margin-top:12px;display:flex}.account .hint{margin:0;font-size:.9rem}.account a{color:#34d399}.field{gap:4px;font-weight:700;display:grid}.field input{font:inherit;color:inherit;background:#1e293b;border:1px solid #fff3;border-radius:10px;padding:10px 12px;font-weight:400}.tabs{gap:8px;display:flex}.tab{color:inherit;background:0 0;border:1px solid #fff3;flex:1}.tab.active{background:#1e293b;border-color:#34d399}.alert{color:#fca5a5;margin:0}button.link{color:#94a3b8;background:0 0;text-decoration:underline}.lang{color:#94a3b8;margin-top:20px;font-size:.85rem;display:block}.lang select{font:inherit;color:inherit;background:#1e293b;border:1px solid #fff3;border-radius:8px;padding:4px 8px}.why-card{text-align:left;color:#e2e8f0;background:#1e293b;border:1px solid #f59e0b;width:100%;margin-top:4px;display:block}.why-card small{color:#94a3b8;font-size:.8rem}.why section{margin:14px 0}.why h2{color:#fbbf24;margin:0 0 4px}.why p{margin:0;line-height:1.5}.lesson{background:#1e293b;border-left:4px solid #f59e0b;border-radius:10px;margin:8px 0 12px;padding:4px 14px 14px}.lesson p{margin:8px 0;line-height:1.45}.lesson .fact{color:#94a3b8;font-size:.85rem}.bars{gap:4px;margin-top:8px;display:grid}.bars>div{background:#ffffff26;border-radius:4px;height:20px;position:relative;overflow:hidden}.bars span{background:var(--red);height:100%;display:block}.mini-tile{color:#94a3b8;background:#1e293b;border:1px solid #fff3;justify-items:center;gap:2px;padding:6px;display:grid}.mini-tile small{font-size:.65rem}.mini{gap:1px;width:72px;height:72px;display:grid}.mini>span{background:#0f172a;border-radius:2px;place-items:center;display:grid}.mini i{border:1px solid #fff;border-radius:50%;width:55%;height:55%}.mini .red-dot{background:var(--red)}.mini .blue-dot{background:var(--blue)}.lesson .mini-tile{float:right;margin:8px 0 8px 12px}.lesson h2{margin:12px 0 0}.lesson:after{content:"";clear:both;display:block}.bars b{color:#fff;text-shadow:0 1px 2px #000000b3;align-items:center;padding:0 8px;font-size:.72rem;display:flex;position:absolute;inset:0}.cell.void,.mini>.void{background:0 0}
