@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#0e1118;--panel:#181d27;--line:#2d3440;--muted:#8894a7;--text:#f3f6fb;--accent:#f9bf62}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px 'DM Sans',system-ui,sans-serif}.topbar{height:72px;border-bottom:1px solid #262c38;display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:#141923}.brand{display:flex;gap:13px;align-items:center;font:800 21px 'Outfit',sans-serif;letter-spacing:.04em}.brand-icon{background:#f6bd64;color:#1b1c22;border-radius:12px;padding:8px 12px;font-size:24px}.brand-accent{color:var(--accent)}.brand small{display:block;color:#8e98a8;font:700 9px 'DM Sans',sans-serif;letter-spacing:.32em;margin-top:1px}.top-right{display:flex;gap:16px;align-items:center}.pill-live{border:1px solid #304335;background:#1b2a25;padding:8px 12px;border-radius:20px;color:#a6ddb5;font-size:10px;font-weight:800;letter-spacing:.12em}.pill-live i{display:inline-block;width:7px;height:7px;background:#69c88b;border-radius:50%;margin-right:6px}.version{color:#6a7485}.workspace{display:grid;grid-template-columns:minmax(470px,1fr) 390px;max-width:1500px;margin:auto;min-height:calc(100vh - 72px)}.studio-panel{padding:29px 38px 32px}.settings-panel{border-left:1px solid var(--line);background:#171c25;padding:29px 26px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.eyebrow{color:#bb9d68;font-size:10px;font-weight:800;letter-spacing:.16em;margin-bottom:8px}h1,h2{font:700 25px 'Outfit',sans-serif;margin:0;letter-spacing:-.035em}h2{font-size:24px}.status{font-size:10px;font-weight:800;letter-spacing:.13em;color:#93ca9f;border:1px solid #3a5140;border-radius:5px;padding:8px 11px}.viewer-area{height:min(67vh,770px);min-height:470px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid #2b323f;border-radius:16px;background:radial-gradient(ellipse at center,#212937,#121720 76%);padding:12px}.viewer-frame{height:100%;aspect-ratio:9/16;max-width:100%;box-shadow:0 22px 75px #0009;border-radius:5px;overflow:hidden}canvas{width:100%;height:100%;display:block}.timeline{margin-top:20px}.timeline-track{height:5px;background:#343b4b;border-radius:10px;overflow:hidden}.timeline-track div{height:100%;background:linear-gradient(90deg,#ee9e52,#f4d38d);width:0}.timeline-labels{display:flex;justify-content:space-between;margin-top:8px;color:#98a4b8;font-size:11px;font-variant-numeric:tabular-nums}.transport{display:flex;gap:10px;margin-top:17px;flex-wrap:wrap}.btn{cursor:pointer;min-height:42px;border-radius:9px;border:1px solid #3e4858;background:#242d3a;color:#f5f6fa;padding:0 14px;font:800 12px 'DM Sans',sans-serif;transition:background .2s,transform .15s}.btn:hover:not(:disabled){filter:brightness(1.17)}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-main{background:#f6c16b;color:#25211d;border:0;flex:1;min-width:155px}.btn-icon{font-size:20px;width:45px;padding:0}.btn-record{border-color:#85454b;background:#40272d;color:#ffc7cd}.rec-dot{display:inline-block;background:#ff6267;border-radius:50%;width:9px;height:9px;margin-right:8px}.small-note{color:#788499;font-size:11px;margin-top:12px;text-align:center}.subtle-btn{background:transparent;color:#aeb9c9;border:0;cursor:pointer;font-size:11px}.panel-group{padding:20px 0 22px;border-top:1px solid #2b323d}.group-title{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:800;letter-spacing:.09em;color:#e9edf5;margin-bottom:20px}.group-num{width:22px;height:22px;display:grid;place-items:center;background:#303844;border-radius:6px;color:#f6c36e;font-size:10px}.field{margin-bottom:21px}.field:last-child{margin-bottom:0}.field>label{display:flex;justify-content:space-between;color:#c9d1dc;font-size:12px;margin-bottom:11px;gap:8px}.field output{color:#f4c982;font-weight:800}input[type=range]{width:100%;accent-color:#f4be64;cursor:pointer}input[type=color]{width:44px;height:33px;border:1px solid #4b5360;padding:2px;background:transparent;border-radius:6px;cursor:pointer}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-bottom:20px}.color-grid label{display:flex;align-items:center;justify-content:space-between;background:#222936;padding:11px 12px;border-radius:8px;color:#b9c3d1;font-size:10px;font-weight:800;letter-spacing:.08em;gap:9px}select,input[type=number]{width:100%;border:1px solid #3c4554;border-radius:8px;background:#242b37;color:white;padding:11px;font:12px 'DM Sans',sans-serif}.toggle-field{display:flex;align-items:center;justify-content:space-between;margin:14px 0;color:#c9d1dc;font-size:12px}.toggle-field input{accent-color:#f2c26e;width:18px;height:18px}.seed-row{display:flex;gap:9px}.seed-row button{background:#303947;border:1px solid #445061;border-radius:8px;padding:0 12px;color:white;white-space:nowrap;cursor:pointer}.btn-apply{width:100%;background:#f6c16b;color:#28231d;border:0}.result-box{border:1px solid #414955;background:#202936;padding:14px;border-radius:10px;color:#bbc7d6;font-size:12px;line-height:1.6;margin-bottom:20px}.meta-label{font-size:10px;font-weight:800;letter-spacing:.12em;color:#9da9b9;margin:19px 0 8px}.meta-text{font-size:13px;font-weight:800;line-height:1.6}.description-box{font-size:12px;color:#b8c3d2;line-height:1.6}.btn-secondary{width:100%;margin-top:12px}.thumb-heading{display:flex;justify-content:space-between}.thumb-heading span{font-size:9px;color:#788597}.thumb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.thumb{aspect-ratio:9/16;width:100%;padding:0;overflow:hidden;border:2px solid #404b5b;border-radius:5px;cursor:pointer;background:#222}.thumb.selected{border-color:#f6bd64;box-shadow:0 0 0 1px #f6bd64}.thumb img{display:block;width:100%;height:100%;object-fit:cover}.thumb-placeholder{grid-column:1/-1;font-size:11px;color:#7c899b;padding:16px 4px;border:1px dashed #3a4554;text-align:center;border-radius:8px}.toast{opacity:0;position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(80px);background:#f0c27b;color:#211c16;padding:12px 22px;border-radius:9px;font-weight:800;transition:transform .2s;z-index:20;pointer-events:none}.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}@media(max-width:900px){.workspace{grid-template-columns:1fr}.settings-panel{border-left:0;border-top:1px solid var(--line)}.studio-panel{padding:22px}.settings-panel{padding:22px}.viewer-area{height:66vh}.topbar{padding:0 20px}}@media(max-width:430px){.transport{gap:7px}.btn-record{flex:1}.viewer-area{min-height:440px}h1,h2{font-size:21px}}
