/* State guide components. Scoped under .sg so nothing leaks into shared styles. */
.sg{--sg-green:#1f5b45;--sg-green-dark:#16302a;--sg-line:#d8d0bb;--sg-soft:#f5f1e4;--sg-ink:#23302c;--sg-muted:#5b665f;font-size:1.05rem;line-height:1.65;color:var(--sg-ink)}
.sg-shell{grid-template-columns:minmax(0,1fr)}
.sg>p,.sg>ul,.sg>ol,.sg>h2,.sg>h3,.sg>.sg-note,.sg>.sg-faq{max-width:780px}
.sg h2{margin:2.4rem 0 .6rem;scroll-margin-top:90px}
.sg h3{margin:1.6rem 0 .4rem}
.sg a{color:var(--sg-green)}
.sg .sg-note{padding:14px 16px;background:#fff8df;border-left:5px solid #b78b2f;margin:1.2rem 0}
.sg .sg-small{font-size:.86rem;color:var(--sg-muted)}
.sg-toc{display:flex;flex-wrap:wrap;gap:8px;margin:1rem 0 1.6rem;padding:0;list-style:none}
.sg-toc a{display:inline-block;padding:7px 12px;border:1px solid var(--sg-line);background:#fff;text-decoration:none;font-weight:700;font-size:.9rem}
.sg-toc a:hover,.sg-toc a:focus-visible{border-color:var(--sg-green);background:var(--sg-soft)}
.sg-figure{margin:0 0 1.6rem}
.sg-figure img{display:block;width:100%;height:auto;background:#e8e2d0}
.sg-figure figcaption{font-size:.82rem;color:var(--sg-muted);padding-top:8px}
.sg-facts{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin:1rem 0 1.6rem}
.sg-fact{border:1px solid var(--sg-line);background:#fff;padding:14px}
.sg-fact b{display:block;font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sg-muted);margin-bottom:6px}
.sg-fact span{display:block;font-size:.98rem;line-height:1.45}
.sg-chip{display:inline-block;padding:2px 8px;font-size:.72rem;font-weight:800;text-transform:uppercase;background:#eee;color:#333;vertical-align:middle}
.sg-chip.enacted{background:#e1f1e8;color:#1f5b45}
.sg-chip.active{background:#e6eefb;color:#1c3f7a}
.sg-chip.passed{background:#fff1cf;color:#6b4a00}
.sg-chip.dead{background:#f1e3e3;color:#7a2222}
.sg-tools{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));margin:1.2rem 0}
.sg-tool{border:2px solid var(--sg-green);background:#fff;padding:16px}
.sg-tool h3{margin:0 0 .3rem;font-size:1.05rem}
.sg-tool label{display:block;font-weight:700;font-size:.88rem;margin:.7rem 0 .25rem}
.sg-tool input,.sg-tool select{width:100%;max-width:100%;padding:9px 10px;border:1px solid #9aa59d;background:#fff;font:inherit;box-sizing:border-box}
.sg-tool .sg-check{display:flex;gap:8px;align-items:center;font-weight:600;margin-top:.7rem}
.sg-tool .sg-check input{width:auto}
.sg-out{margin-top:.9rem;padding:12px;background:var(--sg-soft);border-left:4px solid var(--sg-green);min-height:3.2rem}
.sg-out strong{font-size:1.25rem;color:var(--sg-green-dark)}
.sg-steps{list-style:none;margin:.8rem 0;padding:0}
.sg-steps li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--sg-line);background:#fff;margin:6px 0}
.sg-steps input{margin-top:.35rem;width:18px;height:18px;flex:none}
.sg-steps li.done span{text-decoration:line-through;color:var(--sg-muted)}
.sg-bar{height:8px;background:#e6e0cc;margin:.6rem 0}
.sg-bar i{display:block;height:100%;width:0;background:var(--sg-green);transition:width .2s}
.sg-tablewrap{overflow-x:auto;margin:1rem 0}
.sg-table{width:100%;border-collapse:collapse;font-size:.95rem}
.sg-table th,.sg-table td{border:1px solid var(--sg-line);padding:10px;text-align:left;vertical-align:top}
.sg-table th{background:var(--sg-soft)}
.sg-table th button{all:unset;cursor:pointer;font-weight:800}
.sg-table th button:focus-visible{outline:2px solid var(--sg-green)}
.sg-table th[aria-sort=ascending] button::after{content:" \25B2";font-size:.7em}
.sg-table th[aria-sort=descending] button::after{content:" \25BC";font-size:.7em}
.sg-table tr.current td{background:#eef6f1}
.sg-controls{display:flex;flex-wrap:wrap;gap:10px;margin:1rem 0}
.sg-controls input,.sg-controls select{padding:9px 10px;border:1px solid #9aa59d;font:inherit;min-width:200px;background:#fff}
.sg-faq details{border:1px solid var(--sg-line);background:#fff;margin:8px 0;padding:0}
.sg-faq summary{cursor:pointer;padding:12px 14px;font-weight:700}
.sg-faq details[open] summary{border-bottom:1px solid var(--sg-line);background:var(--sg-soft)}
.sg-faq details p{padding:0 14px;margin:.7rem 0}
.sg-timeline{list-style:none;margin:1rem 0;padding:0 0 0 18px;border-left:3px solid var(--sg-green)}
.sg-timeline li{position:relative;margin:0 0 14px;padding-left:14px}
.sg-timeline li::before{content:"";position:absolute;left:-26px;top:.5rem;width:11px;height:11px;border-radius:50%;background:var(--sg-green)}
.sg-timeline time{display:block;font-weight:800;font-size:.86rem;color:var(--sg-green-dark)}
.sg-cards{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));margin:1rem 0}
.sg-card{display:block;border:1px solid var(--sg-line);background:#fff;text-decoration:none;color:inherit;overflow:hidden}
.sg-card:hover,.sg-card:focus-visible{border-color:var(--sg-green)}
.sg-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.sg-card div{padding:12px 14px}
.sg-card b{display:block;color:var(--sg-green-dark);margin-bottom:4px}
.sg-card span{font-size:.88rem;color:var(--sg-muted)}
.sg-list-cards{display:grid;gap:10px;margin:1rem 0;padding:0;list-style:none}
.sg-list-cards li{border:1px solid var(--sg-line);background:#fff;padding:12px 14px}
.sg-list-cards a{font-weight:700}
@media (max-width:600px){.sg{font-size:1rem}.sg-controls input,.sg-controls select{min-width:0;width:100%}}