:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#e7edfc;background:#0a101c;font-synthesis:none;--bg:#0a101c;--panel:#101929;--panel2:#151f32;--border:#29364e;--muted:#8b9ab0;--accent:#61b9ed;--purple:#a68cfe;--lime:#3ed6b4}
*{box-sizing:border-box}html,body{margin:0;height:100%;min-height:640px}button,input,select{font:inherit}button{cursor:pointer;transition:background .14s,border .14s,transform .14s}button:disabled{opacity:.4;cursor:not-allowed}button:hover:not(:disabled){filter:brightness(1.15)}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}h2,h3,p{margin:0}h2{font-size:16px;font-weight:650;letter-spacing:-.025em}.muted{color:var(--muted)}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.15em;color:#8294af}#app{height:100vh;min-height:710px;display:flex;flex-direction:column;overflow:hidden}.app-header{height:67px;display:flex;align-items:center;gap:28px;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--border);background:#0d1422;flex-shrink:0}.brand{display:flex;align-items:center;gap:9px;min-width:195px}.brand-mark{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,#736bee,#3abbcf);font-size:30px;color:white;line-height:1}.brand>div{display:flex;flex-direction:column;line-height:1.02}.brand strong{font-size:18px;font-weight:800;letter-spacing:-.04em}.brand small{font-size:9px;font-weight:800;letter-spacing:.35em;color:var(--accent);margin-top:4px}.version{font-size:10px;color:#5c6d89;margin:8px 0 0 3px}.project-title{display:flex;align-items:center;gap:10px;flex:1;min-width:125px;max-width:340px}.project-title>.muted{font-size:10px;font-weight:700;letter-spacing:.1em}.project-title input{background:none;color:#e5eefe;border:1px solid transparent;border-radius:6px;width:100%;min-width:0;padding:6px;font-weight:620;overflow:hidden;text-overflow:ellipsis}.project-title input:focus{border-color:var(--border);background:#172439}.save-dot,.footer-dot{width:7px;height:7px;border-radius:100%;background:#3ed6b4;flex:0 0 auto}.save-dot.warning{background:#ffa755}.header-actions{display:flex;align-items:center;gap:8px;white-space:nowrap}button{background:transparent;color:inherit;border:1px solid transparent;border-radius:8px;padding:9px 13px;font-size:12px;font-weight:700}.quiet{color:#aab8cd}.secondary{background:#18253b;border-color:#354964;color:#d5e4fb}.primary{background:linear-gradient(120deg,#5276eb,#6c65e4);border-color:#837cf6;color:white;box-shadow:0 5px 16px #3b45b422}.topbar{min-height:56px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:8px 19px;border-bottom:1px solid var(--border);flex-wrap:wrap;background:#0c1422}.tools-left,.tools-right{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.toolbar-kicker{font-size:10px;font-weight:800;letter-spacing:.1em;color:#687b99;margin:0 12px 0 3px}.tool{font-size:11px;padding:7px 9px;border:1px solid #283851;color:#a8bbd7;border-radius:7px}.tool.active{color:#84d4ff;background:#1c3a50;border-color:#315f83}.line{height:21px;width:1px;background:#29374d;margin:0 6px}.iconbtn{font-size:17px;padding:4px 9px;border:1px solid var(--border);border-radius:7px;color:#a8bbd7;min-width:32px}.checkboxline{font-size:11px;color:#a9b9d0;display:flex;gap:5px;align-items:center;margin-right:9px;white-space:nowrap}.checkboxline input{accent-color:#6a8cf5}.zoom-label{font-size:11px;color:#b7c8df;min-width:42px;text-align:center}.workarea{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,.85fr);gap:0;min-height:0;flex:1}.editor-column{display:flex;flex-direction:column;min-width:0;padding:16px 18px;gap:13px;border-right:1px solid var(--border);overflow:hidden}.preview-column{min-width:0;display:flex;flex-direction:column;padding:16px 18px;gap:12px;overflow:hidden}.section-line{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:39px}.section-line h2{margin-top:5px}.section-right{display:flex;align-items:center;gap:8px}.section-right span{font-size:12px;white-space:nowrap;color:#bdcbe0}.mini{font-size:11px;border:1px solid var(--border);padding:7px 9px;color:#b1c5de}.editing-pair{display:grid;grid-template-columns:1fr 1fr;gap:13px;min-height:0}.photo-card{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}.photo-topline{display:flex;align-items:center;gap:10px;padding:11px 12px}.photo-tag{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;font-size:12px;font-weight:800}.source{background:#1e3d55;color:#77d2fa}.target{background:#382c51;color:#bea6ff}.photo-topline>div{display:flex;flex-direction:column;min-width:0;gap:3px}.photo-topline strong{font-size:12px}.photo-topline small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;color:var(--muted);font-size:10px}.pill{margin-left:auto;font-size:10px;color:#92a6c4;border:1px solid #263e57;border-radius:7px;padding:4px 7px;white-space:nowrap}.editor-stage{width:100%;aspect-ratio:16/9;background:#0a111e;position:relative;overflow:hidden;user-select:none;touch-action:none;cursor:crosshair}.photo-content{position:absolute;inset:0;transform-origin:center center;will-change:transform;display:none}.photo-content img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.marker-layer,.mesh-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.mesh-layer{overflow:visible;display:none}.pin{position:absolute;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);border:2px solid white;box-shadow:0 2px 7px #000a,inset 0 0 0 1px #0005;border-radius:50%;font-size:10px;font-weight:900;color:#fff;text-shadow:0 1px 2px #0009;cursor:grab;pointer-events:auto;touch-action:none;z-index:5;padding:0}.pin.selected{width:31px;height:31px;border:3px solid #fff;outline:2px solid #73dfff;z-index:8}.pin:active{cursor:grabbing}.empty-photo{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#91a5bf;font-size:11px;text-align:center;padding:14px;background:radial-gradient(circle at 50% 10%,#1c2e4b,#0c1525 73%)}.empty-photo strong{color:#d4e2f7;font-size:13px}.empty-icon{font-size:38px;color:#557ca8}.empty-photo .mini{font-size:10px;margin-top:5px}.photo-footer{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 12px;font-size:10px;color:#8196b5}.point-count{color:#80c8f1;font-weight:700}.editor-bottom{background:var(--panel);border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;overflow:hidden;flex:1;min-height:100px}.landmark-header{display:flex;justify-content:space-between;align-items:center;padding:12px 13px 8px}.landmark-header>div{display:flex;align-items:center;gap:12px}.landmark-header strong{font-size:12px}.mini-muted{font-size:10px}.marker-scroller{overflow:auto;min-height:0;flex:1;padding:4px 10px 10px;align-content:start;display:flex;gap:6px;flex-wrap:wrap}.empty-list{color:#748ba8;font-size:12px;padding:18px;width:100%;text-align:center}.marker-chip{padding:6px 9px 6px 6px;background:#1b2940;border:1px solid #2d405e;border-radius:7px;display:flex;align-items:center;gap:5px;font-size:11px;color:#c5d3e8}.marker-chip.selected{background:#233e55;border-color:#64b7e0}.marker-swatch{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;font-size:10px;color:white;font-weight:800;border:1px solid #fff6}.editor-tip{display:flex;gap:9px;align-items:flex-start;border-top:1px solid var(--border);background:#121f30;padding:10px 13px;font-size:10px;color:#92abc4;line-height:1.55}.editor-tip strong{color:#c6def0}.tip-badge{font-size:9px;font-weight:850;letter-spacing:.08em;color:#65d6c3;background:#1c423f;padding:3px 6px;border-radius:4px}.preview-live{display:flex;align-items:center;gap:7px;white-space:nowrap;color:#81b5cd;font-size:10px}.preview-live span{width:6px;height:6px;border-radius:50%;background:#46d5c8;box-shadow:0 0 0 3px #47d5bf24}.preview-stage{position:relative;width:100%;aspect-ratio:16/9;background:#080d17;overflow:hidden;border:1px solid var(--border);border-radius:11px}.preview-stage canvas{width:100%;height:100%;object-fit:contain;display:block}.preview-empty{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:10px;background:#0c1422;padding:25px;color:#a7bdd9}.preview-empty strong{font-size:13px;color:#dae8f6}.preview-empty p{font-size:11px;max-width:220px;line-height:1.5}.large-glyph{font-size:39px;color:#5872b4}.transport{display:flex;align-items:center;gap:9px}.big{font-size:14px}.play-button{width:38px;height:38px;background:#4a6ddb;border-radius:10px;color:white;font-size:16px;padding:5px}.time-display{display:flex;gap:5px;margin-left:auto;font-variant-numeric:tabular-nums;font-size:11px;font-weight:650}.scrubber{appearance:none;background:linear-gradient(to right,#7da5ed 0%,#7da5ed var(--value,0%),#26374e var(--value,0%));border-radius:6px;height:5px;width:100%;cursor:pointer;margin:0 0 3px;accent-color:#7da5ed}.scrubber::-webkit-slider-thumb{appearance:none;width:11px;height:11px;background:#bddbff;border-radius:50%;box-shadow:0 0 0 3px #2d4d7f}.settings-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:3px}.current-edit{font-size:10px;color:#bdb4f1;background:#36284d;border-radius:5px;padding:5px 8px}.inspector-scroll{overflow:auto;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:#2f405d transparent}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 1px;border-bottom:1px solid #253249}.setting-row>div:first-child{min-width:0}.setting-row label{font-size:12px;font-weight:700;display:block}.setting-row small{font-size:10px;display:block;color:#859bb9;margin-top:5px;line-height:1.3}.setting-row input[type=number],.setting-row select{background:#18243a;color:#d8e6f8;border:1px solid #344661;border-radius:7px;padding:7px 8px;font-size:11px;max-width:148px}.setting-row input[type=number]{width:57px;text-align:right}.setting-row input[type=color]{width:36px;height:30px;padding:2px;background:#17243a;border:1px solid #3b4b67;border-radius:6px}.field-units{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px}.timeline-section{background:#0d1523;border-top:1px solid var(--border);flex:0 0 155px;min-height:0;display:flex;flex-direction:column}.timeline-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 20px 8px}.timeline-heading{display:flex;align-items:center;gap:12px}.timeline-heading strong{font-size:13px}.timeline-heading .muted{font-size:10px}.count-badge{font-size:10px;padding:3px 7px;background:#26334d;border-radius:12px;color:#c2d6f1}.timeline-actions{display:flex;gap:7px}.timeline-scroll{flex:1;min-height:0;display:flex;gap:0;overflow-x:auto;overflow-y:hidden;padding:1px 20px 10px;align-items:stretch;scrollbar-color:#2e496a transparent;scrollbar-width:thin}.timeline-empty{width:100%;display:grid;place-items:center;color:#7e92ae;border:1px dashed #2b3b52;border-radius:9px;font-size:11px}.timeline-photo{width:116px;min-width:116px;border:1px solid #33465e;border-radius:8px;background:#142033;padding:5px;display:flex;flex-direction:column;gap:3px;position:relative}.timeline-photo.selected{border-color:#75a0fd;background:#192f4a;box-shadow:0 0 0 1px #628df7}.timeline-photo.dragging{opacity:.4}.timeline-photo img{width:100%;height:53px;border-radius:4px;object-fit:cover;pointer-events:none}.timeline-photo span{font-size:10px;font-weight:700;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.timeline-photo small{font-size:9px;color:#7e9cb9}.timeline-photo .number-corner{position:absolute;top:8px;left:8px;background:#0c172bcf;color:#b8d7ff;padding:3px 5px;border-radius:3px;font-size:9px}.timeline-transition{width:75px;min-width:75px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:9px;color:#9b8ade;padding:0 4px;cursor:pointer}.timeline-transition:before{content:"";width:100%;height:2px;border-radius:5px;background:linear-gradient(90deg,#3fa9e9,#a182e6)}.timeline-transition.selected{background:#30264f55;border-radius:6px;color:#c2adff}.app-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;height:31px;padding:0 20px;flex-shrink:0;border-top:1px solid #1f2c40;background:#0a101c;font-size:10px;color:#738ca9}.app-footer span:first-child{display:flex;align-items:center;gap:7px}.footer-dot{width:6px;height:6px}.hidden{display:none!important}.modal-overlay{position:fixed;inset:0;background:#060b17d9;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;backdrop-filter:blur(7px)}.modal{background:#152136;border:1px solid #375070;border-radius:17px;padding:26px;width:min(100%,420px);box-shadow:0 24px 80px #0009}.modal h2{font-size:23px;margin:12px 0}.modal p{font-size:12px;line-height:1.6;color:#a2b4d0}.modal-top{display:flex;justify-content:space-between;align-items:center}.export-glyph{font-size:32px;color:#93aeff}.close-modal{font-size:23px;color:#b8c6da;padding:4px 9px}.progress-track{margin-top:25px;height:8px;background:#0d1627;border-radius:8px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#3e8cf6,#9b7bef);transition:width .12s}.progress-meta{display:flex;justify-content:space-between;margin-top:10px;font-size:11px;color:#b1c3dc}.modal-actions{display:flex;justify-content:flex-end;margin-top:22px}.toast{position:fixed;right:22px;bottom:43px;background:#1c3346;border:1px solid #477d99;border-radius:10px;padding:12px 17px;max-width:350px;color:#e0f3ff;font-size:12px;box-shadow:0 14px 38px #0007;z-index:300;opacity:0;transform:translateY(6px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1170px){.app-header{gap:10px;padding:0 12px}.header-actions{gap:4px}.header-actions button{font-size:11px;padding:8px}.project-title>.muted{display:none}.topbar{padding:6px 10px}.toolbar-kicker{display:none}.workarea{grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr)}.editor-column,.preview-column{padding:11px}.section-right .mini{font-size:10px;padding:5px}.photo-footer{font-size:9px;padding:7px}}
@media(max-width:860px){#app{height:auto;min-height:100vh;overflow:visible}.app-header{height:auto;min-height:60px;flex-wrap:wrap;padding:8px 12px}.header-actions{width:100%;justify-content:flex-start;overflow-x:auto}.brand{min-width:auto}.project-title{margin-left:auto}.topbar{min-height:0}.workarea{display:flex;flex-direction:column}.editor-column,.preview-column{overflow:visible}.editor-bottom{flex:unset;min-height:155px;max-height:250px}.preview-column{border-top:1px solid var(--border)}.preview-stage{max-width:650px}.inspector-scroll{overflow:visible;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}.timeline-section{min-height:173px}.app-footer{flex-wrap:wrap;height:auto;padding:10px}}
@media(max-width:570px){.editing-pair{grid-template-columns:1fr}.editor-stage{max-height:280px}.section-line{align-items:flex-start}.section-right{gap:3px}.section-right span{font-size:10px}.timeline-heading .muted{display:none}.inspector-scroll{grid-template-columns:1fr}.topbar .tools-right{gap:5px}.project-title{max-width:200px}.photo-topline small{max-width:260px}.preview-column{padding-bottom:25px}}

/* v1.0.1 failure isolation and editing-mode feedback */
.editor-stage.select-mode {cursor:default!important}
.editor-stage:not(.select-mode) .photo-content {cursor:crosshair}
.tool.active {background:rgba(55,156,226,.18);border-color:rgba(80,175,240,.45);color:#e1f4ff}
.preview-live .fallback {color:#f4ce86}
button:disabled {opacity:.39;cursor:not-allowed;filter:grayscale(.25)}
.app-alert {position:fixed;z-index:3000;bottom:22px;left:50%;transform:translateX(-50%);width:min(90vw,680px);background:#402024;color:#fff;border:1px solid #db6c77;border-radius:12px;padding:12px 16px;box-shadow:0 12px 45px rgba(0,0,0,.36);display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:13px;line-height:1.45}
.app-alert.warn {background:#463619;border-color:#aa863f;color:#fff4dc}
.app-alert div {display:flex;flex-direction:column;gap:3px}
.app-alert button {background:transparent;border:0;color:inherit;font-size:23px;cursor:pointer;align-self:center}
.app-alert.hidden {display:none}

/* v1.0.2 — image-space editor: photo and landmarks share one transform. */
.editor-stage{height:clamp(220px,39vh,475px);aspect-ratio:auto!important;background:#080e1a;}
.photo-content{inset:auto;width:0;height:0;transform-origin:center center;will-change:transform;}
.photo-content img{width:100%;height:100%;object-fit:fill!important;}
.editor-stage.active-editor{outline:2px solid #5298ca;outline-offset:-2px;}
.editor-stage.pan-mode,.editor-stage.pan-mode .photo-content{cursor:grab!important;}
.editor-stage.panning,.editor-stage.panning .photo-content{cursor:grabbing!important;}
.editor-stage .photo-content{cursor:crosshair;}
.editor-stage.select-mode .photo-content{cursor:default;}
.zoom-label{min-width:70px;white-space:nowrap;}
.video-range{gap:10px;}
.video-range>div:first-child{flex:1;}
.video-range input[type=range]{width:min(110px,30%);min-width:55px;accent-color:#6ea0ed;}
.video-range>span{font-size:11px;color:#a4c0df;min-width:38px;text-align:right;font-variant-numeric:tabular-nums;}
.video-framing-header{background:#172538;margin-top:8px;padding:10px 8px;border-radius:7px;}
@media(max-width:860px){.editor-stage{height:clamp(235px,47vh,450px);}}
@media(max-width:570px){.editor-stage{height:320px;max-height:none;} .photo-card{min-width:0;}}

.framing-target{display:flex;gap:5px;margin-top:8px}.framing-target .tool{padding:5px 8px;font-size:10px}
/* Video preview gets a bounded viewport so portrait MP4 settings never hide transport controls. */
.preview-stage{height:clamp(190px,29vh,310px);min-height:180px;aspect-ratio:auto!important;display:flex;align-items:center;justify-content:center;}
.preview-stage canvas{display:block;width:auto;height:100%;max-width:100%;max-height:100%;object-fit:contain;}


/* v1.0.3 — expanded editor uses the original interactive photo card. */
.photo-topline .expand-photo-btn{margin-left:auto;flex-shrink:0;border:1px solid #49688e;background:#1c3551;color:#d5eaff;border-radius:7px;font-weight:700;font-size:11px;padding:7px 10px;white-space:nowrap;}
.photo-topline .expand-photo-btn:hover{background:#285079;border-color:#75b3ee;}
.focus-overlay{position:fixed;inset:0;z-index:1550;background:#09111f;color:#e3ecfa;display:flex;flex-direction:column;overflow:hidden;min-width:0;min-height:0;isolation:isolate;}
.focus-header{display:flex;align-items:center;gap:22px;min-height:72px;padding:10px 22px;border-bottom:1px solid #2b3c56;background:#101c30;flex-shrink:0;}
.focus-brand{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.focus-kicker{color:#7ba8e5;font-size:10px;font-weight:800;letter-spacing:.12em;}
.focus-brand strong{font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.focus-brand small{font-size:11px;color:#91aacc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.focus-navigation{display:flex;align-items:center;gap:12px;}
.focus-nav,.focus-done,.focus-tool{border:1px solid #3c5172;background:#17263e;color:#dceaff;border-radius:8px;padding:9px 12px;font-size:12px;font-weight:700;white-space:nowrap;}
.focus-nav:hover:not(:disabled),.focus-tool:hover:not(:disabled){background:#28476b;border-color:#65a1e9;}
.focus-index{font-size:12px;color:#b1c7e7;min-width:50px;text-align:center;}
.focus-done{background:#296aaf;border-color:#3d91dc;color:white;padding:10px 17px;}
.focus-done:hover{background:#3482c6;}
.focus-done span{font-size:10px;opacity:.8;margin-left:8px;}
.focus-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-height:60px;padding:9px 16px;background:#0d1729;border-bottom:1px solid #283a55;flex-shrink:0;}
.focus-tool.active{background:#184269;border-color:#3f9de8;color:white;}
.focus-separator{height:26px;width:1px;background:#40526d;margin:0 5px;}
.focus-mesh{display:flex;gap:5px;align-items:center;font-size:12px;color:#b3c9e4;white-space:nowrap;}
.focus-toolbar-spacer{flex:1;}
.focus-zoom-label{min-width:48px;text-align:center;font-size:12px;color:#b9d5ee;}
.focus-main{flex:1;display:flex;min-height:0;min-width:0;padding:12px;gap:12px;overflow:hidden;}
.focus-image-wrap{min-width:0;min-height:0;flex:1;display:flex;flex-direction:column;}
.focus-image-wrap>.photo-card{flex:1;min-height:0;min-width:0;height:100%;border-color:#35557a;box-shadow:0 10px 35px #0006;}
.focus-image-wrap .photo-topline{min-height:49px;padding:8px 12px;flex-shrink:0;}
.focus-image-wrap .photo-topline .expand-photo-btn{display:none;}
.focus-image-wrap .editor-stage{flex:1;height:auto!important;min-height:0!important;max-height:none!important;width:100%;aspect-ratio:auto!important;background:#070e1b;}
.focus-image-wrap .photo-footer{flex-shrink:0;}
.focus-marker-sidebar{width:210px;flex-shrink:0;border:1px solid #2f4562;border-radius:12px;background:#111e31;display:flex;flex-direction:column;min-height:0;overflow:hidden;}
.focus-marker-heading{padding:15px 12px 10px;display:flex;gap:10px;justify-content:space-between;align-items:center;border-bottom:1px solid #2a3953;}
.focus-marker-heading strong{font-size:13px;}
.focus-marker-heading span{font-size:10px;color:#91b1d5;}
.focus-markers{display:flex;flex-direction:column;overflow:auto;flex:1;gap:5px;padding:9px;scrollbar-color:#425e80 transparent;}
.focus-marker-chip{border:1px solid #344762;border-radius:8px;padding:7px;display:flex;align-items:center;gap:9px;background:#1a2940;color:#e0ebfb;min-width:0;text-align:left;font-size:11px;}
.focus-marker-chip:hover{background:#263d5e;}
.focus-marker-chip.selected{border-color:#7badef;background:#2b456b;}
.focus-marker-chip .marker-swatch{flex-shrink:0;}
.focus-marker-chip .focus-marker-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.focus-side-help{font-size:10px;line-height:1.5;color:#9ab5d7;padding:12px;border-top:1px solid #2d3d55;}
.focus-bottom{min-height:36px;border-top:1px solid #26374d;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 20px;background:#101b2e;font-size:11px;color:#9bb5d5;flex-shrink:0;}
body.focus-mode{overflow:hidden;}
@media(max-width:920px){.focus-marker-sidebar{width:150px}.focus-header{padding:10px;gap:8px}.focus-toolbar{padding:7px}.focus-nav{padding:8px}}
@media(max-width:720px){.focus-marker-sidebar{display:none}.focus-header{min-height:55px}.focus-brand strong{font-size:13px}.focus-kicker{font-size:8px}.focus-navigation{gap:4px}.focus-nav{font-size:10px;padding:7px 5px}.focus-done{padding:9px}.focus-done span{display:none}.focus-toolbar{max-height:110px;overflow-y:auto;gap:4px}.focus-tool{padding:7px;font-size:10px}.focus-separator,.focus-toolbar-spacer{display:none}.focus-main{padding:5px}.focus-bottom{font-size:9px;padding:6px 9px}.focus-bottom span:last-child{display:none}}


/* v1.0.4 – workspace: maximize photo editor when timeline is tucked away. */
.topbar{position:relative;z-index:30;}
.editor-column{min-height:0;}
.editing-pair{flex:1;min-height:0;align-items:stretch;}
.editing-pair>.photo-card{min-height:0;height:100%;}
.editing-pair .editor-stage{flex:1 1 auto;min-height:0;height:auto;max-height:none;aspect-ratio:auto!important;}
.editing-pair .photo-topline,.editing-pair .photo-footer{flex-shrink:0;}
.editing-pair .pin{width:18px;height:18px;font-size:9px;border-width:1.5px;}
.editing-pair .pin.selected{width:24px;height:24px;font-size:10px;border-width:2px;}
/* True full-screen editing uses the original card outside editing-pair, so pins remain comfortably large. */
.timeline-section{transition:flex-basis .16s ease;}
.timeline-section.collapsed{flex:0 0 52px!important;min-height:52px!important;max-height:52px;overflow:hidden;}
.timeline-section.collapsed .timeline-header{height:52px;min-height:52px;padding-top:7px;padding-bottom:7px;}
.timeline-section.collapsed .timeline-scroll,.timeline-section.collapsed .timeline-reorder-hint{display:none!important;}
.timeline-section.collapsed .timeline-heading{min-width:0;}
.timeline-section.collapsed .timeline-heading strong{white-space:nowrap;}
.marker-popover-trigger{white-space:nowrap;}
.landmark-popover{position:absolute;right:12px;top:calc(100% + 7px);width:min(460px,calc(100vw - 24px));height:min(460px,calc(100vh - 150px));z-index:180;background:#111e31;border:1px solid #42618a;border-radius:12px;box-shadow:0 18px 65px #000b;display:flex;flex-direction:column;padding:10px;}
.landmark-popover.hidden{display:none;}
.popover-heading{display:flex;justify-content:space-between;align-items:center;padding:2px 5px 9px;gap:8px;}
.popover-heading strong{font-size:13px;}
.popover-landmarks.editor-bottom{height:auto;min-height:0;flex:1;border-radius:8px;}
.popover-landmarks .marker-scroller{align-content:flex-start;overflow-y:auto;}
.popover-landmarks .landmark-header{padding:10px;}
.popover-tip{font-size:11px;line-height:1.5;padding:10px 12px;color:#9ab2cf;background:#142439;border-top:1px solid #2b3d55;}
.preview-actions{display:flex;align-items:center;gap:12px;}
.preview-actions #savePreviewBtn{white-space:nowrap;}
@media(max-width:860px){.editing-pair{flex:none;}.editing-pair>.photo-card{height:auto;}.editing-pair .editor-stage{height:clamp(245px,45vh,480px);flex:none;}.timeline-section.collapsed{flex:0 0 53px!important;}}
@media(max-width:570px){.editing-pair .editor-stage{height:320px;}.preview-actions{gap:5px;}.preview-actions .mini{font-size:10px;}}

/* Give the matching photographs extra width too when the timeline is collapsed:
   landscape photos are otherwise constrained by the width of each stage. */
@media(min-width:861px){
 #app.timeline-compact .workarea{grid-template-columns:minmax(0,2.1fr) minmax(355px,.7fr);}
}

/* v1.0.5 — scoped transition changes */
.transition-scope{background:linear-gradient(120deg,#14243a,#111b2d);border:1px solid #344761;border-radius:10px;margin:9px 0 10px;padding:12px 11px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}
.transition-scope.scope-active{background:linear-gradient(120deg,#153e45,#172c39);border-color:#4e9a96}
.transition-toggle{display:flex;align-items:center;gap:9px;min-width:215px;flex:1;cursor:pointer;user-select:none}
.transition-toggle input{position:absolute;width:1px;height:1px;opacity:0}
.toggle-track{height:21px;width:39px;border-radius:14px;flex:0 0 39px;background:#33435a;border:1px solid #56708a;position:relative;transition:background .15s}
.toggle-track:after{position:absolute;content:'';top:2px;left:2px;border-radius:50%;background:white;width:15px;height:15px;transition:transform .15s}
.transition-toggle input:checked+.toggle-track{background:#1fa5a2;border-color:#5cd4c9}
.transition-toggle input:checked+.toggle-track:after{transform:translateX(18px)}
.transition-toggle input:focus-visible+.toggle-track{outline:2px solid #89bafd;outline-offset:3px}
.transition-toggle input:disabled+.toggle-track{opacity:.45}
.transition-toggle-copy{display:flex;flex-direction:column;gap:4px}
.transition-toggle-copy strong{font-size:11px;color:#e4f0ff}
.transition-toggle-copy small{font-size:10px;color:#8ea6c3;font-weight:500}
.copy-all-btn{border-color:#47698d;color:#bfe2f9;white-space:nowrap}
.transition-scope-hint{font-size:10px;width:100%;color:#87bdd2;line-height:1.5}
.scope-active .transition-scope-hint{color:#7ce4ca}
.setting-group-title{padding:12px 0 5px;color:#83a0c4;font-size:10px;font-weight:800;letter-spacing:.12em;display:flex;justify-content:space-between;gap:5px;flex-wrap:wrap}
.setting-group-title span{font-size:9px;color:#7796b4;font-weight:500;letter-spacing:0}
@media(max-width:1160px){.transition-scope{padding:10px 8px}.copy-all-btn{width:100%}}

/* Chemisode Tools navigation */
.chemisode-back{display:inline-flex;align-items:center;justify-content:center;font:700 11px/1.2 system-ui,sans-serif;color:#bcefff;text-decoration:none;border:1px solid #7dbed257;padding:7px 9px;border-radius:8px;white-space:nowrap}.chemisode-back:hover{background:#1d3852}.chemisode-back:focus-visible{outline:2px solid #80e4fa;outline-offset:2px}@media(max-width:690px){.chemisode-back{font-size:10px;padding:6px}}