:root {
  --dv-blue:#149bd7;
  --dv-ink:#102131;
  --dv-line:#d8e2ea;
  --dv-muted:#5c6b78;
  --dv-good:#0b6a4a;
  --dv-warn:#9b4d00;
  --dv-dark:#071018;
  --dv-touch:48px;
  font-family:Arial,Helvetica,sans-serif;
}
* { box-sizing:border-box; }
html, body { min-height:100%; margin:0; }
body { color:var(--dv-ink); background:#edf5f9; letter-spacing:0; touch-action:manipulation; }
button, input, select { font:inherit; }
button, summary, a { -webkit-tap-highlight-color:transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible, a:focus-visible { outline:4px solid rgba(20,155,215,.35); outline-offset:2px; }
.app { height:100vh; height:100dvh; min-height:100vh; min-height:100dvh; display:grid; grid-template-rows:auto minmax(0,1fr); overflow:hidden; }
.topbar { min-height:74px; display:grid; grid-template-columns:minmax(250px,1fr) auto; align-items:center; gap:16px; padding:10px 16px; background:var(--dv-dark); color:#fff; }
.brand, .top-actions { display:flex; align-items:center; gap:10px; }
.brand { min-width:0; gap:14px; }
.brand-logo { display:inline-flex; flex:0 0 auto; border-radius:6px; }
.brand-logo img { display:block; width:132px; height:auto; object-fit:contain; }
h1 { min-width:0; margin:0; font-size:clamp(1.3rem,2vw,2.05rem); line-height:1.05; font-weight:900; }
.top-actions { justify-content:flex-end; flex-wrap:wrap; }
.icon-button, .home-button { min-height:var(--dv-touch); display:inline-flex; align-items:center; justify-content:center; border:2px solid #263d51; border-radius:8px; background:#122436; color:#fff; font-weight:900; text-decoration:none; cursor:pointer; }
.icon-button { width:var(--dv-touch); padding:0; }
.home-button { padding:0 14px; }
.icon-button:hover, .icon-button[aria-pressed="true"], .home-button:hover { border-color:#8fd8f3; background:var(--dv-blue); color:#06111a; }
.icon { width:24px; height:24px; display:block; pointer-events:none; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
* { box-sizing:border-box; }
button, input { font:inherit; }
.dv-app { min-height:calc(100vh - 78px); display:grid; grid-template-rows:auto minmax(0,1fr); background:#edf5f9; color:var(--dv-ink); }
.dv-toolbar { display:flex; align-items:center; gap:8px; padding:8px 14px; min-height:64px; background:#fff; border-bottom:1px solid var(--dv-line); }
.dv-toolbar button, .dv-toolbar summary { min-height:48px; padding:0 15px; border:1px solid #b9c9d5; border-radius:8px; background:#fff; color:var(--dv-ink); font-weight:800; cursor:pointer; }
.dv-toolbar button:hover, .dv-toolbar button:focus-visible, .dv-toolbar summary:hover, .dv-toolbar summary:focus-visible { border-color:var(--dv-blue); outline:3px solid rgba(20,155,215,.2); outline-offset:1px; }
.dv-toolbar .dv-primary { margin-left:auto; color:#fff; border-color:var(--dv-blue); background:var(--dv-blue); }
.dv-toolbar button:disabled { cursor:not-allowed; opacity:.48; }
.dv-setup { position:relative; }
.dv-setup summary { display:grid; align-content:center; list-style:none; min-width:220px; }
.dv-setup summary::-webkit-details-marker { display:none; }
.dv-setup summary span, .dv-setup summary strong { display:block; }
.dv-setup summary strong { margin-top:2px; color:var(--dv-muted); font-size:.78rem; }
.dv-setup-panel { position:absolute; z-index:30; top:calc(100% + 8px); left:0; width:min(700px,calc(100vw - 28px)); max-height:calc(100vh - 165px); overflow:auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:16px; border:1px solid var(--dv-line); border-radius:10px; background:#fff; box-shadow:0 16px 38px rgba(7,16,24,.2); }
.dv-setup-panel fieldset { min-width:0; margin:0; padding:10px; border:1px solid var(--dv-line); border-radius:8px; }
.dv-setup-panel legend { padding:0 5px; font-weight:800; }
.dv-choices { display:flex; flex-wrap:wrap; gap:7px; }
.dv-choices label { min-height:46px; display:inline-flex; align-items:center; cursor:pointer; }
.dv-choices input { position:absolute; opacity:0; pointer-events:none; }
.dv-choices span { min-height:46px; display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border:2px solid #c8d4dc; border-radius:8px; background:#fff; font-weight:800; }
.dv-choices input:checked + span { color:#062131; border-color:var(--dv-blue); background:#dff4fc; }
.dv-choices input:focus-visible + span { outline:3px solid rgba(20,155,215,.3); outline-offset:2px; }
.dv-choices input:disabled + span { display:none; }
.dv-number-source { grid-column:1/-1; }
.dv-number-entry { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; margin-top:8px; }
.dv-number-entry label { display:grid; gap:4px; color:var(--dv-muted); font-weight:700; }
.dv-number-entry input { min-width:0; min-height:48px; padding:8px 10px; border:2px solid #b9c9d5; border-radius:8px; color:var(--dv-ink); font-weight:800; }
.dv-number-entry button { align-self:end; min-height:48px; }
.dv-main { min-width:0; min-height:0; display:grid; grid-template-columns:minmax(260px,.72fr) minmax(420px,1.45fr); gap:12px; padding:12px; }
.dv-task-card, .dv-model-card { min-width:0; min-height:0; border:1px solid var(--dv-line); border-radius:10px; background:#fff; box-shadow:0 3px 12px rgba(7,16,24,.06); }
.dv-task-card { display:flex; flex-direction:column; gap:14px; padding:18px; overflow:auto; }
.dv-profile-note { margin:0; color:var(--dv-muted); font-weight:700; }
.dv-prompt { margin:0; font-size:clamp(1.45rem,2.7vw,2.35rem); line-height:1.16; }
.dv-response { display:grid; gap:12px; }
.dv-response fieldset { margin:0; padding:0; border:0; }
.dv-response legend { margin-bottom:8px; font-weight:800; }
.dv-response .dv-choices span { min-width:104px; }
.dv-reason-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.dv-reason-list label { min-height:52px; display:flex; align-items:flex-start; gap:8px; padding:7px 8px; border:1px solid var(--dv-line); border-radius:8px; cursor:pointer; }
.dv-reason-list input { margin-top:3px; }
.dv-app[data-mode="reasoning"] .dv-task-card { gap:10px; padding:14px 16px; }
.dv-counterexamples { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.dv-counterexamples label { display:grid; gap:5px; color:var(--dv-muted); font-weight:700; }
.dv-counterexamples input { min-height:48px; width:100%; padding:8px 10px; border:2px solid #b9c9d5; border-radius:8px; color:var(--dv-ink); font-weight:800; }
.dv-hint { min-height:48px; margin:0; padding:10px 12px; border-left:5px solid #e6b52a; border-radius:6px; background:#fff8d9; font-weight:700; }
.dv-hint:empty { display:none; }
.dv-feedback { min-height:52px; margin-top:auto; display:flex; align-items:center; padding:11px 13px; border:1px solid var(--dv-line); border-radius:8px; background:#f7fbfd; font-weight:800; }
.dv-feedback[data-tone="success"] { color:var(--dv-good); border-color:#7dcbb1; background:#effbf6; }
.dv-feedback[data-tone="warning"] { color:var(--dv-warn); border-color:#e7b879; background:#fff8ee; }
.dv-model-card { display:grid; place-items:stretch; overflow:hidden; padding:12px; }
.dv-model-host { min-height:100%; display:grid; place-items:center; align-content:center; }
.dv-model-host .question-visual { width:min(100%,980px); }
.dv-model-host.is-rules-reference { display:block; align-content:normal; }
.dv-rules-reference { width:100%; height:100%; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:12px; padding:4px 8px; }
.dv-rules-reference > header { display:flex; align-items:baseline; justify-content:space-between; gap:14px; }
.dv-rules-reference h2, .dv-rules-reference h3, .dv-rules-reference h4, .dv-rules-reference p { margin:0; }
.dv-rules-reference h2 { font-size:clamp(1.5rem,2.4vw,2.15rem); }
.dv-rules-reference > header p { color:var(--dv-muted); font-size:1rem; font-weight:800; }
.dv-rule-groups { min-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.dv-rule-group { min-width:0; display:grid; grid-template-rows:auto minmax(0,1fr); gap:7px; }
.dv-rule-group h3 { color:#244a5f; font-size:clamp(1.08rem,1.7vw,1.4rem); }
.dv-rule-group ul { min-width:0; margin:0; padding:0; list-style:none; display:grid; grid-auto-rows:minmax(0,1fr); gap:7px; }
.dv-rule-card { min-width:0; display:grid; grid-template-columns:58px minmax(0,1fr); align-items:center; gap:10px; padding:8px 10px; border:2px solid #c7d6df; border-radius:10px; background:#f8fbfd; }
.dv-rule-card.is-current { border-color:#244a5f; background:#eef9bd; box-shadow:inset 5px 0 0 #bfe43a; }
.dv-rule-divisor { min-height:48px; display:grid; place-items:center; border-radius:8px; background:#dff4fc; color:#102131; font-size:clamp(1.2rem,1.9vw,1.55rem); font-weight:900; }
.dv-rule-card.is-current .dv-rule-divisor { background:#cbe942; }
.dv-rule-card-heading { display:flex; align-items:center; flex-wrap:wrap; gap:5px 8px; }
.dv-rule-card h4 { font-size:clamp(1.05rem,1.7vw,1.32rem); }
.dv-rule-card p { margin-top:3px; font-size:clamp(1rem,1.55vw,1.22rem); line-height:1.18; font-weight:700; }
.dv-rule-tag { display:inline-flex; align-items:center; min-height:23px; padding:2px 7px; border-radius:999px; background:#244a5f; color:#fff; font-size:.72rem; font-weight:900; }
.dv-rule-tag-extension { background:#6a4b8c; }
.dv-rules-note { color:var(--dv-muted); font-size:.9rem; font-weight:700; text-align:center; }
.dv-neutral-number { width:100%; min-height:260px; display:grid; place-items:center; font-size:clamp(4rem,11vw,8.5rem); font-weight:800; letter-spacing:.03em; }
.dv-foundation-result, .dv-reasoning-reveal { width:min(100%,760px); padding:16px; border:2px solid #9fc6d8; border-radius:10px; background:#f7fbfd; text-align:center; font-weight:800; }
.dv-foundation-result .question-visual { margin-bottom:10px; }
.dv-reasoning-reveal h3 { margin-top:0; }
.dv-reasoning-reveal p:last-child { margin-bottom:0; }
.dv-instructions { width:min(720px,calc(100vw - 32px)); max-height:calc(100vh - 32px); padding:0; border:0; border-radius:10px; color:var(--dv-ink); box-shadow:0 24px 64px rgba(7,16,24,.35); }
.dv-instructions::backdrop { background:rgba(7,16,24,.58); }
.dv-instructions header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; background:#071018; color:#fff; }
.dv-instructions h2 { margin:0; }
.dv-instructions header button { min-height:48px; padding:0 14px; border:1px solid #8fd8f3; border-radius:8px; background:#122436; color:#fff; font-weight:800; }
.dv-instructions div { max-height:calc(100vh - 120px); overflow:auto; padding:18px; line-height:1.5; }
.dv-instructions li + li { margin-top:8px; }
.dv-print-brand { display:none; }
@media (max-width:900px), (max-height:679px) {
  .app { height:auto; min-height:100vh; min-height:100dvh; overflow:visible; }
  .topbar { grid-template-columns:1fr; }
  .top-actions { justify-content:flex-start; }
  .dv-app { display:block; min-height:0; }
  .dv-toolbar { flex-wrap:wrap; }
  .dv-toolbar .dv-primary { margin-left:0; }
  .dv-main { grid-template-columns:1fr; }
  .dv-task-card, .dv-model-card { min-height:360px; overflow:visible; }
  .dv-rules-reference { height:auto; min-height:520px; overflow:visible; }
  .dv-setup-panel { position:fixed; top:86px; left:14px; right:14px; width:auto; }
}
@media (max-width:560px) {
  .topbar { padding:9px 10px; }
  .brand { justify-content:space-between; }
  .brand-logo img { width:118px; max-width:36vw; }
  .top-actions { gap:7px; }
  .icon-button { width:44px; min-height:44px; }
  .home-button { min-height:44px; padding:0 11px; }
  .dv-setup-panel { grid-template-columns:1fr; }
  .dv-number-source { grid-column:auto; }
  .dv-number-entry, .dv-counterexamples { grid-template-columns:1fr; }
  .dv-reason-list { grid-template-columns:1fr; }
  .dv-rule-groups { grid-template-columns:1fr; }
  .dv-rule-group ul { grid-auto-rows:auto; }
  .dv-rules-reference { min-height:0; padding:6px 2px; }
  .dv-rules-reference > header { align-items:flex-start; flex-direction:column; gap:3px; }
  .dv-toolbar button, .dv-toolbar details { flex:1 1 140px; }
  .dv-toolbar .dv-primary { flex-basis:100px; }
  .dv-prompt { font-size:1.55rem; }
}
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
@media (forced-colors:active) { .dv-choices input:checked + span, .divisibility-digit.divisibility-digit-evidence rect { outline:3px solid CanvasText; } }
@media print {
  @page { size:A4 landscape; margin:8mm; }
  .topbar, .dv-toolbar, .dv-instructions, .dv-feedback, .dv-hint, .spire-numeric-keypad, .classroom-tools-panel { display:none!important; }
  html, body, .app, .dv-app { width:100%; height:auto!important; min-height:0!important; background:#fff!important; }
  .dv-main { height:176mm; grid-template-columns:35% 65%; gap:6mm; padding:0; }
  .dv-task-card, .dv-model-card { height:165mm; min-height:0; overflow:hidden; box-shadow:none; }
  .dv-response { font-size:10pt; }
  .dv-rules-reference { gap:7px; padding:0; }
  .dv-rule-groups { gap:7px; }
  .dv-rule-group { gap:4px; }
  .dv-rule-group ul { gap:4px; }
  .dv-rule-card { grid-template-columns:12mm minmax(0,1fr); gap:2mm; padding:2mm; }
  .dv-rule-divisor { min-height:9mm; font-size:13pt; }
  .dv-rule-card h4 { font-size:10pt; }
  .dv-rule-card p { font-size:9.5pt; }
  .dv-rule-tag { min-height:0; font-size:7pt; }
  .dv-rules-note { font-size:8pt; }
  .dv-print-brand { position:fixed; left:8mm; right:8mm; bottom:1mm; display:flex; align-items:center; justify-content:space-between; font-size:9pt; font-weight:700; }
  .dv-print-brand img { width:36mm; height:auto; }
}
