:root{--bg: #12101c;--bg2: #1a1728;--card: #211d33;--card2: #2a2542;--line: #363052;--text: #efeaf6;--muted: #9b93b8;--accent: #e5484d;--accent2: #f5b93c;--good: #46c98d;--bad: #e5484d;--info: #7c8cf8;--radius: 16px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;background:var(--bg);color:var(--text)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.5;min-height:100dvh}#root{max-width:560px;margin:0 auto;padding:calc(12px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-left,0px)) calc(90px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-right,0px))}h1{font-size:1.5rem;margin:8px 0}h2{font-size:1.15rem;margin:16px 0 8px}p{margin:8px 0}.muted{color:var(--muted);font-size:.88rem}.small{font-size:.8rem}.center{text-align:center}.spacer{flex:1}.row{display:flex;align-items:center;gap:10px}.wrap{flex-wrap:wrap}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin:10px 0}.card.clickable{cursor:pointer;transition:transform .08s,border-color .15s}.card.clickable:active{transform:scale(.98);border-color:var(--accent2)}button{font:inherit;border:none;border-radius:12px;padding:12px 18px;background:var(--card2);color:var(--text);cursor:pointer;transition:transform .08s,filter .15s}button:active{transform:scale(.97)}button:disabled{opacity:.45;cursor:default}.btn-primary{background:linear-gradient(135deg,var(--accent),#c2363b);font-weight:700}.btn-gold{background:linear-gradient(135deg,var(--accent2),#d99a18);color:#201700;font-weight:700}.btn-ghost{background:transparent;border:1px solid var(--line)}.btn-big{width:100%;padding:16px;font-size:1.05rem}input[type=text],textarea,select,input[type=number]{font:inherit;width:100%;background:var(--bg2);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:12px;outline:none}textarea{min-height:96px;resize:vertical}input:focus,textarea:focus{border-color:var(--info)}label.field{display:block;margin:14px 0 4px;font-weight:600;font-size:.92rem}.topbar{display:flex;align-items:center;gap:12px;padding:6px 0 2px}.topbar .logo{font-size:1.35rem;font-weight:800;letter-spacing:.5px}.navbar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:#12101ceb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:8px 0 calc(8px + env(safe-area-inset-bottom));z-index:10}.navbar button{background:none;padding:6px 16px;font-size:1.45rem;opacity:.45}.navbar button.active{opacity:1}.xpbar{height:10px;background:var(--bg2);border-radius:6px;overflow:hidden;border:1px solid var(--line)}.xpbar>div{height:100%;background:linear-gradient(90deg,var(--accent2),#ffd97a);transition:width .6s ease}.streak{font-size:1.05rem;font-weight:700}.badge{display:inline-flex;flex-direction:column;align-items:center;width:84px;margin:6px 2px;text-align:center}.badge .b-emoji{font-size:1.9rem;filter:grayscale(1);opacity:.35}.badge.won .b-emoji{filter:none;opacity:1}.badge .b-label{font-size:.66rem;color:var(--muted);margin-top:2px}.ring{position:relative;width:46px;height:46px;flex:none}.ring svg{transform:rotate(-90deg)}.ring .ring-label{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:700}.heatmap{display:grid;grid-template-columns:repeat(15,1fr);gap:4px}.heatmap .hm{aspect-ratio:1;border-radius:4px;background:var(--bg2)}.heatmap .hm.l1{background:#4a3b17}.heatmap .hm.l2{background:#8a6a1d}.heatmap .hm.l3{background:var(--accent2)}.progress-dots{display:flex;gap:5px;margin:10px 0}.progress-dots .dot{height:6px;flex:1;border-radius:3px;background:var(--bg2)}.progress-dots .dot.done{background:var(--accent2)}.progress-dots .dot.cur{background:var(--info)}.choice{display:block;width:100%;text-align:left;background:var(--card2);border:2px solid transparent;margin:8px 0;padding:13px 15px;border-radius:12px}.choice.sel{border-color:var(--info)}.choice.good{border-color:var(--good);background:#46c98d21}.choice.bad{border-color:var(--bad);background:#e5484d21}.verdict{border-radius:12px;padding:12px 14px;margin:10px 0;font-size:.95rem}.verdict.good{background:#46c98d1f;border:1px solid var(--good)}.verdict.bad{background:#e5484d1f;border:1px solid var(--bad)}.topo{font-size:.98rem}.topo h2{color:var(--accent2);font-size:1.08rem;margin-top:20px}.topo h3{font-size:1rem}.topo code{background:var(--bg2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:.86em}.topo pre{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px;overflow-x:auto}.topo pre code{border:none;background:none;padding:0}.topo table{border-collapse:collapse;width:100%;font-size:.9rem}.topo th,.topo td{border:1px solid var(--line);padding:6px 9px;text-align:left}.appreciation{display:flex;gap:6px}.appreciation button{flex:1;font-size:1.5rem;padding:10px 0;background:var(--card2);border:2px solid transparent}.appreciation button.sel{border-color:var(--accent2)}.celebrate{text-align:center;padding:26px 0 10px}.celebrate .big{font-size:3.4rem;animation:pop .5s ease}.xp-gain{font-size:1.5rem;font-weight:800;color:var(--accent2);animation:rise .8s ease}@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes rise{0%{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:50}.confetti i{position:absolute;top:-12px;width:9px;height:14px;display:block;animation:fall linear forwards}@keyframes fall{to{transform:translateY(105vh) rotate(720deg);opacity:.6}}.update-banner{display:block;width:100%;margin:0 0 10px;background:linear-gradient(135deg,var(--info),#5a6ae0);font-weight:700;border-radius:12px;padding:12px}.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.74rem;font-weight:700;background:var(--bg2);border:1px solid var(--line)}.pill.gold{color:var(--accent2);border-color:var(--accent2)}.pill.green{color:var(--good);border-color:var(--good)}.pill.red{color:var(--bad);border-color:var(--bad)}.pill.blue{color:var(--info);border-color:var(--info)}.offline-banner{background:#4a3b17;border:1px solid var(--accent2);border-radius:10px;padding:8px 12px;font-size:.85rem;margin:8px 0}.member-row{padding:10px 0;border-bottom:1px solid var(--line)}.member-row:last-of-type{border-bottom:none}.lesson-row{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--line);font-size:.93rem}.lesson-row:last-child{border-bottom:none}.spin{display:inline-block;animation:spin 1.1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}