.ims { --ims-rail: 26rem; color:var(--text); padding-bottom:var(--sp-6); container-type:inline-size; }
.app .ims { padding:var(--sp-4) var(--content-inset,var(--sp-6)) var(--sp-6); }
.ims-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--sp-6); padding:var(--sp-2) 0 var(--sp-6); }
.ims-eyebrow { font-size:var(--fs-caption); letter-spacing:.16em; font-weight:700; color:var(--muted); margin-bottom:var(--sp-2); }
.ims-heading h2 { font-size:var(--fs-page); letter-spacing:-.04em; font-weight:650; margin:0 0 var(--sp-2); }
.ims-heading p:not(.ims-eyebrow),.ims-help { color:var(--muted);font-size:var(--fs-small);line-height:1.7; }
.ims-private { display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-caption);white-space:nowrap;color:var(--muted); }
.ims [hidden] { display:none !important; }
.ims svg { width:1.1em;height:1.1em;flex:none; }
.ims-tabs { display:flex;border-bottom:1px solid var(--line);gap:var(--sp-6);overflow:auto;margin-bottom:var(--sp-6); }
.ims-tabs button { background:none;border:0;border-bottom:2px solid transparent;display:flex;gap:var(--sp-2);align-items:center;white-space:nowrap;padding:var(--sp-3) 0;border-radius:0;color:var(--muted);font-size:var(--fs-body); }
.ims-tabs button.active { color:var(--text);border-bottom-color:var(--text);font-weight:650; }
.ims-workspace { display:grid;grid-template-columns:minmax(19rem,var(--ims-rail)) minmax(0,1fr);align-items:start;gap:var(--sp-8); }
.ims fieldset { border:0;min-width:0;display:grid;gap:var(--sp-4); }
.ims-input { min-width:0; }
.ims fieldset:disabled { opacity:.65; }
.ims h3 { margin:0;font-size:var(--fs-body);font-weight:650; }
.ims-input h3:not(:first-child) { margin-top:var(--sp-3); }
.ims-drop { border:1px dashed var(--line-strong);background:var(--panel2);position:relative; }
.ims-drop label { display:flex;align-items:center;flex-direction:column;gap:var(--sp-2);padding:var(--sp-8) var(--sp-4);cursor:pointer;text-align:center; }
.ims-drop label>svg { font-size:var(--fs-page);margin-bottom:var(--sp-2); }
.ims-drop label span { font-size:var(--fs-caption);color:var(--muted); }
.ims-drop input { position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer; }
.ims-drop:focus-within { outline:2px solid var(--brand);outline-offset:2px; }
.ims-list-head,.ims-help-row { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);font-size:var(--fs-small); }
.ims-list-head>div { display:flex;gap:var(--sp-1); }
.ims-help-row>span { color:var(--muted);font-size:var(--fs-small); }
.ims-help-row>button { flex:none; }
.ims-file-list { list-style:none;max-height:21rem;overflow:auto; }
.ims-file-list li { display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--line);min-width:0; }
.ims-file-list img { object-fit:contain;background:var(--panel2);flex:none; }
.ims-file-list li>div:first-of-type { flex:1;min-width:0; }
.ims-file-list b { display:block;font-size:var(--fs-small);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500; }
.ims-file-list span { color:var(--muted);font-size:var(--fs-caption); }
.ims-file-actions { display:flex;gap:var(--sp-1); }
.ims .ims-file-actions button { padding:var(--sp-2); }
.ims-no-files { color:var(--muted);font-size:var(--fs-caption); }
.ims-fields { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3); }
.ims-field { display:flex;flex-direction:column;gap:var(--sp-2);min-width:0;font-size:var(--fs-small); }
.ims-field>span { color:var(--text-soft); }
.ims-field input,.ims-field select,.ims-field textarea { width:100%;max-width:100%;min-width:0;font:inherit;color:var(--text);padding:var(--sp-3);border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm); }
.ims-field input:disabled,.ims-field select:disabled { color:var(--muted);background-color:var(--panel2);cursor:not-allowed; }
.ims-field input[type=color] { height:2.7rem;padding:var(--sp-1); }
.ims-field input[type=file] { font-size:var(--fs-caption); }
.ims-field textarea { resize:vertical;line-height:1.8; }
.ims-field input:focus-visible,.ims-field textarea:focus-visible,.ims-field select:focus-visible { outline:2px solid var(--brand);outline-offset:1px; }
.ims-field small { font-size:var(--fs-caption);color:var(--muted); }
.ims-checks { display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-5); }
.ims-check { display:flex;gap:var(--sp-2);align-items:center;font-size:var(--fs-small);cursor:pointer; }
.ims-check input { width:1rem;height:1rem;accent-color:var(--brand); }
.ims-presets { display:flex;flex-wrap:wrap;gap:var(--sp-2); }
.ims-presets button { font-size:var(--fs-caption);padding:var(--sp-2) var(--sp-3);background:var(--panel2);border:1px solid var(--line);color:var(--text-soft);border-radius:var(--r-sm); }
.ims-details { border-top:1px solid var(--line);padding-top:var(--sp-4);font-size:var(--fs-small); }
.ims-details summary { cursor:pointer;margin-bottom:var(--sp-3);font-weight:550; }
.ims-details>.ims-field { margin-top:var(--sp-3); }
.ims-override { padding:var(--sp-3) 0;border-bottom:1px solid var(--line); }
.ims-override>b { display:block;margin-bottom:var(--sp-3);word-break:keep-all; }
.ims-size-checks { border:1px solid var(--line);background:var(--panel2);padding:var(--sp-3);font-size:var(--fs-small);line-height:1.6;min-width:0; }
.ims-size-checks>summary { cursor:pointer;word-break:keep-all; }
.ims-size-checks>summary>b,.ims-size-checks>b { font-weight:650; }
.ims-size-checks .ims-check-summary { margin:var(--sp-2) 0;color:var(--muted);font-size:var(--fs-caption);word-break:keep-all; }
.ims-size-checks .ims-issues { list-style:none;margin:var(--sp-2) 0 0;padding:0;max-height:24rem;overflow:auto;overscroll-behavior:contain; }
.ims-size-checks .ims-issue { display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:var(--sp-2);padding:var(--sp-2) 0;border-top:1px solid var(--line);word-break:keep-all;overflow-wrap:break-word; }
.ims-size-checks .ims-issue:first-child { border-top:0; }
.ims-size-checks .ims-issue>div { min-width:0; }
.ims-size-checks .ims-issue b { display:block;font-weight:550; }
.ims-size-checks .ims-issue p { margin:0;color:var(--muted);font-size:var(--fs-caption); }
.ims-size-checks [data-issue-line] { flex:none;white-space:nowrap;font-size:var(--fs-caption);padding:var(--sp-1) var(--sp-2); }
.ims-size-checks .ims-type-picks { display:grid;gap:var(--sp-2);max-height:24rem;overflow:auto;overscroll-behavior:contain;margin-top:var(--sp-3); }
.ims-size-checks .ims-type-picks label { display:grid;grid-template-columns:minmax(0,1fr) minmax(7rem,auto);align-items:center;gap:var(--sp-3);padding-block:var(--sp-2);border-top:1px solid var(--line);min-width:0; }
.ims-size-checks .ims-type-picks label>span { min-width:0;word-break:keep-all;overflow-wrap:break-word; }
.ims-size-checks .ims-type-picks select { max-width:100%;min-width:0;font:inherit;color:var(--text);border:1px solid var(--line);background:var(--panel);border-radius:var(--r-sm);padding:var(--sp-2); }
.ims-output { min-width:0;position:sticky;top:var(--sp-4); }
.ims-output-head { display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);padding-bottom:var(--sp-4); }
.ims-output-head p { font-size:var(--fs-caption);color:var(--muted);margin-top:var(--sp-1); }
.ims-output-head button { flex:none; }
.ims-result-search { margin-bottom:var(--sp-3); }
.ims-result-tabs { display:flex;gap:var(--sp-2);overflow:auto;padding-bottom:var(--sp-3); }
.ims-result-tabs:empty { padding:0; }
.ims-result-tabs button { border:1px solid var(--line);background:var(--panel);color:var(--muted);font-size:var(--fs-caption);padding:var(--sp-2) var(--sp-3);white-space:nowrap; }
.ims-result-tabs button.active { border-color:var(--text);color:var(--text); }
.ims-preview { min-height:31rem;max-height:calc(100vh - 15rem);overflow:auto;background:var(--panel2);border:1px solid var(--line);padding:var(--sp-6);text-align:center; }
.ims-preview>img { display:block;max-width:100%;height:auto;margin:auto;background:white;box-shadow:var(--shadow-sm); }
.ims-preview-tools { display:flex;justify-content:flex-end;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-4); }
.ims-preview-tools a { display:flex;align-items:center;gap:var(--sp-2);color:var(--text-soft);font-size:var(--fs-caption);text-decoration:none; }
.ims .ims-live-controls { margin:0 0 var(--sp-2);padding:var(--sp-2) var(--sp-3);gap:var(--sp-1);border:1px solid var(--line);background:var(--panel); }
.ims-live-controls:focus-visible { outline:2px solid var(--brand);outline-offset:2px; }
.ims-live-title { display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2) var(--sp-3);text-align:left; }
.ims-live-title>b { font-size:var(--fs-small);white-space:nowrap; }
.ims-live-title>button { margin-left:auto;flex:none; }
.ims-live-title>.ims-check { flex:none;white-space:nowrap; }
.ims #imsTypographyScope { flex:1 1 auto;min-width:0;font-size:var(--fs-caption);line-height:1.5;color:var(--muted);word-break:keep-all;overflow-wrap:break-word; }
.ims-live-adjust { display:grid;grid-template-columns:minmax(calc((var(--sp-6) + var(--sp-5)) * 4 + var(--sp-1) * 3),1.5fr) repeat(2,minmax(0,1fr));align-items:end;gap:var(--sp-1) var(--sp-3); }
.ims-nudges { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-1);min-width:0; }
.ims .ims-nudges button { display:flex;align-items:center;justify-content:center;min-width:0;min-height:calc(var(--sp-6) + var(--sp-5));padding:var(--sp-2) var(--sp-1);border:1px solid var(--line);background:var(--panel2); }
.ims-live-adjust .ims-field>span { white-space:nowrap; }
.ims-live-adjust .ims-field input[type=number] { padding:var(--sp-2);min-height:calc(var(--sp-6) + var(--sp-5));font-variant-numeric:tabular-nums; }
.ims .ims-font-slider { grid-column:1 / -1;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--sp-3); }
.ims .ims-font-choice { grid-column:1 / -1;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--sp-3); }
.ims-font-choice select { padding:var(--sp-2); }
.ims-font-slider>span { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3); }
.ims-font-slider output { flex:none;color:var(--muted);font-variant-numeric:tabular-nums; }
.ims .ims-font-slider input[type=range] { accent-color:var(--brand);padding:0;border:0;min-height:var(--sp-6);background:transparent;cursor:pointer; }
.ims-live-controls>.ims-help { margin:0;font-size:var(--fs-caption);line-height:1.4;text-align:left; }
.ims #imsLiveStatus { flex:1 1 12rem;min-width:0;color:var(--muted);font-size:var(--fs-caption);line-height:1.5;text-align:left;word-break:keep-all; }
.ims #imsLiveStatus.ims-error { color:var(--red); }
.ims-live-canvas { position:relative;display:block;width:min(100%,45rem);max-width:100%;aspect-ratio:1;margin-inline:auto;background:white;box-shadow:var(--shadow-sm); }
.ims-image-canvas { position:relative;display:block;width:min(100%,var(--ims-image-width));max-width:100%;margin-inline:auto;background:white;box-shadow:var(--shadow-sm); }
.ims-preview[data-preview-scale="fit"] .ims-live-canvas { width:min(100%,45rem); }
.ims-preview[data-preview-scale="fit"] .ims-image-canvas { width:min(100%,var(--ims-image-width)); }
.ims-preview[data-preview-scale]:not([data-preview-scale="fit"]) :is(.ims-live-canvas,.ims-image-canvas) { max-width:none; }
.ims-preview-viewport { max-height:clamp(20rem,62dvh,48rem);overflow:auto;overscroll-behavior:contain;min-width:0; }
.ims-preview-scale { display:flex;align-items:center;gap:var(--sp-2);flex:none;font-size:var(--fs-caption);white-space:nowrap; }
.ims-preview-scale select { min-width:0;max-width:100%;font:inherit;color:var(--text);padding:var(--sp-2);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel); }
.ims-preview-scale select:focus-visible,.ims-size-checks select:focus-visible { outline:2px solid var(--brand);outline-offset:1px; }
.ims :is(.ims-live-canvas,.ims-image-canvas)>img { display:block;width:100%;height:auto; }
.ims .ims-guide-overlay { position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;fill:none;stroke:var(--brand);stroke-width:1; }
.ims-guide-overlay .ims-guide-center { stroke-dasharray:5 5; }
.ims-guide-overlay .ims-guide-region { stroke-dasharray:3 4; }
.ims-guide-overlay .ims-guide-text { fill:none;stroke:var(--green);stroke-dasharray:none; }
.ims-guide-overlay rect,.ims-guide-overlay path { vector-effect:non-scaling-stroke; }
.ims-guide-overlay .ims-guide-label { fill:var(--brand);stroke:white;stroke-width:3;paint-order:stroke;font-size:var(--fs-caption);font-family:inherit; }
.ims-preview[data-live-state=pending] .ims-live-canvas,.ims-preview[data-live-state=error] .ims-live-canvas { opacity:.5; }
.ims-output:has(.ims-live-controls)>.ims-output-head { padding-bottom:var(--sp-2); }
.ims-output:has(.ims-live-controls)>.ims-result-search { margin-bottom:var(--sp-2); }
.ims-output:has(.ims-live-controls)>.ims-result-search input { padding-block:var(--sp-2); }
.ims-output:has(.ims-live-controls)>.ims-result-tabs { padding-bottom:var(--sp-2); }
.ims-preview:has(.ims-preview-viewport) { min-height:0;max-height:none;overflow:hidden;padding:var(--sp-3); }
.ims-preview:has(.ims-preview-viewport)>.ims-preview-tools { align-items:center;gap:var(--sp-2) var(--sp-3);margin-bottom:var(--sp-2); }
.ims-empty { min-height:25rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-3);color:var(--muted);padding:var(--sp-8);text-align:center; }
.ims-empty>svg { font-size:var(--fs-display);color:var(--line-strong);margin-bottom:var(--sp-3); }
.ims-empty h3 { font-size:var(--fs-title);font-weight:500;color:var(--text-soft); }
.ims-empty p { font-size:var(--fs-small); }
.ims-actionbar { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);position:sticky;bottom:0;background:var(--panel);border-top:1px solid var(--line);padding:var(--sp-4) 0;margin-top:var(--sp-6);z-index:5; }
.ims-actionbar>div:last-child { display:flex;gap:var(--sp-2);flex:none; }
.ims-actionbar>div:first-child { min-width:0; }
.ims-actionbar p { font-size:var(--fs-small); }
.ims #imsPlan { font-size:var(--fs-caption);line-height:1.5; }
.ims #imsPlan.ims-error { color:var(--red); }
.ims #imsPlan:empty,.ims #imsProgress:empty { display:none; }
.ims-error { color:var(--red); }
.ims button { cursor:pointer; }
.ims button:focus-visible,.ims a:focus-visible,.ims summary:focus-visible { outline:2px solid var(--brand);outline-offset:2px; }
.ims button:not(:disabled):active { transform:scale(.97); }
.ims button:disabled { cursor:default;opacity:.45; }
.ims p,.ims h2,.ims h3,.ims label { word-break:keep-all; }
@media(max-width:1050px){.ims-workspace{--ims-rail:22rem;gap:var(--sp-5)}.ims-file-actions{flex-direction:column}.ims-heading{align-items:flex-start;flex-direction:column;gap:var(--sp-3)}}
@container(max-width:720px){.ims-workspace{grid-template-columns:1fr}.ims-output{position:static}.ims-preview{min-height:18rem}.ims-empty{min-height:14rem}}
@container(max-width:960px){.ims-workspace{grid-template-columns:1fr}.ims-workspace>.ims-output{position:static}}
@media(min-width:761px){.ims-live-adjust>.ims-field:not(.ims-font-slider){flex-direction:row;align-items:center;gap:var(--sp-2)}}
@media(max-width:1050px){.ims #imsTypographyScope{flex-basis:100%;order:2}}
@media(max-width:760px){.ims-live-adjust{grid-template-columns:repeat(2,minmax(0,1fr))}.ims-nudges{grid-column:1 / -1;gap:var(--sp-2)}.ims-live-title{gap:var(--sp-2)}.ims-live-title>button{margin-left:auto}.ims .ims-live-controls{padding:var(--sp-2)}.ims .ims-font-slider{gap:var(--sp-2)}.ims .ims-font-slider input[type=range]{min-height:calc(var(--sp-6) + var(--sp-5))}}
@media(max-width:760px){.ims-workspace{grid-template-columns:1fr}.ims-heading h2{font-size:var(--fs-title)}.ims-tabs{gap:var(--sp-5)}.ims-output{position:static}.ims-preview{min-height:17rem;max-height:36rem;padding:var(--sp-3)}.ims-empty{min-height:14rem;padding:var(--sp-4)}.ims-actionbar{align-items:center}.ims-actionbar>div:first-child>span.ims-help{display:none}.ims-file-actions{flex-direction:row}.ims-field textarea{height:17rem;min-height:12rem}.ims button,.ims-preview-tools a,.ims-details summary{min-height:calc(var(--sp-6) + var(--sp-5))}.ims-details summary{padding-block:var(--sp-3);margin-bottom:var(--sp-2)}.ims-field select,.ims-field input:not([type=color]){min-height:calc(var(--sp-6) + var(--sp-5))}.app .ims-actionbar{bottom:calc(65px + env(safe-area-inset-bottom));padding-block:var(--sp-3)}}
