:root{--color-bg: #f3f5f8;--color-surface: #ffffff;--color-surface-subtle: #f8fafc;--color-border: #dbe2ea;--color-border-strong: #b9c4d0;--color-text: #1c2530;--color-text-muted: #5c6b7a;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-primary-soft: #e4edff;--color-danger: #d92d20;--color-danger-soft: #fee4e2;--color-success: #12805c;--color-success-soft: #d8f3e7;--color-warning-soft: #fef4d6;--color-warning-text: #8a6116;--radius-sm: 6px;--radius: 10px;--radius-lg: 14px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 4px 12px rgba(15, 23, 42, .05);--focus-ring: 0 0 0 3px rgba(37, 99, 235, .35)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Pretendard,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,sans-serif;background:var(--color-bg);color:var(--color-text);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}h1,h2,h3,p,ul{margin:0}ul{padding:0;list-style:none}img{max-width:100%}button{font-family:inherit}input,select{font-family:inherit;font-size:14px;color:var(--color-text)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--color-surface);border-bottom:1px solid var(--color-border)}.header-inner{max-width:1280px;margin:0 auto;padding:20px 24px}.header-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.app-title{font-size:20px;font-weight:700;letter-spacing:-.01em}.badge{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--color-primary-soft);color:var(--color-primary);font-size:12px;font-weight:600}.app-description{margin-top:6px;color:var(--color-text-muted)}.privacy-note{margin-top:6px;font-size:13px;color:var(--color-success);font-weight:500}.app-main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:24px;display:grid;grid-template-columns:360px minmax(0,1fr);gap:20px;align-items:start}.settings-column,.workspace-column{display:flex;flex-direction:column;gap:16px;min-width:0}.app-footer{border-top:1px solid var(--color-border);padding:16px 24px;text-align:center;color:var(--color-text-muted);font-size:12px}.panel{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:18px;display:flex;flex-direction:column;gap:14px}.panel-title{font-size:15px;font-weight:700;letter-spacing:-.01em}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field-row{display:flex;gap:10px}.field-row .field{flex:1}.field-label{font-size:13px;font-weight:600;color:var(--color-text)}.field-label-value{font-style:normal;font-weight:500;color:var(--color-text-muted)}.help-text{font-size:12px;color:var(--color-text-muted);margin:0}.error-text{color:var(--color-danger)}.subgroup{display:flex;flex-direction:column;gap:12px;padding:12px;background:var(--color-surface-subtle);border:1px solid var(--color-border);border-radius:var(--radius)}input[type=text],input[type=number],select{height:36px;padding:0 10px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);width:100%}input[type=text]:focus-visible,input[type=number]:focus-visible,select:focus-visible,input[type=range]:focus-visible,input[type=color]:focus-visible,button:focus-visible{outline:none;box-shadow:var(--focus-ring)}fieldset{border:0;margin:0;padding:0}legend{padding:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 14px;border-radius:var(--radius-sm);border:1px solid transparent;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-text)}.btn-secondary:hover:not(:disabled){background:var(--color-surface-subtle)}.btn-danger{background:var(--color-danger);color:#fff}.btn-ghost{background:transparent;color:var(--color-text-muted)}.btn-ghost:hover:not(:disabled){background:var(--color-surface-subtle);color:var(--color-text)}.btn-sm{height:30px;padding:0 10px;font-size:13px}.btn-lg{height:44px;font-size:15px}.btn-block{width:100%}.toggle{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none}.toggle input{position:absolute;opacity:0;width:1px;height:1px}.toggle-track{flex-shrink:0;width:38px;height:22px;border-radius:999px;background:var(--color-border-strong);position:relative;transition:background-color .15s ease}.toggle-thumb{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:var(--shadow-sm);transition:transform .15s ease}.toggle input:checked+.toggle-track{background:var(--color-primary)}.toggle input:checked+.toggle-track .toggle-thumb{transform:translate(16px)}.toggle input:focus-visible+.toggle-track{box-shadow:var(--focus-ring)}.toggle input:disabled~.toggle-label{opacity:.5}.toggle-label{font-size:13px;font-weight:500}.slider-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.slider-head label{font-size:13px;font-weight:600}.slider-value{font-size:13px;font-variant-numeric:tabular-nums;color:var(--color-primary);font-weight:600}input[type=range]{width:100%;accent-color:var(--color-primary);margin:0}.color-row{display:flex;align-items:center;gap:10px}input[type=color]{width:44px;height:32px;padding:2px;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer}.color-value{font-size:13px;font-variant-numeric:tabular-nums;color:var(--color-text-muted)}.segmented,.preview-toggle{display:inline-flex;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);overflow:hidden;background:var(--color-surface)}.segment{padding:7px 14px;font-size:13px;font-weight:600;color:var(--color-text-muted);background:transparent;border:0;cursor:pointer;transition:background-color .15s ease,color .15s ease}.segment+.segment{border-left:1px solid var(--color-border)}.segment:hover{background:var(--color-surface-subtle)}.segment-active{background:var(--color-primary);color:#fff}.segment-active:hover{background:var(--color-primary)}.segment:focus-within{box-shadow:var(--focus-ring)}.position-grid{display:grid;grid-template-columns:repeat(3,44px);gap:6px}.position-cell{width:44px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}.position-cell:hover{background:var(--color-surface-subtle)}.position-dot{width:8px;height:8px;border-radius:50%;background:var(--color-border-strong);transition:background-color .15s ease}.position-cell-active{border-color:var(--color-primary);background:var(--color-primary-soft)}.position-cell-active .position-dot{background:var(--color-primary)}.watermark-upload{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.watermark-preview{display:flex;gap:12px;align-items:center}.watermark-preview-image{width:72px;height:72px;object-fit:contain;border:1px solid var(--color-border);border-radius:var(--radius-sm);flex-shrink:0}.watermark-preview-meta{display:flex;flex-direction:column;gap:6px;min-width:0}.watermark-preview-meta .help-text{overflow-wrap:anywhere}.watermark-preview-actions{display:flex;gap:6px}.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:34px 20px;border:2px dashed var(--color-border-strong);border-radius:var(--radius-lg);background:var(--color-surface);cursor:pointer;text-align:center;transition:border-color .15s ease,background-color .15s ease;width:100%}.dropzone:hover{border-color:var(--color-primary)}.dropzone-active{border-color:var(--color-primary);background:var(--color-primary-soft)}.dropzone-icon{font-size:28px}.dropzone-title{font-size:15px;font-weight:700}.dropzone-sub{font-size:13px;color:var(--color-text-muted)}.warning-banner{background:var(--color-warning-soft);color:var(--color-warning-text);border:1px solid #f0dfae;border-radius:var(--radius);padding:10px 14px;font-size:13px}.image-list-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.image-list{display:flex;flex-direction:column;gap:10px;max-height:420px;overflow-y:auto;padding-right:2px}.empty-state{color:var(--color-text-muted);font-size:13px;text-align:center;padding:12px 0}.image-card{display:flex;gap:12px;align-items:stretch;border:1px solid var(--color-border);border-radius:var(--radius);padding:10px;background:var(--color-surface);transition:border-color .15s ease,box-shadow .15s ease}.image-card-selected{border-color:var(--color-primary);box-shadow:0 0 0 1px var(--color-primary)}.image-card-body{display:flex;gap:12px;align-items:center;flex:1;min-width:0;background:transparent;border:0;padding:0;cursor:pointer;text-align:left;border-radius:var(--radius-sm)}.image-thumb{width:64px;height:64px;object-fit:contain;border-radius:var(--radius-sm);border:1px solid var(--color-border);flex-shrink:0;background-color:var(--color-surface-subtle)}.image-info{display:flex;flex-direction:column;gap:2px;min-width:0}.image-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-meta{font-size:12px;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.image-meta-output{color:var(--color-success)}.image-error{font-size:12px;color:var(--color-danger)}.image-card-side{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:8px;flex-shrink:0}.image-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.status-badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}.status-pending{background:var(--color-surface-subtle);color:var(--color-text-muted);border:1px solid var(--color-border)}.status-processing{background:var(--color-primary-soft);color:var(--color-primary)}.status-done{background:var(--color-success-soft);color:var(--color-success)}.status-error{background:var(--color-danger-soft);color:var(--color-danger)}.preview-header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.preview-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:240px;max-height:420px;border:1px solid var(--color-border);border-radius:var(--radius);overflow:hidden}.preview-stage img{max-width:100%;max-height:420px;object-fit:contain;display:block}.preview-message{padding:20px;color:var(--color-text-muted);font-size:13px;background:#ffffffd9;border-radius:var(--radius-sm)}.preview-loading{position:absolute;top:10px;right:10px;background:#1c2530bf;color:#fff;font-size:12px;padding:3px 10px;border-radius:999px}.preview-info{font-size:13px;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.checkerboard{background-image:conic-gradient(#e8ecf1 0 25%,transparent 0 50%,#e8ecf1 0 75%,transparent 0);background-size:16px 16px;background-color:#fff}.progress-actions{display:flex;gap:10px}.progress-status{display:flex;flex-direction:column;gap:8px}.progress-bar{height:8px;border-radius:999px;background:var(--color-surface-subtle);border:1px solid var(--color-border);overflow:hidden}.progress-fill{height:100%;background:var(--color-primary);border-radius:999px;transition:width .2s ease}.progress-text{font-size:13px;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.progress-current{overflow-wrap:anywhere}.summary-line{font-size:13px;font-weight:600;color:var(--color-text);background:var(--color-surface-subtle);border:1px solid var(--color-border);border-radius:var(--radius);padding:10px 12px}.zip-section{border-top:1px solid var(--color-border);padding-top:14px;display:flex;flex-direction:column;gap:10px}.zip-name-row{display:flex;align-items:center;gap:8px}.zip-extension{color:var(--color-text-muted);font-size:13px;flex-shrink:0}.zip-status{font-size:13px;color:var(--color-text-muted);min-height:1.2em;margin:0}.preset-save-row{align-items:stretch}.preset-save-row input{flex:1}.preset-list{display:flex;flex-direction:column;gap:8px}.preset-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:8px 10px;flex-wrap:wrap}.preset-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}.preset-actions{display:flex;gap:4px;flex-shrink:0}.preset-rename-row{display:flex;gap:6px;align-items:center;width:100%}.preset-rename-row input{flex:1}.name-preview{display:flex;flex-direction:column;gap:4px;background:var(--color-surface-subtle);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:8px 10px;font-size:12px;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.name-preview li{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:100;max-width:min(360px,calc(100vw - 40px))}.toast{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--radius);box-shadow:var(--shadow);background:var(--color-text);color:#fff;font-size:13px;animation:toast-in .18s ease}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.toast-success{background:var(--color-success)}.toast-error{background:var(--color-danger)}.toast-message{flex:1}.toast-close{background:transparent;border:0;color:inherit;font-size:16px;line-height:1;cursor:pointer;padding:0;opacity:.8}.toast-close:hover{opacity:1}@media (max-width: 1024px){.app-main{grid-template-columns:1fr}.workspace-column{order:-1}}@media (max-width: 640px){.header-inner,.app-main{padding-left:16px;padding-right:16px}.app-main{padding-top:16px;gap:14px}.panel{padding:14px}.progress-actions{flex-direction:column}.btn-lg{width:100%}.image-card{flex-direction:column}.image-card-side{flex-direction:row;align-items:center;justify-content:space-between;width:100%}.preview-stage{min-height:180px}}