:root{--teal:#02a0b0;--teal-dark:#007a88;--teal-pale:#eaf7f8;--ink:#172b30;--muted:#5a6c72;--line:#dce5e7;--paper:#f4f7f8;--white:#fff;--dark:#162427;--green:#27744d;--green-bg:#edf7f0;--amber:#855c16;--amber-bg:#fff6df;--radius:16px;--shadow:0 14px 40px #172b3009}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{ -webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}a{color:var(--teal-dark)}h1,h2,h3,p{margin:0}h1{font-size:clamp(1.8rem,3vw,2.65rem);line-height:1.18;letter-spacing:-.035em}h2{font-size:1.35rem;letter-spacing:-.02em;line-height:1.3}h3{font-size:1.05rem;line-height:1.35}p+p{margin-top:12px}small{font-size:.8125rem}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #02a0b080;outline-offset:3px}[hidden]{display:none!important}.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.skip{position:fixed;top:-100px;left:16px;z-index:99;background:white;padding:12px}.skip:focus{top:16px}
.top{background:var(--dark);color:#fff;min-height:104px;border-bottom:4px solid var(--teal)}.top-inner{max-width:1392px;margin:auto;padding:20px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:28px;min-width:0}.brand img{width:203px;height:60px;object-fit:contain;display:block}.brand-label{border-left:1px solid #ffffff30;padding-left:27px;line-height:1.35;color:#c9dbde;font-size:.875rem;letter-spacing:.02em}.brand-label strong{display:block;color:white;font-size:1.0625rem;font-weight:600}.header-actions{display:flex;gap:14px;align-items:center}.support-trigger{display:flex;gap:8px;align-items:center;border:1px solid #ffffff55;background:transparent;color:white;padding:10px 15px;border-radius:8px;white-space:nowrap}.support-trigger:hover{background:#ffffff12}.avatar{background:#cceff2;color:#145861;font-size:.875rem;font-weight:700;border-radius:50%;width:40px;height:40px;display:grid;place-items:center;flex:none}
.preview-strip{border-bottom:1px solid var(--line);background:white}.preview-inner{max-width:1392px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:12px 40px;gap:18px}.preview-copy{display:flex;align-items:center;gap:10px;font-size:.8125rem;color:var(--muted)}.demo-badge{font-weight:700;color:#41525c;background:#edf0f5;padding:4px 8px;border-radius:5px;font-size:.6875rem;letter-spacing:.08em;white-space:nowrap}.switcher{display:inline-flex;gap:3px;padding:3px;background:#edf2f3;border-radius:9px}.switcher button{border:0;padding:7px 15px;border-radius:6px;background:transparent;color:var(--muted);font-size:.875rem;font-weight:600}.switcher button[aria-pressed="true"]{color:var(--ink);background:white;box-shadow:0 1px 5px #172b3014}.preview-tools-btn{border:0;background:transparent;color:var(--teal-dark);padding:4px 0;font-size:.8125rem;font-weight:600}.strip-actions{display:flex;align-items:center;gap:18px}
.layout{max-width:1392px;margin:auto;display:grid;grid-template-columns:275px minmax(0,1fr);min-height:calc(100vh - 172px)}.rail{padding:36px 24px 32px 40px;border-right:1px solid var(--line);background:linear-gradient(180deg,#fff9,#fff0)}.rail-label,.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.rail-label{margin:0 0 18px 12px}.steps{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}.step-nav{width:100%;border:1px solid transparent;border-radius:10px;padding:15px 12px;display:flex;align-items:center;text-align:left;gap:13px;color:var(--ink);background:transparent}.step-nav:hover:not(:disabled){background:#fff}.step-nav.active{background:white;border-color:var(--line);box-shadow:0 4px 15px #172b3005}.step-nav.active .step-num{background:var(--teal-dark);color:white;border-color:var(--teal-dark)}.step-num{width:32px;height:32px;border:1px solid #cbd7da;display:grid;place-items:center;border-radius:50%;font-size:.875rem;flex:none;color:var(--muted)}.step-num.done{color:var(--green);background:var(--green-bg);border-color:#bfdccb}.step-num .icon{width:17px;height:17px}.step-copy strong{font-size:.9375rem;font-weight:600;display:block}.step-copy span{font-size:.8125rem;color:var(--muted);display:block;margin-top:2px}.rail-help{margin:44px 0 0 12px;padding-top:25px;border-top:1px solid var(--line)}.rail-help .icon{color:var(--teal-dark);margin-bottom:10px}.rail-help p{font-size:.875rem;color:var(--muted);margin:8px 0 14px}.text-button{border:0;padding:0;background:none;color:var(--teal-dark);font-size:.875rem;font-weight:650;text-align:left}.text-button:hover{text-decoration:underline}.rail-foot{font-size:.75rem;color:var(--muted);margin:32px 12px 0}
.main{padding:38px 40px 48px;min-width:0}.page-heading{display:flex;align-items:start;justify-content:space-between;gap:18px;margin-bottom:26px}.page-heading .eyebrow{margin-bottom:10px}.subtitle{color:var(--muted);font-size:1rem;margin-top:11px;max-width:570px}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:6px;padding:5px 9px;line-height:1.35;font-weight:600;font-size:.75rem;white-space:nowrap}.badge .icon{width:13px;height:13px}.badge.teal{background:var(--teal-pale);color:var(--teal-dark)}.badge.green{background:var(--green-bg);color:var(--green)}.badge.grey{background:#eef2f3;color:#66777c}.badge.amber{background:var(--amber-bg);color:var(--amber)}.sample-tag{color:var(--muted);font-size:.75rem;font-weight:400}
.overview-summary{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:21px 25px;display:flex;align-items:center;gap:24px;margin-bottom:24px}.summary-icon{width:48px;height:48px;border-radius:12px;background:var(--teal-pale);color:var(--teal-dark);display:grid;place-items:center;flex:none}.summary-copy{flex:1}.summary-copy strong{font-size:.9375rem}.summary-copy p{font-size:.875rem;color:var(--muted);margin-top:3px}.summary-progress{width:195px;flex:none}.summary-progress label{font-size:.8125rem;display:flex;justify-content:space-between;margin-bottom:8px;color:var(--muted)}progress{appearance:none;width:100%;height:7px;display:block;border:0;border-radius:8px;overflow:hidden;background:#e5edef}progress::-webkit-progress-bar{background:#e5edef;border-radius:8px}progress::-webkit-progress-value{background:var(--teal);border-radius:8px}progress::-moz-progress-bar{background:var(--teal);border-radius:8px}
.task-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.task-card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:25px;display:flex;flex-direction:column;min-height:245px;box-shadow:var(--shadow);position:relative;overflow:hidden}.task-card.current{border-color:#83cdd3}.task-card.current:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--teal)}.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px}.task-icon{width:38px;height:38px;color:var(--teal-dark);border-radius:10px;background:var(--teal-pale);display:grid;place-items:center}.task-card.locked .task-icon{background:#f0f3f4;color:#7e8d91}.task-card h2{font-size:1.2rem}.task-card p{color:var(--muted);font-size:.9375rem;margin:9px 0 22px}.card-action{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.btn{border:0;border-radius:8px;background:var(--teal-dark);color:white;padding:11px 16px;font-size:.9375rem;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:9px;text-decoration:none;min-height:44px;line-height:1.4}.btn:hover:not(:disabled){background:#00636e}.btn .icon{width:18px;height:18px}.btn.secondary{background:white;color:var(--ink);border:1px solid #cad7da}.btn.secondary:hover:not(:disabled){background:#f0f6f7}.btn.soft{background:var(--teal-pale);color:var(--teal-dark)}.btn.quiet{background:#eef3f4;color:var(--muted)}.lock-line{color:#708087;font-size:.875rem;display:flex;gap:7px;align-items:center;min-height:44px}.lock-line .icon{width:16px;height:16px}.subtle-note{font-size:.8125rem;color:var(--muted);margin-top:20px;display:flex;gap:8px;align-items:start}.subtle-note .icon{width:16px;height:16px;margin-top:2px}.assigned-strip{margin-top:28px;border-top:1px solid var(--line);padding-top:20px;display:flex;gap:15px;align-items:start}.assigned-strip>span{font-size:.8125rem;color:var(--muted);flex:none;padding-top:4px}.course-chip{display:inline-flex;border:1px solid var(--line);background:white;padding:5px 10px;border-radius:6px;font-size:.8125rem;margin:0 5px 6px 0}
.back{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;color:var(--muted);padding:0;margin-bottom:20px;font-size:.875rem}.back:hover{color:var(--teal-dark)}.back .icon{width:16px;height:16px}.notice{border-radius:9px;padding:13px 16px;background:var(--teal-pale);font-size:.875rem;color:#265b63;display:flex;align-items:start;gap:10px;margin-bottom:20px}.notice .icon{width:18px;height:18px;margin-top:2px}.notice.neutral{background:#ecf0f5;color:#4f5f73}.viewer-shell{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:white;box-shadow:var(--shadow)}.viewer-bar{padding:13px 17px;display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid var(--line)}.viewer-bar strong{font-size:.875rem}.viewer-bar a{font-size:.8125rem;display:flex;gap:6px;align-items:center;text-decoration:none}.viewer-bar a .icon{width:14px;height:14px}.viewer-shell iframe{display:block;border:0;width:100%;height:650px;background:white}.viewer-fallback{border-top:1px solid var(--line);padding:13px 17px;color:var(--muted);font-size:.8125rem}.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px}.muted{color:var(--muted)}.demo-completion{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px dashed #bfcad7;border-radius:10px;background:#f0f3f8;padding:16px 18px;margin-top:22px}.demo-completion p{font-size:.8125rem;color:#4f5f73;margin-top:3px}.demo-completion strong{font-size:.875rem;color:#334961}.demo-completion .btn{background:#3f536a;font-size:.875rem}.module-list{display:flex;flex-direction:column;gap:14px}.module{background:white;border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;gap:18px;align-items:center}.module-copy{flex:1;min-width:0}.module-copy h2,h1,.session-heading h2,.check-course strong{overflow-wrap:anywhere}.module-copy p{font-size:.875rem;color:var(--muted);margin-top:5px}.module-copy .badge{margin-top:10px}.module .task-icon{width:46px;height:46px}.course-empty{padding:70px 25px;text-align:center;min-height:320px}.course-empty h3{margin:12px 0 6px}.course-empty p{font-size:.9375rem;color:var(--muted);max-width:420px;margin:auto}.course-empty .icon{width:35px;height:35px;color:var(--teal-dark)}
.session-card{background:white;border:1px solid var(--line);border-radius:14px;margin-bottom:17px;overflow:hidden}.session-heading{padding:22px 24px;display:flex;gap:16px;align-items:center;border-bottom:1px solid var(--line)}.date-block{width:60px;border-radius:8px;text-align:center;background:var(--teal-pale);color:var(--teal-dark);padding:7px;flex:none}.date-block strong{display:block;font-size:1.55rem;line-height:1.2}.date-block span{font-size:.75rem;font-weight:700;text-transform:uppercase}.session-heading>div:nth-child(2){flex:1}.session-body{padding:22px 24px;display:grid;grid-template-columns:1fr 1fr;gap:18px}.detail{display:flex;gap:11px;align-items:start}.detail>.icon{margin-top:3px;color:var(--teal-dark);width:19px;height:19px}.detail small{display:block;color:var(--muted);margin-bottom:3px}.detail p{font-size:.9375rem}.session-actions{border-top:1px solid var(--line);padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:15px}.locked-session{padding:25px;color:var(--muted);display:flex;gap:12px;align-items:center;font-size:.9375rem}
.staff-main{max-width:1280px;padding:35px 40px 48px;margin:auto}.staff-columns{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr);gap:24px;align-items:start}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:22px}.panel-head{border-bottom:1px solid var(--line);padding:21px 24px}.panel-head p{font-size:.875rem;color:var(--muted);margin-top:6px}.panel-body{padding:24px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}.fields .field{margin-bottom:0}.field label,.field-label{font-size:.875rem;font-weight:600}.field input,.field select,.field textarea{border:1px solid #c8d6d9;border-radius:7px;padding:11px 12px;width:100%;color:var(--ink);background:white;min-height:45px}.field textarea{resize:vertical;min-height:100px}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--teal)}.field small{color:var(--muted)}.full{grid-column:1/-1}.section-divider{margin:25px 0;border:0;border-top:1px solid var(--line)}.check-course{display:flex;gap:13px;padding:17px;border:1px solid var(--line);border-radius:10px;margin-top:12px;align-items:start;cursor:pointer}.check-course:has(input:checked){border-color:#82cbd1;background:#f4fbfb}.check-course input{accent-color:var(--teal-dark);width:20px;height:20px;margin:3px 0 0;flex:none}.check-course span{flex:1}.check-course strong{font-size:.9375rem;display:block}.check-course small{font-size:.8125rem;display:block;color:var(--muted);margin-top:3px}.auto-assigned{display:flex;gap:10px;align-items:center;margin:18px 0;font-size:.875rem;color:var(--muted)}.auto-assigned .icon{width:18px;height:18px;color:var(--teal-dark)}.form-actions{border-top:1px solid var(--line);padding-top:22px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px}.form-actions small{color:var(--muted);max-width:250px}.status-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #ecf0f1;font-size:.875rem}.status-row:last-child{border-bottom:0}.student-summary{display:flex;gap:12px;align-items:center;margin-bottom:15px}.student-summary p{font-size:.8125rem;color:var(--muted);overflow-wrap:anywhere}.tiny{font-size:.8125rem;color:var(--muted)}.support-item{padding:17px 0;border-bottom:1px solid var(--line)}.support-item:first-child{padding-top:0}.support-item:last-child{border-bottom:0;padding-bottom:0}.support-item header{display:flex;justify-content:space-between;gap:10px}.support-item h3{font-size:.9375rem}.support-item p{font-size:.875rem;color:var(--muted);margin:8px 0;white-space:pre-wrap;overflow-wrap:anywhere}.support-item select{font-size:.8125rem;padding:6px;border:1px solid var(--line);border-radius:5px;background:white;color:var(--ink)}.empty-queue{text-align:center;padding:15px 10px}.empty-queue .icon{width:28px;height:28px;color:var(--teal-dark);margin-bottom:10px}.empty-queue p{font-size:.875rem;color:var(--muted);margin-top:6px}.small-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}
dialog{border:0;border-radius:17px;padding:0;color:var(--ink);width:min(570px,calc(100% - 28px));max-height:calc(100dvh - 36px);box-shadow:0 30px 110px #0a20254d;background:white}dialog::backdrop{background:#142a35a8;backdrop-filter:blur(3px)}.modal-head{padding:24px 26px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;align-items:start}.modal-head p{font-size:.875rem;color:var(--muted);margin-top:7px}.close-btn{border:0;background:#edf3f4;color:var(--muted);width:34px;height:34px;display:grid;place-items:center;border-radius:50%;flex:none}.close-btn .icon{width:17px;height:17px}.modal-body{padding:24px 26px}.identity-summary{background:var(--paper);border-radius:8px;padding:12px 14px;font-size:.8125rem;color:var(--muted);margin-bottom:20px;overflow-wrap:anywhere}.identity-summary strong{color:var(--ink);display:block;font-size:.8755rem}.check-label{display:flex;align-items:center;gap:9px;font-size:.9375rem;margin-bottom:16px}.check-label input{accent-color:var(--teal-dark);width:19px;height:19px}.success-pane{text-align:center;padding:35px 22px}.success-pane .success-icon{width:64px;height:64px;display:grid;place-items:center;color:var(--green);background:var(--green-bg);border-radius:50%;margin:0 auto 20px}.success-pane p{font-size:.9375rem;color:var(--muted);margin:12px 0 22px}.tool-options{display:flex;flex-direction:column;gap:12px}.tool-option{border:1px solid var(--line);border-radius:9px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:16px}.tool-option strong{font-size:.9375rem}.tool-option p{font-size:.8125rem;color:var(--muted);margin-top:4px}.tool-option .btn{font-size:.8125rem;padding:9px 12px;flex:none}.form-error{font-size:.875rem;color:#a33832;margin:10px 0}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);z-index:100;background:var(--dark);color:white;box-shadow:0 5px 25px #102d3933;padding:13px 20px;border-radius:10px;max-width:calc(100% - 30px);font-size:.9375rem}.footer{max-width:1392px;margin:auto;padding:18px 40px 24px;color:var(--muted);font-size:.75rem;border-top:1px solid var(--line);display:flex;gap:20px;justify-content:space-between}.footer a{color:var(--muted)}
@media(min-width:1550px){.main{padding-top:45px}.task-card{min-height:263px}.viewer-shell iframe{height:720px}}@media(max-width:1080px){.top-inner,.preview-inner{padding-left:24px;padding-right:24px}.layout{grid-template-columns:240px minmax(0,1fr)}.rail{padding-left:20px;padding-right:16px}.main{padding:30px 25px}.brand-label{display:none}.summary-progress{width:150px}.overview-summary{gap:16px;padding:18px}.task-card{padding:21px}.staff-main{padding:30px 24px}.staff-columns{grid-template-columns:1.25fr 1fr}.staff-columns .fields{grid-template-columns:1fr}.fields .full{grid-column:auto}.session-body{grid-template-columns:1fr}}
@media(max-width:790px){.top-inner{padding:14px 18px;gap:15px}.top{min-height:88px}.brand img{width:170px;height:51px}.header-actions{gap:9px}.header-actions>.avatar{display:none}.support-trigger{font-size:.8125rem;padding:9px 11px}.support-trigger .icon{width:18px;height:18px}.preview-inner{padding:10px 18px;flex-wrap:wrap;gap:8px}.preview-copy{font-size:.75rem}.strip-actions{width:100%;justify-content:space-between;gap:10px;flex-wrap:wrap}.layout{display:flex;flex-direction:column;min-height:0}.rail{padding:16px 18px;border-right:0;border-bottom:1px solid var(--line);background:white}.rail-label,.rail-help,.rail-foot{display:none}.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.step-nav{padding:8px 4px;gap:7px;flex-direction:column;align-items:center;text-align:center}.step-num{width:29px;height:29px;font-size:.8125rem}.step-copy strong{font-size:.75rem;line-height:1.3}.step-copy span{display:none}.step-nav.active{box-shadow:none;background:var(--teal-pale);border-color:transparent}.main{padding:26px 18px 35px}.page-heading{margin-bottom:21px;gap:10px}.page-heading>.badge{display:none}.subtitle{font-size:.9375rem}.overview-summary{display:grid;grid-template-columns:40px 1fr;gap:13px}.summary-icon{width:40px;height:40px}.summary-progress{grid-column:1/-1;width:100%}.task-grid{gap:13px}.task-card{min-height:250px;padding:19px}.card-top{margin-bottom:16px;gap:5px;align-items:start}.task-icon{width:33px;height:33px}.badge{font-size:.6875rem;padding:4px 7px}.task-card h2{font-size:1.08rem}.task-card p{font-size:.875rem}.task-card .btn{font-size:.8125rem;padding:10px 12px}.card-action{align-items:start}.lock-line{font-size:.8125rem}.assigned-strip{display:block}.assigned-strip>span{display:block;margin-bottom:10px}.viewer-shell iframe{height:65dvh;min-height:400px}.viewer-bar{flex-wrap:wrap}.viewer-footer,.demo-completion{flex-direction:column;align-items:stretch}.module{flex-wrap:wrap;padding:18px}.module>.btn{width:100%}.module .task-icon{width:38px;height:38px}.session-heading{padding:18px;flex-wrap:wrap}.session-heading>.badge{margin-left:76px}.session-body{padding:20px}.session-actions{padding:16px 20px;flex-wrap:wrap}.staff-main{padding:26px 18px}.staff-columns{grid-template-columns:1fr;gap:0}.staff-columns .fields{grid-template-columns:1fr 1fr}.panel-head,.panel-body{padding:20px}.footer{padding:18px;font-size:.6875rem;flex-direction:column;gap:7px}.tool-option{flex-wrap:wrap}.tool-option .btn{width:100%}}
@media(max-width:430px){.task-grid{grid-template-columns:1fr}.task-card{min-height:220px}.card-top{margin-bottom:15px}.task-card h2{font-size:1.2rem}.task-card p{font-size:.9375rem}.task-card .btn{font-size:.9375rem}.lock-line{font-size:.875rem}.staff-columns .fields{grid-template-columns:1fr}.form-actions{flex-direction:column;align-items:stretch}.form-actions small{max-width:none}.modal-head,.modal-body{padding:21px}.header-actions .support-trigger{font-size:.75rem}.brand img{width:147px;height:47px}.switcher button{padding:7px 12px}.preview-copy .preview-caption{font-size:.6875rem}.step-copy strong{font-size:.6875rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}@media print{.top,.preview-strip,.rail,.footer,.btn,.back,.support-trigger,.demo-completion{display:none}.layout{display:block}.main{padding:0}.session-card{break-inside:avoid}.session-body{grid-template-columns:1fr 1fr}}
.viewer-actions{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.frame-wrap{position:relative;background:white}.frame-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;background:white;color:var(--muted);font-size:.9375rem;pointer-events:none}.frame-status[hidden]{display:none}.spinner{width:20px;height:20px;border:3px solid #dce5e7;border-top-color:var(--teal);border-radius:50%;animation:spin .9s linear infinite;flex:none}@keyframes spin{to{transform:rotate(360deg)}}.launch-pane{padding:56px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}.launch-pane .launch-icon{width:64px;height:64px;border-radius:16px;background:var(--teal-pale);color:var(--teal-dark);display:grid;place-items:center}.launch-pane .launch-icon .icon{width:30px;height:30px}.launch-pane p{color:var(--muted);max-width:480px;font-size:.9375rem}.launch-pane .btn{margin-top:8px;font-size:1rem;padding:13px 22px}.launch-meta{font-size:.8125rem;color:var(--green);display:flex;gap:6px;align-items:center}.launch-meta .icon{width:15px;height:15px}.mode-toggle{display:inline-flex;gap:3px;padding:3px;background:#edf2f3;border-radius:9px}.mode-toggle button{border:0;padding:7px 12px;border-radius:6px;background:transparent;color:var(--muted);font-size:.8125rem;font-weight:600}.mode-toggle button[aria-pressed="true"]{color:var(--ink);background:white;box-shadow:0 1px 5px #172b3014}.notice.warn{background:var(--amber-bg);color:var(--amber)}@media(prefers-reduced-motion:reduce){.spinner{animation:none;border-top-color:#dce5e7}}.course-session .field input{width:100%;height:auto;min-height:45px;margin:0}
.ef-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:22px;align-items:start}.ef-nav{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.ef-nav-item{width:100%;border:1px solid transparent;background:transparent;border-radius:9px;padding:9px 10px;display:flex;gap:10px;align-items:center;text-align:left;font-size:.875rem;color:var(--ink)}.ef-nav-item:hover:not(:disabled){background:#fff}.ef-nav-item.active{background:white;border-color:var(--line)}.ef-nav-item:disabled{color:var(--muted);opacity:.7}.ef-nav-item .step-num{width:26px;height:26px;font-size:.75rem}.ef-nav-item.active .step-num{background:var(--teal-dark);color:white;border-color:var(--teal-dark)}.ef-main{padding:26px}.ef-section-head{margin-bottom:22px}.ef-sub{grid-column:1/-1;margin:10px 0 -6px;font-size:.9375rem}.req{color:#a33832}.field-err{color:#a33832!important;font-weight:600}.has-error input,.has-error select,.has-error textarea{border-color:#c4463f}.sensitive{display:flex;gap:6px;align-items:center;color:var(--muted)}.sensitive .icon{width:13px;height:13px}.ef-checks{border:0;padding:0;margin:0}.ef-check-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;margin-top:6px}.ef-privacy{background:var(--paper);border-radius:10px;padding:18px 20px;font-size:.9rem}.ef-privacy h3{margin-bottom:8px}.ef-privacy p+p{margin-top:10px}.placeholder{background:#fff6df;color:var(--amber);padding:1px 5px;border-radius:4px;font-size:.8125rem}.ef-review-sec{border-bottom:1px solid var(--line);padding:16px 0}.ef-review-sec:first-of-type{padding-top:0}.ef-review-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}.ef-review-head h3{flex:1}.ef-review dl,.ef-dl{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;margin:0}.ef-review dl>div,.ef-dl>div{display:flex;flex-direction:column}.ef-review dt,.ef-dl dt{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.ef-review dd,.ef-dl dd{margin:0;font-size:.9375rem;overflow-wrap:anywhere}.ef-mail{white-space:pre-wrap;font:.8125rem/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--paper);padding:12px;border-radius:8px;margin:10px 0 0;max-height:260px;overflow:auto}.form-actions .btn.quiet{min-height:44px}.ef-steps{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:12px;font-size:.9375rem}.ef-steps li::marker{color:var(--teal-dark);font-weight:700}.llnd-timer{border-style:solid;border-color:#bfe3e7;background:var(--teal-pale)}.llnd-timer p{color:#265b63}.llnd-timer strong{color:#145861}.llnd-timer .btn{background:var(--teal-dark)}.llnd-timer progress{width:min(360px,100%)}.ef-section{padding:0 0 28px;margin:0 0 28px;border-bottom:1px solid var(--line)}.ef-section:last-of-type{border-bottom:0;margin-bottom:6px}.ef-section-head h2{scroll-margin-top:24px}.ef-section{scroll-margin-top:20px}.ef-side{position:sticky;top:20px}.ef-nav-item.has-err .step-num{border-color:#c4463f;color:#a33832;background:#fdf1f0}@media(max-width:790px){.ef-layout{grid-template-columns:1fr}.ef-side{min-width:0;max-width:100%;position:static}.ef-nav{flex-direction:row;overflow-x:auto;padding-bottom:6px;max-width:100%;-webkit-overflow-scrolling:touch}.ef-nav li{flex:none}.ef-nav-item{white-space:nowrap;width:auto}.ef-main{padding:18px}.ef-check-grid,.ef-review dl,.ef-dl{grid-template-columns:1fr}}@media(max-width:560px){.ef-main .fields{grid-template-columns:1fr}}
/* Sub header: student resources, sitting under the main header bar. */
.subheader{background:#fff;border-bottom:1px solid var(--line)}
.subheader-inner{max-width:1392px;margin:auto;padding:11px 40px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.subheader-inner a{color:var(--teal-dark);font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.subheader-inner a:hover{text-decoration:underline}
.subheader-inner a .icon{width:16px;height:16px;flex:none}
@media(max-width:1080px){.subheader-inner{padding:11px 24px;gap:18px}}
@media(max-width:790px){.subheader-inner{padding:10px 18px;gap:14px}.subheader-inner a{font-size:.8125rem}}
@media(max-width:430px){.subheader-inner{gap:12px}.subheader-inner a{font-size:.75rem}}
.subheader-inner{justify-content:space-between}
.booked-training{display:inline-flex;align-items:center;gap:8px;font-size:.875rem;color:var(--ink)}
.booked-training .icon{width:16px;height:16px;color:var(--teal-dark);flex:none}
.booked-training strong{font-weight:650}
.booked-training .more{color:var(--muted)}
.subheader-links{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
@media(max-width:1080px){.subheader-inner{justify-content:flex-start}.subheader-links{gap:18px}}
@media(max-width:790px){.booked-training{font-size:.8125rem}.subheader-links{gap:14px}}

/* ---------------------------------------------------------------------------
   Staff portal on a phone. The student side already stacks at 790px and 430px,
   but .fields only collapsed inside .staff-columns - so the student setup form,
   the catalogue, settings and the assessment editor stayed two columns all the
   way down to 375px, which left each field about 150px wide.
   --------------------------------------------------------------------------- */
.brand img{max-width:100%}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media(max-width:700px){
  .fields{grid-template-columns:1fr}
  .fields .full{grid-column:auto}
  .table{min-width:560px}
  .staff-nav{overflow-x:auto;-webkit-overflow-scrolling:touch;flex-wrap:nowrap}
  .staff-nav-btn{white-space:nowrap;flex:none}
  .link-row{display:flex;flex-direction:column;align-items:stretch;gap:10px}
  .link-row input{width:100%}
  .form-actions{flex-direction:column;align-items:stretch;gap:12px}
  .form-actions small{max-width:none}
  .form-actions>span{display:flex;flex-direction:column;gap:10px}
  .form-actions .btn{width:100%;justify-content:center}
  .small-heading{flex-wrap:wrap;gap:8px}
  .status-row{flex-direction:column;align-items:flex-start;gap:7px}
  .support-item header{flex-direction:column;gap:6px}
  .panel-head,.panel-body{padding:18px}
}
/* A 1fr grid column still takes its minimum from its content, so one wide child
   (a long portal link, a code block) stretched the whole student page sideways. */
@media(max-width:790px){
  .staff-columns{grid-template-columns:minmax(0,1fr)}
  .staff-columns>*{min-width:0}
  .panel,.panel-body,.panel-head{min-width:0}
  .ef-mail{max-width:100%}
}
/* Only tables in a scroll wrapper get a min width. A bare table (the activity log
   on a student's page) sits straight in a panel, which clips - so let it scroll itself. */
@media(max-width:700px){
  .table{min-width:0}
  .table-wrap .table{min-width:560px}
  .panel-body>.table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}
/* A course box sizes its own tick box at 20px. A text input, select or textarea
   placed inside one (the "course not listed" box) was inheriting that and
   collapsing to a stub - checkboxes and radios keep the small treatment. */
.check-course .field input:not([type="checkbox"]):not([type="radio"]),
.check-course .field select,
.check-course .field textarea{width:100%;height:auto;min-height:45px;margin:0}
/* Full-width fields collapse to a normal cell below 1080px, which left the course
   name box at half a row on most screens. A course name deserves the whole row. */
#quickAdd .field.full{grid-column:1/-1}
/* Units of competency, listed under a course. */
.unit-list{list-style:none;margin:5px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;font-size:.875rem}
.unit-list li{display:flex;gap:8px;align-items:baseline;overflow-wrap:anywhere}
.unit-list li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--teal-dark);flex:none;transform:translateY(-2px)}
.unit-block{margin-top:10px}
.unit-block>small{display:block;text-transform:uppercase;letter-spacing:.06em;font-size:.6875rem}
/* A floor under every text control, so none can collapse to a stub the way the
   "course not listed" box did. Tick boxes and radios keep their own small size. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]),
select,
textarea{min-height:44px}
textarea{min-height:100px}
/* The support queue status picker was a 106x31 stub - too small to hit on a phone. */
.support-item select{font-size:.875rem;padding:9px 11px;min-width:170px}
/* Theory assessment. Ordering uses move buttons and matching uses a dropdown per row,
   because drag and drop is unusable one-handed on a phone. */
.q-block{background:white;border:1px solid var(--line);border-radius:12px;padding:22px;margin-bottom:16px}
.q-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.q-head h2{font-size:1rem}
.q-prompt{font-size:1rem;margin-bottom:14px;overflow-wrap:anywhere}
.upload{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.upload-have{display:flex;gap:11px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:11px 13px;background:#f6fafb;width:100%}
.upload-have .icon{width:20px;height:20px;color:var(--teal-dark);flex:none}
.upload-hint{margin:0;color:var(--muted)}
.save-state{font-size:.75rem;color:var(--muted);white-space:nowrap}
.save-state.ok{color:var(--green)}
.save-state.bad{color:#a33832;font-weight:600;white-space:normal}
.opt-row{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:9px;margin-bottom:8px;cursor:pointer}
.opt-row:has(input:checked){border-color:#82cbd1;background:#f4fbfb}
.opt-row input{width:20px;height:20px;min-height:0;flex:none;margin-top:2px;accent-color:var(--teal-dark)}
.order-list{list-style:none;margin:0;padding:0;counter-reset:step}
.order-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:9px;margin-bottom:8px;background:white}
.order-row::before{counter-increment:step;content:counter(step);flex:none;width:26px;height:26px;border-radius:50%;background:var(--teal-pale);color:var(--teal-dark);display:grid;place-items:center;font-size:.8125rem;font-weight:700}
.order-row>span:first-of-type{flex:1;overflow-wrap:anywhere}
.order-btns{display:flex;gap:6px;flex:none}
.order-btns button{min-width:42px;min-height:42px;border:1px solid var(--line);border-radius:8px;font-size:1.05rem;background:white}
.order-btns button:disabled{opacity:.35}
.match-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--line);border-radius:9px;margin-bottom:8px}
.match-row>span{flex:1;min-width:150px;overflow-wrap:anywhere}
.match-row select{flex:1;min-width:190px;max-width:330px}
.q-answers input[type="text"],.q-answers textarea{width:100%}
.q-guide{margin-top:12px;font-size:.875rem;color:var(--muted)}
.given{font-size:.9375rem;font-weight:600;overflow-wrap:anywhere}
@media(max-width:560px){.match-row select{max-width:none;width:100%}.q-block{padding:18px}}
/* ---------------------------------------------------------------------------
   Theory assessment record. Read on screen by staff, and printed for the file:
   the same markup serves both, so what you read is what you file.
   --------------------------------------------------------------------------- */
.print-only{display:none}
.record{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-bottom:26px}
.record-head{padding:20px 24px;border-bottom:1px solid var(--line)}
.record-brand{display:flex;flex-direction:column;gap:2px;margin-bottom:14px}
.record-brand strong{font-size:1.05rem}
.record-brand span{font-size:.8125rem;color:var(--muted)}
.record-who{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px 20px}
.record-who small{display:block;font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.record-who p{font-size:.9375rem;font-weight:600;margin-top:2px;overflow-wrap:anywhere}
.record-body{padding:8px 24px 24px}
.record-q{padding:18px 0;border-bottom:1px solid #eef2f3}
.record-q:last-child{border-bottom:0}
.record-q-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px;margin-bottom:10px}
.record-q-head h3{font-size:.9375rem;font-weight:600;flex:1;overflow-wrap:anywhere}
.record-a{margin-top:8px}
.record-a small{display:block;font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:4px}
.record-a ul{margin:0;padding-left:18px;font-size:.9375rem;display:flex;flex-direction:column;gap:3px}
.record-a ul li{overflow-wrap:anywhere}
.record-a.model ul{color:var(--muted)}
.record-mark{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:.8125rem;color:var(--muted)}
.tickbox{width:17px;height:17px;border:1px solid #9fb3b7;border-radius:3px;display:inline-block;flex:none}
.record-foot{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:22px;padding:20px 24px;border-top:1px solid var(--line)}
.record-foot small{display:block;font-size:.6875rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:20px}
.sign-line{border-bottom:1px solid #9fb3b7}
.record-rto{font-size:.75rem;color:var(--muted);padding:0 24px 18px}
@media print{
  .no-print,.staff-nav,.page-heading .badge{display:none!important}
  .print-only{display:block}
  .record{border:0;border-radius:0;margin:0;break-after:page}
  .record:last-of-type{break-after:auto}
  .record-q{break-inside:avoid}
  .record-head,.record-body,.record-foot{padding-left:0;padding-right:0}
  .record-rto{padding-left:0}
  .badge{border:1px solid #999;background:transparent!important;color:#000!important}
}
/* Units chosen per student, for a course whose units vary between bookings. */
/* Units the staff tick for one student. Laid out in columns that fit the space, so a
   twelve-unit course reads as a compact block rather than twelve rows stretched the
   full width of the page. */
.unit-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:8px;margin-top:6px}
.unit-picks .check-label{margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font-size:.875rem;align-items:center;gap:10px;line-height:1.35;overflow-wrap:anywhere}
.unit-picks .check-label:has(input:checked){border-color:#82cbd1;background:#f4fbfb}
/* Specific enough to beat `.course-session .field input`, which sets width:100% and
   min-height:45px and was stretching each tick box across its whole row. */
.unit-picks .check-label input[type="checkbox"]{width:18px;height:18px;min-width:0;min-height:0;flex:none;margin:0;padding:0;accent-color:var(--teal-dark)}
/* The booking email, shown where the student is about to be asked for it. */
.email-notice .the-email{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.05rem;font-weight:700;margin:6px 0 8px;overflow-wrap:anywhere;color:var(--ink)}
.email-notice p{margin:0}

/* The course search hides rows that do not match. .check-course sets its own display,
   which would otherwise beat the browser's default styling of the hidden attribute. */
.check-course[hidden]{display:none!important}

/* ---- Assessment record in the Industry Skills Solutions house style ----
   Matches the learner portfolios and assessor guides: Arial, a centred RTO line, the
   logo, a gold rule, dark grey section bars with a gold edge, grey label cells, and
   page X of Y in the footer. Scoped to .record.house so nothing else changes. */
.record.house{font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;color:#333;background:#fff;border:1px solid #d9d9d9;border-radius:4px;padding:26px 30px;margin-bottom:26px;overflow:visible}
.hs-head{border-bottom:3px solid #e0a526;padding-bottom:10px;margin-bottom:18px}
.hs-rto{text-align:center;font-size:.6rem;letter-spacing:.05em;text-transform:uppercase;color:#8a8a8a;font-weight:700;margin:0}
.hs-contact{text-align:center;font-size:.7rem;color:#555;margin:2px 0 10px}
.hs-unit{display:flex;justify-content:space-between;align-items:center;gap:16px}
.hs-unit strong{font-size:.85rem;color:#444}
.hs-unit img{height:40px;width:auto}
.hs-title{font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-size:2rem;font-weight:700;color:#444;margin:6px 0 4px;letter-spacing:0}
.hs-sub{font-size:1rem;color:#444;margin:0 0 18px}
.hs-bar{font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;background:#4d4d4d;color:#fff;font-size:1.02rem;font-weight:700;padding:9px 14px 9px 16px;margin:22px 0 12px;border-left:7px solid #e0a526;letter-spacing:0}
.hs-kv{width:100%;border-collapse:collapse;font-size:.9rem;margin:0 0 10px}
.hs-kv th{width:32%;background:#f2f2f2;color:#333;font-weight:700;text-align:left;vertical-align:top;padding:9px 10px;border:1px solid #d9d9d9;text-transform:none;letter-spacing:0;font-size:.9rem;white-space:normal}
.hs-kv td{padding:9px 10px;border:1px solid #d9d9d9;vertical-align:top;overflow-wrap:anywhere}
.hs-kv ul{margin:0;padding-left:18px}
/* A one-line answer (a date, a Yes) reads better without a bullet in front of it. */
.hs-kv ul:has(> li:only-child){padding-left:0;list-style:none}
.hs-q{margin:0 0 14px}
.hs-q-head{display:flex;gap:10px;align-items:baseline;margin:0 0 6px}
.hs-q-n{font-weight:700;color:#b7811a;min-width:22px}
.hs-q-head h3{flex:1;font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-size:.95rem;font-weight:700;color:#333;margin:0;overflow-wrap:anywhere}
.hs-decl{font-size:.92rem;margin:0 0 10px}
.hs-sig{max-height:70px;max-width:100%;width:auto;display:block}
.hs-file{display:block;max-width:100%;max-height:320px;width:auto;border:1px solid #c9c9c9;margin:4px 0}
.hs-note{background:#fffbe6;border:1px solid #e0a526;border-left:6px solid #e0a526;padding:10px 14px;font-size:.88rem;margin:0 0 10px}
.hs-note strong{color:#b7811a}
.hs-box{display:inline-block;width:12px;height:12px;border:1px solid #555;vertical-align:-2px;margin:0 16px 0 6px}
.hs-foot{margin-top:18px;font-size:.72rem;color:#777}
@media print{
  @page{size:A4;margin:20mm 15mm 18mm;
    @bottom-left{content:"Assessment record — Industry Skills Solutions RTO 45974";font:8pt Arial,sans-serif;color:#777}
    @bottom-right{content:"Page " counter(page) " of " counter(pages);font:8pt Arial,sans-serif;color:#777}}
  .record.house{border:0;border-radius:0;padding:0;margin:0;break-after:page}
  .record.house:last-of-type{break-after:auto}
  .record.house *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .hs-bar{break-after:avoid}
  .hs-q,.hs-kv tr,.hs-note{break-inside:avoid}
  /* The RTO line fits on one line, as it does on the portfolios. */
  .hs-rto{font-size:6.8pt;letter-spacing:.03em}
  /* A signature must never print on a different page from the declaration it signs. */
  .hs-keep{break-inside:avoid;page-break-inside:avoid}
}

/* A written answer keeps the line breaks the student typed - a list of qualifications
   or two references on separate lines - rather than running together on one line. */
.hs-kv li,.record-a li,.q-answers .given{white-space:pre-line}

/* A questionnaire prints as statement-and-answer, so the statement takes the width and
   the answer sits in a narrow column beside it - the reverse of the label/value tables. */
/* Logs on a printed record - emails, support, the activity trail. Ruled like the paper
   forms, and each row kept whole across a page break. */
.hs-log{width:100%;border-collapse:collapse;font-size:.8125rem;margin:0 0 14px}
.hs-log th{background:#f2f2f2;text-align:left;padding:7px 9px;border:1px solid #d9d9d9;font-weight:700;white-space:nowrap}
.hs-log td{padding:7px 9px;border:1px solid #d9d9d9;vertical-align:top}
.hs-log td:first-child{white-space:nowrap}
.hs-log tr{break-inside:avoid;page-break-inside:avoid}
.hs-sub-h{font-size:.9375rem;font-weight:700;margin:14px 0 6px}

.hs-items th{width:auto;font-weight:400}
.hs-items td{width:150px;font-weight:600;white-space:nowrap}

/* ---------- the public questionnaire pages: /feedback and /employerfeedback ----------
   Answered by people with no account and often on a phone, frequently one-handed on a
   worksite, so every option is a full-size target and nothing depends on hovering. Both
   brands sit at the top: the training is HMC's, the RTO is Industry Skills Solutions. */
.fb-body{margin:0;background:var(--paper);color:var(--ink)}
/* The bar is dark because the HMC logo's lettering is white - on a white bar the word
   HMC simply disappears. The ISS logo, which is dark lettering, sits on a white chip. */
.fb-brand{display:flex;align-items:center;justify-content:center;gap:22px;padding:18px;background:var(--dark);border-bottom:3px solid var(--teal)}
.fb-logo-hmc{height:46px;width:auto}
.fb-logo-iss{height:40px;width:auto;background:var(--white);padding:7px 11px;border-radius:8px}
.fb-brand-rule{width:1px;height:42px;background:rgba(255,255,255,.22);flex:none}
.fb-wrap{max-width:830px;margin:0 auto;padding:32px 18px 80px}
.fb-loading{color:var(--muted)}
.fb-eyebrow{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal-dark);font-weight:700;margin:0 0 10px}
.fb-wrap h1{font-size:1.55rem;line-height:1.25;margin:0 0 12px;max-width:30ch}
.fb-note{color:var(--muted);font-size:.9375rem;margin:0 0 6px;max-width:70ch}
.fb-section{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px 22px 24px;margin:22px 0;box-shadow:var(--shadow)}
.fb-section h2{font-size:1.1rem;margin:0}
.fb-section-head{display:flex;justify-content:space-between;align-items:baseline;gap:14px;flex-wrap:wrap}
.fb-count{font-size:.8125rem;font-weight:650;color:var(--teal-dark);background:var(--teal-pale);padding:5px 11px;border-radius:999px;white-space:nowrap}
.fb-legend{color:var(--muted);font-size:.875rem;margin:8px 0 0;max-width:68ch}
.fb-items{display:grid;gap:4px;margin-top:14px}
.fb-item{border:0;border-top:1px solid var(--line);margin:0;padding:16px 0 14px}
.fb-item:first-child{border-top:0;padding-top:4px}
.fb-item legend{display:block;width:100%;padding:0;font-size:.9688rem;font-weight:600;line-height:1.45}
.fb-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--teal-pale);color:var(--teal-dark);font-size:.75rem;font-weight:700;margin-right:9px;vertical-align:1px}
.fb-opts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:11px}
.fb-choice{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.fb-pill{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;min-height:46px;padding:8px 12px;border:1px solid #cad7da;border-radius:9px;background:var(--white);font-size:.875rem;cursor:pointer;line-height:1.3}
.fb-choice .fb-pill{min-width:110px}
.fb-pill input{position:absolute;opacity:0;width:1px;height:1px}
.fb-pill:hover{border-color:#9fb4b8;background:#f6fafb}
.fb-pill:has(input:checked){border-color:var(--teal-dark);background:var(--teal-pale);color:var(--teal-dark);font-weight:650;box-shadow:inset 0 0 0 1px var(--teal-dark)}
.fb-pill:focus-within{outline:2px solid var(--teal-dark);outline-offset:2px}
.fb-fields{display:grid;gap:18px;margin-top:16px}
.fb-field{border:0;margin:0;padding:0;min-width:0}
.fb-field label,.fb-field legend{display:block;font-weight:600;font-size:.9375rem;margin:0 0 7px;padding:0}
.fb-field input[type="text"],.fb-field select,.fb-field textarea{width:100%;padding:11px 12px;border:1px solid #cad7da;border-radius:8px;font:inherit;font-size:.9375rem;background:var(--white);color:var(--ink);min-height:46px}
.fb-field textarea{min-height:110px;resize:vertical}
.fb-field small{display:block;color:var(--muted);font-size:.8125rem;margin-top:6px}
/* Staff previewing a student's portal. Loud on purpose: a preview that looks like the
   real thing invites someone to "just tick it for them", which is exactly what the
   server refuses to let them do. */
.preview-bar{background:#8a5a12;color:#fff;padding:11px 18px;font-size:.875rem;line-height:1.45;text-align:center}
.preview-bar strong{font-weight:700}

.fb-check{display:flex;gap:12px;align-items:flex-start;padding:14px 15px;border:1px solid #cad7da;border-radius:9px;background:var(--white);font-weight:600;font-size:.9375rem;line-height:1.4;cursor:pointer}
.fb-check input{width:20px;height:20px;flex:none;margin:1px 0 0;accent-color:var(--teal-dark)}
.fb-check:has(input:checked){border-color:var(--teal-dark);background:var(--teal-pale);color:var(--teal-dark)}
.fb-check:focus-within{outline:2px solid var(--teal-dark);outline-offset:2px}
.fb-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fb-error{color:#a33832;font-weight:600;margin:18px 0 0}
.fb-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:26px}
.fb-actions small{color:var(--muted);font-size:.8125rem;max-width:48ch}
.fb-btn{border:0;border-radius:9px;background:var(--teal-dark);color:var(--white);font:inherit;font-size:1rem;font-weight:650;padding:14px 26px;min-height:50px;cursor:pointer}
.fb-btn:hover:not(:disabled){background:#00636e}
.fb-btn:disabled{opacity:.6;cursor:default}
.fb-done{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:34px 26px;box-shadow:var(--shadow);margin-top:10px}
.fb-done h1{font-size:1.6rem;margin:0 0 12px}
.fb-ref{font-size:.9375rem;background:var(--teal-pale);color:var(--teal-dark);display:inline-block;padding:8px 14px;border-radius:8px}
.fb-foot{border-top:1px solid var(--line);background:var(--white);padding:22px 18px;text-align:center;color:var(--muted);font-size:.8125rem}
.fb-foot p{margin:0 0 5px}
.fb-foot a{color:var(--teal-dark)}
@media (max-width:640px){
  .fb-opts{grid-template-columns:1fr 1fr}
  .fb-section{padding:18px 16px 20px}
  .fb-wrap h1{font-size:1.35rem}
  .fb-brand{gap:14px}
  .fb-logo-hmc{height:38px}.fb-logo-iss{height:34px}
}

/* Online work and course questions on a phone: the course name keeps a workable column, and the
   status line or button drops onto its own line underneath instead of squeezing the name to one
   letter per row (seen on an iPhone, 22 September 2026). */
@media(max-width:560px){
  .module{flex-wrap:wrap;align-items:flex-start;row-gap:12px}
  .module-copy{flex:1 1 150px;min-width:150px}
  .module>small.muted{flex:1 1 100%;margin:0}
  .module>.btn{flex:1 1 100%;justify-content:center}
}

/* The assessment record, made shorter and quieter (Harrison, 1 October 2026 - "some are 20 odd
   pages"). Measured on the 82-question Test and Tag record: a third of it was one sentence saying
   the answers came from the online module, repeated against every question, and most of the rest
   was the bordered table drawn around each single line. A question answered in the module now
   prints as its key alone, the provenance is stated once under the heading, and runs of keys set
   in two columns on paper. Nothing an assessor marks or signs is touched. */
.hs-source{background:#f7f7f5;border-left:4px solid #e0a526;padding:9px 12px;font-size:.85rem;margin:0 0 14px;color:#444;line-height:1.45}
.hs-source strong{color:#333}
.hs-keys{margin:0 0 10px}
.hs-ka{margin:0 0 9px;break-inside:avoid;page-break-inside:avoid}
.hs-ka-q{font-size:.88rem;font-weight:700;color:#333;margin:0;line-height:1.35;overflow-wrap:anywhere;padding-left:2.1em;text-indent:-2.1em}
.hs-ka-n{display:inline-block;min-width:2.1em;color:#b7811a;font-weight:700;text-indent:0}
.hs-ka-key{font-size:.85rem;color:#444;margin:1px 0 0 2.1em;line-height:1.35;overflow-wrap:anywhere}
.hs-ka-tick{color:#b7811a;font-weight:700;margin-right:.45em}
.hs-ka-lab{display:inline-block;font-size:.64rem;letter-spacing:.07em;text-transform:uppercase;color:#8a8a8a;font-weight:700;margin-right:.5em;white-space:nowrap}
@media print{
  .hs-ka{margin-bottom:6px}
  .hs-ka-q{font-size:8.6pt}
  .hs-ka-key{font-size:8.4pt}
  .hs-source{font-size:8.4pt;padding:6px 10px;margin-bottom:10px}
  .hs-kv{font-size:8.8pt;margin-bottom:7px}
  .hs-kv th,.hs-kv td{padding:5px 7px}
  .hs-q{margin-bottom:8px}
  .hs-q-head{margin-bottom:4px}
  .hs-q-head h3{font-size:9pt}
  .hs-bar{font-size:10pt;padding:6px 10px 6px 12px;margin:14px 0 8px}
  .hs-title{font-size:18pt;margin:4px 0 2px}
  .hs-sub{font-size:10.5pt;margin:0 0 12px}
  .hs-decl{font-size:8.8pt}
}