:root{--color-white: #ffffff;--color-cool-gray: #f3f4f6;--color-cool-gray-2: #e5e7eb;--color-charcoal: #171717;--color-ink: #1f1f1f;--color-marker-orange: #ff6f1e;--color-burnt-sienna: #b4410a;--color-muted: #6b7280;--color-danger: #dc2626;--font-heading: "Jua", "Gowun Dodum", ui-rounded, system-ui, sans-serif;--font-body: "Gowun Dodum", "Jua", ui-rounded, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--radius-sm: 8px;--radius-md: 10px;--radius-lg: 12px}@font-face{font-family:Jua;src:url(../fonts/jua-korean-400-normal.woff2) format("woff2");font-weight:400 700;font-display:swap}@font-face{font-family:Gowun Dodum;src:url(../fonts/gowun-dodum-korean-400-normal.woff2) format("woff2");font-weight:400 700;font-display:swap}*{box-sizing:border-box}html,body{margin:0;background:var(--color-white);color:var(--color-charcoal);font-family:var(--font-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}.page{max-width:1200px;margin:0 auto;padding:0 16px 24px}.site-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:12px 0}.brand{display:flex;align-items:center;gap:8px;color:var(--color-ink);font-family:var(--font-heading);font-size:18px;font-weight:400}.brand svg{display:block}.tagline{font-family:var(--font-heading);font-size:22px;color:var(--color-ink)}.workspace{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}@media(min-width:900px){.workspace{grid-template-columns:minmax(0,1fr) 280px;align-items:start}}.workspace>*{min-width:0}.upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:180px;background:var(--color-cool-gray);border:1.5px dashed var(--color-cool-gray-2);border-radius:var(--radius-lg);cursor:pointer;text-align:center;padding:24px;transition:border-color .15s ease}.upload-box:hover{border-color:var(--color-muted)}.upload-box.drag-over{border-color:var(--color-marker-orange);background:#fff7ed}.upload-box:focus-visible{outline:2px solid var(--color-marker-orange);outline-offset:2px}.upload-primary{font-size:16px;font-weight:500}.upload-secondary{font-size:14px;color:var(--color-muted)}.upload-hint{font-size:13px;color:var(--color-muted);margin-top:2px}.file-meta{margin-top:8px;font-size:14px;color:var(--color-muted);min-height:20px}.file-strip{display:flex;gap:10px;overflow-x:auto;padding:10px 2px;scrollbar-width:thin;min-height:24px;cursor:grab;touch-action:pan-x pan-y;width:100%;max-width:100%;min-width:0}.file-strip:active{cursor:grabbing}.file-strip:focus-visible{outline:2px solid var(--color-marker-orange);outline-offset:2px}.file-strip::-webkit-scrollbar{height:6px}.file-strip::-webkit-scrollbar-thumb{background:var(--color-cool-gray-2);border-radius:3px}.file-card{flex:0 0 auto;width:128px;background:var(--color-cool-gray);border-radius:var(--radius-sm);padding:8px;position:relative}.file-card .thumb{width:100%;height:84px;object-fit:cover;border-radius:6px;background:var(--color-white);display:block}.file-card .thumb.pending{display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--color-muted)}.file-card .fname{display:block;margin-top:6px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-card .remove{position:absolute;top:4px;right:4px;width:44px;height:44px;border:0;border-radius:50%;background:#0000008c;color:#fff;font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;pointer-events:auto}.file-card .remove:disabled{opacity:.35;cursor:not-allowed}.file-controls{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-top:8px}.manual-frame-toggle{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px;min-height:44px;color:var(--color-charcoal);cursor:pointer}.manual-frame-toggle input{width:20px;height:20px;accent-color:var(--color-burnt-sienna)}.manual-frame-toggle small{flex-basis:100%;margin-left:26px;margin-top:-7px;color:var(--color-muted);font-size:12px}.manual-frame-toggle:has(input:disabled){cursor:not-allowed;opacity:.5}.action-rail{display:flex;flex-direction:column;gap:16px}.action-group{display:flex;flex-direction:column;gap:8px}.action-group h2{margin:0;font-family:var(--font-heading);font-size:16px;font-weight:400;color:var(--color-ink);display:flex;align-items:center;gap:8px}.group-hint{font-family:var(--font-body);font-size:13px;color:var(--color-muted);font-weight:400}.btn{appearance:none;background:var(--color-white);border:0;border-radius:var(--radius-sm);color:var(--color-charcoal);font-family:var(--font-body);font-size:15px;font-weight:500;min-height:44px;padding:10px 16px;cursor:pointer;text-align:center;transition:background .12s ease}.btn:hover:not(:disabled){background:var(--color-cool-gray)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--color-marker-orange);outline-offset:2px}.btn.primary{background:var(--color-burnt-sienna);color:#fff}.btn.primary:hover:not(:disabled){background:#a84307}.btn.text{background:transparent;color:var(--color-muted);padding:6px 10px;font-size:14px;min-height:44px}.btn.text:hover:not(:disabled){color:var(--color-charcoal)}.status{margin-top:12px;min-height:24px;font-size:14px}.status.done{font-weight:500}.error-line{margin-top:8px;font-size:14px;color:var(--color-danger);min-height:20px}.notices{margin-top:20px;font-size:14px;color:var(--color-muted);line-height:1.6}.notices p{margin:4px 0;max-width:78ch}.frame-modal{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:12px;background:#17171794}.frame-modal[hidden]{display:none}.frame-dialog{display:flex;flex-direction:column;width:min(1100px,100%);max-height:calc(100vh - 24px);overflow:hidden;background:var(--color-white);border-radius:var(--radius-lg);color:var(--color-charcoal)}.frame-dialog-header,.frame-dialog-footer{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--color-cool-gray-2)}.frame-dialog-footer{border-top:1px solid var(--color-cool-gray-2);border-bottom:0}.frame-dialog-header h2{margin:0;font-family:var(--font-heading);font-size:24px;font-weight:400}.frame-dialog-header p{margin:3px 0 0;color:var(--color-muted);font-size:14px}.frame-close{margin-left:auto}.frame-dialog-spacer{flex:1}.frame-dialog-status{min-height:22px;padding:10px 20px 0;color:var(--color-muted);font-size:13px}.frame-pages{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;overflow:auto;padding:12px 20px 20px}.frame-page{min-width:0;padding:10px;border:1px solid var(--color-cool-gray-2);border-radius:var(--radius-sm);background:var(--color-cool-gray)}.frame-page-label{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:13px;color:var(--color-muted)}.frame-stage{position:relative;width:100%;overflow:hidden;background:#fff;line-height:0}.frame-stage canvas{display:block;width:100%;height:auto}.frame-stage svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;touch-action:none}.frame-stage polygon{fill:#b4410a1f;stroke:var(--color-burnt-sienna);stroke-width:2;vector-effect:non-scaling-stroke}.frame-stage circle{fill:#fff;stroke:var(--color-burnt-sienna);stroke-width:2;vector-effect:non-scaling-stroke;cursor:grab;pointer-events:all}.frame-stage circle:active{cursor:grabbing}.frame-help{margin:7px 0 0;color:var(--color-muted);font-size:12px;line-height:1.4}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media(max-width:640px){.workspace{grid-template-columns:1fr}.action-rail{gap:12px}.action-group{gap:6px}.upload-box{min-height:160px}.tagline{font-size:18px}.frame-modal{padding:0}.frame-dialog{max-height:100vh;border-radius:0}.frame-dialog-header{align-items:flex-start;padding:12px 14px}.frame-dialog-header h2{font-size:21px}.frame-dialog-header p{font-size:13px}.frame-pages{grid-template-columns:1fr;padding:10px 14px 14px}.frame-dialog-footer{flex-wrap:wrap;padding:10px 14px}.frame-dialog-footer .frame-dialog-spacer{display:none}.frame-dialog-footer .btn.primary{flex:1 1 100%;order:4}}
