@font-face{font-family:"Instrument Sans";src:url("/fonts/instrument-sans-latin-2ee17598a98d.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}@font-face{font-family:"Noto Sans Math";src:url("/fonts/instrument-math-symbols-58795c9a3004.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+21BA,U+2197,U+25B6,U+219D,U+266A,U+25A0,U+266D,U+22A4,U+27F3,U+2192,U+25C9,U+266F}@font-face{font-family:"Noto Sans Symbols 2";src:url("/fonts/instrument-control-symbols-2da4c3a49643.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+2637,U+23FB}:root{color-scheme:dark;font-variant-numeric:tabular-nums;font-family:"Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;color:#c1c4bb;background:#101011;--line:#363a34;--accent:#b6c29f}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}button,input,select{font:inherit}button,select,input[type=range]{cursor:pointer}button,select{background:#272a28;color:#bdc4b4;border:1px solid #454c3e;border-radius:5px;padding:8px 11px;font-size:11px}button:hover{background:#363c30}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}a{color:inherit;text-decoration:none}main{height:100dvh;min-height:0;position:relative;overflow:hidden;background:radial-gradient(ellipse at 48% 50%,#27292a,#151617 60%,#101011)}.viewport,#scene{position:absolute;inset:0}#scene canvas{display:block;touch-action:none}.quiet-tools{position:absolute;right:24px;top:24px;display:flex;gap:9px}.quiet-tools button,.quiet-tools a{width:36px;height:36px;padding:0;border:1px solid #40424770;background:#22242766;backdrop-filter:blur(12px);display:grid;place-items:center;border-radius:50%;font-size:20px;color:#9b9f98}#component-panel{position:absolute;right:24px;top:80px;width:275px;max-height:calc(100dvh - 160px);overflow:auto;border:1px solid #42473c70;border-radius:10px;background:#1b1e1bdd;backdrop-filter:blur(18px);padding:21px;scrollbar-width:thin}#component-close{float:right;border:0;background:none;font-size:18px;padding:0 0 8px 12px}h2{font-size:19px;font-weight:400;margin:0 0 12px}#detail p{font-size:11px;line-height:1.65;color:#939c88;margin:0 0 17px}.control{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;margin:17px 0}.control>div{display:flex;gap:9px;align-items:center}.control input{width:95px}.control output{font:9px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;min-width:42px;text-align:right}input[type=range]{accent-color:var(--accent)}.sample-button{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;margin-top:8px;text-align:left}.sample-button small{font:8px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;color:#7e8c72}.word-slices{display:flex;gap:4px;margin-top:6px}.word-slices button{flex:1;font-size:9px;padding:7px 4px}#detail .slice-note{font:8px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;line-height:1.5;margin:7px 0;color:#78856e}#part-label{position:absolute;pointer-events:none;font:9px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;padding:7px 9px;border:1px solid #65725880;border-radius:5px;background:#20271dce;color:#c2d0ac;transform:translate(-50%,-100%);white-space:nowrap}#model-fallback{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px}#scope{display:none}dialog{width:min(780px,94vw);max-height:85dvh;overflow:auto;background:#1b1e1b;color:#c4cbbc;border:1px solid #454e3e;border-radius:12px;padding:26px}dialog::backdrop{background:#090b09c4;backdrop-filter:blur(10px)}.close,.dialog-close{float:right;font-size:20px;padding:1px 8px;margin:0 0 15px 12px}dialog p{font-size:11px;line-height:1.7;color:#909c85}.keyboard-header{display:flex;gap:12px;clear:both;margin-bottom:22px}#keyboard{display:flex;gap:4px;height:100px}.key{flex:1;min-width:0;display:flex;justify-content:space-between;align-items:flex-end;padding:10px 7px;border:0;border-radius:3px 3px 6px 6px;background:linear-gradient(#c3c7bd,#969e8b);box-shadow:inset 0 -5px #6d7761;color:#39422f;font:10px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;touch-action:none;user-select:none}.key.black{background:linear-gradient(#4f5649,#30372c);color:#b4bea8;box-shadow:inset 0 -5px #1e241a}.key.active{background:#c1d69c;box-shadow:inset 0 -2px #819763}.secondary{display:flex;gap:20px;flex-wrap:wrap;align-items:center;margin:25px 0}.secondary label{display:flex;gap:12px;align-items:center;font-size:11px}.secondary span{font:8px "Instrument Sans","Noto Sans Math","Noto Sans Symbols 2",sans-serif;color:#7a896c}#modules{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.module-row{display:flex;gap:4px}.module-select{flex:1;display:flex;justify-content:space-between}.module-select.selected{border-color:#a4b98b}.visibility{padding:6px;background:none;border:0}.visibility[aria-pressed=false]{opacity:.35}#toast{position:fixed;left:50%;bottom:25px;transform:translateX(-50%);max-width:90vw;padding:11px 17px;border-radius:7px;background:#b9c3a6;color:#22291c;font-size:12px;opacity:0;pointer-events:none}#toast.visible{opacity:1}@media(max-width:650px){.quiet-tools{top:15px;right:15px}#component-panel{top:auto;bottom:65px;left:15px;right:15px;width:auto;max-height:40dvh;padding:18px}.key>span:last-child{display:none}#modules{grid-template-columns:repeat(2,1fr)}dialog{padding:20px}.keyboard-header{gap:8px}.keyboard-header button{padding:7px}.key{font-size:8px;padding:8px 4px}}

.section-top{display:flex;gap:8px;align-items:center}.section-top a,.secondary-controls a{font-size:10px;margin-left:auto;color:#8c9189}#melody-dialog{max-width:430px}#melody-options{font-size:11px;margin:20px 0}#melody-options label{display:flex;align-items:center;gap:9px}#melody-brief{margin-top:12px}.quiet-tools button,.quiet-tools a,.quiet-bottom button{transition:background .2s,color .2s}.quiet-tools button:hover,.quiet-bottom button:hover{color:#dde0d8;background:#353735aa}

button,select{font-weight:500}dialog h2,h2{font-weight:500}#engine-status{font-size:9px;letter-spacing:1.1px}