@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-cyrillic-wght-normal-DqGufNeO.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-greek-ext-wght-normal-DlzME5K_.woff2)format("woff2-variations");unicode-range:U+1F??}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-greek-wght-normal-CkhJZR-_.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-vietnamese-wght-normal-CBcvBZtf.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-latin-ext-wght-normal-DO1Apj_S.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/loopline/assets/inter-latin-wght-normal-Dx4kXJAl.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg:#120f1f;--panel:#1c1830;--line:#2f2a4a;--text:#f1eefc;--dim:#a59fc4;--pink:#ff5fa2;--violet:#7c6cff;--teal:#2ee6c5;--grad:linear-gradient(135deg, var(--pink), var(--violet));--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0}body{background:radial-gradient(90% 60% at 80% 0%, #2a1748 0%, transparent 60%), var(--bg);min-height:100vh;color:var(--text);font:16px/1.45 Inter Variable,system-ui,sans-serif}button,input,select{font:inherit;color:inherit}button,select{border:1px solid var(--line);background:var(--panel);cursor:pointer;border-radius:10px;min-height:44px;padding:0 14px;font-weight:600}:focus-visible{outline:3px solid var(--teal);outline-offset:2px}a{color:#c9c2ff}.top{border-bottom:1px solid var(--line);align-items:center;gap:14px;padding:12px 16px;display:flex}.top .home{color:var(--dim);border:1px solid var(--line);border-radius:99px;padding:4px 10px;font-size:.85rem;font-weight:700;text-decoration:none}.top h1{letter-spacing:-.02em;background:var(--grad);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.3rem}.top .legal{gap:12px;margin-left:auto;font-size:.85rem;display:flex}.top .legal a{color:var(--dim)}main{max-width:1100px;margin:0 auto;padding:16px}.intro{color:var(--dim);margin:4px 0 16px}.controls{background:var(--panel);border:1px solid var(--line);border-radius:16px;flex-wrap:wrap;align-items:end;gap:12px 18px;padding:14px;display:flex}.play{background:var(--grad);color:#fff;border:0;min-width:110px;min-height:52px;font-size:1.1rem}.play[aria-pressed=true]{background:var(--teal);color:#08221d}.ctl{color:var(--dim);gap:4px;font-size:.8rem;display:grid}.ctl>span{font-weight:600}.ctl input[type=range]{width:140px;accent-color:var(--pink)}.ctl output{color:var(--text);font-variant-numeric:tabular-nums;font-weight:700}.ctl select{color:var(--text)}.actions{flex-wrap:wrap;align-items:end;gap:10px;margin-left:auto;display:flex}.grids{gap:16px;margin-top:16px;display:grid}.grid{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;overflow-x:auto}.grid h2{text-transform:uppercase;letter-spacing:.1em;color:var(--dim);align-items:center;gap:10px;margin:0 0 10px;font-size:.8rem;display:flex}.row{grid-template-columns:120px repeat(16,minmax(30px,1fr));gap:4px;min-width:640px;margin-bottom:4px;display:grid}.name{justify-content:space-between;align-items:center;gap:6px;font-size:.85rem;font-weight:600;display:flex}.vol{width:52px;accent-color:var(--violet)}.cell{background:#241f3b;border:1px solid #0000;border-radius:6px;min-height:34px;padding:0;transition:background 80ms,transform 80ms}.cell.beat{background:#2c2648}.cell:active{transform:scale(.94)}.cell[aria-pressed=true]{background:var(--pink);box-shadow:0 0 12px #ff5fa280}.drum-snare .cell[aria-pressed=true],.drum-clap .cell[aria-pressed=true]{background:var(--violet);box-shadow:0 0 12px #7c6cff80}.drum-hat .cell[aria-pressed=true],.drum-open .cell[aria-pressed=true]{background:#ffc85a;box-shadow:0 0 12px #ffc85a73}.bass .cell{min-height:26px}.bass .cell[aria-pressed=true]{background:var(--teal);box-shadow:0 0 12px #2ee6c580}.cell.now{border-color:#fff}.toast{z-index:10;visibility:hidden;background:#3a3260;border-radius:12px;padding:10px 16px;transition:transform .25s,visibility .25s;position:fixed;bottom:20px;left:50%;transform:translate(-50%,140%);box-shadow:0 8px 24px #0006}.toast.show{visibility:visible;transform:translate(-50%)}@media (max-width:640px){.top .legal{display:none}.actions{margin-left:0}.ctl input[type=range]{width:120px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}