:root{--accent:#e24435;--bg:#f0eee4;--fg:#292b2b;--panel:#ffffff45;--line:#292b2b25}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;font-family:Arial,Helvetica,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button:disabled{opacity:.5;cursor:wait}.shell{max-width:1500px;margin:auto;padding:30px 40px}header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding-bottom:23px;display:flex}.brand{letter-spacing:-1px;font-size:20px;font-weight:900}.brand b{color:var(--accent);margin-right:12px}.tag{letter-spacing:2px;font-size:10px}.intro{justify-content:space-between;align-items:end;margin:38px 0 30px;display:flex}.intro h1{letter-spacing:-2.4px;margin:10px 0 14px;font-size:clamp(32px,4vw,58px);font-weight:800;line-height:1.04}.intro p{opacity:.65;max-width:500px;font-size:15px;line-height:1.6}.eyebrow{letter-spacing:2px;color:var(--accent);font-size:10px;font-weight:700}.edition{opacity:.55;font:italic 20px Georgia}.workspace{grid-template-columns:minmax(0,1fr) 280px;gap:24px;display:grid}.canvas{border:1px solid var(--line);background:var(--panel);border-radius:8px;justify-content:center;align-items:center;min-height:450px;display:flex;overflow:hidden}.canvas>svg{width:100%;height:auto;display:block}.controls{border:1px solid var(--line);background:var(--panel);border-radius:8px;flex-direction:column;gap:19px;padding:24px;display:flex}.controls h3{letter-spacing:1.8px;text-transform:uppercase;margin:0;font-size:11px}.controls label{letter-spacing:.2px;flex-direction:column;gap:10px;font-size:11px;display:flex}.label-row{justify-content:space-between;align-items:center;display:flex}.label-row strong{font-variant-numeric:tabular-nums;color:var(--accent);font-size:12px}input[type=range]{width:100%;accent-color:var(--accent);height:4px;margin:7px 0 3px}input[type=text],select,textarea{border:1px solid var(--line);background:var(--bg);width:100%;color:var(--fg);border-radius:4px;padding:10px;font-size:12px}textarea{resize:vertical;line-height:1.5}input[type=color]{background:0 0;border:0;width:100%;height:40px;padding:0}button{border:1px solid var(--line);color:var(--fg);background:0 0;border-radius:4px;padding:10px 14px;font-size:11px;font-weight:700;transition:background .15s,transform .15s}button:hover{background:var(--line);transform:translateY(-1px)}button.primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}.stat{border-top:1px solid var(--line);padding-top:18px}.stat strong{letter-spacing:-1px;font-size:29px;font-weight:500;display:block}.stat small{opacity:.6;margin-top:5px;font-size:10px;display:block}.note{opacity:.65;margin:0;font-size:11px;line-height:1.7}.toolbar{justify-content:space-between;align-items:center;gap:8px;margin-top:18px;display:flex}.toolbar span{opacity:.5;font-size:10px}.toolbar div{gap:8px;display:flex}.bottom{border-top:1px solid var(--line);letter-spacing:1px;opacity:.5;justify-content:space-between;margin-top:34px;padding:18px 0;font-size:9px;display:flex}.foley-board{width:100%;padding:24px}.film-frame{color:#f3a551;background:#263740;justify-content:space-between;align-items:center;height:260px;padding:20px;display:flex}.film-frame>span{letter-spacing:2px;align-self:start;font-size:10px}.film-frame strong{align-self:end;font-family:monospace;font-size:30px}.window-frame{color:#a1b5be;border:8px solid #c4a375;padding:20px 35px;font-size:90px}.track{margin-top:22px}.track small{opacity:.6;margin-bottom:8px;font-size:10px;display:block}.track-line{background:#26343c;height:35px;position:relative}.track-line button{white-space:nowrap;text-overflow:ellipsis;color:#111;text-align:left;background:#bb813f;border:1px solid #f1ae5a;height:35px;padding:5px;font-size:9px;position:absolute;overflow:hidden}.track-line i{border-left:2px solid #fff;height:45px;position:absolute;top:-5px}.proof-sheet,.score-sheet{color:#292b2d;background:#faf7ec;width:100%;min-height:530px;padding:40px}.proof-sheet h2,.score-sheet h2{margin:20px 0 30px;font:italic 44px/1.05 Georgia}.proof-lines{max-width:600px;margin-top:35px;font-family:monospace;font-size:14px;line-height:1.7}.proof-sheet footer{letter-spacing:2px;color:#305ac2;margin-top:40px;font-size:10px}.braid{width:100%;padding:25px}.braid-head{letter-spacing:1px;grid-template-columns:repeat(3,1fr);gap:12px;margin-left:35px;padding-bottom:20px;font-size:9px;display:grid}.braid-row{border-top:1px solid #4d455b;grid-template-columns:25px repeat(3,1fr);gap:12px;min-height:76px;display:grid}.braid-row>small{opacity:.5;padding-top:18px;font-size:10px}.braid-row>div{border-radius:4px;margin:8px 0;padding:12px}.braid-row span{letter-spacing:1px;opacity:.65;margin-bottom:7px;font-size:8px;display:block}.braid-row strong{font-size:12px;font-weight:500}.bar-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.bar-grid button{text-align:left;color:#3f3931;background:#ece5d6;border:2px solid #0000;padding:10px}.bar-grid button.safe{background:#cfe0cb}.bar-grid button.selected{border-color:#b14d31}.bar-grid small{letter-spacing:1px;font-size:8px}.bar-grid strong{font-size:18px;display:block}.bar-grid span{opacity:.7;font-size:8px}.staff{text-align:center;background:repeating-linear-gradient(#0000 0 5px,#c4baa9 5px 6px);height:30px;margin:8px 0;font:30px Georgia}.score-sheet>p{color:#53684c;margin-top:25px;font-size:11px}.poster-stage{background:#c8c6bd;flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;min-height:575px;padding:25px;display:flex}.poster-stage svg{transition:width .3s;box-shadow:5px 10px 20px #0003}.poster-stage small{letter-spacing:2px;color:#555;font-size:9px}@media (width>=1400px){.canvas{min-height:600px}.workspace{grid-template-columns:minmax(0,1fr) 310px}}@media (width<=850px){.shell{padding:22px}.workspace{grid-template-columns:1fr}.controls{grid-template-columns:1fr 1fr;display:grid}.controls h3{grid-column:1/-1}.canvas{min-height:320px}.intro{margin-top:28px}.edition{display:none}}@media (width<=480px){.shell{padding:16px}.intro h1{letter-spacing:-1.2px;font-size:34px}.tag{letter-spacing:1px;font-size:8px}.brand{font-size:16px}.controls{padding:20px;display:flex}.toolbar{align-items:start;gap:12px}.toolbar span{max-width:110px;line-height:1.6}.proof-sheet,.score-sheet{padding:20px}.proof-lines{font-size:10px}.bar-grid{grid-template-columns:repeat(2,1fr)}.braid{padding:12px}.braid-row{gap:5px}.braid-head{gap:5px;font-size:7px}.braid-row>div{padding:8px}.braid-row strong{font-size:10px}.film-frame{height:200px;padding:10px}.film-frame>span{font-size:8px}.window-frame{padding:10px;font-size:60px}.bottom{font-size:8px}.poster-stage{min-height:460px}}@media (width>=851px){.workspace{flex-direction:column;display:flex}.controls{grid-template-columns:repeat(4,1fr);align-items:start;display:grid}.controls h3{grid-column:1/-1}.canvas,.canvas>svg{max-height:610px}.controls .note{grid-column:span 2}.intro{border-left:4px solid var(--accent);padding-left:24px}}html,body,#root{height:100%;min-height:100%;overflow:hidden}.shell{flex-direction:column;gap:12px;width:100%;height:100dvh;display:flex;max-width:none!important;padding:16px 24px!important}header{flex:none;min-height:35px;padding:0 0 12px}.intro{flex:none;align-items:center;min-height:76px;border:0!important;margin:0!important;padding:0!important;display:flex!important}.intro h1{letter-spacing:-1px!important;max-width:none!important;margin:3px 0!important;font-size:clamp(22px,2.6vw,36px)!important}.intro p{margin:4px 0 0;max-width:800px!important;font-size:12px!important}.intro .eyebrow{letter-spacing:1.5px;font-size:8px}.edition{font-size:14px}.workspace{flex:1;gap:16px;height:auto;min-height:0;grid-template-columns:minmax(0,1fr) 270px!important;display:grid!important}.workspace>section{flex-direction:column;min-width:0;min-height:0;display:flex;grid-area:1/1!important}.controls{gap:18px;min-height:0;max-height:100%;padding:18px;overflow-y:auto;grid-area:1/2!important;display:flex!important}.canvas{flex:1;width:100%;height:100%;overflow:auto;min-height:0!important;max-height:none!important}.canvas>svg{width:100%;height:100%;min-height:260px;max-height:none!important}.toolbar{gap:10px;min-height:34px;margin-top:10px}.toolbar button{padding:8px 10px}.bottom{display:none}.shell.immersive .workspace{grid-template-columns:minmax(0,1fr)!important}.shell.immersive .controls{display:none!important}.motion-controls{align-items:center;gap:6px;display:flex}.motion-controls button{font-size:10px}.canvas svg circle,.canvas svg ellipse,.canvas svg rect,.canvas svg line,.canvas svg text,.canvas svg g,.canvas svg path{transition:cx .35s,cy .35s,r .35s,x .35s,y .35s,width .35s,height .35s,fill .5s,opacity .4s,transform .45s,d .4s}.canvas .braid-row,.canvas .track-line button,.canvas .bar-grid button{animation:.4s ease-out place-in}.poster-stage{height:100%;min-height:0!important}.poster-stage svg{max-height:calc(100% - 30px)!important}.foley-board,.braid,.score-sheet,.proof-sheet{height:100%;min-height:0;overflow:auto}.foley-board{padding:20px}.film-frame{height:40%;min-height:110px}.window-frame{padding:5px 25px;font-size:52px}.film-frame strong{font-size:24px}.score-sheet,.proof-sheet{padding:24px}.score-sheet h2,.proof-sheet h2{margin:12px 0 18px;font-size:34px}.bar-grid{gap:8px}.bar-grid button{padding:8px}.staff{margin:4px 0}.canvas .playing-note{animation:.35s ease-in-out infinite alternate note-pulse}@keyframes place-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes note-pulse{0%{opacity:.5}to{opacity:1}}@media (width<=850px){.shell{gap:8px;padding:10px 12px!important}.edition{display:none}.intro{min-height:70px}.workspace{gap:10px;grid-template-columns:minmax(0,1fr) 220px!important}.controls{gap:14px;padding:12px}.toolbar span{display:none}.toolbar{justify-content:flex-end}.intro h1{font-size:24px!important}}@media (width<=600px){.shell{height:100dvh;overflow:auto}.workspace{position:relative;grid-template-columns:1fr!important}.controls{z-index:4;background:var(--bg);width:230px;position:absolute;top:0;bottom:44px;right:0;box-shadow:-8px 0 25px #0004}.intro{min-height:66px}.intro p{font-size:10px!important}.intro .eyebrow{display:none}.canvas>svg{min-height:220px}.toolbar div{flex-wrap:wrap;gap:5px}.toolbar button{padding:8px;font-size:9px}.tag{font-size:8px}.brand{font-size:14px!important}.proof-lines{font-size:10px}.bar-grid{grid-template-columns:repeat(2,1fr)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}@media (width<=600px){.intro{flex-wrap:wrap;gap:7px;padding-bottom:3px!important}.intro>div:first-child{width:100%}.motion-controls{justify-content:flex-end;width:100%}.motion-controls button{padding:7px 9px;font-size:9px}.shell{gap:7px}.canvas{border-width:1px!important}}