:root{--dbo-ink: #0a1230;--dbo-mid: #14193a;--dbo-flame: #f6c15e;--dbo-coral: #ff6b8a;--dbo-mint: #8aeac0;--dbo-sky: #7ac8ed;--dbo-mauve: #c9a8ef;--dbo-cream: #f4e7c8;--dbo-cream-dim: #b8aa84}body:has(.dbo){background:radial-gradient(circle at 20% 10%,#1a1e58 0%,transparent 50%),radial-gradient(circle at 85% 90%,#2a1640 0%,transparent 55%),var(--dbo-ink);color:var(--dbo-cream);font-family:Inter,-apple-system,system-ui,sans-serif;min-height:100vh}.dbo{max-width:760px;margin:0 auto;padding:36px 24px 64px}.dbo__hero{margin-bottom:32px}.dbo__kicker{font-family:JetBrains Mono,ui-monospace,monospace;font-size:11px;letter-spacing:.18em;color:var(--dbo-coral);text-transform:uppercase;margin:0 0 12px}.dbo__title{font-family:Inter Tight,sans-serif;font-weight:800;font-size:clamp(32px,5.5vw,52px);letter-spacing:-.025em;line-height:1.04;margin:0 0 16px}.dbo__sub{font-size:15px;line-height:1.55;color:var(--dbo-cream-dim);margin:0}.dbo__stage{background:#ffffff0a;border:1px solid rgba(244,231,200,.1);border-radius:18px;padding:22px;margin-bottom:36px}.dbo__banner{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:0 0 18px;background:#f6c15e1a;border:1px solid rgba(246,193,94,.3);border-radius:10px}.dbo__banner-icon{font-size:22px}.dbo__banner-body{flex:1;display:flex;flex-direction:column}.dbo__banner-from{font-family:Inter Tight,sans-serif;font-weight:700;font-size:15px;color:var(--dbo-flame)}.dbo__banner-meta{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.04em;color:var(--dbo-cream-dim);margin-top:2px}.dbo__banner-action{border:1px solid rgba(246,193,94,.6);background:#f6c15e26;color:var(--dbo-flame);padding:8px 14px;border-radius:6px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}.dbo__banner-action:hover{background:#f6c15e40}.dbo__grid-wrap{display:grid;grid-template-columns:1fr 60px;gap:12px;margin-bottom:18px}@media(max-width:560px){.dbo__grid-wrap{grid-template-columns:1fr 48px;gap:8px}}.dbo__grid{display:grid;grid-template-columns:repeat(16,1fr);grid-template-rows:repeat(4,1fr);gap:4px;aspect-ratio:16 / 4;background:#0000004d;border-radius:8px;padding:6px}.dbo__cell{background:#f4e7c80f;border:1px solid rgba(244,231,200,.1);border-radius:3px;cursor:pointer;transition:background 80ms ease,transform 60ms ease;min-width:0;min-height:0;padding:0}.dbo__cell:hover{background:#f4e7c829}.dbo__cell--on{background:var(--cell-color);border-color:var(--cell-color)}.dbo__cell--low.dbo__cell--on{--cell-color: #f6c15e}.dbo__cell--mid.dbo__cell--on{--cell-color: #ff8a70}.dbo__cell--high.dbo__cell--on{--cell-color: #c9a8ef}.dbo__cell--bell.dbo__cell--on{--cell-color: #8aeac0}.dbo__cell--play{box-shadow:0 0 0 2px var(--dbo-cream);transform:scale(.95)}.dbo__cell:nth-child(16n+5),.dbo__cell:nth-child(16n+9),.dbo__cell:nth-child(16n+13){margin-left:2px}.dbo__voice-labels{display:grid;grid-template-rows:repeat(4,1fr);gap:4px;padding:6px 0}.dbo__voice{display:flex;align-items:center;justify-content:flex-end;font-family:JetBrains Mono,monospace;font-size:9px;letter-spacing:.12em;color:var(--dbo-cream-dim)}.dbo__voice--low{color:#f6c15e}.dbo__voice--mid{color:#ff8a70}.dbo__voice--high{color:#c9a8ef}.dbo__voice--bell{color:#8aeac0}.dbo__transport{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}.dbo__btn{border:1px solid rgba(244,231,200,.25);background:#f4e7c814;color:var(--dbo-cream);padding:10px 18px;border-radius:8px;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;letter-spacing:.02em}.dbo__btn:hover{background:#f4e7c829}.dbo__btn--play{background:#f6c15e26;border-color:#f6c15e73;color:var(--dbo-flame)}.dbo__btn--play:hover{background:#f6c15e40}.dbo__bpm-wrap{display:flex;align-items:center;gap:10px;flex:1;min-width:220px}.dbo__bpm-label{font-family:JetBrains Mono,monospace;font-size:11px;letter-spacing:.12em;color:var(--dbo-cream-dim)}.dbo__bpm{flex:1;accent-color:var(--dbo-flame);cursor:pointer}.dbo__bpm-readout{font-family:JetBrains Mono,monospace;font-size:13px;color:var(--dbo-flame);min-width:32px;text-align:right}.dbo__actions{display:flex;flex-wrap:wrap;gap:10px}.dbo__action{flex:0 0 auto;border:1px solid rgba(244,231,200,.18);background:#f4e7c80f;color:var(--dbo-cream);padding:10px 16px;border-radius:8px;font-family:inherit;font-size:13px;font-weight:500;cursor:pointer;text-decoration:none}.dbo__action:hover{background:#f4e7c824;border-color:#f4e7c859}.dbo__action--primary{background:#ff6b8a26;border-color:#ff6b8a73;color:var(--dbo-coral)}.dbo__action--primary:hover{background:#ff6b8a40}.dbo__action--ghost{color:var(--dbo-cream-dim);background:transparent;border-color:#f4e7c81a}.dbo__notes{max-width:700px}.dbo__notes-h{font-family:Inter Tight,sans-serif;font-weight:700;font-size:22px;letter-spacing:-.01em;color:var(--dbo-cream);margin:0 0 12px}.dbo__notes p{font-size:14px;line-height:1.6;color:var(--dbo-cream-dim);margin:0 0 12px}.dbo__notes em{color:var(--dbo-flame);font-style:italic}.dbo__notes code{font-family:JetBrains Mono,monospace;font-size:12px;padding:1px 6px;border-radius:4px;background:#f4e7c814;color:var(--dbo-mint)}.dbo__notes a{color:var(--dbo-coral);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.dbo__toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%) translateY(20px);background:#000000d9;color:var(--dbo-flame);padding:10px 18px;border-radius:6px;font-family:JetBrains Mono,monospace;font-size:12px;letter-spacing:.04em;opacity:0;pointer-events:none;transition:opacity .24s ease,transform .24s ease;z-index:50;border:1px solid rgba(246,193,94,.4)}.dbo__toast--show{opacity:1;transform:translate(-50%) translateY(0)}