:root{--rako:16px;--reuna:#e2e2e2;--muste:#1a1a1a;--linkki:#0b5cad;--palkki:#f6f7f9;--tausta:#fff;--vaimea:#8a8a8a;--koodi:#f0f0f3}
@media(prefers-color-scheme:dark){
  :root{--reuna:#333a44;--muste:#e6e6e6;--linkki:#78b9f0;--palkki:#181c21;--tausta:#11151a;--vaimea:#9aa4b0;--koodi:#1e242b}
}
*{box-sizing:border-box}
body{margin:0;font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muste);background:var(--tausta);display:flex}
.sivupalkki{width:300px;min-width:300px;height:100vh;overflow:auto;position:sticky;top:0;padding:var(--rako);background:var(--palkki);border-right:1px solid var(--reuna);font-size:14px}
.navi-otsikko{font-weight:700;font-size:16px;margin-bottom:12px}
.navi-otsikko a{color:var(--muste);text-decoration:none}
.navi-taso{margin-bottom:22px}
.navi-taso-otsikko{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--vaimea);padding-bottom:5px;margin:10px 0 6px;border-bottom:1px solid var(--reuna)}
.navi-taso-toissijainen{opacity:.9}
.navi-ryhma h2{font-size:13px;font-weight:700;color:var(--muste);margin:14px 0 4px}
.navi-osa-alue{margin:6px 0 10px}
details.navi-osa-alue>summary,details.navi-moduuli>summary{list-style:none;cursor:pointer;user-select:none}
details.navi-osa-alue>summary::-webkit-details-marker,details.navi-moduuli>summary::-webkit-details-marker{display:none}
details.navi-osa-alue>summary::before,details.navi-moduuli>summary::before{content:'+';display:inline-block;width:1em;color:var(--vaimea);font-weight:400}
details[open].navi-osa-alue>summary::before,details[open].navi-moduuli>summary::before{content:'−'}
.osa-alue-otsikko{font-size:13px;font-weight:700;color:var(--linkki);margin:12px 0 4px}
.navi-osa-alue .navi-moduuli{padding-left:8px;border-left:2px solid var(--reuna);margin-left:2px}
details.navi-moduuli>summary{font-size:13px;margin:8px 0 2px;color:var(--muste);font-weight:700}
.laajenna-nappi{width:100%;margin-bottom:10px;padding:5px 8px;border:1px solid var(--reuna);border-radius:6px;background:var(--tausta);font-size:12px;color:var(--muste);cursor:pointer;text-align:left}
.laajenna-nappi:hover{border-color:var(--linkki)}
.navi-kategoria{margin:4px 0}
.navi-kategoria h4{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--vaimea);margin:6px 0 2px;padding-left:8px}
.sivupalkki ul{list-style:none;margin:0 0 4px;padding-left:8px}
.sivupalkki li{margin:2px 0}
.sivupalkki a{color:var(--linkki);text-decoration:none}
.sivupalkki a:hover{text-decoration:underline}
.sisalto{flex:1;max-width:900px;padding:32px 40px;overflow-x:auto}
.sisalto h1{margin-top:0}
.kortit{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:16px 0 8px}
.kortti{display:block;padding:16px;border:1px solid var(--reuna);border-radius:8px;background:var(--palkki);text-decoration:none;color:var(--muste);transition:border-color .12s,box-shadow .12s}
.kortti:hover{border-color:var(--linkki);box-shadow:0 1px 6px rgba(0,0,0,.12)}
.kortti h3{margin:0 0 4px;font-size:16px;color:var(--linkki)}
.kortti p{margin:0;font-size:13px;color:var(--vaimea)}
.vinkki{font-size:13px;color:var(--vaimea)}
.meta{margin:0 0 24px;padding-bottom:12px;border-bottom:1px solid var(--reuna)}
.merkki{display:inline-block;font-size:12px;background:var(--palkki);border:1px solid var(--reuna);border-radius:4px;padding:1px 8px;margin:2px 4px 2px 0;color:var(--muste)}
.merkki.tila-valmis{background:#e6f5ea;border-color:#bfe3c9;color:#14532d}
.merkki.tila-luonnos{background:#fff4e0;border-color:#f0dcae;color:#713f12}
.merkki.tila-vanhentunut{background:#fbe6e6;border-color:#eebcbc;color:#7f1d1d}
.merkki.tila-kesken{background:#e7edfb;border-color:#c3d2f2;color:#1e3a8a}
.lahteet{margin-top:8px;font-size:14px}
.lahteet code{font-size:12px}
a{color:var(--linkki)}
code{background:var(--koodi);padding:1px 5px;border-radius:3px;font-size:.9em}
pre{background:var(--palkki);border:1px solid var(--reuna);border-radius:6px;padding:12px;overflow-x:auto}
pre code{background:none;padding:0}
pre.mermaid{background:var(--tausta);text-align:center}
table{border-collapse:collapse;width:100%;margin:16px 0;display:block;overflow-x:auto}
th,td{border:1px solid var(--reuna);padding:6px 10px;text-align:left;vertical-align:top}
th{background:var(--palkki)}
blockquote{margin:16px 0;padding:8px 16px;border-left:4px solid var(--reuna);background:var(--palkki);color:var(--muste)}
.haku{margin-bottom:14px}
#haku-kentta{width:100%;padding:7px 9px;border:1px solid var(--reuna);border-radius:6px;font-size:14px;background:var(--tausta);color:var(--muste)}
#haku-tulokset{margin-top:6px}
.haku-osuma{display:block;padding:6px 8px;border-radius:5px;text-decoration:none;color:var(--muste)}
.haku-osuma:hover{background:var(--tausta)}
.haku-t{display:block;color:var(--linkki);font-size:13px}
.haku-p{display:block;color:var(--vaimea);font-size:11px}
.haku-ei{padding:6px 8px;color:var(--vaimea);font-size:13px}
.navi-nappi{display:none}
@media(max-width:800px){
  body{display:block}
  .sivupalkki{display:none;width:100%;height:auto;position:static}
  body.navi-auki .sivupalkki{display:block}
  .navi-nappi{display:block;width:100%;padding:12px;border:0;background:var(--palkki);border-bottom:1px solid var(--reuna);font-size:15px;text-align:left;cursor:pointer;color:var(--muste)}
  .sisalto{padding:20px}
}
