@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/archivo-regular.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/archivo-500.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/archivo-600.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/archivo-700.woff2') format('woff2');}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/archivo-800.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/ibm-plex-mono-regular.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/ibm-plex-mono-500.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/ibm-plex-mono-600.woff2') format('woff2');}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/newsreader-regular.woff2') format('woff2');}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/newsreader-500.woff2') format('woff2');}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/newsreader-600.woff2') format('woff2');}
@font-face{font-family:'Newsreader';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/newsreader-700.woff2') format('woff2');}
/* Hitungkita — direktori UMK 2026. Bahasa visual: dokumen cetak. */
:root{
  --paper:#f6f2e8; --paper2:#efe9d8; --ink:#191713; --ink2:#4a453a;
  --red:#b33525; --line:#191713; --card:#fffdf7;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Archivo",-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6;font-size:16px;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 31px,rgba(25,23,19,.045) 31px,rgba(25,23,19,.045) 32px);}
a{color:inherit}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.site-head{border-bottom:3px solid var(--line);background:var(--card);position:sticky;top:0;z-index:50}
.site-head .wrap{display:flex;align-items:center;gap:18px;padding:12px 20px;flex-wrap:wrap}
.brand{font-family:var(--mono);font-weight:700;letter-spacing:.12em;font-size:15px;text-decoration:none;
  border:2px solid var(--line);padding:4px 10px;background:var(--ink);color:var(--paper)}
.site-nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.site-nav a{text-decoration:none;font-size:13.5px;font-weight:600;padding:6px 10px;border:2px solid transparent}
.site-nav a:hover,.site-nav a.on{border-color:var(--line);background:var(--paper2)}
.crumbs{font-family:var(--mono);font-size:12.5px;padding:14px 0;color:var(--ink2)}
.crumbs a{text-decoration:none;border-bottom:1px dotted var(--ink2)}
main{padding:8px 0 40px}
.stamp{display:inline-block;font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--red);
  border:2.5px solid var(--red);padding:5px 12px;transform:rotate(-2deg);margin-bottom:14px;background:rgba(179,53,37,.06)}
h1{font-family:var(--serif);font-size:clamp(30px,4.6vw,46px);line-height:1.12;letter-spacing:-.01em;margin-bottom:10px}
.lede{font-size:17px;color:var(--ink2);max-width:62ch;margin-bottom:22px}
.plate{background:#141210;color:#f6f2e8;border:3px solid var(--line);box-shadow:6px 6px 0 var(--line);
  padding:18px 22px;margin:20px 0 26px;position:relative}
.plate .lbl{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;color:#b9b2a0;margin-bottom:6px}
.plate .val{font-family:var(--mono);font-weight:700;font-size:clamp(28px,5vw,44px);letter-spacing:.02em}
.plate .sub{font-size:13.5px;color:#b9b2a0;margin-top:6px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(3,1fr)} .g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:2.5px solid var(--line);box-shadow:4px 4px 0 var(--line);padding:16px 18px}
.card h3{font-family:var(--serif);font-size:20px;margin-bottom:4px}
.card h3 a{text-decoration:none} .card h3 a:hover{text-decoration:underline}
.card .meta{font-family:var(--mono);font-size:12.5px;color:var(--ink2)}
.stat{background:var(--ink);color:var(--paper);border:2.5px solid var(--line);padding:14px 16px}
.stat .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:#b9b2a0}
.stat .v{font-family:var(--mono);font-weight:700;font-size:22px;margin-top:2px}
table.data{width:100%;border-collapse:collapse;background:var(--card);border:2.5px solid var(--line);font-size:14.5px}
table.data th{background:var(--ink);color:var(--paper);text-align:left;padding:10px 12px;font-family:var(--mono);
  font-size:12px;letter-spacing:.1em;font-weight:600}
table.data td{padding:9px 12px;border-top:1.5px solid #d8d1bd;vertical-align:top}
table.data tr:hover td{background:#f3edd9}
table.data td.num{font-family:var(--mono);font-weight:600;white-space:nowrap}
table.data a{text-decoration:none;font-weight:600} table.data a:hover{text-decoration:underline}
.filter{width:100%;font:inherit;padding:12px 14px;border:2.5px solid var(--line);background:var(--card);
  box-shadow:4px 4px 0 var(--line);margin:14px 0;font-size:15px}
.filter:focus{outline:3px solid var(--red);outline-offset:1px}
.sec{margin:34px 0}
.sec>h2{font-family:var(--serif);font-size:clamp(22px,3vw,30px);margin-bottom:6px;
  padding-bottom:8px;border-bottom:3px solid var(--line)}
.sec>p{color:var(--ink2);max-width:70ch;margin-bottom:12px}
.faq{border:2.5px solid var(--line);background:var(--card);margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:700;padding:12px 16px;list-style:none;display:flex;gap:10px;align-items:baseline}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";font-family:var(--mono);font-weight:700;color:var(--red)}
.faq[open] summary::before{content:"–"}
.faq .a{padding:0 16px 14px;color:var(--ink2)}
.note{border-left:5px solid var(--red);background:#f8e9e4;padding:12px 16px;font-size:14.5px;margin:18px 0}
.src{font-size:13px;color:var(--ink2);margin-top:22px;border-top:1.5px dashed #b9b2a0;padding-top:10px}
.src a{color:var(--ink)}
footer{border-top:3px solid var(--line);background:var(--card);margin-top:30px;padding:22px 0 34px;font-size:13.5px;color:var(--ink2)}
footer .wrap{display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:16px 0}
.kv .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--ink2)}
.kv .v{font-weight:700;font-size:16px}
.badge{display:inline-block;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.08em;
  border:2px solid var(--line);padding:2px 8px;background:var(--paper2);margin:2px 4px 2px 0}
@media(max-width:640px){
  .g2,.g3,.g4{grid-template-columns:1fr}
  table.data{font-size:13.5px} table.data th:nth-child(4),table.data td:nth-child(4){display:none}
  .plate{box-shadow:4px 4px 0 var(--line)}
}
