:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#16181c;--panel:#22252b;--line:#343841;--fg:#e7e9ee;--dim:#9aa2b1;--accent:#4da3ff;font-family:system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif}body{background:var(--bg);color:var(--fg);margin:0}.app{box-sizing:border-box;flex-direction:column;gap:10px;min-height:100vh;padding:12px 16px;display:flex}.header{flex-wrap:wrap;align-items:baseline;gap:12px;display:flex}.header h1{letter-spacing:.02em;margin:0;font-size:16px}.header-file{font-size:14px}.header-meta{color:var(--dim);font-size:12px}.header-close{margin-left:auto}button{background:var(--panel);color:var(--fg);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:5px 10px;font-size:13px}button:hover{border-color:var(--accent)}.drop{border:2px dashed var(--line);cursor:pointer;border-radius:12px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:6px;min-height:60vh;display:flex}.drop.is-over{border-color:var(--accent);background:#1b2430}.drop-title{margin:0;font-size:18px}.drop-sub{color:var(--dim);margin:0;font-size:13px}.drop-error{color:#ff8a8a;text-align:center;max-width:60ch;font-size:13px}.stage{border:1px solid var(--line);background:#000;border-radius:8px;flex:1;justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.stage-canvas{object-fit:contain;max-width:100%;max-height:68vh}.rangebar{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:7px;height:14px;position:relative}.rangebar-selected{border-left:1px solid var(--accent);border-right:1px solid var(--accent);background:#4da3ff59;position:absolute;top:0;bottom:0}.rangebar-cursor{background:#fff;width:2px;position:absolute;top:-2px;bottom:-2px}.transport{flex-direction:column;gap:8px;display:flex}.transport-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.transport-frame{font-variant-numeric:tabular-nums;font-size:13px}.transport-time,.transport-range{color:var(--dim);font-size:12px}.transport-slider{width:100%}.stage-inner{max-width:100%;height:68vh;max-height:68vh;position:relative}.stage-inner .stage-canvas,.stage-overlay{width:100%;height:100%;display:block;position:absolute;inset:0}.stage-overlay{pointer-events:none}.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:8px;padding:10px 12px;display:flex}.panel-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.panel-sep{flex:1}.panel-label{color:var(--dim);align-items:center;gap:6px;font-size:12px;display:flex}.panel-label select{background:var(--bg);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:4px 6px}.panel-status,.panel-progress{color:var(--dim);font-variant-numeric:tabular-nums;font-size:12px}.panel-error{color:#ff8a8a;margin:0;font-size:13px}button.primary{background:#1d4f86;border-color:#2f6fb5}button:disabled{opacity:.45;cursor:default}progress{flex:1;height:10px}.chip{opacity:.45;border-style:solid;border-width:1px;align-items:center;gap:6px;font-size:12px;display:inline-flex}.chip.is-on{opacity:1}.chip-dot{border-radius:50%;width:8px;height:8px;display:inline-block}.charts{flex-direction:column;gap:6px;display:flex}.chart{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:6px 8px}.chart-title{color:var(--fg);font-size:12px}.chart-range{color:var(--dim)}.chart svg{cursor:pointer;width:100%;height:auto}.stick-preview{border:1px solid var(--line);background:#fff;border-radius:6px;max-width:100%;max-height:60vh;display:block}.panel-label input[type=checkbox]{accent-color:var(--accent)}.rotate-hint{display:none}@media (pointer:coarse){button{min-height:44px;padding:8px 14px;font-size:14px}.panel-label select{min-height:40px;font-size:14px}.transport-slider{height:32px}.rangebar{height:22px}.chip{min-height:40px}}@media (width<=950px) and (orientation:portrait){.app>:not(.rotate-hint):not(.header){display:none}.rotate-hint{text-align:center;color:var(--dim);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:10px;min-height:70vh;display:flex}.rotate-hint-icon{font-size:44px}}@media (width<=950px) and (orientation:landscape){.app{padding:6px 10px;padding-left:max(10px, env(safe-area-inset-left));padding-right:max(10px, env(safe-area-inset-right));gap:6px}.header h1{font-size:13px}.header-meta{display:none}.stage-inner{height:56vh;max-height:56vh}.panel{gap:6px;padding:6px 8px}.panel-sep{display:none}.charts{max-height:40vh;overflow-y:auto}.stick-preview{max-height:45vh}}