:root{--bg:#f4f5fb;--card:#fff;--ink:#0f172a;--muted:#64748b;--line:#e6e8f0;--blue:#4f46e5;--blue2:#eef0ff;--violet:#7c3aed;--amber:#f59e0b;--green:#10b981;--red:#e11d48;--r:18px;--shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06)}
*{box-sizing:border-box}html,body{margin:0}body{font:15px/1.55 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.row{display:flex;align-items:center}.gap{gap:8px}.between{justify-content:space-between}.wrapline{flex-wrap:wrap}
.top{background:linear-gradient(90deg,#0b1026,#1e1b4b 60%,#312e81);color:#fff}.top .wrap{height:60px;justify-content:space-between}
.brand{display:flex;gap:10px;align-items:center;font-weight:800;font-size:20px;color:#fff;letter-spacing:-.02em}.brand:hover{text-decoration:none}.brand svg rect{fill:url(#g)}
nav a{color:#c7d2fe;font-size:14px}nav a:hover{color:#fff}
main{padding:22px 20px 40px}
.steps{list-style:none;display:flex;gap:10px;padding:0;margin:0 0 18px;flex-wrap:wrap}
.steps li{display:flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--muted);font-weight:600;font-size:13.5px}
.steps li span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#eef0f6;color:var(--muted);font-size:12px}
.steps li.on{color:var(--ink);border-color:#c7d2fe;background:#fff}.steps li.on span{background:linear-gradient(135deg,var(--blue),var(--violet));color:#fff}
.steps li.done span{background:var(--green);color:#fff}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px;margin-bottom:18px;box-shadow:var(--shadow)}
.hero{background:radial-gradient(1200px 400px at 10% -10%,rgba(124,58,237,.18),transparent 60%),radial-gradient(900px 400px at 100% 0,rgba(79,70,229,.16),transparent 60%),#fff;padding:34px 34px 26px}
h1{font-size:34px;line-height:1.15;margin:0 0 8px;letter-spacing:-.025em}h2{font-size:21px;margin:0 0 10px;letter-spacing:-.01em}h3{font-size:16px;margin:0 0 10px;letter-spacing:-.005em}
.lead{color:var(--muted);font-size:17px;max-width:780px;margin:0 0 20px}
.muted{color:var(--muted)}.small{font-size:13px}.fine{font-size:12.5px;color:var(--muted);margin:14px 0 0}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;font-variant-numeric:tabular-nums}
.drop{display:block;border:2px dashed #c7cbe6;border-radius:16px;background:rgba(255,255,255,.75);cursor:pointer;transition:.15s}
.drop:hover,.drop.over{border-color:var(--blue);background:var(--blue2);transform:translateY(-1px)}
.drop-in{display:flex;flex-direction:column;align-items:center;gap:6px;padding:46px 16px;color:var(--muted)}.drop-in strong{color:var(--ink);font-size:18px}
.drop-in svg{color:#fff;background:linear-gradient(135deg,var(--blue),var(--violet));border-radius:16px;padding:10px;width:58px;height:58px;box-shadow:0 8px 20px rgba(79,70,229,.3);margin-bottom:6px}
.files{margin:16px 0 8px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.frow{display:grid;grid-template-columns:28px 1fr 110px 170px 74px;gap:10px;align-items:center;padding:10px 14px;border-top:1px solid var(--line);font-size:14px}.frow:first-child{border-top:0}
.frow .fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.frow.off{opacity:.5}.frow .err{color:var(--red);grid-column:2/-1;font-size:13px}
.note{background:#fffbeb;border:1px solid #fde68a;border-radius:12px;padding:10px 14px;font-size:14px;margin:8px 0}
.btn{appearance:none;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:11px;padding:8px 14px;font:inherit;font-weight:600;cursor:pointer;transition:.12s;white-space:nowrap}
.btn:hover{border-color:#c7cbe6;background:#f8f9ff}.btn:disabled{opacity:.5;cursor:default}
.btn.primary{background:linear-gradient(135deg,var(--blue),var(--violet));border-color:transparent;color:#fff;box-shadow:0 6px 16px rgba(79,70,229,.25)}.btn.primary:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent}.btn.small{padding:5px 10px;font-size:13px;border-radius:9px}.btn.big{padding:13px 24px;font-size:16px;border-radius:13px}
.bar{height:10px;background:#eceef7;border-radius:6px;overflow:hidden;margin:12px 0 8px}.bar>div{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--violet));transition:width .2s}
.overview-wrap{position:relative;margin-top:6px}#overview{width:100%;display:block;border-radius:12px;background:#0f1430;cursor:pointer}
.legend{display:flex;gap:6px;align-items:center;font-size:12px;color:var(--muted);margin-top:8px}.lg{width:10px;height:10px;border-radius:3px;display:inline-block}.lg.music{background:#818cf8}.lg.speech{background:#fbbf24}.lg.sil{background:#475569}.legend .sep{flex:1}
.transport{margin-top:12px}
.grid2{display:grid;grid-template-columns:1.25fr 1fr;gap:18px}.grid2>.card{margin-bottom:18px}
.edges{display:grid;grid-template-columns:1fr 1fr;gap:16px}.edge canvas{width:100%;display:block;background:#0f1430;border-radius:12px;margin:6px 0;cursor:crosshair}
.selrow{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px;margin:14px 0}
label{font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:4px;font-weight:500}
input,textarea,select{font:inherit;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff;width:100%}
input:focus,textarea:focus,select:focus{outline:3px solid #e0e7ff;border-color:var(--blue)}
.unit{display:flex;align-items:center;gap:4px;color:var(--muted)}.unit input{width:70px}
label.check{flex-direction:row;align-items:center;gap:8px;color:var(--ink);font-size:14px}label.check input{width:auto;accent-color:var(--blue)}
label.inline{flex-direction:row;align-items:center;gap:6px;color:var(--muted)}label.inline select{width:auto;padding:5px 8px}
.cmd{display:flex;gap:8px;align-items:stretch}.cmd textarea{resize:vertical;min-height:46px}
.mic{flex:0 0 48px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--violet));color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 16px rgba(79,70,229,.25)}
.mic.live{background:var(--red);animation:pulse 1.2s infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(225,29,72,.45)}100%{box-shadow:0 0 0 14px rgba(225,29,72,0)}}
.mic-hint{font-size:13px;color:var(--muted);min-height:18px;margin-top:6px}
.cmdlog{margin-top:8px;max-height:200px;overflow:auto;font-size:13.5px}.cmdlog div{padding:7px 10px;border-radius:10px;margin-bottom:6px;background:#eef2ff;color:#312e81}.cmdlog div.bad{background:#fff1f2;color:#9f1239}.cmdlog div.you{background:transparent;color:var(--muted);padding:2px 10px}
.examples{margin-top:8px;font-size:13px;color:var(--muted)}.examples ul{margin:6px 0 0 18px;padding:0}.examples summary{cursor:pointer;font-weight:600}
.tablewrap{overflow:auto}table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}th{text-align:left;font-size:12px;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line);text-transform:uppercase;letter-spacing:.04em}
td{padding:6px 8px;border-bottom:1px solid #f0f1f6;vertical-align:middle}tr.sel td{background:#eef2ff}tr.off td{opacity:.45}tr.speech .tname{color:#b45309}
tbody tr:hover td{background:#f8f9ff}tbody tr.sel:hover td{background:#e8ecff}
td input.tname{border-color:transparent;background:transparent;padding:5px 7px;min-width:160px;font-weight:600}td input.tname:hover{border-color:var(--line);background:#fff}
td .fn{color:var(--muted);font-size:12.5px;white-space:nowrap}.rev{display:inline-block;font-size:11px;background:#fef3c7;color:#92400e;border-radius:6px;padding:1px 7px;margin-left:6px;font-weight:600}
td.acts{white-space:nowrap}td.acts button{margin-left:2px}
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form label.check{grid-column:span 2}
.center{text-align:center}.cover{width:100%;max-width:340px;border-radius:14px;box-shadow:0 10px 30px rgba(15,23,42,.22)}
.opts label{flex-direction:row;align-items:center;gap:6px}.opts .unit input{width:64px}
.dl{list-style:none;padding:0;margin:14px 0 0;columns:2;font-size:13.5px}.dl li{padding:3px 0;break-inside:avoid}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(30px);background:#0f172a;color:#fff;padding:11px 18px;border-radius:12px;opacity:0;transition:.25s;pointer-events:none;z-index:20;max-width:90vw;box-shadow:0 10px 30px rgba(0,0,0,.25)}.toast.show{opacity:1;transform:translateX(-50%)}
.errbox{position:fixed;left:50%;top:76px;transform:translateX(-50%);background:#fff1f2;border:1px solid #fecdd3;color:#881337;padding:12px 16px;border-radius:14px;z-index:30;max-width:min(680px,92vw);box-shadow:0 10px 30px rgba(0,0,0,.12)}
.helpcard ol{padding-left:20px}.helpcard li{margin-bottom:6px}
.foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;padding-bottom:30px;color:var(--ink)}
@media (max-width:900px){h1{font-size:27px}.hero{padding:24px}.grid2,.edges{grid-template-columns:1fr}.selrow{grid-template-columns:1fr 1fr}.frow{grid-template-columns:24px 1fr 90px 64px}.frow .fmeta{display:none}.dl{columns:1}.form{grid-template-columns:1fr}.form label.check{grid-column:auto}}

.cmdcard{border-color:#c7d2fe;background:linear-gradient(180deg,#fafaff,#fff)}
.fine-tune{padding:0}.fine-tune>summary{padding:16px 24px;cursor:pointer;list-style:none}.fine-tune>summary::-webkit-details-marker{display:none}.fine-tune>summary::before{content:"▸ ";color:var(--muted)}.fine-tune[open]>summary::before{content:"▾ "}
.fine-tune #selCard{padding:0 24px 20px}
.exgrid{display:grid;grid-template-columns:1fr 260px;gap:24px;align-items:start}.exgrid .cover{max-width:240px}
.more{margin-top:16px;font-size:14px}.more summary{cursor:pointer;color:var(--muted);font-weight:600}
.sug{margin:4px 4px 0 0;background:#fff}
@media (max-width:900px){.exgrid{grid-template-columns:1fr}}

.adv{display:none}body.adv .adv{display:table-cell}
#trackTable tr.speech{display:none}body.adv #trackTable tr.speech{display:table-row}
.playbtn{width:34px;height:34px;border-radius:50%;border:0;background:linear-gradient(135deg,var(--blue),var(--violet));color:#fff;cursor:pointer;font-size:13px;box-shadow:0 3px 10px rgba(79,70,229,.25)}
.playbtn.on{background:var(--red)}
.adv-card>summary{cursor:pointer;font-weight:700;color:var(--muted)}
.cmdcard{border:1px solid #c7d2fe;border-radius:14px;padding:14px;margin-bottom:16px}
#exportCard{border:2px solid #c7d2fe}

#trackTable td .fn{white-space:nowrap}