/* Training Materials, the signed-in app (assets/css/snet-training.css ported onto the site tokens; the hero and join
   form are already in site.css from Phase 1). Loaded on /training/ only. Google Fonts (Fraunces / Source Sans 3) are
   not loaded (font-src 'self'); the site's serif and body faces stand in. */
.snet-training{--trn-ink:var(--ink);--trn-soft:var(--muted);--trn-rust:var(--rust);--trn-rust-dark:var(--rust-deep);--trn-olive:var(--olive);--trn-olive-tint:#eef4e4;--trn-cream:var(--cream);--trn-paper:var(--card);--trn-border:var(--line);--trn-bad-tint:#f8e9e2;--trn-ok-tint:#fbf1dc}
.snet-training .snet-trn-link{background:none;border:0;padding:0;color:var(--trn-rust);font:600 15px/1.4 var(--font);cursor:pointer;justify-self:start}
.snet-training :focus-visible{outline:3px solid var(--trn-olive);outline-offset:2px}
#snet-training-app{display:grid;gap:22px}
.snet-trn-loading,.snet-trn-muted{color:var(--trn-soft);font-size:15px}
.snet-trn-progress{display:grid;gap:8px}
.snet-trn-bar{height:8px;background:var(--trn-border);border-radius:999px;overflow:hidden}
.snet-trn-bar span{display:block;height:100%;background:var(--trn-olive);border-radius:999px}
.snet-trn-styles{border:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.snet-trn-styles legend{font-weight:700;margin-bottom:8px;padding:0}
@media (max-width:640px){.snet-trn-styles{grid-template-columns:1fr}}
.snet-trn-style{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--trn-border);border-radius:10px;padding:12px;cursor:pointer;background:var(--trn-paper)}
.snet-trn-style:has(input:checked){border-color:var(--trn-olive);background:var(--trn-olive-tint)}
.snet-trn-style input{margin-top:5px;accent-color:var(--trn-olive)}
.snet-trn-style span{display:grid}
.snet-trn-style small{color:var(--trn-soft);font-size:14px;line-height:1.35}
.snet-trn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px}
.snet-trn-tile{text-align:left;background:var(--trn-paper);border:1px solid var(--trn-border);border-radius:10px;padding:14px;display:grid;gap:4px;cursor:pointer;color:var(--trn-ink);font:inherit}
.snet-trn-tile:hover{border-color:var(--trn-rust)}
.snet-trn-tile.is-done{box-shadow:inset 0 3px 0 var(--trn-olive)}
.snet-trn-tile-n{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--trn-soft);font-weight:700}
.snet-trn-tile strong{font-family:var(--serif);font-size:17px;line-height:1.25}
.snet-trn-tile-s{font-size:14px;color:var(--trn-soft)}
.snet-trn-complete{background:var(--trn-olive-tint);border-radius:12px;padding:20px 22px;display:grid;gap:8px}
.snet-trn-crumbs{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px;color:var(--trn-soft)}
.snet-trn-mtitle{font-size:26px}
.snet-trn-intro{font-size:18px;max-width:65ch}
.snet-trn-lesson{background:var(--trn-cream);border-radius:12px;padding:20px 22px;display:grid;gap:12px;max-width:70ch}
.snet-trn-lesson-toggle{border:1px solid var(--trn-border);border-radius:10px;padding:12px 16px}
.snet-trn-lesson-toggle summary{cursor:pointer;font-weight:700;color:var(--trn-rust)}
.snet-trn-lesson-toggle[open] .snet-trn-lesson{margin-top:12px}
.snet-trn-cards{display:grid;gap:8px}
.snet-trn-cards-hint{font-size:14px;color:var(--trn-soft)}
.snet-trn-cards-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.snet-trn-card{min-height:120px;border:1px solid var(--trn-border);border-radius:10px;background:var(--trn-paper);padding:16px;cursor:pointer;font:inherit;color:var(--trn-ink);text-align:center;display:grid;place-items:center}
.snet-trn-card-front{font-family:var(--serif);font-size:19px;font-weight:700}
.snet-trn-card-back{display:none;font-size:15px;line-height:1.45}
.snet-trn-card.is-flipped{background:var(--trn-olive-tint);border-color:var(--trn-olive)}
.snet-trn-card.is-flipped .snet-trn-card-front{display:none}
.snet-trn-card.is-flipped .snet-trn-card-back{display:block}
.snet-trn-items{margin:0;padding-left:22px;display:grid;gap:26px}
.snet-trn-item{display:grid;gap:10px}
.snet-trn-q{font-weight:700;font-size:18px}
.snet-trn-choices{display:grid;gap:8px}
.snet-trn-choice{text-align:left;background:var(--trn-paper);border:1px solid var(--trn-border);border-radius:8px;padding:12px 14px;font:400 16px/1.45 var(--font);color:var(--trn-ink);cursor:pointer}
.snet-trn-choice:hover:not(:disabled){border-color:var(--trn-rust);background:var(--trn-cream)}
.snet-trn-choice:disabled{cursor:default}
.snet-trn-choice.is-pending{opacity:.6}
.snet-trn-choice.is-best{border:2px solid var(--trn-olive);background:var(--trn-olive-tint)}
.snet-trn-choice.is-miss{border:2px solid var(--trn-rust);background:var(--trn-bad-tint)}
.snet-trn-feedback{display:grid;gap:6px;border-radius:8px;font-size:16px}
.snet-trn-feedback:not(:empty){padding:12px 14px}
.snet-trn-feedback.is-good{background:var(--trn-olive-tint)}
.snet-trn-feedback.is-ok{background:var(--trn-ok-tint)}
.snet-trn-feedback.is-bad{background:var(--trn-bad-tint)}
.snet-trn-reaction{font-style:italic}
.snet-trn-mfoot{display:grid;gap:10px;border-top:1px solid var(--trn-border);padding-top:16px}
.snet-trn-writing{display:grid;gap:12px}
.snet-trn-writing textarea{width:100%;box-sizing:border-box;font:400 16px/1.5 var(--font);padding:12px;border:1px solid var(--trn-border);border-radius:8px;color:var(--trn-ink);background:var(--field)}
.snet-trn-tips:not(:empty){background:var(--trn-cream);border-radius:12px;padding:16px 20px;display:grid;gap:8px}
.snet-trn-tips ul{margin:0;padding-left:20px;display:grid;gap:4px}
:root[data-theme="dark"] .snet-training{--trn-olive-tint:rgba(107,145,66,.18);--trn-bad-tint:rgba(191,91,55,.18);--trn-ok-tint:rgba(169,119,26,.18)}
@media (prefers-color-scheme:dark){:root:not([data-theme]) .snet-training{--trn-olive-tint:rgba(107,145,66,.18);--trn-bad-tint:rgba(191,91,55,.18);--trn-ok-tint:rgba(169,119,26,.18)}}
@media (prefers-reduced-motion:reduce){.snet-training *{transition:none !important;scroll-behavior:auto !important}}