:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#141414;--panel:#1a1a1a;--panel2:#1d1d1d;--line:#333;--fg:#ccc;--dim:#666;--accent:#ff6a00;--accent2:#5a9fff}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--fg);flex-direction:column;height:100vh;font-family:ui-monospace,Cascadia Code,JetBrains Mono,Consolas,monospace;display:flex;overflow:hidden}#toolbar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:4px;padding:6px 10px;display:flex}#toolbar .sep{background:var(--line);width:1px;height:24px;margin:0 6px}#toolbar button{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;white-space:nowrap;background:#262626;border-radius:3px;padding:4px 10px;font-size:.82rem}#toolbar button:hover{border-color:var(--accent);color:#fff}#toolbar button:active{background:#1a1a1a}#toolbar button.active{background:var(--accent);color:#000;border-color:var(--accent)}#toolbar button#play{color:#80d080}#toolbar button#stop{color:#d08080}#toolbar label{color:var(--dim);white-space:nowrap;font-size:.78rem}#toolbar input[type=number]{color:var(--fg);border:1px solid var(--line);font:inherit;-moz-appearance:textfield;background:#262626;border-radius:3px;width:60px;padding:3px 6px;font-size:.82rem}#toolbar input[type=number]::-webkit-inner-spin-button{opacity:1}#toolbar input[type=number]::-webkit-outer-spin-button{opacity:1}#toolbar select{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;background:#262626;border-radius:3px;padding:3px 6px;font-size:.82rem}.load-wrap{position:relative}.dropdown-menu{background:var(--panel);border:1px solid var(--line);z-index:200;border-radius:3px;flex-direction:column;gap:2px;min-width:150px;padding:3px;display:none;position:absolute;top:calc(100% + 3px);left:0;box-shadow:0 4px 14px #00000080}.dropdown-menu.open{display:flex}.dropdown-menu button{text-align:left;white-space:nowrap;border-radius:2px;width:100%;padding:6px 10px;font-size:.82rem;display:block}.toolbar-right{align-items:center;gap:4px;margin-left:auto;display:flex}.status{color:var(--dim);margin-left:6px;font-size:.78rem}.status.warn{color:var(--accent)}.dropdown-sep{border:none;border-top:1px solid var(--line);margin:3px 0}#track-bar{border-bottom:1px solid var(--line);background:#111;flex-shrink:0;align-items:center;gap:0;min-height:30px;display:flex;overflow-x:auto}#track-tabs{flex:1;gap:0;display:flex;overflow-x:auto}.track-tab{cursor:pointer;border-right:1px solid var(--line);color:var(--dim);white-space:nowrap;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;min-width:80px;padding:4px 8px 4px 10px;font-size:.75rem;transition:background .1s;display:flex}.track-tab:hover{color:var(--fg);background:#1e1e1e}.track-tab.active{background:var(--panel);color:var(--fg);border-bottom:2px solid var(--accent)}.track-dot{cursor:pointer;outline-offset:1px;border-radius:50%;outline:2px solid #0000;flex-shrink:0;width:8px;height:8px;transition:outline-color .1s;position:relative}.track-dot:hover{outline-color:var(--fg)}.track-name{text-overflow:ellipsis;flex:1;overflow:hidden}.track-mute{color:var(--dim);font:inherit;cursor:pointer;background:#222;border:1px solid #333;border-radius:2px;padding:1px 4px;font-size:.65rem;line-height:1}.track-mute:hover{border-color:var(--accent)}.track-mute.muted{background:var(--accent);color:#000;border-color:var(--accent)}.track-delete{color:#444;cursor:pointer;background:0 0;border:none;border-radius:2px;padding:1px 3px;font-size:.9rem;line-height:1}.track-delete:hover{color:#d08080}#add-track{color:var(--dim);border:none;border-left:1px solid var(--line);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;align-self:stretch;padding:4px 10px;font-size:1rem}#add-track:hover{color:var(--fg);background:#1a1a1a}.preset-row{align-items:center;gap:4px;margin-bottom:7px;display:flex}.preset-row select{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;background:#1a1a1a;border-radius:2px;flex:1;min-width:0;padding:3px 5px;font-size:.75rem}.preset-row button{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;white-space:nowrap;background:#1e1e1e;border-radius:2px;flex-shrink:0;padding:3px 6px;font-size:.72rem}.preset-row button:disabled{color:var(--dim);cursor:default}.preset-row button:not(:disabled):hover{border-color:var(--accent);color:var(--fg)}.preset-row #preset-delete:not(:disabled):hover{color:#d08080;border-color:#d08080}#main{flex:1;display:flex;overflow:hidden}#roll-wrap{flex:1;position:relative;overflow:hidden}#roll{cursor:crosshair;width:100%;height:100%;display:block}#sidebar{border-left:1px solid var(--line);flex-direction:column;flex-shrink:0;width:220px;display:flex;overflow-y:auto}.sb-section{border-bottom:1px solid var(--line);padding:8px 10px}.sb-section legend,.sb-section .sb-title{color:var(--dim);text-transform:lowercase;letter-spacing:.05em;margin-bottom:6px;font-size:.72rem;display:block}.sliders{grid-template-columns:1fr max-content;align-items:center;gap:5px 6px;font-size:.78rem;display:grid}.sliders label{color:var(--dim)}.sliders input[type=range]{grid-column:1/-1;width:100%}.sliders span{color:var(--fg);text-align:right;font-variant-numeric:tabular-nums;font-size:.76rem}#phonemes{flex-wrap:wrap;gap:3px;display:flex}.ph-btn{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;text-align:center;background:#222;border-radius:2px;min-width:34px;padding:2px 5px;font-size:.75rem}.ph-btn:hover{border-color:var(--accent);color:#fff}#render{background:var(--panel2);width:100%;color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;text-align:center;border-radius:3px;padding:6px;font-size:.82rem;display:block}#render:hover{border-color:var(--accent);color:#fff}.backing-info{color:var(--dim);word-break:break-all;min-height:1em;margin-bottom:6px;font-size:.75rem}.backing-btns{gap:4px;margin-bottom:6px;display:flex}.backing-btns button{background:var(--panel2);color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;border-radius:3px;flex:1;padding:4px 8px;font-size:.78rem}.backing-btns button:hover{border-color:var(--accent);color:#fff}.backing-btns button#clear-backing{color:#d08080}.backing-btns button#clear-backing:hover{border-color:#d08080}#about,#instructions{background:var(--panel2);width:100%;color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;text-align:center;border-radius:3px;padding:6px;font-size:.82rem;display:block}#about:hover,#instructions:hover{border-color:var(--accent);color:#fff}.roll-inline-input{color:#fff;border:1px solid var(--accent);font:inherit;z-index:100;box-sizing:border-box;letter-spacing:.03em;pointer-events:all;background:#000000eb;outline:none;padding:0 3px;font-size:9px;font-weight:700;line-height:normal;position:absolute}.pe-backdrop{z-index:1000;background:#000000a6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pe-panel{background:#1a1a1a;border:1px solid #404040;border-radius:4px;outline:1px solid #3a7fd480;flex-direction:column;gap:10px;width:580px;max-width:96vw;padding:14px 16px 12px;display:flex}.pe-title{color:var(--fg);font-size:.85rem;font-weight:700}.pe-input{color:var(--fg);border:1px solid var(--line);font:inherit;letter-spacing:.04em;background:#0c0c0c;border-radius:2px;width:100%;padding:6px 10px;font-size:.9rem}.pe-input:focus{border-color:var(--accent2);outline:none}.pe-grid{flex-direction:column;gap:4px;display:flex}.pe-row{align-items:center;gap:6px;min-height:28px;display:flex}.pe-group-label{color:var(--dim);text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;width:84px;font-size:.7rem}.pe-btn-group{flex-wrap:wrap;gap:3px;display:flex}.pe-phoneme-btn{border:1px solid var(--line);font:inherit;cursor:pointer;text-align:center;background:#262626;border-radius:2px;min-width:38px;padding:2px 6px;font-size:.78rem}.pe-phoneme-btn:hover{background:#303030;border-color:currentColor}.pe-actions{justify-content:flex-end;gap:6px;display:flex}.pe-action-btn{color:var(--fg);border:1px solid var(--line);font:inherit;cursor:pointer;background:#262626;border-radius:3px;padding:5px 16px;font-size:.85rem}.pe-action-btn:hover{border-color:var(--dim)}.pe-action-btn.pe-ok{background:var(--accent2);color:#000;border-color:var(--accent2);font-weight:600}.pe-action-btn.pe-ok:hover{background:#7abfff}.pe-actions>:first-child{margin-right:auto}