:root{color-scheme:dark;--bg:#0b1019;--panel:#141b28;--line:#263247;--text:#e8ecf5;--muted:#98a4b8;--purple:#b28df9;--purple2:#8562d0;--green:#8ee6c7;--amber:#ffc98f;--red:#ff9898}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse 70% 400px at 66% 10%,#20173c55,transparent),var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px;line-height:1.55}a{color:var(--purple)}a:hover{color:#d9c6ff}button,input{font:inherit}button{cursor:pointer}.shell{max-width:1180px;margin:auto;padding:0 22px}.mast{display:flex;align-items:center;justify-content:space-between;padding:25px 0;border-bottom:1px solid var(--line);gap:12px}.brand{display:flex;gap:12px;color:white;font-size:21px;align-items:center;text-decoration:none}.eyebrow,.kicker{font-size:11px;letter-spacing:.19em;color:var(--purple);font-weight:800}.eyebrow{color:#8997b0}.github{font-size:13px;border:1px solid var(--line);padding:8px 14px;border-radius:9px;color:var(--text);text-decoration:none}.github:hover{background:#242d3f}.hero{padding:60px 0 44px;max-width:770px}.kicker{display:block;margin-bottom:10px}.hero h1{font-size:clamp(42px,6vw,78px);letter-spacing:-.055em;line-height:1.03;margin:10px 0 20px;font-weight:850}.hero h1 em{font-style:normal;color:var(--purple)}.hero p{font-size:17px;color:var(--muted);max-width:660px;margin:0 0 25px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{font-size:12px;color:#bbc7db;border:1px solid #34415a;padding:6px 10px;border-radius:30px;background:#ffffff06}.layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.88fr);align-items:start;gap:22px}.controls{display:grid;gap:18px}.panel{border:1px solid var(--line);background:linear-gradient(135deg,#172031,#131a26);border-radius:17px;padding:24px;box-shadow:0 12px 25px #00000012}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:21px}.section-head>div:first-child{display:flex;align-items:center;gap:13px;flex-wrap:wrap}.step{font-size:11px;font-weight:800;color:var(--purple);padding:6px 8px;background:#b28df91d;border-radius:7px}.panel h2{font-size:19px;line-height:1.25;letter-spacing:-.025em;margin:0;font-weight:750}.tiny{font-size:11px;color:var(--muted)}.presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.preset{padding:16px 8px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:5px;color:#e4e8f0;border:1px solid #354057;background:#121927;border-radius:12px;transition:border-color .15s,transform .15s}.preset:hover{transform:translateY(-2px);border-color:#b28df9aa}.preset.chosen{border-color:var(--purple);background:linear-gradient(130deg,#4b357b44,#252035)}.preset b{font-size:14px}.preset small{font-size:11px;color:var(--muted)}.preset-symbol{font-size:24px;color:var(--purple)}.movement-block{padding:17px 0;border-top:1px solid var(--line)}.movement-block:first-of-type{border-top:0;padding-top:4px}.movement-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.movement-label{display:flex;align-items:center;gap:13px}.movement-label strong{display:block;font-size:15px}.movement-label small{display:block;color:var(--muted);font-size:11.5px}.movement-icon{display:grid;place-items:center;border:1px solid #4d4074;background:#b28df915;color:var(--purple);height:42px;width:42px;border-radius:12px;font-size:20px;flex:none}.frequency{margin-left:55px;margin-top:12px;font-size:13px;color:#c9d2e2}.frequency label,.freq-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.frequency input[type=number],.freq-inline input[type=number]{width:78px;background:#0d1420;border:1px solid #36435b;border-radius:8px;padding:8px;color:#fff;text-align:center}.field-row{margin-top:17px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.field-row label{font-size:12px}.field-row input{width:75px}.helper{color:var(--muted);font-size:12px;flex:1;min-width:180px}.switch{position:relative;display:block;flex:none;width:46px;height:27px;cursor:pointer}.switch input{opacity:0;width:1px;height:1px;position:absolute}.switch span:not(.sr-only){position:absolute;inset:0;border-radius:25px;background:#435168;transition:background .16s}.switch span:not(.sr-only):before{content:"";position:absolute;width:20px;height:20px;border-radius:50%;left:4px;top:3.5px;background:white;transition:transform .16s}.switch input:checked+span{background:var(--purple2)}.switch input:checked+span:before{transform:translateX(19px)}.switch input:focus-visible+span{outline:2px solid white;outline-offset:4px}.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.overlap-row{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:17px}.overlap-row strong{font-size:14px}.overlap-row p,.small-description{font-size:12px;color:var(--muted);line-height:1.65;margin:7px 0 0}.experimental{color:var(--amber);font-size:9px;border:1px solid #b48652;border-radius:5px;letter-spacing:.06em;padding:3px 5px;vertical-align:middle;white-space:nowrap}.eye-panel .section-head{margin-bottom:12px}.eye-advanced{padding-top:18px;transition:opacity .2s}.eye-advanced.muted{opacity:.45;pointer-events:none}.freq-inline{font-size:12px}.field-caption{display:block;color:var(--muted);font-size:12px;margin:17px 0 9px}.eye-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px}.eye-choice{border:1px solid #3b465e;border-radius:8px;text-align:center;cursor:pointer;position:relative;overflow:hidden}.eye-choice input{position:absolute;opacity:0;width:1px;height:1px}.eye-choice span{display:block;padding:8px 0;color:#9eaac2;font-size:12px}.eye-choice input:checked+span{background:#8e69d84f;color:white;outline:1px solid var(--purple);outline-offset:-1px}.eye-choice input:focus-visible+span{outline:2px solid white;outline-offset:-2px}.eye-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px;font-size:12px}.text-button{border:0;background:transparent;color:var(--purple);padding:0}.notice{background:#ffc98f10;border:1px solid #ffc98f33;border-radius:10px;margin-top:19px;padding:10px 12px;font-size:12px;color:#cbd0db}.notice strong{color:var(--amber)}.single-field{display:flex;flex-direction:column;gap:8px;font-size:13px}.single-field input{width:100%;padding:12px 14px;border-radius:9px;border:1px solid #394962;background:#0d1420;color:var(--text)}.output{position:sticky;top:16px}.output-panel{padding:26px}.output-panel h2{font-size:26px;margin:8px 0 23px}.stat-list{display:grid;border-block:1px solid var(--line);padding:10px 0 6px;gap:2px}.stat-list>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0}.stat-list span{font-size:11px;letter-spacing:.12em;color:#929fb6;font-weight:700}.stat-list strong{font-size:13px;font-weight:650;text-align:right}.preview-title{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin:22px 0 13px}.preview-title strong{font-size:13px}.preview-title span{color:var(--muted);font-size:11px}.legend{display:flex;gap:14px;align-items:center;font-size:11px;color:var(--muted);margin-bottom:8px}.dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:3px}.dot.head{background:var(--purple)}.dot.compound{background:#ffaf56}.dot.jaw{background:var(--green)}.dot.eyes{background:var(--amber)}.timeline{height:76px;position:relative;background:repeating-linear-gradient(90deg,#2a3549 0,#2a3549 1px,transparent 1px,transparent 16.666%);border-radius:5px;border-block:1px solid #2a3549}.timeline .event{position:absolute;width:2px;border-radius:2px;transform:translateX(-50%);z-index:1}.timeline .event.head{background:var(--purple);top:7px;height:14px}.timeline .event.compound{background:#ffaf56;top:7px;height:14px;width:4px;border-radius:3px}.timeline .event.jaw{background:var(--green);top:30px;height:14px}.timeline .event.eyes{background:var(--amber);top:54px;height:14px}.timeline-axis{display:flex;justify-content:space-between;font-size:10px;color:#92a0b6;margin-top:5px}.error{margin-top:16px;border:1px solid #c25b5b;color:#ffd8d8;background:#6a252545;padding:12px;border-radius:9px;font-size:12px;white-space:pre-wrap}.download,.secondary{display:block;width:100%;border:0;border-radius:11px;padding:13px 10px;font-weight:750;font-size:14px;margin-top:20px}.download{background:var(--purple);color:#17111e}.download:hover{background:#c8adff}.download:disabled{opacity:.45;cursor:not-allowed}.secondary{margin-top:9px;background:#27314a;color:#e6e9f1}.secondary:hover{background:#36415c}.instructions{border-top:1px solid var(--line);padding-top:15px;margin-top:18px;color:var(--muted);font-size:12px}.instructions summary{cursor:pointer;color:#dfd5f1;font-weight:700}.instructions li{margin-bottom:7px}.instructions ol{padding-left:18px}footer{padding:42px 0 28px;font-size:12px;color:var(--muted);text-align:center}footer a{margin:0 5px}dialog{width:min(93vw,950px);max-height:86vh;border:1px solid #455775;border-radius:13px;color:var(--text);background:#111825;padding:0;box-shadow:0 0 0 100vmax #000b}dialog::backdrop{background:#000b}.dialog-head,.dialog-actions{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line)}.dialog-head button,.dialog-actions button{background:#28354a;color:white;border:1px solid #4b5b75;border-radius:8px;padding:8px 12px}dialog pre{margin:0;overflow:auto;white-space:pre;max-height:65vh;padding:18px;font:12px/1.5 ui-monospace,SFMono-Regular,monospace;color:#dce4f9}.dialog-actions{border-bottom:0;border-top:1px solid var(--line);justify-content:flex-end}
@media(max-width:900px){.layout{grid-template-columns:1fr}.output{position:static}.hero{padding-top:42px}.output-panel{max-width:none}}@media(max-width:520px){.shell{padding:0 14px}.panel{padding:17px}.hero{padding-top:33px}.hero p{font-size:14px}.presets{gap:6px}.preset{padding:11px 7px}.preset small{font-size:10px}.section-head{align-items:flex-start}.tiny{max-width:110px;text-align:right}.frequency{margin-left:0}.movement-label small{font-size:10px}.eye-grid{grid-template-columns:repeat(6,1fr)}.github{font-size:12px;padding:7px}.mast{padding:16px 0}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Eye pattern gallery: linked previews from the upstream Skelly web controller */
.eye-spotlight{display:flex;align-items:center;gap:18px;background:#0d1421;border:1px solid #36415b;border-radius:12px;padding:14px;margin:13px 0 18px}
.eye-spotlight>img{width:114px;height:114px;flex:none;object-fit:contain;border-radius:50%;background:#020309}
.eye-spotlight strong{font-size:17px}
.eye-spotlight p{font-size:12px;line-height:1.5;color:var(--muted);margin:7px 0}
.eye-spotlight #selectedEyeCount{display:inline-block;color:var(--green);font-size:11px;font-weight:700}
.eye-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.eye-card{background:#101827;border:1px solid #3b465e;border-radius:11px;padding:5px;min-width:0;display:flex;flex-direction:column;align-items:stretch}
.eye-card:hover{border-color:#a88cf4}
.eye-choice{display:block;border:0;border-radius:8px;overflow:hidden;width:100%;background:transparent}
.eye-choice .eye-tile{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 3px 5px;border-radius:8px;color:#b4c1d5}
.eye-choice .eye-tile img{display:block;width:100%;max-width:100px;aspect-ratio:1 / 1;height:auto;object-fit:contain;border-radius:50%;background:#020309}
.eye-choice .eye-tile-number{padding:1px 2px;font-size:11px;font-weight:800;color:inherit;white-space:nowrap}
.eye-choice input:checked+.eye-tile{outline:2px solid var(--purple);outline-offset:-2px;background:#8e69d82f;color:#fff}
.eye-choice input:not(:checked)+.eye-tile img{opacity:.42;filter:grayscale(.8)}
.eye-zoom{font-size:11px;line-height:1.3;margin-top:4px;width:100%;border:0;border-radius:5px;padding:7px 3px;background:#26314a;color:#ddd5f3}
.eye-zoom:hover,.eye-zoom:focus-visible{background:#514274;color:white}
.eye-credit{font-size:11px;line-height:1.5;color:var(--muted);margin:12px 0 0}
@media(max-width:720px){.eye-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.eye-spotlight>img{width:95px;height:95px}}
@media(max-width:360px){.eye-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.eye-spotlight{gap:10px}.eye-spotlight>img{width:80px;height:80px}}

/* Eye/jaw coordination selector */
.eye-sync-control{margin:17px 0 15px;padding:13px 14px;background:#0d1421;border:1px solid #394762;border-radius:11px;display:grid;gap:7px}
.eye-sync-control label{font-size:13px;color:#f0eafa}
.eye-sync-control select{display:block;width:100%;min-width:0;background:#1d283d;color:#f5f0ff;border:1px solid #5c4b83;padding:11px 13px;border-radius:9px}
.eye-sync-control select:focus-visible{outline:2px solid var(--purple);outline-offset:2px}
.eye-sync-control p{font-size:11.5px;line-height:1.55;color:var(--muted);margin:0}

/* Optional body motor timeline previews (separate tracks, illustrative only) */
.legend{flex-wrap:wrap}
.dot.torso{background:#ffd18c}.dot.arm{background:#f08a9b}
.timeline{height:111px}
.timeline .event.head{top:7px}.timeline .event.jaw{top:30px}
.timeline .event.eyes{top:54px}
.timeline .event.torso{background:#ffd18c;top:77px;height:13px}
.timeline .event.arm{background:#f08a9b;top:95px;height:13px}

/* Studio: everyday choices first, specialist settings on request. */
.hero{padding:38px 0 28px;max-width:850px}
.hero h1{font-size:clamp(38px,5vw,60px);margin:12px 0 16px}
.hero p{font-size:16px;max-width:650px;margin-bottom:18px}
.studio-nav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}
.studio-nav a{color:var(--text);text-decoration:none;font-size:12px;padding:8px 13px;border:1px solid var(--line);border-radius:30px;background:#141b28}
.studio-nav a:hover,.studio-nav a:focus-visible{border-color:var(--purple);color:var(--purple)}
section[id],details[id],aside[id]{scroll-margin-top:22px}
.layout{grid-template-columns:minmax(0,1fr) 350px}
.controls,.output,.panel{min-width:0}
.output{max-height:calc(100vh - 32px);overflow:auto;scrollbar-width:thin;border-radius:17px}
.output-panel{padding:22px}
.output-panel h2{font-size:27px;margin-bottom:16px}
.output .stat-list strong{overflow-wrap:anywhere}
.output .stat-list span{flex-shrink:0}
.output .instructions .stat-list>div{flex-wrap:wrap}
.output .instructions .stat-list strong{text-align:left}
.output .instructions .preview-title{flex-wrap:wrap}
.output .instructions>p{margin-bottom:0}
.fold-panel{padding:0;overflow:hidden}
.fold-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;cursor:pointer;list-style:none}
.fold-panel>summary::-webkit-details-marker{display:none}
.fold-panel>summary strong{display:block;font-size:17px}
.fold-panel>summary small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.fold-icon{font-size:24px;color:var(--purple);line-height:1;transition:transform .15s}
.fold-panel[open]>summary{border-bottom:1px solid var(--line)}
.fold-panel[open] .fold-icon{transform:rotate(45deg)}
.fold-content{padding:22px 24px}
.fold-content h3{font-size:16px;margin:24px 0 14px}
.fold-content .section-head .step{display:none}
.fold-content .section-head{margin-bottom:12px}
#mouth .frequency{margin-left:0}
#mouth .movement-block{padding-top:0;border:0}
.clip-library{margin-top:18px}
.clip-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:14px}
.clip-card{min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:14px 11px;border:1px solid #39445d;background:#101725;border-radius:12px}
.clip-mark{color:var(--green);font-size:29px;line-height:1.1}
.clip-card strong{font-size:14px}
.clip-card small{font-size:11px;line-height:1.5;color:var(--muted);flex:1}
.clip-card label{font-size:11px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.clip-card input[type=number]{width:100%;min-width:0;text-align:left;padding:8px}
.clip-card button{font-size:11px;line-height:1.4;min-height:44px;padding:7px;border:1px solid #514270;border-radius:8px;background:#302641;color:#eee5ff}
.clip-card button:hover{border-color:var(--purple)}
.clip-library button[aria-pressed=true]{border:1px solid var(--green);background:#214337;color:#d0ffec}
.clip-library button:disabled{opacity:.45;cursor:not-allowed}
.clip-library>.secondary{font-size:12px;margin-top:10px}
.selection-status{font-size:12px;color:var(--green);min-height:1.6em;overflow-wrap:anywhere;margin:12px 0 0}
.profile-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.profile-actions .secondary{font-size:12px;margin:0}
.instructions p{line-height:1.65}
.single-field{margin-top:12px}
.fold-content input[type=number]{max-width:100%;width:80px;background:#0d1420;border:1px solid #36435b;border-radius:8px;padding:8px;color:var(--text)}
.frequency.muted{opacity:.5}
.usb-tools button{background:#26364c;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:10px 14px;min-height:44px;cursor:pointer;margin:3px 0}
.usb-tools button:disabled{opacity:.45;cursor:default}
.usb-tools .panel{margin-bottom:20px}
.usb-tools label{display:block;margin:16px 0 8px;line-height:1.6}
.usb-tools input[type=file]{max-width:100%}
#advanced fieldset{border:1px solid #39445d;border-radius:10px;padding:14px;margin-top:20px;min-width:0}
#advanced fieldset label{display:inline-block;margin:7px}
#mouth label[for=jawClipSec],#mouth label[for=jawDurations]{display:block;margin-top:16px;margin-bottom:7px}
#mouthOptions{border:0;padding:0;margin:18px 0 0;min-width:0}
#mouthOptions legend{font-size:12px;color:var(--muted)}
#mouthOptions>label{display:block;margin-top:18px}
#mouthOptions>.preset{margin-top:18px}
#jawDurations{width:100%;max-width:26rem}
#jawClipSec,#jawDurations,#clockStart,#clockEnd{box-sizing:border-box;background:#101725;color:var(--text);border:1px solid #52647e;border-radius:6px;min-height:40px;padding:8px;max-width:100%}
#first-run ol{padding-left:22px;line-height:1.7}
.palette-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:18px}
.palette-grid button{min-width:0;display:grid;justify-items:center;gap:9px;padding:13px 5px;background:#101725;border:1px solid #39445d;border-radius:10px;color:var(--text);font-size:12px;min-height:78px}
.palette-grid button:hover{border-color:var(--purple)}
.palette-grid button[aria-pressed=true]{border-color:var(--green);background:#214337}
.palette-swatches{display:flex;gap:4px}
.palette-swatches i{display:block;width:21px;height:21px;border-radius:50%;border:1px solid #ffffff55}
@media(max-width:520px){.palette-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:3px}
@media(max-width:1000px){.layout{grid-template-columns:minmax(0,1fr) 315px}.panel{padding:20px}.fold-panel{padding:0}.clip-cards{grid-template-columns:1fr}.clip-card{display:grid;grid-template-columns:32px 1fr 90px;align-items:center}.clip-card .clip-mark{grid-row:1 / 3}.clip-card strong,.clip-card small{grid-column:2}.clip-card label{grid-column:3;grid-row:1 / 3}.clip-card button{grid-column:1 / 4}}
@media(max-width:900px){.layout{grid-template-columns:1fr}.output{max-height:none;overflow:visible;position:static}.clip-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.clip-card{display:flex}.output .instructions .stat-list>div{flex-wrap:nowrap}.output .instructions .stat-list strong{text-align:right}}
@media(max-width:520px){.hero{padding:28px 0 23px}.hero h1{font-size:39px}.hero p{font-size:14px}.chips{gap:6px}.chips span{font-size:10px;padding:5px 8px}.studio-nav{gap:6px}.studio-nav a{font-size:11px;padding:7px 10px}.panel{padding:17px}.fold-panel{padding:0}.fold-panel>summary{padding:18px}.fold-content{padding:17px}.clip-cards{grid-template-columns:1fr}.clip-card{display:grid;grid-template-columns:30px 1fr 85px}.clip-card .clip-mark{grid-row:1 / 3}.clip-card strong,.clip-card small{grid-column:2}.clip-card label{grid-column:3;grid-row:1 / 3}.clip-card button{grid-column:1 / 4}.output .instructions .stat-list>div{flex-wrap:wrap}.output .instructions .stat-list strong{text-align:left}}

.output-panel h2.purple-title{color:var(--purple)}
.movement-icon svg{width:27px;height:27px;display:block}
.dot.lights,.event.lights{background:#f3adff}
.lighting-routines{margin-top:22px}
.lighting-routines fieldset{min-width:0;border:1px solid var(--line);border-radius:10px;margin:14px 0;padding:14px}
.lighting-routines select{width:100%;max-width:100%;color:var(--text);background:#101725;border:1px solid #52647e;padding:9px;border-radius:8px}
.lighting-routines .field-row>label{flex:1;min-width:0}
.instructions fieldset{min-width:0;margin:12px 0;border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-wrap:wrap;gap:10px}
.instructions fieldset label{display:flex;align-items:center;gap:8px;min-width:0}
.instructions fieldset input:not([type=color]){max-width:150px}
#advanced fieldset input[type=number]{width:75px;max-width:100%}
.eye-sync-control input[type=number],.instructions fieldset input:not([type=color]){background:#0d1420;border:1px solid #36435b;border-radius:8px;padding:8px;color:var(--text)}
.eye-sync-control input[type=number]{width:76px;max-width:100%}
.eye-sync-control .instructions>label{display:block;margin:9px 0}
.brand-skull{font-size:29px;line-height:1}
.scene-editor{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin:16px 0}
.scene-editor label{display:grid;gap:6px;min-width:0}
.scene-editor input{max-width:100%;background:#0d1420;color:var(--text);border:1px solid #36435b;border-radius:8px;padding:8px}
.saved-scene{display:flex;gap:9px;flex-wrap:wrap;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.saved-scene strong{flex:1;min-width:120px;overflow-wrap:anywhere}
.scene-editor button,.saved-scene button,.controller-panel button{background:#263249;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:8px 10px}
.controller-panel{scroll-margin-top:20px}
.controller-details{display:grid;grid-template-columns:1fr 1fr;gap:5px;font-size:12px}.controller-details dd{margin:0;text-align:right}
.request-window{position:absolute;height:14px;background:#b28df926;border:1px dashed #b28df980;border-radius:5px;pointer-events:none}
.request-window.continues{border-right:0;border-radius:5px 0 0 5px;text-align:right;color:#e9c6ff;line-height:11px;padding-right:2px}
.request-window.compound{background:#ffb05633;border-color:#ffb056}
.event{z-index:2;min-width:3px;border-radius:2px}
.preview-title{flex-wrap:wrap;gap:8px}
#timelineBeyond{color:#e6bf80;font-size:11px}
.light-preview{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:18px 0;font-size:13px}
[hidden]{display:none!important}
.light-preview span{display:flex;gap:7px;align-items:center}.light-preview i{width:30px;height:30px;border-radius:50%;border:1px solid #ffffff66}
.light-preview strong{color:var(--purple)}
.scene-order{display:flex;gap:10px;align-items:center;margin:14px 0}
.scene-order select,#eyeBehavior{max-width:100%;background:#101725;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:9px}
#controllerMessage{font-size:15px;line-height:1.65;font-weight:600;border-left:4px solid var(--purple);background:#b28df912;padding:14px;border-radius:8px;overflow-wrap:anywhere}
#controllerMessage[data-state=busy]{border-color:#e6bf80;color:#ffe2b2}
#controllerMessage[data-state=ready]{border-color:var(--green);color:var(--green)}
#controllerMessage[data-state=error]{border-color:#ff8e9d;color:#ffc4cc;background:#ff8e9d12}
.usb-setup{padding-left:22px;line-height:1.8}.usb-setup li{margin:9px 0}
#lightingChoicesPanel>label{display:block;margin:12px 0}
@media(max-width:520px){.scene-order{flex-wrap:wrap}.controller-details{grid-template-columns:1fr}.controller-details dd{text-align:left;margin-bottom:8px}}
.controller-connections{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.controller-connections>div{display:grid;gap:7px;align-content:start;padding:15px;border:1px solid var(--line);border-radius:12px;background:#0d142080;min-width:0}
.controller-connections span,.controller-connections small{color:var(--muted);font-size:12px}
.controller-connections strong{font-size:17px;overflow-wrap:anywhere;color:#d2c4ed}
.controller-connections strong[data-state=ready]{color:var(--green)}
.controller-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:18px 0}
.controller-actions button,.controller-secondary button,.controller-scene button,.controller-diagnostics button,#universalDownload{min-height:44px;background:#263249;border:1px solid #52647e;border-radius:9px;color:var(--text);padding:10px 12px;max-width:100%;font:inherit;font-size:13px}
.controller-actions #controllerConnect{background:var(--purple);color:#17111e;border-color:var(--purple);font-weight:700}
.controller-actions #controllerWrite{border-color:var(--purple)}
.controller-panel button:disabled,.controller-diagnostics button:disabled{opacity:.4;cursor:not-allowed}
.controller-panel button:hover:enabled,.controller-diagnostics button:hover:enabled{border-color:var(--purple)}
.controller-secondary{display:flex;flex-wrap:wrap;gap:9px;margin:12px 0}
.controller-consent{display:flex;gap:9px;align-items:start;font-size:12px;color:var(--muted)}
.controller-consent input{margin-top:4px;flex-shrink:0}
.controller-scene{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;margin-top:14px}
.controller-scene button{margin-left:auto;font-size:12px}
.controller-scene>span{color:var(--muted)}
.controller-jump{text-align:center;text-decoration:none}
.controller-jump:hover{color:#17111e}
.controller-diagnostics{margin-top:0;padding-top:0;border-top:0}
.controller-diagnostics button{font-size:12px}
@media(max-width:520px){.controller-actions button{padding:10px 6px}.controller-connections{gap:8px}.controller-connections>div{padding:12px}.controller-connections strong{font-size:15px}}
/* Scene editing and compact lighting. */
.palette-grid .palette-item{min-width:0;display:grid;gap:3px}.palette-grid .palette-item>[data-palette]{width:100%;min-height:66px;border:1px solid #43506a;border-radius:10px;padding:10px 6px;background:#101725;color:var(--text);font:inherit;font-size:12px}.palette-grid .palette-item>[data-palette][aria-pressed=true]{border-color:var(--purple);background:#b28df924}.palette-edit{justify-self:center;border:0;background:transparent;color:var(--purple);padding:3px 14px;font-size:11px}
#lighting .light-preview{margin:10px 0;gap:12px}#lighting .light-preview i{width:23px;height:23px}#lightingChoicesPanel{margin-top:12px;padding-top:12px}.light-mode-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin:0 0 14px}.light-mode-row label{font-size:12px}.light-mode-row select,.light-channel select,.preview-window select{font:inherit;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:7px;background:#101725}.light-channel-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.light-channel{background:#0d142070;border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0}.light-channel h3{margin:0 0 10px;font-size:14px;color:#d6c4fb}.light-channel>label{display:block;font-size:12px;margin:10px 0 0}.light-channel input[type=range]{display:block;width:100%;margin:8px 0;accent-color:var(--purple)}.light-channel select{display:block;width:100%;margin-top:5px}.light-channel input[type=color]{width:40px;height:30px;padding:0;border:0;vertical-align:middle;margin-left:10px;background:none}.light-channel output{float:right;color:var(--muted)}.range-ends{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.range-ends>span{margin-left:auto}.light-help{margin-top:10px;padding-top:10px}.rotation-choices{display:flex;flex-wrap:wrap;gap:10px}.rotation-choices label{font-size:12px}#lightRotationOptions{margin:10px 0 14px;display:grid;gap:10px}.lighting-summary strong{display:flex;gap:5px;flex-wrap:wrap;align-items:center;justify-content:flex-end}.lighting-summary strong i,.scene-colors i{display:inline-block;flex:none;width:13px;height:13px;border-radius:50%;border:1px solid #ffffff66}.lighting-summary strong span{font-size:12px;letter-spacing:0;color:var(--text);font-weight:650}.preview-window{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:11px;margin:10px 0}
#scenes button,.draft-recovery button{background:#263249;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:8px 11px;min-height:38px;font:inherit;font-size:12px}#scenes button:disabled{opacity:.4;cursor:not-allowed}#sceneUpdate,#sceneSave{border-color:var(--purple)}#sceneUpdate:enabled{background:var(--purple);color:#17111e}.save-locations{display:grid;gap:5px;border-left:3px solid var(--purple);padding-left:12px}.save-locations p{margin:0;font-size:12px;color:var(--muted)}.save-locations #editorStatus{color:var(--text);font-weight:650}.scene-editor{margin:16px 0 10px;align-items:start}.scene-editor label:first-child{flex:1}.scene-editor input[type=number]{width:85px}.scene-editor-actions,.scene-library-actions,.scene-starters{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.scene-library-actions{justify-content:space-between;margin:12px 0 20px}.scene-library-actions span{font-size:11px;color:var(--muted)}.scene-cards{display:grid;gap:12px;margin-top:20px}.scene-card{border:1px solid var(--line);background:#0d142070;border-radius:12px;padding:14px;min-width:0}.scene-card.is-editing{border-color:var(--purple);box-shadow:inset 3px 0 var(--purple)}.scene-card-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.scene-card-head strong{flex:1;min-width:100px;overflow-wrap:anywhere}.scene-duration,.scene-first{font-size:11px;color:#d0b8ff}.scene-first{border:1px solid #786393;padding:2px 6px;border-radius:5px}.scene-look{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);margin:10px 0}.scene-look img{border-radius:6px;object-fit:contain;flex-shrink:0}.scene-colors{display:flex;gap:4px}.scene-card-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.scene-card-actions button{padding:6px 9px!important;min-height:34px!important}.scene-timing-note{font-size:11px;margin:5px 0;color:#d5bd8a}.scene-sequence{display:flex;flex-wrap:wrap;gap:7px}.sequence-chip{font-size:11px;background:#b28df915;border:1px solid #b28df944;border-radius:7px;padding:6px 9px;overflow-wrap:anywhere}.draft-recovery{border:1px solid #786393;background:#b28df915;border-radius:10px;padding:12px;margin-top:12px;font-size:12px}.draft-recovery>div{display:flex;gap:8px;margin-top:8px}.small-dialog{width:min(93vw,470px)}.dialog-body{padding:18px;font-size:13px}.dialog-body label{display:block;font-size:13px}.dialog-body input:not([type=color]):not([type=checkbox]){width:100%;background:#0d1420;border:1px solid #52647e;color:var(--text);padding:10px;border-radius:8px;margin:6px 0 12px;font:inherit}.dialog-body fieldset{border:0;padding:0;margin:0}.palette-edit-colors{display:flex;gap:18px;margin:12px 0}.palette-edit-colors input{display:block;width:70px;height:42px;background:none;border:0}.small-dialog .dialog-actions{position:sticky;bottom:0;background:#111825}.small-dialog li{margin:9px 0;overflow-wrap:anywhere}#sceneRenameError{color:#ffc4cc}
@media(max-width:520px){.light-channel-grid{gap:8px}.light-channel{padding:10px}.light-channel>label{font-size:11px}.light-mode-row{gap:9px}.palette-grid .palette-item>[data-palette]{min-height:60px}.scene-card{padding:12px}.scene-editor-actions button{flex:1}.scene-editor-actions{align-items:stretch}.save-locations p{overflow-wrap:anywhere}}
@media(max-width:360px){.light-channel-grid{grid-template-columns:1fr}}
.palette-grid .palette-edit{display:block;justify-self:center;min-height:24px;gap:0;padding:2px 14px;border:0;background:transparent;color:var(--purple);font-size:11px;border-radius:5px}
#lighting .section-head{margin-bottom:8px}#lighting .palette-grid{margin-top:8px}#lighting .light-preview{margin:8px 0}.light-channel{padding:12px}.light-channel>label{margin-top:8px}.light-help{margin-top:8px;padding-top:8px}
.draft-top-notice{padding:12px 16px;border:1px solid #786393;background:#b28df915;border-radius:10px;font-size:13px;margin:0 0 20px}#sceneMessage{font-size:12px;color:#d3c2f0}

/* Compact appearance indicators and saved-scene request previews. */
.eyes-summary strong{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:5px}.eyes-summary img{object-fit:contain;border-radius:5px}.eyes-summary strong span{font:inherit;letter-spacing:0;color:var(--text)}.eyes-summary .eye-rotation{color:var(--purple);font-size:17px;font-weight:400}
#first-run>summary small{color:var(--purple);font-size:10px;letter-spacing:.09em;margin:0 0 5px}#first-run>summary strong{font-size:18px}#advanced #breaks{margin:0 0 22px;padding-top:16px}#breaks .section-head h2{font-size:15px}
.scene-starters{display:grid;grid-template-columns:1fr;margin-top:12px}#scenes .scene-starters button{display:grid;gap:6px;text-align:left;background:#b28df90b;border-color:#61517c;padding:12px}.scene-starters b{color:#d6c4fb;font-size:13px}.scene-starters small{font-size:12px;line-height:1.5}.scene-starters span{color:var(--muted);font-size:11px}
.routine-preview{margin-top:20px;border:1px solid var(--line);border-radius:12px;padding:13px;background:#0d142070}.routine-preview h3{font-size:14px;margin:0}.routine-preview>p{margin:6px 0 12px}.scene-sequence{display:grid;gap:14px}.routine-scene{min-width:0}.routine-scene+.routine-scene{padding-top:12px;border-top:1px solid var(--line)}.routine-scene.is-inactive{opacity:.55}.routine-scene-title{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:8px;font-size:12px}.routine-scene-title strong{overflow-wrap:anywhere}.routine-scene-title>span{font-size:10px;color:var(--muted)}.routine-lane{display:grid;grid-template-columns:minmax(115px,40%) 1fr;gap:10px;align-items:center;min-height:22px}.routine-lane>span{font-size:10px;color:#c9d2e2}.routine-track{height:13px;position:relative;background:#28334a66;border-radius:3px}.routine-tick{position:absolute;top:2px;width:2px;height:9px;background:var(--purple)}.routine-tick.arm{background:#76b9ff}.routine-tick.torso{background:#ef8dcb}.routine-tick.compound{background:#ffaf56}.routine-tick.eyes{background:var(--amber)}.routine-tick.lights{background:#70d5bb}.routine-tick.jaw{background:var(--green)}.routine-axis{display:flex;justify-content:space-between;margin-left:calc(40% + 6px);font-size:9px;color:var(--muted);margin-top:3px}.routine-empty{display:block;font-size:10px;color:var(--muted);line-height:1.5;margin:4px 0}

/* Decorative movement illustrations; never device feedback. */
.movement-top{gap:12px}.movement-top .movement-label{flex:1;min-width:0}.movement-demo{width:46px;height:46px;flex:none;color:#736485;opacity:.6;perspective:110px;background:#b28df911;border:1px solid #b28df92b;border-radius:10px;padding:4px}.movement-demo svg{stroke-width:1.8;display:block;width:100%;height:100%;overflow:visible}.movement-demo.is-enabled{color:var(--purple);opacity:1}.movement-demo .demo-moving{transform-box:view-box;transform-origin:32px 25px}.head-demo.is-animated .demo-moving{animation:skull-turn 10s ease-in-out infinite}.torso-demo .demo-moving{transform-origin:32px 40px}.torso-demo.is-animated .demo-moving{animation:torso-turn 11s ease-in-out infinite}.arm-demo .demo-moving{transform-origin:23px 12px}.arm-demo.is-animated .demo-moving{animation:arm-wave 12s ease-in-out infinite}.motion-paused .demo-moving{animation-play-state:paused!important}.demo-ground{opacity:.3}
@keyframes skull-turn{0%,40%,100%{transform:rotateY(0deg) translateX(0)}10%{transform:rotateY(-38deg) translateX(-2px)}28%{transform:rotateY(38deg) translateX(2px)}}
@keyframes torso-turn{0%,44%,100%{transform:translateX(0) rotate(0deg) rotateY(0deg)}12%{transform:translateX(-3px) rotate(-8deg) rotateY(-32deg)}30%{transform:translateX(3px) rotate(8deg) rotateY(32deg)}}
@keyframes arm-wave{0%,40%,100%{transform:rotate(0deg)}12%{transform:rotate(-30deg)}28%{transform:rotate(12deg)}}
/* Compact library rows retain primary Edit and keyboard-accessible extra actions. */
.scene-card{padding:11px 13px}.scene-cards{gap:8px}.scene-look{margin:6px 0;gap:7px}.scene-look img{width:28px;height:28px}.scene-card-head>button{min-height:32px!important;padding:5px 10px!important}.scene-more summary{font-size:11px;cursor:pointer;color:var(--purple);width:fit-content}.scene-more .scene-card-actions{margin-top:8px}.scene-more[open]{margin-top:8px}.scene-preview-picker{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:12px 0}.scene-preview-picker select{min-width:0;max-width:100%;font:inherit;color:var(--text);border:1px solid #52647e;border-radius:8px;padding:8px;background:#101725}.routine-scene{animation:scene-preview-in .16s ease-out}@keyframes scene-preview-in{from{opacity:.6;transform:translateY(2px)}to{opacity:1;transform:none}}
@media(max-width:520px){.movement-demo{width:36px;height:38px}.movement-top{gap:8px}.movement-label{gap:8px}.movement-icon{width:36px;height:38px}.movement-label strong{font-size:14px}.movement-label small{font-size:10px}.scene-card{padding:10px}.scene-card-head{gap:6px}.scene-first{font-size:9px}.scene-look{font-size:10px}}
@media(prefers-reduced-motion:reduce){.movement-demo .demo-moving,.routine-scene{animation:none!important}}
/* Audio preparation stays behind one collapsed optional panel. */
#audioScenes fieldset{min-width:0;border:0;padding:0;margin:16px 0}#audioScenes legend{font-size:12px;color:var(--muted);margin-bottom:10px}.audio-connection,.audio-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.audio-connection>span{flex:1;min-width:170px;font-size:11px;color:var(--muted)}.audio-connection strong{display:block;color:var(--text);font-size:13px;margin-top:4px}.audio-library-row{display:flex;gap:10px;align-items:end;margin:14px 0}.audio-library-row>label{flex:1;min-width:0;font-size:12px}.audio-library-row select,.audio-eye select,#audioScenes .single-field input{width:100%;box-sizing:border-box;margin-top:6px}.audio-library-row select,.audio-eye select,.audio-light select{background:#101725;border:1px solid #52647e;color:var(--text);border-radius:8px;padding:8px;min-width:0}.audio-selected{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;overflow-wrap:anywhere}.audio-motors{display:flex;gap:16px;margin:12px 0;flex-wrap:wrap;font-size:12px}.audio-eye{display:flex;align-items:center;gap:10px;font-size:12px;margin:14px 0}.audio-eye img{border-radius:50%;object-fit:contain}.audio-eye select{width:auto;margin:0}.audio-light-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}.audio-light{background:#0c132077;border:1px solid var(--line);border-radius:10px;padding:12px;min-width:0;display:grid;gap:10px;font-size:11px}.audio-light>label{display:flex;align-items:center;justify-content:space-between;gap:10px}.audio-light input[type=number]{width:64px}.audio-light input[type=range]{width:100px;max-width:55%}.audio-light input[type=color]{width:42px;height:30px;border:0;padding:0;background:transparent}.audio-timing{display:grid;grid-template-columns:2fr 2fr 1fr;gap:10px;margin-top:18px}.audio-timing label{font-size:11px;color:var(--muted)}.audio-timing input{display:block;width:100%;box-sizing:border-box;margin-top:6px}#audioProgress{display:block;width:100%;height:8px;margin-top:14px;accent-color:var(--purple)}#audioProgress[hidden]{display:none}#audioMessage[data-state=error]{color:#ffb4b4}#audioScenes .helper{font-size:11px;line-height:1.6}#audioScenes button{font-size:11px}#audioScenes input[type=checkbox]{accent-color:var(--purple)}@media(max-width:520px){.audio-light-grid{grid-template-columns:1fr}.audio-timing{grid-template-columns:1fr 1fr}.audio-timing label:first-child{grid-column:1/-1}.audio-library-row{flex-wrap:wrap}.audio-library-row>label{min-width:100%}}
/* Keep the optional panel’s everyday actions compact despite shared secondary styles. */
#audioScenes button{width:auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0;padding:9px 12px;min-height:36px;border:1px solid #8063a7;border-radius:8px;background:#8c60cf;color:#fff;font:inherit;font-size:11px;font-weight:600;cursor:pointer}#audioScenes button.secondary{width:auto;display:inline-flex;margin:0;background:#263149;border-color:#465470;color:#e0d8ec}#audioScenes button:disabled{opacity:.45;cursor:not-allowed}.audio-connection button,.audio-library-row button{flex:none}.audio-library-row>label{min-width:160px}.audio-actions{margin-top:12px}#audioScenes input[type=checkbox]{width:16px;height:16px}#audioScenes #audioOff{margin-top:14px}@media(max-width:520px){.audio-library-row>label{min-width:100%}}

/* Optional tools stay compact and reveal detail only when opened. */
.controller-activity{font-size:12px;color:var(--purple);padding:9px 12px;border-left:2px solid var(--purple);background:#b28df90b}.experimental-audio{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}#audioWaveform{width:100%;height:58px;margin:12px 0;background:#0c1320;border-radius:8px}.audio-trim{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:11px}.audio-trim input{display:block;width:100%;max-width:140px;margin-top:5px}#audioPrepPlayer{width:100%;height:36px;margin-top:10px}#audioPrepPlayer[hidden]{display:none}.scene-compare-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:9px;margin-top:12px;max-width:100%}#sceneComparison{border-collapse:collapse;width:100%;font-size:11px;min-width:560px}#sceneComparison th,#sceneComparison td{text-align:left;vertical-align:top;padding:9px;border-bottom:1px solid var(--line);max-width:150px;overflow-wrap:anywhere}#sceneComparison th{color:var(--purple);font-weight:600}#sceneComparison caption{text-align:left;color:var(--muted);padding:8px;font-size:10px}.scene-overview{min-width:0}

#audioScenes>summary small{display:block;font-weight:400;font-size:11px;color:var(--muted);margin-top:5px}#audioScenes>summary strong{font-size:13px}#sceneComparison [hidden]{display:none}
/* Compatibility warning appears only after deliberate experimental selection. */
#deviceWarning{grid-column:1/-1;}

/* First-time installation is separate from everyday USB settings. */
.install-panel{max-width:860px;margin-inline:auto}.install-link{display:inline-block;background:var(--purple);color:#17111e;border-radius:9px;padding:12px 16px;font-size:14px;font-weight:700;text-decoration:none;max-width:100%;box-sizing:border-box}
.install-steps{padding-left:24px}.install-steps>li{padding:4px 0 20px 8px;border-bottom:1px solid var(--line);margin-bottom:20px}.install-steps h2{font-size:20px;margin:8px 0}.install-panel p,.install-panel li{line-height:1.7}.install-panel button{font:inherit;min-height:44px;padding:10px 16px;border-radius:9px;border:1px solid #8063a7;background:#8c60cf;color:white;cursor:pointer}.install-panel button:disabled{opacity:.4;cursor:not-allowed}.install-panel input[type=file]{display:block;max-width:100%;margin:12px 0}#installerStatus{overflow-wrap:anywhere}#installerStatus[data-state=error]{color:#ffb4b4}#installerStatus[data-state=ready]{color:var(--green)}.install-panel [hidden]{display:none}
@media(max-width:520px){.install-steps{padding-left:18px}.install-steps>li{padding-left:2px}.install-panel h1{font-size:26px}.install-link{font-size:13px}}