:root{--bg:#f7f7f5;--surface:#fff;--ink:#262825;--muted:#858781;--line:#e7e8e3;--accent:#e96545;--accent-hover:#d95435;--accent-tint:#fff0eb;--radius:14px;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 var(--sans);-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button,select{cursor:pointer}button{touch-action:manipulation}button{border:0;background:none}button:disabled{cursor:default;opacity:.35}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.25}button,input,select{outline:none}button:focus-visible,input:focus-visible,select:focus-visible,#stage:focus-visible{outline:2px solid var(--accent);outline-offset:3px}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=range]{cursor:pointer}button,.button{transition:background .16s,color .16s,opacity .16s,transform .16s}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.sprite{position:absolute;width:0;height:0;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;vertical-align:middle}.button{min-height:42px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:12px;font-weight:600;white-space:nowrap;border-radius:9px;letter-spacing:.01em}.button.primary{background:var(--accent);color:white;box-shadow:0 2px 2px #bd482016,inset 0 1px 0 #ffffff1a}.button.primary:hover:not(:disabled){background:var(--accent-hover)}.button.secondary{background:#f5f5f2;border:1px solid var(--line)}.button.secondary:hover:not(:disabled){background:#eaeae5}.button.subtle{color:#686b64;background:transparent}.button.subtle:hover:not(:disabled){background:#edeee8;color:var(--ink)}.button.compact{min-height:33px;padding:0 9px;font-size:11px}.button.full,.full{width:100%}.icon-button{height:36px;width:36px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;color:#81847d}.icon-button:hover:not(:disabled){background:#efefeb;color:var(--ink)}.icon-button.small{height:30px;width:30px}.icon-button.small .icon{width:17px;height:17px}.icon-button.danger:hover:not(:disabled){background:#fff0eb;color:var(--accent)}.icon-button.active{color:var(--accent);background:var(--accent-tint)}.text-button{font-size:11px;font-weight:500;padding:0;display:inline-flex;gap:6px;align-items:center;justify-content:center;color:#84867f;min-height:30px}.text-button:hover{color:var(--accent)}.topbar{position:sticky;top:0;z-index:1100;height:76px;background:white;border-bottom:1px solid var(--line);padding:0 38px;display:flex;align-items:center;gap:27px}.brand{display:flex;align-items:center;gap:9px;font-size:36px;font-weight:750;letter-spacing:-2.5px;line-height:1}.brand-symbol{width:35px;height:35px;border-radius:10px;background:var(--accent);display:grid;place-items:center}.brand-symbol svg{width:28px;height:28px;fill:none;stroke:white;stroke-width:3.2;stroke-linecap:round}.brand-dot{color:var(--accent)}.brand-caption{font-size:11px;color:#969891;border-left:1px solid var(--line);padding-left:24px;letter-spacing:.01em}.header-actions{margin-left:auto;display:flex;align-items:center;gap:7px}.header-actions .button{padding:0 11px;min-height:35px;font-size:11px}.header-actions .icon{height:16px;width:16px}.nav-divider{height:20px;width:1px;background:var(--line);margin:0 8px}.app-shell{max-width:1610px;margin:auto;padding:0 38px}.projectbar{min-height:102px;display:flex;align-items:center;justify-content:space-between;gap:20px}.project-details{min-width:0}.project-details input{background:transparent;border:1px solid transparent;border-radius:5px;width:clamp(180px,34vw,510px);max-width:100%;font-size:22px;font-weight:650;letter-spacing:-.65px;padding:0;margin-left:-1px;text-overflow:ellipsis}.project-details input:hover{border-bottom-color:#d8dad2}.save-status{font-size:10px;color:#92958b;display:flex;align-items:center;gap:6px;margin-top:5px}.save-status>span:first-child{height:5px;width:5px;background:#91a077;border-radius:50%}.save-status>span:first-child.warn{background:var(--accent)}.project-actions{display:flex;align-items:center;gap:19px}.history-controls{display:flex;gap:4px}.project-actions .primary{min-width:134px;height:42px}.export-chip{font-size:9px;padding:2px 5px;border-radius:4px;background:#ffffff29;margin-left:4px;letter-spacing:.04em}.editor{display:grid;grid-template-columns:minmax(0,1fr) 294px;gap:23px;align-items:start}.left-column{min-width:0}.preview-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.panel-toolbar{height:51px;padding:0 20px;display:flex;align-items:center;justify-content:space-between}.toolbar-label{display:flex;align-items:center;gap:10px}.toolbar-label h1,.toolbar-label h2{font-size:13px;letter-spacing:-.1px;font-weight:650}.quiet-tag{font-size:9px;border:1px solid #eeeeea;color:#90938b;padding:2px 6px;border-radius:5px;font-variant-numeric:tabular-nums}.toolbar-end{display:flex;gap:13px;align-items:center}.preview-state{font-size:10px;color:#91948b}.preview-state.playing{color:#618744}.preview-state.playing:before{content:"";display:inline-block;width:5px;height:5px;background:#719851;border-radius:50%;margin-right:6px}.stage{height:clamp(325px,44vh,460px);min-height:325px;position:relative;display:flex;align-items:center;justify-content:center;background:#efefec;background-image:radial-gradient(#d6d8d0 .65px,transparent .65px);background-size:13px 13px;overflow:hidden}.stage:fullscreen{width:100vw;height:100vh;max-height:none;background-color:#e8e8e4}.stage canvas{display:block;box-shadow:0 3px 22px #232b2214;background-color:white;background-image:linear-gradient(45deg,#ededed 25%,transparent 25%),linear-gradient(-45deg,#ededed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ededed 75%),linear-gradient(-45deg,transparent 75%,#ededed 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.stage-counter{position:absolute;bottom:15px;left:17px;font-size:9px;font-variant-numeric:tabular-nums;color:#878b80;letter-spacing:.06em;border:1px solid #ddded6;background:#f5f5f0da;padding:3px 7px;border-radius:4px}.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:30px 15px;position:relative;z-index:1}.empty-art{width:116px;height:79px;margin-bottom:24px;position:relative}.back-photo,.front-photo{position:absolute;width:70px;height:61px;display:grid;place-items:center;border-radius:10px;box-shadow:0 5px 14px #343c2810}.back-photo{left:8px;top:2px;transform:rotate(-12deg);background:#fff;border:1px solid #e2e4dc;color:#b8bdb0}.back-photo .icon{width:31px;height:31px;stroke-width:1.1}.front-photo{left:44px;top:18px;transform:rotate(9deg);background:#fff3ed;border:1px solid #edd8cc;color:var(--accent)}.front-photo .icon{width:31px;height:31px}.art-plus{position:absolute;top:-5px;right:-7px;color:#afb79f;font-size:23px;font-weight:300}.empty-state h2{font-size:26px;font-weight:650;letter-spacing:-.85px;margin-bottom:10px}.empty-state p{font-size:11px;color:#94968d;line-height:1.8;margin-bottom:20px}.empty-state .primary{min-height:39px;font-size:11px;padding:0 17px}.empty-state .text-button{margin-top:8px;color:#8a8f80;font-size:10px}.supported-types{font-size:8px;color:#a6a99f;letter-spacing:.03em;margin-top:13px}.transport{height:76px;display:flex;align-items:center;gap:22px;padding:0 20px}.playback-buttons{display:flex;align-items:center;gap:6px}.play-button{width:35px;height:35px;background:#2e312b;border-radius:50%;display:grid;place-items:center;color:white}.play-button .icon{width:17px;height:17px}.play-button:hover:not(:disabled){background:#484d42}.play-button:disabled{background:#8a8d82;opacity:.35}.scrubber{min-width:80px;flex:1;margin-top:-7px}.scrub-labels{display:flex;justify-content:space-between;align-items:center;font-size:9px;font-variant-numeric:tabular-nums;color:#9c9f95;margin-bottom:9px}.scrub-labels #elapsed{color:#595e52;font-weight:600}.scrub-labels #elapsed span{font-weight:400;margin-left:3px;color:#969b8d}.scrub-track{height:5px;position:relative;background:#eceee7;border-radius:4px}.scrub-track input{position:absolute;left:0;top:-9px;width:100%;height:23px;opacity:0;margin:0;z-index:3}.scrub-track:focus-within{outline:2px solid var(--accent);outline-offset:3px}#scrub-segments{height:5px;display:flex;gap:2px;overflow:hidden;border-radius:4px}#scrub-segments span{height:100%;background:#d8dccf;min-width:1px}#scrub-segments span.active{background:var(--accent)}#playhead{position:absolute;top:-3px;height:11px;width:3px;background:var(--accent);left:0;transform:translateX(-1px);border-radius:2px;pointer-events:none;display:none}.space-hint{font-size:9px;color:#a2a698;white-space:nowrap;display:flex;align-items:center;gap:5px}kbd{font:9px var(--sans);border:1px solid #e0e3d9;border-radius:4px;background:#fafbf8;padding:3px 5px;color:#8b9082;white-space:nowrap}.timeline-panel{margin-top:24px}.timeline-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px;gap:8px}.timeline-header .toolbar-label h2{font-size:14px}.count-badge{font-size:9px;background:#e8ebe2;color:#848b78;min-width:19px;height:18px;display:grid;place-items:center;border-radius:5px}.timeline-header p{font-size:10px;color:#999e91;margin-top:5px}.timeline-actions{display:flex;align-items:center;gap:4px}.timeline-actions .icon{width:15px;height:15px}.mini-divider{height:15px;width:1px;background:#e3e6dc;margin:0 6px}.frames{display:flex;gap:12px;overflow-x:auto;padding:3px 2px 10px;scrollbar-width:thin;scrollbar-color:#d8dccf transparent;min-height:174px;scroll-behavior:smooth;align-items:flex-start}.empty-timeline{height:156px;width:100%;border:1px dashed #d8decf;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:9px;color:#b4bcaa;font-size:10px}.empty-timeline .icon{width:17px;height:17px}.empty-timeline .text-button{font-size:10px;text-decoration:underline;text-underline-offset:3px;color:#7b866c;margin-left:4px}.frame-card{flex:0 0 142px;border:1px solid #e0e4d8;background:white;border-radius:10px;padding:7px;position:relative;transition:border-color .15s,box-shadow .15s,opacity .15s;cursor:pointer}.frame-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.frame-card.dragging{opacity:.35}.frame-card.drag-over{box-shadow:-5px 0 0 -2px var(--accent);border-color:var(--accent)}.frame-top{height:21px;display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}.frame-number{font-size:9px;color:#8e9782;padding-left:3px;font-variant-numeric:tabular-nums}.selected .frame-number{color:var(--accent);font-weight:650}.frame-grip{cursor:grab;color:#b9c0b0;display:flex}.frame-grip .icon{height:13px;width:13px}.frame-thumb{width:100%;height:82px;object-fit:cover;border-radius:5px;background:#f2f2ee;display:block;user-select:none}.frame-caption{font-size:9px;color:#828a77;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:7px 1px 5px;max-width:124px}.frame-timing{height:27px;background:#f6f7f3;border-radius:5px;display:flex;align-items:center;padding:0 8px;gap:5px;border:1px solid transparent}.selected .frame-timing{background:#fff2ed;border-color:#f7dfd4}.frame-timing .icon{width:12px;height:12px;color:#98a08e}.selected .frame-timing .icon{color:var(--accent)}.frame-timing input{width:100%;min-width:0;background:transparent;border:0;font-size:10px;text-align:right;font-variant-numeric:tabular-nums;padding:0;color:#717e61}.selected .frame-timing input{color:#c76945}.frame-timing>span{color:#a8b09d;font-size:9px}.frame-move{display:none;gap:1px;position:absolute;top:9px;right:23px}.selected .frame-move{display:flex}.frame-move button{height:18px;width:19px;display:grid;place-items:center;border-radius:3px;color:#909d82}.frame-move button:hover:not(:disabled){background:#fff0e8;color:var(--accent)}.frame-move .icon{height:12px;width:12px}.add-frame-tile{flex:0 0 80px;height:177px;border:1px dashed #d5ddc9;border-radius:9px;color:#a0ac90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;font-size:9px}.add-frame-tile:hover{background:#edf0e7;color:var(--accent);border-color:var(--accent)}.timeline-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e4e8dc;margin-top:4px;padding-top:10px;gap:8px}.timeline-bottom .button{padding-left:0;color:#849272}.timeline-bottom>span{font-size:9px;color:#a4ad98}.inspector{border:1px solid var(--line);border-radius:var(--radius);padding:22px 21px 19px;background:#fff}.inspector-heading{padding-bottom:20px;border-bottom:1px solid var(--line)}.inspector-heading h2{font-size:14px;font-weight:650;letter-spacing:-.15px}.inspector-heading p{font-size:10px;color:#9a9f90;margin-top:7px}.settings-section{padding:19px 0;border-bottom:1px solid var(--line)}.setting-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.setting-title h3{font-size:11px;font-weight:650}.setting-title>.icon{height:14px;width:14px;color:#9fa694}.selected-name{font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#959d8b;margin-top:-5px;margin-bottom:11px}.duration-control{display:flex;align-items:center;justify-content:space-between;border:1px solid #e4e8dc;background:#fafbf7;padding:6px 7px;border-radius:9px;margin-bottom:9px;height:57px}.duration-control>.icon-button{height:30px;width:30px}.duration-control .icon{height:14px;width:14px}.duration-center{display:flex;align-items:baseline;gap:5px;justify-content:center}.duration-center input{width:57px;font-size:23px;font-weight:550;text-align:right;line-height:1;border:0;background:transparent;padding:0;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.duration-center input:disabled{color:#9ea795}.duration-center span{font-size:9px;color:#919c82}.timing-section .secondary{font-size:10px;color:#7c886c;min-height:31px;background:white;border-color:#e4e8dc;font-weight:500}.field-label{font-size:10px;color:#949c87;display:block;margin-bottom:7px;line-height:1.2}.inspector select,.dialog select{appearance:none;width:100%;height:35px;border:1px solid #e4e8dc;border-radius:7px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23939c86' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding:0 30px 0 10px;font-size:11px;line-height:1.2;color:#656e59}.dimensions-row{display:flex;align-items:center;gap:6px;margin-top:10px;margin-bottom:15px}.dimension-field{height:32px;display:flex;align-items:center;border:1px solid #e4e8dc;border-radius:6px;padding:0 8px;flex:1;min-width:0;gap:4px}.dimension-field>span{font-size:9px;color:#a6af9b}.dimension-field input{border:0;background:transparent;min-width:0;width:100%;font-size:11px;text-align:right;font-variant-numeric:tabular-nums;color:#707b62}.dimensions-row .times{font-size:10px;color:#b7bead}.dimensions-row .icon-button{height:28px;width:25px}.dimensions-row .icon{height:12px;width:12px}.segmented{display:flex;border-radius:7px;background:#f4f6ef;padding:3px;gap:3px}.segmented button{flex:1;font-size:10px;color:#929d83;border-radius:5px;height:27px;font-weight:500}.segmented button.selected{background:white;color:#505c43;box-shadow:0 1px 4px #333e2612}.background-row{display:flex;align-items:center;justify-content:space-between;margin-top:15px}.background-row .field-label{margin:0}.color-field{height:28px;border:1px solid #e5e9dd;border-radius:6px;display:flex;align-items:center;gap:6px;padding:0 6px;background:#fff}.color-field input{appearance:none;-webkit-appearance:none;border:1px solid #e5e9dd;width:17px;height:17px;padding:0;background:none;cursor:pointer;border-radius:4px;overflow:hidden}.color-field input::-webkit-color-swatch-wrapper{padding:0}.color-field input::-webkit-color-swatch{border:0}.color-field>span{font-size:9px;color:#929e83;font-variant-numeric:tabular-nums}.switch-row{display:flex;align-items:center;justify-content:space-between;position:relative;gap:10px;font-size:10px;color:#7b886a;min-height:25px;cursor:pointer}.background-row+.switch-row{margin-top:8px}.switch-row input{position:absolute;right:0;opacity:0;width:29px;height:20px;cursor:pointer}.switch{width:28px;height:16px;background:#e2e7d8;border-radius:10px;padding:2px;transition:background .2s;flex-shrink:0}.switch:before{content:"";display:block;width:12px;height:12px;border-radius:50%;background:white;box-shadow:0 1px 2px #0001;transition:transform .18s}.switch-row input:checked+.switch{background:var(--accent)}.switch-row input:checked+.switch:before{transform:translateX(12px)}.switch-row input:focus-visible+.switch{outline:2px solid var(--accent);outline-offset:3px}.export-settings .setting-title{margin-bottom:7px}.export-settings .field-label{margin-top:13px}.dither-row{margin-top:11px}.field-help{display:block;font-size:8px;color:#a7b095;margin-top:1px}.export-settings{padding-bottom:15px}.privacy-note{display:flex;align-items:center;gap:9px;padding-top:16px;color:#a1ad90}.privacy-note .icon{width:17px;height:17px;stroke-width:1.4}.privacy-note p{font-size:9px;line-height:1.6;color:#8d9a7a}.privacy-note p span{font-size:8px;color:#a5b094}.app-footer{display:flex;align-items:center;justify-content:space-between;min-height:63px;font-size:9px;color:#a8b199}.app-footer .text-button{font-size:9px;color:#95a183}.app-footer .icon{width:12px;height:12px}.checker{background-color:white;background-image:linear-gradient(45deg,#eee 25%,transparent 25%),linear-gradient(-45deg,#eee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#eee 75%),linear-gradient(-45deg,transparent 75%,#eee 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0}.drop-shield{position:fixed;inset:12px;z-index:100;background:#fff9f0ed;backdrop-filter:blur(12px);border:2px dashed var(--accent);border-radius:18px;display:grid;place-items:center;text-align:center;pointer-events:none}.drop-shield .icon{width:55px;height:55px;color:var(--accent);stroke-width:1.3}.drop-shield h2{font-size:30px;letter-spacing:-1px;margin:23px 0 12px}.drop-shield p{color:#9b9686;font-size:13px}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#2c3325;color:#fff;border-radius:10px;padding:13px 19px;max-width:min(92vw,620px);z-index:200;font-size:12px;box-shadow:0 4px 30px #242a2226;animation:toast-in .2s ease-out}.import-indicator{position:fixed;top:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 16px;box-shadow:0 3px 20px #27352114;z-index:50;font-size:12px}.spinner{height:15px;width:15px;border:2px solid #efede4;border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.dialog{border:1px solid #e9ece1;border-radius:18px;box-shadow:0 25px 100px #222d2233;padding:27px;width:460px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 40px);overflow-y:auto;background:#fff;color:var(--ink)}.dialog::backdrop{background:#242c2357;backdrop-filter:blur(6px)}.dialog[open]{animation:dialog-in .2s ease-out}.dialog-top{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:24px}.dialog-top h2{font-size:21px;font-weight:650;letter-spacing:-.7px}.dialog-top p{font-size:11px;color:#939d86;margin-top:8px}.dialog-top .icon-button{margin:-9px -9px 0 0}.export-overview{display:flex;align-items:center;gap:15px;background:#f6f8f1;border:1px solid #e7ecdf;border-radius:10px;padding:12px;margin-bottom:23px}.export-overview img{width:69px;height:69px;border-radius:6px;object-fit:contain}.export-overview>div{display:flex;flex-direction:column;gap:4px;min-width:0}.export-overview strong{font-size:12px;font-weight:600;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.export-overview span{font-size:10px;color:#939f84}.text-input{height:40px;border:1px solid #e2e8d8;border-radius:7px;width:100%;padding:0 12px;font-size:12px;background:#fff}.dialog .field-label{font-size:11px;margin-bottom:8px}.export-dimension-label{margin-top:20px}.export-dimension-note{font-size:10px;color:#919e80;line-height:1.6;margin-top:8px}.export-format-label{margin-top:16px}.dialog select{height:39px;font-size:12px}.format-note{font-size:10px;color:#919e80;line-height:1.7;margin-top:10px;min-height:35px}.export-option-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-top:17px}.export-option-field{min-width:0}.export-option-field.full{grid-column:1/-1}.export-option-field .field-label{margin:0 0 7px}.export-option-note{font-size:9px;color:#99a58c;line-height:1.55;margin-top:7px;min-height:28px}.export-footer{display:flex;align-items:center;justify-content:space-between;margin-top:22px;gap:8px}.export-footer>span{font-size:9px;color:#a1ae90;max-width:155px}.export-footer .button{padding:0 14px;font-size:11px}.progress-art{display:grid;place-items:center;width:62px;height:62px;background:#fff1e8;color:var(--accent);margin:10px auto 21px;border-radius:18px}.progress-art .icon{width:31px;height:31px;animation:spin 3s linear infinite;stroke-width:1.4}#export-progress h3{text-align:center;font-size:19px;letter-spacing:-.5px}#export-progress>p{text-align:center;margin-top:9px;font-size:11px;color:#8e9c7b}.progress-meter{height:6px;background:#f0f3e9;border-radius:9px;overflow:hidden;margin-top:26px}.progress-meter>div{height:100%;width:0;background:var(--accent);transition:width .2s}.progress-label{display:flex;justify-content:space-between;font-size:10px;color:#96a485;margin:9px 0 22px}.result-preview{height:226px;border:1px solid var(--line);border-radius:11px;display:flex;align-items:center;justify-content:center;overflow:hidden}.result-preview img,.result-preview video{max-width:100%;max-height:100%;object-fit:contain}.result-heading{display:flex;align-items:center;gap:11px;margin:20px 0}.success-check{display:grid;place-items:center;background:#f0f6e5;color:#6e944a;width:34px;height:34px;border-radius:50%}.success-check .icon{width:18px;height:18px}.result-heading h3{font-size:16px;letter-spacing:-.3px}.result-heading p{font-size:10px;color:#8f9f7b;margin-top:5px}#back-editor{margin-top:12px;font-size:11px}#export-error h3{font-size:17px}#export-error p{font-size:12px;color:#8c947f;margin:14px 0 25px;line-height:1.7}.help-dialog{width:525px}.help-steps{display:flex;flex-direction:column;gap:16px}.help-steps p{font-size:12px;color:#8a957b;line-height:1.8}.help-steps strong{display:block;color:#59694a;font-weight:600;font-size:12px;margin-bottom:2px}.help-section-heading{font-size:12px;margin-top:23px}.shortcuts{margin:12px 0 20px}.shortcuts>div{display:flex;align-items:center;justify-content:space-between;padding:6px 0;gap:7px}.shortcuts dt{font-size:11px;color:#8e9d7c}.shortcuts dd{margin:0;display:flex;gap:5px;font-size:9px;color:#98a785}.help-footnote{font-size:10px;color:#a1ad92;line-height:1.8;border-top:1px solid var(--line);padding-top:17px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes toast-in{from{opacity:0;bottom:19px}to{opacity:1;bottom:26px}}@keyframes dialog-in{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}@media(min-width:1500px){.editor{grid-template-columns:minmax(0,1fr) 314px;gap:27px}.inspector{padding:24px}.stage{height:460px}}.button.danger{background:var(--accent);color:#fff;box-shadow:0 2px 2px #bd482016,inset 0 1px 0 #ffffff1a}.button.danger:hover:not(:disabled){background:var(--accent-hover)}
.confirm-copy{font-size:12px;line-height:1.7;color:#7f8478;margin:-4px 0 25px}.dialog-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:24px}
.transition-bridge{flex:0 0 74px;align-self:flex-start;margin-top:61px;height:34px;border:1px dashed #d7dbcf;border-radius:9px;background:#fafbf7;color:#879078;display:flex;align-items:center;justify-content:center;gap:5px;padding:0 7px;font-size:8px;line-height:1.1;text-align:center;white-space:nowrap}.transition-bridge:hover{border-color:#b8c1a9;background:#f2f5ed;color:#637453}.transition-bridge.active{border-style:solid;border-color:#f0c4b7;background:#fff2ec;color:var(--accent)}.transition-bridge .transition-mark{font-size:13px;line-height:1}
.transition-dialog .transition-duration-row{display:flex;align-items:center;justify-content:space-between;margin-top:19px}.transition-dialog .transition-duration-row .field-label{margin:0}.transition-dialog output{font-size:11px;color:#7e896f;font-variant-numeric:tabular-nums}
.transition-dialog .strength-slider{--transition-fill:21.43%;display:block;width:100%;height:24px;margin:9px 0 0;padding:0;border:0;background:transparent;accent-color:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.transition-dialog .strength-slider::-webkit-slider-runnable-track{height:6px;border:1px solid #ddcfc0;border-radius:999px;background:linear-gradient(to right,#ff7a24 0%,#ff7a24 var(--transition-fill),#eee4da var(--transition-fill),#eee4da 100%);box-shadow:inset 0 1px 1px #8d6e4e12}
.transition-dialog .strength-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;margin-top:-7px;border:3px solid #fff9f2;border-radius:50%;background:#ff7a24;box-shadow:0 1px 4px #7d512b38,0 0 0 1px #efbb94;transition:box-shadow .16s ease,transform .16s ease}
.transition-dialog .strength-slider:hover::-webkit-slider-thumb{box-shadow:0 2px 6px #7d512b40,0 0 0 1px #edae7d}
.transition-dialog .strength-slider:focus-visible{outline:none}
.transition-dialog .strength-slider:focus-visible::-webkit-slider-thumb{box-shadow:0 2px 6px #7d512b40,0 0 0 1px #eead7c,0 0 0 4px #ff8a4526}
.transition-dialog .strength-slider::-moz-range-track{height:6px;border:1px solid #ddcfc0;border-radius:999px;background:#eee4da;box-shadow:inset 0 1px 1px #8d6e4e12}
.transition-dialog .strength-slider::-moz-range-progress{height:6px;border-radius:999px;background:#ff7a24}
.transition-dialog .strength-slider::-moz-range-thumb{width:12px;height:12px;border:3px solid #fff9f2;border-radius:50%;background:#ff7a24;box-shadow:0 1px 4px #7d512b38,0 0 0 1px #efbb94}
.transition-dialog .strength-slider:focus-visible::-moz-range-thumb{box-shadow:0 2px 6px #7d512b40,0 0 0 1px #eead7c,0 0 0 4px #ff8a4526}
.transition-dialog .strength-slider:disabled{opacity:.42;cursor:default}
.transition-dialog .encoding-help{margin-top:12px}
@media(max-width:1050px){.topbar{padding:0 24px}.app-shell{padding:0 24px}.editor{gap:17px;grid-template-columns:minmax(0,1fr) 266px}.inspector{padding:20px 17px}.brand-caption{display:none}.space-hint{display:none}.transport{gap:14px;padding:0 17px}.empty-timeline{flex-direction:column;gap:3px}.empty-timeline .icon{margin-bottom:7px}.frame-card{flex-basis:130px}.frame-thumb{height:75px}}@media(max-width:780px){.topbar{height:65px;padding:0 18px}.brand{font-size:30px;gap:7px}.brand-symbol{width:30px;height:30px;border-radius:9px}.brand-symbol svg{height:25px;width:25px}.header-actions .button span{display:none}.header-actions .button{width:32px;padding:0;min-height:32px}.header-actions{gap:3px}.nav-divider{margin:0 4px}.app-shell{padding:0 18px}.projectbar{min-height:89px;gap:10px}.project-details input{font-size:19px;width:220px}.save-status{font-size:8px;gap:4px}.project-actions{gap:7px}.history-controls{gap:0}.history-controls .icon-button{height:28px;width:28px}.history-controls .icon{height:15px;width:15px}.project-actions .primary{min-width:95px;height:38px;min-height:38px;font-size:11px;padding:0 11px;gap:6px}.project-actions .primary>.icon{height:15px;width:15px}.export-chip{display:none}.editor{grid-template-columns:minmax(0,1fr);gap:24px}.stage{height:360px}.inspector{display:grid;grid-template-columns:1fr 1fr;gap:0 25px;padding:20px}.inspector-heading{grid-column:1/-1;padding-bottom:16px}.inspector-heading p{display:none}.timing-section{grid-column:1;padding-top:17px;align-self:start;border-bottom:0}.settings-section:nth-of-type(2){grid-column:2;grid-row:2/4;border-bottom:0}.export-settings{grid-column:1;border-bottom:0;padding-top:0}.privacy-note{grid-column:1/-1;border-top:1px solid var(--line);padding-top:13px}.privacy-note p{font-size:9px}.privacy-note p br{display:none}.privacy-note p span{margin-left:4px}.timeline-panel{margin-top:22px}.timeline-header p{font-size:9px}.frames{min-height:185px}.empty-timeline{height:160px;flex-direction:row}.app-footer{min-height:58px}.frame-card{flex-basis:142px}.frame-thumb{height:82px}}@media(max-width:460px){.app-shell{padding:0 13px}.topbar{padding:0 15px}.project-details input{width:165px;font-size:18px}.history-controls{display:none}.projectbar{min-height:88px}.save-status{font-size:8px}.project-actions .primary{min-width:90px}.panel-toolbar{padding:0 14px;height:46px}.toolbar-label{gap:8px}.toolbar-label h1{font-size:12px}.quiet-tag{font-size:8px}.preview-state{font-size:9px}.stage{height:330px;min-height:290px}.empty-state{padding:19px 12px}.empty-art{transform:scale(.88);margin-bottom:16px}.empty-state h2{font-size:23px}.empty-state p{font-size:10px;margin-bottom:16px}.empty-state .button{min-height:37px}.supported-types{font-size:8px;margin-top:6px}.transport{height:70px;padding:0 12px;gap:14px}.playback-buttons{gap:2px}.playback-buttons .icon-button{width:25px}.play-button{height:31px;width:31px}.scrub-labels{font-size:8px}.timeline-actions{gap:1px}.timeline-actions .compact{padding:0 5px;font-size:10px}.timeline-header .toolbar-label h2{font-size:13px}.timeline-header p{max-width:160px;font-size:8px}.mini-divider{margin:0 3px}.timeline-bottom>span{font-size:8px;text-align:right;max-width:190px}.empty-timeline{flex-direction:column}.frame-card{flex-basis:133px}.frame-thumb{height:77px}.inspector{padding:19px 16px;gap:0 17px}.inspector-heading h2{font-size:13px}.setting-title h3{font-size:10px}.selected-name{font-size:8px}.duration-control{height:53px;padding:4px}.duration-center input{font-size:21px;width:43px}.duration-center span{font-size:8px}.duration-control .icon-button{width:20px;height:26px}.timing-section .secondary{font-size:8px;letter-spacing:0;padding:0 5px}.inspector select{font-size:9px;padding-left:7px;padding-right:24px;background-position:right 5px center}.dimensions-row{gap:3px}.dimension-field{padding:0 5px;gap:2px}.dimension-field input{font-size:10px}.dimension-field>span{font-size:8px}.dimensions-row .icon-button{width:20px}.segmented button{font-size:9px}.field-label{font-size:9px}.background-row{flex-wrap:wrap;gap:7px}.color-field{height:26px;gap:4px}.color-field>span{font-size:8px}.switch-row{font-size:9px;gap:5px}.switch{width:26px;height:15px}.switch:before{height:11px;width:11px}.switch-row input:checked+.switch:before{transform:translateX(11px)}.field-help{font-size:7px}.privacy-note p br{display:initial}.privacy-note p span{margin-left:0}.dialog{padding:22px}.dialog-top h2{font-size:20px}.export-footer>span{max-width:115px;font-size:8px}.help-dialog .dialog-top h2{font-size:18px}.shortcuts dt{font-size:10px}.shortcuts dd kbd{font-size:8px}.dialog-top{gap:8px}.format-note{font-size:10px}.app-footer{font-size:8px}.app-footer .text-button{font-size:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
/* Final legibility pass: keep the quiet hierarchy without undersizing controls. */
.frames{position:relative}.brand-caption{font-size:12px;color:#858b7b}.header-actions .button{font-size:12px}.save-status{font-size:11px;color:#7d8871}.toolbar-label h1,.toolbar-label h2{font-size:14px}.quiet-tag{font-size:10px;color:#7a856d}.preview-state{font-size:11px;color:#7f8a72}.stage{height:clamp(350px,39vh,430px);min-height:350px}.empty-state p{font-size:12px;color:#7e8a70}.supported-types{font-size:9px;color:#939e85}.empty-state .text-button{font-size:11px}.scrub-labels{font-size:10px}.space-hint{font-size:10px}.timeline-header p{font-size:11px;color:#879475}.frame-number{font-size:10px}.frame-caption{font-size:10px;color:#7c886c}.frame-timing input{font-size:12px}.frame-timing>span{font-size:10px}.timeline-bottom>span{font-size:10px;color:#879675}.timeline-bottom .button{font-size:12px}.timeline-actions .compact{font-size:12px}.inspector{padding:20px}.inspector-heading{padding-bottom:16px}.inspector-heading h2{font-size:15px}.inspector-heading p{font-size:11px;color:#859473}.settings-section{padding:16px 0}.setting-title h3{font-size:12px}.selected-name{font-size:11px;color:#829270}.field-label{font-size:11px;color:#798c65}.inspector select{font-size:12px;height:36px;color:#586d46}.dimension-field input{font-size:12px;color:#61774f}.dimension-field>span{font-size:10px}.segmented button{font-size:11px;color:#849872}.background-row .field-label{font-size:11px}.color-field>span{font-size:10px;color:#7b8e67}.switch-row{font-size:11px;color:#728860;min-height:28px}.field-help{font-size:9px;color:#8f9f7e}.timing-section .secondary{font-size:11px;color:#748a62}.privacy-note p{font-size:10px;color:#7f946d}.privacy-note p span{font-size:9px;color:#92a480}.app-footer{font-size:10px}.app-footer .text-button{font-size:10px}.duration-center span{font-size:10px}.scrub-labels #elapsed{color:#667a54}.scrub-labels #total-time{color:#849775}.frame-move button{height:20px;width:20px}.frame-move{top:8px}.export-settings .setting-title{margin-bottom:7px}.inspector .export-settings{padding-bottom:15px}
@media(min-width:1500px){.stage{height:clamp(350px,40vh,440px)}}
@media(max-width:780px){.header-actions .button{font-size:11px}.save-status{font-size:10px}.inspector{padding:20px}.inspector .export-settings{padding-top:0}.stage{height:360px}.app-footer{font-size:9px}.app-footer .text-button{font-size:9px}.privacy-note p span{margin-left:5px}}
@media(max-width:460px){.stage{height:330px;min-height:330px}.save-status{font-size:9px}.toolbar-label h1{font-size:13px}.quiet-tag{font-size:9px}.empty-state p{font-size:11px}.empty-state .text-button{font-size:10px}.supported-types{font-size:8px}.scrub-labels{font-size:9px}.timeline-header p{font-size:9px}.timeline-actions .compact{font-size:10px}.timeline-bottom>span{font-size:9px}.timeline-bottom .button{font-size:11px}.inspector{padding:19px 16px}.inspector-heading h2{font-size:14px}.setting-title h3{font-size:11px}.selected-name{font-size:9px}.field-label{font-size:10px}.inspector select{font-size:10px}.dimension-field input{font-size:11px}.dimension-field>span{font-size:9px}.segmented button{font-size:10px}.switch-row{font-size:10px;line-height:1.35}.background-row .field-label{font-size:10px}.color-field>span{font-size:9px}.timing-section .secondary{font-size:9px}.field-help{font-size:8px}.duration-center span{font-size:8px}.privacy-note p{font-size:10px}.privacy-note p span{font-size:9px;margin-left:0}.app-footer{font-size:9px}.app-footer .text-button{font-size:9px}.preview-state{font-size:10px}}

/* Engine 2.0 controls, extending the existing editor design. */
.encoding-help{font-size:10px;line-height:1.55;color:#829071;margin-top:8px}.encoding-details{border-top:1px solid var(--line);margin-top:16px;padding-top:13px}.encoding-details summary{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;font-weight:600;color:#718361;cursor:pointer;list-style:none;min-height:25px}.encoding-details summary::-webkit-details-marker{display:none}.encoding-details summary .icon{height:12px;width:12px;transform:rotate(90deg);transition:transform .15s}.encoding-details[open] summary .icon{transform:rotate(-90deg)}.encoding-details summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}.strength-label{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:8px}.strength-label .field-label{margin:0}.strength-label output{font-size:10px;color:var(--accent)}.strength-slider{display:block;width:100%;height:18px;margin:9px 0 0;accent-color:var(--accent);padding:0}.strength-slider:disabled{opacity:.35;cursor:default}.compression-row{margin-top:18px}.result-heading .result-optimization{font-size:10px;line-height:1.6;color:#718361;max-width:310px;margin-top:7px}.result-heading>div{min-width:0}.result-heading{align-items:flex-start}.result-heading .success-check{flex-shrink:0}.privacy-note{align-self:end}
@media(max-width:780px){.inspector .export-settings{grid-column:1/-1;border-top:1px solid var(--line);padding-top:17px}.settings-section:nth-of-type(2){grid-row:2;grid-column:2}.encoding-help{font-size:11px}.encoding-details .field-label{font-size:11px}.encoding-details summary{font-size:12px}.encoding-details .switch-row{font-size:11px}.encoding-details select{font-size:12px}.encoding-details .field-help{font-size:10px}.export-settings>select{font-size:12px}.export-settings .setting-title h3{font-size:12px}.export-settings>.field-label{font-size:11px}.export-settings>.switch-row{font-size:11px}.strength-slider{height:28px}.encoding-details summary{min-height:36px}}

/* Dimension templates, using the existing editor colors and control styles. */
.canvas-size-trigger{display:inline-flex;align-items:center;gap:5px;min-height:27px;cursor:pointer;color:#718160;background:#fafbf7}.canvas-size-trigger .icon{width:12px;height:12px}.canvas-size-trigger:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-tint)}
.canvas-settings .setting-title .text-button{font-size:11px;min-height:22px;color:var(--accent)}
.dimension-template{display:flex;align-items:center;gap:10px;width:100%;padding:11px 10px;margin-bottom:14px;text-align:left;border:1px solid #e4e8dc;border-radius:9px;background:#fafbf7}.dimension-template:hover:not(:disabled){border-color:#e6b9a6;background:#fff7f3}.dimension-template-art{height:34px;width:32px;display:grid;place-items:center;flex-shrink:0}.dimension-template-art>span{border:1.5px solid #acb69e;border-radius:3px;background:#eff2e9}.dimension-template-copy{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.dimension-template-copy strong{font-size:12px;font-weight:600;color:#58674b}.dimension-template-copy>span{font-size:10px;color:#8a987b;line-height:1.4;font-variant-numeric:tabular-nums}.dimension-template>.icon{width:14px;height:14px;color:#929d84}.canvas-export-note{margin:-6px 0 13px;font-size:10px;line-height:1.6;color:#b26a44}
.dimensions-dialog{width:700px;padding:0;overflow:hidden;max-height:min(820px,calc(100dvh - 36px));border-radius:18px}.dimensions-dialog form{display:flex;flex-direction:column;max-height:min(820px,calc(100dvh - 36px));min-height:0}.dimensions-dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:25px 25px 19px;flex-shrink:0}.dimensions-dialog-header h2{font-size:24px;font-weight:650;letter-spacing:-.8px}.dimensions-dialog-header p{margin-top:7px;font-size:12px;line-height:1.6;color:#8b987e}.dimensions-dialog-header .icon-button{margin:-4px -6px 0 0}.dimensions-scroll{overflow-y:auto;min-height:0;padding:0 25px 21px;scrollbar-width:thin;scrollbar-color:#d6dbce transparent}.dimensions-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:17px}.dimensions-tabs button{position:relative;font-size:12px;font-weight:600;padding:0 12px 13px;min-height:34px;color:#8a967c}.dimensions-tabs button:first-child{padding-left:0;padding-right:17px}.dimensions-tabs button.selected{color:var(--accent)}.dimensions-tabs button.selected:after{position:absolute;content:'';height:2px;bottom:-1px;left:0;right:0;background:var(--accent);border-radius:2px}.dimensions-tabs button:hover{color:#bf5d3e}.dimension-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:23px}.dimension-card{border:1px solid #e5e9df;border-radius:10px;padding:12px 9px 11px;text-align:left;background:#fff;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;min-height:123px}.dimension-card:hover{border-color:#dcb8a9;background:#fffbf8}.dimension-card.selected{border-color:var(--accent);background:#fff4ee;box-shadow:0 0 0 .5px var(--accent)}.dimension-card-art{position:relative;width:100%;height:57px;display:grid;place-items:center}.dimension-card-shape{display:grid;place-items:center;border:1.5px solid #b0bba2;background:#f5f7f0;border-radius:3px;color:#8c997c}.dimension-card-shape>span{font-size:9px;white-space:nowrap;letter-spacing:-.2px}.dimension-card.selected .dimension-card-shape{color:#d47852;border-color:#e79a77;background:#ffe9dc}.dimension-card-check{display:none;position:absolute;right:0;top:-3px;color:var(--accent)}.dimension-card.selected .dimension-card-check{display:block}.dimension-card-check .icon{width:14px;height:14px}.dimension-card>strong{font-size:12px;font-weight:600;line-height:1.45;color:#58674a;white-space:nowrap}.dimension-card-size{font-size:10px;color:#939f85;font-variant-numeric:tabular-nums}.dimension-card.selected>strong{color:#b75a38}.dimension-card.selected .dimension-card-size{color:#c58b72}.dimension-custom-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.dimension-custom-header h3{font-size:12px;font-weight:600}.dimension-custom-header>span{font-size:10px;color:#96a18b}.dimension-custom-fields{display:flex;align-items:flex-end;gap:9px}.dimension-custom-fields>label{font-size:11px;color:#8c987f;flex:1;min-width:0}.dimension-custom-input{height:40px;margin-top:7px;display:flex;align-items:center;border:1px solid #e1e7d9;border-radius:7px;background:#fafbf7;padding:0 11px;gap:10px}.dimension-custom-input input{width:100%;min-width:0;height:100%;border:0;background:transparent;font-size:14px;line-height:1.2;font-weight:500;font-variant-numeric:tabular-nums}.dimension-custom-input>span{font-size:11px;color:#a1ac94}.dimension-custom-input:focus-within{border-color:var(--accent)}.dimension-custom-input:has(input[aria-invalid=true]){border-color:#d76648}.dimension-custom-fields>.icon-button{width:35px;height:40px}.dimension-custom-fields .icon{width:16px;height:16px}.dimension-custom-meta{display:flex;align-items:flex-start;justify-content:space-between;gap:13px;margin:5px 0 12px;min-height:28px}.dimension-custom-meta .text-button{font-size:11px;min-height:28px;color:#869673;white-space:nowrap}.dimension-custom-meta p{font-size:10px;color:#c26040;line-height:1.6;text-align:right;margin-top:5px}.dimension-fitting{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.dimension-fitting h3{font-size:12px;font-weight:600}.dimension-fitting p{font-size:10px;line-height:1.6;color:#8b997c;margin-top:4px;max-width:330px}.dimension-fitting .segmented{min-width:195px;flex-shrink:0}.dimension-fitting .segmented button{font-size:11px;min-width:55px}.dimension-export-exact{font-size:12px!important;margin-top:14px;min-height:28px}.dimension-export-exact .switch{flex-shrink:0}.template-export-note{font-size:10px;line-height:1.6;color:#92a082;margin-top:2px;max-width:530px}.dimensions-dialog-footer{display:flex;align-items:center;gap:10px;flex-shrink:0;border-top:1px solid var(--line);padding:17px 25px 20px;background:#fcfdf9}.dimension-selection{margin-right:auto;display:flex;flex-direction:column;gap:4px;min-width:0}.dimension-selection strong{font-size:12px;font-weight:600;color:#56694a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dimension-selection>span{font-size:10px;font-variant-numeric:tabular-nums;color:#92a180}.dimensions-dialog-footer .button{min-height:39px;font-size:12px}.dimensions-dialog-footer .icon{width:15px;height:15px}
@media(max-width:780px){.dimension-template{gap:7px;padding:10px 8px}.dimension-template-copy strong{font-size:11px}.dimension-template-copy>span{font-size:9px}.dimension-template-art{width:25px}.canvas-settings .setting-title .text-button{font-size:10px}.canvas-export-note{font-size:9px}}
@media(max-width:580px){.dimensions-dialog{max-width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:15px}.dimensions-dialog form{max-height:calc(100dvh - 20px)}.dimensions-dialog-header{padding:20px 18px 13px;gap:10px}.dimensions-dialog-header h2{font-size:22px}.dimensions-dialog-header p{font-size:11px;max-width:255px}.dimensions-scroll{padding:0 18px 17px}.dimensions-tabs{margin-bottom:14px}.dimensions-tabs button{font-size:11px;padding-bottom:11px}.dimension-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:20px}.dimension-card{min-height:108px;padding:9px 8px}.dimension-card-art{height:49px}.dimension-card>strong{font-size:12px}.dimension-card-size{font-size:10px}.dimension-custom-header{align-items:flex-start;gap:5px}.dimension-custom-header h3{font-size:11px}.dimension-custom-header>span{font-size:9px}.dimension-custom-fields{gap:5px}.dimension-custom-fields>.icon-button{width:27px}.dimension-custom-input{padding:0 9px}.dimension-custom-input input{font-size:13px}.dimension-custom-meta{gap:7px}.dimension-custom-meta .text-button{font-size:10px}.dimension-custom-meta p{font-size:9px}.dimension-fitting{gap:10px;align-items:flex-start;flex-direction:column}.dimension-fitting .segmented{width:100%}.dimension-fitting .segmented button{min-height:30px}.dimension-fitting p{font-size:10px}.dimension-export-exact{font-size:11px!important}.template-export-note{font-size:10px}.dimensions-dialog-footer{padding:14px 18px 15px;gap:8px;flex-wrap:wrap}.dimension-selection{width:100%;flex-direction:row;align-items:center;justify-content:space-between;margin-right:0;margin-bottom:3px;gap:8px}.dimension-selection>span{font-size:10px}.dimensions-dialog-footer .button{flex:1;min-height:41px}.dimensions-dialog-footer .secondary{flex:.65}.canvas-size-trigger{font-size:9px;gap:3px}.canvas-size-trigger .icon{width:10px;height:10px}}
@media(max-width:460px){.dimension-template{position:relative;padding:9px 8px;gap:6px}.dimension-template-art{display:none}.dimension-template-copy strong{font-size:10px}.dimension-template-copy>span{font-size:9px}.canvas-settings .setting-title .text-button{font-size:9px}.canvas-settings .setting-title{gap:6px}}

.native-select{position:absolute!important;left:-9999px!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}.custom-select{position:relative}.custom-select-btn{min-height:40px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:#fbfbf8;font-size:13px;text-align:left}.custom-select-btn:hover{background:#f4f5f1}.custom-select.open .custom-select-btn{border-color:#d3d7cb;box-shadow:0 0 0 2px var(--accent-tint)}.custom-select-list{position:absolute;left:0;right:0;top:calc(100% + 6px);max-height:240px;overflow:auto;display:grid;gap:4px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px #00000014;z-index:40}.custom-select-option{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:9px 10px;border-radius:9px;font-size:12px;text-align:left}.custom-select-option small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.custom-select-option-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-select-option-meta{flex:none;margin-left:auto;display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:2px 8px;border-radius:999px;background:#eef1e8;color:#728064;font-size:10px;font-weight:650;line-height:1.4;font-variant-numeric:tabular-nums;white-space:nowrap}.custom-select-option[data-meta-state=loading] .custom-select-option-meta{background:#f2f0e9;color:#8d8878}.custom-select-option[data-meta-state=error] .custom-select-option-meta{background:#f1f1ee;color:#92958a}.custom-select-option[data-meta-state=idle] .custom-select-option-meta{background:#f4f4f1;color:#9a9c93}.custom-select-option-badge{flex:none;margin-left:auto;padding:2px 7px;border-radius:999px;background:#eef1e8;color:#687c54;font-size:9px;font-weight:650;line-height:1.6;letter-spacing:.01em;white-space:nowrap}.custom-select-option[aria-selected=true] .custom-select-option-badge{background:#fff4ed;color:var(--accent)}.custom-select-option[aria-selected=true] .custom-select-option-meta{background:#fff1ea;color:var(--accent);opacity:1}.custom-select-option:hover,.custom-select-option[aria-selected=true]{background:#f4f5f1}.custom-select-option[aria-selected=true]{color:var(--accent)}.custom-select-arrow{transition:transform .16s}.custom-select.open .custom-select-arrow{transform:rotate(180deg)}.crop-settings{display:none!important}.crop-settings .strength-slider{margin-bottom:10px}.crop-settings output{color:#7f8478}.video-dialog{width:min(760px,calc(100vw - 26px));padding:0;border:none;border-radius:20px;background:#fff;color:inherit}.video-dialog::backdrop{background:#20251f66}.video-dialog-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr);gap:18px;padding:0 22px 8px}.video-preview-wrap{background:#f7f7f3;border:1px solid var(--line);border-radius:14px;padding:12px}.video-preview-wrap video{display:block;width:100%;max-height:360px;border-radius:10px;background:#0d0f0e}.video-fields{display:grid;align-content:start;gap:10px}.video-fields input{min-height:40px;border:1px solid var(--line);border-radius:10px;padding:0 12px;background:#fbfbf8}.asset-chip{display:inline-flex;align-items:center;gap:5px;padding:2px 6px;border-radius:999px;background:#f4f5f1;color:#7c8077;font-size:9px;text-transform:uppercase;letter-spacing:.04em;margin-left:6px} @media (max-width:860px){.video-dialog-grid{grid-template-columns:1fr}}

/* 2.2.1: ring-free controls, with soft keyboard focus fills instead of outlines. */
html.dialog-open,body.dialog-open{overflow:hidden;overscroll-behavior:none}
*:focus,*:focus-visible,*:focus-within{outline:none!important}
.switch-row input:focus-visible + .switch{outline:none!important}
.custom-select.open .custom-select-btn{box-shadow:none!important}
button:focus-visible,a:focus-visible,summary:focus-visible{background-color:#edf0e7}
input:focus-visible{box-shadow:none!important}
.project-details input:focus,.project-details input:focus-visible{outline:none!important;box-shadow:none!important;border-color:transparent!important}
.custom-select{min-width:0}.custom-select-btn{font-size:12px;color:#586d46;min-height:38px}
.custom-select-value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.custom-select-btn .icon{width:15px;height:15px;flex:none}
.custom-select-list{box-sizing:border-box;z-index:1000;overscroll-behavior:contain}
.custom-select-option{cursor:pointer;line-height:1.45;font-size:12px;min-height:37px;display:flex}
.custom-select-option[aria-selected=true]{font-weight:600;background:var(--accent-tint)}
.custom-select-option.is-active{background:#ecefe5}.custom-select-option[aria-disabled=true]{opacity:.4;pointer-events:none}
.video-fields{min-width:0}.video-fields .field-label{margin-bottom:0}.video-fields input[type=number]{width:100%;min-width:0}
.video-dialog-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.video-preview-wrap{align-self:start;min-width:0}.video-preview-wrap video{aspect-ratio:16/9;object-fit:contain;max-height:330px}
.video-fields .switch-row input{min-height:0;padding:0;border:0}.video-summary,.video-fields .encoding-help{overflow-wrap:anywhere}
#video-summary.error{color:#b94728}.crop-settings .strength-slider{width:100%}
@media(max-width:860px){.video-dialog-grid{grid-template-columns:1fr}}
@media(max-width:780px){
.inspector .timing-section{grid-column:1;grid-row:2}.inspector .crop-settings{grid-column:1;grid-row:3;border:0;padding-top:0}
.inspector .canvas-settings{grid-column:2;grid-row:2 / 4;border:0}.inspector .export-settings{grid-column:1/-1;grid-row:4}.inspector .privacy-note{grid-column:1/-1;grid-row:5}
.timeline-header{flex-wrap:wrap;gap:10px}.timeline-actions{margin-left:auto}
}
@media(max-width:460px){.custom-select-btn{font-size:11px;padding:0 9px;gap:5px}.video-dialog-grid{padding:0 17px 8px}.video-dialog .dimensions-dialog-footer{gap:8px;padding:16px}.video-dialog .dimensions-dialog-footer .button{font-size:11px;padding:0 10px}.timeline-header p{max-width:none}.timeline-actions .button.compact{font-size:11px}.history-controls{display:flex}.project-actions{gap:3px}.project-details input{width:144px}}

/* 2.3: original video clips, direct preview, non-destructive trim. */
.decoder-video{position:fixed!important;left:-10000px!important;top:0!important;width:160px!important;height:90px!important;pointer-events:none!important;opacity:.001!important}
.media-notice{position:absolute;max-width:min(430px,85%);background:#fffffff0;padding:16px 20px;border:1px solid var(--line);border-radius:12px;text-align:center;font-size:12px;color:#6a7760;box-shadow:0 5px 22px #00000008;z-index:2;line-height:1.7}.media-notice.error{color:#a4482f}
.source-position{position:absolute;bottom:17px;right:17px;font-size:9px;font-variant-numeric:tabular-nums;letter-spacing:.06em;color:#7d8971;padding:3px 7px;background:#f5f5f0df;border-radius:4px}.source-position:empty{display:none}
.asset-thumbnail{position:relative}.video-badge{position:absolute;left:5px;bottom:5px;display:flex;align-items:center;gap:4px;padding:3px 5px;border-radius:4px;background:#252e24cc;color:#fff;font-size:8px;font-weight:600;letter-spacing:.04em}.video-badge .icon{width:10px;height:10px}.missing-video{display:grid;place-items:center;color:#b6bcae}.missing-video .icon{width:28px;height:28px}
.clip-duration{height:27px;display:flex;align-items:center;gap:6px;border-radius:5px;background:#f4f6ef;width:100%;padding:0 8px;font-size:11px;color:#728460}.clip-duration .icon{width:12px;height:12px}.clip-duration>span{flex:1;text-align:right}.selected .clip-duration{background:var(--accent-tint);color:#bd6144}.video-card .frame-caption{font-weight:500}
.clip-source-info{font-size:10px;color:#8b9980;line-height:1.6;margin-bottom:15px;font-variant-numeric:tabular-nums}.clip-trim-caption{display:flex;justify-content:space-between;font-size:10px;color:#7b8b6d;margin-bottom:8px}.clip-trim-caption span:last-child{font-size:9px;color:#a0ab96}
.clip-trim-track{position:relative;height:32px;margin:2px 5px 10px;background:repeating-linear-gradient(90deg,#e7ebdf 0 6px,#edf0e7 6px 8px);border-radius:5px}.clip-trim-track>span{position:absolute;top:0;bottom:0;border-top:2px solid var(--accent);border-bottom:2px solid var(--accent);background:#e965451c;pointer-events:none}
.clip-trim-track input{appearance:none;-webkit-appearance:none;position:absolute;inset:0;width:100%;height:100%;margin:0;background:none;pointer-events:none;border:0;padding:0}.clip-trim-track input::-webkit-slider-runnable-track{height:32px;background:transparent}.clip-trim-track input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;pointer-events:auto;cursor:ew-resize;width:9px;height:32px;border-radius:3px;background:var(--accent);border:0;box-shadow:inset 0 0 0 3px var(--accent)}.clip-trim-track input::-moz-range-track{background:transparent}.clip-trim-track input::-moz-range-thumb{pointer-events:auto;cursor:ew-resize;width:9px;height:32px;border:0;border-radius:3px;background:var(--accent)}
.clip-time-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.clip-time-fields>label{font-size:10px;color:#738361}.clip-time-fields label>span{float:right;color:#a2ab98;font-size:9px}.clip-time-fields input{display:block;width:100%;height:35px;min-width:0;margin-top:5px;border:1px solid var(--line);border-radius:7px;background:#fafbf7;font:500 12px var(--sans);padding:0 10px;font-variant-numeric:tabular-nums;color:#44543b}
.clip-playhead-actions{display:flex;justify-content:space-between}.clip-playhead-actions .text-button{font-size:9px;min-height:28px}.clip-trim-status{font-size:10px;color:#7d8b6f;min-height:16px;margin-top:2px;line-height:1.5}.error{color:#b4482c!important}.clip-trim-actions{display:flex;align-items:center;justify-content:space-between;margin:8px 0 17px}.clip-trim-actions .text-button{font-size:10px}.clip-trim-actions .button{font-size:10px;min-height:30px}
.clip-fps-label{display:flex!important;justify-content:space-between}.clip-fps-label>span{font-size:9px;color:#9ba68f}.clip-file-actions{display:flex;gap:9px;align-items:center;justify-content:space-between;margin-top:8px;padding-top:9px;border-top:1px solid #edf0e7;font-size:9px;color:#9ba58f}.clip-file-actions .text-button{font-size:9px;min-height:23px}
.import-indicator{max-width:calc(100vw - 26px)}#import-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#cancel-import{margin-left:5px;flex-shrink:0;color:var(--accent);font-size:11px}
@media(min-width:781px){.inspector{max-height:calc(100dvh - 212px);min-height:460px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dce1d2 transparent}.left-column{position:sticky;top:20px}}
@media(max-width:780px){.inspector.has-clip .timing-section{grid-column:1/-1;grid-row:2}.inspector.has-clip .crop-settings{grid-column:1;grid-row:3;padding-top:16px}.inspector.has-clip .canvas-settings{grid-column:2;grid-row:3}.inspector.has-clip .export-settings{grid-row:4}.inspector.has-clip .privacy-note{grid-row:5}.clip-source-info{font-size:11px}.clip-time-fields input{height:39px;font-size:13px}.clip-trim-actions .button{min-height:34px}.clip-trim-status{font-size:11px}.source-position{font-size:8px;max-width:60%}.timeline-bottom>span{max-width:195px}.clip-trim-track{height:36px}.clip-trim-track input::-webkit-slider-thumb{height:36px;width:13px}.clip-trim-track input::-webkit-slider-runnable-track{height:36px}}

/* Decoder status fits the existing interface. Focus remains ring-free. */
#clip-file-actions{gap:10px;flex-wrap:wrap}#clip-file-actions>span{flex:1;min-width:80px}#retry-video{color:var(--accent)}#clip-compatibility-note{margin-top:9px;line-height:1.6;font-size:10px}.decoder-notices{font-size:11px;line-height:1.65;margin-top:18px;border-top:1px solid var(--line);padding-top:12px;color:#7e8775}.decoder-notices summary{cursor:pointer;font-weight:600}.decoder-notices p{margin-top:10px}.decoder-notices a{text-decoration:underline}#import-text{max-width:min(68vw,650px)}

.decoder-setup-copy{font-size:12px;line-height:1.7;color:#727b69;margin:0 0 15px}.decoder-setup-warning{font-size:10px;line-height:1.6;color:#929a89;margin:14px 0}.decoder-file-links{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.decoder-file-links a{display:flex;align-items:center;gap:8px;font-size:11px;border:1px solid var(--line);padding:9px 11px;border-radius:8px}.decoder-file-links a:hover{background:#f5f6f1}.decoder-file-links span{font-size:10px;color:#8c967f}#decoder-setup{font-size:10px}


/* Exact-size export preview, in the existing warm neutral export dialog. */
.export-size-panel{margin-top:15px;padding:14px 15px;border:1px solid #e4e9dc;border-radius:11px;background:#f7f9f3;min-width:0}
.export-size-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;color:#71865d;font-size:11px}
.export-size-heading output{font-size:19px;font-weight:650;letter-spacing:-.4px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.export-size-bytes{font-size:10px;color:#7d8b6c;margin-top:5px;line-height:1.6;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.export-size-detail{font-size:10px;color:#879476;margin-top:6px;line-height:1.6;overflow-wrap:anywhere}
.export-size-progress{display:block;width:100%;height:5px;margin-top:11px;border:0;border-radius:5px;overflow:hidden;background:#e8eddf;accent-color:var(--accent)}
.export-size-progress::-webkit-progress-bar{background:#e8eddf;border-radius:5px}.export-size-progress::-webkit-progress-value{background:var(--accent);border-radius:5px}.export-size-progress::-moz-progress-bar{background:var(--accent);border-radius:5px}
.export-size-action{display:inline-block;font-size:10px;color:#798966;margin-top:9px;padding:2px 0;text-decoration:underline;text-underline-offset:3px}
.export-size-panel[data-state=error]{border-color:#ead3c8;background:#fff8f4}.export-size-panel[data-state=error] .export-size-detail{color:#ac5334}
.export-size-panel[data-state=loading] .export-size-heading output{font-size:13px;color:#71865d;letter-spacing:0;font-weight:500}
.export-dialog{scrollbar-width:thin;scrollbar-color:#d6dbce transparent}
@media(max-width:420px){.export-size-panel{padding:12px}.export-size-heading output{font-size:18px}.export-size-bytes{font-size:9px}.export-dialog .export-footer{flex-wrap:wrap}.export-dialog .export-footer .button{min-height:42px}.export-dialog .dialog-top{margin-bottom:18px}}
