/* Hallmark · macrostructure: Workbench · genre: modern-minimal
 * Theme: existing LumHub warm paper/orange and dark tokens; shared chrome retained.
 * Audience: 360 photographers and editors · use: restore metadata locally.
 * Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V4 */
html:has(.spatial),body:has(.spatial){overflow-x:clip}
.spatial{padding-bottom:64px;--spatial-grid:var(--color-rule);min-width:0}
.spatial [hidden]{display:none!important}.spatial *{min-width:0}.spatial h1,.spatial h2,.spatial h3{overflow-wrap:anywhere}
.spatial-nav{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--color-rule);font-size:.85rem}.spatial-nav a,.spatial-heading a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}.spatial-nav span{color:var(--color-muted);align-self:center}
.spatial-heading{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:48px;align-items:center;padding:48px 0 40px}.spatial-eyebrow{font-size:.76rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--color-accent);margin:0 0 14px}.spatial-heading h1{font:500 clamp(2rem,3.5vw,3.6rem)/1.1 var(--font-display);letter-spacing:-.045em;margin:0;max-width:25ch}.spatial-equivalent{font-size:.84rem;color:var(--color-muted);margin:14px 0}.spatial-intro{max-width:60ch;line-height:1.7;font-size:1.08rem}.spatial-heading a{font-size:.88rem}.spatial-art{margin:0;border:1px solid var(--color-rule);background:var(--color-soft);border-radius:var(--radius-md);overflow:clip}.spatial-art img{width:100%;height:auto;display:block}.spatial-art figcaption{padding:12px 18px;border-top:1px solid var(--color-rule);font-size:.8rem;color:var(--color-muted)}
.spatial-workbench{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);border:1px solid var(--color-rule);border-radius:var(--radius-md);background:var(--color-surface);overflow:clip}.spatial-input,.spatial-settings{padding:30px}.spatial-settings{border-left:1px solid var(--color-rule)}.spatial-section-title{display:flex;gap:14px;align-items:baseline}.spatial-section-title>span{font:500 .85rem var(--font-display);color:var(--color-accent);flex:none}.spatial-section-title h2{font:500 1.3rem/1.3 var(--font-display);margin:0}.spatial-input>p{color:var(--color-muted);font-size:.9rem;line-height:1.6}.spatial-drop{border:1px dashed var(--color-rule);background:var(--color-paper);padding:24px 18px;display:flex;align-items:center;flex-direction:column;gap:14px;border-radius:var(--radius-sm);text-align:center}.spatial-drop[data-drag]{outline:2px solid var(--color-focus);outline-offset:-2px}.spatial-drop>svg{width:62px;height:62px;fill:none;stroke:var(--color-accent);stroke-width:1}.spatial-drop strong{font:500 1rem var(--font-display)}.spatial-drop small{color:var(--color-muted);line-height:1.5;max-width:35ch}.spatial-drop input{width:100%;max-width:280px;font-size:.8rem;color:var(--color-muted)}.spatial-drop input::file-selector-button{display:none}.spatial-drop:focus-within{outline:2px solid var(--color-focus);outline-offset:3px}.spatial-filename{overflow-wrap:anywhere}.spatial-preview{margin:20px 0}.spatial-preview img{display:block;width:100%;height:auto;max-height:260px;object-fit:contain;border-radius:var(--radius-sm);background:var(--color-soft)}.spatial-preview figcaption{font-size:.78rem;color:var(--color-muted);margin-top:8px}
.spatial-facts{margin:18px 0 0;font-size:.85rem}.spatial-facts>div{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--color-rule);padding:10px 0}.spatial-facts dt{color:var(--color-muted)}.spatial-facts dd{margin:0;text-align:right;overflow-wrap:anywhere}.spatial-projection{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding:14px 0;margin:18px 0;border-block:1px solid var(--color-rule);font-size:.88rem}.spatial-projection span{color:var(--color-muted)}
.spatial fieldset{border:0;padding:0;margin:0}.spatial fieldset label:not(.spatial-confirm){display:block;font-weight:500;font-size:.9rem;margin:18px 0 10px}.spatial input[type=number],.spatial select{width:100%;border:1px solid var(--color-rule-strong);background:var(--color-paper);color:var(--color-ink);padding:12px;border-radius:var(--radius-sm);font:inherit;min-height:46px}.spatial input[type=number]{max-width:200px}.spatial-hint{font-size:.83rem;color:var(--color-muted);line-height:1.6}.spatial-confirm{display:flex;gap:12px;align-items:flex-start;font-size:.89rem;line-height:1.6;margin:26px 0}.spatial-confirm input{width:20px;height:20px;flex:none;margin-top:3px;accent-color:var(--color-accent)}.spatial-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.spatial .button{white-space:nowrap;min-height:46px;font-size:.86rem;padding-inline:18px}.spatial button:disabled{opacity:.55;cursor:not-allowed}.spatial-clear{border:0;background:none;color:var(--color-muted);font:inherit;font-size:.85rem;min-height:44px;white-space:nowrap;text-decoration:underline;padding:10px}.spatial-status{font-size:.87rem;line-height:1.6;color:var(--color-muted);margin-bottom:0;overflow-wrap:anywhere}.spatial-status[data-error]{color:var(--color-error)}
.spatial-result{border:1px solid var(--color-success);border-left:4px solid var(--color-success);padding:28px;margin-top:24px;border-radius:var(--radius-sm);background:var(--color-surface)}.spatial-result>p{font-size:.9rem;line-height:1.7;overflow-wrap:anywhere}.spatial-result pre{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere;padding:16px;background:var(--color-soft);font-size:.78rem}.spatial summary{cursor:pointer;min-height:44px;padding-block:12px;font-size:.88rem}.spatial-notes{margin-top:24px;padding:24px;background:var(--color-soft);border-radius:var(--radius-sm)}.spatial-notes h2{font:500 1.1rem var(--font-display);margin:0}.spatial-notes li{font-size:.87rem;line-height:1.7;margin:12px 0}.spatial-notes li[data-warning]{color:var(--color-error)}
.spatial-guide{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:64px;border-top:1px solid var(--color-rule);padding-top:48px;margin-top:56px;scroll-margin-top:100px}.spatial-guide h2{font:500 clamp(1.35rem,2.3vw,2rem)/1.25 var(--font-display);letter-spacing:-.025em;margin:0 0 18px}.spatial-guide h3{font:500 1.08rem var(--font-display);margin-top:30px}.spatial-guide p,.spatial-guide li{font-size:.92rem;line-height:1.8;color:var(--color-muted)}.spatial-guide ol{padding-left:22px}.spatial-guide ol li{padding-left:8px;margin-bottom:14px}.spatial-reference section+section{border-top:1px solid var(--color-rule);padding-top:26px;margin-top:26px}.spatial-reference h2{font-size:1.12rem}.spatial-sources ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:4px 20px}.spatial-sources a{display:inline-flex;align-items:center;min-height:44px;font-size:.8rem;white-space:nowrap}.spatial-related{padding-top:30px;border-top:1px solid var(--color-rule);margin-top:40px}.spatial-related h2{font:500 1.25rem var(--font-display)}.spatial-related p{color:var(--color-muted);font-size:.9rem}.spatial-related>div{display:flex;flex-wrap:wrap;gap:12px 28px}.spatial-related a{display:flex;align-items:center;gap:10px;min-height:44px;font-size:.87rem;white-space:nowrap}.spatial-related svg{width:20px;height:20px}
.spatial-drop input[type=file]{position:absolute;width:1px;height:1px;max-width:1px;padding:0;border:0;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
@media(max-width:900px){.spatial-heading{gap:24px}.spatial-guide{gap:32px}.spatial-input,.spatial-settings{padding:24px}}
@media(max-width:700px){.spatial-nav{flex-direction:column;gap:0}.spatial-nav span{align-self:flex-start;font-size:.75rem}.spatial-heading{grid-template-columns:minmax(0,1fr);padding:30px 0;gap:22px}.spatial-heading h1{font-size:clamp(1.9rem,7.5vw,2.6rem)}.spatial-art{display:none}.spatial-workbench,.spatial-guide{grid-template-columns:minmax(0,1fr)}.spatial-input,.spatial-settings{padding:20px}.spatial-settings{border-left:0;border-top:1px solid var(--color-rule)}.spatial-guide{gap:32px;padding-top:32px;margin-top:36px}.spatial-result{padding:20px}.spatial-sources a{font-size:.74rem}.spatial-notes{padding:20px}.spatial-facts>div{gap:10px}.spatial-facts dd{max-width:58%}}
@media(prefers-reduced-motion:reduce){.spatial *{scroll-behavior:auto;transition:none;animation:none}}