/* DAY 03 shares the course system and adds one subject-specific object: the Agent Evidence Board. */

.lesson-pane[data-activity="day03"] {
  --journey-accent: var(--blue-700);
  --journey-soft: var(--blue-50);
}
.lesson-pane[data-activity="day03"][data-journey="Prepare"],
.lesson-pane[data-activity="day03"][data-journey="Reflect"] { --journey-accent: var(--ink-900); --journey-soft: var(--ink-50); }
.lesson-pane[data-activity="day03"][data-journey="Calibrate"] { --journey-accent: var(--red-700); --journey-soft: var(--red-50); }
.lesson-pane[data-activity="day03"][data-journey="Decide"],
.lesson-pane[data-activity="day03"][data-journey="Compare"] { --journey-accent: var(--amber-700); --journey-soft: var(--amber-50); }
.lesson-pane[data-activity="day03"][data-journey="Model"],
.lesson-pane[data-activity="day03"][data-journey="Build"] { --journey-accent: var(--blue-700); --journey-soft: var(--blue-50); }
.lesson-pane[data-activity="day03"][data-journey="Debug"],
.lesson-pane[data-activity="day03"][data-journey="Defend"] { --journey-accent: var(--green-700); --journey-soft: var(--green-50); }

.day03-content-blocks { margin-bottom: 0; }
.day03-principles {
  margin: var(--space-2) 0;
  padding: var(--space-5);
  border: 1px solid var(--ink-200);
  border-left: 5px solid var(--journey-accent);
  border-radius: var(--radius-lg);
  background: var(--paper);
}
.day03-principles .eyebrow { color: var(--journey-accent); }
.day03-principles ol { display: grid; gap: var(--space-3); margin: var(--space-4) 0 0; padding-left: 1.4rem; }
.day03-principles li { padding-left: var(--space-2); color: var(--ink-800); font-weight: 700; }

.day03-record-stack { display: grid; gap: var(--space-6); }
.day03-activity { margin-top: var(--section-gap); }
.day03-term-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-5); }
.day03-term-chips span { padding: .42rem .7rem; border: 1px solid var(--blue-100); border-radius: var(--radius-pill); color: var(--blue-800); background: var(--blue-50); font: 700 var(--text-sm)/1.2 var(--font-mono); }

.day03-field-flow { display: grid; gap: var(--space-4); margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--ink-200); }
.day03-field-flow > header { display: grid; grid-template-columns: auto minmax(150px, 1fr); align-items: end; gap: var(--space-5); }
.day03-field-flow > header > div { display: grid; gap: 3px; }
.day03-field-flow > header span { color: var(--blue-800); font: 700 var(--text-xs)/1.2 var(--font-mono); letter-spacing: .04em; text-transform: uppercase; }
.day03-field-flow > header strong { color: var(--ink-700); font-size: var(--text-sm); }
.day03-field-flow__steps { min-height: 210px; }
.day03-field-flow__steps > section { min-height: 210px; display: grid; align-content: start; padding: var(--space-5); border: 1px solid var(--ink-200); border-left: 5px solid var(--journey-accent); border-radius: var(--radius-lg); background: var(--paper); }
.day03-field-flow__steps > section[hidden] { display: none; }
.day03-field-flow__steps .field > span { margin-bottom: var(--space-2); color: var(--ink-900); font: 700 var(--text-lg)/1.25 var(--font-display); }
.day03-field-flow__steps textarea { min-height: 124px; }
.day03-field-flow__steps select { min-height: var(--control-min); }
.day03-field-flow__actions { display: flex; justify-content: space-between; }
.day03-activity-actions { align-items: center; justify-content: space-between; }

.day03-sort { display: grid; gap: var(--space-5); margin-top: var(--space-5); }
.day03-sort__bank { padding: var(--space-4); border: 1px solid var(--ink-200); border-radius: var(--radius-lg); background: var(--ink-50); }
.day03-sort__bank header { display: grid; gap: 3px; margin-bottom: var(--space-3); }
.day03-sort__bank header small, .day03-sort-zone header small { color: var(--ink-600); }
.day03-sort__bank [data-sort-container] { min-height: 110px; display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: var(--space-2); }
.day03-sort__zones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
.day03-sort-zone { min-width: 0; border: 1px solid var(--ink-200); border-top: 4px solid var(--journey-accent); border-radius: var(--radius-lg); background: var(--paper); }
.day03-sort-zone > header { min-height: 74px; display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-2); padding: var(--space-3); border-bottom: 1px solid var(--ink-100); }
.day03-sort-zone > header div { display: grid; gap: 3px; }
.day03-sort-zone > header button { min-height: 32px; padding: .3rem .55rem; border: 1px solid var(--ink-200); border-radius: var(--radius-md); color: var(--blue-800); background: var(--paper); font-size: var(--text-xs); font-weight: 700; cursor: pointer; }
.day03-sort-zone > header button:disabled { opacity: .35; cursor: default; }
.day03-sort-zone [data-sort-container] { min-height: 128px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: var(--space-2); padding: var(--space-3); }
.day03-drag-card { position: relative; min-height: 94px; display: grid; align-content: start; gap: var(--space-1); padding: var(--space-4) var(--space-3) var(--space-3); border: 1px solid var(--ink-200); border-left: 4px solid var(--blue-700); border-radius: var(--radius-md); color: var(--ink-800); background: var(--paper); text-align: left; cursor: grab; box-shadow: var(--shadow-sm); }
.day03-drag-card:hover, .day03-drag-card[aria-pressed="true"] { border-color: var(--blue-700); background: var(--blue-50); }
.day03-drag-card:active { cursor: grabbing; }
.day03-drag-card b { color: var(--ink-950); font-size: var(--text-sm); }
.day03-drag-card > span:last-child { color: var(--ink-600); font-size: var(--text-xs); line-height: 1.4; }
.day03-drag-card .drag-handle { position: absolute; top: 5px; right: 7px; color: var(--ink-400); font-size: .8rem; }
.day03-sort em { align-self: center; justify-self: center; color: var(--ink-500); font-size: var(--text-sm); font-style: normal; text-align: center; }
.day03-sort__selection { position: sticky; z-index: 4; bottom: var(--space-4); display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--blue-700); border-left: 5px solid var(--blue-700); border-radius: var(--radius-lg); background: rgb(255 255 255 / .97); box-shadow: var(--shadow-md); }
.day03-sort__selection > span { color: var(--blue-800); font: 700 var(--text-xs)/1.2 var(--font-mono); text-transform: uppercase; }
.day03-sort__selection button { min-height: var(--control-min); padding: .5rem .7rem; border: 1px solid var(--ink-200); border-radius: var(--radius-md); background: var(--paper); cursor: pointer; }
.is-sortable-ghost { opacity: .3; }
.is-sortable-chosen { border-color: var(--blue-700); }
.is-sortable-dragging { box-shadow: var(--shadow-md); }

.day03-reveal { padding: var(--space-5); border-left: 5px solid var(--blue-700); background: var(--blue-50); }
.day03-reveal > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-3); }
.day03-reveal p:not(.eyebrow) { display: grid; gap: 2px; margin: 0; padding: var(--space-3); border: 1px solid var(--ink-200); background: var(--paper); }
.day03-reveal p.is-match { border-left: 4px solid var(--green-700); }
.day03-reveal p.is-different { border-left: 4px solid var(--amber-700); }
.day03-reveal span { color: var(--ink-600); font-size: var(--text-xs); }

.day03-sequence { margin-top: var(--space-5); }
.day03-sequence > header { display: grid; gap: 3px; margin-bottom: var(--space-3); }
.day03-sequence > header small { color: var(--ink-600); }
.day03-sequence ol { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.day03-sequence li { min-height: 72px; display: grid; grid-template-columns: 30px 34px minmax(0, 1fr); align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--ink-200); border-left: 4px solid var(--blue-700); border-radius: var(--radius-md); background: var(--paper); cursor: grab; }
.day03-sequence li:active { cursor: grabbing; }
.day03-sequence .drag-handle { color: var(--ink-400); }
.day03-sequence li > i { color: var(--blue-800); font: 700 var(--text-sm)/1 var(--font-mono); font-style: normal; }
.day03-sequence li p { display: grid; gap: 2px; margin: 0; }
.day03-sequence li p span { color: var(--ink-600); font-size: var(--text-sm); }

.day03-code-lab { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(240px, .75fr); margin-top: var(--space-5); overflow: hidden; border: 1px solid var(--ink-300); border-radius: var(--radius-lg); background: var(--ink-950); }
.day03-code-lab__editor { min-width: 0; border-right: 1px solid rgb(255 255 255 / .12); }
.day03-code-lab__editor header, .day03-console header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3); color: var(--ink-200); background: rgb(255 255 255 / .06); font: 700 var(--text-xs)/1.2 var(--font-mono); }
.day03-code-lab__editor pre { margin: 0; padding: var(--space-5); overflow: auto; color: #dceaff; font: 600 var(--text-sm)/1.65 var(--font-mono); white-space: pre; }
.day03-code-lab__controls { display: grid; align-content: start; gap: var(--space-4); padding: var(--space-4); color: var(--paper); }
.day03-code-lab__controls fieldset { display: grid; gap: var(--space-2); margin: 0; padding: 0; border: 0; }
.day03-code-lab__controls legend { margin-bottom: var(--space-2); color: var(--blue-100); font-weight: 700; }
.day03-code-lab__controls label { min-height: 40px; display: flex; align-items: center; gap: var(--space-2); color: var(--ink-200); }
.day03-code-lab__controls input { width: 19px; height: 19px; accent-color: var(--green-700); }
.day03-code-lab__controls > div { display: grid; gap: var(--space-2); }
.day03-console { grid-column: 1 / -1; border-top: 1px solid rgb(255 255 255 / .12); }
.day03-console header i { color: var(--green-100); font-style: normal; }
.day03-console pre { min-height: 130px; margin: 0; padding: var(--space-4); overflow: auto; color: #bcebdc; font: 600 var(--text-sm)/1.6 var(--font-mono); white-space: pre-wrap; }

.day03-debug-lab { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-3); margin-top: var(--space-5); }
.day03-debug-lab > section:first-child { padding: var(--space-4); border: 1px solid var(--ink-200); border-left: 5px solid var(--red-700); background: var(--paper); }
.day03-debug-lab ol { display: grid; gap: var(--space-2); margin: var(--space-3) 0 0; padding: 0; list-style: none; }
.day03-debug-lab li { display: flex; justify-content: space-between; gap: var(--space-3); padding: var(--space-2); color: var(--ink-700); background: var(--ink-50); font-family: var(--font-mono); font-size: var(--text-xs); }
.day03-debug-lab li.is-failure { color: var(--red-800); background: var(--red-50); }
.day03-debug-lab > button { align-self: end; }
.day03-debug-lab .day03-console { grid-column: 1 / -1; color: var(--paper); background: var(--ink-950); }

.day03-comparison { margin-top: var(--space-5); overflow-x: auto; border: 1px solid var(--ink-200); }
.day03-comparison table { width: 100%; border-collapse: collapse; min-width: 640px; }
.day03-comparison th, .day03-comparison td { padding: var(--space-3); border-bottom: 1px solid var(--ink-200); text-align: left; }
.day03-comparison thead th { color: var(--paper); background: var(--ink-950); font-size: var(--text-sm); }
.day03-comparison tbody th { color: var(--ink-900); background: var(--ink-50); }
.day03-comparison td { color: var(--ink-600); font-size: var(--text-sm); }

.day03-evidence-thread { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: var(--space-4); margin-top: var(--space-8); padding: var(--space-4); border: 1px solid var(--amber-100); border-left: 5px solid var(--amber-700); background: var(--amber-50); }
.day03-evidence-thread.is-done { border-color: var(--green-100); border-left-color: var(--green-700); background: var(--green-50); }
.day03-evidence-thread__mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--amber-800); background: var(--amber-100); font-weight: 800; }
.day03-evidence-thread.is-done .day03-evidence-thread__mark { color: var(--green-800); background: var(--green-100); }
.day03-evidence-thread h3 { margin: var(--space-1) 0; font: 700 var(--text-lg)/1.25 var(--font-display); }
.day03-evidence-thread p:last-child { margin: 0; color: var(--ink-700); }

.day03-completion-contract { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--space-6) 0; border: 1px solid var(--ink-200); background: var(--paper); }
.day03-completion-contract > div { min-height: 82px; display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: var(--space-3); padding: var(--space-3); border-right: 1px solid var(--ink-200); }
.day03-completion-contract > div:last-child { border-right: 0; }
.day03-completion-contract span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--ink-600); background: var(--ink-100); font: 700 var(--text-xs)/1 var(--font-mono); }
.day03-completion-contract .is-done span { color: var(--green-800); background: var(--green-100); }
.day03-completion-contract p { display: grid; gap: 2px; margin: 0; }
.day03-completion-contract small { color: var(--ink-600); }

.day03-required-chip { color: var(--amber-800); background: var(--amber-100); }
.day03-gate-card { overflow: hidden; border: 1px solid var(--ink-200); border-top: 5px solid var(--amber-700); background: var(--paper); }
.day03-gate-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-5); padding: var(--space-5); border-bottom: 1px solid var(--ink-200); }
.day03-gate-card h2 { margin: var(--space-1) 0; font: 700 var(--text-2xl)/1.15 var(--font-display); }
.day03-gate-card header p:last-child { max-width: 620px; margin: 0; color: var(--ink-600); }
.day03-gate-state { flex: 0 0 auto; padding: .45rem .7rem; color: var(--amber-800); background: var(--amber-50); font: 700 var(--text-xs)/1.2 var(--font-mono); }
.day03-gate-sources { display: grid; margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--ink-200); }
.day03-gate-sources li { min-height: 62px; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--ink-100); }
.day03-gate-sources li:last-child { border-bottom: 0; }
.day03-gate-sources li > span { color: var(--ink-500); }
.day03-gate-sources li.is-done > span { color: var(--green-700); }
.day03-gate-sources p { display: grid; gap: 2px; margin: 0; }
.day03-gate-sources small { color: var(--ink-600); }
.day03-gate-sources button { min-height: 38px; border: 0; color: var(--blue-700); background: transparent; font-weight: 700; cursor: pointer; }
.day03-gate-card form { display: grid; gap: var(--space-4); padding: var(--space-5); }
.day03-gate-card textarea { min-height: 110px; }
.day03-gate-card fieldset, .day03-acknowledgements { display: grid; gap: var(--space-2); padding: var(--space-4); border: 1px solid var(--ink-200); background: var(--ink-50); }
.day03-gate-card legend, .day03-acknowledgements legend { padding: 0 var(--space-2); color: var(--ink-900); font-weight: 700; }
.day03-gate-card fieldset label, .day03-acknowledgements label { min-height: 42px; display: flex; align-items: flex-start; gap: var(--space-3); color: var(--ink-700); }
.day03-gate-card fieldset input, .day03-acknowledgements input { width: 20px; height: 20px; flex: 0 0 20px; accent-color: var(--green-700); }

.day03-prerequisite { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--space-4); margin: var(--space-5) 0; padding: var(--space-4); border-left: 5px solid var(--amber-700); background: var(--amber-50); }
.day03-prerequisite > span { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--amber-700); border-radius: 50%; }
.day03-prerequisite p { margin: var(--space-1) 0 var(--space-3); }
.day03-assignment-card { border-top-color: var(--ink-950); }
.day03-assignment-card .assignment-form textarea { min-height: 118px; }
.day03-evidence-board { position: sticky; top: calc(var(--header-h) + var(--space-4)); overflow: hidden; border: 1px solid var(--ink-300); border-radius: var(--radius-xl); background: var(--paper); box-shadow: var(--shadow-md); }
.day03-evidence-board > header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4); color: var(--paper); background: var(--ink-950); }
.day03-evidence-board > header small { color: var(--ink-300); font: 700 var(--text-xs)/1.2 var(--font-mono); }
.day03-evidence-board > header strong { color: var(--green-100); font: 800 var(--text-xl)/1 var(--font-mono); }
.day03-evidence-board > div { padding: var(--space-4); }
.day03-evidence-board h3 { margin: var(--space-2) 0 var(--space-4); color: var(--ink-950); font: 800 var(--text-xl)/1.2 var(--font-display); overflow-wrap: anywhere; }
.day03-evidence-board ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ink-200); }
.day03-evidence-board li { min-height: 58px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: var(--space-2); border-bottom: 1px solid var(--ink-200); color: var(--ink-500); }
.day03-evidence-board li.is-covered { color: var(--green-800); }
.day03-evidence-board li p { display: grid; gap: 2px; margin: 0; }
.day03-evidence-board li small { color: inherit; }
.day03-evidence-board__rule { margin: var(--space-4) 0 0; color: var(--ink-600); font-size: var(--text-xs); }

@media (max-width: 900px) {
  .day03-sort__bank [data-sort-container] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .day03-code-lab { grid-template-columns: 1fr; }
  .day03-code-lab__editor { border-right: 0; border-bottom: 1px solid rgb(255 255 255 / .12); }
  .day03-evidence-board { position: static; }
}

@media (max-width: 760px) {
  .day03-field-flow > header, .day03-sort__zones, .day03-reveal > div, .day03-completion-contract { grid-template-columns: 1fr; }
  .day03-field-flow__steps, .day03-field-flow__steps > section { min-height: 190px; }
  .day03-sort__bank [data-sort-container], .day03-sort-zone [data-sort-container] { grid-template-columns: 1fr; }
  .day03-drag-card { min-height: 82px; }
  .day03-sort__selection { grid-template-columns: minmax(0, 1fr) auto; }
  .day03-sort__selection > span, .day03-sort__selection > b { grid-column: 1; }
  .day03-debug-lab { grid-template-columns: 1fr; }
  .day03-debug-lab li { display: grid; }
  .day03-completion-contract > div { border-right: 0; border-bottom: 1px solid var(--ink-200); }
  .day03-completion-contract > div:last-child { border-bottom: 0; }
  .day03-gate-card > header { display: grid; }
  .day03-gate-sources li { grid-template-columns: 28px minmax(0, 1fr); }
  .day03-gate-sources button { grid-column: 2; justify-self: start; }
  .day03-prerequisite { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .day03-drag-card { transition: none; }
}