:root{--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans KR", sans-serif;--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;--radius: 8px;--max-w: 1600px;--t: .15s ease}:root[data-theme=light]{--bg: #ffffff;--bg-elev: #f6f7f9;--bg-input: #ffffff;--fg: #1a1d21;--fg-muted: #5b6470;--border: #d8dde3;--border-strong: #b9c1cc;--accent: #2563eb;--accent-fg: #ffffff;--danger: #dc2626;--drop-bg: rgba(37, 99, 235, .08);--focus-ring: rgba(37, 99, 235, .35);color-scheme:light;--tok-comment: #6a737d;--tok-keyword: #d73a49;--tok-string: #032f62;--tok-number: #005cc5;--tok-function: #6f42c1;--tok-class: #e36209;--tok-operator: #d73a49;--tok-punctuation: #24292e;--tok-property: #005cc5;--tok-tag: #22863a;--tok-attr: #6f42c1;--tok-builtin: #005cc5}:root[data-theme=dark]{--bg: #0f1115;--bg-elev: #161a21;--bg-input: #11141a;--fg: #e6e8ec;--fg-muted: #9aa3b2;--border: #2a2f3a;--border-strong: #3a4150;--accent: #4f8cff;--accent-fg: #0a0c10;--danger: #f87171;--drop-bg: rgba(79, 140, 255, .12);--focus-ring: rgba(79, 140, 255, .45);color-scheme:dark;--tok-comment: #8b949e;--tok-keyword: #ff7b72;--tok-string: #a5d6ff;--tok-number: #79c0ff;--tok-function: #d2a8ff;--tok-class: #ffa657;--tok-operator: #ff7b72;--tok-punctuation: #c9d1d9;--tok-property: #79c0ff;--tok-tag: #7ee787;--tok-attr: #d2a8ff;--tok-builtin: #79c0ff}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);transition:background var(--t),color var(--t)}#root{min-height:100vh}.app{display:flex;flex-direction:column;min-height:100vh}.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;border-bottom:1px solid var(--border);background:var(--bg-elev);gap:12px;flex-wrap:wrap;transition:background var(--t),border-color var(--t)}.title{font-size:18px;font-weight:600;margin:0;letter-spacing:-.01em}.topbar-actions,.topbar-left{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.divider{width:1px;height:22px;background:var(--border);margin:0 4px}.content{width:100%;max-width:var(--max-w);margin:0 auto;flex:1;display:flex;flex-direction:column}.btn,.chip,.view-toggle,.lang-select{height:32px;font-size:13px;line-height:1;border-radius:999px;font-family:inherit;transition:background var(--t),border-color var(--t),color var(--t)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;border:1px solid var(--border);background:var(--bg-elev);color:var(--fg);padding:0 14px;cursor:pointer}.btn:hover:not(:disabled){background:var(--bg);border-color:var(--border-strong)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent);font-weight:600}.btn.primary:hover:not(:disabled){filter:brightness(1.08);border-color:var(--accent)}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;border:1px solid var(--border);background:var(--bg-elev);color:var(--fg);padding:0 12px;cursor:pointer}.chip:hover{border-color:var(--border-strong)}.chip.on{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.view-toggle{display:inline-flex;border:1px solid var(--border);overflow:hidden;padding:0}.segment{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--fg);padding:0 14px;font-size:13px;line-height:1;height:100%;cursor:pointer;font-family:inherit;transition:background var(--t),color var(--t)}.segment+.segment{border-left:1px solid var(--border)}.segment.active{background:var(--accent);color:var(--accent-fg)}.btn:focus-visible,.chip:focus-visible,.segment:focus-visible,.swap-btn:focus-visible,.lang-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.panes{display:grid;grid-template-columns:1fr auto 1fr;gap:0;padding:16px 24px;align-items:stretch}.swap-wrap{display:flex;align-items:center;justify-content:center;padding:0 6px}.swap-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:var(--bg-elev);color:var(--fg-muted);font-size:15px;cursor:pointer;transition:background var(--t),border-color var(--t),color var(--t),transform .25s ease}.swap-btn:hover{background:var(--bg);border-color:var(--accent);color:var(--accent);transform:rotate(180deg)}.pane{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elev);overflow:hidden;min-height:360px;transition:background var(--t),border-color var(--t)}.pane-header{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border);gap:8px}.pane-label{font-size:13px;font-weight:600;color:var(--fg-muted)}.pane-actions{display:flex;align-items:center;gap:6px}.lang-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:1px solid var(--border);background:var(--bg-elev);color:var(--fg);padding:0 26px 0 12px;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}.lang-select:hover{border-color:var(--border-strong)}.textarea-wrap{position:relative;flex:1;display:flex;min-height:280px;background:var(--bg-input);transition:background var(--t)}.textarea-wrap:focus-within{box-shadow:inset 0 0 0 2px var(--focus-ring)}.textarea-wrap.drag-over{outline:2px dashed var(--accent);outline-offset:-4px;background:var(--drop-bg)}.line-gutter{flex:0 0 auto;min-width:44px;padding:12px 8px 12px 12px;background:var(--bg-elev);border-right:1px solid var(--border);color:var(--fg-muted);font-family:var(--font-mono);font-size:13px;line-height:1.5;text-align:right;-webkit-user-select:none;user-select:none;overflow:hidden;white-space:nowrap;transition:background var(--t),border-color var(--t),color var(--t)}.line-number{height:19.5px;line-height:1.5}.editor-scroll{flex:1;min-width:0;overflow:auto;background:var(--bg-input)}.editor-scroll>div{min-height:100%}.text-input,.text-pre{font-family:var(--font-mono)!important;font-size:13px!important;line-height:1.5!important;white-space:pre!important;word-break:normal!important;overflow-wrap:normal!important;-moz-tab-size:2;tab-size:2}.text-input{outline:none!important;caret-color:var(--fg)}.text-pre{pointer-events:none}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:var(--tok-comment);font-style:italic}.token.punctuation{color:var(--tok-punctuation)}.token.property,.token.constant,.token.symbol{color:var(--tok-property)}.token.boolean,.token.number{color:var(--tok-number)}.token.selector,.token.attr-name,.token.string,.token.char,.token.inserted{color:var(--tok-string)}.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string{color:var(--tok-operator)}.token.atrule,.token.keyword{color:var(--tok-keyword)}.token.function,.token.class-name{color:var(--tok-function)}.token.tag{color:var(--tok-tag)}.token.attr-value{color:var(--tok-string)}.token.builtin{color:var(--tok-builtin)}.token.regex,.token.important,.token.variable{color:var(--tok-class)}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.deleted{color:#b31d28}.drop-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:var(--accent);background:var(--drop-bg);pointer-events:none}.result{padding:8px 24px 24px}.diff-view{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-elev);transition:background var(--t),border-color var(--t)}.empty-note{padding:24px 16px;border:1px dashed var(--border);border-radius:var(--radius);color:var(--fg-muted);text-align:center;font-size:14px}.empty-hint{font-size:13px;background:var(--bg-elev)}.error{padding:12px 16px;border:1px solid var(--danger);color:var(--danger);border-radius:var(--radius);background:var(--bg-elev);font-size:14px;margin-bottom:12px}.footer{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 24px 18px;border-top:1px solid var(--border);background:var(--bg-elev);transition:background var(--t),border-color var(--t)}.footer-row{display:flex;align-items:center;gap:10px}.footer-privacy{font-size:12px;color:var(--fg-muted);letter-spacing:.01em}.copyright{color:var(--fg-muted);font-size:12px;letter-spacing:.01em}.footer-sep{color:var(--border-strong);font-size:12px;-webkit-user-select:none;user-select:none}.version-badge{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;padding:2px 8px;border:1px solid var(--border);border-radius:999px;background:var(--bg);color:var(--fg-muted);font-family:var(--font-mono);font-size:11px;letter-spacing:.02em;cursor:pointer;transition:background var(--t),border-color var(--t),color var(--t)}.version-badge:hover{border-color:var(--accent);color:var(--accent)}.version-badge:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.version-badge.as-static{cursor:default}.version-badge.as-static:hover{border-color:var(--border);color:var(--fg-muted)}.notfound-content{flex:1;display:flex;align-items:center;justify-content:center;padding:48px 24px}.notfound-block{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}.notfound-code{font-family:var(--font-mono);font-size:96px;font-weight:700;line-height:1;letter-spacing:-.02em;color:var(--accent);margin-bottom:4px}.notfound-msg{font-size:15px;color:var(--fg-muted);margin-bottom:16px}.notes-content{padding:32px 24px 24px}.release{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-elev);padding:24px 28px;margin-bottom:16px;transition:background var(--t),border-color var(--t)}.release-header{display:flex;align-items:baseline;gap:12px;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}.release-version{font-size:24px;font-weight:700;letter-spacing:-.01em;color:var(--fg)}.release-date{font-size:12px;color:var(--fg-muted);font-family:var(--font-mono)}.release-changes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.change{display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:baseline;font-size:14px;line-height:1.55;color:var(--fg)}.change-kind{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}.kind-feat{background:#22863a1f;color:#22863a}:root[data-theme=dark] .kind-feat{background:#7ee78729;color:#7ee787}.kind-fix{background:#dc26261f;color:#dc2626}:root[data-theme=dark] .kind-fix{background:#f8717129;color:#f87171}.kind-design{background:#6f42c11f;color:#6f42c1}:root[data-theme=dark] .kind-design{background:#d2a8ff29;color:#d2a8ff}.kind-chore{background:#5b64701f;color:var(--fg-muted)}@media (max-width: 880px){.panes{grid-template-columns:1fr;gap:12px}.swap-wrap{justify-content:center;padding:4px 0}.swap-btn:hover{transform:rotate(90deg)}}