.workspace-panel.chart-panel{padding:20px 12px}.note-highway{width:100%;max-width:480px;margin-inline:auto;text-align:left}.highway-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.note-highway .highway-heading h2{margin:0;font-size:18px}.note-highway .highway-caption{margin:10px 0 24px;font-size:12px}.highway-legend{margin-left:44px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-bottom:8px}.highway-legend>span{min-width:0;text-align:center;font-size:10px;font-weight:650}.highway-legend i{display:block;width:16px;height:3px;border-radius:2px;margin:0 auto 6px}.highway-frame{padding:20px 0;border:1px solid #3f354c;border-radius:12px;background:#100e16}.highway-track{position:relative;height:clamp(280px,42svh,420px)}.highway-lanes{position:absolute;top:0;right:0;bottom:0;left:44px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:linear-gradient(#16121d,#21192c)}.highway-lane{position:relative;border-left:1px solid #50435e}.highway-lane:nth-child(2n){background:#ffffff03}.highway-lane-end{position:absolute;bottom:-6px;left:20%;right:20%;height:3px;opacity:.8;border-radius:2px}.highway-beat{pointer-events:none;position:absolute;left:0;right:0;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;transform:translateY(50%)}.highway-ruler{display:grid;gap:1px;padding-left:7px;font-size:10px;line-height:1.2;color:#a99bb8;font-variant-numeric:tabular-nums}.highway-ruler strong{font-size:11px;color:#ddc6fb}.highway-tick{color:#a99bb8}.highway-beat-line{height:1px;background:#61516f}.highway-measure .highway-beat-line{height:2px;background:#b18bd3}.note-highway .highway-footnote{margin:14px 0 0;max-width:none;color:#aaa4bb;font-size:11px}.highway-frame{touch-action:none;user-select:none;-webkit-user-select:none}.highway-lane{cursor:crosshair}.highway-subdivision{position:absolute;left:44px;right:0;height:1px;background:#ffffff0b;pointer-events:none}.highway-note{position:absolute;z-index:1;left:12%;width:76%;height:3.125%;max-height:18px;min-height:0;padding:0;transform:translateY(50%);border:1px solid #ffffffb0;border-radius:45%;box-shadow:inset 0 -3px #00000040,0 0 5px #000;touch-action:none;cursor:pointer}.highway-note:focus-visible{outline-offset:2px}.highway-zoom{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-bottom:16px;color:#aaa4bb;font-size:12px}.highway-zoom-button{min-width:44px;font-size:20px;padding-inline:12px}.highway-zoom-value{min-width:40px;text-align:center;font-variant-numeric:tabular-nums;color:#f4f0ff}.highway-sustain-tail{position:absolute;left:36%;width:28%;opacity:.65;pointer-events:none;border-inline:1px solid #ffffff66}.highway-sustain-end{position:absolute;z-index:2;left:20%;width:60%;height:3.125%;max-height:16px;min-height:0;padding:0;transform:translateY(50%);border:2px solid #ffffffbf;border-radius:4px;touch-action:none;cursor:ns-resize}.highway-sustain-preview{min-height:18px;margin-top:12px;color:#ddc6fb;font-size:12px}.highway-section-controls{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.highway-section-controls button{flex:1;padding-inline:8px}.highway-position{display:grid;gap:4px;margin-bottom:16px;font-size:11px;color:#c8adef;font-variant-numeric:tabular-nums}.highway-position input{width:100%;min-height:44px;margin:0;accent-color:#b28afa}.highway-section-marker{position:absolute;left:44px;right:0;border-top:1px dashed #68d8c6;pointer-events:none}.highway-position-cursor{position:absolute;left:44px;right:0;border-top:2px dashed #f4f0ff;pointer-events:none;z-index:2}.highway-position-cursor span{position:absolute;left:-12px;top:-9px;font-size:12px;color:#f4f0ff}.section-panel{max-height:min(80dvh,680px)}.section-panel fieldset{border:0;padding:0;margin:0;min-width:0}.section-panel select{width:100%;min-height:48px;font:inherit;font-size:16px;border:1px solid #66517f;border-radius:10px;padding:10px;background:#111018;color:#f4f0ff}.section-add{border-top:1px solid #392c46;margin-top:24px;padding-top:20px}.section-add h3{font-size:18px}.section-confirm{margin-top:16px}.highway-section-labels{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.highway-section-chip{max-width:100%;min-height:44px;padding:8px 10px;background:#15312f;color:#a4eee2;border:1px solid #32665e;border-radius:8px;font-size:12px;text-align:left;overflow-wrap:anywhere}.note-highway .highway-timeline{font-size:11px;margin:0 0 8px}.highway-window-controls{display:flex;justify-content:space-between;gap:8px;margin-bottom:12px}.expandable-workspace{padding-bottom:calc(50svh + 100px)}.highway-selection-controls{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:12px}.highway-selection-controls button{min-height:44px}.highway-selection-controls [aria-pressed=true]{background:#503278;border-color:#c4a2ff}.highway-selection-status{flex:1;min-width:120px;font-size:12px;color:#ddc6fb}.highway-selected{outline:2px solid #fff;outline-offset:2px;box-shadow:inset 0 -3px #00000040,0 0 0 4px #42235f}.highway-note,.highway-sustain-end{-webkit-touch-callout:none}.highway-note[data-note-type=force-hopo]:after,.highway-note[data-note-type=force-strum]:after,.highway-note[data-note-type=tap]:after{content:"";position:absolute;pointer-events:none;top:50%;left:50%;transform:translate(-50%,-50%);width:7px;height:7px;max-height:70%;box-sizing:border-box}.highway-note[data-note-type=force-hopo]:after{border:1px solid #fff;border-radius:50%;background:#0006}.highway-note[data-note-type=force-strum]:after{border-inline:2px solid #fff;background:#0006}.highway-note[data-note-type=tap]:after{border-radius:50%;background:#fff;box-shadow:0 0 1px #000}.note-properties{max-height:85dvh;overflow-y:auto}.note-properties fieldset{border:0;padding:0;margin:0;min-width:0}.note-property-option{display:flex;align-items:center;gap:12px;min-height:48px;cursor:pointer}.note-property-option input{width:20px;height:20px;accent-color:#b28afa}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f4f0ff;background:#111018;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-width:320px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;min-height:44px;border:0}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #c7a6ff;outline-offset:5px}button:hover{filter:brightness(1.12)}h1,h2,h3,p{margin-top:0}p{color:#aaa4bb;line-height:1.7}h2{font-size:20px;letter-spacing:-.5px}h3{margin-bottom:6px;font-size:24px;letter-spacing:-.7px}.app-shell{max-width:1100px;min-height:100vh;min-height:100dvh;margin:auto;padding:env(safe-area-inset-top,0px) max(22px,env(safe-area-inset-right,0px)) max(28px,env(safe-area-inset-bottom,0px)) max(22px,env(safe-area-inset-left,0px))}.app-header{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #282432}.brand{display:flex;align-items:center;gap:10px;background:transparent;text-align:left;font-weight:750;line-height:1.15;padding:0}.brand-mark{display:grid;place-items:center;height:40px;width:40px;border-radius:12px;background:#9d72fa;color:#171020;font-size:32px}.brand-secondary{display:block;color:#aaa4bb;font-size:13px;font-weight:500}.settings-button{background:#211d2c;border:1px solid #342c43;border-radius:12px;padding:0 12px;font-size:13px}.settings-button span{margin-right:4px}.home{padding:52px 0 20px}.eyebrow{font-size:10px;font-weight:750;letter-spacing:1.8px;color:#b294e5}.home h1{font-size:clamp(44px,8vw,76px);line-height:1.06;letter-spacing:-2.5px;margin:20px 0}.home h1 span{color:#b792ff}.intro{max-width:420px;font-size:16px;margin-bottom:44px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.section-heading h2{margin:0}.muted{color:#aaa4bb;font-size:12px}.project-card{padding:24px;border:1px solid #3a2e4d;border-radius:20px;background:linear-gradient(135deg,#261d35,#191620);display:grid;gap:24px}.project-art{width:64px;height:64px;display:grid;place-items:center;background:#3b2858;color:#c7a6ff;border:1px solid #604080;border-radius:16px;font-size:32px}.project-card h3{margin-top:12px}.project-card p{margin-bottom:0;font-size:14px}.primary-button{padding:15px 20px;display:flex;justify-content:space-between;gap:24px;align-items:center;background:#b28afa;color:#1b102c;border-radius:12px;font-weight:700}.home-note{font-size:12px;max-width:430px;margin:20px 0 0}.workspace{padding-top:20px;padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}.back-button{background:transparent;color:#b7a4d6;padding:0;font-size:13px}.workspace-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0}.workspace-heading h1{font-size:clamp(25px,5vw,36px);letter-spacing:-1px;margin:10px 0 0}.badge{font-size:11px;color:#c8adef;background:#30233f;border:1px solid #4b365f;border-radius:20px;padding:6px 10px;white-space:nowrap}.workspace-panel{min-height:340px;padding:36px 24px;background:#19161f;border:1px solid #302838;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.empty-icon{display:grid;place-items:center;background:#2b203d;color:#bc96ff;border:1px solid #493260;width:70px;height:70px;border-radius:20px;font-size:36px;margin-bottom:24px}.workspace-panel h2{margin:14px 0 8px}.workspace-panel p{max-width:350px;font-size:14px}.coming-soon{font-size:11px;color:#aaa4bb;border:1px dashed #4a4057;border-radius:8px;padding:8px 12px;margin-top:8px}.tabs{position:fixed;bottom:0;left:0;right:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:10px max(12px,env(safe-area-inset-right,0px)) max(10px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));border-top:1px solid #33283f;background:#17131f;z-index:2}.tabs button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 4px;background:transparent;color:#a49bad;font-size:11px;border-radius:10px}.tabs button[aria-selected=true]{background:#31223f;color:#d0b0ff}.tab-icon{font-size:23px;line-height:24px}dialog{width:min(400px,calc(100% - 44px));max-height:80dvh;border:1px solid #4b365f;background:#1c1726;color:#f4f0ff;border-radius:20px;padding:24px}dialog::backdrop{background:#08060dcc}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading h2{margin:0}.icon-button{background:transparent;font-size:28px;min-width:44px}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-top:1px solid #392c46;margin-bottom:12px}.skip-link{position:fixed;top:-100px;background:#b28afa;color:#171020;padding:12px;z-index:5}.skip-link:focus{top:max(12px,env(safe-area-inset-top,0px))}@media(min-width:700px){.app-shell{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}.home{padding-top:68px}.project-card{grid-template-columns:auto 1fr auto;align-items:center;padding:30px}.tabs{position:static;border:1px solid #33283f;border-radius:16px;margin-top:20px;padding:8px}.workspace{padding-bottom:20px}.workspace-panel{min-height:400px}}.project-list{display:grid;gap:16px}.project-details{min-width:0}.project-details h3,.workspace-heading h1,dialog p{overflow-wrap:anywhere}.workspace-heading>div{min-width:0}.project-actions{display:flex;flex-wrap:wrap;gap:8px}.project-label{display:grid;gap:10px;margin:20px 0;font-size:14px}.project-label input{width:100%;min-height:48px;border:1px solid #66517f;border-radius:10px;padding:12px;font:inherit;font-size:16px;background:#111018;color:#f4f0ff}.project-label input:focus-visible{outline:2px solid #c7a6ff;outline-offset:2px}.danger-button{background:#9e3457;border-radius:12px;padding:12px 16px}.error-message{color:#ffb9c9}.save-status{font-size:12px;color:#c8adef;margin:16px 0 0;min-height:20px}button:disabled{opacity:.55;cursor:default}@media(min-width:700px)and (max-width:950px){.project-list .project-card{grid-template-columns:auto minmax(0,1fr)}.project-list .project-actions{grid-column:2}}.projects-heading{flex-wrap:wrap}.project-list .project-card{grid-template-columns:minmax(0,1fr)}@media(min-width:700px){.project-list .project-card{grid-template-columns:auto minmax(0,1fr)}.project-list .project-actions{grid-column:2}}
