.lab-intro {max-width: 54rem; margin-bottom: 1.5rem;}
.lab-banner {border-left: 4px solid var(--blue, #2854d7); padding: .8rem 1rem; background: var(--soft, #eaf0fb);}
.source-chain {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; margin: 1.5rem 0;}
.source-chain article {padding: 1rem; border: 1px solid var(--line, #d7e1eb); border-radius: .75rem; background: white; min-width: 0;}
.source-chain h2 {font-size: 1.1rem; margin: .25rem 0 .65rem;}
.source-chain p {font-size: .94rem; margin: .5rem 0;}
.step-label, .task-id {color: var(--blue, #2854d7); font: 600 .85rem ui-monospace, monospace;}
.board-toolbar {display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; margin: 1rem 0;}
.file-label {display: flex; flex-direction: column; gap: .3rem; font-size: .92rem; max-width: 100%;}
.file-label input {max-width: 100%;}
.board-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem;}
.board-column {background: var(--soft, #eaf0fb); padding: 1rem; border-radius: 1rem; min-width: 0;}
.board-column h2 {display: flex; justify-content: space-between; align-items: center; font-size: 1.25rem; margin: 0 0 1rem;}
.board-column h2 span {padding: .2rem .6rem; background: white; border-radius: .4rem; font-size: 1rem;}
.task-card {padding: 1rem; background: white; border: 1px solid var(--line, #d7e1eb); border-radius: .75rem; margin-bottom: .8rem; overflow-wrap: anywhere;}
.task-card h3 {font-size: 1.1rem; line-height: 1.35; margin: .3rem 0 .8rem;}
.task-card p {font-size: .9rem; margin: .35rem 0;}
.task-card label {display: block; margin-top: 1rem; font-size: .85rem;}
.task-card select {width: 100%; font: inherit; padding: .55rem; border: 1px solid var(--line, #d7e1eb); border-radius: .5rem; background: white; color: var(--ink, #10263f);}
.unknown {background: var(--gold, #f1ce72); padding: .2rem .4rem; border-radius: .2rem;}
.empty {color: var(--muted, #53657a); font-size: .9rem;}
#board-message {padding: .7rem 0; min-height: 2.6rem;}
#board-message[data-state="error"] {color: var(--color-danger, #a52d3c);}
.readback-block {margin-top: 1.5rem;}
.readback-block pre {white-space: pre-wrap; overflow-wrap: anywhere; font-size: .8rem;}
.checks {margin-top: 1.5rem; max-width: 55rem;}
:is(button, a, select, input):focus-visible {outline: 3px solid var(--blue, #2854d7); outline-offset: 3px;}
@media (max-width: 760px) {.source-chain {grid-template-columns: repeat(2, minmax(0, 1fr));}.board-grid {grid-template-columns: 1fr;}}
@media (max-width: 420px) {.source-chain {grid-template-columns: 1fr;}.board-toolbar {align-items: stretch;}.board-toolbar button {width: 100%;}}
@media print {.board-toolbar, .navigation {display: none;}.source-chain, .board-grid {display: block;}.source-chain article, .board-column, .task-card {break-inside: avoid;}.board-column {margin-top: .8rem;}.readback-block details {display: block;}.readback-block pre {font-size: 8pt;}.task-card select {border: none;appearance: none;}body {background: white;}}
