:root{color-scheme:dark;--bg:#0b0c0e;--panel:#111216;--panel2:#16171c;--panel3:#1d1e24;--ink:#f3f1f5;--ink-muted:#a1a0ab;--ink-faint:#6f707a;--line:#2a2a31;--line2:#33333b;--accent:#d3c4ff;--accent-text:#1a142a;--glow:rgba(185,156,254,.17);--overlay:rgba(10,10,13,.84);--shadow:0 32px 110px rgba(0,0,0,.38);font-synthesis:none}
:root[data-theme=light]{color-scheme:light;--bg:#f8f8fa;--panel:#fff;--panel2:#f3f3f7;--panel3:#e9e9f0;--ink:#20212a;--ink-muted:#61616e;--ink-faint:#90909b;--line:#e4e4ea;--line2:#d5d5dd;--accent:#4c386f;--accent-text:#fff;--glow:rgba(126,99,169,.10);--overlay:rgba(248,248,250,.92);--shadow:0 30px 90px rgba(52,46,71,.12)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:'DM Sans','Noto Sans Sinhala',sans-serif;-webkit-font-smoothing:antialiased}body{overflow-x:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:inherit;text-decoration:none}svg{flex-shrink:0}::selection{background:#b5a3ed77}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:var(--line2);border:3px solid var(--bg);border-radius:20px}::-webkit-scrollbar-track{background:transparent}
.icon{width:18px;height:18px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}.icon.sm{width:15px;height:15px}.icon.lg{width:23px;height:23px}.brand-mark{width:33px;height:33px;border-radius:11px;background:#d5c6fa;display:grid;place-items:center;color:#21172c;font-family:Manrope,sans-serif;font-weight:800;font-size:23px;line-height:1;letter-spacing:-3px;padding-right:3px}.brand-mark.small{width:31px;height:31px;border-radius:10px;font-size:21px}.brand{display:flex;align-items:center;gap:10px;font:800 16px Manrope,sans-serif;letter-spacing:2px}.wordmark{line-height:1}.byline{font-size:10px;letter-spacing:.3px;color:var(--ink-faint);font-weight:500;margin-top:3px}
.btn{border:1px solid var(--line2);border-radius:11px;background:var(--panel2);color:var(--ink);padding:11px 15px;display:inline-flex;align-items:center;justify-content:center;gap:9px;white-space:nowrap;font-size:13px;font-weight:650;min-height:41px;transition:background .2s,border .2s,transform .2s}.btn:hover:not(:disabled){background:var(--panel3);border-color:var(--ink-faint)}.btn:active{transform:scale(.975)}.btn-primary{background:var(--accent);border-color:transparent;color:var(--accent-text)}.btn-primary:hover:not(:disabled){background:#e5dbff;color:#191422;border-color:transparent}:root[data-theme=light] .btn-primary:hover:not(:disabled){background:#654e8c;color:white}.btn-ghost{background:transparent;border-color:transparent}.btn-ghost:hover:not(:disabled){background:var(--panel2);border-color:transparent}.btn-icon{width:40px;height:40px;padding:0}.btn-small{padding:8px 11px;min-height:34px;font-size:12px;border-radius:9px}.btn-danger{color:#ff9299}.btn-danger:hover{background:#6b27302b!important;border-color:#91384180!important}.chip{font-size:11px;display:inline-flex;gap:7px;align-items:center;border:1px solid var(--line2);background:var(--panel2);padding:7px 10px;border-radius:50px;font-weight:600;color:var(--ink-muted)}.status-dot{height:6px;width:6px;background:#bdebc2;border-radius:50%;box-shadow:0 0 9px #bdebc255}.muted{color:var(--ink-muted)}.eyebrow{font-size:11px;font-weight:750;color:var(--accent);letter-spacing:2.2px;text-transform:uppercase}.serif{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic}
/* Landing */
.landing{min-height:100vh;background:radial-gradient(ellipse 42% 28% at 74% 24%,rgba(130,102,171,.12),transparent),var(--bg)}.landing-nav{height:85px;display:flex;align-items:center;justify-content:space-between;max-width:1400px;padding:0 62px;margin:auto;border-bottom:1px solid #ffffff0d}.landing-nav-right{display:flex;align-items:center;gap:22px}.landing-nav-links{display:flex;gap:32px;font-size:13px;color:var(--ink-muted)}.landing-nav-links a:hover{color:var(--ink)}.intro{max-width:1400px;padding:100px 62px 120px;margin:auto;display:grid;grid-template-columns:.88fr 1.12fr;align-items:center;gap:50px;min-height:685px}.intro-text{position:relative;z-index:2}.mini-pill{display:inline-flex;gap:9px;align-items:center;color:var(--accent);font-size:12px;border:1px solid #d8c9fa36;border-radius:40px;padding:9px 13px;background:#b7a0ff0e;font-weight:650;margin-bottom:35px}.intro h1{font-family:Manrope,'Noto Sans Sinhala',sans-serif;font-size:clamp(55px,5.6vw,87px);line-height:1.06;font-weight:650;letter-spacing:-5px;max-width:660px;margin:0}.intro h1 em{font-family:Georgia,serif;color:var(--accent);font-weight:400;letter-spacing:-3px}.intro p{font-size:16px;color:var(--ink-muted);line-height:1.9;max-width:430px;margin:28px 0 32px}.intro-actions{display:flex;gap:11px;flex-wrap:wrap}.intro-actions .btn{min-height:50px;padding:12px 22px}.under-intro{display:flex;align-items:center;gap:25px;color:var(--ink-faint);font-size:12px;margin-top:28px}.under-intro span{display:flex;align-items:center;gap:7px}
.hero-art{height:505px;position:relative;perspective:1300px}.hero-back-glow{position:absolute;inset:-50px;background:radial-gradient(ellipse at 52% 55%,rgba(143,108,193,.27),transparent 62%);filter:blur(40px)}.hero-stage{position:absolute;top:25px;bottom:20px;left:5px;right:3px;background:#121219;border:1px solid #42404b;box-shadow:0 48px 115px #0009,0 0 0 7px #ffffff06;border-radius:21px;overflow:hidden;transform:rotateY(-8deg) rotateX(2deg);transform-origin:center;transition:transform .5s}.hero-stage:hover{transform:rotateY(-3deg) rotateX(1deg)}.hero-stage-bar{height:51px;border-bottom:1px solid #ffffff19;display:flex;align-items:center;justify-content:space-between;padding:0 17px;color:#b9b5c4;font-size:11px}.three-dots{display:flex;gap:6px}.three-dots i{display:block;width:7px;height:7px;background:#58545f;border-radius:100%}.stage-nav{display:flex;align-items:center;gap:8px}.stage-nav b{color:#d6cbf3;font-weight:600}.stage-view{position:absolute;top:68px;left:17px;right:17px;bottom:114px;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse at 40% 10%,#dfbba0 0%,#715973 30%,#23243e 57%,#11141e 92%)}.stage-view:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 39%,#131825b7 87%),radial-gradient(ellipse at 50% 56%,#3c334855,transparent 47%)}.mountain{position:absolute;bottom:0;width:140%;height:54%;left:-20%;background:#121725;clip-path:polygon(0 100%,0 75%,10% 68%,19% 82%,38% 22%,47% 55%,57% 32%,68% 64%,79% 46%,92% 74%,100% 59%,100% 100%)}.mountain.second{height:39%;opacity:.6;background:#28223a;left:-5%;clip-path:polygon(0 100%,0 55%,12% 40%,24% 76%,44% 35%,58% 65%,76% 18%,94% 74%,100% 38%,100% 100%)}.stage-view .overline{position:absolute;top:17px;left:21px;color:#eee8f0a8;font-size:10px;letter-spacing:1.5px}.stage-caption{position:absolute;bottom:47px;left:10%;right:10%;text-align:center;color:white;font:700 26px 'Noto Sans Sinhala',sans-serif;text-shadow:0 2px 20px #000a;letter-spacing:-.4px}.stage-caption small{display:block;font:500 11px 'DM Sans',sans-serif;letter-spacing:2px;color:#d8c7e9;margin-top:14px}.stage-timeline{position:absolute;bottom:12px;left:18px;right:18px;height:86px}.stage-time{height:23px;display:flex;align-items:center;justify-content:space-between;color:#73717c;font-size:9px}.stage-track{height:32px;border:1px solid #41404b;background:#191822;border-radius:8px;display:flex;gap:3px;padding:4px}.stage-block{height:100%;background:#9481c6;border-radius:4px;opacity:.7;flex:1}.stage-block:nth-child(even){background:#514368}.stage-playhead{position:absolute;top:22px;bottom:0;left:47%;width:2px;background:white;box-shadow:0 0 10px white}.stage-playhead:before{content:'';position:absolute;width:9px;height:9px;top:-4px;left:-3.5px;border-radius:50%;background:white}.floating-tool{position:absolute;right:-10px;top:0;background:#25212f;border:1px solid #6e5b817d;border-radius:11px;padding:12px 14px;color:#d8c4ed;font-size:11px;box-shadow:0 14px 35px #0006;display:flex;gap:8px;align-items:center;z-index:1}.floating-tool svg{width:17px;height:17px}
.features-section{border-top:1px solid var(--line);padding:95px 62px 110px;max-width:1400px;margin:auto}.section-head{display:flex;justify-content:space-between;gap:25px;align-items:flex-end;margin-bottom:47px}.section-head h2{font:600 clamp(32px,3.4vw,47px)/1.2 Manrope,sans-serif;letter-spacing:-2px;margin:17px 0 0;max-width:610px}.section-head p{max-width:300px;color:var(--ink-muted);font-size:13px;line-height:1.8}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.feature-card{border:1px solid var(--line);border-radius:18px;min-height:225px;padding:29px;background:linear-gradient(150deg,var(--panel2),var(--panel));position:relative;overflow:hidden}.feature-card .icon{color:var(--accent);height:25px;width:25px;margin-bottom:42px}.feature-card h3{margin:0 0 9px;font-size:17px;letter-spacing:-.3px}.feature-card p{margin:0;color:var(--ink-muted);font-size:12px;line-height:1.8;max-width:285px}.feature-card.feature-wide{grid-column:span 2;background:radial-gradient(ellipse at 85% 50%,#715d9a2c,transparent 62%),var(--panel2)}.feature-card.feature-wide p{max-width:440px}.footer{max-width:1400px;padding:30px 62px 40px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);color:var(--ink-faint);font-size:12px}.footer a{color:var(--ink-muted)}
/* App shell */
.app-shell{min-height:100vh;display:grid;grid-template-columns:76px minmax(0,1fr)}.rail{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;padding:22px 12px;gap:11px;position:sticky;top:0;height:100vh;z-index:20}.rail .brand-mark{margin-bottom:34px}.rail-button{width:46px;height:46px;border:none;background:transparent;color:var(--ink-faint);display:grid;place-items:center;border-radius:13px;transition:.2s;position:relative}.rail-button .icon{width:20px;height:20px}.rail-button:hover{background:var(--panel3);color:var(--ink)}.rail-button.active{background:#bba5eb20;color:var(--accent)}.rail-button.active:before{content:'';position:absolute;left:-12px;top:13px;height:20px;width:3px;border-radius:4px;background:var(--accent)}.rail-spacer{flex:1}.rail-bottom{display:flex;flex-direction:column;gap:8px}.workspace{min-width:0}.app-topbar{height:80px;border-bottom:1px solid var(--line);padding:0 36px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--bg)}.crumbs{display:flex;align-items:center;gap:12px;min-width:0;font-size:13px;color:var(--ink-muted)}.crumbs strong{color:var(--ink);font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.crumb-divider{opacity:.35}.top-actions{display:flex;align-items:center;gap:9px}.top-state{color:var(--ink-faint);font-size:12px;display:flex;align-items:center;gap:8px;margin-right:13px}.top-state .status-dot{width:6px;height:6px}
/* Dashboard */
.dashboard{max-width:1450px;margin:0 auto;padding:53px clamp(25px,5vw,70px) 80px}.dashboard-head{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:35px}.dashboard-head h1{font:600 clamp(32px,3.9vw,54px)/1.18 Manrope,sans-serif;letter-spacing:-2.5px;margin:8px 0 12px}.dashboard-head p{font-size:14px;color:var(--ink-muted);margin:0}.quick-new{border:1px solid var(--line2);border-radius:22px;padding:34px 38px;display:flex;align-items:center;justify-content:space-between;gap:28px;background:radial-gradient(ellipse at 78% 35%,rgba(158,125,220,.16),transparent 56%),linear-gradient(110deg,var(--panel2),var(--panel));min-height:193px;margin-bottom:47px;position:relative;overflow:hidden}.quick-new:after{content:'';position:absolute;width:180px;height:180px;right:22%;top:-110px;border:1px solid #ad95cf30;border-radius:50%;pointer-events:none}.quick-new h2{font:600 24px Manrope,sans-serif;letter-spacing:-.8px;margin:0 0 11px}.quick-new p{font-size:13px;color:var(--ink-muted);line-height:1.7;max-width:470px;margin:0}.quick-new-actions{display:flex;gap:10px;align-items:center;flex-shrink:0;z-index:1}.subheading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.subheading h2{font-size:17px;letter-spacing:-.4px;margin:0;font-weight:650}.project-count{color:var(--ink-faint);font-size:12px;font-weight:500;margin-left:10px}.search-input{border:1px solid var(--line);background:var(--panel);color:var(--ink);height:37px;border-radius:10px;padding:0 13px;min-width:205px;outline:none;font-size:12px}.search-input:focus{border-color:var(--accent)}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.project-card{border:1px solid var(--line);background:var(--panel);border-radius:17px;overflow:hidden;transition:transform .2s,border .2s,box-shadow .2s;cursor:pointer}.project-card:hover{transform:translateY(-3px);border-color:var(--ink-faint);box-shadow:0 12px 35px #0000001b}.project-preview{height:160px;background:linear-gradient(135deg,#33303a,#1d1f2a);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.project-preview img{width:100%;height:100%;object-fit:cover}.project-preview:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 70%,#1117)}.project-preview .icon{height:30px;width:30px;color:#c9b6dd}.video-duration{position:absolute;bottom:10px;right:12px;z-index:2;background:#101014dc;color:white;border:1px solid #ffffff2b;border-radius:5px;padding:4px 7px;font-size:10px}.project-info{padding:17px 18px 19px;display:flex;justify-content:space-between;gap:8px;align-items:center}.project-info h3{font-size:13px;font-weight:700;margin:0 0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-info p{font-size:11px;color:var(--ink-faint);margin:0}.more-wrap{position:relative}.project-empty{grid-column:1/-1;border:1px dashed var(--line2);border-radius:17px;padding:80px 25px;text-align:center;color:var(--ink-muted)}.project-empty h3{color:var(--ink);font-size:17px;margin:15px 0 6px}.project-empty p{font-size:12px;line-height:1.8;margin:0 auto 20px;max-width:290px}.project-empty .icon{width:31px;height:31px;color:var(--accent)}
/* Studio */
.studio-main{height:calc(100vh - 80px);min-height:610px;display:grid;grid-template-columns:minmax(0,1fr) 304px;grid-template-rows:minmax(290px,1fr) 290px;overflow:hidden}.canvas-zone{min-width:0;min-height:0;display:flex;flex-direction:column;padding:19px 26px 17px;background:var(--bg)}.canvas-top{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;color:var(--ink-muted);margin-bottom:17px}.canvas-top strong{font-weight:600;color:var(--ink)}.canvas-controls{display:flex;align-items:center;gap:8px}.canvas-frame{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;overflow:hidden;border-radius:15px;background:radial-gradient(ellipse at 40% 40%,#252330,#111216 60%);position:relative;box-shadow:inset 0 0 0 1px #ffffff0a}.video-area{height:100%;width:100%;display:flex;align-items:center;justify-content:center;position:relative}.video-wrap{height:100%;max-height:100%;max-width:100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#08080b}.video-wrap video{max-width:100%;max-height:100%;width:auto;height:auto;display:block;object-fit:contain}.caption-preview{position:absolute;left:5%;right:5%;bottom:9%;z-index:2;text-align:center;color:white;font-weight:750;font-family:'Noto Sans Sinhala','DM Sans',sans-serif;font-size:clamp(13px,2.3vw,34px);line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;pointer-events:none;text-shadow:0 2px 5px #000b,0 1px 15px #0008;transition:color .2s;max-width:90%;margin:auto}.caption-preview.is-boxed span{padding:6px 13px;border-radius:7px;background:rgba(0,0,0,.58);box-decoration-break:clone;-webkit-box-decoration-break:clone}.caption-preview.is-glow{text-shadow:0 0 17px currentColor,0 4px 12px #000c}.caption-preview.is-minimal{text-shadow:0 2px 5px #000d}.caption-preview.hidden{opacity:0}.canvas-bot{height:59px;display:flex;justify-content:space-between;align-items:center;gap:10px}.player-left,.player-right{display:flex;align-items:center;gap:10px}.player-clock{font-size:12px;color:var(--ink-muted);font-variant-numeric:tabular-nums}.player-clock strong{color:var(--ink);font-weight:700}.player-divider{width:1px;height:20px;background:var(--line);margin:0 5px}.tiny-label{font-size:11px;color:var(--ink-faint);font-weight:600}
.inspector{grid-column:2;grid-row:1/3;border-left:1px solid var(--line);background:var(--panel);display:flex;flex-direction:column;overflow:auto}.inspector-head{padding:22px 22px 17px;border-bottom:1px solid var(--line)}.inspector-head h3{margin:0;font-size:15px;font-weight:700}.inspector-head p{font-size:11px;color:var(--ink-faint);margin:5px 0 0}.inspector-body{padding:22px;display:flex;flex-direction:column;gap:25px}.field-group{display:flex;flex-direction:column;gap:11px}.field-title{font-size:11px;color:var(--ink-muted);font-weight:700;letter-spacing:.2px;display:flex;justify-content:space-between;align-items:center}.field-title small{color:var(--ink-faint)}.preset-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.preset{height:83px;border:1px solid var(--line);background:var(--panel2);border-radius:10px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--ink-muted);font-size:10px}.preset:before{content:'Aa';font:700 21px 'Noto Sans Sinhala',sans-serif;color:var(--ink)}.preset[data-preset=boxed]:before{background:#0b0b0f;padding:2px 9px;border-radius:4px}.preset[data-preset=glow]:before{text-shadow:0 0 14px #aeb4ff}.preset[data-preset=accent]:before{color:var(--accent)}.preset.active{border-color:var(--accent);background:var(--glow);color:var(--ink)}.preset:hover{border-color:var(--ink-faint)}.select,.number-input{background:var(--panel2);border:1px solid var(--line2);border-radius:10px;color:var(--ink);padding:11px 12px;width:100%;outline:none;min-width:0;font-size:12px}.select:focus,.number-input:focus{border-color:var(--accent)}.rangeline{display:flex;align-items:center;gap:12px}.rangeline input[type=range]{flex:1;min-width:0;accent-color:var(--accent);cursor:pointer}.rangeline span{font-size:11px;color:var(--ink-muted);font-variant-numeric:tabular-nums;width:45px;text-align:right}.swatches{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.swatch{width:25px;height:25px;border-radius:50%;border:2px solid var(--panel);box-shadow:0 0 0 1px var(--line2);position:relative}.swatch.selected{box-shadow:0 0 0 2px var(--accent)}.swatch-custom{padding:0;overflow:hidden}.swatch-custom input{position:absolute;inset:-10px;width:50px;height:50px;opacity:0;cursor:pointer}.pos-control{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.pos-btn{background:var(--panel2);color:var(--ink-muted);border:1px solid var(--line2);padding:10px 2px;border-radius:9px;font-size:11px}.pos-btn.active{border-color:var(--accent);background:var(--glow);color:var(--ink)}.inspect-note{border-top:1px solid var(--line);padding-top:17px;color:var(--ink-faint);font-size:11px;line-height:1.8}
.timeline-zone{grid-column:1;grid-row:2;border-top:1px solid var(--line);min-width:0;min-height:0;background:var(--panel);display:flex;flex-direction:column}.timeline-bar{height:60px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.timeline-bar h3{font-size:12px;font-weight:700;margin:0}.timeline-bar p{font-size:10px;color:var(--ink-faint);margin:4px 0 0}.timeline-actions{display:flex;gap:6px}.scrubber{height:90px;padding:15px 23px 15px;position:relative;border-bottom:1px solid var(--line)}.time-ruler{height:21px;position:relative;display:flex;justify-content:space-between;color:var(--ink-faint);font-size:10px;font-variant-numeric:tabular-nums}.caption-track{height:36px;background:var(--panel2);border:1px solid var(--line);border-radius:7px;position:relative;overflow:hidden;cursor:crosshair}.track-item{position:absolute;top:5px;bottom:5px;border:1px solid #d9ccff70;border-radius:5px;background:#b9a5ef55;color:#ece2ff;font-size:9px;display:flex;align-items:center;overflow:hidden;white-space:nowrap;padding:0 6px;cursor:grab;min-width:5px;text-overflow:ellipsis}.track-item.active{background:#cbb7ff88;border-color:#ecdcff}.playhead{position:absolute;top:-21px;bottom:0;width:2px;background:var(--ink);pointer-events:none;z-index:3}.playhead:before{content:'';position:absolute;top:0;width:9px;height:9px;transform:translateX(-3.5px);background:var(--ink);border-radius:3px}.caption-list{overflow:auto;flex:1;padding:8px 18px 12px}.caption-row{display:grid;grid-template-columns:27px 72px 72px minmax(100px,1fr) 28px;gap:9px;align-items:center;padding:8px 9px;margin:3px 0;border:1px solid transparent;border-radius:9px}.caption-row:hover{background:var(--panel2)}.caption-row.active{background:#b7a4ed10;border-color:#b7a4ed3b}.caption-row-index{font-size:10px;color:var(--ink-faint);text-align:center}.caption-time{background:var(--panel3);border:1px solid transparent;color:var(--ink-muted);border-radius:6px;padding:8px 5px;width:100%;font-size:10px;font-variant-numeric:tabular-nums;outline:none;text-align:center}.caption-time:focus{border-color:var(--accent);color:var(--ink)}.caption-text{background:transparent;color:var(--ink);border:1px solid transparent;padding:7px;font:500 12px 'Noto Sans Sinhala','DM Sans',sans-serif;border-radius:6px;outline:none;width:100%;min-width:0}.caption-text:focus{background:var(--panel3);border-color:var(--accent)}.caption-row .row-remove{opacity:0}.caption-row:hover .row-remove,.caption-row.active .row-remove{opacity:1}.caption-help{padding:25px;text-align:center;font-size:12px;color:var(--ink-muted);line-height:1.9}.caption-help .icon{display:block;margin:0 auto 10px;color:var(--accent);width:25px;height:25px}
/* Pages and misc */
.info-page{max-width:830px;margin:0 auto;padding:65px 35px 90px}.info-page h1{font:600 43px Manrope,sans-serif;letter-spacing:-2px;margin:12px 0}.info-page p{color:var(--ink-muted);line-height:1.9;font-size:14px}.guide-step{display:flex;gap:18px;border-bottom:1px solid var(--line);padding:23px 0}.guide-step-number{background:var(--panel2);border:1px solid var(--line);width:35px;height:35px;border-radius:11px;display:grid;place-items:center;font-size:12px;font-weight:750;flex-shrink:0}.guide-step h3{margin:0 0 5px;font-size:16px}.guide-step p{margin:0;font-size:13px}.setting-card{border:1px solid var(--line);border-radius:15px;background:var(--panel);padding:23px;margin-top:17px}.setting-card h3{margin:0 0 10px;font-size:16px}.setting-card p{margin:0 0 13px}.setting-detail{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-top:1px solid var(--line);font-size:12px;color:var(--ink-muted)}.setting-detail b{color:var(--ink);font-weight:600}.drop-overlay{position:fixed;inset:0;z-index:200;background:#15131bdc;display:flex;align-items:center;justify-content:center;pointer-events:none}.drop-overlay .drop-panel{border:2px dashed #c9b6ed;border-radius:24px;background:#292335;max-width:620px;width:80%;padding:65px;text-align:center;color:#fff}.drop-panel h2{font:650 27px Manrope;margin:10px 0}.drop-panel p{color:#d3c5e1;font-size:13px}.toast-region{position:fixed;right:22px;bottom:24px;z-index:1000;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast{background:#272430;color:#fff;box-shadow:0 15px 45px #0006;border:1px solid #655a77;border-radius:12px;padding:13px 16px;max-width:370px;display:flex;gap:11px;align-items:start;pointer-events:auto;font-size:12px;line-height:1.5;animation:toastIn .25s ease}.toast.error{border-color:#af5454}.toast .icon{color:#d3c4ff}.toast.error .icon{color:#ff9696}@keyframes toastIn{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal-backdrop{position:fixed;inset:0;background:#0009;backdrop-filter:blur(9px);z-index:500;display:grid;place-items:center;padding:20px}.modal{border:1px solid var(--line2);background:var(--panel);box-shadow:var(--shadow);border-radius:20px;max-width:490px;width:100%;padding:27px}.modal-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-top h2{font:650 20px Manrope,sans-serif;letter-spacing:-.6px;margin:0}.modal-desc{font-size:13px;line-height:1.85;color:var(--ink-muted);margin:0 0 20px}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:25px}.input-label{font-size:11px;color:var(--ink-muted);display:block;margin:15px 0 8px;font-weight:700}.progressbar{height:6px;background:var(--panel3);border-radius:30px;overflow:hidden}.progressbar div{height:100%;border-radius:30px;background:var(--accent);transition:width .25s}.progress-info{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-muted);margin:10px 0 16px}.warning-note{font-size:11px;line-height:1.8;color:var(--ink-muted);border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--panel2)}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-box{max-width:420px;width:100%;padding:38px;border:1px solid var(--line);border-radius:21px;background:var(--panel)}.login-box h1{font:650 28px Manrope;margin:29px 0 13px}.login-box p{font-size:13px;color:var(--ink-muted);line-height:1.8;margin-bottom:30px}.login-box .btn{width:100%;margin-top:16px}.upload-hidden{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.skeleton{background:linear-gradient(90deg,var(--panel2),var(--panel3),var(--panel2));background-size:200% 100%;animation:skeleton 1.4s linear infinite}@keyframes skeleton{to{background-position:-200% 0}}
@media(max-width:1200px){.studio-main{grid-template-columns:minmax(0,1fr) 265px}.inspector-body{padding:17px}.inspector-head{padding:19px 17px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro{gap:15px;padding-inline:35px}.intro h1{font-size:65px}.landing-nav,.features-section,.footer{padding-inline:35px}}
@media(max-width:960px){.intro{grid-template-columns:1fr;padding:80px 33px 70px;gap:40px}.intro h1{max-width:660px}.hero-art{height:430px;width:90%;margin:auto}.landing-nav-links{display:none}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-card.feature-wide{grid-column:span 2}.studio-main{grid-template-columns:minmax(0,1fr) 235px;grid-template-rows:minmax(300px,1fr) 300px}.canvas-zone{padding:15px}.app-topbar{padding:0 18px}.top-state{display:none}.caption-row{grid-template-columns:22px 61px 61px minmax(80px,1fr) 28px;gap:5px}.caption-row .row-remove{opacity:1}}
@media(max-width:720px){.landing-nav{height:72px;padding:0 22px}.landing-nav-right .btn{min-height:36px;padding:9px 11px}.intro{padding:76px 22px 55px;min-height:0}.intro h1{font-size:clamp(48px,11vw,72px);letter-spacing:-3.8px}.intro h1 em{letter-spacing:-2px}.intro p{font-size:14px}.hero-art{height:355px;width:100%}.hero-stage{left:7px;right:12px;transform:none}.hero-stage:hover{transform:none}.stage-caption{font-size:18px}.floating-tool{right:0}.features-section{padding:64px 22px}.section-head{display:block;margin-bottom:28px}.section-head p{margin-top:19px}.feature-grid{grid-template-columns:1fr}.feature-card.feature-wide{grid-column:span 1}.feature-card{min-height:185px;padding:24px}.feature-card .icon{margin-bottom:27px}.footer{padding:23px 22px;flex-direction:column;align-items:start;gap:12px}.app-shell{grid-template-columns:1fr}.rail{position:fixed;top:auto;bottom:0;left:0;right:0;z-index:50;width:100%;height:66px;flex-direction:row;border-top:1px solid var(--line);border-right:none;justify-content:space-around;padding:9px 15px}.rail .brand-mark{display:none}.rail-button{height:44px;width:48px}.rail-button.active:before{top:auto;bottom:-9px;left:14px;width:20px;height:3px}.rail-spacer{flex:.1}.rail-bottom{flex-direction:row}.workspace{padding-bottom:66px}.app-topbar{height:66px}.app-topbar .top-actions .btn span.action-text{display:none}.dashboard{padding:33px 19px 50px}.dashboard-head h1{font-size:35px}.quick-new{padding:25px;flex-direction:column;align-items:start;gap:20px}.quick-new-actions{width:100%}.quick-new-actions .btn{flex:1}.project-grid{grid-template-columns:1fr 1fr;gap:10px}.project-preview{height:120px}.project-info{padding:13px}.subheading{align-items:start}.search-input{min-width:0;width:150px}.studio-main{height:auto;min-height:0;display:flex;flex-direction:column;overflow:visible}.canvas-zone{height:min(58vh,480px);min-height:300px;flex:none;padding:13px}.canvas-frame{min-height:0}.canvas-bot{height:50px}.inspector{order:3;border-left:none;border-top:1px solid var(--line);max-height:none;overflow:visible}.inspector-head{padding:19px}.inspector-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;padding:18px}.field-group{min-width:0}.timeline-zone{order:2;height:340px;flex:none}.timeline-bar{padding:0 12px}.caption-list{padding:6px}.caption-row{grid-template-columns:18px 57px 57px minmax(65px,1fr) 20px;gap:3px;padding:5px 3px}.caption-time{font-size:9px;padding:7px 2px}.caption-text{font-size:11px;padding:6px 3px}.scrubber{padding-inline:12px}.info-page{padding:34px 20px 65px}.info-page h1{font-size:34px}.top-actions{gap:4px}.btn-icon{width:36px;height:36px}}
@media(max-width:420px){.project-grid{grid-template-columns:1fr}.project-preview{height:160px}.inspector-body{grid-template-columns:1fr}.canvas-zone{height:350px}.intro-actions .btn{flex:1}.stage-view{bottom:104px}.hero-art{height:315px}.hero-stage{bottom:8px}.quick-new-actions{flex-direction:column}.quick-new-actions .btn{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* Compact mobile editing controls: keep timeline tools readable, not squeezed. */
@media(max-width:720px){
 .timeline-zone{height:365px}
 .timeline-bar{height:94px;min-height:94px;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:9px;padding:9px 12px}
 .timeline-bar h3{font-size:12px}
 .timeline-bar p{font-size:10px;margin:2px 0 0;white-space:nowrap}
 .timeline-actions{display:flex;width:100%;justify-content:space-between;gap:4px}
 .timeline-actions .btn{padding:6px 7px;min-height:32px;border-radius:8px;gap:5px;font-size:11px}
 .timeline-actions .btn .icon{height:14px;width:14px}
 .canvas-bot .btn-icon{width:29px;height:34px}
 .canvas-bot .player-left,.canvas-bot .player-right{gap:3px}
 .canvas-bot .player-clock{white-space:nowrap;font-size:10px;letter-spacing:-.2px}
 .canvas-bot .player-divider{margin:0 2px}
 .canvas-bot #playback-speed{width:58px!important;font-size:10px}
 .canvas-bot{gap:2px}
}
@media(max-width:390px){.timeline-actions .btn{padding-inline:5px}.timeline-actions{gap:3px}.player-right .btn-icon{width:25px}}