/* shared practice styles (rose theme tokens from style.css) */
.nav-label { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 14px 12px 4px; font-weight: 700; }
.practice-root { max-width: 820px; margin: 0 auto; }
.practice-hub { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; max-width: 620px; margin: 0 auto; }
.hub-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 22px; border: 0; text-align: left; font-size: 1.2rem; }
.hub-tile svg { width: 26px; height: 26px; color: var(--rose); }
.mcq { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 16px 18px; margin: 12px 0; }
.mcq-n { font-size: .75rem; font-weight: 700; color: var(--rose-deep); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.mcq-q { font-weight: 600; margin-bottom: 10px; }
.mcq-opts { display: grid; gap: 8px; }
.mcq-opts button { display: flex; gap: 10px; align-items: flex-start; text-align: left; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: #fff; transition: .15s; }
.mcq-opts button:hover { border-color: var(--rose); }
.mcq-opts button b { color: var(--muted); font-weight: 700; }
.mcq-opts button.picked { border-color: var(--rose); background: var(--rose-ghost); }
.mcq-opts button.right { border-color: var(--sage); background: var(--sage-soft); }
.mcq-opts button.wrong { border-color: var(--rose); background: var(--rose-soft); }
.mcq-why { margin-top: 10px; font-size: .9rem; color: var(--muted); }