.medication-heading{margin-bottom:24px}
.med-toolbar{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;background:#e7e1ea;padding:16px 18px;border-radius:10px}
.med-toolbar .secondary{margin-left:0}
.reset-button{color:#684079}
.progress-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 24px}
.progress-panel>div:not(.progress-track){background:#fff;border:1px solid #cbd8df;border-radius:9px;padding:14px 18px;display:flex;align-items:baseline;gap:9px}
.progress-panel strong{font-size:24px;color:#69407c}
.progress-panel span{color:#506873;font-size:14px}
.progress-track{grid-column:1/-1;height:7px;background:#d8e2e7;border-radius:99px;overflow:hidden}
.progress-track span{display:block;width:0;height:100%;background:#69407c;transition:width .25s ease}
.med-card{background:#fff;border:1px solid #cbd8df;border-top:5px solid #69407c;border-radius:12px;overflow:hidden}
.med-card-top{padding:18px 26px 0;display:flex;justify-content:space-between;gap:16px;color:#58707c;font-size:14px}
.med-name{text-align:center;padding:30px 26px 24px;border-bottom:1px solid #e2e9ed}
.med-name p{margin:0 0 8px;color:#58707c;font-size:14px}
.med-name h2{font-size:clamp(30px,5vw,46px);color:#142c3b;margin:0 0 24px}
.med-name strong{font-size:clamp(20px,3vw,28px);color:#69407c}
.category-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:24px 26px}
.category-choices button{background:#fff;color:#203f50;border:1px solid #b8c9d2;min-height:58px;text-align:left}
.category-choices button:disabled{opacity:1}
.category-choices button.selected{border:2px solid #69407c;background:#f3edf5}
.category-choices button.correct{border-color:#198864;background:#e0f4eb}
.category-choices button.wrong{border-color:#bc6240;background:#fff0e8}
.med-actions{padding:18px 26px;border-top:1px solid #e2e9ed;display:flex;align-items:center;justify-content:space-between;gap:18px}
.med-actions span{color:#58707c;font-size:14px}
#med-feedback{margin:0 26px 20px;padding:17px 18px;border-radius:8px;background:#edf7f4;line-height:1.55}
#med-feedback.wrong-feedback{background:#fff4ee}
.med-misses,.complete-panel{background:#fff;border:1px solid #cbd8df;border-radius:10px;padding:24px;margin:20px 0}
.med-misses h2{margin-bottom:8px}
.miss-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.miss-item{border:1px solid #dce5e9;border-radius:8px;padding:16px}
.miss-item p{margin:6px 0;color:#58707c}
.miss-item button{margin-top:8px;padding:9px 13px}
.complete-panel{text-align:center;padding:38px 24px}
.complete-panel p{line-height:1.6;color:#58707c}
.complete-panel button{margin-top:12px;background:#69407c}
@media(max-width:850px){.category-choices{grid-template-columns:1fr 1fr}
.miss-list{grid-template-columns:1fr}
}
@media(max-width:580px){.progress-panel{grid-template-columns:1fr}
.progress-track{grid-column:auto}
.category-choices{grid-template-columns:1fr;padding:20px}
.med-card-top{display:block}
.med-card-top span{display:block;margin-bottom:8px}
.med-actions{align-items:stretch;flex-direction:column}
.med-actions button{width:100%}
.med-toolbar{display:grid}
.med-toolbar button{width:100%}
.med-name{padding:26px 20px}
}
.med-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.med-mode-card{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;min-height:340px;padding:30px;background:linear-gradient(145deg,#fff 58%,#f5ecf8);border:1px solid #bdcfd7;border-top:5px solid #69407c;border-radius:12px;color:#142c3b;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}.med-mode-card:hover{border-color:#69407c;box-shadow:0 8px 22px #3b244516;transform:translateY(-2px)}.med-mode-card .eyebrow{position:relative;margin-top:4px}.med-mode-card h2{position:relative;font-size:30px;margin:18px 0 0;max-width:480px}.med-mode-card p{position:relative;color:#486b79;font-size:16px;line-height:1.65;margin:16px 0 28px;max-width:520px}.med-mode-mark{position:absolute;right:24px;top:12px;font-size:76px;line-height:1;font-weight:900;color:#69407c1c}.med-mode-action{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-top:auto;width:100%;padding:14px 18px;border-radius:6px;background:#69407c;color:#fff;font-weight:650}.sort-mode{border-top-color:#0b6e75;background:linear-gradient(145deg,#fff 58%,#e9f6f7)}.sort-mode:hover{border-color:#0b6e75}.sort-mode .med-mode-mark{color:#0b6e751e}.sort-mode .med-mode-action{background:#0b6e75}
@media(max-width:700px){.med-mode-grid{grid-template-columns:1fr}.med-mode-card{min-height:300px;padding:24px}.med-mode-card h2{font-size:26px}}
@media(prefers-reduced-motion:reduce){.med-mode-card{transition:none}.med-mode-card:hover{transform:none}}
