:root{color-scheme:dark;--bg:#0a0a0c;--line:rgba(255,255,255,.13);--text:#f7f7f2;--muted:#8e8e94}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,#2b2b32 0,transparent 38%),var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.topbar{width:min(1360px,100%);margin:0 auto 18px;display:flex;align-items:center;justify-content:space-between;height:56px}.brand{display:flex;align-items:baseline;gap:8px;color:inherit;text-decoration:none;letter-spacing:-.04em}.brand span{font-size:15px;font-weight:800;border:1px solid #fff;border-radius:999px;padding:5px 7px;letter-spacing:.03em}.brand strong{font-size:26px;font-weight:900}.signal{height:24px;display:flex;align-items:center;gap:4px}.signal i{display:block;width:3px;border-radius:4px;background:#c7ff38;animation:meter 1.1s ease-in-out infinite alternate}.signal i:nth-child(1){height:8px}.signal i:nth-child(2){height:18px;animation-delay:-.4s}.signal i:nth-child(3){height:12px;animation-delay:-.8s}.signal i:nth-child(4){height:22px;animation-delay:-.2s}.signal i:nth-child(5){height:7px;animation-delay:-.6s}@keyframes meter{to{height:5px;opacity:.55}}.tool-grid{width:min(1360px,100%);margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.tile{position:relative;min-height:220px;overflow:hidden;border:1px solid var(--line);border-radius:18px;color:#fff;text-decoration:none;isolation:isolate;transition:transform .2s ease,border-color .2s ease,filter .2s ease}.tile:focus-visible{outline:3px solid #fff;outline-offset:3px}.tile:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.55);filter:saturate(1.12)}.name{position:absolute;left:18px;right:18px;bottom:17px;z-index:3;font-size:clamp(15px,1.25vw,20px);font-weight:900;letter-spacing:-.02em;line-height:.96}.art{position:absolute;inset:0 0 42px;display:block}.tile-bpm{background:#c7ff38;color:#071009}.bpm-art b{position:absolute;top:30px;left:19px;font-size:clamp(64px,7vw,105px);letter-spacing:-.085em;line-height:.8}.bpm-art i{position:absolute;right:28px;bottom:18px;width:12px;background:#071009;border-radius:8px}.bpm-art i:nth-of-type(1){height:35%}.bpm-art i:nth-of-type(2){height:65%;right:48px}.bpm-art i:nth-of-type(3){height:90%;right:68px}.tile-tracker{background:#19191d}.tracker-art{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;padding:22px 20px 30px}.tracker-art:before{content:"00  C-4  01  F  8";position:absolute;left:20px;top:18px;color:#ff735c;font:800 12px monospace;letter-spacing:.08em}.tracker-art i{margin-top:24px;background:repeating-linear-gradient(to bottom,#42424a 0 2px,transparent 2px 13px)}.tracker-art i:nth-child(3n+1){background:repeating-linear-gradient(to bottom,#c7ff38 0 2px,transparent 2px 13px)}.tile-breaks{background:linear-gradient(135deg,#ff643f,#b525ff)}.breaks-art{display:flex;align-items:flex-end;justify-content:center;gap:6px;padding:20px 28px}.breaks-art i{width:11%;height:25%;background:#111;border-radius:999px 999px 5px 5px}.breaks-art i:nth-child(2){height:65%}.breaks-art i:nth-child(3){height:38%}.breaks-art i:nth-child(4){height:82%}.breaks-art i:nth-child(5){height:48%}.breaks-art i:nth-child(6){height:72%}.breaks-art i:nth-child(7){height:30%}.tile-piano{background:#f2efe6;color:#0b0b0d}.piano-art{display:flex;padding:18px 18px 32px}.piano-art i{flex:1;border:1px solid #242428;border-radius:0 0 7px 7px}.piano-art i:nth-child(2),.piano-art i:nth-child(4),.piano-art i:nth-child(5),.piano-art i:nth-child(7){height:62%;margin:0 -10%;z-index:2;background:#111;border-color:#f2efe6}.tile-saw{background:#ff3d78}.saw-art{padding:30px 12px}.saw-art svg{width:100%;height:100%}.saw-art path{fill:none;stroke:#151018;stroke-width:10;stroke-linejoin:round}.tile-drone{background:radial-gradient(circle at center,#6678ff,#171338 68%)}.drone-art i{position:absolute;inset:50% auto auto 50%;border:1px solid rgba(255,255,255,.8);border-radius:50%;transform:translate(-50%,-50%)}.drone-art i:nth-child(1){width:42px;height:42px;background:#fff;box-shadow:0 0 30px #fff}.drone-art i:nth-child(2){width:108px;height:108px}.drone-art i:nth-child(3){width:174px;height:174px;opacity:.5}.tile-abs{background:#0d3b2d}.abs-art{inset:18px 18px 52px;background:#063122;border:7px solid #d9cfad;border-radius:5px;box-shadow:inset 0 0 30px #00170e;padding:20px;color:#79ff74;font:700 22px monospace;text-shadow:0 0 10px #3cff5a}.abs-art i{font-style:normal;animation:blink .9s steps(1) infinite}@keyframes blink{50%{opacity:0}}.tile-cmc{background:#382275}.cmc-art{display:flex;align-items:flex-end;gap:5px;padding:20px 22px 30px}.cmc-art i{flex:1;height:75%;background:repeating-linear-gradient(to top,#ffe85b 0 5px,transparent 5px 10px);clip-path:polygon(0 100%,0 64%,14% 64%,14% 40%,28% 40%,28% 75%,42% 75%,42% 20%,56% 20%,56% 52%,70% 52%,70% 36%,84% 36%,84% 70%,100% 70%,100% 100%)}.tile-sam{background:#10a5a5}.sam-art b{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:90px;line-height:1}.sam-art i{position:absolute;left:50%;top:42%;width:145px;height:145px;border:3px solid rgba(255,255,255,.34);border-radius:50%;transform:translate(-50%,-50%) scale(var(--s));--s:1}.sam-art i:nth-of-type(2){--s:.72}.sam-art i:nth-of-type(3){--s:.45}.sam-art i:nth-of-type(4){--s:1.25;border-style:dashed}.tile-sample{background:#f15b2a}.sample-art{padding:35px 8px}.sample-art svg{width:100%;height:100%}.sample-art path{fill:none;stroke:#170b07;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}.tile-vox{background:#2a2a30}.vox-art b{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);font-size:clamp(60px,7vw,100px);letter-spacing:-.11em}.vox-art i{position:absolute;left:12%;right:12%;top:43%;height:1px;background:#ffda3d;box-shadow:0 0 16px 5px #ffda3d}.tile-noise{background:#e4e4e0}.noise-art{background-image:repeating-radial-gradient(circle at 20% 30%,#111 0 1px,transparent 1px 3px),repeating-radial-gradient(circle at 70% 55%,#555 0 1px,transparent 1px 4px);background-size:11px 13px,17px 19px;mix-blend-mode:multiply}.tile-noise .name{color:#111}@media(max-width:980px){.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tile{min-height:200px}}@media(max-width:680px){body{padding-left:10px;padding-right:10px}.topbar{height:46px;margin-bottom:10px;padding:0 5px}.brand strong{font-size:22px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tile{min-height:170px;border-radius:15px}.name{left:13px;bottom:13px;font-size:15px}.bpm-art b{top:27px;left:13px;font-size:58px}.tile-cmc .name,.tile-abs .name,.tile-sample .name{font-size:13px}}@media(max-width:380px){.tile{min-height:155px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}