@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#0b0d11;--panel:#11141a;--panel2:#171b23;--line:#272d38;--muted:#8d96a7;--text:#f4f5f7;--accent:#e1ff4f;--accent2:#b5d32f}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,Arial,sans-serif}button,input,select,textarea{font:inherit}button{border:0;color:inherit;cursor:pointer}.shell{min-height:100vh}.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 28px;gap:30px;background:#0d1015}.brand{display:flex;align-items:center;gap:12px;min-width:230px}.brand-mark{background:var(--accent);color:#0b0d11;font-weight:800;padding:8px 7px;border-radius:4px;font-size:12px}.brand strong{display:block;font-size:14px}.brand small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.project-title{background:none;border:0;color:var(--muted);outline:0;font-size:14px;flex:1;max-width:440px}.project-title:focus{color:var(--text)}.top-actions{margin-left:auto;display:flex;gap:10px}.top-actions button,.upload-button{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:10px 14px;font-size:12px}.top-actions .primary{background:var(--accent);color:#10130b;border-color:var(--accent);font-weight:800}.workspace{display:grid;grid-template-columns:230px minmax(450px,1fr) 300px;height:calc(100vh - 76px)}.panel{background:var(--panel);padding:22px 16px;overflow:auto}.scenes-panel{border-right:1px solid var(--line)}.properties{border-left:1px solid var(--line);padding:22px 20px}.panel-heading{display:flex;justify-content:space-between;align-items:center;text-transform:uppercase;letter-spacing:.1em;font:500 11px 'DM Mono',monospace;margin-bottom:20px;color:#d9dde6}.panel-heading em{font-style:normal;color:var(--muted);margin-left:5px}.icon-button{background:var(--accent);color:#12150e;width:23px;height:23px;border-radius:4px;font-weight:800;font-size:18px;line-height:18px}.scene-list{display:flex;flex-direction:column;gap:4px}.scene-item{background:transparent;text-align:left;display:flex;gap:11px;align-items:center;padding:11px 8px;border-radius:5px}.scene-item:hover{background:var(--panel2)}.scene-item.active{background:#20262e;box-shadow:inset 3px 0 var(--accent)}.scene-number{font:11px 'DM Mono';color:var(--muted)}.scene-item strong,.scene-item small{display:block}.scene-item strong{font-size:12px;font-weight:600}.scene-item small{font-size:10px;color:var(--muted);margin-top:4px}.scene-help{color:#636c7b;font-size:10px;line-height:1.6;border-top:1px solid var(--line);margin-top:30px;padding:15px 8px}.preview-area{display:flex;flex-direction:column;min-width:0}.preview-toolbar,.timeline-head{height:48px;display:flex;justify-content:space-between;align-items:center;padding:0 25px;color:var(--muted);font:10px 'DM Mono';letter-spacing:.08em}.mini-button{background:transparent;border:1px solid var(--line);border-radius:3px;color:var(--text);padding:5px 8px;margin-left:8px;font:10px 'DM Mono'}.stage-wrap{display:flex;align-items:center;justify-content:center;flex:1;padding:25px;background:radial-gradient(circle at 50% 35%,#202631 0%,#0f1217 60%)}.stage{width:min(90%,850px);aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:3px;box-shadow:0 25px 60px #0008}.scene-content{position:absolute;inset:0;overflow:hidden}.scene-content>img,.scene-content>video{width:100%;height:100%;object-fit:cover;opacity:.78}.scene-content:has(>img)::after,.scene-content:has(>video)::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#080a0dcc,#080a0d22 70%,#080a0d66)}.scene-copy{position:absolute;z-index:2;max-width:70%;padding:7%;text-align:left}.scene-copy.center{inset:0;margin:auto;height:max-content;text-align:center}.scene-copy.top-left{top:0;left:0}.scene-copy.top-center{top:0;left:15%;right:15%;text-align:center}.scene-copy.top-right{top:0;right:0}.scene-copy.center-left{top:35%;left:0}.scene-copy.center-right{top:35%;right:0}.scene-copy.bottom-left{bottom:0;left:0}.scene-copy.bottom-center{bottom:0;left:15%;right:15%;text-align:center}.scene-copy.bottom-right{bottom:0;right:0}.eyebrow{font:10px 'DM Mono';color:var(--accent);letter-spacing:.14em;text-transform:uppercase}.scene-copy h1{font-size:clamp(25px,4vw,58px);line-height:1.05;margin:14px 0 0;letter-spacing:-.05em}.scene-copy p{color:#c6cbd3;font-size:13px}.manifesto .scene-copy h1{font-size:clamp(32px,6vw,85px);text-transform:uppercase}.audio-badge{position:absolute;inset:0;display:grid;place-items:center;color:var(--accent);font:14px 'DM Mono';z-index:1}.diagram{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:28px;color:#dfe4ec;z-index:1}.diagram i,.diagram b{font-style:normal;padding:20px;border:1px solid #667080;border-radius:50px;font-size:11px}.diagram b{border-color:var(--accent);color:var(--accent)}.diagram span{color:var(--accent)}.timeline{height:100px;border-top:1px solid var(--line);padding:0 25px}.timeline-track{height:36px;display:flex;gap:3px}.timeline-segment{min-width:70px;background:#252c36;border-radius:3px;text-align:left;padding:6px 9px;overflow:hidden}.timeline-segment.active{background:#39452b;outline:1px solid var(--accent)}.timeline-segment span,.timeline-segment small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-segment span{font-size:10px}.timeline-segment small{font:9px 'DM Mono';color:var(--muted);margin-top:3px}.properties label{display:block;color:var(--muted);font:10px 'DM Mono';margin:14px 0}.properties input,.properties select,.properties textarea{display:block;width:100%;background:#0c0f14;border:1px solid var(--line);color:var(--text);border-radius:4px;padding:9px;margin-top:6px;outline:0;font-size:12px}.properties input:focus,.properties select:focus,.properties textarea:focus{border-color:var(--accent2)}.properties textarea{height:75px;resize:vertical}.properties input[type=color]{height:37px;padding:3px}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.property-section{border-top:1px solid var(--line);margin-top:18px;padding-top:5px}.property-section h3{font-size:11px;font-weight:600;color:#d9dde6;margin:13px 0}.hint{color:var(--muted);font-size:10px;line-height:1.5}.hint code{color:var(--accent)}.upload-button{width:100%;color:var(--accent);margin-top:5px}.media-file{font-size:10px;color:var(--accent);margin-top:12px;overflow:hidden}.media-file small{display:block;color:var(--muted);margin-top:4px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.danger-actions{display:flex;justify-content:space-between;margin-top:25px}.danger-actions button{background:none;color:var(--muted);font-size:10px}.danger-actions button:last-child{color:#df7777}.status-dot{color:var(--accent);font-size:10px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);opacity:0;background:var(--accent);color:#10130b;padding:10px 16px;border-radius:4px;font-size:12px;font-weight:700;transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}.player-shell{min-height:100vh;background:#050608;display:flex;flex-direction:column}.player-stage{flex:1;position:relative;min-height:0}.player-content .scene-copy h1{font-size:clamp(38px,7vw,110px)}.player-controls{height:60px;border-top:1px solid #222832;display:flex;align-items:center;justify-content:space-between;padding:0 24px;color:#7f899a;font:11px 'DM Mono'}.player-controls button{background:var(--accent);color:#10130b;padding:9px 14px;border-radius:3px;font-weight:700;font-size:11px}@media(max-width:900px){.workspace{grid-template-columns:180px 1fr}.properties{display:none}}@media(max-width:650px){.workspace{display:block;height:auto}.scenes-panel{height:auto;border:0}.scene-list{flex-direction:row;overflow:auto}.scene-item{min-width:140px}.stage-wrap{min-height:400px}.topbar{padding:0 14px}.brand{min-width:auto}.brand small,.project-title{display:none}}
.player-title{min-width:0;max-width:30%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-controls{display:flex;align-items:center;gap:8px}.media-button{width:38px;height:34px;background:#171b23;border:1px solid #303744;border-radius:4px;color:#dfe4ec;font-size:15px;line-height:1}.media-button:hover{background:#242b35;border-color:#596477}.media-button.play-button{background:var(--accent);border-color:var(--accent);color:#10130b;font-size:16px;font-weight:800}.media-button.play-button.is-playing{background:#c8e43f}.player-counter{min-width:76px;text-align:right}@media(max-width:650px){.player-controls{padding:0 12px;gap:8px}.player-title{display:none}.media-controls{gap:4px}.media-button{width:32px;height:30px}.player-counter{font-size:10px;min-width:62px}}
.media-library{border-top:1px solid var(--line);margin-top:18px;padding-top:5px}.media-library h3{font-size:11px;font-weight:600;color:#d9dde6;margin:13px 0}.media-search{margin-top:4px!important}.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px;max-height:250px;overflow:auto;padding-right:2px}.media-card{min-width:0;background:#0c0f14;border:1px solid var(--line);border-radius:4px;padding:4px;text-align:left;overflow:hidden}.media-card:hover,.media-card.selected{border-color:var(--accent)}.media-card img,.media-card video{display:block;width:100%;height:55px;object-fit:cover;border-radius:2px;background:#171b23}.media-card>span:last-child{display:block;color:#bdc4cf;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:6px 2px 2px}.media-icon{height:55px;display:grid;place-items:center;color:var(--accent);font-size:22px;background:#171b23;border-radius:2px}
.comparison-scene{padding:3.5%;background:#0d1015}.comparison-grid{height:100%;display:grid;gap:10px}.comparison-grid.comparison-count-2,.comparison-grid.comparison-count-3,.comparison-grid.comparison-count-5,.comparison-grid.comparison-count-7{grid-template-columns:repeat(var(--comparison-columns, 2),minmax(0,1fr))}.comparison-grid.comparison-count-2{--comparison-columns:2}.comparison-grid.comparison-count-3{--comparison-columns:3}.comparison-grid.comparison-count-5{--comparison-columns:5}.comparison-grid.comparison-count-7{--comparison-columns:7}.comparison-grid.comparison-count-4{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.comparison-grid.comparison-count-6{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.comparison-grid.comparison-count-8{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.comparison-card{position:relative;min-width:0;min-height:0;overflow:hidden;background:#171b23;border:1px solid #343c49;border-radius:3px}.comparison-card img,.comparison-card video{display:block;width:100%;height:100%;object-fit:cover}.comparison-card>span{position:absolute;left:0;right:0;bottom:0;padding:9px 10px;background:linear-gradient(transparent,#050608dd);color:#fff;font:600 11px Manrope,sans-serif}.comparison-empty{height:100%;display:grid;place-items:center;color:#7f899a;font:10px 'DM Mono';text-align:center}.comparison-controls output{color:var(--accent);float:right}.range-hint{display:block;color:var(--muted);font:10px Manrope,sans-serif;margin-top:7px}.comparison-range{accent-color:var(--accent);padding:0!important}.comparison-slots{display:grid;gap:7px;margin-top:10px}.comparison-slot{display:flex;align-items:center;gap:8px;text-align:left;background:#0c0f14;border:1px solid var(--line);border-radius:4px;padding:7px;color:var(--muted);font-size:10px}.comparison-slot.active{border-color:var(--accent);color:var(--accent)}.comparison-slot span{display:grid;place-items:center;width:20px;height:20px;border-radius:3px;background:#252c36;color:#dfe4ec}.comparison-slot strong{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.comparison-label{margin:0!important}.comparison-label input{margin-top:3px!important}
.remove-media-button{display:block;width:100%;margin-top:8px;background:transparent;border:1px solid #713e46;color:#e58b93;border-radius:4px;padding:8px;font-size:10px}.remove-media-button:hover:not(:disabled){background:#3a2027;border-color:#e58b93}.remove-media-button:disabled{opacity:.45;cursor:not-allowed}
