.image-workbench .workspace{align-items:stretch}.image-media{padding:0 16px}.image-stage{height:300px;min-height:220px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--border);border-radius:9px;background:repeating-conic-gradient(#f0f1ed,#f0f1ed 25%,#fafbf8 0%,#fafbf8 50%) 50%/18px 18px}.image-stage.drag{outline:2px solid var(--primary);outline-offset:2px}.image-stage>.drop{background:#f7f8f4}.frame-surface{position:relative;flex:none;max-width:100%;max-height:100%;display:flex;align-items:center;justify-content:center}.frame-surface>canvas{display:block;width:100%;height:100%;object-fit:contain}.image-stage.picking canvas{cursor:crosshair}.crop-overlay{position:absolute;border:2px solid var(--primary);box-shadow:0 0 0 5000px #282a284a;pointer-events:none}.crop-move{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;cursor:move;pointer-events:auto;touch-action:none}.crop-move:before,.crop-move:after{content:"";position:absolute;pointer-events:none;top:33%;right:0;bottom:33%;left:0;border-top:1px solid #ffffff70;border-bottom:1px solid #ffffff70}.crop-move:after{top:0;right:33%;bottom:0;left:33%;border:0;border-left:1px solid #ffffff70;border-right:1px solid #ffffff70}.crop-move:hover{background:#ffffff0d}.crop-resize{position:absolute;right:-10px;bottom:-10px;width:23px;height:23px;min-height:0;padding:0;border:2px solid white;border-radius:5px;background:var(--primary);pointer-events:auto;cursor:nwse-resize;touch-action:none;box-shadow:0 1px 5px #0002}.crop-move:focus-visible,.crop-resize:focus-visible{outline:3px solid white;outline-offset:2px}.image-playback{display:flex;align-items:center;gap:6px;margin-top:13px}.image-playback button{min-height:29px;padding:5px 10px;font-size:10px;border-radius:6px}.image-playback button .icon{width:12px;height:12px}.image-playback input{min-width:40px;flex:1;accent-color:var(--primary)}#image-frame-info{font-size:9px;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}.image-metadata{font-size:10px;color:var(--muted);margin:9px 0 16px}.image-settings #image-settings{display:flex;flex-direction:column;flex:1;min-width:0}.image-settings .export-button{margin-top:auto}.image-settings form>fieldset{margin-bottom:12px}.image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.image-field{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--muted);margin-bottom:12px;min-width:0}.image-field>input,.image-field>select{width:100%;min-height:35px;max-width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--ink);font:12px system-ui}.image-field>input[type=color]{height:39px;padding:4px;cursor:pointer}.image-field>input[aria-invalid=true]{border-color:var(--error);outline-color:var(--error)}.image-check{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);margin-bottom:14px;cursor:pointer}.image-check input{accent-color:var(--primary);width:14px;height:14px}.crop-coordinates{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.crop-coordinates .image-field>input{padding:7px;font-size:11px}.crop-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 14px}.crop-actions button{font-size:10px;min-height:28px;padding:5px 10px}.crop-actions .text-button{padding-right:0}.image-estimate{font-size:10px;line-height:1.7;color:var(--muted);margin:0 0 12px;min-height:32px}.image-settings .selection-info{margin-top:8px}#image-status{font-size:11px;min-height:34px;line-height:1.6;margin:10px 0 0;color:var(--muted);overflow-wrap:anywhere}#image-status.error{color:var(--error)}.live-crop{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding:12px 0;margin-top:8px;min-height:96px}.live-crop>div{display:flex;flex-direction:column;gap:7px;font-size:11px;color:#62675c}.live-crop span{font-size:10px;color:var(--muted)}.live-crop canvas{max-width:115px;max-height:85px;border:1px solid var(--border);border-radius:5px;object-fit:contain;background:repeating-conic-gradient(#e5e8e0,#e5e8e0 25%,#fff 0%,#fff 50%) 50%/12px 12px}.image-sequence{border-top:1px solid var(--border);margin:4px 0 12px;padding-top:10px}.sequence-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.sequence-heading h2{font-size:12px;margin:0}.image-sequence ol{list-style:none;padding:0;margin:5px 0 0;max-height:155px;overflow:auto}.image-sequence li{display:flex;align-items:center;gap:6px;padding:6px 0;border-bottom:1px solid var(--border);font-size:10px;line-height:1.5}.image-sequence li>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-sequence li>button{padding:3px 8px;min-height:24px;font-size:12px;border-radius:5px}.image-workbench .result{margin-top:18px}.image-workbench .result-preview{background:repeating-conic-gradient(#e9ece5,#e9ece5 25%,#fff 0%,#fff 50%) 50%/16px 16px}.tool-article{max-width:950px;margin:40px auto 0}.tool-article h2{font-size:21px;margin:28px 0 14px}.tool-article p,.tool-instructions li{font-size:13px;line-height:1.9}.tool-instructions{padding-left:23px}.tool-instructions li{padding:5px 0 5px 6px}.tool-article details{padding:16px 0}.image-settings .control-group{margin-bottom:13px}.image-settings .control-group legend{font-size:11px}.image-settings .segment>span{font-size:10px}.image-settings #image-pick{width:100%;margin-bottom:14px;min-height:32px;font-size:11px}.image-settings .engine-note{font-size:9px;text-align:left;line-height:1.6;margin-top:7px}.image-settings .tiny-note{font-size:10px;line-height:1.6}@media(max-width:1000px)and (min-width:761px){.image-workbench .workspace{grid-template-columns:minmax(0,1.2fr) minmax(310px,1fr)}.image-stage{height:280px}.image-playback{flex-wrap:wrap}#image-frame-info{flex-basis:100%}}@media(max-width:760px){.image-workbench .workspace{grid-template-columns:1fr}.image-stage{height:260px;min-height:220px}.image-media{padding:0 12px}.image-playback{gap:5px}.image-playback button{min-height:36px;padding:6px 9px;font-size:11px}.image-playback input{min-width:30px}#image-frame-info{font-size:9px}.image-metadata{font-size:10px}.image-field{font-size:12px}.image-field>input,.image-field>select{min-height:42px;font-size:13px}.image-check{font-size:12px;min-height:28px}.image-settings .control-group legend{font-size:12px}.image-settings .segment>span{font-size:11px}.crop-coordinates{grid-template-columns:repeat(2,minmax(0,1fr))}.crop-actions button{font-size:11px}.image-settings .engine-note{font-size:10px}#image-status{font-size:12px}.image-estimate{font-size:11px}.tool-article{margin-top:30px}.tool-article p,.tool-instructions li{font-size:13px}.live-crop{min-height:90px}}
