:root{color-scheme:light;--bg:#f6f8fb;--surface:#fff;--ink:#192421;--muted:#64716c;--line:#dfe6e4;--accent:#008c82;--soft:#e7f4f1;font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none}
*{box-sizing:border-box;letter-spacing:0}body{margin:0;min-width:280px}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}svg{width:19px;height:19px;stroke-width:1.7;flex-shrink:0}[hidden]{display:none!important}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #40b8aa;outline-offset:3px}
.topbar{height:72px;display:flex;align-items:center;gap:26px;padding:0 32px;background:var(--surface);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:650;white-space:nowrap}.brand svg{width:29px;height:29px;color:var(--accent)}h1{font-size:16px;font-weight:600;padding-left:25px;margin:0;border-left:1px solid var(--line);line-height:24px;white-space:nowrap}.back-link{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);min-height:44px;white-space:nowrap}
.workspace{display:grid;grid-template-columns:345px minmax(0,1fr);gap:32px;max-width:1240px;margin:0 auto;padding:32px;min-height:calc(100svh - 132px)}
.controls{padding-right:30px;border-right:1px solid var(--line);min-width:0}.section-label{display:block;font-size:14px;font-weight:650;line-height:1.5;margin:22px 0 12px}textarea,input,select{color:var(--ink);background:var(--surface);border:1px solid #cdd7d3;border-radius:5px;font-size:16px;line-height:22px;min-width:0}textarea{width:100%;padding:11px 12px;resize:vertical;min-height:106px;max-height:280px;margin-bottom:10px}input,select{height:42px;padding:8px 10px;width:100%}input::placeholder,textarea::placeholder{color:#7b8580}input::placeholder{font-size:12px}select{padding-right:26px}input:disabled,select:disabled{background:#edf1ef;color:#829087}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;border:1px solid transparent;border-radius:5px;font-size:13px;font-weight:550;line-height:20px;white-space:nowrap}.primary{background:var(--accent);color:white}.primary:hover{background:#00776f}.secondary{background:white;border-color:#bfcfca;color:#176c62}.secondary:hover{background:var(--soft)}.text-button{border:0;background:none;padding:8px 4px;min-height:40px;font-size:12px;color:var(--muted)}
.segmented{display:flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:5px;background:white}.segmented button{flex:1;min-height:34px;border:0;border-radius:3px;background:none;font-size:12px;color:var(--muted);padding:6px 10px}.segmented button[aria-pressed=true]{background:var(--soft);color:#006e64;font-weight:650}
.parse-status,.status{font-size:12px;line-height:1.65;color:var(--muted);white-space:pre-line;overflow-wrap:anywhere;margin:12px 0;min-height:20px}.error{color:#ae3e2c}.parse-status.warning{color:#956321}.condition-section{border-bottom:1px solid var(--line);margin-bottom:23px}
fieldset{border:0;margin:24px 0 0;padding:0;min-width:0}legend{font-size:14px;font-weight:650;margin-bottom:18px;padding:0}.field-row{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:12px;margin-bottom:13px}.field-row>label{font-size:12px;line-height:1.5}.size-input{display:grid;grid-template-columns:minmax(0,1fr) 76px;gap:8px}.size-input select{font-size:14px;padding-left:9px}.dimensions{padding-left:102px;display:grid;gap:10px;margin:0 0 16px}.dimensions label{display:grid;grid-template-columns:28px minmax(0,1fr) 18px;align-items:center;gap:7px;font-size:12px}.checkbox-row{display:flex;align-items:center;gap:9px;font-size:12px;line-height:1.5;margin:21px 0}.checkbox-row input{width:17px;height:17px;flex-shrink:0;accent-color:var(--accent)}.note{font-size:11px;color:var(--muted);line-height:1.6;margin:11px 0}.convert-actions{display:flex;gap:8px;margin-top:24px}.convert-actions>.primary{flex:1}
.image-section{min-width:0}.image-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.image-toolbar h2{font-size:15px;font-weight:650;margin:0}.image-commands{display:flex;gap:14px;align-items:center}.preview{aspect-ratio:4/3;max-height:570px;min-height:240px;display:flex;justify-content:center;align-items:center;overflow:hidden;background:#edf1f0}.preview img{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.preview.dragging{outline:2px solid var(--accent);outline-offset:-2px;background:var(--soft)}.empty{display:flex;align-items:center;flex-direction:column;gap:16px;color:#82958d}.empty>svg{width:38px;height:38px;stroke-width:1.3}.file-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 0 18px;border-bottom:1px solid var(--line);min-width:0}#filename{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}#photo-credit{font-size:10px;color:var(--muted);flex-shrink:0}
.result-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}.metadata{margin:0;display:grid;gap:10px;min-width:0}.metadata>div{display:flex;gap:15px;align-items:baseline;font-size:12px;line-height:1.5}.metadata dt{color:var(--muted);width:25px;flex-shrink:0}.metadata dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.result-actions{display:flex;align-items:flex-end;flex-direction:column;gap:10px}.result-actions .segmented button{min-height:27px;padding:4px 10px;font-size:11px}.checks{list-style:none;display:flex;flex-wrap:wrap;gap:12px 19px;margin:20px 0 12px;padding:0;font-size:12px;line-height:1.5}.checks li{display:flex;align-items:center;gap:6px}.checks svg{width:17px;height:17px;color:#218051}.scope-note{font-size:11px;color:var(--muted);line-height:1.6;margin:17px 0 0}footer{border-top:1px solid var(--line);background:white;min-height:60px;display:flex;align-items:center;justify-content:center;gap:8px;padding:18px;font-size:11px;color:var(--muted)}footer svg{width:15px;height:15px}
@media(max-width:900px){.workspace{gap:24px;padding:26px 24px;grid-template-columns:305px minmax(0,1fr)}.controls{padding-right:23px}.field-row{grid-template-columns:75px minmax(0,1fr);gap:10px}.dimensions{padding-left:85px}.size-input{grid-template-columns:minmax(0,1fr) 70px;gap:6px}.result-toolbar{align-items:flex-start;flex-direction:column}.result-actions{width:100%;flex-direction:row;align-items:center;justify-content:space-between}.preview{min-height:220px}.image-commands{gap:7px}}
@media(max-width:700px){.topbar{height:60px;padding:0 16px;gap:13px}.brand{font-size:13px;gap:7px}.brand svg{width:23px;height:23px}h1{font-size:13px;line-height:20px;padding-left:13px}.back-link{font-size:11px;gap:4px}.back-link svg{width:15px;height:15px}.workspace{display:flex;flex-direction:column;padding:23px 20px 30px;gap:26px;max-width:550px;min-height:0}.controls{padding:0;border:0}.condition-section{margin-bottom:21px}.section-label{font-size:14px}.field-row{grid-template-columns:95px minmax(0,1fr);gap:12px}.field-row>label,.checkbox-row{font-size:13px}.dimensions{padding-left:107px}.size-input{grid-template-columns:minmax(0,1fr) 85px;gap:8px}.button{min-height:46px;font-size:13px}textarea,input,select{font-size:16px}.convert-actions{margin-top:20px}.image-section{border-top:1px solid var(--line);padding-top:22px}.preview{aspect-ratio:4/3;min-height:220px;max-height:410px}.result-toolbar{flex-direction:column;gap:16px}.result-actions{flex-direction:row;align-items:center;width:100%;justify-content:space-between}.checks{font-size:12px;gap:10px 14px}.parse-status,.status{margin-bottom:0}footer{font-size:11px;padding-bottom:max(18px,env(safe-area-inset-bottom))}}
.workspace{row-gap:0;grid-template-rows:auto 1fr}.controls{grid-column:1;grid-row:1/3}.image-toolbar{grid-column:2;grid-row:1}.image-section{grid-column:2;grid-row:2}.preview{width:100%}#mobile-filename{display:none}
@media(max-width:700px){.workspace{gap:22px}.image-toolbar{display:grid;grid-template-columns:1fr auto;margin:0}.image-toolbar #mobile-filename:not([hidden]){display:block;grid-column:1/-1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--muted)}.image-section{padding-top:22px}.back-link span{display:none}.back-link{width:30px;justify-content:center}}
@media(max-width:380px){.topbar{padding:0 11px;gap:9px}.brand{font-size:12px}h1{font-size:12px;padding-left:9px}.back-link span{display:none}.workspace{padding:20px 16px}.field-row{grid-template-columns:85px minmax(0,1fr);gap:9px}.dimensions{padding-left:94px}.size-input{grid-template-columns:minmax(0,1fr) 72px;gap:6px}.image-commands{gap:6px}#photo-credit{font-size:9px}.result-actions .primary{font-size:12px;padding:9px 11px}}