/* Rewrite sample: interactive learning aids. Class-only (route CSP forbids inline styles). Signal v3 tokens from hr.css. */
.rw{margin:24px 0;padding:16px 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.rw>.rw-title{font-weight:700;margin:0 0 6px}
.rw .rw-note{margin:0 0 10px;color:var(--ink-2)}
.rw .rw-q{margin:10px 0 8px;font-weight:650}
.rw-opts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rw-opts li{margin:0}
.rw-opt{display:block;width:100%;text-align:start;min-height:44px;align-content:center;padding:8px 14px;background:var(--surface-2);color:var(--ink);border:1px solid var(--line-2);border-radius:var(--r);font:inherit;font-weight:500;cursor:pointer;overflow:visible;isolation:auto}
.rw-opt:hover{border-color:var(--ink)}
.rw-opt:focus-visible{outline:3px solid var(--mark);outline-offset:2px}
.rw-opt.is-picked{border-color:var(--ink);border-width:2px;padding:7px 13px}
.rw-opt.is-ok{background:var(--accent-soft);border-color:var(--mark)}
.rw-opt.is-ok::after{content:" \2713";font-weight:700}
.rw-opt.is-no{border-style:dashed}
.rw-fb{margin:6px 0 0;padding:8px 12px;background:var(--surface-3);border-inline-start:4px solid var(--line-2);border-radius:0 var(--r) var(--r) 0}
.rw-fb.is-yes{border-inline-start-color:var(--mark);background:var(--accent-soft)}
.rw-choose.is-live .rw-fb::before{content:none}
.rw-stepper .rw-stage{margin:8px 0}
.rw-stepper .rw-nav{display:none;align-items:center;gap:12px;margin-top:12px}
.rw-stepper.is-live .rw-nav{display:flex}
.rw-stepper .rw-nav button{min-height:44px;min-width:44px;padding:8px 18px;border:1px solid var(--ink);border-radius:var(--r-pill);background:var(--ground);color:var(--ink);font:inherit;font-weight:650;cursor:pointer;overflow:visible;isolation:auto}
.rw-stepper .rw-nav button.rw-next{background:var(--ink);color:var(--ground)}
.rw-stepper .rw-nav button:disabled{opacity:.45;cursor:not-allowed}
.rw-stepper .rw-nav button:focus-visible{outline:3px solid var(--mark);outline-offset:2px}
.rw-prog{margin-inline-start:auto;color:var(--ink-2);font-size:.95em}
.rw-state{margin:8px 0;padding:8px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);direction:ltr;text-align:left;font-family:var(--f-code);font-size:.95em}
.rw pre{margin:8px 0}
.rw .ln{display:block;padding:0 6px;border-radius:4px}
.rw .ln.is-on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--mark)}
.rw-tl{list-style:none;margin:8px 0;padding:0}
.rw-tl li{margin:6px 0;padding:6px 12px;border-inline-start:3px solid var(--line-2)}
.rw-tl li.is-now{border-inline-start-color:var(--mark);background:var(--accent-soft);font-weight:650}
@media (max-width:480px){.rw{padding:14px 12px}}
.rw,.rw-choose,.rw-opts li,.rw-q,.rw-fb{min-width:0;overflow-wrap:anywhere}
.rw bdi{overflow-wrap:anywhere}
.rw-opt{max-width:100%;overflow-wrap:anywhere;white-space:normal}
.aid bdi,.aid p,.aid legend{overflow-wrap:anywhere}
.core p,.core li,.core bdi{overflow-wrap:anywhere}

.literal.prose{direction:rtl;text-align:start;white-space:pre-wrap}
.literal.code{direction:ltr;text-align:left;white-space:pre-wrap}
main:has(.aid-prev) .prediction textarea,main:has(.aid-prev) .aid-write textarea{display:block;width:100%;box-sizing:border-box}
main:has(.aid-prev) .interactive-controls{display:flex;flex-wrap:wrap;gap:10px}
main:has(.aid-prev) .aid-prev{order:0}main:has(.aid-prev) .aid-next{order:1}main:has(.aid-prev) .aid-reset{order:2}

.option-letter{flex:0 0 auto;margin-inline-end:8px}.option-text{min-width:0}