:root{--accent:#2E4A2A;--bg:#F7F7F5;--card:#FFF;--ink:#1A1A1A;--ink2:#3D3D3D;
--muted:#6B6B6B;--light:#8A857E;--hair:#EAEAE5}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);
font-family:'IBM Plex Sans','Segoe UI',system-ui,Arial,sans-serif;line-height:1.55;
overflow-wrap:anywhere}
.wrap{max-width:1060px;margin:0 auto;padding:24px 16px 80px;min-width:0}
/* R4-L1 (6.9.2026): katkeamaton osoite, tunniste tai pitkä yhdyssana ei saa leventää sivua
   390 px:ssä; overflow-wrap periytyy bodysta kaikkeen tekstiin (mitattu: etusivu 470 px,
   juttusivut 639 px, raportti 612 px ennen korjausta) */
h1,h2,h3{hyphens:auto}
img,video,iframe{max-width:100%}
.vieri{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
.kapea{max-width:760px}
.masthead{background:var(--card);border-top:5px solid var(--accent);padding:22px 28px;margin-bottom:14px}
.masthead h1{margin:0;font-size:26px;color:var(--accent)}
.masthead .tag{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--light);margin-top:2px}
.navrow{display:flex;gap:8px;margin:0 0 18px;flex-wrap:wrap}
.navrow a{font-size:12px;font-weight:600;color:var(--ink2);background:var(--card);
border:1px solid var(--hair);padding:8px 12px;text-decoration:none}
.navrow a.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.tldr{background:var(--accent);color:#fff;padding:18px 24px;margin-bottom:18px}
.tldr .k{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.06em;color:#D4DED0;text-transform:uppercase}
.tldr ul{margin:8px 0 0;padding-left:18px}.tldr li{margin:5px 0;font-size:13.5px}
.tldr a{color:#fff}
.hero{background:var(--card);border:1px solid var(--hair);border-left:5px solid var(--accent);
padding:26px 30px;margin-bottom:16px}
.hero h2{margin:0 0 8px;font-size:24px;line-height:1.25}
.hero .meta,.card .meta,.meta{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--muted)}
.hero .body{font-size:15px;color:var(--ink2)}.hero .body p{margin:0 0 10px}
.section-h{font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
color:var(--ink2);border-left:4px solid var(--accent);border-bottom:1px solid var(--hair);
padding:2px 0 8px 10px;margin:26px 0 12px}
.grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start}
@media(min-width:860px){.grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.card{background:var(--card);border:1px solid var(--hair);padding:16px 20px;
display:flex;flex-direction:column;scroll-margin-top:14px;min-width:0}
.card h3{margin:0 0 6px;font-size:15.5px;line-height:1.3}
.card .body{font-size:13.5px;color:var(--ink2);white-space:pre-line;display:-webkit-box;
-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.card:target{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset}
.card:target .body{display:block;-webkit-line-clamp:unset;overflow:visible}
.card:target .more{display:none}
.card .sivu{display:none}
.card:target .sivu{display:inline-block;margin-top:10px}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--accent)}
.more{margin-top:auto;padding-top:10px;font-size:12px;font-weight:600;color:var(--accent);text-decoration:none}
.puute{color:#8a4a00}
h2.osio{font-size:1.05em;margin:28px 0 8px;color:var(--accent)}
blockquote{margin:10px 0;padding:8px 14px;border-left:3px solid var(--accent);
background:var(--card);font-size:15px}
.jalka{margin-top:30px;font-family:'IBM Plex Mono',monospace;font-size:10px;color:var(--light);
border-top:1px solid var(--hair);padding-top:10px;display:flex;justify-content:space-between;
flex-wrap:wrap;gap:6px 18px}
.jalka span{white-space:nowrap}.jalka span:nth-child(2){white-space:normal;flex:1 1 320px}
.art table{border-collapse:collapse;width:100%;font-size:14px;margin:10px 0}
.art .vieri table{margin:0}
.art td,.art th{border-bottom:1px solid var(--hair);padding:5px 6px;text-align:left;vertical-align:top}
.art h1{font-size:1.4em;color:var(--accent)}.art h2{font-size:1.15em;margin-top:22px}
.art code{background:var(--bg);padding:1px 4px;font-size:.9em}.art hr{border:0;border-top:1px solid var(--hair)}
.oikaisu{background:#FDECEA;border-left:3px solid #B42318;color:#7A1B12;
padding:8px 14px;margin:10px 0;font-size:13.5px}
.oikaisu b{letter-spacing:.04em}
.puutteet{background:var(--card);border:1px solid var(--hair);padding:14px 20px;margin-top:24px}
.puutteet h3{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2);margin:12px 0 6px}
.puutteet ul{margin:4px 0;padding-left:18px}.puutteet li{font-size:12.5px;color:var(--ink2);margin:3px 0}
.art{background:var(--card);border:1px solid var(--hair);padding:18px 22px;margin-bottom:10px}
.art h3{margin:0 0 6px;font-size:16px}
a{color:var(--accent)}
p{margin:0 0 10px}

/* Perusta yllä: Azure suora_lehti.py CSS, lähdekopio 10.9.2026.
   Alla uuden moduulirajan lomakkeet, saavutettavuus ja lukijan lisätoiminnot. */
/* Alkuperäiset IBM Plex -fontit paikallisesti, SIL OFL 1.1: fonts/OFL.txt.
   Selain ei tarvitse ulkoista fonttipalvelua tai löysempää CSP:tä. */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexSans-Regular.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexSans-Italic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/IBMPlexSans-SemiBold.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/IBMPlexSans-Bold.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:italic;font-weight:700;font-display:swap;src:url('/assets/fonts/IBMPlexSans-BoldItalic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexMono-Regular.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexMono-Italic.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/IBMPlexMono-Bold.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:italic;font-weight:700;font-display:swap;src:url('/assets/fonts/IBMPlexMono-BoldItalic.woff2') format('woff2')}
pre,code{font-family:'IBM Plex Mono',monospace}
body{font-size:15px}.brand{color:var(--accent);text-decoration:none}
.masthead{margin-top:24px}.masthead h1{font-weight:700}.masthead .tag{margin-bottom:0}
.site-wrap{max-width:1060px;margin:0 auto;padding:0 16px 60px;min-width:0}
.site-wrap>main{min-height:50vh}.navrow{align-items:center}.navrow form{margin:0}
nav a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.skip{position:absolute;left:16px;top:-80px;background:var(--card);padding:10px;z-index:5}.skip:focus{top:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0)}
h1.page-title{font-size:24px;line-height:1.25;margin:0 0 16px;color:var(--accent)}
.edition-heading{display:flex;align-items:start;justify-content:space-between;gap:16px;margin:0 0 16px}
.edition-heading h1{font-size:18px;margin:0}.edition-heading .meta{margin:4px 0}
.edition-heading nav{display:flex;gap:12px;flex-wrap:wrap;font-size:12px}
.hero h2 a{color:var(--ink);text-decoration:none}.hero h2 a:hover{color:var(--accent)}
.hero .body .ingress{font-size:15px;font-weight:600}.card .body .ingress{font-weight:600}
.tldr h2.k{font-weight:400;line-height:1.5;margin:0}.card .body p{margin-bottom:10px}
.card .body>*:last-child{margin-bottom:0}.card .sivu{font-size:12px;font-weight:600;color:var(--accent)}
.card:target .sivu{display:inline-block}.card:target .body{display:block;overflow:visible}
.reading-column{max-width:760px;margin:0 auto}.article-nav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;margin:0 auto 16px;max-width:760px}
.article-nav nav{display:flex;gap:12px;flex-wrap:wrap}.reading-column .art>h1{font-size:22.5px;line-height:1.25;margin:0 0 12px}
.reading-column .ingress{font-weight:600}.sources{border-top:1px solid var(--hair);margin-top:24px;padding-top:12px}
.sources li{margin-bottom:12px}.sources .meta{margin-top:4px}.sources cite{font-size:12px;font-style:normal}
.source-meta{margin:0 0 10px}.source-text{border:1px solid var(--hair);background:var(--card);padding:16px;font:13px/1.65 'IBM Plex Mono',monospace}
table{border-collapse:collapse;width:100%;font-size:14px}td,th{padding:8px;text-align:left;border-bottom:1px solid var(--hair);vertical-align:top}
.table-scroll{max-width:100%;overflow-x:auto}.body table{display:block;overflow-x:auto;max-width:100%}
.body .vieri table{display:table;overflow:visible;max-width:none;min-width:42rem;overflow-wrap:normal;word-break:normal}
.body .vieri th,.body .vieri td{min-width:8rem}
.vieri:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
button,.button{display:inline-block;border:1px solid var(--accent);background:var(--accent);color:#fff;padding:8px 14px;font:600 13px/1.5 'IBM Plex Sans','Segoe UI',system-ui,sans-serif;cursor:pointer;text-decoration:none}
button:hover,.button:hover{background:#223b1f;color:#fff}button.secondary{background:var(--card);color:var(--accent)}
.text-button{border:0;background:none;color:var(--accent);padding:0;font-weight:400}.text-button:hover{background:none;color:var(--accent);text-decoration:underline}
button:disabled{opacity:.5;cursor:default}input,textarea,select{width:100%;font:inherit;padding:9px 11px;border:1px solid var(--hair);background:var(--card);color:var(--ink);max-width:100%}
textarea{resize:vertical}input[type=checkbox]{width:auto}input[type=date]{max-width:250px}label{display:block;margin:10px 0 5px;font-size:13px;font-weight:600}
form{margin:14px 0}.button-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.button-row form{margin:0}
.notice{background:#fff8e8;border-left:3px solid #8a4a00;padding:12px 16px;margin:16px 0;font-size:13px}
.panel{border:1px solid var(--hair);background:var(--card);padding:18px 22px;margin:18px 0;min-width:0}.panel h2{font-size:19px;margin-top:0}
.empty,.login-panel{max-width:760px;margin:auto;padding:22px;background:var(--card);border:1px solid var(--hair)}
.empty h1,.login-panel h1{font-size:24px;color:var(--accent)}.login-panel form{display:flex;gap:12px;flex-wrap:wrap}
.eyebrow,.section-label{font:11px/1.5 'IBM Plex Mono',monospace;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.tabs{display:flex;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--hair);margin-bottom:22px}.tabs a{padding:10px 0;font-size:13px;color:var(--ink2);text-decoration:none}
.tabs a.active{color:var(--accent);border-bottom:3px solid var(--accent)}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--hair);background:var(--card);margin:20px 0}
.metrics div{padding:18px;border-right:1px solid var(--hair)}.metrics strong{display:block;font-size:25px}.metrics span{font-size:12px;color:var(--muted)}
.work-row{border-bottom:1px solid var(--hair);padding:14px 0;font-size:13px}.work-row span{display:block;color:var(--muted)}.work-row form{display:inline-block;margin-right:10px}
.badge{display:inline-block;border:1px solid var(--hair);padding:3px 9px;font-size:11px}.search-form{display:flex;gap:10px;flex-wrap:wrap}.search-form input:not([type=hidden]){flex:1;min-width:160px}
.search-results article{background:var(--card);border:1px solid var(--hair);padding:16px 20px;margin-bottom:12px}.search-results h2{font-size:18px;margin:0 0 8px}
.search-results small{font:11px 'IBM Plex Mono',monospace;color:var(--muted)}.archive-list{padding:0;list-style:none}
.archive-list li{background:var(--card);border-bottom:1px solid var(--hair);padding:14px 18px}.archive-list a{display:flex;justify-content:space-between;gap:12px;text-decoration:none}.archive-list span{font-size:12px;color:var(--muted)}
.feedback{border:1px solid var(--hair);background:var(--card);padding:18px 22px;margin:22px 0}.feedback h2{font-size:18px;margin-top:0}
.error-form{margin:22px 0;font-size:13px}details summary{cursor:pointer;color:var(--accent)}
.owner-note,.event,.edition-quality{font-size:12px;color:var(--muted)}.checkbox{display:flex;gap:10px;align-items:center}
.plan-choice{border-top:1px solid var(--hair);padding:12px 0}.plan-choice input[type=number]{max-width:110px}
.timeline{border-left:2px solid var(--hair);padding-left:26px}.timeline li{padding:12px}.timeline time{font-size:12px;color:var(--muted)}
@media(max-width:640px){.site-wrap{padding:0 8px 40px}.masthead{margin-top:12px}.edition-heading{display:block}.edition-heading nav{margin-top:12px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics div{padding:12px}.panel,.feedback{padding:16px}.navrow{gap:6px}.navrow a{padding:7px 9px}.reading-column .art{padding:16px}.search-form input:not([type=hidden]){flex-basis:100%}}

.omission-list{padding-left:20px}.omission-list li{margin:0 0 14px;line-height:1.6}.omission-pagination{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:20px 0}.omission-search{max-width:760px}.review-disclosure,.review-language{border:1px solid var(--hair);padding:12px;margin:12px 0}.review-disclosure summary,.review-language summary{font-weight:600}.review-language .art{margin:12px 0}.omission-list strong{font-weight:600}
