@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Outfit:wght@300;400;600&family=Share+Tech+Mono&display=swap";:root{--bg-primary:#121214;--bg-secondary:#1a1a1e;--bg-tertiary:#24242a;--color-text-main:#e2e2e9;--color-text-muted:#8e8e9f;--color-amber-glow:#ffb300;--color-amber-bg:#ffb3001a;--color-green-glow:#0f6;--color-green-bg:#00ff661a;--chassis-border:#2a2a32;--chassis-shadow:#000c;--font-main:"Outfit", sans-serif;--font-lcd:"Share Tech Mono", monospace;--font-header:"Orbitron", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--color-text-main);font-family:var(--font-main);min-height:100vh;padding-bottom:2rem;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-amber-glow)}.container{max-width:1200px;margin:0 auto;padding:1.5rem}.header{border-bottom:1px solid var(--chassis-border);justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;display:flex}.brand{font-family:var(--font-header);letter-spacing:.15em;color:#ffb300;text-shadow:0 0 10px #ffb30066;align-items:center;gap:.5rem;font-size:1.8rem;font-weight:700;display:flex}.brand span{color:var(--color-text-muted);font-size:1rem;font-weight:400}.dashboard-grid{grid-template-columns:1fr;gap:2rem;display:grid}@media (width>=1024px){.dashboard-grid{grid-template-columns:1.2fr 1fr}}.mpc-panel{background-color:var(--bg-secondary);border:2px solid var(--chassis-border);box-shadow:0 20px 40px var(--chassis-shadow), inset 0 1px 0 #ffffff0d;border-radius:12px;padding:1.5rem;position:relative;overflow:hidden}.mpc-panel:before{content:"";background:linear-gradient(90deg, var(--color-amber-glow), transparent, var(--color-green-glow));height:4px;position:absolute;top:0;left:0;right:0}.panel-title{font-family:var(--font-header);letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-main);align-items:center;gap:.5rem;margin-bottom:1.25rem;font-size:1.1rem;display:flex}.lcd-display{font-family:var(--font-lcd);color:var(--color-green-glow);text-shadow:0 0 6px #00ff668c;background-color:#0c180f;border:3px solid #1a2a1e;border-radius:6px;min-height:120px;padding:1rem;position:relative;box-shadow:inset 0 0 15px #000000e6}.lcd-display.amber{color:var(--color-amber-glow);text-shadow:0 0 6px #ffb3008c;background-color:#1a0f00;border-color:#331f00}.lcd-grid{grid-template-columns:repeat(2,1fr);gap:.5rem 1.5rem;font-size:.9rem;display:grid}.lcd-line{justify-content:space-between;display:flex}.lcd-label{color:var(--color-text-muted);text-shadow:none}.dropzone{border:2px dashed var(--chassis-border);text-align:center;cursor:pointer;background-color:#0000001a;border-radius:8px;flex-direction:column;align-items:center;gap:.75rem;padding:2rem 1.5rem;transition:all .25s;display:flex}.dropzone:hover,.dropzone.drag-active{border-color:var(--color-amber-glow);background-color:var(--color-amber-bg)}.dropzone svg{color:var(--color-text-muted);transition:color .25s}.dropzone:hover svg{color:var(--color-amber-glow)}.pad-container{flex-direction:column;gap:1.25rem;display:flex}.bank-selectors{grid-template-columns:repeat(4,1fr);gap:.5rem;display:grid}.bank-btn{background-color:var(--bg-tertiary);border:1px solid var(--chassis-border);color:var(--color-text-muted);font-family:var(--font-header);cursor:pointer;border-radius:4px;padding:.4rem;font-size:.9rem;transition:all .2s}.bank-btn:hover{color:var(--color-text-main);background-color:#2e2e36}.bank-btn.active[data-bank=A]{color:#fff;background-color:#e15b5b;border-color:#f88;box-shadow:0 0 8px #e15b5b66}.bank-btn.active[data-bank=B]{color:#000;background-color:#ffb300;border-color:#ffd54f;box-shadow:0 0 8px #ffb30066}.bank-btn.active[data-bank=C]{color:#000;background-color:#0f6;border-color:#69f0ae;box-shadow:0 0 8px #0f66}.bank-btn.active[data-bank=D]{color:#fff;background-color:#00b0ff;border-color:#40c4ff;box-shadow:0 0 8px #00b0ff66}.pad-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;display:grid}.mpc-pad{aspect-ratio:1;cursor:pointer;user-select:none;background:radial-gradient(circle at 30% 30%,#3e3e48,#26262d);border:2px solid #1a1a20;border-radius:6px;flex-direction:column;justify-content:space-between;padding:.4rem;transition:all .1s;display:flex;position:relative;box-shadow:2px 4px 6px #00000080,inset 0 1px #ffffff1a}.mpc-pad:active,.mpc-pad.active{transform:scale(.96);box-shadow:1px 2px 2px #000000b3}.mpc-pad.has-sample{border-color:#ffb30066}.mpc-pad.playing{box-shadow:0 0 15px var(--color-amber-glow);background:#ffb300;border-color:#ffd54f}.mpc-pad.playing .pad-label,.mpc-pad.playing .pad-note{color:#000!important}.pad-label{font-family:var(--font-header);color:var(--color-text-muted);font-size:.75rem;font-weight:700}.pad-sample-name{color:var(--color-text-main);text-align:center;text-overflow:ellipsis;white-space:nowrap;width:100%;font-size:.65rem;overflow:hidden}.pad-note{font-family:var(--font-lcd);color:var(--color-text-muted);align-self:flex-end;font-size:.65rem}.control-group{flex-direction:column;gap:.5rem;margin-bottom:1rem;display:flex}label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}input[type=text],input[type=number],select{background-color:var(--bg-tertiary);border:1px solid var(--chassis-border);color:var(--color-text-main);font-family:var(--font-main);border-radius:4px;padding:.5rem;font-size:.9rem}input[type=text]:focus,input[type=number]:focus,select:focus{border-color:var(--color-amber-glow);outline:none}input[type=range]{accent-color:var(--color-amber-glow);cursor:pointer;width:100%}.btn-primary{background:linear-gradient(135deg, var(--color-amber-glow), #ff8f00);color:#000;font-family:var(--font-header);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;border:none;border-radius:6px;width:100%;padding:.75rem 1.5rem;font-weight:700;transition:all .2s}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ffb3004d}.btn-primary:active{transform:translateY(1px)}.btn-secondary{background-color:var(--bg-tertiary);border:1px solid var(--chassis-border);color:var(--color-text-main);font-family:var(--font-header);cursor:pointer;border-radius:4px;padding:.5rem 1rem;transition:all .2s}.btn-secondary:hover{background-color:#2e2e36}.item-list{flex-direction:column;gap:.5rem;max-height:250px;margin-top:1rem;display:flex;overflow-y:auto}.item-row{background-color:var(--bg-tertiary);border-left:3px solid var(--color-amber-glow);border-radius:4px;justify-content:space-between;align-items:center;padding:.5rem .75rem;font-size:.85rem;display:flex}.item-row.green{border-left-color:var(--color-green-glow)}.row-title{color:var(--color-text-main);font-weight:600}.row-meta{color:var(--color-text-muted)}.badge{background-color:var(--bg-secondary);border:1px solid var(--chassis-border);color:var(--color-amber-glow);border-radius:3px;padding:.15rem .4rem;font-size:.7rem}@media (width<=480px){.container{padding:.75rem}.header{flex-direction:column;align-items:flex-start;gap:.75rem;margin-bottom:1.5rem}.brand{font-size:1.4rem}.mpc-panel{padding:1rem}.lcd-grid{grid-template-columns:1fr;gap:.5rem}}@media (width<=640px){.tool-selector{border-bottom:none;flex-direction:column;gap:.5rem;padding-bottom:0}.tool-tab{text-align:left;background-color:var(--bg-secondary);border-bottom:none;border:1px solid var(--chassis-border);border-radius:6px;width:100%;padding:.6rem 1rem}.tool-tab.active{background-color:var(--bg-tertiary);border-left:3px solid var(--color-amber-glow);border-color:var(--color-amber-glow) var(--chassis-border) var(--chassis-border) var(--color-amber-glow)}.tool-tab.active:after{display:none}}.tab-content[data-astro-cid-lcdefpme]{display:none}.tab-content[data-astro-cid-lcdefpme].active{display:block}.tool-selector[data-astro-cid-lcdefpme]{border-bottom:2px solid var(--chassis-border);gap:.75rem;margin-bottom:2rem;padding-bottom:.5rem;display:flex}.tool-tab[data-astro-cid-lcdefpme]{color:var(--color-text-muted);font-family:var(--font-header);text-transform:uppercase;letter-spacing:.1em;cursor:pointer;background:0 0;border:none;border-radius:4px 4px 0 0;padding:.6rem 1.25rem;font-size:.95rem;font-weight:700;transition:all .25s;position:relative}.tool-tab[data-astro-cid-lcdefpme]:hover{color:var(--color-text-main)}.tool-tab[data-astro-cid-lcdefpme].active{color:var(--color-amber-glow);text-shadow:0 0 8px #ffb30066}.tool-tab[data-astro-cid-lcdefpme].active:after{content:"";background-color:var(--color-amber-glow);height:3px;box-shadow:0 0 8px var(--color-amber-glow);position:absolute;bottom:-8px;left:0;right:0}