:root {
  --bg: #e9edf0;
  --surface: #ffffff;
  --surface-2: #f5f7f8;
  --ink: #17191c;
  --muted: #626970;
  --line: #d7dce0;
  --accent: #e84c3d;
  --accent-2: #0d7f78;
  --warning: #d99000;
  --ok: #167451;
  --sidebar: #17191c;
  --sidebar-ink: #f7f8f9;
  --danger: #bf2d2d;
  --radius: 6px;
  --shadow: 0 8px 24px rgba(18, 24, 28, .08);
  --sans: "Noto Sans SC", "IBM Plex Sans", sans-serif;
  --serif: "Noto Serif SC", serif;
  --mono: "IBM Plex Mono", monospace;
  --sidebar-width: 248px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.65;
  letter-spacing: 0;
}
button, select, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
svg { width: 19px; height: 19px; flex: 0 0 auto; }
p, h1, h2, h3, h4, figure, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; }
.app-shell { min-height: 100vh; }

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;
  display: flex;
  width: var(--sidebar-width);
  flex-direction: column;
  padding: 28px 18px 22px;
  background: var(--sidebar);
  color: var(--sidebar-ink);
}
.brand { display: flex; align-items: center; gap: 13px; min-height: 58px; padding: 0 8px 24px; border-bottom: 1px solid rgba(255,255,255,.15); }
.brand-mark { display: grid; place-items: center; width: 54px; height: 48px; border: 1px solid currentColor; font-family: var(--mono); font-size: 17px; font-weight: 600; line-height: 1; }
.brand-mark span { color: var(--accent); }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 17px; }
.brand small { margin-top: 1px; color: rgba(255,255,255,.58); font-family: var(--mono); font-size: 10px; }
.main-nav { display: grid; gap: 4px; margin-top: 25px; }
.main-nav button {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 45px;
  padding: 0 12px;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0 var(--radius) var(--radius) 0;
  background: transparent;
  color: rgba(255,255,255,.68);
  text-align: left;
  cursor: pointer;
}
.main-nav button small { font-family: var(--mono); font-size: 9px; opacity: .45; }
.main-nav button:hover, .main-nav button.is-active { border-left-color: var(--accent); background: rgba(255,255,255,.1); color: #fff; }
.sidebar-foot { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 16px 8px 0; border-top: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.55); font-family: var(--mono); font-size: 10px; line-height: 1.45; }
.sidebar-foot strong { color: #fff; font-weight: 500; }
.signal-dot { width: 8px; height: 8px; border-radius: 50%; background: #51cf8f; box-shadow: 0 0 0 4px rgba(81,207,143,.14); }

.workspace { min-height: 100vh; margin-left: var(--sidebar-width); }
.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  padding: 10px clamp(20px, 4vw, 58px);
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--surface) 95%, transparent);
  backdrop-filter: blur(10px);
}
.breadcrumb span, .breadcrumb strong { display: block; }
.breadcrumb span { color: var(--muted); font-family: var(--mono); font-size: 10px; }
.breadcrumb strong { font-size: 15px; }
.topbar-tools { display: flex; align-items: center; gap: 8px; }
.theme-select { display: flex; height: 38px; align-items: center; gap: 8px; padding: 0 8px 0 12px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.theme-select select { min-width: 126px; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 13px; cursor: pointer; }
.icon-btn { display: inline-grid; width: 38px; height: 38px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); cursor: pointer; }
.icon-btn:hover { border-color: var(--accent); color: var(--accent); }
.mobile-nav { display: none; }

.content { width: min(1460px, 100%); margin: 0 auto; padding: clamp(24px, 4vw, 58px); }
.view { display: none; animation: view-in .24s ease-out; }
.view.is-active { display: block; }
@keyframes view-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.section-header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 520px); gap: 30px; align-items: end; margin-bottom: 32px; padding-bottom: 22px; border-bottom: 2px solid var(--ink); }
.section-header h2 { max-width: 780px; font-size: clamp(29px, 4vw, 52px); line-height: 1.08; }
.section-header > p { color: var(--muted); }
.eyebrow { color: var(--accent); font-family: var(--mono); font-size: 10px; font-weight: 600; text-transform: uppercase; }
.badge { display: inline-flex; min-height: 24px; align-items: center; padding: 2px 8px; border: 1px solid var(--line); border-radius: 999px; font-family: var(--mono); font-size: 10px; font-weight: 600; white-space: nowrap; }
.badge-accent { border-color: var(--accent); background: var(--accent); color: #fff; }
.badge-ok { border-color: color-mix(in srgb, var(--ok) 35%, var(--line)); background: color-mix(in srgb, var(--ok) 10%, var(--surface)); color: var(--ok); }
.badge-warning { border-color: color-mix(in srgb, var(--warning) 45%, var(--line)); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); color: #936000; }
.badge-danger { border-color: color-mix(in srgb, var(--danger) 45%, var(--line)); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); color: var(--danger); }
.badge-neutral { background: var(--surface-2); color: var(--muted); }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.panel-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.panel-title h3 { font-size: 20px; line-height: 1.3; }
.panel-title > svg { color: var(--accent); }

.hero-workspace { display: grid; min-height: 460px; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.hero-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 5vw, 72px); }
.hero-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 24px; }
.hero-copy h1 { font-size: clamp(42px, 6vw, 78px); line-height: .98; }
.hero-copy h1 span { color: var(--accent); }
.hero-copy > p { max-width: 600px; margin-top: 24px; color: var(--muted); font-size: 16px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.btn { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 9px; padding: 8px 16px; border: 1px solid var(--ink); border-radius: var(--radius); cursor: pointer; }
.btn-primary { background: var(--ink); color: var(--surface); }
.btn-primary:hover { border-color: var(--accent); background: var(--accent); }
.btn-secondary { background: transparent; color: var(--ink); }
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); }
.hero-media { position: relative; min-height: 440px; overflow: hidden; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-media figcaption, .school-visuals figcaption { position: absolute; right: 10px; bottom: 10px; padding: 5px 8px; background: rgba(0,0,0,.72); color: #fff; font-size: 9px; }
.truth-banner { display: flex; align-items: center; gap: 15px; margin: 18px 0; padding: 15px 18px; border-left: 4px solid var(--warning); background: #fff8e6; color: #624600; }
.truth-banner strong, .truth-banner span { display: block; }
.truth-banner strong { font-size: 13px; }
.truth-banner span { font-size: 12px; }
.route-flow { display: grid; grid-template-columns: 1fr 44px 1fr 44px 1fr; gap: 7px; align-items: stretch; margin: 18px 0; }
.route-step { display: flex; min-height: 112px; align-items: center; gap: 17px; padding: 20px; border: 1px solid var(--line); background: var(--surface); }
.route-index { font-family: var(--mono); font-size: 30px; font-weight: 600; color: var(--accent); }
.route-step p { color: var(--muted); font-family: var(--mono); font-size: 10px; }
.route-step h3 { font-size: 17px; }
.route-step small { color: var(--muted); }
.route-arrow { display: grid; place-items: center; color: var(--accent); }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 18px 0; }
.metric { min-height: 138px; padding: 19px; border-top: 4px solid var(--accent-2); background: var(--surface); box-shadow: var(--shadow); }
.metric span, .metric strong, .metric small { display: block; }
.metric span { color: var(--muted); font-size: 12px; }
.metric strong { margin: 4px 0; font-family: var(--mono); font-size: 40px; line-height: 1.1; }
.metric small { color: var(--muted); }
.metric-alert { border-top-color: var(--danger); }
.split-layout { display: grid; grid-template-columns: 1.3fr .7fr; gap: 18px; }
.next-panel, .profile-panel { padding: 24px; }
.priority-list { list-style: none; }
.priority-list li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.priority-list li:last-child { border-bottom: 0; }
.priority-list li > span { color: var(--accent); font-family: var(--mono); font-size: 12px; }
.priority-list strong { font-size: 14px; }
.priority-list p { color: var(--muted); font-size: 13px; }
.profile-facts > div { padding: 14px 0; border-bottom: 1px solid var(--line); }
.profile-facts dt { color: var(--muted); font-family: var(--mono); font-size: 10px; }
.profile-facts dd { margin-top: 2px; font-size: 13px; }
.privacy-note { display: flex; gap: 8px; margin-top: 15px; color: var(--muted); font-size: 11px; }
.privacy-note svg { width: 15px; height: 15px; }

.segmented { display: inline-flex; flex-wrap: wrap; margin-bottom: 22px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.segmented button { min-height: 38px; padding: 5px 14px; border: 0; border-right: 1px solid var(--line); background: var(--surface); cursor: pointer; }
.segmented button:last-child { border-right: 0; }
.segmented button.is-selected { background: var(--ink); color: var(--surface); }
.host-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.host-card { display: flex; min-width: 0; flex-direction: column; padding: 24px; border: 1px solid var(--line); border-top: 5px solid var(--accent-2); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.host-card[data-host-status="pending"] { border-top-color: var(--warning); }
.host-card[data-host-status="conditional"] { border-top-color: var(--accent); }
.host-card[data-host-status="discovery"] { border-top-color: var(--muted); }
.host-card[data-host-status="excluded"] { border-top-color: var(--danger); opacity: .82; }
.host-card-top { display: flex; align-items: center; justify-content: space-between; }
.host-number { font-family: var(--mono); font-size: 28px; color: var(--line); }
.host-tier { margin-top: 20px; color: var(--accent); font-family: var(--mono); font-size: 10px; }
.host-card h3 { font-size: 28px; }
.host-unit { min-height: 50px; color: var(--muted); }
.host-details { margin-top: 18px; }
.host-details > div { padding: 13px 0; border-top: 1px solid var(--line); }
.host-details dt { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.host-details dt svg { width: 14px; height: 14px; }
.host-details dd { margin-top: 3px; font-size: 12px; }
.source-link { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line); color: var(--accent-2); font-size: 12px; font-weight: 600; text-decoration: none; }
.source-link:hover { color: var(--accent); }
.source-link svg { width: 15px; height: 15px; }
.workflow-panel { margin-top: 18px; padding: 24px; }
.workflow-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.workflow-grid article { min-width:0; padding:18px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.workflow-grid span { color:var(--accent); font-family:var(--mono); font-size:10px; }
.workflow-grid h4 { margin:7px 0 5px; font-size:14px; }
.workflow-grid p { color:var(--muted); font-size:11px; }
.manifest-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:18px; }
.manifest-grid article { padding:22px; border:1px solid var(--line); background:var(--surface); }
.manifest-title { display:flex; align-items:center; gap:12px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.manifest-title > span { display:grid; width:38px; height:38px; place-items:center; background:var(--ink); color:var(--surface); font-family:var(--mono); font-size:11px; }
.manifest-title p { color:var(--accent); font-family:var(--mono); font-size:9px; }
.manifest-title h3 { font-size:16px; }
.manifest-grid ol { margin:15px 0 0 22px; color:var(--muted); font-size:12px; }
.manifest-grid li { margin-bottom:5px; padding-left:3px; }
.decision-panel { margin-top: 18px; padding: 24px; }
.decision-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.decision-grid > div { padding: 22px; border-right: 1px solid var(--line); }
.decision-grid > div:last-child { border-right: 0; }
.decision-grid span { display: grid; width: 31px; height: 31px; place-items: center; margin-bottom: 10px; background: var(--ink); color: var(--surface); font-family: var(--mono); }
.decision-grid strong { font-size: 18px; }
.decision-grid p { color: var(--muted); font-size: 13px; }

.legend-row { display: flex; flex-wrap: wrap; gap: 14px 22px; margin-bottom: 24px; }
.legend-row > span { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.timeline-list { position: relative; }
.timeline-list::before { position: absolute; top: 0; bottom: 0; left: 24px; width: 1px; background: var(--line); content: ""; }
.timeline-item { position: relative; display: grid; grid-template-columns: 49px 170px 1fr; gap: 22px; align-items: start; padding: 0 0 26px; }
.timeline-marker { position: relative; z-index: 2; display: grid; width: 49px; height: 49px; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--muted); font-family: var(--mono); font-size: 10px; }
.status-confirmed .timeline-marker { border-color: var(--ok); background: var(--ok); color: #fff; }
.status-action .timeline-marker { border-color: var(--accent); color: var(--accent); }
.status-pending .timeline-marker { border-color: var(--warning); color: #8b5d00; }
.timeline-item time { padding-top: 12px; color: var(--muted); font-family: var(--mono); font-size: 11px; }
.timeline-item > div:last-child { padding: 9px 20px 17px; border-bottom: 1px solid var(--line); }
.timeline-item h3 { font-size: 17px; }
.timeline-item p { color: var(--muted); font-size: 13px; }
.watchlist, .consistency-strip { display: grid; grid-template-columns: 230px 1fr; gap: 20px; padding: 20px; border: 1px solid var(--warning); background: #fff8e6; }
.watchlist > div, .consistency-strip > div { display: flex; align-items: center; gap: 10px; }
.watchlist p, .consistency-strip p { color: #664d14; font-size: 13px; }

.school-visuals { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 320px; margin-bottom: 18px; overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.school-visuals figure { position: relative; min-height: 320px; }
.school-visuals img { width: 100%; height: 100%; object-fit: cover; }
.exam-route-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(28px, 5vw, 60px); }
.exam-route-copy h3 { margin: 5px 0 14px; font-size: 28px; line-height: 1.2; }
.exam-route-copy > p:last-child { color: var(--muted); }
.exam-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.exam-school { padding: 25px; border: 1px solid var(--line); border-top: 6px solid var(--accent-2); background: var(--surface); }
.exam-school.utokyo { border-top-color: var(--accent); }
.exam-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.exam-heading p { color: var(--muted); font-family: var(--mono); font-size: 10px; }
.exam-heading h3 { font-size: 27px; }
.exam-fact { margin: 20px 0; padding: 16px; background: var(--surface-2); }
.exam-fact strong { display: block; margin-bottom: 5px; }
.exam-fact p { color: var(--muted); font-size: 13px; }
.track-list { display: grid; gap: 10px; }
.track { position: relative; padding: 17px; border: 1px solid var(--line); }
.track > span { color: var(--accent-2); font-family: var(--mono); font-size: 9px; }
.track h4 { font-size: 16px; }
.track p { color: var(--muted); font-size: 12px; }
.track.is-recommended { border-left: 5px solid var(--accent-2); }
.track.muted { opacity: .75; }
.evidence-note { margin-top: 15px; color: var(--muted); font-size: 11px; }
.weekly-plan { margin-top: 18px; padding: 24px; }
.hours-grid { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 18px; }
.hours-grid > div { padding: 13px; border-right: 1px solid var(--line); text-align: center; }
.hours-grid > div:last-child { border-right: 0; }
.hours-grid strong, .hours-grid span { display: block; }
.hours-grid strong { font-family: var(--mono); font-size: 23px; color: var(--accent); }
.hours-grid span { color: var(--muted); font-size: 11px; }

.progress-panel { display: grid; grid-template-columns: 150px 1fr 38px; gap: 18px; align-items: center; margin-bottom: 22px; padding: 17px 20px; border: 1px solid var(--line); background: var(--surface); }
.progress-panel > div:first-child { display: flex; align-items: baseline; gap: 10px; }
.progress-panel p { color: var(--muted); font-size: 12px; }
.progress-panel strong { font-family: var(--mono); font-size: 25px; }
.progress-track { height: 9px; overflow: hidden; background: var(--line); }
.progress-track span { display: block; width: 0; height: 100%; background: var(--accent-2); transition: width .25s ease; }
.material-tools { display:grid; grid-template-columns:minmax(240px,1fr) auto; gap:12px 18px; align-items:center; margin-bottom:18px; padding:16px; }
.material-search { display:flex; min-height:42px; align-items:center; gap:9px; padding:0 12px; border:1px solid var(--line); background:var(--surface); }
.material-search svg { width:17px; color:var(--muted); }
.material-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font:inherit; font-size:13px; }
.material-filters { grid-column:1; margin:0; }
.material-tool-actions { grid-column:2; grid-row:1 / span 2; display:flex; align-items:center; justify-content:flex-end; gap:12px; }
.material-tool-actions > span { color:var(--muted); font-family:var(--mono); font-size:10px; white-space:nowrap; }
.material-tool-actions .btn { min-height:42px; }
.material-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.material-group { min-width:0; }
.material-group-title { display: flex; align-items: center; justify-content: space-between; margin-bottom:8px; padding: 12px 4px; border-bottom: 2px solid var(--ink); }
.material-group-title h3 { font-size: 15px; }
.material-group-title span { font-family: var(--mono); font-size: 10px; color: var(--muted); }
.checklist { display:grid; gap:8px; }
.material-card { min-width:0; border:1px solid var(--line); background:var(--surface); }
.check-item { display: grid; grid-template-columns: 24px minmax(0,1fr) auto auto; gap: 8px 11px; align-items: center; min-height: 70px; padding: 13px 15px; cursor: pointer; }
.check-item:hover { background: color-mix(in srgb, var(--accent-2) 5%, var(--surface)); }
.check-item input { position: absolute; opacity: 0; pointer-events: none; }
.custom-check { display: grid; width: 21px; height: 21px; place-items: center; margin-top: 2px; border: 1px solid var(--line); background: var(--surface); }
.custom-check svg { width: 14px; height: 14px; opacity: 0; }
.check-item.is-checked .custom-check { border-color: var(--ok); background: var(--ok); color: #fff; }
.check-item.is-checked .custom-check svg { opacity: 1; }
.check-item.is-checked strong { color: var(--muted); text-decoration: line-through; }
.check-item strong, .check-item small { display: block; }
.check-item strong { font-size: 13px; }
.check-item small { color: var(--muted); font-size: 11px; }
.material-status, .priority-flag { align-self:center; padding:3px 7px; border:1px solid currentColor; font-family:var(--mono); font-size:8px; white-space:nowrap; }
.status-missing { color:var(--danger); }
.status-partial { color:var(--warning); }
.status-ready { color:var(--ok); }
.status-not-applicable { color:var(--muted); }
.priority-flag { border-color:var(--accent); background:var(--accent); color:#fff; }
.material-details { border-top:1px solid var(--line); }
.material-details summary { display:flex; min-height:38px; align-items:center; gap:7px; padding:8px 15px; color:var(--accent-2); cursor:pointer; font-size:11px; list-style:none; }
.material-details summary::-webkit-details-marker { display:none; }
.material-details summary svg { width:14px; }
.material-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line); }
.material-detail-grid > div { min-width:0; padding:12px 15px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.material-detail-grid > div:nth-child(2n) { border-right:0; }
.material-detail-grid .detail-wide { grid-column:1 / -1; border-right:0; }
.material-detail-grid span { color:var(--accent); font-family:var(--mono); font-size:8px; }
.material-detail-grid p { margin-top:3px; color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.consistency-strip { margin-top: 18px; border-color: var(--danger); background: #fff1f1; }
.consistency-strip p { color: #6f2a2a; }

.research-branches { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.research-branch { min-width: 0; padding: 24px; border: 1px solid var(--line); border-top: 6px solid var(--accent-2); background: var(--surface); }
.research-branch.stretch { border-top-color: var(--accent); }
.research-branch.backup { border-top-color: var(--warning); }
.branch-label { display: inline-block; padding: 2px 7px; background: var(--ink); color: var(--surface); font-family: var(--mono); font-size: 9px; }
.research-branch h3 { margin: 12px 0 7px; font-size: 22px; }
.research-branch > p { min-height: 114px; color: var(--muted); font-size: 13px; }
.research-branch ul { margin: 15px 0 0 18px; font-size: 12px; }
.research-branch li { margin-bottom: 4px; }
.sprint-table { display: grid; grid-template-columns: 120px 1fr 1fr; margin-top: 18px; border: 1px solid var(--line); background: var(--surface); }
.sprint-table > div { display: contents; }
.sprint-table span, .sprint-table strong, .sprint-table p, .sprint-table small { padding: 14px 16px; border-bottom: 1px solid var(--line); }
.sprint-table span { background: var(--ink); color: var(--surface); font-family: var(--mono); font-size: 10px; }
.sprint-table strong { font-family: var(--mono); font-size: 11px; }
.sprint-table p { font-size: 12px; }
.sprint-table small { color: var(--muted); font-size: 11px; }
.sprint-table > div:last-child > * { border-bottom: 0; }
.language-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 18px; }
.language-grid article { padding: 22px; border: 1px solid var(--line); background: var(--surface); }
.language-status { display: inline-block; padding: 2px 7px; border: 1px solid currentColor; font-family: var(--mono); font-size: 9px; }
.language-status.self { color: var(--warning); }
.language-status.target { color: var(--accent); }
.language-grid h3 { margin-top: 10px; font-size: 23px; }
.language-grid p { color: var(--muted); font-size: 12px; }

.gate-list { border-top: 1px solid var(--ink); }
.gate-list article { display: grid; grid-template-columns: 130px 1fr 40px; gap: 22px; align-items: center; min-height: 104px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.gate-date span, .gate-date time { display: block; font-family: var(--mono); }
.gate-date span { color: var(--accent); font-size: 10px; }
.gate-date time { font-size: 13px; }
.gate-list h3 { font-size: 17px; }
.gate-list p { color: var(--muted); font-size: 13px; }
.gate-check { color: var(--muted); }
.gate-check.is-complete { color: var(--ok); }
.action-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 24px; }
.action-column { padding: 23px; border: 1px solid var(--line); background: var(--surface); }
.column-title { display: flex; align-items: baseline; gap: 10px; padding-bottom: 12px; border-bottom: 2px solid var(--ink); }
.column-title span { color: var(--accent); font-family: var(--mono); font-size: 10px; }
.action-column ul { margin: 17px 0 0 18px; color: var(--muted); font-size: 13px; }
.action-column li { margin-bottom: 8px; }
.fallback-panel { display: grid; grid-template-columns: 280px 1fr; gap: 25px; margin-top: 18px; padding: 25px; background: var(--ink); color: var(--surface); }
.fallback-panel > div { display: flex; align-items: center; gap: 12px; }
.fallback-panel p { color: color-mix(in srgb, var(--surface) 72%, transparent); font-size: 13px; }

.source-summary { display: grid; grid-template-columns: 220px 1fr; gap: 24px; align-items: center; margin-bottom: 18px; padding: 21px; border: 1px solid var(--line); background: var(--surface); }
.source-summary > div { display: flex; align-items: baseline; gap: 10px; }
.source-summary strong { font-family: var(--mono); font-size: 33px; }
.source-summary span, .source-summary p { color: var(--muted); font-size: 12px; }
.source-table { overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.source-row { display: grid; grid-template-columns: 1.1fr 1.7fr 1fr 44px; gap: 15px; align-items: center; min-height: 70px; padding: 12px 17px; border-bottom: 1px solid var(--line); }
.source-row:last-child { border-bottom: 0; }
.source-row strong { font-size: 13px; }
.source-row p, .source-row > span { color: var(--muted); font-size: 11px; }
.source-row a { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); text-decoration: none; }
.source-row a:hover { border-color: var(--accent); color: var(--accent); }
.source-head { min-height: 42px; background: var(--ink); color: var(--surface); font-family: var(--mono); font-size: 10px; }
.source-head span { color: inherit; }
.asset-credits, .method-note { margin-top: 18px; padding: 22px; border: 1px solid var(--line); background: var(--surface); }
.asset-credits h3 { font-size: 16px; }
.asset-credits p, .method-note p { color: var(--muted); font-size: 12px; }
.asset-credits > div { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.asset-credits a { display: inline-flex; align-items: center; gap: 7px; color: var(--accent-2); font-size: 11px; text-decoration: none; }
.asset-credits svg { width: 14px; height: 14px; }
.method-note { border-left: 5px solid var(--accent); }
.app-footer { display: flex; justify-content: space-between; gap: 20px; padding: 18px clamp(20px, 4vw, 58px); border-top: 1px solid var(--line); color: var(--muted); font-family: var(--mono); font-size: 9px; }
.nav-scrim { display: none; }

/* 02 · Academic journal */
body[data-theme="journal"] { --bg:#f1f2ef; --surface:#fff; --surface-2:#f4f4f0; --ink:#282421; --muted:#726d67; --line:#d8d5ce; --accent:#8c1d2c; --accent-2:#1f6a55; --sidebar:#fff; --sidebar-ink:#282421; --radius:0; --shadow:none; --sidebar-width:286px; }
body[data-theme="journal"] h1, body[data-theme="journal"] h2, body[data-theme="journal"] h3 { font-family:var(--serif); font-weight:600; }
body[data-theme="journal"] .sidebar { border-right:1px solid var(--ink); }
body[data-theme="journal"] .brand { border-bottom:4px double var(--ink); }
body[data-theme="journal"] .brand small, body[data-theme="journal"] .sidebar-foot { color:var(--muted); }
body[data-theme="journal"] .sidebar-foot { border-color:var(--line); }
body[data-theme="journal"] .sidebar-foot strong { color:var(--ink); }
body[data-theme="journal"] .main-nav button { color:var(--muted); border-left:0; border-bottom:1px solid transparent; }
body[data-theme="journal"] .main-nav button:hover, body[data-theme="journal"] .main-nav button.is-active { border-bottom-color:var(--accent); background:transparent; color:var(--accent); }
body[data-theme="journal"] .hero-workspace { grid-template-columns:1.05fr .95fr; border-top:8px solid var(--accent); }
body[data-theme="journal"] .metric { border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }
body[data-theme="journal"] .panel, body[data-theme="journal"] .host-card { box-shadow:none; }
body[data-theme="journal"] .section-header { border-bottom:4px double var(--ink); }

/* 03 · Engineering blueprint */
body[data-theme="blueprint"] { --bg:#dfe9e8; --surface:#f8ffff; --surface-2:#dbeeed; --ink:#082d32; --muted:#43636a; --line:#82a9aa; --accent:#e54235; --accent-2:#007c86; --warning:#b26b00; --sidebar:#08343a; --sidebar-ink:#efffff; --radius:0; --shadow:none; --sidebar-width:220px; font-family:var(--mono); }
body[data-theme="blueprint"] .sidebar { border-right:5px solid #f4cc35; }
body[data-theme="blueprint"] .main-nav button { border:1px solid transparent; border-radius:0; }
body[data-theme="blueprint"] .main-nav button:hover, body[data-theme="blueprint"] .main-nav button.is-active { border-color:#65c5ca; background:#0e4b53; }
body[data-theme="blueprint"] h1, body[data-theme="blueprint"] h2, body[data-theme="blueprint"] h3, body[data-theme="blueprint"] h4 { font-family:var(--mono); font-weight:600; }
body[data-theme="blueprint"] .hero-workspace, body[data-theme="blueprint"] .panel, body[data-theme="blueprint"] .host-card, body[data-theme="blueprint"] .exam-school { border-width:2px; }
body[data-theme="blueprint"] .route-index, body[data-theme="blueprint"] .host-number { color:#007c86; }
body[data-theme="blueprint"] .content { max-width:1320px; }

/* 04 · Tokyo metro map */
body[data-theme="metro"] { --bg:#f0f0ee; --surface:#fff; --surface-2:#f6f7f5; --ink:#202326; --muted:#6d7479; --line:#cdd2d5; --accent:#e53b32; --accent-2:#008c6f; --warning:#ef9b00; --sidebar:#fafafa; --sidebar-ink:#202326; --radius:8px; --shadow:0 4px 0 rgba(22,27,30,.08); --sidebar-width:270px; }
body[data-theme="metro"] .sidebar { border-right:9px solid #efc51a; }
body[data-theme="metro"] .brand { border-bottom:0; }
body[data-theme="metro"] .brand-mark { border-radius:50%; border:5px solid #e53b32; }
body[data-theme="metro"] .brand small, body[data-theme="metro"] .sidebar-foot { color:var(--muted); }
body[data-theme="metro"] .sidebar-foot { border-color:var(--line); }
body[data-theme="metro"] .sidebar-foot strong { color:var(--ink); }
body[data-theme="metro"] .main-nav { position:relative; padding-left:8px; }
body[data-theme="metro"] .main-nav::before { position:absolute; top:8px; bottom:8px; left:24px; width:5px; background:#008c6f; content:""; }
body[data-theme="metro"] .main-nav button { position:relative; grid-template-columns:25px 1fr auto; border:0; color:var(--muted); }
body[data-theme="metro"] .main-nav button svg { z-index:1; padding:4px; border:2px solid #008c6f; border-radius:50%; background:#fff; }
body[data-theme="metro"] .main-nav button:hover, body[data-theme="metro"] .main-nav button.is-active { background:#e9f3ef; color:var(--ink); }
body[data-theme="metro"] .route-flow { position:relative; }
body[data-theme="metro"] .route-step { border-bottom:6px solid #008c6f; border-radius:8px; }
body[data-theme="metro"] .route-step:nth-of-type(2) { border-bottom-color:#efc51a; }
body[data-theme="metro"] .route-step:nth-of-type(3) { border-bottom-color:#e53b32; }

/* 05 · Archive dossier */
body[data-theme="archive"] { --bg:#e7ebe8; --surface:#fdfefd; --surface-2:#eef1ee; --ink:#16251e; --muted:#58675f; --line:#bdc7c0; --accent:#a02732; --accent-2:#27694b; --warning:#a66c00; --sidebar:#17392a; --sidebar-ink:#f6fff9; --radius:2px; --shadow:3px 3px 0 #bec8c1; --sidebar-width:264px; }
body[data-theme="archive"] .sidebar { border-right:12px solid #a02732; }
body[data-theme="archive"] .brand-mark { transform:rotate(-2deg); border:2px solid #fff; }
body[data-theme="archive"] h1, body[data-theme="archive"] h2, body[data-theme="archive"] h3 { font-family:var(--serif); }
body[data-theme="archive"] .eyebrow, body[data-theme="archive"] .host-tier, body[data-theme="archive"] .badge { text-transform:uppercase; }
body[data-theme="archive"] .hero-copy { border-left:13px solid var(--accent-2); }
body[data-theme="archive"] .panel, body[data-theme="archive"] .host-card, body[data-theme="archive"] .material-group { outline:1px solid var(--surface); outline-offset:-5px; }
body[data-theme="archive"] .section-header h2::after { display:block; width:88px; height:6px; margin-top:13px; background:var(--accent); content:""; }

/* 06 · Terminal */
body[data-theme="terminal"] { --bg:#050706; --surface:#0c100e; --surface-2:#111813; --ink:#d9ffe2; --muted:#8db495; --line:#284c32; --accent:#ff4d73; --accent-2:#48f27d; --warning:#f4c84d; --ok:#48f27d; --danger:#ff4d73; --sidebar:#020403; --sidebar-ink:#d9ffe2; --radius:0; --shadow:none; --sidebar-width:230px; font-family:var(--mono); }
body[data-theme="terminal"] h1, body[data-theme="terminal"] h2, body[data-theme="terminal"] h3, body[data-theme="terminal"] h4 { font-family:var(--mono); }
body[data-theme="terminal"] .sidebar { border-right:1px solid var(--accent-2); }
body[data-theme="terminal"] .brand-mark { border-color:var(--accent-2); }
body[data-theme="terminal"] .topbar { backdrop-filter:none; }
body[data-theme="terminal"] .main-nav button { border-radius:0; }
body[data-theme="terminal"] .main-nav button.is-active::before { content:">"; color:var(--accent-2); }
body[data-theme="terminal"] .main-nav button.is-active svg { display:none; }
body[data-theme="terminal"] .hero-copy h1::before { content:"$ route --execute"; display:block; margin-bottom:18px; color:var(--accent-2); font-size:12px; }
body[data-theme="terminal"] .truth-banner, body[data-theme="terminal"] .watchlist { background:#211c0b; color:#f4dc94; }
body[data-theme="terminal"] .truth-banner span, body[data-theme="terminal"] .watchlist p { color:#f4dc94; }
body[data-theme="terminal"] .consistency-strip { background:#250a10; }
body[data-theme="terminal"] .consistency-strip p { color:#ff9eb2; }
body[data-theme="terminal"] .hero-media { filter:saturate(.45) contrast(1.1); }
body[data-theme="terminal"] .badge-accent, body[data-theme="terminal"] .btn-primary { color:#050706; }

/* 07 · Swiss typography */
body[data-theme="swiss"] { --bg:#f2f2f2; --surface:#fff; --surface-2:#e8e8e8; --ink:#0b0b0b; --muted:#5d5d5d; --line:#bdbdbd; --accent:#f02020; --accent-2:#006f62; --warning:#c37a00; --sidebar:#fff; --sidebar-ink:#0b0b0b; --radius:0; --shadow:none; --sidebar-width:196px; }
body[data-theme="swiss"] .sidebar { border-right:2px solid var(--ink); padding-left:12px; padding-right:12px; }
body[data-theme="swiss"] .brand { display:block; border-bottom:8px solid var(--accent); }
body[data-theme="swiss"] .brand-mark { width:100%; justify-content:start; border:0; font-size:30px; }
body[data-theme="swiss"] .brand > div { display:none; }
body[data-theme="swiss"] .brand small, body[data-theme="swiss"] .sidebar-foot { color:var(--muted); }
body[data-theme="swiss"] .sidebar-foot { border-color:var(--ink); }
body[data-theme="swiss"] .sidebar-foot strong { color:var(--ink); }
body[data-theme="swiss"] .main-nav button { grid-template-columns:1fr auto; padding-left:4px; border:0; border-bottom:1px solid var(--ink); border-radius:0; color:var(--ink); font-weight:700; }
body[data-theme="swiss"] .main-nav button svg { display:none; }
body[data-theme="swiss"] .main-nav button:hover, body[data-theme="swiss"] .main-nav button.is-active { background:var(--accent); color:#fff; }
body[data-theme="swiss"] .section-header h2, body[data-theme="swiss"] .hero-copy h1 { font-weight:900; }
body[data-theme="swiss"] .hero-workspace { border:2px solid var(--ink); }
body[data-theme="swiss"] .metric, body[data-theme="swiss"] .host-card { border-color:var(--ink); }
body[data-theme="swiss"] .section-header { border-bottom:8px solid var(--ink); }

/* 08 · Sprint board */
body[data-theme="sprint"] { --bg:#eef1ef; --surface:#fff; --surface-2:#f1f3f1; --ink:#17201c; --muted:#66716b; --line:#cbd2cd; --accent:#ea3f53; --accent-2:#008c83; --warning:#d78a00; --sidebar:#f2d231; --sidebar-ink:#17201c; --radius:6px; --shadow:0 6px 0 rgba(23,32,28,.12); --sidebar-width:230px; }
body[data-theme="sprint"] .sidebar { border-right:3px solid var(--ink); }
body[data-theme="sprint"] .brand { border-bottom-color:var(--ink); }
body[data-theme="sprint"] .brand small, body[data-theme="sprint"] .sidebar-foot { color:#4e4a2c; }
body[data-theme="sprint"] .sidebar-foot { border-color:var(--ink); }
body[data-theme="sprint"] .sidebar-foot strong { color:var(--ink); }
body[data-theme="sprint"] .main-nav button { color:var(--ink); border-left:0; font-weight:600; }
body[data-theme="sprint"] .main-nav button:hover, body[data-theme="sprint"] .main-nav button.is-active { background:#fff; color:var(--ink); transform:translateX(3px); }
body[data-theme="sprint"] .hero-workspace { border-top:10px solid var(--accent-2); }
body[data-theme="sprint"] .metric:nth-child(2n) { border-top-color:#f2d231; }
body[data-theme="sprint"] .action-column:nth-child(1) { border-top:7px solid #f2d231; }
body[data-theme="sprint"] .action-column:nth-child(2) { border-top:7px solid var(--accent-2); }
body[data-theme="sprint"] .action-column:nth-child(3) { border-top:7px solid var(--accent); }
body[data-theme="sprint"] .check-item.is-checked { background:#e6f5ee; }

/* 09 · Laboratory whiteboard */
body[data-theme="laboratory"] { --bg:#edf3f2; --surface:#fff; --surface-2:#e7f3ef; --ink:#172422; --muted:#62716e; --line:#bfd0cc; --accent:#d64065; --accent-2:#007f72; --warning:#bb7b00; --sidebar:#f9fffd; --sidebar-ink:#172422; --radius:8px; --shadow:0 8px 24px rgba(10,65,56,.08); --sidebar-width:250px; }
body[data-theme="laboratory"] .sidebar { border-right:1px solid var(--line); }
body[data-theme="laboratory"] .brand { border-bottom:4px solid var(--accent-2); }
body[data-theme="laboratory"] .brand-mark { border-color:var(--accent-2); color:var(--accent-2); }
body[data-theme="laboratory"] .brand small, body[data-theme="laboratory"] .sidebar-foot { color:var(--muted); }
body[data-theme="laboratory"] .sidebar-foot { border-color:var(--line); }
body[data-theme="laboratory"] .sidebar-foot strong { color:var(--ink); }
body[data-theme="laboratory"] .main-nav button { color:var(--muted); border-left-color:transparent; }
body[data-theme="laboratory"] .main-nav button:hover, body[data-theme="laboratory"] .main-nav button.is-active { border-left-color:var(--accent-2); background:#e1f4ee; color:var(--accent-2); }
body[data-theme="laboratory"] .hero-copy { background:#f8fffd; }
body[data-theme="laboratory"] .panel-title > svg, body[data-theme="laboratory"] .route-index { color:var(--accent-2); }
body[data-theme="laboratory"] .section-header { border-bottom-color:var(--accent-2); }

/* 10 · Data matrix */
body[data-theme="matrix"] { --bg:#101012; --surface:#18181b; --surface-2:#232329; --ink:#f3f2f5; --muted:#aaa8b0; --line:#3e3d45; --accent:#ff3f89; --accent-2:#16d9d0; --warning:#f2c84b; --ok:#35d48a; --danger:#ff3f89; --sidebar:#08080a; --sidebar-ink:#f3f2f5; --radius:2px; --shadow:none; --sidebar-width:210px; font-family:var(--mono); font-size:13px; }
body[data-theme="matrix"] h1, body[data-theme="matrix"] h2, body[data-theme="matrix"] h3, body[data-theme="matrix"] h4 { font-family:var(--mono); }
body[data-theme="matrix"] .sidebar { border-right:2px solid var(--accent); }
body[data-theme="matrix"] .brand-mark { border-color:var(--accent-2); }
body[data-theme="matrix"] .main-nav button { border-radius:0; }
body[data-theme="matrix"] .main-nav button:hover, body[data-theme="matrix"] .main-nav button.is-active { border-left-color:var(--accent-2); background:#1d1b26; color:var(--accent-2); }
body[data-theme="matrix"] .content { max-width:1500px; padding-top:30px; }
body[data-theme="matrix"] .hero-workspace { min-height:390px; grid-template-columns:1fr 1fr; }
body[data-theme="matrix"] .hero-media { min-height:390px; filter:saturate(.65) contrast(1.15); }
body[data-theme="matrix"] .metric-grid, body[data-theme="matrix"] .host-grid { gap:2px; }
body[data-theme="matrix"] .metric { min-height:112px; box-shadow:none; }
body[data-theme="matrix"] .truth-banner, body[data-theme="matrix"] .watchlist { background:#29230e; color:#f2db89; }
body[data-theme="matrix"] .truth-banner span, body[data-theme="matrix"] .watchlist p { color:#f2db89; }
body[data-theme="matrix"] .consistency-strip { background:#30101c; }
body[data-theme="matrix"] .consistency-strip p { color:#ffaccb; }
body[data-theme="matrix"] .section-header { border-bottom-color:var(--accent-2); }

@media (max-width: 1100px) {
  .hero-workspace { grid-template-columns:1fr; }
  .hero-media { min-height:340px; order:-1; }
  .metric-grid { grid-template-columns:repeat(2,1fr); }
  .split-layout, .school-visuals, .exam-columns { grid-template-columns:1fr; }
  .host-grid, .manifest-grid, .research-branches { grid-template-columns:1fr; }
  .workflow-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .research-branch > p { min-height:0; }
  .hours-grid { grid-template-columns:repeat(3,1fr); }
  .hours-grid > div:nth-child(3) { border-right:0; }
  .hours-grid > div:nth-child(-n+3) { border-bottom:1px solid var(--line); }
}

@media (max-width: 780px) {
  :root { --sidebar-width:280px; }
  .sidebar { transform:translateX(-102%); transition:transform .22s ease; box-shadow:8px 0 24px rgba(0,0,0,.2); }
  body.nav-open .sidebar { transform:translateX(0); }
  .workspace { margin-left:0; }
  .topbar { min-height:60px; padding:9px 14px; }
  .mobile-nav { display:inline-grid; }
  .breadcrumb span { display:none; }
  .theme-select svg { display:none; }
  .theme-select select { min-width:105px; max-width:125px; }
  .content { padding:22px 14px 38px; }
  .nav-scrim { position:fixed; inset:0; z-index:25; background:rgba(0,0,0,.48); }
  body.nav-open .nav-scrim { display:block; }
  .section-header { grid-template-columns:1fr; gap:12px; margin-bottom:22px; }
  .section-header h2 { font-size:32px; }
  body[data-theme] .hero-workspace { grid-template-columns:1fr; }
  body[data-theme] .hero-media { min-height:230px; order:-1; }
  .hero-copy { padding:26px 20px 30px; }
  .hero-copy h1 { font-size:42px; }
  .hero-media { min-height:230px; }
  .route-flow { grid-template-columns:1fr; }
  .route-arrow { min-height:24px; transform:rotate(90deg); }
  .metric-grid, .material-groups, .language-grid, .action-board { grid-template-columns:1fr; }
  .material-tools { grid-template-columns:1fr; }
  .material-filters, .material-tool-actions { grid-column:1; grid-row:auto; }
  .material-tool-actions { justify-content:space-between; }
  .host-card { padding:19px; }
  .decision-grid { grid-template-columns:1fr; }
  .decision-grid > div { border-right:0; border-bottom:1px solid var(--line); }
  .decision-grid > div:last-child { border-bottom:0; }
  .timeline-item { grid-template-columns:42px 1fr; gap:13px; }
  .timeline-list::before { left:20px; }
  .timeline-marker { width:42px; height:42px; }
  .timeline-item time { grid-column:2; padding-top:1px; }
  .timeline-item > div:last-child { grid-column:2; padding:0 0 17px; }
  .watchlist, .consistency-strip, .fallback-panel, .source-summary { grid-template-columns:1fr; }
  .exam-school { padding:18px; }
  .exam-heading { align-items:flex-start; }
  .sprint-table { grid-template-columns:1fr; border:0; gap:10px; background:transparent; }
  .sprint-table > div { display:grid; padding:15px; border:1px solid var(--line); background:var(--surface); }
  .sprint-table .sprint-head { display:none; }
  .sprint-table strong, .sprint-table p, .sprint-table small { padding:3px 0; border:0; }
  .gate-list article { grid-template-columns:90px 1fr 28px; gap:10px; }
  .source-row { grid-template-columns:1fr 42px; gap:7px; padding:14px; }
  .source-row p, .source-row > span { grid-column:1; }
  .source-row a { grid-column:2; grid-row:1 / span 3; }
  .source-head { display:none; }
  .progress-panel { grid-template-columns:1fr 38px; }
  .progress-track { grid-column:1 / -1; grid-row:2; }
  .check-item { grid-template-columns:24px minmax(0,1fr) auto; }
  .priority-flag { grid-column:2; justify-self:start; }
  .app-footer { flex-direction:column; gap:2px; }
  body[data-theme="journal"] .sidebar, body[data-theme="metro"] .sidebar, body[data-theme="archive"] .sidebar, body[data-theme="swiss"] .sidebar, body[data-theme="sprint"] .sidebar, body[data-theme="laboratory"] .sidebar { color:var(--sidebar-ink); }
}

@media (max-width: 450px) {
  .theme-select { padding-left:7px; }
  .theme-select select { width:95px; min-width:95px; font-size:11px; }
  .topbar-tools { gap:5px; }
  .hero-copy h1 { font-size:36px; }
  .metric-grid { grid-template-columns:1fr 1fr; gap:7px; }
  .metric { min-height:118px; padding:14px; }
  .metric strong { font-size:31px; }
  .truth-banner { align-items:flex-start; }
  .hours-grid { grid-template-columns:1fr 1fr; }
  .hours-grid > div { border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .hours-grid > div:nth-child(2n) { border-right:0; }
  .hours-grid > div:nth-last-child(-n+2) { border-bottom:0; }
  .gate-list article { grid-template-columns:1fr 28px; }
  .gate-date { grid-column:1; }
  .gate-list article > div:nth-child(2) { grid-column:1; }
  .gate-check { grid-column:2; grid-row:1 / span 2; }
  .workflow-grid, .material-detail-grid { grid-template-columns:1fr; }
  .material-detail-grid > div, .material-detail-grid > div:nth-child(2n) { grid-column:1; border-right:0; }
  .material-tool-actions { align-items:stretch; flex-direction:column; }
  .material-tool-actions .btn { width:100%; }
  .check-item { grid-template-columns:22px minmax(0,1fr) auto; }
  .material-status { grid-column:3; grid-row:1; justify-self:end; }
  .priority-flag { grid-column:3; grid-row:2; justify-self:end; }
}

@media print {
  .sidebar, .topbar, .app-footer, .hero-actions, .segmented, .progress-panel .icon-btn, .material-tools, .material-details summary { display:none !important; }
  .workspace { margin:0; }
  .content { max-width:none; padding:0; }
  .view { display:block !important; break-after:page; animation:none; }
  body { background:#fff; color:#000; font-size:10pt; }
  .panel, .host-card, .metric { box-shadow:none; break-inside:avoid; }
  .material-details:not([open]) > :not(summary) { display:block !important; }
  .material-card { break-inside:avoid; }
  a { text-decoration:none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; }
}