/* PuzzleM8 step-by-step solution pages. */
.pm8-solve { max-width: 820px; }
.sv-m { font-family: 'Cambria Math', 'STIX Two Math', Georgia, 'Times New Roman', serif; font-style: normal; white-space: nowrap; }
h1 .sv-m { white-space: normal; }
.sv-topic { margin: 0; color: var(--pm8-sage-deep); font-weight: 700; }
.sv-lead { color: var(--pm8-muted); font-size: 1.05rem; max-width: 62ch; }
.sv-steps { list-style: none; margin: 1.25rem 0; padding: 0; counter-reset: none; display: flex; flex-direction: column; gap: .8rem; }
.sv-steps > li { background: var(--pm8-paper); border: 1px solid var(--pm8-line); border-radius: 14px; padding: .9rem 1rem; }
.sv-steps .sv-start { background: var(--pm8-cream); }
.sv-eq { display: block; font-size: 1.6rem; margin: .35rem 0; overflow-x: auto; }
.sv-do { margin: 0; font-weight: 700; font-family: var(--pm8-display); }
.sv-n { color: var(--pm8-sage-deep); }
.sv-tag { display: inline-block; margin-left: .35rem; padding: .05rem .5rem; border-radius: 999px; background: var(--pm8-cream); font-family: var(--pm8-body); font-size: .9rem; }
.sv-why { margin: .3rem 0 0; }
.sv-said { margin: .2rem 0 0; color: var(--pm8-muted); font-size: .95rem; }
.sv-rule { margin: .4rem 0 0; font-size: .9rem; background: #eef3ea; display: inline-block; padding: .25rem .6rem; border-radius: 8px; }
.sv-answer { background: #eef3ea; border-radius: 14px; padding: 1rem 1.1rem; margin: 1.25rem 0; }
.sv-answer h2 { font-family: var(--pm8-display); margin: 0 0 .5rem; font-size: 1.5rem; }
.sv-answer h3 { margin: .5rem 0 .3rem; font-size: 1.05rem; }
.sv-answer p { margin: .25rem 0; overflow-wrap: anywhere; }
.sv-ok { font-weight: 700; color: var(--pm8-sage-deep); }
.sv-cta { border: 2px solid var(--pm8-sage); border-radius: 14px; padding: 1rem 1.1rem; margin: 1.25rem 0; }
.sv-cta h2, .sv-more h2 { font-family: var(--pm8-display); font-size: 1.25rem; margin: 0 0 .5rem; }
.sv-more { margin: 1.5rem 0; }
.sv-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); gap: .5rem; }
.sv-list a { display: block; padding: .55rem .7rem; border: 1px solid var(--pm8-line); border-radius: 10px; background: var(--pm8-paper); color: var(--pm8-ink); text-decoration: none; font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; }
.sv-list a:hover { border-color: var(--pm8-sage); }
.sv-form { background: var(--pm8-paper); border: 1px solid var(--pm8-line); border-radius: 14px; padding: 1rem; margin: 1rem 0; }
.sv-form label { font-weight: 700; display: block; margin-bottom: .35rem; }
.sv-row { display: flex; gap: .5rem; flex-wrap: wrap; }
.sv-row input { flex: 1 1 220px; min-width: 0; font: inherit; font-size: 1.2rem; padding: .6rem .75rem; border: 1px solid #c9bfa9; border-radius: 10px; min-height: 48px; }
.sv-form p { margin: .5rem 0 0; }
