:root {
  --ink: #eee9e1;
  --muted: #9b9d9c;
  --paper: #090b0c;
  --card: #121517;
  --card-raised: #171b1d;
  --line: rgba(232, 225, 216, .14);
  --green: #77c9ba;
  --green-soft: rgba(119, 201, 186, .13);
  --yellow: #d6a85f;
  --blue: #82a9bf;
  --purple: #9b8cb3;
  --coral: #bc735c;
  --danger: #e78670;
  --mono: "DM Mono", ui-monospace, monospace;
  --sans: "Inter", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }

.shell { min-height: 100vh; display: grid; grid-template-columns: 236px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 28px 22px; background: var(--ink); color: #f6f3e9; display: flex; flex-direction: column; }
.brand { color: inherit; text-decoration: none; display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; background: var(--yellow); color: var(--ink); border-radius: 10px 4px 10px 4px; font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { letter-spacing: .11em; font-size: 13px; }
.brand small { color: #9faaa5; margin-top: 2px; font-size: 11px; }
.nav { display: grid; gap: 8px; margin-top: 54px; }
.nav-item { border: 0; background: transparent; color: #abb4b0; text-align: left; padding: 13px 12px; border-radius: 8px; cursor: pointer; font-weight: 600; transition: .2s ease; }
.nav-item span { font-family: var(--mono); margin-right: 12px; font-size: 11px; color: #75807b; }
.nav-item:hover, .nav-item.active { background: #24352e; color: white; }
.nav-item.active span { color: var(--yellow); }
.sidebar-foot { margin-top: auto; border-top: 1px solid #304139; padding-top: 22px; }
.sidebar-foot .eyebrow { color: #81908a; }
.mini-loop { display: flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: 10px; color: #dfe5e1; margin: 12px 0 18px; }
.mini-loop i { color: var(--yellow); font-style: normal; }
.text-button { border: 0; padding: 0; background: none; color: #d6ded9; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; font-size: 12px; }

.main { min-width: 0; padding: 0 48px 70px; }
.topbar { min-height: 110px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); margin-bottom: 34px; }
.topbar h1 { font-size: 22px; margin: 4px 0 0; }
.eyebrow { margin: 0; font: 500 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); }
.top-actions { display: flex; align-items: center; gap: 10px; }
.privacy-pill { font: 500 10px var(--mono); color: var(--muted); display: flex; align-items: center; gap: 7px; margin-right: 8px; }
.privacy-pill span { width: 7px; height: 7px; border-radius: 50%; background: #43a276; box-shadow: 0 0 0 3px #dcece3; }
.button { border: 1px solid transparent; border-radius: 7px; padding: 11px 15px; cursor: pointer; font-weight: 700; font-size: 12px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; transition: transform .15s ease, background .15s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { background: var(--ink); color: white; }
.button-primary:hover { background: #293c34; }
.button-secondary { border-color: #bcc5c0; background: rgba(255,255,255,.45); }
.button-ghost { background: transparent; color: var(--muted); }
.button-danger { border-color: #dfb6ad; color: var(--danger); background: #fff7f5; }
.view { display: none; }
.view.active { display: block; animation: fade .25s ease; }
@keyframes fade { from { opacity: .25; transform: translateY(4px); } }

.hero-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(260px, .7fr); gap: 18px; }
.focus-card, .score-card, .contract-card, .checkpoint-card, .claim-card, .concept-card, .ledger-summary, .evidence-row { background: var(--card); border: 1px solid var(--line); }
.focus-card { min-height: 430px; border-radius: 16px; padding: 36px; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.focus-card::after { content: ""; position: absolute; width: 190px; height: 190px; border: 44px solid var(--green-soft); border-radius: 50%; right: -85px; top: -94px; opacity: .7; }
.focus-top { display: flex; justify-content: space-between; position: relative; z-index: 1; }
.day-kicker { margin: 10px 0 0; font: 500 11px var(--mono); letter-spacing: .09em; }
.day-kicker i { display: inline-block; width: 4px; height: 4px; background: var(--coral); border-radius: 50%; vertical-align: middle; margin: 0 8px; }
.status-badge { align-self: flex-start; background: var(--green-soft); color: var(--green); border-radius: 99px; padding: 7px 10px; font: 500 9px var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.focus-card h2, .page-intro h2 { font-size: clamp(30px, 4vw, 52px); letter-spacing: -.045em; line-height: 1.03; margin: 48px 0 16px; }
.lead { color: #52615a; line-height: 1.7; font-size: 15px; margin: 0; max-width: 720px; }
.definition { border-left: 3px solid var(--yellow); padding-left: 15px; margin-top: 28px; }
.definition p:last-child { margin: 6px 0 0; font-weight: 650; font-size: 13px; }
.focus-actions { margin-top: auto; display: flex; gap: 8px; padding-top: 26px; }
.score-card { border-radius: 16px; padding: 30px; display: flex; flex-direction: column; align-items: center; }
.score-card > .eyebrow { align-self: flex-start; }
.score-ring { --progress: 0deg; width: 174px; aspect-ratio: 1; border-radius: 50%; margin: 28px auto; display: grid; place-content: center; text-align: center; background: radial-gradient(circle at center, var(--card) 59%, transparent 60%), conic-gradient(var(--green) var(--progress), #e2e6e1 0); }
.score-ring strong { font-size: 35px; letter-spacing: -.05em; }
.score-ring span { display: block; font: 500 9px var(--mono); text-transform: uppercase; color: var(--muted); margin-top: 3px; }
.score-stats { width: 100%; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.score-stats div { padding: 16px 10px; text-align: center; }
.score-stats div + div { border-left: 1px solid var(--line); }
.score-stats strong, .score-stats span { display: block; }
.score-stats strong { font-size: 21px; }
.score-stats span { color: var(--muted); font-size: 10px; }
.score-note { color: var(--muted); font-size: 11px; line-height: 1.55; margin: 18px 0 0; text-align: center; }
.section-head { margin: 46px 0 14px; display: flex; justify-content: space-between; align-items: end; }
.section-head h3 { margin: 5px 0 0; font-size: 19px; }
.contract-card { border-radius: 12px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 22px; }
.contract-number { font: 500 11px var(--mono); width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--blue); }
.contract-card p { margin: 0; font-size: 13px; line-height: 1.6; }
.icon-button { background: transparent; border: 0; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; font-size: 11px; color: var(--muted); }
.checkpoint-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.checkpoint-card { padding: 18px; border-radius: 11px; min-height: 145px; position: relative; }
.checkpoint-card.done { background: var(--green-soft); border-color: #bed6c8; }
.checkpoint-card .check-day { font: 500 10px var(--mono); color: var(--muted); }
.checkpoint-card h4 { margin: 28px 0 5px; font-size: 14px; }
.checkpoint-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.checkpoint-card .check-dot { position: absolute; right: 16px; top: 16px; width: 10px; height: 10px; border: 2px solid #aab4af; border-radius: 50%; }
.checkpoint-card.done .check-dot { background: var(--green); border-color: var(--green); }

.page-intro { display: flex; justify-content: space-between; align-items: flex-end; margin: 44px 0 34px; gap: 30px; }
.page-intro h2 { margin: 9px 0 0; max-width: 780px; }
.filter-group { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.35); }
.filter { border: 0; background: none; padding: 8px 10px; cursor: pointer; font-size: 10px; color: var(--muted); border-radius: 5px; }
.filter.active { background: var(--ink); color: white; }
.week { margin-bottom: 38px; }
.proof-flow { display: grid; grid-template-columns: repeat(4, 1fr); margin: -10px 0 34px; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; background: var(--card); }
.proof-flow > div { min-height: 92px; padding: 17px; position: relative; }
.proof-flow > div + div { border-left: 1px solid var(--line); }
.proof-flow span, .proof-flow strong, .proof-flow small { display: block; }
.proof-flow span { margin-bottom: 14px; color: var(--yellow); font: 500 8px var(--mono); }
.proof-flow strong { font-size: 11px; }
.proof-flow small { margin-top: 5px; color: var(--muted); font-size: 9px; line-height: 1.4; }
.week-head { display: grid; grid-template-columns: 140px 1fr auto; align-items: center; gap: 14px; margin-bottom: 12px; }
.week-head h3 { margin: 0; font-size: 18px; }
.week-head p { margin: 0; color: var(--muted); font-size: 11px; }
.week-progress { font: 500 10px var(--mono); }
.day-grid { display: grid; grid-template-columns: repeat(7, minmax(115px, 1fr)); gap: 8px; }
.day-card { min-height: 190px; padding: 14px; background: var(--card); border: 1px solid var(--line); border-radius: 9px; cursor: pointer; text-align: left; position: relative; transition: .18s ease; }
.day-card:hover { transform: translateY(-2px); border-color: #9eaaa4; }
.day-card.done { background: var(--green-soft); border-color: #b9d3c4; }
.day-card.priority::after { content: "80/20"; position: absolute; right: 10px; top: 10px; font: 500 8px var(--mono); color: #8f6515; background: #fff0bb; padding: 3px 5px; border-radius: 3px; }
.day-card .number { font: 500 10px var(--mono); color: var(--muted); }
.day-card h4 { font-size: 13px; margin: 26px 0 7px; line-height: 1.3; }
.day-card p { font-size: 9px; line-height: 1.45; color: var(--muted); margin: 0; }
.day-card .done-mark { position: absolute; bottom: 11px; right: 11px; font-size: 12px; color: var(--green); }
.artifact-file { display: block; min-height: 28px; margin: 0 0 9px; color: var(--green); font: 500 8px/1.4 var(--mono); overflow-wrap: anywhere; }

.truth-strip { background: var(--ink); color: white; border-radius: 10px; padding: 20px 24px; display: flex; gap: 22px; align-items: center; margin-bottom: 18px; }
.truth-strip strong { color: var(--yellow); font: 500 10px var(--mono); text-transform: uppercase; letter-spacing: .1em; white-space: nowrap; }
.truth-strip p { margin: 0; font-size: 13px; color: #d8dfdb; }
.concept-list { display: grid; gap: 16px; }
.concept-card { border-radius: 13px; overflow: hidden; display: grid; grid-template-columns: minmax(300px, .9fr) 1.1fr; }
.concept-card:nth-child(even) { grid-template-columns: 1.1fr minmax(300px, .9fr); }
.concept-card:nth-child(even) .concept-image { order: 2; }
.concept-image { background: white; display: grid; place-items: center; min-height: 280px; border-right: 1px solid var(--line); }
.concept-card:nth-child(even) .concept-image { border-right: 0; border-left: 1px solid var(--line); }
.concept-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.concept-copy { padding: 30px; align-self: center; }
.concept-copy h3 { margin: 8px 0 12px; font-size: 23px; }
.concept-copy p { color: var(--muted); font-size: 12px; line-height: 1.65; }
.concept-copy strong { display: block; font-size: 11px; margin-top: 16px; }
.claim-card { margin-top: 18px; border-radius: 12px; padding: 26px; }
.claim-card > div { display: grid; grid-template-columns: 230px 1fr; gap: 20px; padding: 17px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.claim-card > div:last-child { border-bottom: 0; }
.claim-card span { color: var(--muted); }

.ledger-summary { border-radius: 12px; display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 16px; }
.ledger-summary div { padding: 20px; border-right: 1px solid var(--line); }
.ledger-summary div:last-child { border: 0; }
.ledger-summary strong, .ledger-summary span { display: block; }
.ledger-summary strong { font-size: 24px; }
.ledger-summary span { color: var(--muted); font-size: 10px; margin-top: 3px; }
.evidence-list { display: grid; gap: 8px; }
.evidence-row { border-radius: 9px; padding: 17px; display: grid; grid-template-columns: 50px 190px 1fr auto; gap: 16px; align-items: start; }
.evidence-row .ev-day { font: 500 10px var(--mono); color: var(--muted); }
.evidence-row h4 { margin: 0; font-size: 12px; }
.evidence-row p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; white-space: pre-wrap; }
.evidence-row a { font-size: 10px; color: var(--green); max-width: 180px; overflow-wrap: anywhere; }
.evidence-artifact { display: block; margin-top: 5px; color: var(--green); font: 500 8px/1.4 var(--mono); overflow-wrap: anywhere; }
.empty-state { border: 1px dashed #b9c0bc; border-radius: 12px; padding: 60px 30px; text-align: center; color: var(--muted); }
.file-label input { display: none; }

.dialog { border: 0; padding: 0; background: transparent; width: min(720px, calc(100% - 28px)); max-height: 92vh; }
.dialog::backdrop { background: rgba(10, 23, 17, .66); backdrop-filter: blur(5px); }
.dialog-shell { background: var(--card); border-radius: 16px; padding: 34px; position: relative; max-height: 92vh; overflow-y: auto; }
.dialog-close { position: absolute; right: 20px; top: 18px; border: 0; background: transparent; font-size: 26px; color: var(--muted); cursor: pointer; }
.dialog-head h2 { font-size: 34px; letter-spacing: -.04em; margin: 10px 0 12px; }
.work-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 26px 0; }
.work-block { background: var(--paper); border-radius: 8px; padding: 16px; }
.work-block.full { grid-column: 1 / -1; }
.work-block p:last-child, .work-block a { font-size: 12px; line-height: 1.5; color: var(--ink); margin: 7px 0 0; }
.field-label { display: flex; justify-content: space-between; margin: 16px 0 7px; font-weight: 700; font-size: 11px; }
.field-label span, .field-help { color: var(--muted); font-weight: 500; font-size: 9px; }
textarea, input, select { width: 100%; border: 1px solid #cbd1cd; background: white; border-radius: 7px; padding: 12px; color: var(--ink); outline: none; }
textarea:focus, input:focus, select:focus { border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }
.check-line { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; font-size: 11px; line-height: 1.5; }
.check-line input { width: auto; margin-top: 2px; }
.form-error { color: var(--danger); min-height: 18px; font-size: 10px; margin: 8px 0 0; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.field-help { line-height: 1.5; }

.assembly-panel { margin-bottom: 18px; border: 1px solid var(--line); border-radius: 5px; background: var(--card); overflow: hidden; }
.assembly-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 24px; border-bottom: 1px solid var(--line); }
.assembly-head h3 { margin: 6px 0 0; font-size: 19px; }
.assembly-progress { text-align: right; }
.assembly-progress strong, .assembly-progress span { display: block; }
.assembly-progress strong { color: var(--green); font: 500 11px var(--mono); }
.assembly-progress span { margin-top: 5px; color: var(--muted); font-size: 10px; }
.assembly-list { display: grid; }
.assembly-row { width: 100%; min-height: 78px; display: grid; grid-template-columns: 62px 240px 1fr; gap: 18px; align-items: center; padding: 15px 24px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; cursor: pointer; }
.assembly-row:last-child { border-bottom: 0; }
.assembly-row:hover { background: rgba(255,255,255,.025); }
.assembly-row.ready { background: var(--green-soft); }
.assembly-status { color: var(--yellow); font: 500 8px var(--mono); letter-spacing: .1em; }
.assembly-row.ready .assembly-status { color: var(--green); }
.assembly-row strong, .assembly-row small { display: block; }
.assembly-row strong { font: 500 10px/1.45 var(--mono); overflow-wrap: anywhere; }
.assembly-row small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.assembly-row p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.artifact-block { border-top: 2px solid var(--green); }
.hiring-block { border-left: 2px solid var(--yellow); }
.interview-block { border-left: 2px solid var(--blue); }

@media (max-width: 1100px) {
  .day-grid { grid-template-columns: repeat(4, 1fr); }
  .checkpoint-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 820px) {
  .shell { display: block; }
  .sidebar { position: static; width: 100%; height: auto; padding: 18px; flex-direction: row; align-items: center; gap: 20px; }
  .brand small, .sidebar-foot { display: none; }
  .nav { margin: 0 0 0 auto; display: flex; }
  .nav-item { font-size: 0; padding: 10px; }
  .nav-item span { font-size: 10px; margin: 0; }
  .main { padding: 0 20px 50px; }
  .topbar { min-height: 90px; }
  .privacy-pill { display: none; }
  .hero-grid { grid-template-columns: 1fr; }
  .focus-card { min-height: 390px; padding: 25px; }
  .score-card { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .score-card > .eyebrow, .score-stats, .score-note { grid-column: 1 / -1; }
  .score-ring { width: 135px; margin: 8px auto; }
  .concept-card, .concept-card:nth-child(even) { grid-template-columns: 1fr; }
  .concept-card:nth-child(even) .concept-image { order: 0; }
  .concept-image, .concept-card:nth-child(even) .concept-image { border: 0; border-bottom: 1px solid var(--line); min-height: 210px; }
  .evidence-row { grid-template-columns: 44px 1fr; }
  .evidence-row p, .evidence-row a { grid-column: 2; }
  .assembly-row { grid-template-columns: 54px 190px 1fr; padding: 14px 18px; }
  .proof-flow { grid-template-columns: 1fr 1fr; }
  .proof-flow > div:nth-child(3) { border-left: 0; }
  .proof-flow > div:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 560px) {
  .brand span:last-child { display: none; }
  .topbar { align-items: center; }
  .topbar h1 { font-size: 17px; }
  .button { padding: 10px 11px; }
  .focus-card h2, .page-intro h2 { font-size: 32px; }
  .day-grid, .checkpoint-grid { grid-template-columns: 1fr 1fr; }
  .page-intro { align-items: flex-start; flex-direction: column; }
  .filter-group { width: 100%; }
  .filter { flex: 1; }
  .week-head { grid-template-columns: 1fr auto; }
  .week-head p { grid-column: 1 / -1; }
  .contract-card { grid-template-columns: auto 1fr; }
  .contract-card .icon-button { grid-column: 2; justify-self: start; }
  .ledger-summary { grid-template-columns: 1fr 1fr; }
  .ledger-summary div:nth-child(2) { border-right: 0; }
  .ledger-summary div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .work-grid { grid-template-columns: 1fr; }
  .work-block.full { grid-column: auto; }
  .assembly-head { align-items: flex-start; flex-direction: column; }
  .assembly-progress { text-align: left; }
  .assembly-row { grid-template-columns: 48px 1fr; gap: 10px; }
  .assembly-row p { grid-column: 2; }
  .proof-flow { grid-template-columns: 1fr; }
  .proof-flow > div + div { border-left: 0; border-top: 1px solid var(--line); }
  .dialog-shell { padding: 28px 20px; }
  .truth-strip { align-items: flex-start; flex-direction: column; gap: 8px; }
  .claim-card > div { grid-template-columns: 1fr; gap: 6px; }
}

/* Field console theme: graphite precision, warm paper, restrained signal light. */
body { position: relative; }
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(119, 201, 186, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(214, 168, 95, .018) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 82%);
}
.sidebar {
  background: #070809;
  color: var(--ink);
  border-right: 1px solid var(--line);
  z-index: 2;
}
.brand-mark {
  border-radius: 3px;
  background: #d9d2c8;
  color: #0b0d0e;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.4), 0 0 24px rgba(119,201,186,.08);
}
.brand small { color: #838786; }
.nav-item { border: 1px solid transparent; border-radius: 4px; color: #989d9b; }
.nav-item:hover, .nav-item.active { background: #14191a; border-color: var(--line); color: white; }
.sidebar-foot { border-color: var(--line); }
.main { position: relative; z-index: 1; }
.button-secondary { border-color: var(--line); background: rgba(255,255,255,.035); }
.button-secondary:link, .button-secondary:visited { color: var(--ink); }
.button-primary { background: #ded8cf; color: #0b0d0e; }
.button-primary:hover { background: #f2ede6; }
.button-danger { border-color: rgba(231,134,112,.35); color: var(--danger); background: rgba(231,134,112,.06); }
.focus-card {
  border-radius: 6px;
  background-image:
    linear-gradient(118deg, transparent 0 68%, rgba(119,201,186,.07) 68.2%, transparent 68.6%),
    linear-gradient(132deg, transparent 0 75%, rgba(214,168,95,.045) 75.2%, transparent 75.7%),
    linear-gradient(135deg, #121517 0 62%, #101719 100%);
}
.focus-card::after {
  inset: 0;
  width: auto;
  height: auto;
  right: 0;
  top: 0;
  border: 0;
  border-top: 2px solid var(--green);
  border-radius: 0;
  opacity: 1;
  background: transparent;
  box-shadow: inset 0 20px 40px rgba(119,201,186,.025);
  pointer-events: none;
}
.status-badge { border: 1px solid rgba(119,201,186,.25); border-radius: 3px; }
.focus-card h2, .page-intro h2 { font-size: 48px; letter-spacing: 0; }
.lead { color: #b0b2b0; }
.mission-line { margin: 18px 0 0; color: #d5cfc6; font: 500 11px/1.6 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.score-card { border-radius: 6px; background: var(--card-raised); }
.score-ring {
  background: radial-gradient(circle at center, var(--card-raised) 59%, transparent 60%), conic-gradient(var(--green) var(--progress), #2a3031 0);
  box-shadow: 0 0 32px rgba(119,201,186,.08);
}
.contract-card, .checkpoint-card, .claim-card, .concept-card, .ledger-summary { border-radius: 5px; }
.evidence-row, .day-card { border-radius: 4px; }
.contract-number { border-radius: 3px; background: var(--blue); color: #081012; }
.checkpoint-card.done, .day-card.done { background: var(--green-soft); border-color: rgba(119,201,186,.35); }
.section-note { max-width: 430px; color: var(--muted); font-size: 11px; line-height: 1.5; margin: 0; text-align: right; }
.doctrine-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--line);
  border-radius: 5px;
  overflow: hidden;
  background: var(--card);
}
.doctrine-step { min-height: 210px; padding: 24px; position: relative; }
.doctrine-step + .doctrine-step { border-left: 1px solid var(--line); }
.doctrine-step::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: var(--green); opacity: .8; }
.doctrine-step:nth-child(2)::before { background: var(--yellow); }
.doctrine-step:nth-child(3)::before { background: var(--blue); }
.phase-index { color: var(--muted); font: 500 9px var(--mono); letter-spacing: .1em; }
.doctrine-step h4 { margin: 30px 0 9px; font-size: 15px; line-height: 1.35; }
.doctrine-step p { min-height: 55px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.doctrine-step strong { display: block; margin-top: 22px; color: #d9d2c8; font: 500 10px var(--mono); }
.filter-group { border-radius: 5px; background: rgba(255,255,255,.025); }
.filter.active { background: #ded8cf; color: #0b0d0e; }
.day-card { color: var(--ink); }
.truth-strip { background: #161a1c; border: 1px solid var(--line); border-radius: 5px; }
.concept-image { background: #e9e3da; }
.judgment-panel {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr;
  border: 1px solid var(--line);
  border-radius: 5px;
  margin-bottom: 18px;
  background: var(--card);
  overflow: hidden;
}
.judgment-intro, .judgment-cell { padding: 25px; }
.judgment-cell { border-left: 1px solid var(--line); }
.judgment-intro h3 { margin: 10px 0; font-size: 20px; line-height: 1.25; }
.judgment-intro > p:last-child, .judgment-cell p { color: var(--muted); font-size: 11px; line-height: 1.55; margin: 8px 0 0; }
.judgment-cell span { display: block; color: var(--green); font: 500 9px var(--mono); letter-spacing: .11em; margin-bottom: 28px; }
.judgment-cell:nth-child(3) span { color: var(--yellow); }
.judgment-cell strong { font-size: 13px; line-height: 1.4; }
.dialog::backdrop { background: rgba(0, 0, 0, .76); }
.dialog-shell { border: 1px solid var(--line); border-radius: 6px; }
.work-block { background: #0c0f10; border: 1px solid var(--line); border-radius: 4px; }
textarea, input, select { border-color: var(--line); background: #0b0e0f; border-radius: 4px; color: var(--ink); }

@media (max-width: 820px) {
  .doctrine-grid, .judgment-panel { grid-template-columns: 1fr; }
  .doctrine-step + .doctrine-step, .judgment-cell { border-left: 0; border-top: 1px solid var(--line); }
  .doctrine-step { min-height: auto; }
  .doctrine-step p { min-height: auto; }
  .section-note { display: none; }
}

@media (max-width: 560px) {
  .focus-card h2, .page-intro h2 { font-size: 32px; }
  .mission-line { font-size: 9px; }
}

/* ── Skill emphasis matrix ─────────────────────────────────────────── */
.matrix-panel {
  border: 1px solid var(--line, #262a31);
  border-radius: 14px;
  padding: 22px;
  margin: 22px 0;
  background: var(--panel, #141619);
}
.matrix-intro h3 { margin: 4px 0 8px; font-size: 19px; letter-spacing: -0.01em; }
.matrix-intro p { margin: 0; max-width: 68ch; opacity: 0.78; font-size: 14px; line-height: 1.55; }
.matrix-scroll { overflow-x: auto; margin: 18px 0 0; -webkit-overflow-scrolling: touch; }
.matrix-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 720px; }
.matrix-table th, .matrix-table td { padding: 9px 10px; text-align: left; border-bottom: 1px solid var(--line, #262a31); }
.matrix-table thead th { font-size: 11px; letter-spacing: 0.07em; text-transform: uppercase; opacity: 0.62; font-weight: 600; }
.matrix-table tbody th { font-weight: 500; white-space: nowrap; }
.matrix-table td { text-align: center; }
.matrix-table td.matrix-read { text-align: left; font-size: 11.5px; opacity: 0.6; white-space: nowrap; font-family: "DM Mono", ui-monospace, monospace; }
.matrix-universal td.matrix-read { opacity: 1; color: #4ade80; }
.matrix-universal tbody th, tr.matrix-universal th[scope="row"] { color: inherit; }
.matrix-active { background: rgba(255, 255, 255, 0.035); }
.matrix-pill {
  display: inline-block; padding: 2px 8px; border-radius: 5px; white-space: nowrap;
  font-family: "DM Mono", ui-monospace, monospace; font-size: 10.5px; letter-spacing: 0.02em;
}
.matrix-vhigh    { background: rgba(22, 163, 74, 0.24);  color: #4ade80; }
.matrix-high     { background: rgba(74, 222, 128, 0.14); color: #86efac; }
.matrix-medhigh  { background: rgba(163, 230, 53, 0.15); color: #bef264; }
.matrix-med      { background: rgba(251, 191, 36, 0.16); color: #fcd34d; }
.matrix-lowmed   { background: rgba(249, 115, 22, 0.17); color: #fdba74; }
.matrix-low      { background: rgba(248, 113, 113, 0.16); color: #fca5a5; }
.matrix-stack    { background: rgba(148, 163, 184, 0.16); color: #cbd5e1; }
.matrix-rule {
  margin-top: 18px; padding: 13px 15px; border-radius: 0 8px 8px 0;
  border-left: 3px solid #4ade80; background: rgba(255, 255, 255, 0.028);
}
.matrix-rule strong {
  display: block; font-size: 11px; letter-spacing: 0.08em;
  text-transform: uppercase; color: #4ade80; margin-bottom: 4px;
}
.matrix-rule p { margin: 0; font-size: 13.5px; line-height: 1.55; opacity: 0.85; }
@media (max-width: 640px) {
  .matrix-panel { padding: 16px; }
  .matrix-intro h3 { font-size: 17px; }
}