#health-quiz{width:min(1180px,calc(100% - 40px));margin:60px auto 90px;scroll-margin-top:30px;font-size:1rem}
#health-quiz *{box-sizing:border-box}#health-quiz button{font:inherit;cursor:pointer;color:var(--ink-deep)}#health-quiz button:focus-visible,#health-quiz a:focus-visible,#health-quiz summary:focus-visible{outline:3px solid var(--red);outline-offset:4px}#health-quiz h2{font-family:"Noto Naskh Arabic",serif;font-size:clamp(2rem,4vw,3.5rem)}#health-quiz .section-heading p{max-width:510px}#health-quiz .section-title{font-size:1.1rem;margin:22px 0 16px}
#health-quiz .topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}#health-quiz .topic{border:1px solid var(--line);border-radius:18px;background:var(--white);padding:20px;text-align:right;min-height:160px;transition:transform .2s}#health-quiz .topic:hover{transform:translateY(-2px)}#health-quiz .topic.active{border:2px solid var(--ink);padding:19px;background:color-mix(in srgb,var(--cream) 35%,var(--white))}#health-quiz .topic .ico{font-size:1.65rem;display:block;margin-bottom:8px}#health-quiz .topic strong{display:block;font-size:1.05rem}#health-quiz .topic small{font-size:.875rem;color:var(--muted);line-height:1.8;display:block;margin-top:8px}
#health-quiz .workspace{border:1px solid var(--line);border-radius:22px;background:var(--white);margin:0 0 24px;overflow:hidden}#health-quiz .wkhead{padding:26px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:18px}#health-quiz .wkhead h2{font-size:2rem;margin:0}#health-quiz .wkhead p{font-size:1rem;color:var(--muted);margin:8px 0 0}#health-quiz .icon-circle{font-size:2rem}#health-quiz .panel{padding:26px}#health-quiz .two-col{display:grid;grid-template-columns:1.3fr .7fr;gap:24px;align-items:start}#health-quiz .test-card{padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--white)}#health-quiz .row{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}#health-quiz .kicker,#health-quiz .micro{font-size:.875rem;color:var(--muted)}#health-quiz .progressline{height:8px;background:var(--cream);border-radius:20px;overflow:hidden;margin:18px 0 25px}#health-quiz .progressline div{height:100%;background:var(--ink);transition:width .2s}#health-quiz .question{font-size:1.3rem;line-height:1.8;margin:0 0 20px}#health-quiz .options{display:grid;gap:10px}#health-quiz .opt{display:flex;align-items:start;gap:12px;width:100%;border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--white);text-align:right;font-size:1rem;line-height:1.8}#health-quiz .opt:hover:not(:disabled),#health-quiz .opt.picked{background:var(--paper);border-color:var(--ink)}#health-quiz .opt:disabled{cursor:default;opacity:1}#health-quiz .opt .n{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;background:var(--cream);border-radius:8px;font-size:.875rem}#health-quiz .opt.wrong{border-color:var(--red)}#health-quiz .response{margin-top:18px;border:1px solid var(--line);border-right:4px solid var(--ink);border-radius:12px;padding:16px;background:var(--paper)}#health-quiz .response.note{border-right-color:var(--red)}#health-quiz .response p{font-size:1rem;line-height:1.9;margin:8px 0 0}#health-quiz .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}#health-quiz .btn{border:1px solid var(--ink);border-radius:12px;padding:12px 20px;min-height:48px;background:var(--ink);color:white;font-size:1rem;font-weight:700}#health-quiz .btn.secondary{color:var(--ink);background:transparent}#health-quiz .aside{background:var(--paper);padding:22px;border:1px solid var(--line);border-radius:16px}#health-quiz .aside h3{font-size:1.1rem}#health-quiz .aside p{font-size:1rem;color:var(--muted);line-height:1.9}#health-quiz details{border-top:1px solid var(--line);padding:14px 0}#health-quiz summary{font-size:1rem;font-weight:700;cursor:pointer}#health-quiz details p{margin:12px 0 0}#health-quiz .reference{border-top:1px solid var(--line);padding-top:18px;margin-top:16px;font-size:.875rem}#health-quiz .reference a{display:block;margin-top:12px;color:var(--ink);text-decoration:underline;overflow-wrap:anywhere}#health-quiz .end{text-align:center;padding:25px 5px}#health-quiz .end h3{font-size:1.4rem}#health-quiz .score{font-size:2.5rem;font-weight:700;color:var(--ink)}#health-quiz .end p{font-size:1rem;line-height:1.9}#health-quiz .quiz-notice{border:1px solid var(--line);border-radius:14px;background:var(--cream);padding:20px;font-size:.95rem;line-height:1.9}
@media(max-width:900px){#health-quiz .topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#health-quiz .two-col{grid-template-columns:1fr}.site-header{grid-template-columns:1fr auto}.site-header nav{grid-column:1/-1;grid-row:2;flex-wrap:wrap;justify-content:center;gap:14px;padding-bottom:16px}}
@media(max-width:550px){#health-quiz{width:calc(100% - 28px);margin:45px auto}#health-quiz .topic-grid{gap:10px}#health-quiz .topic{padding:14px;min-height:160px}#health-quiz .topic.active{padding:13px}#health-quiz .wkhead,#health-quiz .panel{padding:16px}#health-quiz .test-card,#health-quiz .aside{padding:16px}#health-quiz .question{font-size:1.15rem}}
@media(prefers-reduced-motion:reduce){#health-quiz *{scroll-behavior:auto!important;transition:none!important}}
#october-feature{width:min(1180px,calc(100% - 40px));margin:36px auto 64px}#october-feature[hidden],#health-quiz [hidden]{display:none!important}#october-feature #health-quiz{width:100%;margin:28px 0 0}#breast-awareness-title{scroll-margin-top:28px}#health-quiz .wkhead{flex-wrap:wrap}#health-quiz a.btn{display:inline-flex;align-items:center;text-decoration:none;text-align:center}#health-quiz-home:empty{display:none}@media(max-width:550px){#october-feature{width:calc(100% - 28px)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
#october-breast-slot .awareness-group{margin:24px 0 32px}#breast-awareness .posts-grid{grid-template-columns:repeat(4,minmax(0,1fr))}#women-breast-slot{margin-top:36px}#breast-awareness,#breast-awareness-title{scroll-margin-top:24px}@media(max-width:1000px){#breast-awareness .posts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:550px){#breast-awareness .posts-grid{grid-template-columns:1fr}}