/* Riggler preview styles (moved from MotionForgeStudio.html by build_site.py). */
    :root{--bg:#080e0b;--panel:#0f1914;--panel2:#15221c;--line:#2c2f2e;--text:#f7faf8;--muted:#979a98;--accent:#2ec278;--accent2:#348a5f;--good:#75e9c0;--pink:#9aa5a0;--red:#ff6e86}
    *{box-sizing:border-box}html,body{height:100%;margin:0}body{overflow:hidden;background:radial-gradient(70% 80% at 58% -15%,#2a513e 0,#0b110e 52%),var(--bg);color:var(--text);font:13px/1.35 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}
    button,input,select,textarea{font:inherit}button{cursor:pointer}.app{height:100%;display:grid;grid-template-columns:236px 1fr;grid-template-rows:60px 1fr}.sidebar{grid-row:1/3;background:linear-gradient(180deg,#0d1812,#0c1310 70%);border-right:1px solid #1c2e25;padding:18px 12px 14px;display:flex;flex-direction:column;gap:17px}.brand{display:flex;align-items:center;gap:10px;padding:0 10px;font-weight:800;font-size:15px;letter-spacing:.02em}.logo{width:27px;height:27px;border-radius:9px;background:conic-gradient(from 210deg,var(--accent),#439c70,var(--pink),var(--accent));box-shadow:0 0 25px #2ec27866;position:relative}.logo:after{content:"";position:absolute;inset:7px;border:2px solid #fff;border-radius:5px;opacity:.8}.credits{background:linear-gradient(145deg,#193427,#101e17);border:1px solid #2a4b3b;border-radius:12px;padding:11px 12px;margin:0 2px}.credits small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.12em}.credits b{font-size:26px;line-height:1;color:var(--text)}.credits span{float:right;color:var(--accent);font-size:11px;margin-top:10px}.credits button{width:100%;margin-top:9px;background:var(--accent);color:white;border:0;border-radius:6px;padding:6px 8px;font-size:11px;font-weight:700}.nav{display:flex;flex-direction:column;gap:3px}.nav-label{color:#636564;font-size:10px;text-transform:uppercase;letter-spacing:.14em;padding:7px 10px}.nav button{background:transparent;border:0;color:#aeb0af;text-align:left;border-radius:7px;padding:9px 10px;display:flex;align-items:center;gap:10px}.nav button:hover,.nav button.active{background:#1f3b2d;color:#fff}.nav button.active{box-shadow:inset 2px 0 var(--accent)}.nav i{width:17px;text-align:center;font-style:normal;color:#898d8b}.nav button.active i{color:var(--accent)}.sidebar-bottom{margin-top:auto;color:#686b6a;font-size:11px;padding:8px 10px}.sidebar-bottom div{padding:5px 0}.topbar{grid-column:2;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1c2e25;background:#0c1410cc;backdrop-filter:blur(15px);padding:0 24px}.steps{display:flex;gap:4px;background:#101a15;border:1px solid #22352c;border-radius:8px;padding:3px}.step{display:flex;align-items:center;gap:6px;color:#757876;padding:6px 10px;border-radius:5px;font-size:11px}.step b{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#292b2a;color:#959796;font-size:10px}.step.active{background:#35855d;color:white}.step.active b{background:#39d185;color:#193b2a}.top-actions{display:flex;gap:9px}.ghost,.primary{border:1px solid #2c4539;border-radius:7px;padding:7px 11px;background:#131f19;color:#bfc2c0;font-size:11px}.primary{background:var(--accent);border-color:var(--accent);color:white;font-weight:700}.workspace{grid-column:2;min-width:0;overflow:auto;padding:22px 26px 26px}.workspace-head{display:flex;justify-content:space-between;align-items:flex-end;max-width:1280px;margin:0 auto 13px}.workspace-head h1{font-size:23px;letter-spacing:-.025em;margin:2px 0 4px}.workspace-head p{color:var(--muted);margin:0}.head-actions{display:flex;gap:8px}.chip{border:1px solid #373b39;background:#121d18;color:#abaeac;border-radius:99px;padding:6px 10px;font-size:11px}.chip b{color:var(--good)}.studio{max-width:1280px;margin:0 auto;background:#0a100d;border:1px solid #253b30;border-radius:12px;box-shadow:0 20px 60px #0008;overflow:hidden}.viewport{height:min(62vh,650px);min-height:420px;position:relative;background:radial-gradient(ellipse at 50% 42%,#1b3428 0,#101c16 40%,#090f0c 78%);overflow:hidden}.viewport:before{content:"";position:absolute;inset:48% -10% -40%;opacity:.28;background:linear-gradient(30deg,transparent 49.5%,#3e6954 50%,transparent 50.5%),linear-gradient(150deg,transparent 49.5%,#3e6954 50%,transparent 50.5%);background-size:70px 45px;transform:perspective(300px) rotateX(45deg);transform-origin:top}.view-label{position:absolute;top:14px;left:16px;color:#a2a5a3;font-size:10px;letter-spacing:.12em;text-transform:uppercase;background:#111d17cc;border:1px solid #263c31;padding:6px 8px;border-radius:5px;z-index:3}.viewport-tools{position:absolute;right:15px;top:14px;display:flex;flex-direction:column;gap:5px;z-index:3}.viewport-tools button{width:27px;height:27px;padding:0;border:1px solid #314a3e;background:#101a15dd;color:#adb0ae;border-radius:6px}.viewport-tools button:hover,.viewport-tools button.active{color:#fff;border-color:var(--accent);background:#214232}.avatar-canvas{position:absolute;inset:0;width:100%;height:100%}.empty-preview{position:absolute;inset:0;display:grid;place-items:center;color:#787b7a;text-align:center;pointer-events:none}.empty-preview div{max-width:270px}.empty-preview b{display:block;color:#68a285;margin-bottom:5px}.preview-badge{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);background:#101a15dd;border:1px solid #2e4a3c;border-radius:99px;padding:6px 11px;color:#a0a4a2;font-size:11px;z-index:3}.preview-badge b{color:var(--good)}.transport{height:47px;border-top:1px solid #1f3028;border-bottom:1px solid #1f3028;background:#0d1410;display:flex;align-items:center;gap:12px;padding:0 15px}.transport button{border:0;background:transparent;color:#c5c8c6}.transport .play{width:27px;height:27px;border-radius:50%;background:var(--accent);color:white}.time{font:11px ui-monospace,monospace;color:#abaeac;min-width:83px}.scrub{flex:1;accent-color:var(--accent)}.fps{color:#6f7270;font-size:11px}.composer{display:grid;grid-template-columns:1fr auto;gap:11px;margin-top:13px;background:#0f1914;border:1px solid #253b30;border-radius:10px;padding:13px}.composer-main{min-width:0}.composer textarea{width:100%;min-height:37px;resize:none;background:transparent;border:0;outline:0;color:#dae4df;line-height:1.5}.composer textarea::placeholder{color:#777978}.composer-meta{display:flex;gap:7px;align-items:center;margin-top:7px}.select,.source-btn{border:1px solid #2d4539;background:#13211a;color:#abaeac;border-radius:5px;padding:5px 8px;font-size:10px}.source-btn{cursor:pointer}.source-btn input{display:none}.source-btn strong{color:var(--good);font-weight:600}.generate{align-self:end;background:var(--accent);border:0;color:white;border-radius:7px;padding:9px 15px;font-weight:700}.generate:disabled{opacity:.5;cursor:not-allowed}.footer-row{display:flex;justify-content:space-between;align-items:center;color:#767978;font-size:11px;margin-top:10px}.job{font-family:ui-monospace,monospace;color:#79d8bd}.side-panel{display:none}.statusline{min-height:17px}.statusline.error{color:var(--red)}.statusline.good{color:var(--good)}
    @media(max-width:950px){.app{grid-template-columns:70px 1fr}.sidebar{padding:18px 8px}.brand span,.credits,.nav-label,.nav button span,.sidebar-bottom{display:none}.brand{justify-content:center;padding:0}.nav button{justify-content:center}.workspace{padding:16px}.workspace-head{display:block}.head-actions{margin-top:10px}.viewport{height:54vh}}
    .workspace{padding:15px 20px 24px}.workspace-head{max-width:none;margin-bottom:10px}.studio{max-width:none}.viewport{height:clamp(560px,calc(100vh - 285px),820px);min-height:560px}.transport{height:56px;padding:0 18px;gap:15px}.viewport-tools{right:18px;top:18px;gap:6px}.viewport-tools button{width:32px;height:32px;font-size:14px}.viewport-tools .tool-divider{height:1px;background:#3d413f;margin:3px 0}.viewport-tools .zoom-readout{color:#abaeac;font:10px ui-monospace,monospace;text-align:center;padding:2px 0}.view-help{position:absolute;left:18px;bottom:18px;z-index:3;color:#838584;background:#101a15cc;border:1px solid #293f34;border-radius:7px;padding:7px 9px;font-size:10px}.source-view{display:none;position:absolute;left:18px;bottom:18px;width:min(310px,32%);max-height:34%;object-fit:contain;background:#080d0b;border:1px solid #406251;border-radius:8px;z-index:4;box-shadow:0 15px 36px #0009}.viewport.show-source .source-view{display:block}.viewport.show-source .view-help{left:calc(min(310px,32%) + 30px)}.viewport.show-source #sourceToggle{color:#fff;border-color:var(--good);background:#183a35}.viewport-info{position:absolute;left:18px;top:18px;z-index:3;display:flex;gap:6px}.viewport-info span{border:1px solid #2a4035;background:#101a15cc;color:#a1a3a2;border-radius:5px;padding:5px 7px;font:10px ui-monospace,monospace}.viewport-info b{color:var(--good);font-weight:600}.control-title{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#767978;text-align:center;margin-top:2px}.composer{margin-top:12px}.footer-row{margin-top:7px}
    .studio:fullscreen{width:100vw;height:100vh;border:0;border-radius:0}.studio:fullscreen .viewport{height:calc(100vh - 56px);min-height:0}.studio:fullscreen .transport{height:56px}
    .feature-dock{margin-top:12px;background:#0f1914;border:1px solid #253b30;border-radius:10px;overflow:hidden}.feature-tabs{display:flex;gap:5px;padding:8px;border-bottom:1px solid #253b30;background:#0d1410}.feature-tabs button{border:1px solid #2d4539;background:#13211a;color:#abaeac;border-radius:6px;padding:6px 9px;font-size:10px}.feature-tabs button.active{background:#35855d;color:#fff;border-color:#2ec278}.feature-content{padding:12px}.feature-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}.feature-card{border:1px solid #2a4035;background:#13211a;border-radius:8px;padding:10px;color:#cacccb}.feature-card small{display:block;color:#838584;margin-top:4px}.feature-card button{margin-top:8px;border:1px solid #3c5e4d;background:#1b3227;color:#d2ded8;border-radius:5px;padding:5px 8px;font-size:10px}.feature-actions{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}.feature-actions button{border:1px solid #3c5e4d;background:#1b3227;color:#d2ded8;border-radius:6px;padding:6px 9px;font-size:10px}.feature-actions button.primary{background:#2ec278;color:#fff;border-color:#2ec278}.feature-note{color:#838584;font-size:11px}.sequence-row{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid #2b2e2c}.sequence-row input{accent-color:#2ec278}.sequence-row span{flex:1}.statusline{overflow-wrap:anywhere}
  

/* An element told to hide must hide. Any rule that sets display on a class -- and there are
   several -- otherwise beats the plain [hidden] attribute, which is how a hidden field ends
   up on screen anyway. */
[hidden]{display:none !important}
