:root{--bg:#0d0d12;--panel:#16161f;--mag:#ff3ea5;--lime:#b6ff3e;--line:#262633}
html,body,#root{height:100%;margin:0}
body{background:var(--bg);color:#e8e8f0;font-family:'Bricolage Grotesque',sans-serif;
background-image:radial-gradient(circle at 15% 10%,rgba(255,62,165,.12),transparent 40%),radial-gradient(circle at 90% 90%,rgba(182,255,62,.08),transparent 40%),repeating-linear-gradient(0deg,transparent 0 31px,rgba(255,255,255,.02) 31px 32px);}
.mono,code,pre{font-family:'JetBrains Mono',monospace}
.panel{background:var(--panel);border:1px solid var(--line)}
.ubub{background:linear-gradient(135deg,#ff3ea5,#c21f78);color:#fff}
.abub{background:#1c1c28;border:1px solid var(--line)}
.md p{margin:.4em 0}.md ul{list-style:disc;padding-left:1.3em}.md ol{list-style:decimal;padding-left:1.3em}
.md pre{background:#0a0a0f;border:1px solid var(--line);padding:.8em;border-radius:12px;overflow-x:auto;position:relative;margin:.5em 0;font-size:.85em}
.md code{background:#0a0a0f;padding:.1em .35em;border-radius:5px;color:var(--lime);font-size:.9em}
.md pre code{background:none;padding:0;color:#e8e8f0}
.md a{color:var(--lime);text-decoration:underline}
.md h1,.md h2,.md h3{font-weight:800;margin:.5em 0}
.copybtn{position:absolute;top:6px;right:6px;font-size:11px;padding:2px 8px;border-radius:6px;background:#262633;color:#b6ff3e}
@keyframes nod{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg)}}
.nod{animation:nod .6s ease-in-out infinite;display:inline-block}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hay span{display:inline-block;animation:bounce .9s infinite}
.hay span:nth-child(2){animation-delay:.15s}.hay span:nth-child(3){animation-delay:.3s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.rise{animation:rise .4s ease both}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg);opacity:.3}}
.confetti{position:fixed;top:-40px;font-size:28px;pointer-events:none;z-index:99;animation:fall 2.5s linear forwards}
.glow:focus{outline:none;box-shadow:0 0 0 2px var(--mag),0 0 24px rgba(255,62,165,.35)}
input[type=range]{accent-color:var(--mag)}
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#2a2a38;border-radius:8px}