:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f4f4f4;background:#050505;font-synthesis:none}*{box-sizing:border-box}html,body,#app,.stage{width:100%;height:100%;margin:0;overflow:hidden}.stage{position:relative;background:#000}canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 50%,transparent 48%,rgba(0,0,0,.34) 100%)}button,input{font:inherit}.glass{background:rgba(8,8,10,.58);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(18px);box-shadow:0 18px 60px rgba(0,0,0,.3)}.hidden{display:none!important}.boot-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,calc(100% - 40px));text-align:center;padding:42px 34px;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(18px);z-index:10}.brand,.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:800;opacity:.62}.boot-panel h1{margin:10px 0 8px;font-size:clamp(30px,5vw,58px);line-height:.98}.boot-panel p{opacity:.72}.primary{margin-top:18px;padding:14px 30px;border:0;background:#fff;color:#000;font-weight:900;letter-spacing:.08em;cursor:pointer}.primary:disabled{opacity:.35}.hint{font-size:12px}.hud{position:absolute;left:24px;top:22px;right:24px;display:flex;justify-content:space-between;align-items:flex-start;z-index:3;pointer-events:none;text-shadow:0 2px 16px #000}.track-title{font-size:clamp(18px,2.2vw,34px);font-weight:850;max-width:70vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preset-title{font-size:12px;opacity:.56;max-width:65vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}.energy{width:90px;height:5px;background:rgba(255,255,255,.18);overflow:hidden;margin-top:10px}.energy span{display:block;width:100%;height:100%;background:#fff;transform-origin:left;transform:scaleX(0)}.transport{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;align-items:center;gap:7px;padding:8px;z-index:4;width:min(820px,calc(100% - 26px))}.transport button,.panel button,.playlist-panel button{border:0;color:#fff;background:rgba(255,255,255,.08);cursor:pointer;border-radius:2px}.transport button{height:42px;padding:0 14px;font-weight:800}.transport button:hover,.panel button:hover{background:rgba(255,255,255,.16)}.seek-wrap{flex:1;min-width:100px;padding:0 8px}.seek-wrap input{width:100%;accent-color:white}.seek-wrap #timeLabel{font-size:10px;opacity:.6;text-align:center}.panel,.playlist-panel{position:absolute;right:22px;top:22px;width:min(340px,calc(100% - 44px));max-height:calc(100% - 100px);overflow:auto;z-index:8;padding:18px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;letter-spacing:.08em}.panel-head button{width:32px;height:32px;font-size:22px}.panel label{display:block;font-size:12px;margin:17px 0}.panel label output{float:right;opacity:.6}.panel input[type=range]{width:100%;margin-top:8px;accent-color:#fff}.row-check{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:12px}.playlist-block{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.playlist-block #playlistInfo{margin:5px 0 10px}.playlist-block button{padding:9px 12px}.playlist-panel{left:22px;right:auto;width:min(420px,calc(100% - 44px))}.track-item{width:100%;display:flex;gap:12px;text-align:left;padding:10px!important;margin:3px 0;background:transparent!important}.track-item span{opacity:.35}.track-item.active{background:rgba(255,255,255,.13)!important}.track-item b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toast{position:absolute;top:24px;left:50%;transform:translate(-50%,-15px);background:#111;border:1px solid rgba(255,255,255,.18);padding:10px 14px;z-index:20;opacity:0;pointer-events:none;transition:.2s;font-size:12px}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:650px){.hud{left:14px;top:14px}.transport{bottom:10px}.transport button{padding:0 9px}.transport #nextPreset{display:none}.panel,.playlist-panel{top:12px;left:12px;right:12px;width:auto;max-height:calc(100% - 84px)}}

/* --- Viewport sizing hardening patch --- */
html, body {
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  overscroll-behavior: none;
  background: #000;
}

body, #app, .stage {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  width: 100dvw;
  height: 100dvh;
  margin: 0;
  padding: 0;
  max-width: none;
  max-height: none;
}

#visualizer {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  transform: none !important;
  transform-origin: 0 0 !important;
}

.viewport-debug {
  position: fixed;
  right: 12px;
  bottom: 82px;
  z-index: 99999;
  pointer-events: none;
  white-space: pre;
  padding: 8px 10px;
  font: 11px/1.45 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: #fff;
  background: rgba(0, 0, 0, .72);
  border: 1px solid rgba(255, 255, 255, .22);
  text-shadow: none;
}

/* --- Preset pack controls --- */
.preset-meta{font-size:10px;opacity:.42;margin-top:3px;letter-spacing:.04em}.section-title{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:10px;letter-spacing:.18em;font-weight:850;opacity:.62}.panel select{width:100%;margin-top:8px;padding:9px 10px;color:#fff;background:#141417;border:1px solid rgba(255,255,255,.14)}.pack-list{margin-top:10px;border-top:1px solid rgba(255,255,255,.08)}.pack-row{display:flex!important;align-items:center;justify-content:space-between;gap:12px;margin:0!important;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.pack-row>span{display:flex;flex-direction:column;min-width:0}.pack-row b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pack-row small{font-size:10px;opacity:.48;margin-top:2px}.pack-row input{flex:0 0 auto}.pack-row.pack-error small{opacity:.8}.pool-info{font-size:10px;opacity:.55;margin-top:8px;line-height:1.4}

/* --- Visual speed controls --- */
.speed-reactive-controls{transition:opacity .2s}.speed-reactive-controls.speed-disabled{opacity:.36}.speed-note{font-size:10px;line-height:1.45;opacity:.48;margin:-4px 0 10px}.speed-reactive-controls label{margin:12px 0}.section-title+label{margin-top:12px}