/* Screen-only layout for the wizard UI. Design tokens live in theme.css. */
body.ui{background:var(--page-bg); margin:0;}

.app-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 24px; background:var(--surface); border-bottom:1px solid var(--border);
}
.app-header__brand{display:flex; align-items:center; gap:12px;}
.app-header__crest{height:40px; width:auto;}
.app-header__title{font-weight:800; color:var(--navy); letter-spacing:.02em;}
.app-header__sub{font-size:12px; color:var(--muted);}
.app-header__nav{display:flex; gap:14px;}

.app-main{max-width:980px; margin:24px auto; padding:0 20px; display:flex; flex-direction:column; gap:18px;}
.app-footer{
  max-width:980px; margin:0 auto 24px; padding:18px 20px; color:var(--muted);
  display:flex; gap:16px; justify-content:space-between; font-size:13px; align-items:center;
}
.app-footer__admin{color:var(--muted); text-decoration:none; font-size:12px; border:1px solid var(--border); border-radius:999px; padding:2px 12px;}
.app-footer__admin:hover{color:var(--navy); border-color:var(--navy);}

.hero h1{font-size:var(--fs-h1); margin:0 0 8px;}
.lede{color:var(--muted); margin:0 0 16px; max-width:62ch;}
.cta-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.cta-row--center{justify-content:center;}
.page-landing .app-main{min-height:calc(100vh - 172px); justify-content:center;}
.hero--center{text-align:center; padding:52px 28px;}
.hero--center .lede{margin-left:auto; margin-right:auto;}

.cards-2{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.preview-row{display:flex; align-items:center; gap:12px; margin-top:10px;}

@media (max-width:720px){ .cards-2{grid-template-columns:1fr;} }

/* forms & inputs */
.input{
  font:inherit; color:var(--ink); background:var(--surface);
  border:1px solid var(--border); border-radius:var(--radius-sm); padding:7px 9px; width:100%;
}
.input:focus{outline:2px solid var(--navy); outline-offset:0; border-color:var(--navy);}
.input--sm{min-width:84px;}
.input--xs{min-width:54px; text-align:center;}
.card--narrow{max-width:440px; margin:40px auto;}
label.field{margin:8px 0;}

/* banners */
.banner{border-radius:var(--radius-sm); padding:10px 12px; margin:10px 0; font-size:13px;}
.banner--warn{background:#FFF7E6; border:1px solid #F0D98C; color:#7A5B00;}
.banner--ok{background:var(--green-chip); border:1px solid var(--green-border); color:var(--green); font-weight:600;}

/* wide editable tables */
.table-scroll{overflow-x:auto; margin:12px 0;}
table.review td, table.review th{padding:5px 6px; white-space:nowrap;}
table.review .conf{text-align:center;}
tr.blank .input{background:#FCFCFE;}

/* admin review: confidence tiers + badges */
table.review tr.rev-low > td{background:#FDECEA;}
table.review tr.rev-med > td{background:#FFF7E6;}
.review-summary .review-filter{margin-left:14px; font-weight:600; cursor:pointer;}
.conf-badge{display:inline-block; font-size:10.5px; font-weight:700; padding:1px 8px; border-radius:999px; white-space:nowrap;}
.conf-badge--ok{background:var(--green-chip); color:var(--green);}
.conf-badge--check{background:#FFF1CC; color:#8A6100;}
.conf-badge--review{background:#FBE0DD; color:#B3261E;}
.conf-num{display:block; font-size:10px; color:var(--muted); margin-top:1px; text-align:center;}

/* wizard */
.stepper{display:flex; gap:6px; list-style:none; padding:0; margin:0 0 16px; flex-wrap:wrap;}
.stepper__item{display:flex; align-items:center; gap:7px; padding:6px 12px; border:1px solid var(--border);
  border-radius:999px; color:var(--muted); font-size:13px; background:var(--surface);}
.stepper__num{display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px;
  border-radius:50%; background:var(--border); color:#fff; font-weight:700; font-size:12px;}
.stepper__item.is-active{border-color:var(--navy); color:var(--navy); font-weight:700;}
.stepper__item.is-active .stepper__num{background:var(--navy);}
.stepper__item.is-done{color:var(--green); border-color:var(--green-border);}
.stepper__item.is-done .stepper__num{background:var(--green);}

.btn--sm{padding:.3em .7em; font-size:13px;}
.search-row{display:flex; gap:8px; margin:8px 0; align-items:center;}
.search-row .input{max-width:460px;}
.filter-chips{display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 12px;}
.fchip{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--border); border-radius:999px;
  padding:5px 14px; color:var(--muted); text-decoration:none; font-weight:600; font-size:13px; background:var(--surface);}
.fchip:hover{border-color:var(--navy); color:var(--navy);}
.fchip.is-active{background:var(--navy); border-color:var(--navy); color:#fff;}
.fchip span{font-size:11px; opacity:.65;}
.exam-recap{display:grid; grid-template-columns:1fr 1fr; gap:8px 18px; background:var(--page-bg);
  border:1px solid var(--border); border-radius:var(--radius-sm); padding:12px 14px; margin:8px 0 16px;}
.exam-recap .field__label{display:block;}
.radio-row,.check-row{display:flex; gap:16px; flex-wrap:wrap; margin-top:6px;}
.radio,.check{display:inline-flex; align-items:center; gap:6px; color:var(--ink);}
.matgroup,.langset{border:0; padding:0; margin:12px 0;}
.instructions-area{min-height:160px; resize:vertical;}
.mat-summary{margin:6px 0 0; padding-left:18px;}
@media (max-width:640px){ .exam-recap{grid-template-columns:1fr;} }

/* student roster + accommodations */
.roster-tools{margin-top:14px; align-items:start;}
.subcard{background:var(--page-bg); border:1px solid var(--border); border-radius:var(--radius-sm); padding:14px 16px;}
.subcard h2{margin:0 0 8px; font-size:15px; color:var(--navy);}
table.roster td .btn--sm{padding:.05em .55em; font-size:16px; line-height:1.1;}
table.accom td{vertical-align:middle;}
table.accom .input{margin:0;}

/* materials step */
.matgrid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:14px 0;}
.matcard{border:1px solid var(--border); border-radius:var(--radius); padding:12px 14px; margin:0;}
.matcard legend{color:var(--navy); font-weight:700; font-size:13px; padding:0 5px;}
.matcard__opts{display:flex; flex-wrap:wrap; gap:8px; margin-top:6px;}
.chip-check{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--border);
  border-radius:999px; padding:5px 13px; cursor:pointer; background:var(--surface); user-select:none;}
.chip-check input{margin:0;}
.chip-check:has(input:checked){border-color:var(--navy); background:#EEF1FA; color:var(--navy); font-weight:600;}
.none-check{display:inline-flex; align-items:center; gap:8px; margin:4px 0 6px; cursor:pointer;}

/* file drop zone (students import) */
.dropzone{position:relative; display:flex; flex-direction:column; align-items:center; gap:6px;
  border:2px dashed var(--border); border-radius:var(--radius); padding:30px 20px; cursor:pointer;
  background:var(--page-bg); text-align:center; transition:border-color .15s, background .15s;}
.dropzone:hover, .dropzone.is-drag{border-color:var(--navy); background:#EEF1FA;}
.dropzone input[type=file]{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.dropzone__icon{font-size:26px; color:var(--navy); line-height:1;}
.dropzone__title{font-weight:600;}
.dropzone__hint{color:var(--muted); font-size:13px;}
.upload-actions{display:flex; align-items:center; gap:16px; margin:12px 0 18px; flex-wrap:wrap;}
.addstudent{margin:8px 0 16px; border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px 14px;}
.addstudent summary{cursor:pointer; color:var(--navy); font-weight:600;}
.addstudent__form{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px;}
@media (max-width:640px){ .matgrid{grid-template-columns:1fr;} }

/* generate page: inline PDF preview */
.pdf-preview-wrap{margin-top:18px; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; box-shadow:0 1px 3px rgba(20,30,60,.05);}
.pdf-preview-bar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 12px; background:var(--page-bg); border-bottom:1px solid var(--border);}
.pdf-preview-body{position:relative; background:#fff; min-height:60vh;}
.pdf-preview-actions{display:flex; gap:8px; align-items:center;}
.pdf-loading{position:absolute; inset:0; display:none; flex-direction:column; align-items:center; justify-content:center;
  gap:14px; text-align:center; padding:24px; color:var(--muted); font-size:14px; background:var(--page-bg);}
.pdf-loading.is-loading{display:flex;}
.spinner{width:30px; height:30px; border:3px solid var(--border); border-top-color:var(--navy);
  border-radius:50%; animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.pdf-preview{width:100%; height:75vh; border:0; display:block; background:#fff;}