*{box-sizing:border-box}body{margin:0;background:#f6f4ed;color:#234039;font:16px/1.6 system-ui,sans-serif}header,main{max-width:1180px;margin:auto;padding:24px 30px}header{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #d9e0d2}a{color:#285f4c}.brand{text-decoration:none;font-size:23px}h1{font-size:clamp(32px,4.5vw,53px);line-height:1.12;letter-spacing:-1.8px;margin:12px 0 22px}h1 em{font-family:Georgia,serif;font-weight:400;color:#92562c}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;color:#58775d}button,input,select{font:inherit}button{border:0;border-radius:10px;background:#285f4c;color:#fff;padding:12px 17px;cursor:pointer;font-weight:650}button:disabled{opacity:.5;cursor:default}button:hover:not(:disabled){filter:brightness(.95)}.quiet{background:#e9eee1;color:#285f4c}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #b76928;outline-offset:3px}select{padding:9px;border:1px solid #b7c7b3;border-radius:8px;background:#fffefa;color:#234039}.choose{margin:28px 0}.choose>label{font-weight:650;margin-right:12px}#letter-picker,#print-letter-picker{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}#letter-picker button{min-width:40px;background:#fffefa;border:1px solid #d9e0d2;color:#285f4c;font-size:19px;padding:7px 11px}#letter-picker [aria-pressed=true]{background:#285f4c;color:white}.panel,.print-centre{background:#fffefa;border:1px solid #d9e0d2;border-radius:24px;padding:26px;margin:24px 0}.mentor{display:flex;align-items:center;gap:10px;background:#edf1e5;border-radius:16px;padding:10px 18px 10px 0}.steam{width:84px;height:84px;flex:none;background:url('assets/begeleiders.webp') 100% 100%/400% 200% no-repeat}.mentor p{margin:5px 0;font-size:14px}.mentor b{font-size:13px;color:#285f4c}.phases,.controls,.next-row,.legend{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:18px 0}.phases button{background:#edf1e5;color:#526b58;font-size:13px}.phases [aria-pressed=true]{background:#285f4c;color:white}.controls{font-size:13px}.controls button{font-size:13px;padding:10px 12px}.controls label{display:flex;align-items:center;gap:7px}#enlarge{margin-left:auto}.status{min-height:52px;background:#f3eddf;border-radius:10px;padding:11px 15px;margin:12px 0;font-size:15px;font-weight:600}.stage{position:relative;background:#fffdf7;border:1px solid #d8dfd1;border-radius:16px;overflow:hidden;height:clamp(330px,57vh,650px)}#formation-svg{width:100%;height:100%;display:block;touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair}#formation-svg path{stroke-linecap:round;stroke-linejoin:round;fill:none}.moving-steam{position:absolute;width:68px;height:68px;pointer-events:none;transform:translate(6px,-70px)}[hidden]{display:none!important}.legend{font-size:12px;color:#526b58;justify-content:space-between}.legend span{display:flex;align-items:center;gap:6px}.start-dot,.end-dot{width:12px;height:12px;display:inline-block;border-radius:50%;background:#25865a}.end-dot{background:#cf6b21}.next-row{justify-content:space-between}.small{font-size:12px;color:#607362}.print-centre fieldset{border:1px solid #d8dfd1;border-radius:12px}.print-centre label{display:flex;gap:5px;align-items:center;background:#eef2e6;padding:6px 12px;border-radius:7px;min-width:52px}.print-centre input{width:18px;height:18px;accent-color:#285f4c}.print-centre h2{font-size:26px;letter-spacing:-.6px}footer{font-size:12px;color:#607362;text-align:center;margin:35px 0}#formation-paper{display:none}#formation-panel:fullscreen,#formation-panel.expanded{border:0;border-radius:0;background:#fffefa;padding:12px 22px;overflow:auto;max-width:none;width:100%;height:100%}#formation-panel.expanded{position:fixed;inset:0;z-index:1000}#formation-panel:fullscreen .stage,#formation-panel.expanded .stage{height:calc(100dvh - 300px);min-height:260px}#formation-panel:fullscreen .mentor,#formation-panel.expanded .mentor{display:none}#formation-panel:fullscreen .phases,#formation-panel.expanded .phases{margin-top:0}#formation-panel:fullscreen .small,#formation-panel.expanded .small{display:none}
@media(max-width:650px){header,main{padding:18px 15px}header{flex-wrap:wrap;font-size:13px}.panel,.print-centre{padding:15px;border-radius:16px}.mentor{padding-right:12px}.mentor .steam{width:60px;height:60px}.mentor p{font-size:13px}.phases button{padding:10px 9px;font-size:11px}.controls{gap:7px}.controls button{font-size:12px;padding:9px}#enlarge{margin-left:0}.legend{justify-content:flex-start;gap:12px}.next-row button{font-size:12px;padding:10px}.choose>label{display:block;margin-bottom:8px}.stage{height:420px}.status{font-size:13px}.print-centre .controls{align-items:stretch}.moving-steam{width:52px;height:52px;transform:translate(4px,-54px)}}
@media print{@page{size:A4 portrait;margin:10mm}html,body{background:white;margin:0;padding:0;color:black}body>header,body>main{display:none!important}#formation-paper{display:block}.formation-page{width:190mm;height:276mm;overflow:hidden;break-after:page;page-break-after:always;font:10pt/1.4 system-ui,sans-serif}.formation-page:last-child{break-after:auto;page-break-after:auto}.formation-page h1{font:bold 17pt system-ui,sans-serif;letter-spacing:0;margin:0 0 2mm}.formation-page p{margin:1.5mm 0}.formation-page svg{display:block;width:190mm}.formation-page path{stroke-linecap:round;stroke-linejoin:round}.paper-large{height:64mm}.paper-row{height:24mm}.paper-label{font-size:9pt;font-weight:bold}.paper-source{font-size:8pt}.formation-page .print-instruction{min-height:13mm;font-size:9pt}}

/* Nieuwe taakgerichte STEAM-houdingen; alleen deze schrijfmodule. */
.steam{background:none;object-fit:contain}.mentor .steam{width:120px;height:120px;margin:0 8px}.moving-steam{width:106px;height:106px;transform:translate(-16%,-86%);object-fit:contain}#active-pen{pointer-events:none}@media(max-width:650px){.mentor .steam{width:82px;height:82px;margin:0 4px}.moving-steam{width:86px;height:86px;transform:translate(-16%,-86%)}}