/* Version 2 builds on FramePop's existing palette and visual language. */
#playheadTime{width:68px;padding:7px 5px;background:#211d2b;color:#eee;border:1px solid #51445f;border-radius:6px;font:inherit}
.notice{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;margin:0 0 18px;background:#292338;border:1px solid #68577e;border-radius:12px;color:#e3d8f2;line-height:1.5}.notice>span{flex:1;min-width:180px}.notice button{white-space:nowrap}.mobile-nav{display:none}.asset-panel,.inspector{min-height:0}.asset-panel{max-height:calc(100vh - 120px);overflow:auto;scrollbar-width:thin}.inspector{max-height:calc(100vh - 120px);overflow:auto;scrollbar-width:thin}.brand-kit{border-top:1px solid var(--line);padding:16px}.brand-content{padding-top:16px}.brand-content>button,.brand-content>.two-fields{margin-bottom:12px}#brandLogoPreview{max-height:90px;max-width:100%;margin:12px auto;object-fit:contain}summary{cursor:pointer;font-size:12px;color:#d5c2ed;padding:6px 0}details[open]>summary{margin-bottom:12px}hr{border:0;border-top:1px solid var(--line);margin:22px 0}h3{font-size:12px;color:#d8c7ef;font-weight:600}#allEmoji{max-height:360px;overflow:auto;align-content:start;scrollbar-width:thin;padding:3px}#allEmoji button{min-height:40px}#emojiCount{margin-top:0}.timeline-tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:13px}.timeline-tools button,.timeline-tools select{font-size:10px;padding:7px 9px}.timeline-tools label{font-size:10px;color:#c6bad8}.timeline-tools select{background:#211d2b;color:#eee;border:1px solid #51445f;border-radius:6px}#selectionCount{font-size:10px;color:var(--lime)}.timeline-help{font-size:10px;margin:10px 0}.timeline-scroll{max-height:300px;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}#timelineInner{min-width:100%;position:relative}.timeline-rows{max-height:none;overflow:visible}.timeline-row{grid-template-columns:100px minmax(0,1fr)}.timeline-row>button,.video-track-title{position:sticky;left:0;background:var(--panel);z-index:2}.ruler{margin-left:105px;position:relative;cursor:crosshair;min-height:20px}.track{height:36px;touch-action:none}.track::after,.video-track::after{content:'';position:absolute;left:var(--playhead);top:0;bottom:0;width:1px;background:var(--lime);pointer-events:none;z-index:1}.clip{pointer-events:auto;cursor:grab;touch-action:none;overflow:visible}.clip-handle{position:absolute;top:-2px;bottom:-2px;width:12px;cursor:ew-resize;z-index:1}.clip-handle.start{left:-3px;border-left:3px solid #e7d3ff;border-radius:4px}.clip-handle.end{right:-3px;border-right:3px solid #e7d3ff;border-radius:4px}.key-dot{position:absolute;top:45%;width:7px;height:7px;background:#d4f679;transform:translate(-50%,-50%) rotate(45deg);pointer-events:none}.video-track{position:relative;height:44px;margin-bottom:8px;background:#21262c;border-radius:5px}.video-track-title{color:#a4cde0;font-size:11px;padding:10px 3px}.video-segment{position:absolute;top:0;height:44px;display:flex;align-items:center;gap:5px;padding:2px 5px;border-radius:5px;background:#284553;border:1px solid #5e9bb5;overflow:hidden;min-width:4px;color:#d4ecf8;font-size:10px}.video-segment.active{border:2px solid #d4f679}.video-segment img{height:34px;width:45px;object-fit:cover;pointer-events:none}.video-segment span{pointer-events:none;white-space:nowrap}.keyframes{margin-bottom:16px}.keyframes .helper{font-size:10px}#keyframeList{max-height:150px;overflow:auto;margin:8px 0}#keyframeList>div{display:flex;gap:8px;margin-bottom:5px}#keyframeList>div>button:first-child{flex:1;font-size:11px}.inspector .two-fields>.check{margin:9px 0 16px}#centerLayers{font-size:11px;margin-bottom:10px}#clipEditor{margin-top:12px;border-top:1px solid var(--line)}#clipEditor>.two-fields{margin-top:15px}#exportMessage{font-size:12px;margin:16px 0 0}#sourceLabel{max-width:160px}.top-actions{flex-wrap:wrap}.local-badge{max-width:170px;font-size:10px}.timeline-scroll .ruler{color:#b1a6c1}.timeline-row>button{color:#d0c6df}.helper{color:#b3a8c1}#toast{z-index:100}#preview{touch-action:none}.stage-column{min-width:0}.timeline-tools button:disabled{opacity:.4}.field input:disabled{opacity:.4}.timeline-row.active>button{color:var(--lime)}
@media(max-width:1100px){.workspace{grid-template-columns:210px minmax(300px,1fr) 220px}.topbar{gap:12px}.top-actions{gap:6px}.top-actions button{font-size:11px}.timeline-tools{gap:6px}.timeline-tools button{font-size:10px}}
@media(max-width:850px){.workspace{grid-template-columns:210px minmax(0,1fr)}.inspector{max-height:none}.inspector #properties{display:block;columns:2;column-gap:24px}.inspector #properties>*{break-inside:avoid}.selected-title,.layer-actions{column-span:all}.asset-panel{max-height:none}.local-badge{display:inline-block}.top-actions{justify-content:flex-end}.timeline-scroll{max-height:260px}}
@media(max-width:600px){.mobile-nav{display:flex;gap:8px;position:sticky;top:0;z-index:5;background:#101016f5;padding:9px 0;margin-bottom:10px}.mobile-nav button{flex:1;font-size:12px;min-height:42px}.workspace{display:flex}.stage{height:310px}.asset-panel,.inspector{max-height:none;scroll-margin-top:65px}.stage-column{scroll-margin-top:65px}.inspector #properties{display:block;columns:1}.asset-tabs button{min-height:44px}.field{font-size:12px}.field input:not([type=range]):not([type=color]),.field select,.field textarea{min-height:44px;font-size:16px}.field input[type=range]{height:24px}.topbar{padding:12px;gap:12px}.top-actions{width:100%;justify-content:flex-start;gap:6px}.top-actions .quiet{min-height:40px;padding:8px}.top-actions .primary{min-height:40px;padding:10px}.top-actions .local-badge{display:block;width:100%;max-width:none;margin:0}.timeline-tools{gap:7px}.timeline-tools button,.timeline-tools select{min-height:40px;font-size:11px}.track{height:44px}.clip-handle{width:20px}.timeline-row{grid-template-columns:85px minmax(0,1fr)}.ruler{margin-left:90px}.timeline-row>button{min-height:42px}.timeline-scroll{max-height:300px;touch-action:pan-x pan-y}.timeline-title{flex-wrap:wrap}.trim-controls input{height:38px;width:62px;font-size:14px}#allEmoji{grid-template-columns:repeat(6,1fr);max-height:320px}#allEmoji button{min-height:46px}.emoji-grid{grid-template-columns:repeat(6,1fr)}.check{font-size:12px;min-height:32px}.check input{width:18px;height:18px}.brand-kit button,.layer-actions button,#addKeyframe,#centerLayers{min-height:44px;font-size:12px}.notice{padding:12px}.notice>span{min-width:100%}.no-selection{display:block;text-align:center}#clipEditor .two-fields{grid-template-columns:1fr 1fr}.transport{gap:8px}#play,#rewind{min-height:42px;min-width:42px}}
