:root{--bg:#e9ebef;--panel:#fff;--border:#d8dbe2;--text:#1d2129;--muted:#6b7280;--accent:#4f46e5;--accent-soft:#4f46e51f;--danger:#dc2626;--ko-font:"Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Nanum Gothic", sans-serif;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", var(--ko-font);color:var(--text);font-size:14px}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;margin:0}button{font:inherit}.app{flex-direction:column;height:100%;display:flex}.toolbar{background:var(--panel);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:10px;min-width:0;height:48px;padding:0 14px;display:flex}.brand{color:var(--accent);white-space:nowrap;align-items:center;gap:6px;font-weight:700;display:flex}.spacer{flex:1}.file-name{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:260px;overflow:hidden}.btn{border:1px solid var(--border);background:var(--panel);height:30px;color:var(--text);cursor:pointer;white-space:nowrap;border-radius:6px;padding:0 10px}.btn:hover{background:#f3f4f6}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{filter:brightness(1.08)}.btn.icon{width:30px;padding:0;font-size:16px}.btn.link{color:var(--accent);background:0 0;border:0;text-decoration:underline}.url-form input,.page-nav input{border:1px solid var(--border);height:30px;font:inherit;border-radius:6px;padding:0 8px}.url-form input{width:230px}.page-nav{color:var(--muted);white-space:nowrap;align-items:center;gap:6px;display:flex}.page-nav input{text-align:center;width:46px}.zoom{gap:4px;display:flex}.segmented{border:1px solid var(--border);background:#f3f4f6;border-radius:7px;flex-shrink:0;padding:2px;display:flex}.segmented button{height:26px;color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:5px;padding:0 10px}.segmented button.on{background:var(--panel);color:var(--text);font-weight:600;box-shadow:0 1px 2px #0000001f}.zoom-value{font-variant-numeric:tabular-nums;min-width:58px}.progress{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;align-items:center;gap:6px;display:flex}.provider{white-space:nowrap;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:600}.provider.deepl{color:#0369a1;background:#e0f2fe}.provider.mock{color:#92400e;background:#fef3c7}button.provider{cursor:pointer;font:inherit;border:0;font-size:12px;font-weight:600}button.provider:hover{filter:brightness(.96)}.provider.none{background:var(--accent);color:#fff}.provider.off{color:var(--danger);background:#fee2e2}.empty{flex:1;place-items:center;display:grid}.empty-card{background:var(--panel);color:var(--muted);text-align:center;border-radius:14px;flex-direction:column;align-items:center;gap:6px;padding:48px 64px;display:flex}.dropzone{border:2px dashed var(--border);cursor:pointer}.dropzone:hover{border-color:var(--accent);color:var(--accent)}.empty-card p{margin:0}.empty-card .title{color:var(--text);margin-top:8px;font-size:16px;font-weight:600}.empty-card .error{color:var(--danger)}.drop-overlay{border:3px dashed var(--accent);color:var(--accent);pointer-events:none;z-index:10;background:#4f46e51f;place-items:center;font-size:20px;font-weight:700;display:grid;position:fixed;inset:0}.viewer{flex:1;min-height:0;display:flex}.pane-wrap{flex-direction:column;flex:1 1 0;min-width:0;display:flex}.pane-wrap+.pane-wrap{border-left:1px solid var(--border)}.pane-label{height:28px;color:var(--muted);border-bottom:1px solid var(--border);background:#f6f7f9;flex-shrink:0;align-items:center;gap:8px;padding:0 14px;font-size:12px;font-weight:600;display:flex}.pane-label .hint{opacity:.8;font-weight:400}.pane{overflow-anchor:none;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch;flex:1;position:relative;overflow:auto}.viewer.mode-dst .pane-wrap.src,.viewer.mode-src .pane-wrap.dst{border:0;flex:0 0 0;overflow:hidden}.pane-content{position:relative}.page{background:#fff;position:absolute;overflow:hidden;box-shadow:0 1px 3px #0000001f,0 0 0 1px #0000000a}.page-number{color:#c9ccd3;place-items:center;font-size:28px;font-weight:700;display:grid;position:absolute;inset:0}.page-canvas{width:100%;height:100%;position:absolute;inset:0}.tl-layer,.src-layer{transform-origin:0 0;position:absolute;top:0;left:0}.pane-wrap.peek .tl-layer{display:none}.tl-cover,.tl-text,.tl-skeleton,.tl-error,.src-sent{position:absolute}.tl-text{font-family:var(--ko-font);color:#111;word-break:keep-all;overflow-wrap:anywhere;white-space:normal;letter-spacing:0;margin:0;padding:0}.tl-measure{visibility:hidden;pointer-events:none;position:absolute;top:0;left:-100000px}.tl-text .sent{-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:2px;transition:background-color 80ms}.tl-text .sent.hl,.src-sent.hl{background:#facc1561}.tl-skeleton{background:linear-gradient(90deg,#6366f11a 0%,#6366f147 45%,#6366f11a 90%) 0 0/300% 100%;border-radius:3px;animation:1.3s linear infinite shimmer}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-200% 0}}.tl-error{border-radius:3px;outline:2px dashed #dc262680}.src-sent{mix-blend-mode:multiply;border-radius:2px}.src-layer{pointer-events:none}.page{--scale-round-x:1px;--scale-round-y:1px}.textLayer{opacity:1;text-align:initial;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;forced-color-adjust:none;transform-origin:0 0;caret-color:canvastext;z-index:0;--min-font-size:1;--text-scale-factor:calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv:calc(1 / var(--min-font-size));line-height:1;position:absolute;inset:0;overflow:clip}.textLayer :is(span,br){color:#0000;white-space:pre;cursor:text;transform-origin:0 0;position:absolute}.textLayer>:not(.markedContent),.textLayer .markedContent span:not(.markedContent){z-index:1;--font-height:0;font-size:calc(var(--text-scale-factor) * var(--font-height));--scale-x:1;--rotate:0deg;transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}.textLayer .markedContent{display:contents}.textLayer ::selection{background:#4f46e547}.tl-text ::selection{background:#4f46e547}.tl-text::selection{background:#4f46e547}.badge{color:#fff;z-index:2;pointer-events:none;background:#111827b8;border:0;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;display:flex;position:absolute;top:8px;right:8px}.badge.busy{background:#4f46e5e6}.badge.error{background:var(--danger);cursor:pointer;pointer-events:auto}.spinner{border:2px solid;border-right-color:#0000;border-radius:50%;width:12px;height:12px;animation:.8s linear infinite spin;display:inline-block}.spinner.large{width:28px;height:28px;color:var(--accent);border-width:3px}@keyframes spin{to{transform:rotate(360deg)}}.modal-backdrop{z-index:20;background:#11182766;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--panel);border-radius:12px;flex-direction:column;gap:12px;width:min(480px,100%);padding:22px 24px;display:flex;box-shadow:0 20px 50px #00000040}.modal h2{margin:0;font-size:17px}.modal p{margin:0;line-height:1.55}.modal .muted{color:var(--muted);font-size:13px}.modal a{color:var(--accent)}.modal .error{color:var(--danger);font-size:13px}.key-status{background:#f6f7f9;border-radius:8px;padding:8px 10px;font-size:13px}.key-status code{font-size:12px}.key-input{gap:6px;display:flex}.key-input input{border:1px solid var(--border);border-radius:6px;flex:1;min-width:0;height:34px;padding:0 10px;font:13px ui-monospace,SFMono-Regular,Menlo,monospace}.key-input input:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}.key-input .btn{height:34px}.modal-actions{align-items:center;gap:8px;display:flex}.btn:disabled{opacity:.5;cursor:default}.btn.danger{color:var(--danger);border-color:#fecaca}@media (width<=1180px){.file-name,.pane-label .hint{display:none}.url-form input{width:150px}}@media (width<=900px){.url-form,.progress,.zoom .btn:last-child{display:none}.toolbar{gap:6px;padding:0 8px}}@media (width<=640px){.brand,.page-nav,.zoom{display:none}.toolbar{scrollbar-width:none;overflow-x:auto}.toolbar>*{flex-shrink:0}.toolbar .spacer{flex:1 0 0}.btn.primary{padding:0 10px}.segmented button{padding:0 9px}.pane-label{height:24px;padding:0 10px}.empty-card{margin:0 16px;padding:32px 20px}.empty-card .title{font-size:15px}.modal{padding:18px 16px}.key-input input,.url-form input,.page-nav input{font-size:16px}}
