:root{--navy:#1b1145;--ink:#1b1633;--verve:#ff3d81;--verve-deep:#e01e63;--verve-soft:#ffe9f1;--indigo:#5b4be0;--indigo-soft:#eeebff;--amber:#ffab2e;--amber-soft:#fff3df;--purple:#5b4be0;--purple-soft:#eeebff;--green:#12b76a;--green-dark:#079455;--green-soft:#e9f9f1;--orange:#f79009;--orange-soft:#fff4e5;--red:#f04438;--muted:#6b6480;--line:#e9e6f0;--paper:#fff;--bg:#f7f6fb;--radius:20px;--shadow:0 10px 28px rgba(27,17,69,.10)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);-webkit-text-size-adjust:100%}button,input,select,textarea{font:inherit}button,label,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}.app-shell{width:100%;min-height:100vh;background:var(--paper);padding-bottom:env(safe-area-inset-bottom)}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:10px 16px;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.brand{font-size:25px;font-weight:900;letter-spacing:-1.5px;color:var(--verve)}.brand span{color:var(--ink)}.tagline{font-size:11px;color:var(--muted)}main{width:100%;padding:16px 14px 118px;margin:auto}.hero{background:linear-gradient(145deg,var(--navy),#3b2a8f 65%,#6d3aa0);color:#fff;border-radius:26px;padding:25px 20px;box-shadow:var(--shadow);position:relative;overflow:hidden}.hero:after{content:"✦";position:absolute;right:18px;top:13px;font-size:48px;color:var(--verve)}.hero h1{font-size:36px;line-height:1.02;margin:10px 0 12px;letter-spacing:-1.8px}.hero p{font-size:16px;line-height:1.5;color:#e6e9ff}.grid{display:grid;gap:12px}.grid.two{grid-template-columns:1fr}.card,.review-summary-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:0 4px 14px rgba(17,26,70,.05)}.card h2,.card h3{margin-top:0}.action-card{display:flex;gap:14px;align-items:center;text-align:left;width:100%;border:1px solid var(--line);background:#fff;padding:17px;border-radius:18px;min-height:82px}.icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:15px;background:var(--purple-soft);font-size:24px}.btn{border:0;border-radius:14px;padding:13px 16px;font-weight:850;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;text-decoration:none}.btn.primary{background:linear-gradient(135deg,var(--verve),#ff6a4d);color:#fff}.btn.green{background:linear-gradient(135deg,var(--green),#20c47a);color:#fff}.btn.secondary{background:#fff;color:var(--purple);border:1px solid #cfc6fb}.btn.ghost{background:transparent;color:var(--muted);padding:8px;min-height:42px}.btn.danger{background:#fff0ef;color:var(--red)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.block{width:100%}.section-title{margin:24px 0 12px}.field{display:grid;gap:7px;margin:12px 0}label{font-size:13px;font-weight:800;color:#344054}.label-note{font-weight:500;color:var(--muted)}input,select,textarea{display:block;width:100%;min-width:0;border:1px solid #d0d5dd;border-radius:13px;padding:13px 12px;background:#fff;color:var(--ink);font-size:16px}textarea{resize:vertical;line-height:1.4}input:focus,select:focus,textarea:focus{outline:3px solid rgba(101,67,217,.14);border-color:var(--purple)}.row{display:flex;gap:10px;align-items:center}.row.between{justify-content:space-between}.row.wrap{flex-wrap:wrap}.muted{color:var(--muted)}.small{font-size:13px}.pill,.step-chip{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:850;background:var(--purple-soft);color:var(--purple)}.pill.green{background:var(--green-soft);color:var(--green-dark)}.pill.orange{background:var(--orange-soft);color:#b54708}.error-chip{background:#fff0ef;color:var(--red)}.mobile-page-head{margin:4px 2px 18px}.mobile-page-head h1{font-size:29px;line-height:1.1;letter-spacing:-1px;margin:11px 0 8px}.mobile-page-head p{line-height:1.5;margin:0}.capture-actions{display:grid;gap:11px}.capture-card{position:relative;display:flex;align-items:center;gap:13px;padding:17px;border:2px solid #ddd7fb;border-radius:19px;background:#faf9ff;min-height:82px}.capture-card.primary-capture{border-color:var(--purple);background:var(--purple-soft)}.capture-card input{display:none}.capture-card strong,.capture-card small{display:block}.capture-card small{margin-top:3px;color:var(--muted)}.capture-icon{font-size:29px}.photo-help{display:grid;gap:7px;margin:14px 2px;padding:13px;border-radius:15px;background:#f8f9fc;color:#475467;font-size:13px}.selected-pages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.selected-pages.empty-selection{display:flex;min-height:145px;flex-direction:column;align-items:center;justify-content:center;border:2px dashed #d0d5dd;border-radius:19px;background:#fafafa}.empty-camera{font-size:31px}.page-thumb{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;min-height:150px}.page-thumb img{display:block;width:100%;height:128px;object-fit:cover}.page-thumb>span:not(.capture-icon){display:block;padding:8px;font-size:12px;font-weight:800}.page-thumb button{position:absolute;right:6px;top:6px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(17,26,70,.88);color:#fff;font-size:22px}.add-page{display:flex;min-height:150px;flex-direction:column;align-items:center;justify-content:center;color:var(--purple);background:var(--purple-soft)}.add-page>span{font-size:28px;padding:0}.mobile-sticky-action{position:fixed;z-index:15;left:0;right:0;bottom:0;padding:11px 14px calc(11px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(17,26,70,.08);text-align:center}.mobile-sticky-action .small{display:block;margin-top:5px}.processing-screen{text-align:center;padding-top:15px}.scan-animation{position:relative;display:grid;place-items:center;width:120px;height:150px;margin:8px auto 22px;border-radius:18px;background:#fff;border:1px solid var(--line);font-size:58px;overflow:hidden}.scan-animation i{position:absolute;left:8px;right:8px;height:3px;background:var(--green);box-shadow:0 0 12px var(--green);animation:scan 1.7s ease-in-out infinite}@keyframes scan{0%,100%{top:16px}50%{top:130px}}.processing-list{display:grid;gap:10px;max-width:430px;margin:22px auto;text-align:left}.processing-list div{display:flex;gap:11px;align-items:center;padding:13px;border-radius:14px;background:#f7f7fa;color:#98a2b3;font-weight:750}.processing-list div.active{background:var(--purple-soft);color:var(--purple)}.extraction-error{text-align:center}.extraction-error .mascot{font-size:62px}.review-summary-card{margin-bottom:13px}.review-instruction{display:flex;justify-content:space-between;align-items:center;margin:14px 2px 9px;font-size:13px}.review-instruction span{color:var(--purple);font-weight:850}.question-editor-list{display:grid;gap:10px;margin-bottom:12px}.question-accordion{border:1px solid var(--line);border-radius:17px;background:#fff;box-shadow:0 3px 12px rgba(17,26,70,.04);overflow:hidden}.question-accordion>summary{display:flex;align-items:center;gap:10px;list-style:none;padding:14px;cursor:pointer}.question-accordion>summary::-webkit-details-marker{display:none}.question-number{display:inline-flex;flex:0 0 34px;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;background:var(--purple-soft);color:var(--purple);font-weight:900}.summary-copy{display:block;min-width:0;flex:1}.summary-copy strong,.summary-copy small{display:block}.summary-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.summary-copy small{margin-top:4px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chevron{font-size:22px;color:var(--muted)}.question-accordion[open] .chevron{transform:rotate(180deg)}.question-form{padding:0 14px 15px;border-top:1px solid var(--line)}.field-row-mobile{display:grid;grid-template-columns:1fr;gap:0}.advanced-fields{margin:12px 0;border:1px solid var(--line);border-radius:13px}.advanced-fields>summary{padding:13px;font-weight:800;color:var(--purple)}.advanced-fields>div{padding:0 12px}.review-publish{display:block}.progress{height:11px;border-radius:99px;background:#eaecf0;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,var(--green),#5ed99b);border-radius:99px}.mission{text-align:center;padding-top:15px}.mascot{font-size:70px}.question-text{font-weight:900;font-size:26px;line-height:1.25;text-align:center;margin:23px 0}.options{display:grid;gap:10px}.option{border:2px solid var(--line);background:#fff;border-radius:16px;padding:15px;text-align:left;font-weight:800;min-height:54px}.option.selected{border-color:var(--purple);background:var(--purple-soft)}.feedback{border-radius:17px;padding:16px;margin:14px 0;line-height:1.45}.feedback.hint{background:var(--orange-soft);border:1px solid #fedf89}.feedback.good{background:var(--green-soft);border:1px solid #abefc6}.feedback.learn{background:var(--purple-soft);border:1px solid #d9d1ff}.score-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.score{padding:16px 10px;border-radius:18px;text-align:center;background:#f8f9fc}.score strong{display:block;font-size:29px}.score.mastery{background:var(--green-soft);color:var(--green-dark)}.confetti{font-size:36px}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}table{width:100%;border-collapse:collapse}th,td{padding:13px 10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{font-size:12px;text-transform:uppercase;color:var(--muted)}.notice{padding:13px 14px;border-radius:14px;background:#fffaeb;color:#7a2e0e;border:1px solid #fedf89;margin-bottom:12px}.empty{text-align:center;padding:30px;color:var(--muted)}.footer-note{text-align:center;color:var(--muted);font-size:12px;padding:22px}.voice-row{margin:10px 0 14px;display:grid;grid-template-columns:1fr 1fr}.voice-btn{background:#f5f3ff;color:var(--purple);border:1px solid #d9d1ff;min-height:44px;padding:10px 7px;font-size:13px}.teacher-results-card{margin-top:14px;margin-bottom:calc(22px + env(safe-area-inset-bottom));border:2px solid #d9d1ff}.teacher-results-button{min-height:56px;font-size:16px}.parent-summary-label{margin:18px 3px 0;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:var(--purple)}.parent-summary-card{border-color:#d9d1ff}
@media(min-width:720px){.app-shell{max-width:1040px;margin:0 auto}.topbar{padding:12px 22px}main{max-width:760px;padding:22px 20px 60px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{padding:30px}.hero h1{font-size:42px}.capture-actions{grid-template-columns:1fr 1fr}.selected-pages{grid-template-columns:repeat(3,minmax(0,1fr))}.mobile-sticky-action{position:static;margin-top:16px;padding:0;background:transparent;border:0;box-shadow:none}.field-row-mobile{grid-template-columns:1fr 1fr;gap:12px}.review-publish{margin-top:14px}.question-text{font-size:29px}}

.question-source-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.question-visual,.student-question-visual{margin:0 0 16px;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;text-align:center}
.question-visual img,.student-question-visual img{display:block;width:100%;max-height:440px;object-fit:contain;background:#fff}
.question-visual figcaption{padding:8px 10px;font-size:12px;color:var(--muted);border-top:1px solid var(--line)}
.student-question-visual{padding:8px}
.student-question-visual img{border-radius:10px}
@media(max-width:650px){
  .question-visual img,.student-question-visual img{max-height:340px}
}


.time-answer{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:end;max-width:420px;margin:0 auto}.time-answer .field{margin:0}.time-answer input{text-align:center;font-size:24px;font-weight:900;letter-spacing:.04em}.time-colon{font-size:34px;font-weight:900;line-height:48px;color:var(--navy);padding-bottom:1px}.student-question-visual img,.question-visual img{width:100%;height:auto;max-height:none;object-fit:contain}.student-question-visual{overflow:auto;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px}.student-question-visual img{min-width:100%;display:block}@media(max-width:650px){.time-answer{gap:7px}.time-answer input{font-size:22px;padding:13px 8px}.time-colon{font-size:30px}}


.question-image-actions{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin:10px 0 14px;
}
.visual-missing-note{
  padding:13px;
  margin-bottom:10px;
  border:1px dashed #cfc6fb;
  border-radius:14px;
  background:#faf9ff;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.crop-editor-open{overflow:hidden}
.crop-editor-overlay{
  position:fixed;
  inset:0;
  z-index:1000;
  background:#0d1024;
  color:#fff;
}
.crop-editor-shell{
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto auto;
  height:100dvh;
  max-width:900px;
  margin:0 auto;
  background:#11152e;
}
.crop-editor-header{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  padding-top:calc(10px + env(safe-area-inset-top));
  border-bottom:1px solid rgba(255,255,255,.12);
  background:#151a3a;
}
.crop-editor-header .btn.ghost{color:#fff}
.crop-editor-header strong,.crop-editor-header small{display:block}
.crop-editor-header small{margin-top:2px;color:#bac1dc;font-size:12px}
.crop-save-top{padding:10px 13px;min-height:42px}
.crop-instructions{
  padding:9px 14px;
  text-align:center;
  color:#d9def4;
  font-size:13px;
  background:#1a2046;
}
.crop-stage{
  min-height:0;
  overflow:auto;
  padding:12px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  touch-action:none;
}
.crop-image-wrap{
  position:relative;
  display:inline-block;
  max-width:100%;
  max-height:100%;
  line-height:0;
  user-select:none;
  touch-action:none;
}
.crop-image-wrap>img{
  display:block;
  max-width:100%;
  /* Fit the image within the STAGE area (the 1fr grid row), not the whole
     viewport, so the header, instructions, preview and footer buttons never
     overlap it. The stage scrolls if the image is still taller than the space. */
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  pointer-events:none;
}
.crop-image-wrap:after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.46);
  pointer-events:none;
}
.crop-selection{
  position:absolute;
  z-index:2;
  border:3px solid #52e0a0;
  box-shadow:0 0 0 9999px rgba(0,0,0,.18);
  cursor:move;
  touch-action:none;
}
.crop-selection:before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.08);
}
.crop-handle{
  position:absolute;
  z-index:3;
  width:30px;
  height:30px;
  border-radius:50%;
  border:3px solid #fff;
  background:#6543d9;
  box-shadow:0 3px 10px rgba(0,0,0,.35);
  touch-action:none;
}
.crop-handle-se{right:-16px;bottom:-16px;cursor:nwse-resize}
.crop-preview-panel{
  border-top:1px solid rgba(255,255,255,.1);
  background:#151a3a;
}
.crop-preview-panel>summary{
  padding:9px 14px;
  cursor:pointer;
  list-style:revert;
}
.crop-preview-panel>summary::-webkit-details-marker{display:inline-block}
.crop-preview-panel[open] #cropPreview{padding:0 14px 10px}
.crop-preview-panel strong{font-size:13px}
.crop-preview-placeholder{margin-top:5px;color:#aeb7d7;font-size:12px}
.crop-editor-actions{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:#fff;
}
.crop-editor-actions .btn{min-height:46px}
.crop-editor-actions .btn.block{width:100%}
.crop-more-actions>summary{
  list-style:none;
  cursor:pointer;
  text-align:center;
}
.crop-more-actions>summary::-webkit-details-marker{display:none}
.crop-more-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:8px;
}
.crop-more-grid .btn.danger{grid-column:1/-1}
@media(min-width:720px){
  .question-image-actions{grid-template-columns:auto auto;justify-content:start}
  .crop-more-grid{grid-template-columns:repeat(3,1fr)}
  .crop-more-grid .btn.danger{grid-column:auto}
}


.teacher-check-card{
  margin:12px 0;
  padding:14px;
  border:1px solid #fedf89;
  border-radius:16px;
  background:#fffaeb;
}
.teacher-check-card strong{display:block;color:#93370d}
.teacher-check-card p{margin:6px 0 10px;color:#7a2e0e;font-size:13px;line-height:1.45}
.visual-working{
  margin:9px 0;
  padding:10px;
  border-radius:12px;
  background:#fff;
  border:1px solid #fecdca;
  font-size:13px;
}
.visual-working span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;font-weight:800;margin-bottom:4px}
.confirm-check{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:#344054}
.confirm-check input{width:20px;height:20px;margin:0;flex:0 0 auto}

.drawing-answer{display:grid;gap:10px}
.drawing-instruction{
  padding:11px 13px;
  border-radius:13px;
  background:var(--purple-soft);
  color:var(--purple);
  font-weight:700;
  font-size:13px;
}
.drawing-canvas-wrap{
  position:relative;
  width:100%;
  overflow:hidden;
  border:2px solid #d9d1ff;
  border-radius:16px;
  background:#fff;
  touch-action:none;
}
.drawing-canvas-wrap img{
  display:block;
  width:100%;
  height:auto;
  max-height:62vh;
  object-fit:contain;
  pointer-events:none;
}
.drawing-canvas-wrap canvas{
  position:absolute;
  inset:0;
  z-index:2;
  touch-action:none;
  cursor:crosshair;
}
.drawing-tools{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}


.saved-confirmation{
  display:inline-flex;
  align-items:center;
  margin-top:8px;
  padding:8px 12px;
  border-radius:999px;
  background:var(--green-soft);
  color:var(--green-dark);
  font-size:13px;
  font-weight:800;
}

.history-list{display:grid;gap:12px;margin-bottom:18px}.history-card{display:grid;gap:14px;padding:17px;border:1px solid var(--line);border-radius:20px;background:#fff}.history-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.history-actions .btn{text-decoration:none}.answer-with-unit{display:flex;align-items:stretch;border:1px solid #d0d5dd;border-radius:14px;overflow:hidden;background:#fff}.answer-with-unit input{border:0;flex:1;min-width:0}.sign-toggle{border:0;border-right:1px solid #d0d5dd;background:#f2f4f7;font-weight:900;font-size:20px;min-width:52px;cursor:pointer;color:#344054;line-height:1}.sign-toggle:active{background:#e4e7ec}.answer-unit{display:flex;align-items:center;justify-content:center;min-width:58px;padding:0 13px;background:#f2f4f7;border-left:1px solid #d0d5dd;font-weight:800}.multipart-editor,.multipart-answer{display:grid;gap:12px;margin:12px 0}.part-editor,.student-part{padding:14px;border:1px solid #d9d1ff;border-radius:16px;background:#faf9ff}.part-label,.student-part-heading>span{display:inline-grid;place-items:center;min-width:30px;height:30px;margin-right:8px;border-radius:10px;background:var(--purple);color:#fff;font-weight:900}.student-part-heading{display:flex;align-items:flex-start;margin-bottom:11px;font-weight:800}@media(min-width:720px){.history-card{grid-template-columns:minmax(0,1fr) auto;align-items:center}}

.multipart-warning{
  margin:10px 0 12px;
  border-color:#fdb022;
  background:#fffaeb;
}

.field-help{display:block;margin-top:5px;color:var(--muted);font-size:12px}.child-history-card{margin-top:14px}.small-spinner{width:38px;height:38px;border-width:5px}.parent-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.mini-score{padding:12px 8px;border-radius:15px;background:#f8f9fc;text-align:center}.mini-score span{display:block;font-size:11px;color:var(--muted)}.mini-score strong{display:block;margin-top:5px;font-size:23px}.mini-score.mastery{background:var(--green-soft);color:var(--green-dark)}.progress-history-list{display:grid;gap:9px}.progress-history-item{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px}.progress-history-item span{display:block;color:var(--muted);font-size:12px}.history-score-pair{display:flex;gap:7px}.history-score-pair span,.history-score-pair strong{padding:7px 8px;border-radius:10px;background:#f2f4f7}.history-score-pair strong{background:var(--green-soft);color:var(--green-dark)}


.understanding-hero{
  display:grid;
  gap:14px;
  padding:18px;
  margin:14px 0;
  border-radius:20px;
  background:linear-gradient(145deg,var(--navy),var(--navy-2));
  color:#fff;
}
.understanding-hero .small{color:#cbd3ff;font-weight:800;letter-spacing:.08em}
.understanding-hero>div>strong{display:block;font-size:44px;line-height:1;margin:7px 0}
.understanding-hero p{margin:0;color:#dfe4ff;font-size:13px;line-height:1.5}
.understanding-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.understanding-counts span{padding:9px 7px;border-radius:12px;background:rgba(255,255,255,.1);text-align:center;font-size:11px}
.understanding-counts b{display:block;font-size:20px}
.understanding-section{margin-top:18px}
.understanding-section h4{margin:0 0 10px}
.understanding-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 90px 48px;
  gap:9px;
  align-items:center;
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.understanding-label strong,.understanding-label span{display:block}
.understanding-label span{margin-top:3px;color:var(--muted);font-size:11px}
.understanding-meter{height:10px;border-radius:999px;background:#eaecf0;overflow:hidden}
.understanding-meter>div{height:100%;border-radius:999px;background:var(--purple)}
.understanding-value{font-size:12px;font-weight:900;text-align:right}
.understanding-value.secure{color:var(--green-dark)}
.understanding-value.developing{color:#b54708}
.understanding-value.priority{color:var(--red)}
.understanding-value.insufficient_evidence{color:var(--muted)}
@media(min-width:620px){
  .understanding-hero{grid-template-columns:minmax(0,1fr) 260px;align-items:end}
}

.hint-entry-btn{border:1px solid #d9d1ff;background:#faf9ff;color:var(--purple)}
.hint-ladder-card{max-width:720px;margin:0 auto}.hint-tier-badge{display:table;margin:0 auto 12px;padding:7px 11px;border-radius:999px;background:var(--purple-soft);color:var(--purple);font-size:12px;font-weight:900}.hint-tier-content{font-size:17px;line-height:1.6}.hint-more-separator{display:flex;align-items:center;gap:10px;margin:17px 0 10px;color:var(--muted);font-size:12px}.hint-more-separator:before,.hint-more-separator:after{content:"";height:1px;flex:1;background:var(--line)}.hint-final-note{margin:14px 4px 0;text-align:center;line-height:1.5}.hint-editor{display:grid;gap:10px;margin:12px 0;padding:14px;border:1px solid #d9d1ff;border-radius:16px;background:#faf9ff}.hint-editor-heading strong,.hint-editor-heading span{display:block}.hint-editor-heading span{margin-top:4px;color:var(--muted);font-size:12px;line-height:1.45}.hint-editor-field{margin:0}


.landing-hero{margin-bottom:18px}
.paper-comparison{
  padding:22px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 8px 28px rgba(20,31,84,.07);
}
.paper-comparison-kicker{
  display:inline-block;
  margin-bottom:9px;
  color:var(--purple);
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.paper-comparison h2{
  max-width:720px;
  margin:0 0 12px;
  font-size:clamp(24px,4vw,36px);
  line-height:1.13;
}
.paper-comparison p{
  max-width:780px;
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.65;
}
.demo-age-card{max-width:680px;margin:0 auto}
.age-choice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.age-choice{
  min-height:104px;
  border:2px solid #e3defe;
  border-radius:18px;
  background:#faf9ff;
  color:var(--navy);
  cursor:pointer;
}
.age-choice strong{
  display:block;
  color:var(--purple);
  font-size:34px;
  line-height:1;
}
.age-choice span{
  display:block;
  margin-top:7px;
  font-size:13px;
  font-weight:700;
}
.age-choice:hover,.age-choice:focus{
  border-color:var(--purple);
  background:var(--purple-soft);
  transform:translateY(-1px);
}
.demo-age-note{
  margin:16px 4px 0;
  text-align:center;
  line-height:1.5;
}
@media(min-width:560px){
  .age-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}


.interaction-editor{
  display:grid;
  gap:10px;
  margin:12px 0;
  padding:14px;
  border:1px solid #cfd7ff;
  border-radius:16px;
  background:#f8f9ff;
}
.coordinate-grid{
  display:block;
  width:min(100%,420px);
  /* The SVG uses viewBox="0 0 320 320" (a square) but had no CSS height, so on
     mobile engines like Samsung Internet it collapsed to ~0px and the grid,
     axes and labels rendered invisibly. aspect-ratio locks it to a square that
     matches the viewBox; the height fallback covers engines without
     aspect-ratio support. */
  aspect-ratio:1/1;
  height:auto;
  margin:12px auto;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  touch-action:manipulation;
}
@supports not (aspect-ratio:1/1){
  /* Older engines: fall back to a fixed square that matches width(min,420). */
  .coordinate-grid{height:min(100vw,420px)}
}
.coordinate-grid .grid-line{stroke:#e4e7ec;stroke-width:1}
.coordinate-grid .axis{stroke:#344054;stroke-width:2}
.coordinate-grid text{fill:#667085;font-size:9px;pointer-events:none}
.point-marker{fill:var(--purple);pointer-events:none}
.point-marker-halo{fill:none;stroke:rgba(108,65,226,.25);stroke-width:7;pointer-events:none}
.selected-coordinate{text-align:center;color:var(--muted)}
.matching-interaction{margin-top:14px}
.matching-board{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  min-height:220px;
  padding:12px 4px;
}
.matching-column{display:grid;align-content:start;gap:14px;z-index:2}
.match-item{
  min-height:52px;
  padding:10px;
  border:2px solid #d9d1ff;
  border-radius:14px;
  background:#fff;
  color:var(--navy);
  font-weight:800;
}
.match-item.selected{border-color:var(--purple);background:var(--purple-soft)}
.match-item.matched{border-color:#6ce9a6;background:#ecfdf3}
.matching-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
  z-index:1;
}
.matching-lines line{stroke:var(--purple);stroke-width:4;stroke-linecap:round}
.matching-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:13px}
@media(max-width:480px){
  .matching-board{gap:28px}
  .match-item{font-size:13px}
}

.brand-link{color:inherit;text-decoration:none}.landing-actions{margin-top:22px}.workflow-grid{display:grid;gap:12px;margin-top:18px}.workflow-grid article{padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}.workflow-grid article>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--purple-soft);color:var(--purple);font-weight:900}.workflow-grid h3{margin:10px 0 5px}.workflow-grid p{margin:0;color:var(--muted);line-height:1.5}.access-grid{display:grid;gap:14px}.review-tabs{display:flex;gap:8px;overflow:auto;margin-bottom:14px}.hidden{display:none!important}.ranking-list{display:grid;gap:8px}.ranking-row{display:grid;grid-template-columns:40px 1fr auto;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px}.ranking-row>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--purple-soft);color:var(--purple);font-weight:900}
.fraction-answer{display:grid;grid-template-columns:1fr 40px 1fr;align-items:end;gap:10px;max-width:420px;margin:12px auto}.fraction-bar{height:3px;background:var(--navy);align-self:center}.fraction-pieces{display:flex;max-width:460px;margin:12px auto}.fraction-piece{flex:1;aspect-ratio:1;border:2px solid var(--purple);background:#fff}.fraction-piece.selected{background:var(--purple)}.drag-bank{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:14px}.drag-object{width:48px;height:48px;border-radius:50%;border:2px solid var(--purple);background:#fff;color:var(--purple);font-size:25px}.drag-object.placed{opacity:.3}.drop-zone{min-height:130px;display:grid;place-items:center;align-content:center;border:3px dashed #9b8afb;border-radius:22px;background:#faf9ff}.drop-zone span{color:var(--muted)}.clock-face{width:min(100%,360px);aspect-ratio:1/1;height:auto;display:block;margin:auto;touch-action:none}.clock-face>circle{fill:#fff;stroke:var(--navy);stroke-width:5}.clock-numbers text{font-size:18px;font-weight:800}.hour-hand{stroke:var(--navy);stroke-width:10;stroke-linecap:round}.minute-hand{stroke:var(--purple);stroke-width:7;stroke-linecap:round}.clock-pin{fill:var(--green)}.angle-tool{display:block;width:min(100%,440px);aspect-ratio:240/190;height:auto;margin:auto}.protractor{fill:none;stroke:#d0d5dd;stroke-width:18}.angle-base,.angle-ray{stroke:var(--navy);stroke-width:7;stroke-linecap:round}.angle-ray{stroke:var(--purple)}.angle-handle{fill:var(--green)}.angle-slider{width:100%}
@media(min-width:720px){.workflow-grid{grid-template-columns:repeat(3,1fr)}.access-grid{grid-template-columns:1fr 1fr}}

.coordinate-answer-card{max-width:520px;margin:14px auto;padding:18px;border:1px solid #d9d1ff;border-radius:20px;background:#faf9ff}.coordinate-answer-title{text-align:center;font-weight:900;margin-bottom:14px}.coordinate-pair-input{display:grid;grid-template-columns:auto minmax(80px,1fr) auto minmax(80px,1fr) auto;gap:10px;align-items:end}.coordinate-field label{display:block;text-align:center;color:var(--purple);font-weight:900}.coordinate-field input{width:100%;min-height:56px;text-align:center;font-size:24px;font-weight:900}.coordinate-bracket,.coordinate-comma{align-self:center;padding-bottom:8px;font-size:32px;font-weight:700}.coordinate-help{text-align:center;margin:12px 0 0}.grid-point-dot{fill:#98a2b3;opacity:.9;pointer-events:none}.selected-point-green{fill:#12b76a;stroke:#067647;stroke-width:2;pointer-events:none}.selected-point-halo{fill:rgba(18,183,106,.16);stroke:rgba(18,183,106,.35);stroke-width:5;pointer-events:none}


.history-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.history-actions .btn{
  flex:1 1 145px;
  text-align:center;
  text-decoration:none;
}
@media(max-width:520px){
  .history-actions{
    width:100%;
  }
  .history-actions .btn{
    flex-basis:100%;
  }
}


.review-role-grid{display:grid;gap:14px}
.review-role-card{display:flex;flex-direction:column}
.review-role-card .btn{margin-top:auto}
.review-role-icon{font-size:34px;margin-bottom:8px}
.access-grid.signin-only{max-width:560px;margin:0 auto;grid-template-columns:1fr}
.navigation-recovery{max-width:560px;margin:0 auto}
.navigation-recovery .btn+.btn{margin-top:8px}
.navigation-recovery p{margin:16px 0 0;word-break:break-all}
@media(min-width:720px){.review-role-grid{grid-template-columns:1fr 1fr}}

/* --- Student performance report (v2.5) --- */
.section-label{font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:22px 0 10px}
.report-card{border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:16px 0;background:#fff}
.report-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:linear-gradient(135deg,#11152e,#232a52);color:#fff}
.report-head h2{margin:0;font-size:16px}
.report-updated{font-size:11px;color:#c2c8e6;text-transform:uppercase;letter-spacing:.5px}
.report-body{padding:16px}
.report-narrative{margin:0 0 14px;font-size:14.5px;line-height:1.55}
.report-narrative strong{color:var(--purple,#6b4eff)}
.report-row{display:grid;grid-template-columns:120px 1fr;gap:10px;padding:9px 0;border-top:1px solid #f0f1f6;font-size:13.5px;align-items:baseline}
.report-k{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.report-row.good .report-k{color:#12b76a}
.report-row.watch .report-k{color:#f79009}
.report-sub{margin-top:16px}
.report-sub h3{font-size:13.5px;margin:0 0 8px;display:flex;flex-wrap:wrap;gap:6px;align-items:baseline}
.report-tag-note{font-size:11px;font-weight:400;color:var(--muted);font-style:italic}
.mis-observed{background:#efeaff;border-left:3px solid #6b4eff;border-radius:8px;padding:9px 11px;margin:6px 0;font-size:13px}
.mis-typical{background:#fff4e5;border-left:3px solid #f79009;border-radius:8px;padding:9px 11px;margin:6px 0;font-size:13px;line-height:1.45}
.report-cap-note{margin:14px 0 0;font-size:12.5px;color:var(--muted);font-style:italic;border-top:1px dashed var(--line);padding-top:11px}

/* --- Reuse / set-for-another-class (v2.6) --- */
.reuse-banner{background:#eef6ff;border:1px solid #cfe4fb;border-left:3px solid #2e90fa;border-radius:12px;padding:11px 13px;margin:0 0 12px;font-size:13.5px;line-height:1.5}
.reuse-banner strong{color:#175cd3}
.history-actions .btn[href*="reuse-homework"]{}

/* --- Multiple-choice fallback when options are missing (v2.7) --- */
.mc-fallback-note{font-size:13.5px;color:var(--muted);margin:4px 0 8px}

/* --- Suggest MC answers (v2.9) --- */
.suggest-options-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:2px 0 6px}
.suggest-hint{font-size:12px}
.suggest-result:empty{display:none}
.suggest-result{margin:4px 0 8px}
.suggest-loading,.suggest-error{font-size:13px;padding:8px 10px;border-radius:8px}
.suggest-loading{background:#eef2ff;color:#3f4ba8}
.suggest-error{background:#fef3f2;color:#b42318}
.suggest-done{background:#f6f8ff;border:1px solid #e0e6fb;border-radius:10px;padding:10px 12px}
.suggest-correct{font-size:13.5px;margin-bottom:4px}
.suggest-distractor-label{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);margin:6px 0 2px}
.suggest-distractors{margin:0;padding-left:18px;font-size:13px}
.suggest-distractors li{margin:2px 0}

/* --- Post-test learning story (v2.11) --- */
.learning-story{margin-top:14px;border:1px solid #d9d1ff;background:linear-gradient(135deg,#faf9ff,#f3efff)}
.learning-story h3{margin:0 0 10px;font-size:15px;color:#5b3fd6}
.learning-story p{margin:8px 0;font-size:14.5px;line-height:1.5}
.learning-story strong{color:#5b3fd6}

/* --- Number sequence input (v2.14) --- */
.sequence-answer{margin:6px 0}
.sequence-hint{font-size:12.5px;color:var(--muted);margin-bottom:6px}
.sequence-boxes{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sequence-box{width:64px;text-align:center;font-size:18px;font-weight:700;padding:12px 6px;border:1px solid #d0d5dd;border-radius:12px}
.sequence-sep{font-weight:800;color:var(--muted)}
.sequence-note{font-size:12.5px;margin-top:8px}

/* --- Level Up + report focus (v2.15) --- */
.level-up-card{border:2px solid #f79009;background:linear-gradient(135deg,#fff8ef,#fff1de);text-align:center}
.level-up-badge{display:inline-block;background:#f79009;color:#fff;font-weight:900;font-size:12px;letter-spacing:1px;padding:4px 12px;border-radius:20px;margin-bottom:6px}
.level-up-card h3{margin:6px 0;color:#b54708}
.report-focus{background:#fff4e5;border-left:3px solid #f79009;border-radius:10px;padding:10px 12px;margin:10px 0;font-size:14px;line-height:1.5}
.report-focus-tag{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#b54708;font-weight:700;margin-bottom:3px}

/* --- AM/PM toggle for time answers (v2.16) --- */
.meridiem-toggle{display:inline-flex;border:1px solid #d0d5dd;border-radius:12px;overflow:hidden;margin-left:8px;align-self:flex-end;margin-bottom:2px}
.meridiem-btn{border:0;background:#f2f4f7;font-weight:800;font-size:15px;padding:12px 16px;cursor:pointer;color:#475467;min-width:52px}
.meridiem-btn+.meridiem-btn{border-left:1px solid #d0d5dd}
.meridiem-btn.selected{background:var(--purple,#6b4eff);color:#fff}

/* --- Per-box units for conversion sequences (v2.24) --- */
.sequence-unit-group{display:inline-flex;align-items:center;gap:4px;margin-right:10px}
.sequence-unit{font-weight:800;color:var(--muted,#667085);font-size:15px}

/* --- AI-read-image banner on added questions (v2.29) --- */
.ai-read-banner{display:flex;align-items:center;gap:8px;font-size:13px;color:#3f4ba8;background:#eef2ff;border-radius:8px;padding:8px 10px;margin:8px 0}
.spinner-inline{width:14px;height:14px;border:2px solid #c7d0f5;border-top-color:#3f4ba8;border-radius:50%;display:inline-block;animation:spin 0.8s linear infinite}
.ai-read-error{color:#b42318}
@keyframes spin{to{transform:rotate(360deg)}}

/* --- Correction-feedback impact loop (v2.31) --- */
.impact-card{background:linear-gradient(135deg,#fbf6e9,#f4f6fa);border:1px solid #ecdfba}
.impact-row{display:flex;align-items:baseline;gap:10px;margin:6px 0}
.impact-num{font-size:30px;font-weight:800;color:#1F2A44;line-height:1}
.impact-label{color:#33415C;font-weight:600;font-size:14px}
.impact-note{margin:10px 0 2px;color:#5A6474;font-size:13px;line-height:1.5}

/* --- Owner corrections dashboard (v2.32) --- */
.owner-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.owner-table th{text-align:left;color:#5A6474;font-weight:700;border-bottom:2px solid #E2E6ED;padding:6px 8px}
.owner-table td{padding:6px 8px;border-bottom:1px solid #EEF1F6;color:#333;vertical-align:top}
.owner-table tr:nth-child(even) td{background:#F9FAFC}

/* ============================================================
   Landing page v2 — "friendly" direction (v2.35)
   Scoped under .landing2 so it can't collide with app styles.
   ============================================================ */
.landing2{--l-ink:#20304a;--l-soft:#54627a;--l-green:#12b886;--l-green-deep:#0c9b73;--l-violet:#6c5ce7;--l-sun:#ffd43b;--l-sky:#e7f5ff;--l-mint:#e6fcf5;--l-wash:#f6f8fc;margin:-8px -4px 0}
.landing2 *{box-sizing:border-box}

.landing2 .l-hero{background:linear-gradient(160deg,#eef4ff 0%,#e6fcf5 100%);border-radius:26px;padding:30px 22px 34px;text-align:center;position:relative;overflow:hidden}
.landing2 .l-eyebrow{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid #d8e6ff;color:var(--l-violet);font-weight:800;font-size:12.5px;padding:6px 14px;border-radius:999px;margin-bottom:16px}
.landing2 .l-eyebrow .d{width:8px;height:8px;background:var(--l-green);border-radius:50%}
.landing2 .l-hero h1{font-size:clamp(30px,7vw,42px);line-height:1.08;font-weight:800;letter-spacing:-1px;margin:0 0 14px;color:var(--l-ink)}
.landing2 .l-hero h1 em{font-style:normal;color:var(--l-green-deep);position:relative;white-space:nowrap}
.landing2 .l-hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:1px;height:9px;background:var(--l-sun);opacity:.55;border-radius:4px;z-index:-1}
.landing2 .l-sub{font-size:16.5px;color:var(--l-soft);max-width:520px;margin:0 auto 22px;line-height:1.55}
.landing2 .l-cta-row{display:flex;gap:11px;justify-content:center;flex-wrap:wrap}
.landing2 .l-btn{border:none;border-radius:13px;padding:15px 24px;font-weight:800;font-size:16px;cursor:pointer;text-decoration:none;display:inline-block;transition:transform .12s}
.landing2 .l-btn:hover{transform:translateY(-2px)}
.landing2 .l-btn-primary{background:var(--l-green);color:#fff;box-shadow:0 8px 20px rgba(18,184,134,.32)}
.landing2 .l-btn-ghost{background:#fff;color:var(--l-ink);border:2px solid #e2e8f4}
.landing2 .l-trust{margin-top:18px;font-size:13.5px;color:var(--l-soft);font-weight:700}

.landing2 .l-device{margin:28px auto 0;max-width:250px;background:#fff;border-radius:24px;padding:11px;box-shadow:0 22px 44px rgba(32,48,74,.16);border:1px solid #eef1f7}
.landing2 .l-screen{background:var(--l-wash);border-radius:15px;padding:12px;text-align:left}
.landing2 .l-qcard{background:#fff;border-radius:11px;padding:11px 12px;box-shadow:0 2px 8px rgba(32,48,74,.06);margin-bottom:8px}
.landing2 .l-qcard:last-child{margin-bottom:0}
.landing2 .l-qcard .qt{font-size:11px;color:var(--l-green-deep);font-weight:800}
.landing2 .l-qcard .qn{font-weight:800;font-size:14px;color:var(--l-ink)}
.landing2 .l-ok{display:inline-block;background:var(--l-mint);color:var(--l-green-deep);font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;margin-top:5px}
.landing2 .l-hint{display:inline-block;background:#fff4e6;color:#e8590c;font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;margin-top:5px}

.landing2 .l-section{padding:40px 4px 8px}
.landing2 .l-kicker{text-align:center;color:var(--l-violet);font-weight:800;font-size:13px;letter-spacing:.5px;text-transform:uppercase;margin-bottom:6px}
.landing2 .l-section h2{text-align:center;font-size:clamp(24px,5vw,32px);font-weight:800;letter-spacing:-.5px;margin:0 auto 6px;color:var(--l-ink);max-width:560px}
.landing2 .l-secsub{text-align:center;color:var(--l-soft);font-size:16px;max-width:520px;margin:0 auto 26px;line-height:1.5}
.landing2 .l-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.landing2 .l-card{background:#fff;border:1.5px solid #eef1f7;border-radius:18px;padding:22px 20px;transition:transform .15s,box-shadow .15s}
.landing2 .l-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(32,48,74,.09)}
.landing2 .l-ic{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:13px}
.landing2 .l-ic1{background:var(--l-mint)} .landing2 .l-ic2{background:var(--l-sky)} .landing2 .l-ic3{background:#fff4e6}
.landing2 .l-card h3{font-size:18px;font-weight:800;margin:0 0 5px;color:var(--l-ink)}
.landing2 .l-card p{color:var(--l-soft);font-size:15px;margin:0;line-height:1.5}

.landing2 .l-how{background:var(--l-wash);border-radius:24px;padding:34px 22px;margin:26px 0 0}
.landing2 .l-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px}
.landing2 .l-step{text-align:center}
.landing2 .l-step .sn{width:42px;height:42px;border-radius:50%;background:var(--l-violet);color:#fff;font-weight:800;font-size:19px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.landing2 .l-step h4{font-size:17px;font-weight:800;margin:0 0 4px;color:var(--l-ink)}
.landing2 .l-step p{color:var(--l-soft);font-size:14.5px;margin:0;line-height:1.5}

.landing2 .l-final{text-align:center;background:linear-gradient(135deg,var(--l-violet),#5548d9);border-radius:24px;padding:40px 24px;color:#fff;margin:26px 0 8px}
.landing2 .l-final h2{color:#fff;font-size:clamp(24px,5vw,34px);font-weight:800;margin:0 0 10px}
.landing2 .l-final p{color:#e5e0ff;font-size:16.5px;margin:0 0 22px}
.landing2 .l-final .l-btn-primary{background:#fff;color:var(--l-violet)}

@media(max-width:640px){
  .landing2 .l-cards,.landing2 .l-steps{grid-template-columns:1fr}
}

/* --- Shade-a-fraction question type (v2.36) --- */
.shade-answer{margin-top:6px}
.shade-hint{font-weight:700;color:#33415C;margin-bottom:10px;font-size:15px}
.shade-grid{display:grid;gap:4px;margin:0 auto}
.shade-cell{aspect-ratio:1;background:#fff;border:2px solid #c9d3e4;border-radius:6px;cursor:pointer;transition:background .1s,border-color .1s;padding:0}
.shade-cell:hover{border-color:#6c5ce7}
.shade-cell.on{background:#6c5ce7;border-color:#5548d9}
.shade-count{text-align:center;margin-top:10px;color:#5A6474;font-weight:700;font-size:14px}
/* teacher preview */
.shade-preview{margin-top:12px}
.shade-grid-prev{gap:3px}
.shade-prev-cell{aspect-ratio:1;background:#f0f2f8;border:1.5px solid #c9d3e4;border-radius:4px;display:block}
.shade-warn{margin-top:10px;background:#fff4e6;border:1px solid #ffd8a8;color:#b34700;font-size:13px;font-weight:600;padding:9px 11px;border-radius:8px;line-height:1.45}
.shade-ok{margin-top:10px;background:#e6fcf5;border:1px solid #b2f2e5;color:#0c9b73;font-size:13px;font-weight:700;padding:9px 11px;border-radius:8px}

/* --- Gems motivation layer (v2.38) --- */
.gems-card{background:linear-gradient(135deg,#eef4ff,#e6fcf5);border:1.5px solid #cfe3ff;text-align:center}
.gems-earned{font-size:22px;font-weight:800;color:#1f2a44;display:flex;align-items:center;justify-content:center;gap:8px}
.gems-earned .gem{font-size:24px}
.gems-total{margin-top:6px;color:#33415c;font-weight:600}
.gems-total strong{color:#6c5ce7;font-size:18px}
.gems-note{margin-top:8px;color:#5a6474;font-size:13px}

/* --- Gem total banner on the mission screen (v2.43) --- */
.gem-banner{background:linear-gradient(135deg,#eef4ff,#e6fcf5);border:1.5px solid #cfe3ff;border-radius:14px;padding:12px 16px;margin:0 0 14px;font-size:16px;color:#33415c;text-align:center}
.gem-banner strong{color:#6c5ce7;font-size:20px}

/* --- Class insights (growth/independence) (v2.44) --- */
.insight-block .insight-h{margin:0 0 2px;font-size:17px;color:#1f2a44}
.insight-block .ranking-row{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;background:#fff;border:1px solid #eef1f7;border-radius:10px;margin-top:7px}
.insight-block .ranking-row b{color:#6c5ce7}

/* --- Insights "how it works" explainer (v2.45) --- */
.insight-how{background:#f7f9fc;border:1px solid #e4e8f0;border-radius:12px;padding:4px 14px;margin-bottom:16px}
.insight-how summary{cursor:pointer;font-weight:700;color:#33415c;padding:10px 0;font-size:14px}
.insight-how-body{padding:4px 0 12px;font-size:13.5px;color:#5a6474;line-height:1.55}
.insight-how-body ul{margin:6px 0;padding-left:20px}
.insight-how-body li{margin:2px 0}
.insight-how-gems{background:#eef4ff;border-radius:8px;padding:9px 11px;margin-top:10px;color:#33415c}

/* --- Verve brand lockup (logo + wordmark) --- */
.brand-lockup{display:flex;align-items:center;gap:9px}
.brand-mark{display:block;border-radius:8px;flex:0 0 auto}

/* --- Clickable student name in the results dashboard (v2.48) --- */
.student-link{color:var(--verve);text-decoration:none;border-bottom:1.5px solid transparent;transition:border-color .12s}
.student-link:hover,.student-link:focus{border-bottom-color:var(--verve)}
.student-link strong{color:inherit}

/* --- Hardest-questions insight on results dashboard (v2.49) --- */
.hardest-card{border:1.5px solid var(--amber-soft);background:linear-gradient(135deg,#fffdf7,#fff9ee)}
.hardest-q{margin-top:12px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:12px}
.hardest-q-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.hardest-q-num{font-weight:800;color:var(--verve);background:var(--verve-soft);border-radius:8px;padding:2px 10px;font-size:14px}
.hardest-q-under{font-weight:700;color:#b45309;font-size:13px}
.hardest-q-prompt{color:var(--ink);font-weight:600;line-height:1.4}
.hardest-q-meta{margin-top:6px;color:var(--muted);font-size:12.5px}

/* --- Small groups to pull aside (question-first, v2.53) --- */
.individual-card{border:1.5px solid var(--indigo-soft)}
.group-q{padding:10px 0;border-top:1px solid var(--line)}
.group-q:first-of-type{border-top:none}
.group-q-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.group-q-num{font-weight:800;color:var(--indigo);background:var(--indigo-soft);border-radius:8px;padding:2px 9px;font-size:13px;flex:0 0 auto}
.group-q-prompt{color:var(--ink);font-weight:600;line-height:1.4}
.group-q-names{margin-top:4px;color:var(--muted);font-size:13px}
.group-q-names strong{color:var(--ink)}

/* ===== Coins answer type (v2.57) ===== */
.coins-answer{margin-top:8px}
.coins-hint{font-size:13.5px;color:var(--muted);margin-bottom:10px}
.coins-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:380px){.coins-grid{gap:9px}}
.coin-btn{position:relative;display:flex;align-items:center;justify-content:center;background:none;border:none;padding:4px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.coin-face{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;border-radius:50%;font-weight:800;font-size:16px;color:#3a2d10;box-shadow:0 2px 5px rgba(0,0,0,.18),inset 0 2px 3px rgba(255,255,255,.5),inset 0 -3px 5px rgba(0,0,0,.12);border:2px solid rgba(0,0,0,.12);transition:transform .08s,box-shadow .12s;user-select:none}
.coin-btn:active .coin-face{transform:scale(.92)}
/* copper 1p/2p */
.coin-1,.coin-2{background:radial-gradient(circle at 38% 32%,#d99a68,#b06a3c);color:#4a2a12}
/* silver 5p-50p */
.coin-5,.coin-10,.coin-20,.coin-50{background:radial-gradient(circle at 38% 32%,#e8ebef,#b9c0c9);color:#33383f}
/* gold £1/£2 */
.coin-100{background:radial-gradient(circle at 38% 32%,#f5d98a,#c9a747);color:#4a3a12}
.coin-200{background:radial-gradient(circle at 38% 32%,#f5d98a,#c9a747);color:#4a3a12;border:3px solid #a9b3bd}
.coin-selected .coin-face{box-shadow:0 0 0 3px var(--verve),0 2px 6px rgba(0,0,0,.2),inset 0 2px 3px rgba(255,255,255,.5)}
.coin-count{position:absolute;top:-4px;right:-2px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:var(--verve);color:#fff;font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.coin-count:empty{display:none}
.coins-tally{margin-top:14px;min-height:44px;padding:10px 12px;background:var(--verve-soft,#fff0f5);border-radius:12px}
.coins-tally-empty{color:var(--muted);font-size:13.5px}
.coins-chips{display:flex;flex-wrap:wrap;gap:6px}
.coin-chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 6px 3px 10px;font-size:13px;font-weight:600;color:var(--ink)}
.coin-chip button{width:22px;height:22px;border-radius:50%;border:none;background:#f0e6ec;color:var(--verve);font-weight:800;font-size:15px;line-height:1;cursor:pointer}
.coins-total{margin-top:8px;font-weight:700;color:var(--ink)}
.coins-clear{margin-top:10px;font-size:13px}

/* ===== Site footer with legal links (v2.58) ===== */
.site-footer{margin-top:8px;padding:18px 16px 26px;border-top:1px solid var(--line);text-align:center}
.site-footer-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;font-size:13.5px}
.site-footer-links a{color:var(--muted);text-decoration:none;border-bottom:1px solid transparent;transition:color .12s,border-color .12s}
.site-footer-links a:hover{color:var(--verve);border-bottom-color:var(--verve)}
.site-footer-sep{color:var(--line)}
.site-footer-legal{margin-top:10px;font-size:12px;color:var(--muted);max-width:560px;margin-left:auto;margin-right:auto;line-height:1.5}

/* Legal pages */
.legal-page{max-width:640px;margin:0 auto}
.legal-page h1{margin-bottom:6px}
.legal-page h2{margin-top:22px;margin-bottom:6px;font-size:18px;color:var(--ink)}
.legal-page p{line-height:1.6;color:#333;margin-bottom:10px}
.legal-callout{background:var(--verve-soft,#fff0f5);border-left:4px solid var(--verve);border-radius:10px;padding:12px 14px;margin:14px 0;line-height:1.55}
.legal-note{margin-top:18px;padding:11px 13px;background:#f6f7fb;border-radius:10px;font-size:13px;color:var(--muted);line-height:1.5}
.legal-page .small{font-size:12.5px}

/* ===== Contact page (v2.60) ===== */
.contact-card{background:var(--verve-soft,#fff0f5);border-radius:14px;padding:20px;margin:18px 0;text-align:center}
.contact-label{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.contact-email{display:inline-block;margin-top:6px;font-size:20px;font-weight:800;color:var(--verve);text-decoration:none;word-break:break-all}
.contact-list{margin:10px 0 0;padding-left:20px}
.contact-list li{margin-bottom:8px;line-height:1.5}
.contact-note{margin-top:16px;font-size:13.5px;color:var(--muted)}