/* Shared visual contract: docs/DESIGN_SYSTEM.md. Pretendard / monochrome. */
:root {
  --ink: #111;
  --slate: #595959;
  --steel: #626262;
  --line: #e7e7e7;
  --surface: #f7f7f7;
  --shadow: none;
  --header: 64px;
  --ops-bg: #fff;
  --ops-line: #e7e7e7;
  --ops-ink: #111;
  --ops-muted: #595959;
}
html { scroll-padding-top: 88px; }
body .site-footer { background: #101010; color: #fff; border-color: #242424; }
body .site-footer :is(.brand,.footer-primary-links a) { color: #fff; }
body .site-footer :is(.footer-brand p,.footer-meta-row) { color: #b5b5b5; border-color: #333; }
body .site-footer .brand-mark { border: 1px solid #666; }
body .site-footer :is(a,button):focus-visible { outline-color: #fff; }
.ops-seo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.ops-seo-card { background: #f5f5f5; border: 1px solid var(--line); padding: 24px; border-radius: 12px; min-width: 0; }
.ops-seo-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ops-seo-heading h3 { margin: 0; }
.ops-seo-card p { font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.ops-seo-badge { background: #fff; border: 1px solid #aaa; border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 600; }
.ops-seo-badge[data-result="PASS"], .ops-seo-badge[data-result="CONNECTED"] { background: #111; color: #fff; border-color: #111; }
.ops-seo-badge[data-result="ERROR"], .ops-seo-badge[data-result="BLOCKED"] { color: #a12920; border-color: #a12920; }
@media (width < 768px) { .ops-seo-grid { grid-template-columns: minmax(0,1fr); } }
body { background: #fff; color: #111; font-family: Pretendard, sans-serif; font-size: 16px; line-height: 1.5; letter-spacing: -.025em; }
body *, body *::before, body *::after { font-family: Pretendard, sans-serif; }
body *, body *::before, body *::after { box-shadow: none !important; }
body :is(button, input, select, textarea) { font-family: Pretendard, sans-serif; }
body :is(a, button, input, textarea, select, summary):focus-visible { outline: 2px solid #111; outline-offset: 4px; }
main { max-width: var(--content-wide); padding: 48px 24px 80px; }
main[tabindex="-1"]:focus { outline: none; }
main > *, .ops-workspace > *, .ops-grid > *, .detail-layout > * { min-width: 0; }
body .page-head h1, body .ops-workspace h1, body .score-start h1 { font-size: 44px; line-height: 1.15; letter-spacing: -.025em; font-weight: 600; }
.page-head { margin-bottom: 32px; }
.page-kicker, .ops-workspace .page-kicker { color: #595959; font-size: 14px; font-weight: 500; }
.page-description { color: #595959; font-size: 16px; line-height: 1.5; }
body .btn, body .btn.small, body .header-cta { border-radius: 8px; font-size: 14px; min-height: 44px; padding: 12px 24px; font-weight: 600; }
body .btn.primary, body .header-cta { background: #111; border: 1px solid #111; color: #fff; }
body .btn.secondary, body .btn.quiet { background: #fff; border: 1px solid #bfbfbf; color: #111; }
body .btn:hover { transform: none; }
body .btn.primary:hover, body .header-cta:hover { background: #333; }
body .btn.secondary:hover { background: #f7f7f7; }
body :is(.card, .recovery-dashboard, .cohort-chart, .confidence-panel, .status-summary-strip, .ops-panel, .ops-kpis) { border-radius: 16px; border: 1px solid var(--line); background-image: none; }
.site-header, .header-inner { height: 64px; background: #fff; backdrop-filter: none; }
.header-inner { max-width: 1280px; padding-inline: 24px; }
.mobile-nav { top: 64px; }
.desktop-nav a, .mobile-nav a { padding: 12px; }
.desktop-nav a[aria-current=page] { border-radius: 999px; background: #111; color: #fff; }
.brand-mark, .ops-brand .brand-mark { background: #111; color: #fff; }
body .hero.hero-editorial { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 32px; }
.hero-main::after { content: none; }
body .hero-main-editorial h1 { font-size: 64px; font-weight: 600; letter-spacing: -.025em; line-height: 1.1; }
.hero-main-editorial p { font-size: 16px; color: #595959; }
.live-dot { background: #111; }
body .recovery-dashboard { background: #f5f5f5; border: 1px solid var(--line); border-radius: 16px; padding: 32px; }
.recovery-dashboard :is(header, .live-stamp, .recovery-dashboard-value > span, .recovery-ledger > div > span, .recovery-ledger small) { color: #111; }
body .subject-card.subject-product-card { border: 1px solid var(--line); border-radius: 12px; padding: 32px; background: #f5f5f5; color: #111; }
body .subject-product-card :is(.subject-no, h2, h2 a > span, .subject-total > span, footer, footer b) { color: #374151; }
.subject-product-card h2 { font-size: 20px; }
.segment.confirmed, .state-dot.confirmed { background: #111; }
.segment.likely, .state-dot.likely { background: #505050; }
.segment.recovering, .state-dot.recovering { background: #707070; }
.segment.unrecovered, .state-dot.unrecovered { background: #e5e5e5; }
.segment.unrecovered > span { color: #333; }
.status-summary-strip, .cohort-chart, .detail-panel.confidence-panel { background: #fff; }
body .status-badge.confirmed { background: #111; color: #fff; }
body .status-badge.likely { background: #dedede; color: #222; }
body .status-badge.recovering { background: #f2f2f2; color: #444; border: 1px solid #bfbfbf; }
body .status-badge.unrecovered { background: #fff; color: #626262; border: 1px dashed #bfbfbf; }
body :is(.answer-candidate i, .position-axis i, .contribution-row i, .distribution i.pass, .progress i, .mini-track i, .choice-bar i, .ops-histogram i) { background: #111; }
body .contribution-row.negative i { background: #999; }
.cohort-chart svg :is(rect, path)[fill]:not([fill="none"]) { fill: #707070; }
.cohort-chart svg :is(line, path)[stroke] { stroke: #333; }
.cohort-chart svg text { fill: #333; }
.q-main h3 a:hover { color: #111; text-decoration: underline; text-underline-offset: 4px; }
mark { background: #ededed; }
body :is(.field input, .field select, .field textarea, .status-toolbar select, .status-toolbar .search, .ops-field input, .ops-field select, .ops-field textarea, .ops-weight-row input) { border-radius: 12px; border-color: #bfbfbf; color: #111; background: #fff; min-height: 44px; }
.field textarea { font-size: 16px; }
body .filter { min-height: 44px; border-radius: 8px; }
.filter.active { background: #111; color: #fff; }
.policy, .form-shell, .methodology-shell { max-width: 800px; }
.policy p, .policy li { font-size: 16px; line-height: 1.6; color: #333; }
.policy h2 { margin-top: 32px; font-size: 24px; }
.flow-number { color: #111; }
.contact-shell { max-width: 1280px; }
.contact-grid { grid-template-columns: minmax(0, 800px) minmax(0, 1fr); gap: 32px; }
.contact-form, .form-card, .recall-assist, .flashrecall-stage.card { border-radius: 16px; }
.recall-section-tab, .mode-card, .flashrecall-subjects button { min-height: 44px; }
.flashcard { background-image: none; border-radius: 16px; }
.flashcard:hover, .flashcard.dragging { box-shadow: none; }
.order-drop-zone.over { border-color: #111; background: #f2f2f2; }
.order-drag-handle { min-height: 44px; display: inline-flex; align-items: center; }
.exam-toolbar { top: 64px; }
.exam-nav-cell { min-height: 44px; }
.exam-nav-cell.current { outline-color: #111; }
.exam-nav-cell.guess, .exam-map-legend i.guess { border-bottom: 3px solid #111; background: #f5f5f5; color: #111; }
.exam-nav-cell.ambiguous, .exam-map-legend i.ambiguous { border-bottom: 3px dashed #111; background: #f5f5f5; color: #111; }
.exam-nav-cell.unknown, .exam-map-legend i.unknown { border-bottom: 3px dotted #777; }
body .exam-special-judgement { color: #111; }
body .exam-nav-cell.graded-guess, body .exam-nav-cell.graded-ambiguous { background: #eee; color: #111; border-color: #111; }
.ops-table th:nth-child(2), .ops-table td:nth-child(2) { border-right: 1px solid #d5d5d5; }
.score-start.card, .score-result.card { border-radius: 16px; background-image: none; }
.pass-orbit { background: #111; color: #fff; border-radius: 16px; }
.pass-orbit :is(span, strong, small) { color: #fff; }
.archive-grid { gap: 24px; }
.archive-card { padding: 24px; border-radius: 16px; }
.archive-grid > .empty-state { border: 1px solid var(--line); border-radius: 16px; }
.ad-slot { border-radius: 16px; background: #fafafa; }
.question-list-ad { min-height: 112px; margin: 24px 0; display: grid; place-items: center; }
.question-list-ad[data-ad-state=empty] { display: none; }
.status-ad-layout { display: block; position: relative; }
.status-side-ad { display: none; }
body[data-page=status] main { max-width: 1280px; }
.ops-sidebar { background: #111; color: #ddd; border-right-color: #333; }
.ops-sidebar nav > a { padding: 12px; min-height: 44px; border-radius: 8px; }
.ops-sidebar nav > a:hover, .ops-sidebar nav > a[aria-current=page] { background: #333; color: #fff; }
.ops-nav-index, .ops-sidebar-note, .ops-brand-copy small { color: #bfbfbf; }
.ops-collapse { width: 44px; height: 44px; background: #222; border-color: #666; }
.ops-topbar { min-height: 64px; padding-block: 8px; }
.ops-workspace { max-width: 1280px; }
.ops-panel > p, .ops-status, .ops-event small, .ops-event time, .ops-event > span, .ops-weight-row label, .ops-field { color: #595959; }
.ops-kpi > span, .ops-kpi > small, .ops-empty { color: #595959; }
.ops-event strong { color: #222; }
.ops-event time { white-space: nowrap; }
.ops-table th { background: #f5f5f5; color: #444; }
.ops-table tbody tr:hover td, .ops-table tr.selected td { background: #ededed; }
.ops-table-tools :is(input, select), .ops-column-picker summary { min-height: 44px; border-radius: 12px; }
.ops-column-picker > div { border: 1px solid #888; border-radius: 12px; }
.ops-stat-line:nth-child(1) i { background: #111; }
.ops-stat-line:nth-child(2) i { background: #505050; }
.ops-stat-line:nth-child(3) i { background: #707070; }
.ops-stat-line:nth-child(4) i { background: #ddd; }
.ops-order-row i, .ops-order-row.uncertain i { background: #888; }
.ops-order-row b { background: #111; }
.ops-order-row.uncertain .range { border: 1px dashed #777; }
.ops-drawer, .ops-confirm { border: 1px solid #888; border-radius: 16px; }
.ops-drawer header button { min-height: 44px; min-width: 44px; }
@media (min-width: 1984px) {
  .status-side-ad { display: grid; position: absolute; top: 0; width: 304px; }
  .status-side-ad-left { right: calc(100% + 32px); }
  .status-side-ad-right { left: calc(100% + 32px); }
}
@media (min-width: 1024px) {
  .desktop-nav { display: flex; }
  .header-cta { display: inline-flex; }
  .menu-btn, .mobile-nav.open { display: none; }
}
@media (width < 1024px) {
  body .page-head h1, body .ops-workspace h1, body .score-start h1 { font-size: 36px; }
  body .hero-main-editorial h1 { font-size: 48px; }
  body .hero.hero-editorial { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px; }
  .desktop-nav, .header-cta { display: none; }
  .menu-btn { display: block; }
}
@media (width < 768px) {
  main { padding: 32px 16px 64px; }
  .header-inner { padding-inline: 16px; }
  body .hero.hero-editorial, .subject-cards, .contact-grid, .detail-layout, .archive-grid { grid-template-columns: minmax(0, 1fr); }
  body .subject-card.subject-product-card, body .recovery-dashboard { border-radius: 12px; padding: 24px; }
  .contact-help { border-left: 0; border-top: 1px solid var(--line); padding: 24px 0; }
  .exam-nav-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .exam-map { overflow-y: auto; max-height: calc(100dvh - 80px); }
  .ops-workspace { padding: 24px 16px; }
  .question-list-ad { min-height: 96px; margin: 20px 0; }
}
@media (width < 480px) {
  body .page-head h1, body .ops-workspace h1, body .score-start h1, body .hero-main-editorial h1 { font-size: 32px; }
  .hero-actions, .result-grid, .score-start-rules, .score-input-breakdown, .flashcard-pair, .mode-grid, .form-actions, .order-finish-actions, .save-feedback, .share-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .hero-actions .btn, .form-actions .btn, .share-actions .btn { width: 100%; }
  .status-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .score-start-rules > div { border-left: 0; }
}
/* Public copy hierarchy and honest empty states: preserve real inventory only. */
body[data-page="home"] .hero h1 { font-size:48px; line-height:1.22; word-break:keep-all; }
.hero-secondary-actions { display:flex; flex-wrap:wrap; gap:8px 24px; }
.hero-secondary-actions .text-link { display:inline-flex; align-items:center; min-height:44px; }
.first-memory-note { font-size:16px; line-height:1.65; color:var(--muted,#666); margin:24px 0; }
.empty-subject-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding:24px 0; border-bottom:1px solid #e5e5e5; }
[data-question-browser] > summary { cursor:pointer; padding:24px 0; min-height:44px; }
[data-subject-empty] { margin:24px 0 0; line-height:1.7; }
[data-subject-detail]:has([data-empty-overview]:not([hidden])) :is(.subject-rate,[data-subject-detail-bar],.subject-state-labels) { display:none; }
.ad-slot:not([data-ad-state="loaded"]):not([data-ad-state="loading"]) { min-height:0!important; height:0!important; margin:0!important; padding:0!important; border:0!important; overflow:hidden; }
.ad-slot[hidden], [hidden] { display:none!important; }
.status-ad-layout:not(:has(.status-side-ad:is([data-ad-state="loaded"],[data-ad-state="loading"]))) { grid-template-columns:minmax(0,1fr)!important; }
@media(max-width:1024px) { body[data-page="home"] .hero h1 { font-size:40px; } }
@media(max-width:640px) { body[data-page="home"] .hero h1 { font-size:32px; } .hero-secondary-actions { gap:8px 16px; } }
.brand-image{display:block;object-fit:cover}