.phase-game{padding-top:65px}.phase-shell{border:1px solid #b6bca0;border-radius:16px;overflow:hidden;background:#f5f5e7}.phase-steps{display:flex;list-style:none;padding:0;margin:0;border-bottom:1px solid #b6bca0}.phase-steps li{flex:1;padding:18px 12px;text-align:center;font-size:13px;color:#646852}.phase-steps [aria-current]{background:var(--purple);color:white;font-weight:700}.phase-layout{display:grid;grid-template-columns:1fr 1.2fr}.phase-controls{padding:30px;min-width:0}.phase-controls h3{font-size:23px}.phase-controls p{font-size:13px}.phase-controls label,.phase-display label{display:flex;justify-content:space-between;gap:12px;font-size:13px;font-weight:600}.phase-controls output,.phase-display output{font-variant-numeric:tabular-nums}.phase-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.phase-choices button{padding:12px;border:1px solid #b6bca0;border-radius:8px;background:var(--paper);cursor:pointer;color:var(--ink)}.phase-choices [aria-pressed=true]{background:var(--purple);color:white;border-color:var(--purple)}.phase-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.phase-actions button{cursor:pointer;border:1px solid var(--purple)}.phase-game [hidden]{display:none!important}#phase-feedback{background:#e7eccd;border-left:3px solid var(--purple);padding:14px;min-height:80px;color:#41492c}#phase-answer{width:100%;padding:12px;margin-top:15px;background:var(--paper);color:var(--ink);border:1px solid #b6bca0;border-radius:6px;font:inherit}#phase-answer:focus-visible,.phase-model summary:focus-visible{outline:3px solid #9b6fff;outline-offset:4px}.phase-display{background:var(--paper);padding:25px;border-left:1px solid #b6bca0;min-width:0}.phase-display-head,.phase-chart-title{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:13px}.phase-display-head span,.phase-chart-title span{font-size:10px;color:#63694b}.phase-display svg{display:block;width:100%;height:auto}#phase-generator{max-width:320px;margin:auto}.phase-display input{margin-bottom:0}.phase-caption{font-size:11px;line-height:1.7;color:#63694b}.phase-chart-title{margin-top:18px;font-weight:600}.phase-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}.phase-metrics div{padding:12px;background:#f0f2dc;border-radius:8px;font-size:10px}.phase-metrics strong{display:block;font-size:20px;color:var(--purple);margin-top:6px}.phase-model{padding:20px 30px;border-top:1px solid #b6bca0;font-size:12px}.phase-model summary{cursor:pointer;font-weight:600}.phase-model p{font-size:12px}#phase-complete{border:1px solid #a2af4e;border-radius:8px;padding:15px;background:#f0f2dc}#phase-complete h3{font-size:18px}@media(max-width:900px){.phase-controls,.phase-display{padding:20px}.phase-layout{grid-template-columns:1fr 1fr}}@media(max-width:650px){.phase-layout{grid-template-columns:1fr}.phase-display{border-left:0;border-top:1px solid #b6bca0}.phase-steps li{padding:14px 5px;font-size:11px}.phase-model{padding:18px}.phase-controls h3{font-size:21px}.phase-metrics strong{font-size:18px}}
/* Shared layout for standalone learning games. */
header{border-bottom:1px solid #d9ddb7}.section{padding-top:40px}h1{font-size:clamp(32px,5vw,48px);letter-spacing:-1px;margin:15px 0}.more-games{max-width:1210px;margin:0 auto 50px;padding:25px;display:flex;flex-wrap:wrap;align-items:center;gap:22px;border-top:1px solid #d9ddb7}.more-games p{margin-right:auto}.game-lead{font-size:17px}select{font:inherit;max-width:100%}select:focus-visible,summary:focus-visible{outline:3px solid #9b6fff;outline-offset:4px}.cable-progress{display:flex;list-style:none;padding:0;margin:30px 0 0;border:1px solid #b6bca0;border-radius:12px 12px 0 0;overflow:hidden}.cable-progress li{flex:1;text-align:center;padding:18px 8px;font-size:13px;background:#f0f2dc}.cable-progress [aria-current]{background:var(--purple);color:white}.cable-workbench{display:grid;grid-template-columns:1fr 1fr;border:1px solid #b6bca0;border-top:0;border-radius:0 0 12px 12px;overflow:hidden}.cable-task,.cable-results{padding:28px;min-width:0}.cable-task{background:#f5f5e7}.cable-results{background:var(--paper);border-left:1px solid #b6bca0}.cable-task h2{font-size:25px}.cable-task p,.cable-results p{font-size:13px}.cable-task fieldset{border:0;padding:0;margin:20px 0}.cable-task legend{font-size:13px;font-weight:700;margin-bottom:10px}.cable-task label{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;font-weight:600}.cable-task #cable-prediction label{justify-content:flex-start;padding:12px 0}.cable-task input[type=radio]{accent-color:var(--purple);width:20px;height:20px;flex-shrink:0}.cable-task button{cursor:pointer}.cable-task select{width:100%;padding:12px 8px;border:1px solid #b6bca0;border-radius:6px;background:var(--paper);color:var(--ink);font-size:13px;margin-top:8px}.cable-task input[type=range]{margin:18px 0 4px;min-height:24px}.range-labels{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:#626a44;margin:0 0 22px}.cable-task .reset{font-size:12px;margin:12px 0 20px}.cable-results svg{display:block;width:100%;max-width:320px;margin:auto}.cable-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}.cable-metrics>div{padding:12px;background:#f0f2dc;border-radius:8px;font-size:11px}.cable-metrics strong{display:block;font-size:18px;margin-top:8px;font-variant-numeric:tabular-nums;color:var(--purple)}.cable-game .control-note{font-size:11px;line-height:1.8;color:#626a44}#cable-feedback{border-left:3px solid var(--purple);padding:14px;background:#e7eccd;min-height:75px}#cable-observation{padding:15px;background:#f0f2dc;border-radius:8px}.cable-table{width:100%;border-collapse:collapse;font-size:13px;margin:20px 0}.cable-table caption{text-align:left;padding-bottom:15px;font-size:11px;color:#626a44}.cable-table th,.cable-table td{text-align:left;padding:14px 6px;border-bottom:1px solid #b6bca0}.cable-table td{font-variant-numeric:tabular-nums}#cable-resistance-result .cable-metrics{grid-template-columns:1fr}#cable-complete{padding:16px;border:1px solid #b6bca0;border-radius:8px}.cable-game [hidden]{display:none!important}.cable-game .phase-model{margin-top:24px;background:#f5f5e7;border:1px solid #b6bca0;border-radius:8px}.cable-game .text-link{line-height:2}@media(max-width:900px){.cable-task,.cable-results{padding:20px}.cable-metrics{gap:6px}.cable-metrics>div{padding:10px 7px}.cable-metrics strong{font-size:16px}}@media(max-width:650px){.cable-workbench{grid-template-columns:1fr}.cable-results{border-left:0;border-top:1px solid #b6bca0}.cable-progress li{font-size:11px;padding:14px 5px}.cable-task h2{font-size:23px}.cable-table{font-size:12px}.more-games{margin-bottom:25px}.phase-display-head{flex-wrap:wrap}}
.result-placeholder{text-align:center;padding:65px 10px}.result-placeholder>span{font-size:100px;font-weight:900;color:var(--purple)}
.mobile-result{display:none}@media(max-width:650px){.mobile-result{display:block;padding:12px;border-radius:6px;background:#e7eccd;color:#41492c;font-size:12px;line-height:1.8}}
/* Optional Three.js scene; HTML controls remain the keyboard interface. */
.phase-3d{width:100%;height:300px;background:radial-gradient(ellipse at center,#f0f2dc,transparent 72%);border-radius:12px;margin:12px 0}.phase-3d canvas{display:block;width:100%;height:100%}.phase-view-controls{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.phase-view-controls button{min-height:44px;padding:8px 12px;border:1px solid #b6bca0;border-radius:8px;background:var(--paper);color:var(--ink);font:inherit;font-size:12px;cursor:pointer}.phase-view-controls [aria-pressed=true]{background:var(--purple);color:white}.phase-view-controls button:focus-visible{outline:3px solid #9b6fff;outline-offset:3px}@media(max-width:650px){.phase-3d{height:260px}}
/* Repair shift: the machine is the play surface, the console is its tool kit. */
.repair-game .section-head{align-items:center}.repair-game h1{font-size:clamp(28px,4vw,44px)}.repair-hud{display:flex;gap:24px;flex-wrap:wrap;padding:16px 22px;background:#303725;color:#f4f5dd;border-radius:14px 14px 0 0;font-size:13px}.repair-hud>span:first-child{margin-right:auto;color:#d0ed72;font-weight:700}.repair-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);border:1px solid #b6bca0;border-radius:0 0 14px 14px;overflow:hidden}.repair-machine{min-width:0;padding:24px;background:#f0f2e0}.repair-machine-head{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:#526018}.repair-machine-head>span:last-child{font-size:10px;letter-spacing:2px;color:#767d63}.repair-stage{position:relative;height:420px;isolation:isolate}.repair-game .phase-3d{position:absolute;inset:0;margin:0;height:100%;width:100%;background:radial-gradient(ellipse,#dce5b3,transparent 70%)}.repair-game #phase-generator{width:100%;height:100%;max-width:none;margin:0}.repair-handles{position:absolute;inset:0;pointer-events:none}.repair-handles button{position:absolute;transform:translate(-50%,-50%);width:54px;height:54px;border:2px solid #a34632;background:#fffdeaeb;color:#803621;border-radius:50%;font-family:inherit;cursor:grab;pointer-events:auto;touch-action:none;user-select:none;box-shadow:0 3px 10px #30372525;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:17px;font-weight:800}.repair-handles button span{font-size:9px;font-weight:400}.repair-handles button[data-coil="0"]{border-color:#526018;color:#526018;cursor:default}.repair-handles button[data-coil="2"]{border-color:#326785;color:#326785}.repair-handles button:active{cursor:grabbing}.repair-handles button:focus-visible{outline:3px solid #526018;outline-offset:5px}.repair-stage[data-mode="testing"] .repair-handles button{cursor:wait}.repair-stage[data-mode="complete"]{background:radial-gradient(ellipse,#d0ed7266,transparent 65%)}.repair-console{min-width:0;padding:28px;background:#fffef2;border-left:1px solid #b6bca0}.repair-console h2{font-size:25px;line-height:1.4;margin:12px 0}.repair-console p{font-size:13px;line-height:1.8}.repair-gauges{display:grid;grid-template-columns:1fr 1fr;gap:10px}.repair-gauges>div{padding:13px;background:#f0f2dc;border-radius:9px}.repair-gauges span{display:block;font-size:12px}.repair-gauges small{display:block;color:#63694b;font-size:10px;margin-top:4px}.repair-gauges strong{display:block;font-size:25px;color:#526018;margin:7px 0;font-variant-numeric:tabular-nums}.repair-gauges meter{display:block;width:100%;height:8px}.repair-observation{padding:10px 12px;background:#f4e7d9;border-radius:7px;min-height:60px}.repair-observation.ready{background:#e7eccd}.repair-console fieldset{border:0;padding:0;margin:18px 0}.repair-console legend{font-size:12px;font-weight:700;margin-bottom:14px}.repair-console label{display:flex;justify-content:space-between;font-size:12px}.repair-console input[type=range]{width:100%;margin:12px 0 20px;min-height:24px}.repair-run{width:100%;justify-content:center;cursor:pointer;border:0;min-height:50px}.repair-game button:disabled{opacity:.55;cursor:default}.repair-secondary{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.repair-secondary button{font-size:11px;min-height:44px;margin:0}.repair-test{margin-top:20px;padding:16px;background:#e4e9cc;border-radius:9px}.repair-test>div{display:flex;justify-content:space-between;font-size:12px;margin-bottom:9px}.repair-test progress{width:100%;height:12px;accent-color:#526018}.repair-stars{font-size:32px;letter-spacing:6px;color:#657517}.repair-game #phase-complete{margin-top:18px}.repair-game #phase-complete .button{font-size:13px;cursor:pointer}.repair-instruments{margin-top:24px;padding:22px;border:1px solid #b6bca0;border-radius:12px;font-size:12px}.repair-instruments summary{cursor:pointer;font-weight:700}.repair-instruments p{font-size:12px;line-height:1.8}.repair-charts{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:20px}.repair-charts svg{width:100%;height:auto}.repair-charts h3{font-size:16px}.repair-game #phase-feedback{min-height:0}.repair-game .phase-view-controls{justify-content:center}.repair-game .phase-caption{text-align:center;font-size:11px}.repair-game #phase-hint-text{text-align:left}
@media(max-width:900px){.repair-layout{grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr)}.repair-machine,.repair-console{padding:18px}.repair-stage{height:360px}.repair-hud{gap:14px}}
@media(max-width:650px){.repair-layout{grid-template-columns:1fr}.repair-console{border-left:0;border-top:1px solid #b6bca0}.repair-stage{height:320px}.repair-machine{padding:16px}.repair-charts{grid-template-columns:1fr}.repair-hud{font-size:11px;padding:14px}.repair-console h2{font-size:23px}.repair-handles button{width:48px;height:48px}.repair-machine-head>span:last-child{letter-spacing:0}}

.repair-live{display:flex;justify-content:center;gap:24px;font-size:11px;color:#63694b;margin:18px 0 0}.repair-live strong{font-size:15px;color:#526018;font-variant-numeric:tabular-nums;margin-left:5px}
