:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#182f37;background:#f2f5f3;color-scheme:light;font-synthesis:none}*{box-sizing:border-box}body{margin:0;font-size:16px;line-height:1.6}header{max-width:880px;margin:auto;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #d7e0da}header a{color:inherit;text-decoration:none;font-size:22px}header strong{color:#176653}.badge{font-size:10px;letter-spacing:.1em;border:1px solid #c9d9cf;border-radius:30px;padding:5px 9px;color:#376554}main{max-width:760px;margin:auto;padding:30px 22px 40px}.intro{margin-bottom:26px}.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:750;color:#397360}h1{font-size:clamp(32px,6vw,46px);line-height:1.15;letter-spacing:-.035em;margin:10px 0 15px}h2{font-size:21px;line-height:1.3;margin:0 0 18px}.intro>p:last-child{color:#53666b;max-width:550px}.card{background:#fff;border:1px solid #dbe4de;border-radius:20px;padding:26px;margin:20px 0;box-shadow:0 5px 24px #183d2910}label{display:block;font-size:14px;font-weight:650;margin:12px 0 7px}textarea,input,select{width:100%;min-width:0;border:1px solid #b9cbc0;background:#fafcfb;border-radius:10px;padding:13px;color:#182f37;font:inherit;font-size:16px}textarea{resize:vertical;min-height:130px}textarea:focus,input:focus,select:focus,button:focus-visible,summary:focus-visible{outline:3px solid #9bd8c2;outline-offset:2px}.counter{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#60746b}.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}details{margin:24px 0;background:#f4f8f5;border-radius:10px;padding:12px 15px}summary{cursor:pointer;font-size:14px;color:#356854;font-weight:650}button{font:inherit;font-weight:650;cursor:pointer;border-radius:10px;min-height:48px;padding:12px 18px;border:0}button:disabled{opacity:.6;cursor:wait}.primary{width:100%;background:#176653;color:white;display:flex;justify-content:space-between;align-items:center}.secondary{background:#e6eee9;color:#214f3e;border:1px solid #c7d8cd}#status,.small{font-size:13px;color:#52665c;margin-bottom:0}#status[data-error="true"]{color:#9d3232}.answer{border-top:4px solid #277b5e}.asked{font-weight:650;border-bottom:1px solid #dce5df;padding-bottom:15px}#answer{overflow-wrap:anywhere}#answer p{white-space:pre-wrap}#answer h3{font-size:18px;margin-top:24px}.notice{font-size:13px;background:#f7f1df;padding:14px;border-radius:10px;color:#6c582c}.sample{border:1px dashed #bbd0c1;border-radius:16px;padding:22px;margin:28px 0}.sample h2{font-size:18px;margin:0}.sample p{font-size:14px;color:#52665c}.sample button{width:100%}footer{font-size:12px;color:#60746b}[hidden]{display:none!important}@media(max-width:440px){header{padding:18px 16px}main{padding:22px 14px}.card{padding:19px 16px}.fields{grid-template-columns:1fr;gap:0}.counter{font-size:11px}.badge{font-size:9px}}

#answer math{font-size:1.1em;max-width:100%;overflow-x:auto;overflow-y:hidden}#answer math[display=block]{display:block;text-align:center;margin:14px 0;padding:8px 0}#math-preview{margin-top:10px}
/* Long AI answers: readable sections and accessible lists on narrow screens. */
#answer h3,#answer h4{line-height:1.35;margin:24px 0 10px}#answer h4{font-size:16px}#answer p{margin:10px 0;white-space:normal;line-height:1.75}#answer ul,#answer ol{padding-left:1.5rem;margin:10px 0 18px}#answer li{padding-left:3px;margin:7px 0;line-height:1.7}#answer strong{font-weight:750}#answer math{overflow-wrap:normal}#answer>div:has(math[display=block]){max-width:100%;overflow-x:auto}

/* Mobile practice: clear, touch-friendly radio options and readable selector. */
#exercise-select{width:100%;text-overflow:ellipsis}
#exercise-options{min-width:0;border:1px solid #c8d8ce;border-radius:12px;padding:16px;margin:14px 0}
#exercise-question{font-weight:700;line-height:1.45;padding:0 5px}
#exercise-options .exercise-choice{display:flex;align-items:flex-start;gap:12px;margin:0;padding:12px 4px;font-size:16px;font-weight:600;line-height:1.45;cursor:pointer}
#exercise-options .exercise-choice+ .exercise-choice{border-top:1px solid #e8eeea}
#exercise-options input[type=radio]{width:20px;height:20px;min-width:20px;flex:0 0 20px;margin:2px 0 0;padding:0;accent-color:#176653}
#exercise-check,#exercise-retry{margin:3px 6px 3px 0}
#exercise-feedback{line-height:1.55}