/* Standalone fallback uses adopted 404LIMIT roles. Integrated pages also load
   the central product-design.css unchanged; layout below is quiz-only. */
html{font-size:17px}
body{--ink:#182e34;--muted:#52666b;--line:#d3deda;--accent:#146358;--accent-soft:#edf5f0;margin:0;background:#f6f8f5;color:var(--ink);font:400 1rem/1.8 "Segoe UI","Yu Gothic UI",Meiryo,sans-serif;overflow-wrap:anywhere;color-scheme:light}
*{box-sizing:border-box}[hidden]{display:none!important}
label,input,button,select,textarea{font:inherit}button,input,select,textarea{max-width:100%;min-width:0;min-height:48px;padding:11px 14px;border:1px solid #879d97;border-radius:9px;background:#fff;color:var(--ink)}
button{padding:12px 20px;background:var(--accent);border-color:var(--accent);color:#fff;font-weight:650;cursor:pointer;white-space:normal}
button:disabled,input:disabled{opacity:.6;cursor:not-allowed}.secondary,#start,#voice-toggle,#next{background:#fff;color:var(--accent);border-color:#9eb4ae}
button:hover:not(:disabled){box-shadow:0 3px 12px #173e2720}a{color:var(--accent)}
:is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #be6720;outline-offset:4px}
summary{min-height:48px;padding:12px 0;cursor:pointer;font-weight:600;color:var(--accent)}
p{margin:0 0 16px}.muted,.storage-note{color:var(--muted)}h2{font-size:1.5rem;line-height:1.5;margin:0 0 16px}
body[data-quiz-flow] :is(header.quiz-header,main){max-width:860px;margin-inline:auto;padding-inline:24px}
body[data-quiz-flow] header.quiz-header:not(#botai-app-navigation){max-width:860px;padding:28px 24px 8px}
body[data-quiz-flow] header h1{font-size:clamp(1.8rem,4vw,2.45rem);line-height:1.35;margin:6px 0 12px;letter-spacing:-.035em}
body[data-quiz-flow] .eyebrow{margin:0;color:var(--accent);font-size:1rem;letter-spacing:.02em;font-weight:650}
body[data-quiz-flow] :is(.quiz-lead,.product-lead){margin:0;color:var(--muted)}
body[data-quiz-flow] main{border:0;padding-block:16px 40px}
body[data-quiz-flow] :is(#play,#interim,#summary){padding:28px;margin:0;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 6px 24px #183c2810}
.quiz-card-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 16px}
body[data-quiz-flow] :is(#progress,#how-to){margin:0;color:var(--muted)}body[data-quiz-flow] #progress{color:var(--accent);font-weight:650}
body[data-quiz-flow] #question{font-size:clamp(1.6rem,4vw,2rem)!important;line-height:1.6;font-weight:650;margin:20px 0;color:var(--ink)}
body[data-quiz-flow] :is(#quiz,#practice-form){display:flex;flex-wrap:wrap;gap:12px;align-items:end;padding:0}
body[data-quiz-flow] :is(#quiz,#practice-form) label{display:block;flex:1;min-width:min(100%,180px)}
body[data-quiz-flow] :is(#answer,#practice-answer){display:block;width:100%;margin-top:6px}
body[data-quiz-flow] #answer-help{margin:8px 0 0}
.quiz-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:16px}.quiz-actions:has(>button[hidden]):not(:has(>button:not([hidden]))){display:none}
body[data-quiz-flow] :is(#checkpoint-status,#feedback):empty{display:none}
body[data-quiz-flow] #feedback{margin:18px 0 8px;font-weight:650}body[data-quiz-flow] #feedback[data-tone="correct"]{color:var(--accent)}
body[data-quiz-flow] :is(#feedback[data-tone="wrong"],#feedback[data-tone="error"]){color:#934314}
[aria-invalid="true"]{border-color:#934314;background:#fff9f5}
.explanation{background:var(--accent-soft);border-left:3px solid var(--accent);padding:14px 16px;line-height:1.8;margin:12px 0 0}
body[data-quiz-flow] .storage-note{margin:14px 0 20px}
body[data-quiz-flow] .quiz-option{border:0;border-top:1px solid var(--line);border-radius:0;padding:0;margin:0;background:transparent;box-shadow:none}
.quiz-option[open]{padding-bottom:16px}.quiz-option select{display:block;margin:8px 0 16px}.voice-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.voice-controls .muted{flex-basis:100%}
body[data-quiz-flow] :is(#interim-score,#summary-score){font-size:1.7rem!important;line-height:1.6;font-weight:700;color:var(--accent);margin:12px 0}
section details{margin:16px 0}section li{margin:12px 0;line-height:1.8}textarea:not([hidden]){display:block;width:100%;min-height:6em;margin:12px 0}
.related-links{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}.related-links:empty{display:none}
body[data-quiz-flow] #practice-dialog{width:min(640px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:28px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);overscroll-behavior:contain}
#practice-dialog::backdrop{background:#182e3466}.practice-heading{display:flex;align-items:start;justify-content:space-between;flex-wrap:wrap;gap:12px}.practice-heading h2{flex:1;min-width:min(100%,200px)}
#practice-question{font-size:1.6rem;font-weight:650}#practice-progress{color:var(--accent);margin:16px 0}#practice-feedback:not(:empty),#practice-next{margin-top:16px}#practice-dialog>.muted{margin:20px 0 0}
@media(max-width:600px){
  body[data-quiz-flow] :is(header.quiz-header,main){padding-inline:18px}
  body[data-quiz-flow] header.quiz-header:not(#botai-app-navigation){padding:20px 18px 4px}
  body[data-quiz-flow] :is(#play,#interim,#summary,#practice-dialog){padding:20px}
  body[data-quiz-flow] #question{margin:16px 0}
  body[data-quiz-flow] :is(#quiz,#practice-form) label{flex-basis:100%}
  body[data-quiz-flow] :is(#quiz,#practice-form)>button{width:100%}
  .quiz-actions{align-items:stretch}.quiz-actions>button{flex:1 1 180px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}