.exif-tool{--text:var(--ink);--muted:var(--ink-soft);--border:var(--line);--surface-soft:color-mix(in srgb, var(--paper) 95%, #399c8b);color:var(--text)}.exif-workspace{border:1px solid var(--border);border-radius:22px;padding:24px}.exif-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px;display:flex}.exif-header h2{margin:0 0 8px;font-size:20px;font-weight:600}.exif-header p{color:var(--muted);margin:5px 0;font-size:14px}.exif-filename{overflow-wrap:anywhere}.exif-header>div{min-width:0}.exif-header button{flex-shrink:0}.exif-columns{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:24px;display:grid}.exif-preview{background:var(--surface-soft);border-radius:16px;justify-content:center;align-items:center;min-height:200px;max-height:400px;padding:16px;display:flex;overflow:hidden}.exif-preview img{object-fit:contain;border-radius:8px;max-width:100%;max-height:360px;display:block}.exif-metadata{min-width:0}.exif-tool h3{margin:0 0 12px;font-size:16px;font-weight:600}.exif-metadata dl{max-height:340px;margin:0;overflow:auto}.exif-metadata dl>div{border-bottom:1px solid var(--border);grid-template-columns:140px minmax(0,1fr);gap:12px;padding:9px 0;font-size:14px;display:grid}.exif-metadata dt{color:var(--muted)}.exif-metadata dd{overflow-wrap:anywhere;white-space:pre-wrap;margin:0}.exif-tool p{line-height:1.7}.exif-note{color:var(--muted);font-size:13px}.exif-summary{background:var(--surface-soft);overflow-wrap:anywhere;border-radius:16px;margin-top:24px;padding:18px}.exif-summary p{margin:6px 0;font-size:14px}.exif-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:16px;margin-top:20px;display:flex}.exif-actions p{color:var(--muted);margin:0;font-size:14px}.exif-actions .primary-button{color:#fff;font:inherit;cursor:pointer;background:linear-gradient(135deg,#ff7c39,#f45b1e);border:0;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:13px 20px;font-weight:600;display:inline-flex}.exif-status{align-items:center;gap:8px;padding:16px;display:flex}.exif-error{border:1px solid #d98b77;border-radius:14px;margin-top:16px;padding:16px}.exif-error p{margin:0}@media (max-width:640px){.exif-workspace{padding:16px}.exif-columns{grid-template-columns:1fr;gap:18px}.exif-header{flex-wrap:wrap}.exif-metadata dl>div{grid-template-columns:110px minmax(0,1fr)}.exif-actions{justify-content:stretch}.exif-actions button{width:100%}}
