.ctl-app { grid-template-rows: auto auto minmax(0, 1fr); }
.ctl-app button, .ctl-app input { font-family: inherit; }
.ctl-app .brand-logo { flex:0 1 auto; min-width:0; }
.ctl-app .brand-logo img { max-width:100%; }
.ctl-app button { cursor: pointer; }
.ctl-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 18px; background:#fff; border-bottom:1px solid #d8e2ea; font-weight:700; }
.ctl-toolbar div { display:flex; gap:8px; }
.ctl-toolbar label { display:flex; align-items:center; gap:6px; }
.ctl-toolbar select, .ctl-task select { min-height:44px; border:2px solid #c8d9e5; border-radius:8px; padding:6px; background:#f8fbfd; color:#102131; font:inherit; min-width:0; }
.ctl-setup { align-items:center; }
.ctl-scores { display:flex; justify-content:space-between; gap:16px; flex:1; }
.ctl-scores .is-active { font-weight:800; color:#5042ae; }
.ctl-privacy { align-self:center; justify-self:center; text-align:center; max-width:520px; font-size:24px; }
.ctl-privacy p { margin:0 0 16px; }
.ctl-privacy button { max-width:430px; }
.ctl-toolbar button, .ctl-action, .ctl-power label { min-height:44px; padding:8px 14px; border:2px solid #c8d9e5; border-radius:8px; background:#f8fbfd; color:#102131; font-weight:700; }
.ctl-page { width:min(1420px, 100%); min-height:0; padding:12px 18px; margin:auto; height:100%; }
.ctl-board { height:100%; display:grid; grid-template-rows:auto minmax(0,1fr) auto auto; gap:10px; }
.ctl-stats { display:flex; align-items:center; justify-content:space-between; gap:12px; background:#fff; border:1px solid #d8e2ea; border-radius:8px; padding:10px 16px; font-size:clamp(16px,1.6vw,23px); }
.ctl-stats strong { font-size:1.12em; }
.ctl-play { display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:12px; min-height:0; }
.ctl-hand-panel, .ctl-task, .ctl-pairs { background:#fff; border:1px solid #d8e2ea; border-radius:8px; padding:12px; min-height:0; }
.ctl-hand-panel { display:grid; grid-template-rows:auto minmax(0,1fr); gap:8px; }
.ctl-hand-panel h2, .ctl-pairs h2 { margin:0; font-size:18px; }
.ctl-hand { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(var(--ctl-hand-rows,4),minmax(0,1fr)); gap:8px; min-height:0; }
.ctl-card { display:flex; justify-content:center; align-items:center; padding:4px; min-width:0; min-height:44px; border:2px solid #b9cfdf; border-radius:8px; background:#fbfdff; color:#102131; font-size:clamp(30px,3.3vw,52px); font-weight:800; line-height:1.1; }
.ctl-card[aria-pressed="true"] { outline:3px solid #149bd7; outline-offset:-4px; background:#e9f6ff; border-color:#0875a9; }
.ctl-card:focus-visible, .ctl-action:focus-visible, .ctl-toolbar button:focus-visible { outline:3px solid #6d5fd0; outline-offset:2px; }
.ctl-card.is-empty { visibility:hidden; }
.ctl-card:disabled { cursor:default; }
.ctl-task { display:flex; flex-direction:column; gap:6px; justify-content:center; }
.ctl-task h2 { margin:0; font-size:20px; line-height:1.25; }
.ctl-task form { display:grid; gap:4px; }
.ctl-task label { font-size:18px; font-weight:700; }
.ctl-task input[type="text"] { width:100%; min-height:44px; font-size:28px; padding:4px 12px; border:2px solid #8eaec4; border-radius:8px; box-sizing:border-box; }
.ctl-request { margin:0; font-size:clamp(20px,1.8vw,26px); line-height:1.3; min-height:2.6em; }
.ctl-power { display:flex; gap:8px; }
.ctl-power label { flex:1; display:flex; align-items:center; gap:5px; padding-inline:8px; font-size:17px; }
.ctl-action { width:100%; font-size:18px; }
.ctl-action.primary { background:#6d5fd0; border-color:#5042ae; color:white; }
.ctl-action:disabled { opacity:.5; cursor:default; }
.ctl-clear { font-size:16px; }
.ctl-page:not([data-mode="computer"]) .ctl-task form { grid-template-columns:auto minmax(0,1fr); align-items:center; }
.ctl-page:not([data-mode="computer"]) .ctl-power { grid-column:1/-1; }
.ctl-page:not([data-mode="computer"]) #ctlTarget { grid-column:1; width:130px; font-size:16px; }
.ctl-page:not([data-mode="computer"]) #ctlAsk { grid-column:2; }
.ctl-page:not([data-mode="computer"]) .ctl-request { min-height:1.3em; }
.ctl-page:not([data-mode="computer"]) .ctl-pairs { display:block; height:122px; }
.ctl-page:not([data-mode="computer"])[data-count="2"] .ctl-pairs { height:100px; }
.ctl-page:not([data-mode="computer"]) .ctl-pair-list { gap:4px; }
.ctl-page:not([data-mode="computer"]) .ctl-pair { font-size:16px; }
@media screen and (min-width:1000px) and (max-height:699px) {
  .ctl-page:not([data-mode="computer"]) .ctl-pairs { height:100px; }
  .ctl-page:not([data-mode="computer"]) .ctl-task { gap:4px; }
  .ctl-page:not([data-mode="computer"]) .ctl-task form { gap:3px; }
}
.ctl-pairs { display:grid; grid-template-columns:1fr 1fr; gap:16px; height:82px; }
.ctl-pair-list { display:flex; flex-wrap:wrap; gap:6px; min-height:31px; padding-top:5px; }
.ctl-pair { border:1px solid #a8c8b7; background:#edfaf4; padding:4px; border-radius:6px; font-size:17px; font-weight:700; }
.ctl-feedback { margin:0; height:64px; display:flex; align-items:center; padding:8px 14px; border:2px solid #c8d9e5; border-radius:8px; background:#fff; font-size:clamp(18px,1.7vw,24px); font-weight:700; line-height:1.25; }
.ctl-feedback[data-tone="good"] { border-color:#1d8f5a; background:#edfaf4; }
.ctl-feedback[data-tone="retry"] { border-color:#e6a32a; background:#fff9ec; }
.ctl-hidden-count { white-space:nowrap; }
[hidden] { display:none !important; }
@media screen and (min-width:860px) and (max-height:699px) {
  .ctl-toolbar { padding-block:4px; }
  .ctl-page { padding:8px 12px; }
  .ctl-board { gap:6px; }
  .ctl-stats { padding:6px 12px; font-size:18px; }
  .ctl-hand-panel, .ctl-task, .ctl-pairs { padding:8px; }
  .ctl-hand-panel { gap:6px; }
  .ctl-task h2 { font-size:18px; }
  .ctl-request { font-size:20px; min-height:2.2em; }
  .ctl-task form { grid-template-columns:auto minmax(0,1fr); align-items:center; }
  .ctl-power, .ctl-task form > button { grid-column:1 / -1; }
  .ctl-pairs { height:72px; }
  .ctl-pair { font-size:16px; }
  .ctl-feedback { height:56px; font-size:18px; }
}
@media (max-width:859px) {
  .ctl-app { height:auto; min-height:100dvh; overflow:visible; }
  .ctl-page { height:auto; padding:12px; }
  .ctl-board { height:auto; }
  .ctl-pairs, .ctl-feedback { height:auto; min-height:70px; }
  .ctl-play { grid-template-columns:minmax(0,1fr) 280px; }
  .ctl-hand { grid-auto-rows:minmax(65px,1fr); grid-template-rows:repeat(4,minmax(65px,1fr)); }
}
@media screen and (min-width:860px) and (max-height:699px) {
  .ctl-app > .curriculum-tool-context { min-height:24px; padding-block:3px; }
  .ctl-app:has(> .curriculum-tool-context) .ctl-task { gap:2px; padding-block:6px; }
  .ctl-app:has(> .curriculum-tool-context) .ctl-task form { gap:2px; }
  .ctl-app:has(> .curriculum-tool-context) .ctl-request { font-size:18px; line-height:1.2; }
}
@media screen and (min-width:860px) and (max-width:1100px) {
  .ctl-toolbar { padding-inline:10px; gap:6px; }
  .ctl-toolbar > span { font-size:14px; }
  .ctl-toolbar select { font-size:15px; }
  .ctl-toolbar button { padding-inline:9px; }
  .ctl-stats { gap:8px; font-size:16px; }
  .ctl-scores { gap:8px; }
  .ctl-hidden-count { font-size:14px; }
}
@media (max-width:680px) {
  .ctl-toolbar { flex-wrap:wrap; justify-content:center; padding:8px; }
  .ctl-stats { display:grid; grid-template-columns:1fr 1fr; padding:10px; gap:8px; }
  .ctl-hidden-count { grid-column:1/-1; font-size:16px; }
  .ctl-scores { flex-wrap:wrap; grid-column:1/-1; }
  .ctl-page:not([data-mode="computer"]) .ctl-pairs { height:auto; min-height:122px; }
  .ctl-play { display:flex; flex-direction:column; }
  .ctl-task { min-height:245px; }
  .ctl-hand { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(8,65px); }
  .ctl-card { font-size:36px; }
  .ctl-pairs { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  html[data-maths-modelled-specialist-brand="v1"] .ctl-app .brand-logo img { width:88px; max-width:88px; height:auto; }
}
@media (forced-colors:active) {
  .ctl-card[aria-pressed="true"] { outline:4px solid Highlight; }
  .ctl-action.primary { border:2px solid ButtonText; }
}
@media print {
  @page { size:A4 landscape; margin:8mm; }
  html, body { background:white !important; }
  html[data-spire-print-page="a4-landscape"] body.spire-shared-print-brand-layout { display:block !important; height:auto !important; min-height:0 !important; max-height:none !important; overflow:visible !important; }
  .ctl-app { display:block !important; height:auto !important; min-height:0 !important; overflow:visible !important; }
  .ctl-toolbar, .ctl-task, .top-actions, .ctl-clear { display:none !important; }
  .ctl-page { padding:0; height:auto; width:100%; }
  .ctl-board { height:auto; display:block; }
  .ctl-stats { margin:5mm 0 3mm; padding:2mm; font-size:13pt; }
  .ctl-play { display:block; }
  .ctl-hand-panel { padding:2mm; }
  .ctl-hand { grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,17mm); gap:2mm; }
  .ctl-card { font-size:24pt; min-height:0; color:black; border-color:#444; }
  .ctl-pairs { margin-top:3mm; display:grid; grid-template-columns:1fr 1fr; padding:2mm; height:auto; min-height:0; }
  .ctl-pair { font-size:12pt; }
  .ctl-feedback { margin-top:3mm; min-height:0; height:auto; font-size:12pt; padding:2mm; }
}