/* 투고 전 30초 / 퇴고 작업실 — ARCHE v2 리스킨 (2026-10-03)
   토큰·버튼·시트·하단 탭바는 arche-ui.css(공용, 수정 금지)가 제공하고, 이 파일은 앱 고유 마크업만 덮어쓴다.
   위치 모션은 proof-skin.js가 arche-motion.js 스프링으로 담당한다. 여기서는 색·그림자 transition만 쓴다. */
:root {
  /* legacy tokens kept for older selectors and tests; the v2 palette lives in arche-ui.css */
  --canvas: #f3f7fc;
  --accent: #16305c;
  --muted: #5d5c76;
  --muted-light: #9796ad;
  --surface: #ffffff;
  --green: #11a683;
  --green-soft: #dcf6ee;
  --sidebar-width: 320px;
  --page: 1560px;
}

html { scroll-behavior: smooth; }
body { min-width: 320px; background: var(--bg); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
input, select, textarea { font-size: 16px; }
svg:where(:not(.duo, .mascot, .change-connectors)) { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.mascot { display: block; }

/* Realistic sample document and first-visit interactive guide */
.sample-demo-file { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px 16px; align-items: center; padding: 6px 4px 22px; }
.sample-file-type { grid-row: 1 / 3; display: grid; width: 52px; height: 52px; place-items: center; border-radius: 18px; background: var(--b-ll); color: var(--b-dd); font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.sample-demo-file > div { min-width: 0; }
.sample-demo-file > div strong { display: block; overflow: hidden; font-size: 17px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.sample-demo-file > div small { display: block; margin-top: 4px; color: var(--ink-2); font-size: 14px; }
.sample-demo-file ol { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sample-demo-file li { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px 0 9px; border-radius: 999px; background: var(--ok-l); color: #08795f; font-size: 13px; font-weight: 700; white-space: nowrap; }
.sample-demo-file li::before { content: ""; width: 12px; height: 7px; margin-top: -3px; border-left: 2.2px solid currentColor; border-bottom: 2.2px solid currentColor; transform: rotate(-45deg); }
.sample-demo-file em { grid-column: 2; color: var(--ink-3); font-size: 14px; font-style: normal; }
.sample-demo-file.is-tour-processing li { animation: proof-pipeline 480ms ease both; }
.sample-demo-file.is-tour-processing li:nth-child(2) { animation-delay: 140ms; }
.sample-demo-file.is-tour-processing li:nth-child(3) { animation-delay: 280ms; }
.sample-demo-file.is-tour-processing li:nth-child(4) { animation-delay: 420ms; }
@keyframes proof-pipeline { from { opacity: .25; background: var(--soft); } to { opacity: 1; } }
.ai-drop-zone.is-tour-upload { background: var(--b-lll); box-shadow: inset 0 0 0 2.5px var(--b); }
.guided-tour { position: fixed; inset: 0; z-index: 900; pointer-events: auto; background: rgba(32, 31, 54, .06); }
.tour-spotlight { position: fixed; z-index: 901; border-radius: 24px; pointer-events: none; box-shadow: 0 0 0 3px var(--b), 0 0 0 9px rgba(91, 84, 240, .18); }
.tour-spotlight.has-ring { box-shadow: none; }
.tour-ring { position: fixed; left: 0; top: 0; z-index: 901; border-radius: 24px; pointer-events: none; box-shadow: 0 0 0 3px var(--b), 0 0 0 9px rgba(91, 84, 240, .18); will-change: transform, width, height, opacity; }
.tour-pointer { --tour-flip-x: 1; --tour-flip-y: 1; position: fixed; z-index: 902; width: 112px; height: 149px; pointer-events: none; transition: opacity 180ms ease; filter: drop-shadow(0 9px 0 rgba(4, 7, 10, .12)); }
.tour-pointer svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transform-origin: center; animation: tour-cursor-click 1.4s steps(2, end) infinite; }
.tour-pointer-halo { fill: #fff; stroke: #fff; stroke-width: 9; stroke-linecap: round; stroke-linejoin: round; }
.tour-pointer-side { fill: var(--b-dd); stroke: #05070a; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.tour-pointer-arrow { fill: var(--b); stroke: #05070a; stroke-width: 4.5; stroke-linecap: round; stroke-linejoin: round; }
.tour-pointer-hatch { fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; opacity: .55; }
@keyframes tour-cursor-click { 0%, 42%, 100% { transform: scaleX(var(--tour-flip-x)) scaleY(var(--tour-flip-y)); } 50%, 56% { transform: translate(2px, 3px) scale(.94) scaleX(var(--tour-flip-x)) scaleY(var(--tour-flip-y)); } }
.tour-replay-button { flex: none; white-space: nowrap; }
.tour-spotlight.is-repositioning, .tour-pointer.is-repositioning { opacity: 0 !important; transition: none; }
.tour-popover { position: fixed; z-index: 903; display: grid; gap: 12px; max-height: calc(100vh - 40px); padding: 22px 22px 18px; overflow: auto; border-radius: 28px; background: #fff; box-shadow: var(--sh-lg); will-change: transform, opacity; }
.tour-popover > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--ink-3); font-size: 14px; font-weight: 700; }
.tour-popover > header button { height: 44px; padding: 0 12px; margin: -10px -8px -10px 0; border-radius: 999px; color: var(--ink-3); font-size: 14px; font-weight: 650; }
.tour-popover > header button:hover { background: var(--soft); color: var(--ink); }
.tour-step-label { color: var(--b-d); font-size: 14px; font-weight: 750; }
.tour-popover h2 { font-size: 21px; font-weight: 800; }
.tour-description { color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.tour-popover > footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 2px; }
.tour-popover > footer button { height: 44px; padding: 0 18px; border-radius: 999px; font-size: 15px; font-weight: 700; }
.tour-popover > footer button:first-child { background: var(--soft); color: var(--ink); }
.tour-popover > footer button:last-child { background: var(--b); color: #fff; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); }
.tour-popover > footer button:disabled { opacity: .4; cursor: default; }
/* Free scrolling while the tour is open drifted the spotlight and pointer off their target; each step scrolls its target into view itself, then re-locks. */
html.tour-scroll-lock, body.tour-scroll-lock { overflow: hidden; }
.tour-progress { height: 6px; overflow: hidden; border-radius: 999px; background: var(--soft); }
.tour-progress i { display: block; width: 25%; height: 100%; border-radius: inherit; background: var(--b); }
.tour-simulation { min-height: 100px; padding: 14px 16px; border-radius: 20px; background: var(--bg); color: var(--ink-2); font-size: 14px; }
.tour-proof-file { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; align-items: center; }
.tour-proof-file > span { grid-row: 1 / 4; display: grid; width: 44px; height: 44px; place-items: center; border-radius: 14px; background: var(--b-ll); color: var(--b-dd); font-size: 12px; font-weight: 800; }
.tour-proof-file strong { overflow: hidden; color: var(--ink); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.tour-proof-file i { display: block; height: 8px; overflow: hidden; border-radius: 9px; background: #fff; }
.tour-proof-file i b { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--b); animation: tour-proof-fill 900ms .2s ease forwards; }
@keyframes tour-proof-fill { to { width: 100%; } }
.tour-proof-file small { font-size: 13px; }
.tour-proof-pipeline { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.tour-proof-pipeline span { display: flex; justify-content: space-between; gap: 8px; padding: 10px 12px; border-radius: 14px; background: #fff; color: var(--ink); font-size: 13px; font-weight: 650; }
.tour-proof-pipeline b { color: #08795f; }
.tour-proof-diff p { margin: 0; color: var(--ink); font-size: 15px; line-height: 1.9; }
.tour-proof-diff del { padding: 1px 5px; border-radius: 8px; background: var(--red-l); color: #b4232a; text-decoration-thickness: 2px; }
.tour-proof-diff ins { padding: 1px 5px; border-radius: 8px; background: var(--ok-l); color: #08795f; font-weight: 650; text-decoration: none; }
.tour-proof-diff small { display: block; margin-top: 6px; font-size: 13px; }
.tour-proof-review { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.tour-proof-review span { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: var(--b-ll); color: var(--b-dd); font-size: 14px; font-weight: 800; }
.tour-proof-review span.meta { background: var(--b); color: #fff; }
.tour-proof-review strong { flex-basis: 100%; margin-top: 4px; color: var(--ink); font-size: 16px; }
.tour-proof-review small { font-size: 13px; }

@media (max-width: 720px) {
  .tour-pointer { width: 94px; height: 125px; }
  .tour-popover { gap: 10px; padding: 18px 18px 14px; border-radius: 26px; }
  .tour-popover h2 { font-size: 19px; }
  .tour-description { font-size: 15px; }
}
@media (max-height: 640px) { .tour-pointer { width: 94px; height: 125px; } .tour-popover { gap: 6px; padding: 14px; } .tour-popover h2 { font-size: 18px; } .tour-description { font-size: 14px; line-height: 1.45; } .tour-simulation { display: none; } }
@media (max-height: 480px) { .tour-popover { gap: 3px; padding: 10px; } .tour-description { display: none; } }
@media (prefers-reduced-motion: reduce) { .tour-pointer, .tour-pointer svg, .tour-progress i, .sample-demo-file li, .tour-proof-file i b { animation: none; transition: none; } .tour-proof-file i b { width: 100%; } }

/* ---------- shell ---------- */
.app-shell { min-height: 100vh; }
.main { min-width: 0; }
.page-content { max-width: var(--page); margin: 0 auto; padding: 0 28px; }

/* top bar: brand · 4-site tabs · actions (v2 .top) */
.topbar { position: sticky; top: 0; z-index: 40; height: var(--top); display: flex; align-items: center; gap: 12px; padding: 0 20px; background: rgba(246, 246, 250, .86); -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px); transition: box-shadow .2s; }
.topbar.lift { box-shadow: 0 1px 0 var(--line); }
.mobile-menu, .icon-button { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-2); transition: background .15s, color .15s; }
.mobile-menu:hover, .icon-button:hover { background: var(--soft); color: var(--ink); }
.mobile-menu svg, .icon-button svg { width: 22px; height: 22px; }
.brand { flex: 0 1 auto; display: flex; align-items: center; gap: 10px; max-width: 100%; min-width: 0; overflow: hidden; color: inherit; text-decoration: none; }
.brand-mark { flex: none; width: 36px; height: 36px; display: block; }
.brand-mark svg { width: 36px; height: 33px; margin-top: 2px; }
.brand-copy { min-width: 0; display: grid; gap: 2px; overflow: hidden; }
.brand-copy strong { overflow: hidden; font-size: 17px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.brand-copy small { max-width: 100%; overflow: hidden; color: var(--ink-3); font-size: 12px; font-weight: 600; letter-spacing: 0; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.site-tabs { flex: none; margin: 0 auto; }
.site-tabs a { height: 40px; padding: 0 14px; }
.topbar-actions { flex: none; display: flex; align-items: center; gap: 6px; }
.topbar-actions > * { flex: none; }
.topbar-actions .label { white-space: nowrap; }
.tour-replay-button, .top-work-button { height: 44px; display: inline-flex; align-items: center; gap: 7px; padding: 0 14px; border-radius: 999px; color: var(--ink-2); font-size: 15px; font-weight: 650; transition: background .15s, color .15s; }
.tour-replay-button:hover, .top-work-button:hover { background: var(--soft); color: var(--ink); }
.tour-replay-button svg, .top-work-button svg, .top-new-button svg { width: 20px; height: 20px; flex: none; }
.top-work-button:disabled { opacity: .45; cursor: default; }
.top-work-button.running { background: var(--b-ll); color: var(--b-dd); }
.top-new-button { height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 0 18px 0 14px; border-radius: 999px; background: var(--b); color: #fff; font-size: 15px; font-weight: 700; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); transition: background .15s; }
.top-new-button:hover { background: var(--b-d); }
.workspace-login-button { order: 9; height: 44px; padding: 0 18px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 15px; font-weight: 700; white-space: nowrap; transition: background .15s; }
.workspace-login-button:hover { background: var(--b-l); }
.workspace-login-button[hidden] { display: none; }
.save-state { display: inline-flex; align-items: center; gap: 6px; padding: 0 6px; color: var(--ink-3); font-size: 14px; font-weight: 600; white-space: nowrap; }
.save-state i { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }
.guest-workspace .save-state { display: none; }
/* locale switch injected by locale-shell.js (its own <style> loads later, so selectors carry extra weight) */
html body .topbar-actions .arche-locale-switch { order: 8; position: relative; display: inline-flex; gap: 0; padding: 3px; border: 0; border-radius: 999px; background: var(--soft); box-shadow: none; }
html body .topbar-actions .arche-locale-switch .ind { position: absolute; left: 0; top: 0; border-radius: 999px; background: #fff; box-shadow: 0 2px 8px rgba(32, 31, 54, .1); pointer-events: none; }
html body .topbar-actions .arche-locale-switch button { position: relative; z-index: 1; min-width: 44px; height: 38px; padding: 0 10px; border-radius: 999px; background: transparent; color: var(--ink-3); font: 700 14px/1 Pretendard, "Pretendard Variable", system-ui, -apple-system, sans-serif; letter-spacing: 0; }
html body .topbar-actions .arche-locale-switch:not(.has-ind) button[aria-pressed="true"] { background: #fff; box-shadow: 0 2px 8px rgba(32, 31, 54, .1); }
html body .topbar-actions .arche-locale-switch button[aria-pressed="true"] { color: var(--ink); }

/* workspace drawer (former sidebar): left sheet on every width, opened by the menu button */
.sidebar { position: fixed; z-index: 60; top: 12px; bottom: 12px; left: 12px; width: min(var(--sidebar-width), calc(100vw - 24px)); display: flex; flex-direction: column; justify-content: space-between; gap: 16px; padding: 22px 18px 18px; overflow-y: auto; border-radius: 30px; background: #fff; box-shadow: var(--sh-lg); visibility: hidden; transform: translateX(calc(-100% - 24px)); }
body.menu-open .sidebar { visibility: visible; transform: none; }
.sidebar.is-live { visibility: visible; }
.drawer-head { padding: 0 8px 6px; }
.breadcrumb { display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 15px; font-weight: 600; }
.breadcrumb strong { color: var(--ink); font-size: 18px; font-weight: 800; }
.side-nav { display: grid; gap: 4px; margin-top: 8px; }
.side-nav p { margin: 14px 10px 4px; color: var(--ink-3); font-size: 13px; font-weight: 700; letter-spacing: .02em; }
.side-nav a { position: relative; min-height: 52px; display: flex; align-items: center; gap: 12px; padding: 0 14px; border-radius: 18px; color: var(--ink-2); text-decoration: none; font-size: 16px; font-weight: 650; transition: background .15s, color .15s; }
.side-nav a:hover { background: var(--bg); color: var(--ink); }
.side-nav a.active { background: var(--b-ll); color: var(--b-dd); font-weight: 750; }
.side-nav a svg { width: 22px; height: 22px; flex: none; }
.side-nav a span { min-width: 30px; height: 26px; display: grid; place-items: center; margin-left: auto; padding: 0 9px; border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 13px; font-weight: 800; }
.side-nav a.active span { color: var(--b-dd); }
.usage-card { padding: 16px 18px; border-radius: 22px; background: var(--bg); }
.usage-card > div { display: flex; justify-content: space-between; align-items: center; }
.usage-card span { color: var(--ink-2); font-size: 14px; font-weight: 700; }
.usage-card strong { font-size: 14px; font-weight: 750; }
.usage-card > i { display: block; height: 8px; margin: 10px 0 8px; overflow: hidden; border-radius: 9px; background: #fff; }
.usage-card > i span { display: block; height: 100%; border-radius: inherit; background: var(--b); }
.service-card p { color: var(--ink-2); font-size: 13px; line-height: 1.5; }
.service-card.connected strong { color: #08795f; }
.service-card.connected > i span { width: 100% !important; background: var(--ok); }
.account-card { width: 100%; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-top: 10px; padding: 8px 6px 0; }
.account-card[hidden] { display: none; }
.account-avatar { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--b); color: #fff; font-size: 14px; font-weight: 800; }
.account-card > span:nth-child(2) { min-width: 0; display: grid; gap: 1px; }
.account-card strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.account-card small { overflow: hidden; color: var(--ink-3); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.logout-button { min-height: 44px; padding: 0 14px; border-radius: 999px; background: var(--soft); color: var(--ink-2); font-size: 14px; font-weight: 700; }
.logout-button:hover { background: var(--red-l); color: #b4232a; }
.mobile-scrim { position: fixed; inset: 0; z-index: 55; background: rgba(32, 31, 54, .32); opacity: 0; pointer-events: none; }
body.menu-open .mobile-scrim { opacity: 1; pointer-events: auto; }
.mobile-scrim.is-live { pointer-events: none; }
body.menu-open .mobile-scrim.is-live { pointer-events: auto; }

/* ---------- intro ---------- */
.page-intro { padding: 56px 0 28px; text-align: center; }
.page-intro h1 { font-size: 52px; font-weight: 800; letter-spacing: -.045em; }
.intro-copy { margin-top: 14px; color: var(--ink-2); font-size: 18px; }
.eyebrow { margin: 0 0 6px; color: var(--b-d); font-size: 15px; font-weight: 700; letter-spacing: 0; }

/* ---------- file card: 파일로 바로 시작 ---------- */
.ai-add-card { position: relative; display: grid; justify-items: center; gap: 0; padding: 40px 32px 36px; border-radius: 44px; background: #fff; box-shadow: var(--sh); text-align: center; }
.ai-add-card::before { content: ""; position: absolute; inset: 12px; border: 2.5px dashed var(--b-l); border-radius: 34px; pointer-events: none; transition: border-color .15s; }
.ai-add-card:has(.ai-drop-zone.dragging)::before, .ai-add-card:has(.ai-drop-zone.is-tour-upload)::before { border-color: var(--b); }
.ai-add-heading { display: grid; justify-items: center; }
.ai-add-icon { display: block; width: 120px; height: 110px; will-change: transform; }
.ai-add-icon svg { width: 120px; height: 110px; }
.ai-add-heading h2 { margin-top: 10px; font-size: 34px; font-weight: 800; }
.ai-add-heading p { max-width: 620px; margin-top: 10px; color: var(--ink-2); font-size: 17px; }
.ai-add-form { width: min(640px, 100%); margin-top: 22px; }
.ai-drop-zone { position: relative; min-width: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 14px 14px 14px 16px; border-radius: 26px; background: var(--bg); text-align: left; cursor: pointer; outline: 0; transition: background .15s, box-shadow .15s; }
.ai-drop-zone:hover { background: var(--b-lll); box-shadow: inset 0 0 0 2px var(--b-l); }
.ai-drop-zone:focus-visible, .ai-drop-zone.dragging { background: var(--b-lll); box-shadow: inset 0 0 0 2.5px var(--b); }
.ai-drop-zone.busy { cursor: wait; background: var(--b-lll); box-shadow: inset 0 0 0 2px var(--b-l); }
.ai-drop-zone input, .ai-chat-file input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ai-drop-zone > svg { width: 52px; height: 52px; padding: 13px; border-radius: 18px; background: #fff; color: var(--b); }
.ai-drop-zone > span { min-width: 0; display: grid; gap: 2px; }
.ai-drop-zone strong { overflow: hidden; font-size: 16px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.ai-drop-zone small { overflow: hidden; color: var(--ink-2); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.ai-drop-zone > b { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 14px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 14px; font-weight: 750; white-space: nowrap; }
.ai-add-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.new-review-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 58px; padding: 0 28px; border-radius: 999px; background: var(--b); color: #fff; font-size: 18px; font-weight: 700; white-space: nowrap; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); transition: background .15s; }
.new-review-button:hover { background: var(--b-d); }
.new-review-button svg { width: 22px; height: 22px; }

/* ---------- interactive sample ---------- */
.workspace-sample { margin-top: 88px; }
.workspace-sample-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.workspace-sample-heading > div { flex: 1; min-width: 260px; }
.workspace-sample-heading h2 { font-size: 36px; font-weight: 800; }
.workspace-sample-heading p:last-child { max-width: 640px; margin-top: 10px; color: var(--ink-2); font-size: 17px; }
.sample-data-badge { flex: none; display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 14px; font-weight: 700; }
.sample-card { padding: 28px; border-radius: 36px; background: #fff; box-shadow: var(--sh); }
.sample-feature-tabs { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); padding: 4px; border-radius: 999px; background: var(--soft); }
.sample-feature-tabs .ind { position: absolute; left: 0; top: 0; border-radius: 999px; background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); pointer-events: none; will-change: transform, width; }
.sample-feature-tabs button { position: relative; z-index: 1; min-width: 0; height: 48px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 8px; border-radius: 999px; color: var(--ink-2); font-size: 15px; font-weight: 650; white-space: nowrap; }
.sample-feature-tabs:not(.has-ind) button.active { background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); }
.sample-feature-tabs button.active { color: var(--ink); font-weight: 750; }
.sample-feature-tabs button span { width: 26px; height: 22px; flex: none; display: inline-grid; place-items: center; border-radius: 999px; background: rgba(32, 31, 54, .06); color: var(--ink-3); font-size: 12px; font-weight: 800; }
.sample-feature-tabs button.active span { background: var(--b); color: #fff; }
.sample-feature-panel { padding-top: 20px; outline: none; }
.sample-feature-panel:focus-visible { border-radius: 20px; box-shadow: 0 0 0 3px var(--b-l); }
.sample-process-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.sample-process-bar span { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 6px; border-radius: 999px; background: var(--soft); color: var(--ink-2); font-size: 14px; font-weight: 700; }
.sample-process-bar span:nth-of-type(2) { background: var(--b-ll); color: var(--b-dd); }
.sample-process-bar i { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: #fff; font-size: 12px; font-style: normal; font-weight: 800; }
.sample-process-bar strong { font-weight: 750; }
.sample-process-bar b { color: var(--ink-3); font-weight: 600; }
.sample-compare-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 340px); gap: 16px; align-items: start; }
.sample-compare-grid[hidden], .sample-review-example[hidden] { display: none; }
.sample-diff-legend { grid-column: 1 / -1; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px; margin-top: -2px; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.sample-diff-legend[hidden] { display: none; }
.sample-diff-legend span { display: inline-flex; align-items: center; gap: 6px; }
.sample-diff-legend i { display: inline-block; width: 22px; height: 14px; border-radius: 6px; }
.sample-diff-legend i.removed { background: var(--red-l); box-shadow: inset 0 0 0 1.5px #f3b0b3; }
.sample-diff-legend i.added { background: var(--ok-l); box-shadow: inset 0 0 0 1.5px #9ee0c9; }
.sample-change { padding: 1px 6px; border-radius: 10px; color: inherit; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.sample-change.removed { background: var(--red-l); color: #b4232a; text-decoration: line-through; text-decoration-thickness: 2px; text-decoration-color: rgba(180, 35, 42, .5); }
.sample-change.added { background: var(--ok-l); color: #08795f; font-weight: 650; }
.sample-document, .sample-rationale { min-width: 0; margin: 0; padding: 20px 22px; border-radius: 26px; }
.sample-document { background: var(--bg); }
.sample-document.after { background: #fff; box-shadow: inset 0 0 0 2px var(--b-ll); }
.sample-document > header { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.sample-document header span { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; background: #fff; color: var(--ink-3); font-size: 12px; font-weight: 800; }
.sample-document.after header span { background: var(--b-ll); color: var(--b-dd); }
.sample-document header strong { color: var(--ink-2); font-size: 15px; font-weight: 750; }
.sample-document.after header strong { color: var(--b-d); }
.sample-document p { margin: 0; color: var(--ink); font-size: 18px; line-height: 2; word-break: keep-all; }
.sample-rationale { background: var(--b-lll); }
.sample-rationale > header { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: center; }
.sample-rationale header > div { min-width: 0; display: grid; gap: 2px; }
.sample-rationale header strong { font-size: 16px; line-height: 1.3; }
.sample-rationale header small { color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.sample-rationale ul { display: grid; gap: 10px; margin: 14px 0 0; padding: 0; list-style: none; }
.sample-rationale li { position: relative; padding-left: 30px; font-size: 15px; line-height: 1.55; }
.sample-rationale li::before { content: ""; position: absolute; left: 0; top: 1px; width: 22px; height: 22px; border-radius: 8px; background: var(--b-l); }
.sample-rationale li::after { content: ""; position: absolute; left: 7px; top: 7px; width: 8px; height: 5px; border-left: 2.2px solid var(--b-dd); border-bottom: 2.2px solid var(--b-dd); transform: rotate(-45deg); }
.sample-checks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.sample-checks span { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 11px; border-radius: 999px; background: var(--ok-l); color: #08795f; font-size: 13px; font-weight: 700; }
.sample-checks i { font-style: normal; font-weight: 850; }
.comment-avatar { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--b); color: #fff; font-size: 15px; font-weight: 800; }
.sample-review-example { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.sample-review-input { grid-column: 1 / -1; padding: 18px 22px; border-radius: 26px; background: var(--bg); }
.sample-review-input header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.sample-review-input header span { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; background: #fff; color: var(--ink-3); font-size: 12px; font-weight: 800; }
.sample-review-input header strong { color: var(--ink-2); font-size: 15px; }
.sample-review-input p { color: var(--ink); font-size: 16px; line-height: 1.75; }
.sample-reviewers { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.sample-reviewers article { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 4px 10px; align-items: center; padding: 16px; border-radius: 22px; background: #fff; box-shadow: 0 1px 2px rgba(32, 31, 54, .05), 0 12px 30px -22px rgba(32, 31, 54, .35); }
.sample-reviewers article > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--b-ll); color: var(--b-dd); font-size: 15px; font-weight: 800; }
.sample-reviewers article.meta > span { background: var(--b); color: #fff; }
.sample-reviewers article > div { min-width: 0; display: grid; gap: 1px; }
.sample-reviewers strong { font-size: 15px; line-height: 1.3; }
.sample-reviewers small { color: var(--ink-2); font-size: 13px; }
.sample-reviewers i { grid-column: 1 / -1; justify-self: start; display: inline-flex; align-items: center; height: 28px; margin-top: 8px; padding: 0 11px; border-radius: 999px; background: var(--ok-l); color: #08795f; font-size: 13px; font-style: normal; font-weight: 700; }
.sample-review-result { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.sample-score-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-content: start; }
.sample-score-row > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 4px; padding: 14px 16px; border-radius: 20px; background: var(--bg); }
.sample-score-row small { flex-basis: 100%; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.sample-score-row strong { font-size: 30px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; }
.sample-score-row span { color: var(--ink-3); font-size: 15px; font-weight: 700; }
.sample-decision { padding: 22px 24px; border-radius: 26px; background: var(--b); color: #fff; }
.sample-decision span { display: block; font-size: 13px; font-weight: 700; opacity: .8; }
.sample-decision strong { display: block; margin: 4px 0 8px; scroll-margin-block-end: 36px; font-size: 26px; font-weight: 800; letter-spacing: -.035em; line-height: 1.25; }
.sample-decision p { font-size: 15.5px; line-height: 1.65; opacity: .92; }
.sample-finding-grid { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sample-finding-grid article { padding: 16px 18px; border-radius: 22px; background: var(--bg); }
.sample-finding-grid strong { font-size: 15px; }
.sample-finding-grid p { margin-top: 4px; color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.sample-limitation { grid-column: 1 / -1; color: var(--ink-3); font-size: 14px; line-height: 1.5; }
.workspace-sample-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-top: 20px; padding: 18px 20px; border-radius: 24px; background: var(--bg); }
.workspace-sample-footer p { flex: 1; min-width: 220px; display: grid; gap: 2px; }
.workspace-sample-footer strong { font-size: 16px; }
.workspace-sample-footer span { color: var(--ink-2); font-size: 15px; line-height: 1.5; }
.workspace-sample-footer button { height: 48px; padding: 0 22px; border-radius: 999px; background: var(--b); color: #fff; font-size: 16px; font-weight: 700; white-space: nowrap; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); transition: background .15s; }
.workspace-sample-footer button:hover { background: var(--b-d); }

/* ---------- summary strip ---------- */
.summary-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 88px 0 16px; }
.summary-item, .summary-quality { min-width: 0; padding: 20px 20px 18px; border-radius: 26px; background: #fff; box-shadow: var(--sh); }
.summary-item { display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 8px; }
.summary-item > div { display: contents; }
.summary-item .roll-view, .summary-quality .roll-view { grid-column: 1 / -1; font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; }
.summary-icon { display: block; width: 26px; height: 26px; }
.summary-icon svg { width: 26px; height: 26px; }
.summary-item small { color: var(--ink-2); font-size: 15px; font-weight: 650; }
.summary-item strong { font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; }
.summary-quality { display: grid; align-content: start; gap: 6px; }
.summary-quality > span { display: flex; align-items: center; gap: 8px; color: var(--ink-2); font-size: 15px; font-weight: 650; }
.summary-quality > span svg { width: 26px; height: 26px; }
.summary-quality > strong { display: flex; align-items: baseline; gap: 2px; font-size: 34px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; }
.summary-quality > strong small { color: var(--ink-3); font-size: 16px; font-weight: 700; }
.summary-quality p { color: #08795f; font-size: 13px; font-weight: 700; }
.summary-quality p i { display: none; }
.roll-src { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* ---------- manuscript list ---------- */
.workspace-grid { display: block; }
.queue-card { min-width: 0; padding: 26px; border-radius: 36px; background: #fff; box-shadow: var(--sh); }
.queue-heading { display: flex; align-items: center; gap: 12px; }
.queue-heading > div { flex: 1; min-width: 0; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
.queue-heading h2 { font-size: 28px; font-weight: 800; }
.queue-heading p { color: var(--ink-2); font-size: 16px; font-weight: 600; }
.compact-add { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--b-ll); color: var(--b-dd); transition: background .15s; }
.compact-add:hover { background: var(--b-l); }
.compact-add svg { width: 22px; height: 22px; }
.queue-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 18px 0 14px; }
.language-tabs { position: relative; display: inline-flex; padding: 4px; border-radius: 999px; background: var(--soft); }
.language-tabs .ind { position: absolute; left: 0; top: 0; border-radius: 999px; background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); pointer-events: none; will-change: transform, width; }
.language-tabs button { position: relative; z-index: 1; height: 40px; padding: 0 16px; border-radius: 999px; color: var(--ink-2); font-size: 15px; font-weight: 650; white-space: nowrap; }
.language-tabs:not(.has-ind) button.active { background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); }
.language-tabs button.active { color: var(--ink); font-weight: 750; }
.language-tabs button span { margin-left: 5px; font-size: 13px; font-weight: 700; opacity: .65; }
.queue-tools { flex: 1; min-width: 0; display: flex; gap: 10px; }
.search-field { flex: 1; min-width: 200px; height: 48px; display: flex; align-items: center; gap: 10px; padding: 0 18px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); transition: box-shadow .15s; }
.search-field:focus-within { box-shadow: inset 0 0 0 2px var(--b); }
.search-field svg { width: 20px; height: 20px; flex: none; color: var(--ink-3); }
.search-field input { width: 100%; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; font-size: 16px; }
.search-field input::placeholder { color: var(--ink-3); }
.filter-select { position: relative; height: 48px; display: flex; align-items: center; }
.filter-select select { height: 100%; min-width: 130px; padding: 0 42px 0 18px; border: 0; border-radius: 999px; background: var(--soft); color: var(--ink); font-size: 16px; font-weight: 650; appearance: none; -webkit-appearance: none; cursor: pointer; }
.filter-select select:focus-visible { outline: 3px solid var(--b-l); outline-offset: 2px; }
.filter-select svg { position: absolute; right: 14px; width: 20px; height: 20px; color: var(--ink-2); pointer-events: none; }
.table-wrap { min-height: 200px; overflow-x: auto; border-radius: 24px; }
.table-wrap:focus-visible { outline: 3px solid var(--b-l); outline-offset: 2px; }
.table-scroll-hint { display: none; }
.manuscript-table { width: 100%; border-collapse: separate; border-spacing: 0 8px; table-layout: fixed; margin-top: -8px; }
.manuscript-table col[data-column-col="manuscript"] { width: 34%; }
.manuscript-table col[data-column-col="language"] { width: 9%; }
.manuscript-table col[data-column-col="scope"] { width: 18%; }
.manuscript-table col[data-column-col="status"] { width: 15%; }
.manuscript-table col[data-column-col="updated"] { width: 13%; }
.manuscript-table col[data-column-col="menu"] { width: 104px; }
.manuscript-table th { position: relative; width: auto !important; height: 30px; padding: 0 12px; color: var(--ink-3); font-size: 13px; font-weight: 700; text-align: left; white-space: nowrap; }
.manuscript-table th:first-child { padding-left: 18px; }
.column-resizer { position: absolute; z-index: 2; top: 2px; right: -5px; width: 10px; height: 26px; padding: 0; border: 0; background: transparent; cursor: col-resize; touch-action: none; }
.column-resizer::after { content: ""; position: absolute; top: 4px; bottom: 4px; left: 4px; width: 2px; border-radius: 2px; background: var(--b-l); opacity: 0; transition: opacity 120ms; }
.manuscript-table th:hover .column-resizer::after, .column-resizer:focus-visible::after, body.resizing-column .column-resizer::after { opacity: 1; }
.manuscript-table td { height: 76px; padding: 12px; background: var(--bg); vertical-align: middle; transition: background .15s; }
.manuscript-table td:first-child { padding-left: 18px; border-radius: 24px 0 0 24px; }
.manuscript-table td:last-child { padding-right: 16px; border-radius: 0 24px 24px 0; }
.manuscript-table tbody tr { will-change: transform; cursor: pointer; }
.manuscript-table tbody tr:hover td { background: #efeff6; }
.manuscript-table tbody tr.selected td { background: var(--b-lll); }
.manuscript-table tbody tr.selected td:first-child { box-shadow: inset 3px 0 0 var(--b); }
.manuscript-table tbody tr.processing td { background: var(--b-lll); }
.manuscript-table tbody tr:focus-visible { outline: 3px solid var(--b-l); outline-offset: 2px; border-radius: 24px; }
.manuscript-cell { min-width: 0; display: flex; align-items: center; gap: 14px; }
.file-type-icon { width: 48px; height: 48px; flex: none; display: grid; place-items: center; border-radius: 16px; background: var(--b-ll); color: var(--b-dd); font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.manuscript-copy { min-width: 0; }
.manuscript-title { display: -webkit-box; max-width: 100%; min-height: 0; overflow: hidden; padding: 0; color: var(--ink); font-size: 16px; font-weight: 700; line-height: 1.4; text-align: left; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.manuscript-title:hover { color: var(--b-d); }
.manuscript-copy small { display: block; max-width: 100%; margin-top: 3px; overflow: hidden; color: var(--ink-2); font-size: 13.5px; text-overflow: ellipsis; white-space: nowrap; }
.manuscript-link { margin-left: 6px; color: var(--b-d); font-weight: 650; text-decoration: none; }
.language-badge { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 10px; border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 13px; font-weight: 800; white-space: nowrap; }
.language-badge i { display: none; }
.language-badge.pending { color: var(--b-dd); }
.language-badge.pending i { display: block; width: 7px; height: 7px; border-radius: 50%; background: var(--b); animation: aiPulse 1.1s ease-in-out infinite; }
.scope-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.scope-tag { display: inline-flex; align-items: center; height: 26px; max-width: 100%; padding: 0 9px; border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 13px; font-weight: 700; white-space: nowrap; }
.scope-more { display: inline-flex; align-items: center; height: 26px; padding: 0 4px; color: var(--ink-3); font-size: 13px; font-weight: 700; }
.status-button { --status-fg: var(--ink-2); --status-bg: #fff; height: 40px; display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 0 12px 0 14px; border-radius: 999px; background: var(--status-bg); color: var(--status-fg); font-size: 14px; font-weight: 750; white-space: nowrap; transition: filter .15s; }
.status-button i { display: none; }
.status-button svg { width: 16px; height: 16px; flex: none; }
.status-button:hover { filter: brightness(.97); }
/* v2 per-status palette (same 5 stages, distinct colors) */
.status-button.status-received, .status-option.status-received { --status-fg: var(--ink-2); --status-bg: #fff; --option-color: #9796ad; }
.status-button.status-received { box-shadow: inset 0 0 0 1.5px var(--line); }
.status-button.status-mechanical, .status-option.status-mechanical { --status-fg: var(--b-dd); --status-bg: var(--b-ll); --option-color: #9a95ff; }
.status-button.status-deep, .status-option.status-deep { --status-fg: #fff; --status-bg: var(--b); --option-color: var(--b); }
.status-button.status-author, .status-option.status-author { --status-fg: #a24f00; --status-bg: var(--warn-l); --option-color: var(--warn); }
.status-button.status-done, .status-option.status-done { --status-fg: #08795f; --status-bg: var(--ok-l); --option-color: var(--ok); }
.status-button.processing { --status-fg: var(--b-dd); --status-bg: var(--b-ll); cursor: wait; }
.status-button.processing i { display: block; width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: aiPulse 1.1s ease-in-out infinite; }
.updated-cell { color: var(--ink-3); font-size: 13px; font-weight: 650; line-height: 1.4; }
.updated-cell strong { display: block; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.row-analysis { min-width: 72px; height: 44px; padding: 0 16px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 15px; font-weight: 750; white-space: nowrap; transition: background .15s; }
.row-analysis:hover { background: var(--b-l); }
.row-analysis:disabled, .row-analysis.processing { cursor: wait; background: var(--soft); color: var(--ink-3); }
.row-processing { display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; color: var(--b-d); font-weight: 700; }
.row-processing i { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--b); animation: aiPulse 1.1s ease-in-out infinite; }
.pending-upload .manuscript-title { color: var(--b-d); cursor: wait; }
.empty-state { display: grid; justify-items: center; padding: 36px 16px 28px; text-align: center; }
.empty-state[hidden] { display: none; }
.empty-state > span { display: none; }
.empty-state .empty-mascot { width: 104px; height: 96px; will-change: transform; }
.empty-state strong { margin-top: 10px; font-size: 20px; }
.empty-state p { margin-top: 4px; color: var(--ink-2); font-size: 15px; }
@keyframes aiPulse { 50% { opacity: .3; } }

/* floating status menu */
.status-menu { position: fixed; z-index: 250; width: 190px; display: grid; gap: 2px; padding: 6px; border-radius: 22px; background: #fff; box-shadow: var(--sh-lg); transform-origin: top left; will-change: transform, opacity; }
.status-menu[hidden] { display: none; }
.status-option { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 0 12px; border-radius: 16px; color: var(--ink); font-size: 15px; font-weight: 650; text-align: left; }
.status-option:hover, .status-option:focus { background: var(--bg); outline: 0; }
.status-option i { width: 10px; height: 10px; border-radius: 50%; background: var(--option-color); }
.status-option b { margin-left: auto; color: var(--b); font-size: 15px; }

/* ---------- footer ---------- */
.arche-footer.foot { margin-top: 80px; padding: 40px 0 calc(40px + var(--safe-b)); color: var(--ink-3); font-size: 14px; }
html body .arche-footer .policy-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 0 18px; width: auto; margin: 0 0 12px; padding: 0; border: 0; background: none; }
html body .arche-footer .policy-links button, html body .arche-footer .policy-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; color: var(--ink-2); font: 650 14px/1.4 Pretendard, "Pretendard Variable", system-ui, -apple-system, sans-serif; text-decoration: none; cursor: pointer; }
html body .arche-footer .policy-links button:hover, html body .arche-footer .policy-links a:hover { color: var(--ink); }
.biz-footer { color: var(--ink-3); font-size: 14px; line-height: 1.8; }
.biz-footer strong { color: var(--ink-2); font-weight: 750; }
.biz-footer a { color: inherit; text-underline-offset: 3px; }
.biz-footer .footer-copy { margin-top: 8px; }

/* ---------- dialogs: shared ---------- */
dialog { color: var(--ink); }
dialog::backdrop { background: rgba(32, 31, 54, .32); animation: proof-fade .2s ease both; }
@keyframes proof-fade { from { opacity: 0; } }

/* account gate */
.auth-gate { position: fixed; inset: 0; z-index: 500; width: 100%; max-width: none; height: 100%; max-height: none; display: grid; place-items: center; margin: 0; padding: 20px; overflow-y: auto; border: 0; background: transparent; }
.auth-gate:not([open]) { display: none; }
.auth-gate::backdrop { background: rgba(32, 31, 54, .32); }
.auth-card { position: relative; width: min(100%, 460px); display: grid; gap: 14px; padding: 34px 30px 26px; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); text-align: center; will-change: transform, opacity; }
.auth-close { position: absolute; top: 16px; right: 16px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 24px; line-height: 1; }
.auth-close:hover { background: #ebebf2; }
.auth-mark { justify-self: center; width: 84px; height: 78px; }
.auth-mark svg { width: 84px; height: 78px; }
.auth-card > p:first-of-type { color: var(--ink-3); font-size: 13px; font-weight: 700; }
.auth-card h1 { margin-top: -8px; font-size: 26px; font-weight: 800; }
.auth-card > span { color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.auth-card label { display: grid; gap: 6px; text-align: left; }
.auth-card label b { font-size: 14px; }
.auth-card input:not([type="checkbox"]) { height: 52px; padding: 0 18px; border: 0; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); outline: none; font-size: 16px; }
.auth-card input:not([type="checkbox"]):focus { box-shadow: inset 0 0 0 2px var(--b); }
.google-start-button { height: 54px; border-radius: 999px; background: var(--b); color: #fff; font-size: 17px; font-weight: 750; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); transition: background .15s; }
.google-start-button:hover { background: var(--b-d); }
.google-start-button:disabled { cursor: wait; opacity: .55; }
.google-start-button[hidden] { display: none; }
.google-sign-in { min-height: 44px; display: flex; justify-content: center; align-items: center; }
.google-sign-in[hidden] { display: none; }
.auth-status { min-height: 18px; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.auth-status.error { color: #b4232a; }
.legacy-auth-form { display: grid; gap: 12px; }
.legacy-auth-form[hidden] { display: none; }
.legacy-auth-form button { height: 52px; margin-top: 4px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 16px; font-weight: 700; }
.legacy-auth-form button:disabled { cursor: wait; opacity: .6; }
.auth-divider { display: flex; align-items: center; gap: 10px; color: var(--ink-3); font-size: 13px; font-weight: 650; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; flex: 1; background: var(--line); }
.auth-card > small { color: var(--ink-3); font-size: 13px; line-height: 1.6; }
html body .auth-card .legal-consent { gap: 10px; margin: 0; padding: 16px 18px; border: 0; border-radius: 22px; background: var(--b-lll); color: var(--ink-2); font: 500 14px/1.55 Pretendard, "Pretendard Variable", system-ui, -apple-system, sans-serif; }
html body .auth-card .legal-consent label { display: flex; gap: 10px; align-items: flex-start; text-align: left; }
html body .auth-card .legal-consent input[type="checkbox"] { width: 22px; height: 22px; flex: none; margin: 0; accent-color: var(--b); }
html body .auth-card .legal-consent button { min-height: 0; color: var(--b-d); font-weight: 700; }

/* locale-shell legal + account dialogs reskinned to v2 sheets */
html body .arche-legal-dialog, html body .arche-account-dialog { padding: 0; border: 0; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); color: var(--ink); }
html body .arche-legal-dialog article, html body .arche-account-dialog article { padding: 26px; }
html body .arche-legal-dialog header button, html body .arche-account-dialog header button { width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 22px; }
html body .arche-account-dialog article > div button { min-height: 48px; border: 0; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-weight: 750; }
html body .arche-account-dialog article > div button.danger { background: var(--red-l); color: #b4232a; }

/* analysis menu: v2 sheet (dialog on desktop, bottom sheet on mobile) */
.analysis-menu { position: fixed; z-index: 240; left: 50%; top: 50%; width: min(520px, calc(100vw - 32px)); padding: 0 0 8px; overflow: hidden; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); translate: -50% -50%; will-change: transform, opacity; }
.analysis-menu[hidden] { display: none; }
.analysis-menu > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 26px 26px 6px; }
.analysis-menu > header > div { min-width: 0; }
.analysis-menu header p { color: var(--ink-3); font-size: 14px; font-weight: 700; }
.analysis-menu header h2 { margin-top: 4px; overflow: hidden; font-size: 24px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.analysis-menu header span { display: block; margin-top: 6px; overflow: hidden; color: var(--ink-2); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.analysis-menu header button { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 24px; line-height: 1; }
.analysis-options { display: grid; gap: 8px; padding: 14px 26px 8px; }
.analysis-options > button { width: 100%; min-height: 76px; display: grid; grid-template-columns: 26px 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px 16px; border-radius: 22px; background: var(--bg); text-align: left; transition: background .15s; }
.analysis-options > button:hover { background: #efeff6; }
.analysis-options > button:disabled { cursor: wait; opacity: .55; }
.analysis-options > button > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--ink-3); font-size: 12px; font-weight: 800; }
.analysis-options > button > svg { width: 36px; height: 36px; }
.analysis-options > button > div { min-width: 0; display: grid; gap: 2px; }
.analysis-options strong { font-size: 17px; }
.analysis-options small { color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.analysis-options > button > i { color: var(--b); font-size: 20px; font-style: normal; font-weight: 700; }
.analysis-delete { width: calc(100% - 52px); min-height: 52px; margin: 0 26px 18px; border-radius: 22px; background: var(--red-l); color: #b4232a; font-size: 15px; font-weight: 700; }
.analysis-menu-scrim { position: fixed; z-index: 230; inset: 0; background: rgba(32, 31, 54, .32); opacity: 0; pointer-events: none; }
body.analysis-menu-open .analysis-menu-scrim { opacity: 1; pointer-events: auto; }

/* ---------- full editor ---------- */
.editor-dialog { width: calc(100vw - 32px); max-width: none; height: calc(100vh - 32px); max-height: none; margin: 16px; padding: 0; overflow: hidden; overscroll-behavior: contain; border: 0; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); will-change: transform, opacity; }
.editor-shell { min-height: 0; height: 100%; display: grid; grid-template-rows: 58px minmax(0, 1fr); }
.editor-topbar { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 12px; padding: 0 16px; border-bottom: 1px solid var(--line); background: #fff; }
.editor-document { min-width: 0; display: flex; align-items: center; gap: 10px; }
.editor-close { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink-2); }
.editor-close:hover { background: #ebebf2; }
.editor-close svg { width: 22px; height: 22px; }
.editor-file-icon { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 14px; background: var(--b-ll); color: var(--b-dd); font-size: 12px; font-weight: 800; }
.editor-document > div { min-width: 0; display: grid; gap: 1px; }
.editor-document strong { overflow: hidden; font-size: 17px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.editor-document small { overflow: hidden; color: var(--ink-2); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.editor-status { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 999px; background: var(--ok-l); color: #08795f; font-size: 13px; font-weight: 700; white-space: nowrap; }
.editor-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }
.editor-status.running { background: var(--b-ll); color: var(--b-dd); }
.editor-status.running i { background: var(--b); animation: aiPulse 1.1s ease-in-out infinite; }
.editor-status.error { background: var(--red-l); color: #b4232a; }
.editor-status.error i { background: var(--red); }
.editor-actions { display: flex; justify-content: flex-end; gap: 6px; min-width: 0; }
.editor-export, .editor-complete, .editor-next { flex: none; height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 15px; border-radius: 999px; font-size: 14px; font-weight: 700; white-space: nowrap; transition: background .15s; }
.editor-export { background: var(--soft); color: var(--ink); }
.editor-export:hover { background: #ebebf2; }
.editor-export.danger { background: var(--red-l); color: #b4232a; }
.editor-export svg { width: 18px; height: 18px; }
.editor-next { background: var(--b-ll); color: var(--b-dd); }
.editor-next:hover { background: var(--b-l); }
.editor-next[hidden] { display: none; }
.editor-complete { background: var(--b); color: #fff; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); }
.editor-complete:hover { background: var(--b-d); }
.editor-actions button:disabled { cursor: default; opacity: .45; }
.editor-layout { min-height: 0; height: 100%; position: relative; display: grid; grid-template-columns: 236px minmax(0, 1fr) 380px; overflow: hidden; }
.change-connectors { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.change-connectors[hidden] { display: none; }
.change-connectors path { fill: none; stroke: rgba(91, 84, 240, .7); stroke-width: 2; }
.change-connectors circle { fill: #fff; stroke: var(--b); stroke-width: 2; }
.editor-rail { min-height: 0; max-height: 100%; padding: 20px 16px; background: var(--bg); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.rail-heading { display: flex; justify-content: space-between; align-items: baseline; padding: 0 6px 4px; }
.rail-heading span { font-size: 16px; font-weight: 800; }
.rail-heading strong { color: var(--b-d); font-size: 15px; font-weight: 800; }
.stage-guide { padding: 2px 6px 10px; }
.stage-guide strong { display: block; color: var(--ink-2); font-size: 13.5px; font-weight: 700; }
.stage-guide p { margin-top: 6px; color: var(--ink-2); font-size: 13.5px; line-height: 1.55; }
.rail-stages { position: relative; display: grid; gap: 4px; }
.rail-stage { position: relative; width: 100%; min-height: 56px; display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 12px; align-items: center; padding: 8px; border-radius: 20px; text-align: left; transition: background .15s, box-shadow .15s; }
.rail-stage:not(:last-child)::after { content: ""; position: absolute; left: 25px; top: 46px; bottom: -14px; width: 4px; border-radius: 9px; background: var(--line); }
.rail-stage.complete:not(:last-child)::after { background: var(--b); }
.rail-stage:hover { background: rgba(255, 255, 255, .6); }
.rail-stage.selected { background: #fff; box-shadow: var(--sh); }
.rail-stage > span { position: relative; z-index: 1; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 2px var(--line); color: var(--ink-3); font-size: 15px; font-weight: 800; }
.rail-stage.complete > span { background: var(--b); box-shadow: none; color: #fff; font-size: 0; }
.rail-stage.complete > span::after { content: ""; width: 12px; height: 7px; margin-top: -3px; border-left: 2.6px solid #fff; border-bottom: 2.6px solid #fff; transform: rotate(-45deg); }
.rail-stage.selected > span { box-shadow: inset 0 0 0 2.5px var(--b); color: var(--b-dd); }
.rail-stage.selected.complete > span { box-shadow: 0 0 0 3px var(--b-l); }
.rail-stage > div { min-width: 0; display: grid; gap: 1px; }
.rail-stage strong { font-size: 15px; line-height: 1.3; }
.rail-stage small { overflow: hidden; color: var(--ink-3); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.principle-card { display: flex; gap: 10px; margin-top: 14px; padding: 14px 16px; border-radius: 20px; background: #fff; }
.principle-card svg { width: 22px; height: 22px; flex: none; color: var(--b); }
.principle-card strong { display: block; font-size: 14px; }
.principle-card p { margin-top: 4px; color: var(--ink-2); font-size: 13.5px; line-height: 1.55; }
.editor-main { min-width: 0; min-height: 0; height: 100%; display: grid; grid-template-rows: auto auto auto auto minmax(0, 1fr); overflow: hidden; background: #fff; }
.editor-toolbar { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 20px 26px 4px; }
.editor-toolbar p { color: var(--b-d); font-size: 14px; font-weight: 750; }
.editor-toolbar h2 { margin-top: 4px; font-size: 28px; font-weight: 800; }
.editor-toolbar > div:first-child { flex: 1; min-width: 240px; }
.editor-toolbar > div:first-child > span { display: block; margin-top: 6px; color: var(--ink-2); font-size: 15.5px; }
.view-toggle { position: relative; display: inline-flex; padding: 4px; border-radius: 999px; background: var(--soft); }
.view-toggle .ind { position: absolute; left: 0; top: 0; border-radius: 999px; background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); pointer-events: none; will-change: transform, width; }
.view-toggle button { position: relative; z-index: 1; height: 40px; padding: 0 18px; border-radius: 999px; color: var(--ink-2); font-size: 15px; font-weight: 650; white-space: nowrap; }
.view-toggle:not(.has-ind) button.active { background: #fff; box-shadow: 0 2px 10px rgba(32, 31, 54, .1); }
.view-toggle button.active { color: var(--ink); font-weight: 750; }
.editor-live-strip { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; margin: 14px 26px 0; padding: 12px 16px; border-radius: 22px; background: var(--b-lll); box-shadow: inset 0 0 0 1.5px var(--b-ll); }
.editor-live-strip[hidden] { display: none; }
.editor-live-strip > span { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 999px; background: var(--b); color: #fff; font-size: 13px; font-weight: 800; }
.editor-live-strip > span i { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: aiPulse 1.1s ease-in-out infinite; }
.editor-live-strip > div { min-width: 0; display: grid; gap: 1px; }
.editor-live-strip strong { font-size: 15px; }
.editor-live-strip small { overflow: hidden; color: var(--ink-2); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.editor-live-strip time { color: var(--b-dd); font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
.editor-completion-notice { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: center; margin: 14px 26px 0; padding: 14px 16px; border-radius: 22px; background: var(--ok-l); }
.editor-completion-notice[hidden] { display: none; }
.editor-completion-notice > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ok); color: #fff; font-size: 15px; font-weight: 800; }
.editor-completion-notice > div { min-width: 0; display: grid; gap: 1px; }
.editor-completion-notice strong { color: #06604c; font-size: 15.5px; }
.editor-completion-notice small { color: #08795f; font-size: 14px; }
.editor-pagebar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 14px 26px 12px; }
.editor-pagebar > button { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink); font-size: 20px; }
.editor-pagebar > button:disabled { opacity: .35; cursor: default; }
.editor-pagebar > div { min-width: 88px; display: grid; gap: 0; }
.editor-pagebar strong { font-size: 14px; font-weight: 750; font-variant-numeric: tabular-nums; }
.editor-pagebar div span { max-width: 220px; overflow: hidden; color: var(--ink-2); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.editor-pagebar .draft-save-status { margin-left: auto; color: var(--ink-3); font-size: 13.5px; font-weight: 650; }
.editor-pagebar .draft-save-status.saving { color: #a24f00; }
.editor-pagebar .draft-save-status.error { color: #b4232a; }
.editor-pagebar .manual-edit-toggle { width: auto; height: 40px; padding: 0 16px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 14px; font-weight: 700; }
.editor-pagebar .manual-edit-toggle.active { background: var(--b); color: #fff; }
.editor-pagebar .manual-edit-toggle:disabled { opacity: .45; }
.document-compare { min-height: 0; height: 100%; display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 14px; padding: 0 26px 26px; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
.document-compare:focus-visible, .comment-panel:focus-visible { outline: 3px solid var(--b-l); outline-offset: -3px; }
.document-pane { min-width: 0; overflow: hidden; border-radius: 24px; background: var(--bg); }
.document-pane.revised-pane { background: #fff; box-shadow: inset 0 0 0 2px var(--b-ll); }
.document-pane > header { display: flex; align-items: center; gap: 8px; padding: 16px 20px 0; }
.document-pane > header span { font-size: 14px; font-weight: 750; color: var(--ink-2); }
.document-pane > header small { color: var(--ink-3); font-size: 12px; font-weight: 700; }
.revised-pane > header span { color: var(--b-d); }
.paper-page { min-width: 0; min-height: 420px; padding: 10px 20px 26px; overflow: hidden; }
.paper-meta { display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px dashed var(--line); color: var(--ink-3); font-size: 13px; font-weight: 650; }
.paper-page h3 { margin: 18px 0 12px; font-size: 18px; line-height: 1.45; }
.paper-page p { min-width: 0; max-width: 100%; margin: 0; color: var(--ink); font-size: 16.5px; line-height: 1.95; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; word-break: normal; }
.paper-page p.direct-editing { min-height: 360px; padding: 12px 14px; border-radius: 18px; background: #fff; outline: none; box-shadow: inset 0 0 0 2.5px var(--b); cursor: text; }
.paper-page p.direct-editing:empty::before { content: "현재 페이지를 직접 수정하세요."; color: var(--ink-3); }
.paper-page mark { -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.paper-page mark.diff-before, .paper-page mark.diff-after, .paper-page mark.diff-rejected, .paper-page mark.diff-kept { padding: 1px 4px; border-radius: 8px; }
.paper-page mark.diff-before { background: var(--red-l); color: #b4232a; text-decoration: line-through; text-decoration-color: rgba(180, 35, 42, .5); }
.paper-page mark.diff-after { background: var(--ok-l); color: #08795f; }
.paper-page mark.diff-rejected { background: var(--soft); color: var(--ink-2); }
.paper-page mark.diff-kept { background: var(--warn-l); color: #a24f00; }
.paper-page mark.change-linked { position: relative; z-index: 6; box-shadow: 0 0 0 2.5px var(--b); }
.paper-page del { padding: 1px 4px; border-radius: 8px; background: var(--red-l); color: #b4232a; }
.paper-page ins { padding: 1px 4px; border-radius: 8px; background: var(--ok-l); color: #08795f; text-decoration: none; }
.document-compare.original { grid-template-columns: minmax(0, 760px); justify-content: center; }
.document-compare.original .revised-pane { display: none; }
.document-compare.revised { grid-template-columns: minmax(0, 760px); justify-content: center; }
.document-compare.revised .original-pane { display: none; }
.comment-panel { min-height: 0; max-height: 100%; padding: 20px 20px 30px; border-left: 1px solid var(--line); background: #fff; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; }
.comment-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: 17px; font-weight: 800; }
.comment-heading b, .editor-change-list > div:first-child b, .editor-structure-list > div:first-child b { min-width: 24px; height: 24px; display: inline-grid; place-items: center; padding: 0 8px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 12.5px; font-weight: 800; }
.active-comment { padding: 14px 16px; border-radius: 22px; background: var(--b-lll); }
.active-comment > div { display: flex; align-items: center; gap: 10px; }
.active-comment > div p { display: grid; gap: 0; }
.active-comment > div strong { font-size: 15px; }
.active-comment > div small { color: var(--ink-2); font-size: 13px; }
.active-comment > p { margin: 10px 0 0; font-size: 15px; line-height: 1.6; }
.active-comment footer { margin-top: 8px; }
.active-comment footer span { color: var(--b-d); font-size: 13px; font-weight: 700; }
.editor-change-list, .editor-structure-list { margin-top: 22px; }
.editor-change-list > div:first-child, .editor-structure-list > div:first-child { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.editor-change-list h3, .editor-structure-list h3, .check-list h3 { font-size: 16px; font-weight: 800; }
#editorChanges, #editorStructuralSuggestions { display: grid; gap: 10px; }
.change-card { padding: 14px 16px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); will-change: transform; }
.change-card.change-linked { position: relative; z-index: 6; box-shadow: inset 0 0 0 2px var(--b), 0 12px 30px -18px rgba(91, 84, 240, .5); }
.change-card.unselected { background: var(--bg); }
.change-card.needs-review { box-shadow: inset 0 0 0 1.5px #ffd3a8; }
.change-card header { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.change-card header span { font-size: 15px; font-weight: 750; }
.change-card header b { height: 28px; display: inline-flex; align-items: center; padding: 0 11px; border-radius: 999px; background: var(--ok-l); color: #08795f; font-size: 13px; }
.change-decision { flex: none; display: inline-flex; padding: 3px; border-radius: 999px; background: var(--soft); }
.change-decision button { height: 36px; min-width: 52px; padding: 0 13px; border-radius: 999px; color: var(--ink-2); font-size: 14px; font-weight: 700; transition: background .15s, color .15s; }
.change-decision button.active[data-change-decision="accept"] { background: var(--b); color: #fff; }
.change-decision button.active[data-change-decision="reject"] { background: #fff; color: #b4232a; box-shadow: 0 2px 8px rgba(32, 31, 54, .1); }
.change-card .review-warning { display: block; margin-top: 10px; padding: 7px 11px; border-radius: 14px; background: var(--warn-l); color: #a24f00; font-size: 13.5px; line-height: 1.45; }
.change-card p { min-width: 0; display: grid; gap: 2px; margin: 10px 0 0; font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
.change-card small { color: var(--ink-3); font-size: 13px; font-weight: 700; }
.change-card del, .change-card ins { text-decoration: none; }
.change-card .change-before del { color: #b4232a; text-decoration: line-through; text-decoration-color: rgba(180, 35, 42, .45); }
.change-card .change-after ins { color: #08795f; font-weight: 600; }
.change-card footer { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.change-card.skipped { background: var(--bg); box-shadow: none; }
.change-card.skipped header b { background: var(--warn-l); color: #a24f00; }
.structure-card { padding: 16px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); }
.structure-card header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 8px; }
.structure-card header strong { font-size: 16px; line-height: 1.4; }
.structure-card header span { color: #a24f00; font-size: 13.5px; font-weight: 700; }
.structure-card p { margin: 6px 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.structure-card small { display: block; margin-top: 4px; color: var(--ink-2); font-size: 14px; line-height: 1.5; white-space: pre-line; }
.structure-card.resolved { background: var(--bg); box-shadow: none; }
.structure-card.resolved.accepted header span { color: #08795f; }
.structure-card.resolved.rejected header span { color: #b4232a; }
.structure-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.structure-actions button { min-height: 40px; padding: 0 16px; border-radius: 999px; background: var(--soft); color: var(--ink); font-size: 14px; font-weight: 700; }
.structure-actions button.active[data-structure-decision="accepted"] { background: var(--ok); color: #fff; }
.structure-actions button.active[data-structure-decision="rejected"] { background: var(--red-l); color: #b4232a; }
.changes-empty { padding: 14px 16px; border-radius: 18px; background: var(--bg); color: var(--ink-3); font-size: 14.5px; line-height: 1.5; }
.changes-empty.running { background: var(--b-lll); color: var(--b-dd); }
.check-list { margin-top: 22px; }
.check-list h3 { margin-bottom: 8px; }
#editorChecklist { display: grid; gap: 2px; }
.check-item { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; min-height: 40px; padding: 6px 8px; border-radius: 14px; font-size: 15px; line-height: 1.5; }
.check-item i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 8px; background: var(--b); color: #fff; font-size: 13px; font-style: normal; font-weight: 800; }
.run-log { display: grid; gap: 6px; max-height: 180px; margin-top: 18px; overflow-y: auto; }
.run-log:empty { display: none; }
.run-log p { margin: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 8px; padding: 8px 12px; border-radius: 14px; background: var(--bg); color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.run-log time { color: var(--ink-3); font-size: 13px; font-weight: 650; font-variant-numeric: tabular-nums; }
.run-log-text { min-width: 0; white-space: pre-wrap; }
.run-log p.user { background: var(--b-ll); color: var(--b-dd); }
.run-log p.error { background: var(--red-l); color: #b4232a; }
.steer-form { display: grid; gap: 8px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.steer-form > label { font-size: 16px; font-weight: 800; }
.steer-form textarea { width: 100%; min-height: 84px; resize: vertical; padding: 14px 16px; border: 0; border-radius: 20px; background: var(--soft); color: var(--ink); font-size: 16px; line-height: 1.5; outline: none; }
.steer-form textarea:focus { background: #fff; box-shadow: inset 0 0 0 2px var(--b); }
.steer-form > div { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.steer-file { position: relative; min-height: 40px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 999px; background: var(--soft); color: var(--ink); font-size: 14px; font-weight: 700; cursor: pointer; }
.steer-file input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.steer-form button { height: 40px; padding: 0 18px; border-radius: 999px; background: var(--b); color: #fff; font-size: 14px; font-weight: 700; }

/* ---------- reviewer simulation ---------- */
.review-dialog { width: min(1040px, calc(100vw - 32px)); height: min(900px, calc(100vh - 32px)); padding: 0; overflow: hidden; border: 0; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); will-change: transform, opacity; }
.review-shell { height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.review-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 26px 26px 10px; }
.review-header p, .review-section-heading p { color: var(--ink-3); font-size: 13px; font-weight: 700; }
.review-header h2 { margin-top: 4px; font-size: 26px; font-weight: 800; }
.review-header span { display: block; margin-top: 6px; color: var(--ink-2); font-size: 15px; }
.review-header > button { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 24px; line-height: 1; }
.review-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 26px 26px; }
.review-live { padding: 16px; border-radius: 26px; background: var(--bg); }
.review-result { margin-top: 18px; }
.review-result[hidden] { display: none; }
.review-section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.review-section-heading h3 { margin-top: 2px; font-size: 20px; font-weight: 800; }
.review-section-heading > span { display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 13px; font-weight: 700; }
.review-section-heading > span.fallback { background: var(--warn-l); color: #a24f00; }
.reviewer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.reviewer-card, .meta-review-card { display: grid; grid-template-columns: 36px minmax(0, 1fr) 10px; gap: 12px; align-items: center; min-height: 76px; padding: 14px 16px; border-radius: 22px; background: #fff; will-change: transform; transition: box-shadow .2s, background .2s; }
.reviewer-card > span, .meta-review-card > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--b-ll); color: var(--b-dd); font-size: 13px; font-weight: 800; }
.meta-review-card > span { background: var(--b); color: #fff; }
.reviewer-card > div, .meta-review-card > div { min-width: 0; display: grid; gap: 2px; }
.reviewer-card strong, .meta-review-card strong { font-size: 15.5px; }
.reviewer-card small, .meta-review-card small { overflow: hidden; color: var(--ink-2); font-size: 13.5px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.reviewer-card > i, .meta-review-card > i { width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.reviewer-card.starting, .reviewer-card.working, .meta-review-card.starting, .meta-review-card.working { box-shadow: inset 0 0 0 2px var(--b-l); }
.reviewer-card.starting > i, .reviewer-card.working > i, .meta-review-card.starting > i, .meta-review-card.working > i { background: var(--b); animation: aiPulse 1.1s ease-in-out infinite; }
.reviewer-card.completed > i, .meta-review-card.completed > i { background: var(--ok); }
.reviewer-card.completed, .meta-review-card.completed { box-shadow: inset 0 0 0 2px #9ee0c9; }
.reviewer-card.unavailable, .meta-review-card.unavailable { box-shadow: inset 0 0 0 2px #f3b0b3; }
.reviewer-card.unavailable > i, .meta-review-card.unavailable > i { background: var(--red); }
.meta-review-card { margin-top: 10px; }
.review-score-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.review-score-grid > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 4px; padding: 14px 16px; border-radius: 20px; background: var(--bg); }
.review-score-grid span { flex-basis: 100%; color: var(--ink-2); font-size: 14px; font-weight: 600; }
.review-score-grid strong { font-size: 30px; font-weight: 800; letter-spacing: -.03em; line-height: 1.2; }
.review-score-grid small { color: var(--ink-3); font-size: 15px; font-weight: 700; }
.review-summary-card { margin-top: 14px; padding: 22px 24px; border-radius: 26px; background: var(--b); color: #fff; }
.review-summary-card h4 { font-size: 14px; font-weight: 700; opacity: .85; }
.review-summary-card p { margin-top: 6px; font-size: 15.5px; line-height: 1.7; white-space: pre-wrap; opacity: .95; }
.review-summary-card > strong { display: block; margin-top: 10px; font-size: 22px; font-weight: 800; }
.review-findings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.review-findings-grid > section, .review-list-section { padding: 16px 18px; border-radius: 22px; background: var(--bg); }
.review-findings-grid h4, .review-list-section h4 { margin-bottom: 8px; font-size: 16px; font-weight: 800; }
.review-finding, .review-row { padding: 10px 0; border-top: 1px dashed var(--line); }
.review-finding:first-child, .review-row:first-child { border-top: 0; padding-top: 0; }
.review-finding strong, .review-row strong { font-size: 15px; line-height: 1.5; }
.review-finding p, .review-row p { margin-top: 4px; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; white-space: pre-wrap; }
.review-finding small, .review-row small { display: block; margin-top: 6px; color: var(--ink-2); font-size: 13.5px; line-height: 1.45; }
.review-list-section { margin-top: 10px; }
.review-row.question { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; }
.review-row.question > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--b-ll); color: var(--b-dd); font-size: 13px; font-weight: 800; }
.review-empty { color: var(--ink-3); font-size: 14.5px; }
.review-limitations { margin-top: 14px; color: var(--ink-3); font-size: 14px; line-height: 1.55; }
.review-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 26px calc(18px + var(--safe-b)); border-top: 1px solid var(--line); }
.review-footer p { display: grid; gap: 1px; }
.review-footer strong { font-size: 14px; }
.review-footer span { color: var(--ink-2); font-size: 13.5px; }
.review-footer button { flex: none; height: 48px; padding: 0 22px; border-radius: 999px; background: var(--b); color: #fff; font-size: 16px; font-weight: 700; box-shadow: 0 10px 24px -12px rgba(91, 84, 240, .7); }
.review-footer button:disabled { cursor: wait; opacity: .55; }

/* ---------- AI registration drawer ---------- */
.ai-add-drawer { position: fixed; z-index: 220; top: 12px; right: 12px; bottom: 12px; width: min(440px, calc(100vw - 24px)); display: grid; grid-template-rows: auto auto auto minmax(0, 1fr) auto; overflow: hidden; border-radius: 30px; background: #fff; box-shadow: var(--sh-lg); visibility: hidden; transform: translateX(calc(100% + 24px)); }
body.ai-drawer-open .ai-add-drawer { visibility: visible; transform: none; }
.ai-add-drawer.is-live { visibility: visible; }
.ai-add-drawer > header { display: flex; justify-content: space-between; gap: 12px; padding: 22px 22px 12px; }
.ai-add-drawer header p { color: var(--ink-3); font-size: 13px; font-weight: 700; }
.ai-add-drawer header h2 { margin-top: 2px; font-size: 22px; font-weight: 800; }
.ai-add-drawer header span { display: block; margin-top: 4px; color: var(--ink-2); font-size: 14px; }
.ai-add-drawer header button { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 24px; line-height: 1; }
.ai-drawer-files { display: flex; gap: 6px; padding: 0 22px 10px; overflow-x: auto; }
.ai-drawer-files:empty { display: none; }
.ai-drawer-files a { flex: none; max-width: 200px; height: 32px; display: inline-flex; align-items: center; overflow: hidden; padding: 0 12px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 13px; font-weight: 700; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.ai-progress-panel { margin: 0 16px; padding: 14px 16px; border-radius: 22px; background: var(--bg); }
.ai-progress-panel > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ai-progress-panel h3 { font-size: 16px; font-weight: 800; }
.ai-progress-panel > div > span { display: inline-flex; align-items: center; height: 28px; padding: 0 11px; border-radius: 999px; background: var(--b-ll); color: var(--b-dd); font-size: 13px; font-weight: 700; }
.ai-progress-panel > p { margin: 6px 0 8px; color: var(--ink-3); font-size: 13px; }
.ai-progress-feed { max-height: 190px; display: grid; gap: 4px; padding: 2px 0; overflow-y: auto; }
.ai-progress-feed p { margin: 0; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px; position: relative; padding: 6px 8px 6px 18px; border-radius: 12px; color: var(--ink-2); font-size: 13.5px; line-height: 1.45; }
.ai-progress-feed p::before { content: ""; position: absolute; left: 6px; top: .85em; width: 6px; height: 6px; border-radius: 50%; background: var(--b-l); }
.ai-progress-feed p.active { background: var(--b-lll); color: var(--b-dd); }
.ai-progress-feed p.active::before, .ai-progress-feed p.reasoning-live::before { background: var(--b); animation: aiPulse 1.1s ease-in-out infinite; }
.ai-progress-feed p.completed::before, .ai-progress-feed p.connected::before { background: var(--ok); }
.ai-progress-feed p.error::before { background: var(--red); }
.ai-progress-feed time { color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ai-progress-text { min-width: 0; white-space: pre-wrap; }
.ai-progress-feed:empty::after { content: "Codex 이벤트를 기다리고 있습니다…"; color: var(--ink-3); font-size: 13px; }
.ai-chat-messages { min-height: 0; display: grid; align-content: start; gap: 8px; overflow-y: auto; padding: 16px 22px; }
.ai-chat-message { max-width: 88%; padding: 10px 14px; border-radius: 20px; background: var(--bg); color: var(--ink); font-size: 15px; line-height: 1.55; white-space: pre-wrap; }
.ai-chat-message.user { justify-self: end; background: var(--b); color: #fff; }
.ai-chat-message.streaming::after { content: ""; display: inline-block; width: 6px; height: 13px; margin-left: 3px; border-radius: 2px; background: currentColor; opacity: .45; animation: cursorBlink 800ms infinite; }
@keyframes cursorBlink { 50% { opacity: 0; } }
.ai-chat-form { display: grid; gap: 8px; padding: 14px 18px calc(18px + var(--safe-b)); border-top: 1px solid var(--line); }
.ai-chat-form > label { font-size: 14px; font-weight: 700; }
.ai-chat-form textarea { width: 100%; min-height: 72px; resize: vertical; padding: 12px 16px; border: 0; border-radius: 20px; background: var(--soft); font-size: 16px; line-height: 1.5; outline: none; }
.ai-chat-form textarea:focus { background: #fff; box-shadow: inset 0 0 0 2px var(--b); }
.ai-chat-form > div { display: flex; align-items: center; gap: 8px; }
.ai-chat-file { position: relative; min-height: 40px; display: inline-flex; align-items: center; padding: 0 16px; border-radius: 999px; background: var(--soft); font-size: 14px; font-weight: 700; cursor: pointer; }
.ai-chat-form > div span { min-width: 0; flex: 1; overflow: hidden; color: var(--ink-3); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ai-chat-form button { height: 40px; padding: 0 18px; border-radius: 999px; background: var(--b); color: #fff; font-size: 14px; font-weight: 700; }
.ai-drawer-scrim { position: fixed; z-index: 210; inset: 0; background: rgba(32, 31, 54, .22); opacity: 0; pointer-events: none; }
body.ai-drawer-open .ai-drawer-scrim { opacity: 1; pointer-events: auto; }
.ai-chat-launcher { position: fixed; z-index: 44; right: 24px; bottom: calc(24px + var(--safe-b)); min-height: 60px; display: flex; align-items: center; gap: 10px; padding: 8px 18px 8px 10px; border-radius: 999px; background: #fff; box-shadow: var(--sh-lg); text-align: left; will-change: transform; }
.ai-chat-launcher[hidden], body.ai-drawer-open .ai-chat-launcher { display: none; }
.ai-chat-launcher-icon { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--b-ll); }
.ai-chat-launcher-icon svg { width: 28px; height: 28px; }
.ai-chat-launcher-copy { min-width: 0; display: grid; gap: 0; }
.ai-chat-launcher-copy strong { font-size: 15px; }
.ai-chat-launcher-copy small { max-width: 180px; overflow: hidden; color: var(--ink-2); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ai-chat-launcher > i { width: 8px; height: 8px; flex: none; border-radius: 50%; background: var(--line); }
.ai-chat-launcher.running > i { background: var(--ok); animation: aiPulse 1.1s ease-in-out infinite; }

/* ---------- extracted text editor ---------- */
.text-editor-dialog { width: min(900px, calc(100vw - 32px)); height: min(840px, calc(100vh - 32px)); padding: 0; overflow: hidden; border: 0; border-radius: 32px; background: #fff; box-shadow: var(--sh-lg); }
.text-editor-dialog form { height: 100%; display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; }
.text-editor-dialog header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 24px 26px 8px; }
.text-editor-dialog header p { color: var(--ink-3); font-size: 13px; font-weight: 700; }
.text-editor-dialog header h2 { margin-top: 2px; font-size: 24px; font-weight: 800; }
.text-editor-dialog header span { display: block; margin-top: 4px; color: var(--ink-2); font-size: 14px; }
.text-editor-dialog header button { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--soft); color: var(--ink-2); font-size: 24px; line-height: 1; }
.text-editor-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 26px 12px; color: var(--ink-2); font-size: 14px; }
.text-editor-toolbar strong { color: var(--ink); }
#textEditorText { width: calc(100% - 52px); height: calc(100% - 8px); justify-self: center; align-self: start; resize: none; padding: 22px 24px; border: 0; border-radius: 24px; background: var(--bg); color: var(--ink); font-size: 16px; line-height: 1.9; outline: none; }
#textEditorText:focus { background: #fff; box-shadow: inset 0 0 0 2px var(--b); }
.text-editor-dialog footer { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 26px calc(20px + var(--safe-b)); }
.text-editor-dialog footer button { height: 48px; padding: 0 22px; border-radius: 999px; background: var(--soft); font-size: 16px; font-weight: 700; }
.text-editor-dialog footer button[type="submit"] { background: var(--b); color: #fff; }

/* ---------- toast (app #toast; motion by proof-skin.js) ---------- */
#toast.toast { position: fixed; z-index: 950; left: 50%; right: auto; bottom: calc(24px + var(--safe-b)); width: max-content; max-width: calc(100vw - 32px); min-width: 0; min-height: 52px; display: flex; align-items: center; gap: 12px; padding: 10px 22px 10px 12px; border: 0; border-radius: 999px; background: var(--ink); color: #fff; box-shadow: var(--sh-lg); opacity: 0; pointer-events: none; translate: -50% 0; transform: translateY(16px); }
#toast.toast.show { opacity: 1; transform: none; }
#toast.toast > span { width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--b-l); color: var(--b-dd); font-size: 15px; font-weight: 800; }
#toast.toast.error > span { background: var(--red-l); color: #b4232a; }
#toast.toast p { margin: 0; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.4; }
html:has(.editor-dialog[open]) #toast.toast, html:has(.review-dialog[open]) #toast.toast { bottom: auto; top: 18px; }

/* ---------- mobile bottom tab bar (.mnav from arche-ui) ---------- */
.mnav a span { white-space: nowrap; }

/* ---------- responsive ---------- */
@media (max-width: 1360px) {
  .save-state { display: none; }
  .tour-replay-button .label, .top-work-button .label, .top-new-button .label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .tour-replay-button, .top-work-button, .top-new-button { width: 44px; padding: 0; justify-content: center; }
}
@media (max-width: 1180px) {
  .editor-layout { grid-template-columns: 200px minmax(0, 1fr) 330px; }
  .site-tabs a { padding: 0 12px; }
  .brand-copy small { display: none; }
}
@media (max-width: 1060px) {
  .site-tabs a span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .site-tabs a { width: 48px; padding: 0; justify-content: center; }
  .sample-compare-grid { grid-template-columns: 1fr 1fr; }
  .sample-rationale { grid-column: 1 / -1; }
  .sample-reviewers { grid-template-columns: 1fr 1fr; }
  .summary-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .editor-layout { grid-template-columns: 180px minmax(0, 1fr) 300px; }
  .manuscript-table { min-width: 860px; }
  .table-scroll-hint { display: block; position: sticky; left: 0; margin: 0 0 6px; color: var(--b-d); font-size: 13px; font-weight: 650; }
}
@media (max-width: 860px) {
  .topbar { gap: 6px; padding: 0 12px; }
  .site-tabs, .icon-button, .top-work-button, .top-new-button { display: none !important; }
  .brand { margin-right: auto; min-height: 44px; }
  .brand-copy strong { font-size: 16px; }
  html body .topbar-actions .arche-locale-switch button { height: 44px; min-width: 44px; font-size: 14px; }
  .brand { min-width: 44px; }
  .language-tabs button, .view-toggle button, .change-decision button, .structure-actions button, .editor-pagebar > button, .editor-pagebar .manual-edit-toggle, .editor-export, .editor-complete, .editor-next, .steer-file, .steer-form button, .ai-chat-file, .ai-chat-form button, .status-button { min-height: 44px; }
  .editor-export, .editor-pagebar > button { min-width: 44px; }
  html body .arche-footer .policy-links button, html body .arche-footer .policy-links a { min-width: 44px; justify-content: center; }
  .workspace-login-button { padding: 0 16px; }
  .page-content { padding: 0 18px; }
  .page-intro { padding: 30px 0 18px; }
  .page-intro h1 { font-size: 36px; }
  .intro-copy { font-size: 16px; }
  .ai-add-card { padding: 30px 18px 26px; border-radius: 34px; }
  .ai-add-card::before { inset: 9px; border-radius: 26px; }
  .ai-add-icon, .ai-add-icon svg { width: 100px; height: 92px; }
  .ai-add-heading h2 { font-size: 27px; }
  .ai-add-heading p { font-size: 16px; }
  .ai-drop-zone { grid-template-columns: 48px minmax(0, 1fr); }
  .ai-drop-zone > svg { width: 48px; height: 48px; padding: 12px; }
  .ai-drop-zone > b { grid-column: 1 / -1; justify-self: center; }
  .ai-drop-zone strong, .ai-drop-zone small { white-space: normal; }
  .ai-add-actions, .new-review-button { width: 100%; }
  .workspace-sample { margin-top: 60px; }
  .workspace-sample-heading h2 { font-size: 27px; }
  .workspace-sample-heading p:last-child { font-size: 16px; }
  .sample-card { padding: 16px; border-radius: 30px; }
  .sample-demo-file { grid-template-columns: auto minmax(0, 1fr); }
  .sample-demo-file > div strong { white-space: normal; }
  .sample-demo-file ol { grid-column: 1 / -1; justify-content: flex-start; }
  .sample-demo-file em { grid-column: 1 / -1; grid-row: 3; }
  .sample-feature-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); border-radius: 24px; }
  .sample-feature-tabs .ind { border-radius: 20px !important; }
  .sample-feature-tabs button { height: 46px; padding: 0 4px; gap: 5px; font-size: 14px; }
  .sample-feature-tabs button span { display: none; }
  .sample-process-bar span { padding-right: 9px; }
  .sample-compare-grid { grid-template-columns: 1fr; }
  .sample-rationale { grid-column: auto; }
  .sample-document, .sample-rationale { padding: 16px; border-radius: 22px; }
  .sample-document p { font-size: 17px; }
  .sample-review-example, .sample-review-result, .sample-finding-grid { grid-template-columns: 1fr; }
  .workspace-sample-footer button { width: 100%; }
  .summary-strip { grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 60px; }
  .summary-quality { grid-column: 1 / -1; }
  .summary-item, .summary-quality { padding: 16px; }
  .summary-item .roll-view, .summary-quality > strong, .summary-quality .roll-view { font-size: 28px; }
  .queue-card { padding: 16px; border-radius: 30px; }
  .queue-heading h2 { font-size: 24px; }
  .language-tabs { width: 100%; }
  .language-tabs button { flex: 1; padding: 0 6px; }
  .queue-tools { flex-wrap: wrap; flex-basis: 100%; }
  .search-field { min-width: 0; flex: 1 1 100%; }
  .filter-select { flex: 1; }
  .filter-select select { width: 100%; }
  /* table becomes rounded cards */
  .table-wrap { overflow: visible; }
  .table-scroll-hint { display: none !important; }
  .manuscript-table, .manuscript-table tbody { display: block; min-width: 0; margin: 0; }
  .manuscript-table colgroup, .manuscript-table thead { display: none; }
  .manuscript-table tbody { display: grid; gap: 8px; }
  .manuscript-table tbody tr { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; grid-template-areas: "ti ti ti ti" "lg sco sco sco" "st st up an"; gap: 10px 8px; align-items: center; padding: 14px; border-radius: 24px; background: var(--bg); }
  .manuscript-table tbody tr.selected { background: var(--b-lll); box-shadow: inset 3px 0 0 var(--b); }
  .manuscript-table tbody tr.processing { background: var(--b-lll); }
  .manuscript-table td, .manuscript-table td:first-child, .manuscript-table td:last-child { height: auto; padding: 0; border-radius: 0; background: transparent !important; box-shadow: none !important; }
  .manuscript-table td:nth-child(1) { grid-area: ti; }
  .manuscript-table td:nth-child(2) { grid-area: lg; }
  .manuscript-table td:nth-child(3) { grid-area: sco; }
  .manuscript-table td:nth-child(4) { grid-area: st; }
  .manuscript-table td:nth-child(5) { grid-area: up; text-align: right; }
  .manuscript-table td:nth-child(6) { grid-area: an; }
  .manuscript-copy small { white-space: normal; }
  .ai-chat-launcher { right: 16px; bottom: calc(96px + var(--safe-b)); min-height: 56px; }
  .ai-chat-launcher-copy small { max-width: 130px; }
  #toast.toast { bottom: calc(94px + var(--safe-b)); border-radius: 24px; }
  .arche-footer.foot { margin-top: 60px; }
  /* analysis menu = bottom sheet */
  .analysis-menu { left: 0; right: 0; top: auto; bottom: 0; width: 100%; padding-bottom: var(--safe-b); border-radius: 30px 30px 0 0; translate: none; }
  .analysis-menu > header { padding: 22px 20px 4px; }
  .analysis-options { padding: 12px 20px 8px; }
  .analysis-options > button { grid-template-columns: 36px minmax(0, 1fr) auto; }
  .analysis-options > button > span { display: none; }
  .analysis-delete { width: calc(100% - 40px); margin: 0 20px 16px; }
  /* editor: full-screen sheet */
  .editor-dialog { width: 100vw; height: 100dvh; margin: 0; border-radius: 0; }
  .editor-topbar { grid-template-columns: minmax(0, 1fr) auto; }
  .editor-status { display: none; }
  .editor-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) minmax(200px, 34vh); }
  .editor-rail { max-height: none; display: block; padding: 10px 12px; overflow-x: auto; overflow-y: hidden; }
  .rail-heading, .stage-guide, .principle-card { display: none; }
  .rail-stages { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(64px, 1fr); gap: 0; }
  .rail-stage { min-height: 64px; grid-template-columns: 1fr; justify-items: center; gap: 4px; padding: 4px 0; background: transparent !important; box-shadow: none !important; }
  .rail-stage:not(:last-child)::after { left: calc(50% + 22px); right: calc(-50% + 22px); top: 21px; bottom: auto; width: auto; height: 4px; }
  .rail-stage > div { justify-items: center; }
  .rail-stage strong { max-width: 72px; font-size: 12px; font-weight: 650; line-height: 1.3; color: var(--ink-3); text-align: center; white-space: normal; word-break: keep-all; }
  .rail-stage.selected strong { color: var(--b-dd); font-weight: 800; }
  .rail-stage small { display: none; }
  .editor-main { grid-column: 1; grid-row: 2; }
  .comment-panel { grid-column: 1; grid-row: 3; border-top: 1px solid var(--line); border-left: 0; padding: 16px 16px 24px; }
  .editor-toolbar { padding: 14px 16px 2px; }
  .editor-toolbar h2 { font-size: 22px; }
  .editor-toolbar > div:first-child > span { font-size: 15px; }
  .view-toggle { width: 100%; }
  .view-toggle button { flex: 1; padding: 0 8px; }
  .editor-live-strip, .editor-completion-notice { margin: 10px 16px 0; }
  .editor-pagebar { margin: 10px 16px; }
  .document-compare { grid-template-columns: 1fr; padding: 0 16px 16px; }
  .review-dialog, .text-editor-dialog { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; border-radius: 0; }
  .reviewer-grid { grid-template-columns: 1fr; }
  .review-score-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-findings-grid { grid-template-columns: 1fr; }
  .review-header, .review-body { padding-inline: 16px; }
  .review-footer { flex-wrap: wrap; padding-inline: 16px; }
  .review-footer p { flex-basis: 100%; }
  .review-footer button { width: 100%; }
  .ai-add-drawer { top: auto; left: 0; right: 0; bottom: 0; width: 100%; height: calc(100dvh - 40px); border-radius: 30px 30px 0 0; transform: translateY(calc(100% + 24px)); }
  .sidebar { top: 8px; bottom: 8px; left: 8px; }
  #textEditorText { width: calc(100% - 32px); }
}
@media (max-width: 600px) {
  .editor-file-icon { display: none; }
  .editor-actions { gap: 4px; }
  .editor-export { width: 40px; padding: 0; justify-content: center; font-size: 0; }
  .editor-export svg { width: 18px; height: 18px; }
  #runStageButton, #interruptButton { width: auto; padding: 0 10px; font-size: 12px; }
  #nextStageButton { max-width: 96px; padding: 0 10px; overflow: hidden; font-size: 12px; text-overflow: ellipsis; }
  .editor-complete { padding: 0 10px; font-size: 13px; }
  .editor-document strong { font-size: 15px; }
  .editor-document small { display: none; }
  .editor-shell { grid-template-rows: 64px minmax(0, 1fr); }
  .editor-topbar { padding: 0 8px; gap: 6px; }
}
@media (max-width: 400px) {
  .brand-copy { display: none; }
  .sample-reviewers { grid-template-columns: 1fr; }
  .editor-document > div { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  dialog::backdrop { animation: none; }
}

/* v2: 영어 대문자 라벨은 문구는 그대로 두고 문장형으로 보이게(대문자 킥커 금지) */
.eyebrow, .sample-evaluation header > span, .sample-decision > span, .review-section-heading p, .review-dialog header p, .text-editor-dialog header p,
.brand small, .sidebar-brand p, aside > div > p:first-child { text-transform: lowercase !important; letter-spacing: 0 !important; display: inline-block; }
.eyebrow::first-letter, .sample-evaluation header > span::first-letter, .sample-decision > span::first-letter, .review-section-heading p::first-letter, .review-dialog header p::first-letter, .text-editor-dialog header p::first-letter,
.brand small::first-letter, .sidebar-brand p::first-letter, aside > div > p:first-child::first-letter { text-transform: uppercase; }
.auth-mark + p, dialog header p:first-child, dialog header div > p:first-child, .text-editor-dialog p:first-child { text-transform: lowercase !important; letter-spacing: 0 !important; display: inline-block; }
.auth-mark + p::first-letter, dialog header p:first-child::first-letter, dialog header div > p:first-child::first-letter, .text-editor-dialog p:first-child::first-letter { text-transform: uppercase; }

@media (max-width: 720px) { .tour-popover { max-height: 40dvh !important; } }

/* v2: 서체는 Pretendard 하나(자체 호스팅 /fonts/pretendard). 옛 세리프 제목 규칙을 덮어쓴다. */
body { font-family: Pretendard, "Pretendard Variable", "Apple SD Gothic Neo", "Noto Sans KR", system-ui, -apple-system, "Segoe UI", sans-serif; }
body *:not(code):not(pre):not(kbd):not(samp) { font-family: inherit !important; }

/* v2 모바일 튜토리얼: 화살표 대신 링으로만 가리키고, 안내 카드는 화면 40% 이하 */
@media (max-width: 560px) {
  .tour-pointer { display: none !important; }
  .tour-popover { max-height: 40dvh !important; overflow: auto; }
}

/* EN/tour polish (2026-10-03): phone tour card stays a short bottom sheet with its buttons always visible */
.tour-pointer[style*="visibility:hidden"] { animation: none; }
@media (max-width: 720px) {
  .tour-popover { overscroll-behavior: contain; }
  .tour-popover.is-compact { gap: 8px; padding: 14px 16px 0; }
  .tour-popover.is-compact .tour-simulation { display: none; }
  .tour-popover.is-compact h2 { font-size: 18px; line-height: 1.3; }
  .tour-popover.is-compact .tour-description { font-size: 14px; line-height: 1.5; }
  .tour-popover > footer { position: sticky; bottom: 0; margin: 0 -16px; padding: 8px 16px 12px; background: #fff; }
}

/* EN: the four site tabs use short names so the mobile tab bar and the desktop top tabs never overflow */
html[lang="en"] .mnav a > span { display: none; }
html[lang="en"] .mnav a::after { content: attr(data-en-short); display: block; max-width: 100%; overflow: hidden; font-size: 12px; line-height: 1.25; white-space: nowrap; text-overflow: ellipsis; }
@media (max-width: 1060px) { html[lang="en"] .site-tabs a::after { content: none; } }

/* Sample feature tabs: long English names wrap inside their own tab instead of running into the next one */
.sample-feature-tabs { grid-auto-rows: 1fr; }
.sample-feature-tabs button { height: auto; min-height: 48px; white-space: normal; line-height: 1.2; text-align: left; overflow-wrap: anywhere; }
@media (max-width: 860px) {
  .sample-feature-tabs button { min-height: 46px; padding: 4px 6px; text-align: center; font-size: 13px; }
}

/* The ring keeps a thin white inner edge so it stays visible on the purple decision card too */
.tour-ring, .tour-spotlight:not(.has-ring) { box-shadow: 0 0 0 2px #fff, 0 0 0 5px var(--b), 0 0 0 11px rgba(91, 84, 240, .18); }
.sample-decision > span { margin-bottom: 8px; }

/* Phone editor top bar: long English action labels wrap inside their buttons instead of
   pushing the back button off screen */
@media (max-width: 600px) {
  .editor-topbar { grid-template-columns: minmax(44px, 1fr) minmax(0, max-content); }
  .editor-actions { min-width: 0; }
  .editor-actions > button { flex: 0 1 auto; min-width: 0; }
  .editor-actions #exportButton { flex: none; }
  #nextStageButton, #runStageButton, #interruptButton, .editor-complete { max-width: none; padding: 0 9px; font-size: 12px; line-height: 1.15; text-align: center; white-space: normal; text-overflow: clip; overflow: hidden; }
}

/* Shared arche-ui.css centres the site tabs from 1280px so they sit at the same spot on all four sites.
   This top bar carries more actions (save state, search, AI conversation, add file, sign-in, KO/EN), so
   between 1280px and 1799px the actions drop their text labels (icons keep aria-labels) to leave room. */
.topbar-actions { margin-left: auto; }
@media (min-width: 1280px) and (max-width: 1799px) {
  .topbar-actions .top-work-button > span, .topbar-actions .top-new-button > span, .topbar-actions .tour-replay-button > span,
  .topbar-actions .save-state > span, .topbar-actions #saveState > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .topbar-actions .top-work-button, .topbar-actions .top-new-button, .topbar-actions .tour-replay-button { width: 44px; min-width: 44px; padding: 0; justify-content: center; }
  .topbar-actions .save-state, .topbar-actions .tour-replay-button { font-size: 0; gap: 0; }
  .topbar-actions .tour-replay-button svg { width: 20px; height: 20px; }
}

/* 넓은 화면에서 본문이 가운데로 좁게 몰리지 않게: 공용 arche-ui.css의 .wrap(1180px, 랜딩과 공유)을 이 앱에서만 넓힌다. */
.wrap { max-width: 1560px; }