:root{font-family:Arial,sans-serif;color:#dddcd2;background:#151613;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{background:none;border:0;color:inherit;cursor:pointer}button:disabled{opacity:.3;cursor:not-allowed}a{color:inherit;text-decoration:none}button:hover:not(:disabled),a:hover{color:#ecc17b}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #e5b36d;outline-offset:5px}header{height:108px;display:flex;align-items:center;padding:0 48px;border-bottom:1px solid #33342d;gap:80px}.brand{font-size:32px;letter-spacing:8px;font-weight:800}.brand span{display:block;font-size:10px;font-weight:400;letter-spacing:2.7px;color:#9b9e8e;margin-top:8px}.edition{font-size:9px;letter-spacing:2px;color:#9b9e8e}.edition span{display:block;color:#686c5e;margin-top:8px}nav{margin-left:auto;display:flex;gap:32px;font-size:12px}nav span{font-size:9px;color:#787d6a;margin-left:8px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;min-height:720px;height:calc(100vh - 190px)}.stage{position:relative;overflow:hidden;touch-action:none}.stage canvas{touch-action:none}.stage-label{position:absolute;top:28px;left:48px;z-index:1;font-size:9px;letter-spacing:1.8px}.dim{color:#696e5c;margin-left:14px}.dot{display:inline-block;background:#c5ab77;width:5px;height:5px;border-radius:50%;margin-right:8px}.coordinate{position:absolute;left:48px;top:110px;font-size:10px;line-height:1.8;color:#74796a;pointer-events:none}.coordinate span{font-size:7px;letter-spacing:1.3px;writing-mode:vertical-rl;margin-top:18px}.invitation{position:absolute;bottom:67px;left:48px;pointer-events:none}.invitation>span{font-size:8px;letter-spacing:1.7px;color:#969b89}.invitation h1{font-weight:400;font-size:clamp(26px,3vw,43px);line-height:1.16;letter-spacing:-1.8px;margin:18px 0 14px}.invitation em{font-style:normal;color:#b3b6a8}.invitation p{font-size:11px;color:#8b907e}.activate{pointer-events:auto;background:#e9bd7b;color:#26251e;padding:13px 17px;margin-top:14px;font-size:11px;min-width:185px;text-align:left}.activate span{float:right}.activate:hover:not(:disabled){background:#ffdaa1;color:#151613}.stage-footer{position:absolute;left:48px;right:30px;bottom:23px;display:flex;justify-content:space-between;color:#838a73;font-size:8px;letter-spacing:1.3px;pointer-events:none}aside{border-left:1px solid #34362d;padding:28px 25px;overflow:auto;background:#181914}.panel-title{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:#a6ab96;align-items:center}.panel-title>span{color:#656d59}.voice-list{margin-top:22px}.voice{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:13px 10px;border:1px solid transparent;font-size:12px;margin-bottom:6px}.voice.selected{border-color:#575a46;background:#23251c}.voice-icon{font-size:29px;color:#d4b37d}.voice small{display:block;font-size:7px;letter-spacing:1.3px;margin-top:6px;color:#858e74}.voice>span:last-child{margin-left:auto;color:#c9b78c}.add{border-bottom:1px solid #34382b;width:100%;text-align:left;padding:15px 10px;color:#959c85;font-size:11px}.shape-title{margin-top:29px;margin-bottom:26px}.param{display:block;margin-bottom:22px}.param>span{display:flex;align-items:center;text-transform:capitalize;font-size:11px;gap:12px}.param b{font-size:8px;color:#646d56;font-weight:400}.param output{margin-left:auto;color:#c8b78c;font-size:10px}.param small{font-size:8px;color:#79816c}.param input{display:block;width:100%;margin:12px 0 6px}input[type=range]{height:2px;accent-color:#d8ba81;cursor:pointer}.position{display:flex;gap:18px;margin-top:8px}.position label{min-width:0;font-size:9px;color:#90997e}.position input{width:100%;margin:13px 0}.voice-actions{display:flex;justify-content:space-between;font-size:9px;padding:12px 0;border-bottom:1px solid #34382b}.mapping{padding-top:25px}.mapping>span{font-size:8px;letter-spacing:1.5px;color:#aaa88e}.mapping p{font-size:9px;line-height:1.8;color:#7f876f}.mapping strong{font-size:21px;font-weight:400;color:#c8bd9c}.mapping strong small{font-size:7px;letter-spacing:1px;color:#7e876d}footer{min-height:82px;border-top:1px solid #35372e;padding:20px 40px;display:flex;justify-content:space-between;gap:18px;align-items:center;font-size:10px}.transport,.master{display:flex;align-items:center;gap:20px}.transport i{height:20px;width:1px;background:#3a3e30}.rec{color:#d9a975}.rec.recording{color:#ff7d64}.on{color:#edc17a}select{background:#20231a;border:1px solid #3c4231;padding:5px;font-size:10px}.master{gap:12px;color:#969f85}.master input{width:70px}.master span{font-size:9px}.status{padding:10px 30px;font-size:11px;background:#2c2d20;color:#e4d2a4;display:flex;justify-content:space-between}.status button{font-size:16px}.clip{display:flex;align-items:center;gap:20px;padding:15px 30px;border-top:1px solid #3c4130;font-size:10px}.clip>span{font-size:8px;letter-spacing:2px}audio{height:32px;max-width:45vw}.library{position:fixed;top:90px;right:25px;width:min(570px,calc(100vw - 40px));background:#22251c;border:1px solid #62634b;padding:25px;z-index:10;box-shadow:0 30px 100px #0009}.library p{font-size:12px;color:#a5ad94}.save-row,.saved{display:flex;gap:12px;margin-top:20px;align-items:center;font-size:11px}.library input{min-width:0;flex:1;background:#181b14;border:1px solid #424a35;padding:10px;color:#dedfcd}.saved button{font-size:10px}.fallback{display:flex;height:100%;align-items:center;justify-content:center;padding:40px;text-align:center;color:#c6b991}@media(max-width:1000px){header{padding:0 25px;gap:35px}.edition{display:none}.workspace{grid-template-columns:minmax(0,1fr) 270px}.stage-label,.coordinate,.invitation,.stage-footer{left:25px}.stage-footer span:last-child{display:none}aside{padding:25px 19px}footer{padding:20px;flex-wrap:wrap}.transport{gap:13px}}@media(max-width:650px){header{height:87px;padding:0 20px}.brand{font-size:25px}.brand span{font-size:8px}nav{gap:18px;font-size:10px}.workspace{display:block;height:auto;min-height:0}.stage{height:620px}.stage-label{top:22px;left:20px}.coordinate{left:20px;top:65px}.invitation{left:20px;bottom:55px}.invitation h1{font-size:30px}.invitation>span{font-size:6px}.invitation p{font-size:9px}.stage-footer{left:20px;font-size:7px}aside{border-left:0;border-top:1px solid #34382b;padding:25px 20px;overflow:visible}.voice-list{display:grid;grid-template-columns:1fr 1fr;gap:6px}.voice{gap:6px;padding:8px 5px;font-size:10px}.voice-icon{font-size:20px}.voice small{font-size:6px}.param{margin-bottom:23px}.param input{height:4px;margin:18px 0 12px}.mapping{padding-top:20px}.master,.transport{flex-wrap:wrap;gap:16px}.transport{row-gap:22px}footer{padding:25px 20px;gap:28px}.transport button{font-size:10px}.master{width:100%;justify-content:space-between}.master input{flex:1;min-width:50px}.clip{flex-wrap:wrap}.clip audio{max-width:100%;width:100%}.library{right:10px;width:calc(100vw - 20px);padding:15px}.saved{gap:6px}.save-row{flex-wrap:wrap}.library input{width:130px}}:root{font-family:Inter,Segoe UI,Arial,sans-serif;background:#1b1d1e;color:#e6e1d7}body{overflow:hidden}main{height:100dvh;display:grid;grid-template-rows:76px minmax(0,1fr) 76px}header{height:76px;padding:0 32px;gap:48px;background:#191b1c;border-color:#343637}.brand{font-size:25px;letter-spacing:7px}.brand span{font-size:8px;margin-top:5px;color:#a8aaa7}.edition{color:#939895}.edition span{color:#b89a70}nav{gap:25px}.workspace{height:auto;min-height:0;grid-template-columns:minmax(0,1fr) 280px}.stage{min-height:0}.stage-label{top:25px;left:30px;color:#b5b7b2}.coordinate{left:30px;top:90px;color:#777f7f}.invitation{left:30px;bottom:50px}.invitation>span{display:none}.invitation h1{font-family:Georgia,serif;font-size:26px;letter-spacing:-.6px;margin:0 0 8px}.invitation p{font-size:10px;margin:0;color:#a5aaa7}.activate{position:fixed;top:18px;left:50%;transform:translate(-50%);margin:0;min-width:168px;padding:12px 16px;border-radius:3px;z-index:2}.stage-footer{left:30px;bottom:20px;color:#9ca59e;font-size:7px}.stage-footer span:last-child{display:block}aside{background:#202223;border-color:#363839;padding:22px;scrollbar-width:thin;scrollbar-color:#555753 transparent}.panel-title{font-size:8px;color:#b1b4ae;letter-spacing:1.6px}.voice-list{margin-top:15px;display:grid;grid-template-columns:1fr 1fr;gap:6px}.voice{padding:10px 7px;gap:7px;margin:0;font-size:10px;border-radius:3px}.voice.selected{border-color:#71614a;background:#2b2b28}.voice-icon{font-size:20px}.voice small{font-size:6px;color:#a1a69e}.voice>span:last-child{display:none}.add{font-size:10px;padding:12px 0;border-color:#3d3f3d;color:#beb5a2}.shape-title{margin:20px 0}.param{margin-bottom:19px}.param input{margin:12px 0 8px}.param small{color:#a0a69e;font-size:9px}.param b{color:#8c948b}.param output{font-variant-numeric:tabular-nums}.position{margin:0}.position label{color:#a6ada4}.voice-actions{border-color:#3e423e}.mapping{padding-top:18px}.mapping p{font-size:9px;color:#979e95;margin:9px 0}.mapping strong{color:#dfc193}.mapping>span{color:#b7b9ac}footer{min-height:0;padding:16px 28px;background:#191b1c;border-color:#3d3e3c;gap:20px;flex-wrap:nowrap}.transport{gap:16px;white-space:nowrap}.master{gap:10px;white-space:nowrap}.master input{width:65px}.level{margin-left:auto;min-width:80px}.level>span{font-size:6px;letter-spacing:1.5px;color:#9a9e97}.level>div{display:flex;gap:3px;margin-top:7px}.level i{height:12px;width:3px;border-radius:1px;transition:background 80ms}.status{position:fixed;bottom:88px;left:25px;max-width:min(620px,calc(100vw - 50px));padding:12px 16px;gap:25px;z-index:5;border:1px solid #655b46;border-radius:4px;background:#30302a;box-shadow:0 8px 35px #0005}.clip{position:fixed;bottom:90px;right:300px;background:#282b2b;border:1px solid #55584f;z-index:4;border-radius:5px}.library{top:65px;background:#252829;border-color:#676454;border-radius:5px}.library input{background:#1b1d1e;border-color:#4b5049}.controls-toggle{display:none}input[type=range]{accent-color:#d8b583}button{transition:color .15s,background .15s}button:focus-visible{outline-offset:3px}@media(max-height:760px)and (min-width:761px){.param{margin-bottom:13px}.shape-title{margin:15px 0}.mapping p{display:none}.mapping{padding-top:12px}.voice{padding:7px}.invitation h1{font-size:22px}.invitation p{font-size:9px}}@media(max-width:1100px)and (min-width:761px){.workspace{grid-template-columns:minmax(0,1fr) 250px}aside{padding:20px 17px}footer{padding:15px 18px}.transport{gap:10px}.level{display:none}.master{gap:7px}.master input{width:48px}.edition{display:none}.activate{left:45%}.clip{right:270px}}@media(max-width:760px){body{overflow:auto}main{height:auto;min-height:100dvh;display:flex;flex-direction:column;padding-bottom:136px}header{height:74px;flex-shrink:0;padding:0 18px;gap:10px}.brand{font-size:22px;letter-spacing:4px}.brand span{font-size:7px}nav{gap:12px;font-size:10px}.controls-toggle{display:block;color:#d8b583}.workspace{display:flex;flex-direction:column;height:auto;min-height:0}.stage{height:calc(100svh - 210px);min-height:390px}.stage-label{left:20px;top:20px;font-size:7px}.coordinate{display:none}.invitation{left:20px;bottom:43px}.invitation h1{font-size:21px}.invitation p{font-size:9px}.activate{position:absolute;top:52px;left:20px;transform:none;min-width:145px;font-size:10px}.stage-footer{left:20px;right:20px;bottom:17px;font-size:6px}.stage-footer span:last-child{display:none}aside{display:none;overflow:visible;border-top:1px solid #41433e;border-left:0;padding:25px 20px}aside.controls-open{display:block}.voice-list{grid-template-columns:repeat(2,1fr)}.voice{font-size:11px}.param input{height:4px;margin:18px 0 12px}.param{margin-bottom:24px}.mapping p{display:block}footer{position:fixed;bottom:0;left:0;right:0;z-index:3;min-height:126px;padding:16px;display:flex;flex-wrap:wrap;gap:18px;box-shadow:0 -8px 30px #0003}.transport{width:100%;justify-content:space-between;gap:7px;row-gap:14px;flex-wrap:wrap}.transport button{font-size:10px}.transport i{display:none}.master{width:100%;justify-content:space-between;gap:14px}.master input{flex:1}.level{display:none}.status{bottom:143px;left:12px;max-width:calc(100vw - 24px);font-size:10px}.clip{bottom:145px;right:12px;left:12px;padding:12px;gap:12px;flex-wrap:wrap}.clip audio{width:100%;max-width:100%}.library{top:70px;right:10px;max-height:calc(100dvh - 230px);overflow:auto}.stage-footer{letter-spacing:.7px}}@media(max-width:760px){.activate{position:fixed;top:126px;left:20px}.controls-open{scroll-margin-top:15px}}@media(max-width:760px){.stage>.activate{position:absolute;top:52px;left:20px}}
