:root{--font: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}[data-theme=dark]{--page: #06090d;--bg: #0b0f14;--surface: #121820;--surface-2: #18202a;--border: #232d3a;--text: #e6edf3;--muted: #7d8a99;--accent: #3fb950;--danger: #ff7b72;--mix-prs: #388bfd;--mix-reviews: #a371f7;--mix-issues: #d29922;--l0: #1c2530;--l1: #0e4429;--l2: #006d32;--l3: #26a641;--l4: #56d364}[data-theme=light]{--page: #f0f3f6;--bg: #ffffff;--surface: #f6f8fa;--surface-2: #eaeef2;--border: #d8dee4;--text: #1f2328;--muted: #656d76;--accent: #1a7f37;--danger: #cf222e;--mix-prs: #0969da;--mix-reviews: #8250df;--mix-issues: #bf8700;--l0: #e6ebf0;--l1: #aceebb;--l2: #4ac26b;--l3: #2da44e;--l4: #116329}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:var(--font);-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}button{background:none;border:0;padding:0;cursor:pointer}h1,h2,p{margin:0}.app{min-height:100vh;background:var(--page);color:var(--text);padding:2rem 1rem 4rem}.foot{margin:2.5rem auto 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem 1rem;font-size:.8125rem}.foot-link{display:inline-flex;align-items:center;gap:.5rem;padding:.375rem .75rem;color:var(--text);text-decoration:none;font-weight:500;background:var(--surface);border:1px solid var(--border);border-radius:999px;transition:background .15s}.foot-link:hover{background:var(--surface-2)}.foot-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stack{width:100%;max-width:36rem;margin:0 auto;display:flex;flex-direction:column;gap:1rem}.layout{width:100%;max-width:84rem;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;align-items:start}.layout>.side{display:flex;flex-direction:column;gap:1rem;min-width:0}@media(min-width:1100px){.layout{grid-template-columns:minmax(0,36rem) minmax(0,1fr);gap:1.5rem}.layout>.side{position:sticky;top:1.5rem}}.card{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:20px;padding:1.25rem}@media(min-width:768px){.card{padding:2rem}}.eyebrow{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}.muted{color:var(--muted)}.motto{padding:.625rem .875rem;font-size:.875rem;font-weight:500;line-height:1.4;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:10px}.hero{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 1.5rem;background:var(--surface);border:1px solid var(--border);border-radius:16px}.tile{padding:.875rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:14px}.grid-2,.grid-3{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}@media(min-width:768px){.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.seg{display:inline-flex;padding:2px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.seg button{padding:.25rem .625rem;font-size:.75rem;font-weight:500;color:var(--muted);border-radius:8px;transition:color .15s,background .15s}.seg button:hover{color:var(--text)}.seg button[aria-selected=true]{background:var(--surface-2);color:var(--text)}:is(.seg button,.btn,.bar-slot,input):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.chart{display:flex;align-items:flex-end;gap:3px;height:120px;padding:.75rem;background:var(--surface);border:1px solid var(--border);border-radius:14px}.bar-slot{flex:1 1 0;min-width:0;height:100%;display:flex;align-items:flex-end;border-radius:3px;outline:none}.bar{width:100%;border-radius:3px;transform-origin:bottom;animation:grow .5s cubic-bezier(.2,.8,.2,1) both;transition:filter .12s,transform .12s}.bar[data-active=true]{filter:brightness(1.25);transform:scaleY(1.04)}.stackbar{display:flex;gap:1px;height:10px;border-radius:5px;overflow:hidden;background:var(--surface-2)}.stackbar span{display:block;height:100%;min-width:2px}.legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.625rem .75rem;margin-top:.875rem;font-size:.6875rem}@media(min-width:640px){.legend.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.legend.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.legend .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.375rem}.legend strong{display:block;margin-top:.125rem;margin-left:14px;font-size:.75rem;color:var(--text);font-variant-numeric:tabular-nums}.rhythm{display:flex;gap:8px;height:72px}.rhythm-col{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px}.rhythm-track{flex:1;width:100%;display:flex;align-items:flex-end}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .875rem;font-size:.8125rem;font-weight:500;background:var(--surface);border:1px solid var(--border);border-radius:10px;transition:background .15s}.btn:hover{background:var(--surface-2)}.field{min-width:0;width:100%;padding:.5rem .75rem;font-size:.8125rem;background:var(--surface);border:1px solid var(--border);border-radius:10px}.code{display:block;padding:.75rem;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.75rem;line-height:1.5;word-break:break-all;background:var(--surface);border:1px solid var(--border);border-radius:10px}.preview-box{display:flex;justify-content:center;padding:1rem;background:var(--page);border:1px solid var(--border);border-radius:14px;overflow-x:auto}.skeleton{background:var(--surface-2);border-radius:12px;animation:pulse 1.6s ease-in-out infinite}.flame-btn{display:block;flex-shrink:0;border-radius:50%;--acc: var(--accent)}.flame-btn:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.flame,.core,.ring,.spark,.ember{transform-box:fill-box;transform-origin:50% 100%}.ring,.spark,.ember{transform-origin:50% 50%}.flame{animation:pop .8s cubic-bezier(.2,.9,.3,1) both,flicker 1.8s ease-in-out .8s infinite}.body{animation:burn 1.5s ease-in-out .35s both}.core{animation:core-burn 1.5s ease-in-out .35s both,flicker-core 1.1s ease-in-out .8s infinite}.glow{animation:glow-burn 1.5s ease-in-out .35s both,glow 2.4s ease-in-out infinite}.ring{animation:ring .9s ease-out .05s both}.spark{opacity:0;animation:spark 1s ease-out both}.ember{opacity:0;animation:ember 3.2s ease-in infinite}@keyframes pop{0%{transform:scale(0) rotate(-14deg)}50%{transform:scale(1.35,1.45) rotate(5deg)}75%{transform:scale(.94,.92) rotate(-2deg)}to{transform:scale(1) rotate(0)}}@keyframes burn{0%{fill:#ff6a00;stroke:#ff8a1f;fill-opacity:.5}40%{fill:#ff9d3a;stroke:#ffb02e;fill-opacity:.42}to{fill:var(--acc);stroke:var(--acc);fill-opacity:.18}}@keyframes core-burn{0%{fill:#ffe45c;fill-opacity:.95}to{fill:var(--acc);fill-opacity:.55}}@keyframes glow-burn{0%{fill:#ff8a1f}to{fill:var(--acc)}}@keyframes ring{0%{transform:scale(.3);opacity:.9}to{transform:scale(2.4);opacity:0}}@keyframes spark{0%{transform:translateY(2px) scale(1);opacity:0}15%{opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}@keyframes ember{0%{transform:translateY(4px) scale(.8);opacity:0}15%{opacity:.8}to{transform:translate(var(--dx),-30px) scale(.1);opacity:0}}@keyframes flicker{0%,to{transform:scale(1) rotate(0)}20%{transform:scale(1.03,1.07) rotate(-1.5deg)}45%{transform:scale(.98,.95) rotate(1deg)}70%{transform:scale(1.02,1.09) rotate(1.8deg)}}@keyframes flicker-core{0%,to{transform:scale(1)}30%{transform:scale(.88,1.18)}60%{transform:scale(1.1,.86)}}@keyframes glow{0%,to{opacity:.07}50%{opacity:.22}}@keyframes grow{0%{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}@keyframes pulse{50%{opacity:.5}}@media(prefers-reduced-motion:reduce){.bar,.skeleton,.flame,.core,.glow,.ring,.spark,.ember,.body{animation:none}}
