/* ============================================================
   KALKULATOR BABI — tema "Kokpit"
   Gelap secara bawaan: panel grafit, aksen hijau limau, angka monospasi.
   Mode terang mengikuti pengaturan sistem, atau paksa lewat
   <html data-theme="light"> / <html data-theme="dark">.
   Nama token (--good, --danger, --anggota, ...) dipakai juga oleh JS untuk
   grafik SVG, jadi jangan diganti.
   ============================================================ */

/* ---------- 1. TOKEN ---------- */
:root{
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --cond:"IBM Plex Sans Condensed","IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --rail-w:248px; --inspector-w:360px;

  color-scheme:dark;
  --bg:#0A0D0B; --rail:#0E120F; --surface:#121713; --surface-2:#182019; --field:#0A0D0B;
  --fg:#E6EDE7; --fg-muted:#A3B0A7; --fg-faint:#7F8D84;
  --border:#26302A; --border-soft:#1B231D; --border-strong:#34423A;
  --grid:#26302A; --baseline:#3A473F;
  --accent:#B9F04A; --accent-ink:#0A0D0B; --accent2:#FFB938; --focus:#B9F04A;
  --good:#B9F04A; --warn:#FFB938; --critical:#FF6F61;
  --bar:#6F9A2E;
  --good-bg:#122010; --warn-bg:#231A0A; --critical-bg:#1C1210;
  --danger:#FF6F61; --danger-bg:#1C1210; --danger-ink:#FFB4AB; --danger-line:#7A2E28;
  --warn-ink:#FFD98A; --warn-line:#8A5A10;
  --good-ink:#D3F58A; --good-line:#4C7A1C;
  --anggota:#63C9F5; --kop:#FFB938;
  --shadow:0 8px 24px rgba(0,0,0,.5);
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23A3B0A7' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    color-scheme:light;
    --bg:#EDF1EA; --rail:#E3E9E0; --surface:#FFFFFF; --surface-2:#F1F5EE; --field:#FFFFFF;
    --fg:#141A15; --fg-muted:#46534B; --fg-faint:#5F6D63;
    --border:#CBD4C8; --border-soft:#E4EAE1; --border-strong:#A3B0A5;
    --grid:#DCE3D9; --baseline:#B4C0B6;
    --accent:#2F6B0A; --accent-ink:#FFFFFF; --accent2:#9A6200; --focus:#2F6B0A;
    --good:#3A7B10; --warn:#8A5A00; --critical:#C23B2E;
    --bar:#5B9A1F;
    --good-bg:#E8F3DC; --warn-bg:#FBF0D9; --critical-bg:#FBEAE7;
    --danger:#C23B2E; --danger-bg:#FBEAE7; --danger-ink:#8F2417; --danger-line:#E29A92;
    --warn-ink:#6B4200; --warn-line:#D9A63C;
    --good-ink:#2A5A0B; --good-line:#8FC05A;
    --anggota:#1B76A3; --kop:#B87400;
    --shadow:0 8px 24px rgba(20,26,21,.18);
    --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2346534B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  }
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#EDF1EA; --rail:#E3E9E0; --surface:#FFFFFF; --surface-2:#F1F5EE; --field:#FFFFFF;
  --fg:#141A15; --fg-muted:#46534B; --fg-faint:#5F6D63;
  --border:#CBD4C8; --border-soft:#E4EAE1; --border-strong:#A3B0A5;
  --grid:#DCE3D9; --baseline:#B4C0B6;
  --accent:#2F6B0A; --accent-ink:#FFFFFF; --accent2:#9A6200; --focus:#2F6B0A;
  --good:#3A7B10; --warn:#8A5A00; --critical:#C23B2E;
  --bar:#5B9A1F;
  --good-bg:#E8F3DC; --warn-bg:#FBF0D9; --critical-bg:#FBEAE7;
  --danger:#C23B2E; --danger-bg:#FBEAE7; --danger-ink:#8F2417; --danger-line:#E29A92;
  --warn-ink:#6B4200; --warn-line:#D9A63C;
  --good-ink:#2A5A0B; --good-line:#8FC05A;
  --anggota:#1B76A3; --kop:#B87400;
  --shadow:0 8px 24px rgba(20,26,21,.18);
  --chev:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2346534B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* ---------- 2. DASAR ---------- */
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.5 var(--sans);font-variant-numeric:tabular-nums;-webkit-text-size-adjust:100%;text-size-adjust:100%}
img{max-width:100%}
[hidden]{display:none!important}
button,input,select{font-family:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.printonly{display:none}
h1{margin:6px 0 8px;font:600 28px/1.15 var(--sans);letter-spacing:-.01em;text-wrap:balance}
h2{margin:24px 0 10px;font:600 12.5px/1.3 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted)}
h3{margin:0;font:600 14px/1.4 var(--sans)}
.sub{margin:0;max-width:780px;font-size:14px;line-height:1.55;color:var(--fg-muted)}
code{font:500 12.5px var(--mono)}

/* ---------- 3. KERANGKA APLIKASI + REL KIRI ---------- */
.app{display:grid;grid-template-columns:var(--rail-w) minmax(0,1fr);min-height:100vh}
.rail{position:sticky;top:0;align-self:start;display:flex;flex-direction:column;height:100vh;padding:22px 16px calc(22px + env(safe-area-inset-bottom,0px));background:var(--rail);border-right:1px solid var(--border);overflow-y:auto}
.brand{display:flex;align-items:center;gap:10px;padding:0 6px 24px;color:var(--accent)}
.brand-name{font:600 15px/1.15 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--fg)}
.rail-cap{padding:0 6px 8px;font:600 11px/1.4 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-faint)}
.calcswitch{display:flex;flex-direction:column;gap:4px}
.calcswitch-btn{display:flex;align-items:center;gap:12px;width:100%;height:44px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--fg-muted);font:500 14px var(--sans);text-align:left;cursor:pointer}
.calcswitch-btn:hover{background:var(--surface);color:var(--fg)}
.calcswitch-btn.is-active{background:var(--surface-2);color:var(--fg);font-weight:600}
.calcswitch-btn.is-active .navic{color:var(--accent)}
.calcswitch-btn.is-active::after{content:"";margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.scenario{margin-top:28px;padding:14px 14px 10px;border:1px solid var(--border);border-radius:10px}
.scenario .rail-cap{padding:0}
.scenario dl{margin:8px 0 0;font:400 12px/1.5 var(--mono)}
.scenario dl>div{display:flex;justify-content:space-between;gap:8px;padding:4px 0}
.scenario dt{color:var(--fg-faint)}
.scenario dd{margin:0;color:var(--fg);text-align:right}
.scenario dd.tone-danger{color:var(--critical)}
.scenario dd.tone-warn{color:var(--warn)}
.scenario dd.tone-good{color:var(--good)}
.rail-foot{margin:auto 0 0;padding:16px 6px 0;font-size:12px;line-height:1.5;color:var(--fg-faint)}
.stage{min-width:0;padding:28px 28px calc(28px + env(safe-area-inset-bottom,0px))}
.calc{max-width:1600px}

/* ---------- 4. KEPALA HALAMAN, TAB, TOMBOL ---------- */
.pageheader{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 24px;flex-wrap:wrap}
.crumb{font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-faint)}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.exportbtn{display:inline-flex;align-items:center;gap:8px;flex:none;height:40px;padding:0 16px;border:1px solid var(--accent);border-radius:8px;background:transparent;color:var(--accent);font:600 14px var(--sans);white-space:nowrap;cursor:pointer}
.exportbtn:hover{background:var(--accent);color:var(--accent-ink)}

.tabbar{display:flex;gap:24px;margin:18px 0 20px;border-bottom:1px solid var(--border);overflow-x:auto}
.tabbtn{flex:none;height:44px;padding:0;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:none;color:var(--fg-muted);font:500 14px var(--sans);white-space:nowrap;cursor:pointer}
.tabbtn:hover{color:var(--fg)}
.tabbtn[aria-selected="true"]{color:var(--fg);font-weight:600;border-bottom-color:var(--accent)}
.tabpanel[hidden]{display:none}

/* ---------- 5. PANEL, KPI STRIP, TATA LETAK DASHBOARD ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:10px}
.panel-h{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;padding:0 16px;border-bottom:1px solid var(--border)}
.panel-h h2{margin:0}
.panel-h{flex-wrap:wrap;padding-top:6px;padding-bottom:6px}
.viewtoggle{display:inline-flex;margin-left:auto;border:1px solid var(--border-strong);border-radius:6px;overflow:hidden}
.viewtoggle button{height:30px;padding:0 11px;border:0;border-right:1px solid var(--border-strong);background:transparent;color:var(--fg-muted);font:500 12px var(--sans);cursor:pointer}
.viewtoggle button:last-child{border-right:0}
.viewtoggle button:hover{color:var(--fg)}
.viewtoggle button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);font-weight:600}
.viewtoggle button:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.panel-note{margin:0;padding:10px 16px 14px;border-top:1px solid var(--border-soft);font-size:12.5px;line-height:1.6;color:var(--fg-muted)}
.panel-meta{font:400 12px var(--mono);color:var(--fg-faint)}
.panel-b{padding:14px 16px 16px}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0 0 20px;background:var(--border);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.stats .stat{display:flex;flex-direction:column;gap:6px;min-width:0;padding:16px 18px;background:var(--surface);border:0;border-radius:0}
.stat .label{min-height:31px;font:500 12px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint)}
.stat .value{font:500 clamp(18px,1.6vw,23px)/1.2 var(--mono);color:var(--fg);overflow-wrap:anywhere}
.stat .value.good{color:var(--good)}
.stat .value.bad{color:var(--critical)}
.stat .note{margin:0;font-size:12px;line-height:1.4;color:var(--fg-muted)}
/* jumlah tile tidak selalu kelipatan 4: isi sisa kotak supaya garis pemisah tidak jadi blok */
.stats:has(> :nth-child(7):last-child)::after{content:"";background:var(--surface)}
.stats:has(> :nth-child(6):last-child)::after{content:"";grid-column:span 2;background:var(--surface)}
.stats:has(> :nth-child(5):last-child)::after{content:"";grid-column:span 3;background:var(--surface)}

.kk-grid{display:grid;grid-template-columns:minmax(0,1fr) var(--inspector-w);gap:20px;align-items:start}
.kk-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.paneltable{overflow:hidden}

/* ---------- 6. KOLOM ISIAN (INSPEKTUR) ---------- */
select,input[type=number],input[type=text]{width:100%;height:36px;padding:0 10px;border:1px solid var(--border-strong);border-radius:6px;background:var(--field);color:var(--fg);font:500 13px var(--mono);font-variant-numeric:tabular-nums;text-align:right}
select{padding-right:30px;font-family:var(--sans);text-align:left;appearance:none;-webkit-appearance:none;background-image:var(--chev);background-repeat:no-repeat;background-position:right 10px center;background-size:14px}
select:focus,input:focus{outline:2px solid var(--focus);outline-offset:1px;border-color:var(--focus)}
input:disabled,select:disabled{opacity:.5;cursor:not-allowed}
input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=range]{accent-color:var(--accent)}

.inputs{display:block;padding:4px 16px 16px}
.card.inputs{max-width:none}
.tabpanel>.card.inputs{max-width:560px;margin-bottom:12px}
.field{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;align-content:start;column-gap:12px;row-gap:8px;min-width:0;padding:8px 0;border-bottom:1px solid var(--border-soft)}
.field label{grid-column:1;font-size:13px;line-height:1.35;color:var(--fg-muted)}
.field>select{grid-column:2;width:150px}
.field>.percentwrap{grid-column:2;width:112px}
.field>input[type=text],.field>input[type=number]{grid-column:2;width:128px}
.field>.chiprow{grid-column:1 / -1;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
.field>.fld-msg{grid-column:1 / -1;text-align:right}
#pb-gelombang{grid-column:1 / -1;width:100%}
.percentwrap{position:relative}
.percentwrap input{padding-right:26px}
.percentwrap span{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:400 12px var(--mono);color:var(--fg-faint);pointer-events:none}
.sectionlabel{margin:18px 0 2px;padding:0;border:0;font:600 11.5px/1.35 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint)}
.chip{height:34px;padding:0 10px;border:1px solid var(--border-strong);border-radius:6px;background:transparent;color:var(--fg-muted);font:400 12px var(--mono);cursor:pointer}
.chip:hover{color:var(--fg);border-color:var(--fg-faint)}
.chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}

/* kotak centang tampil sebagai sakelar */
.checkfield{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.checkfield label{order:0;flex:1;cursor:pointer}
.checkfield input[type=checkbox]{order:1}
input[type=checkbox]{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:44px;height:26px;margin:0;border:1px solid var(--border-strong);border-radius:999px;background:var(--field);cursor:pointer}
input[type=checkbox]::after{content:"";position:absolute;top:2px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--fg-faint);transition:left .12s}
input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}
input[type=checkbox]:checked::after{left:21px;background:var(--accent-ink)}
input[type=checkbox]:disabled{opacity:.5;cursor:not-allowed}

/* ---------- 6b. KOMPONEN BERSAMA: ISIAN (.fld) DAN PENJELASAN (.info, .pop) ----------
   Dibuat oleh kb-ui.js (KB.ui.fields, KB.ui.help); dipakai Penggemukan dan Koperasi, Pembibitan menyusul. */
.fld{margin:0;padding:8px 0;border-bottom:1px solid var(--border-soft)}
.fld-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0}
.fld-lab{display:inline-flex;align-items:center;min-width:0}
.fld-top label,.fld-top .lbl{font-size:13px;font-weight:400;line-height:1.35;color:var(--fg-muted)}
.fld-val{display:inline-flex;align-items:center;gap:6px;flex:none}
.fld input.num{width:92px;height:36px;padding:0 10px;border:1px solid var(--border-strong);border-radius:6px;background:var(--field);color:var(--fg);font:500 13px var(--mono);text-align:right}
.fld input.num.wide{width:120px}
.fld input.num:disabled{background:var(--surface-2);color:var(--fg-faint)}
.fld select.num{margin-top:8px}
.fld .unit{min-width:1ch;font:400 12px var(--mono);color:var(--fg-faint)}
.fld input[type=range]{display:block;width:100%;height:24px;margin:6px 0 0}
.fld-chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px;margin-top:6px}
.fld-hint{margin-top:2px;font-size:12px;line-height:1.45;color:var(--fg-faint)}
.fld-msg{font-size:12px;color:var(--danger)}
.fld-msg:empty{display:none}
.fld.invalid input.num{border-color:var(--danger);outline-color:var(--danger)}
.fld.disabled .fld-top label{color:var(--fg-faint)}
.info{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;margin-left:6px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:transparent;color:var(--fg-muted);font:italic 700 .72rem/1 Georgia,"Times New Roman",serif;vertical-align:middle;cursor:pointer}
.info::after{content:"";position:absolute;inset:-13px}
.info:hover,.info[aria-expanded="true"]{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.pop{position:fixed;z-index:60;box-sizing:border-box;width:max-content;max-width:min(320px,calc(100vw - 16px));padding:10px 12px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);color:var(--fg);font-size:13px;line-height:1.5;box-shadow:var(--shadow)}

/* ---------- 7. GRAFIK ---------- */
.chartsub{margin:0 0 10px;font-size:12.5px;line-height:1.5;color:var(--fg-faint)}
.chartwrap{position:relative;width:100%}
svg.chart{display:block;width:100%;height:auto;overflow:visible}
svg.chart text{font-family:var(--mono)}
.gridline{stroke:var(--grid);stroke-width:1}
.baseline{stroke:var(--baseline);stroke-width:1}
.axislabel{fill:var(--fg-faint);font-size:11px;font-variant-numeric:tabular-nums}
.hoverline{stroke:var(--fg-faint);stroke-width:1;stroke-dasharray:3 4;pointer-events:none}
svg.chart rect[fill="var(--good)"]{fill:var(--bar);opacity:1}
svg.chart rect[fill="var(--good)"]:hover{fill:var(--accent)}
svg.chart rect[fill="var(--critical)"],svg.chart rect[fill="var(--danger)"]{opacity:1}
.tooltip{position:absolute;z-index:5;pointer-events:none;transform:translate(-50%,-115%);padding:6px 9px;border:1px solid var(--border-strong);border-radius:6px;background:var(--surface-2);color:var(--fg);font:400 12px/1.5 var(--mono);white-space:nowrap;box-shadow:var(--shadow)}
.legend{display:flex;gap:4px 14px;flex-wrap:wrap;margin-top:8px;font-size:12px;color:var(--fg-muted)}
.legend .item{display:flex;align-items:center;gap:6px}
.legend .swatch{width:8px;height:8px;border-radius:2px;flex:none}

/* ---------- 8. TABEL ---------- */
.tablewrap{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:12.5px}
thead th{position:sticky;top:0;padding:9px 10px;background:var(--surface-2);border-bottom:1px solid var(--border);text-align:right;font:600 11px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint);white-space:nowrap}
tbody td{padding:7px 10px;border-bottom:1px solid var(--border-soft);text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
tbody tr:hover{background:var(--surface-2)}
.dtable tfoot td{padding:9px 10px;text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.dtable tfoot td:first-child{text-align:left;font-family:var(--sans)}
thead th:first-child,thead th:nth-child(2),tbody td:first-child,tbody td:nth-child(2){text-align:left}
td.status{min-width:220px;text-align:left;white-space:normal;font:400 12px/1.4 var(--sans);color:var(--fg-muted)}
td.neg{color:var(--critical)}
.xtag{margin-left:5px;font:500 11px var(--mono);color:var(--accent2)}
#pb-table .masuk{display:block;margin-top:2px;font:500 11px/1.3 var(--mono);color:var(--accent2)}
#pb-table{min-width:1300px}
#pb-table thead th:nth-child(2),#pb-table tbody td:nth-child(2){text-align:right}
#pb-table tbody tr.yr td{border-bottom-color:var(--border-strong)}
#pg-table{min-width:980px}
#pb-table th:first-child,#pb-table td:first-child,#pg-table th:first-child,#pg-table td:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
#pb-table thead th:first-child,#pg-table thead th:first-child{background:var(--surface-2)}
#pb-table tbody tr:hover td:first-child,#pg-table tbody tr:hover td:first-child{background:var(--surface-2)}

.dtable td,.dtable th{white-space:normal}
.dtable td.item{min-width:150px;text-align:left;font-family:var(--sans);font-size:13px;white-space:normal}
.dtable input[type=number],.dtable input[type=text]{width:130px;height:32px;padding:0 8px;text-align:right;font-size:12.5px}
.dtable .auto{color:var(--fg-muted);font-size:12.5px}
.dtable .auto .tag{margin-left:4px;padding:1px 6px;border-radius:5px;background:var(--surface-2);font:400 11px var(--mono);color:var(--fg-faint)}
.dtable tr.total td{border-top:1px solid var(--fg-faint);border-bottom:0;font-weight:700}
.dtable tr.subtotal td{background:var(--surface-2);font-weight:700}
.dtable tbody td:nth-child(2),.dtable thead th:nth-child(2),.dtable tfoot td:nth-child(2){text-align:right}
#pb-gelTable td,#pb-gelTable th{white-space:nowrap}
#pb-gelTable td.item{min-width:0}

/* Pembibitan: tab Jalur dana */
.jd-stack{display:flex;flex-direction:column;gap:16px;min-width:0}
.jd-stack[hidden]{display:none}
.jd-stack>.stats{margin:0}
.jd-stack>.jd-asumsi{max-width:560px}
.jd-warn{margin:0 0 12px;padding:10px 14px;border:1px solid var(--warn-line);border-radius:8px;background:var(--warn-bg);color:var(--fg)}
.jd-stack>.jd-warn{margin:0}
.jd-warn[hidden]{display:none}
#pb-jd-ringkasTable thead th,#pb-jd-skTable thead th,#pb-jd-tahunTable thead th{white-space:normal}
#pb-jd-tahunTable thead th:first-child,#pb-jd-tahunTable tbody td:first-child{text-align:left}

.detailgrid{display:grid;gap:16px}
@media (min-width:760px){.detailgrid.cols2{grid-template-columns:1fr 1fr}}
.detailcard{padding:16px}
.detailcard.inactive{display:none}
.detailgrid.single{grid-template-columns:1fr!important}
.detailcard h3{margin:0 0 4px}
.detailcard .kv{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.detailcard .kv:last-child{border-bottom:0}
.detailcard .kv .k{color:var(--fg-muted)}
.detailcard .kv .v{font:500 13px var(--mono);text-align:right}
.detailcard .kv.editable .v{min-width:130px}

/* ---------- 9. CATATAN ---------- */
.note{margin-top:10px;font-size:12.5px;line-height:1.6;color:var(--fg-muted)}
.note b{color:var(--fg)}
footer.note{margin-top:24px;padding-top:16px;border-top:1px solid var(--border)}

/* ============================================================
   10. KALKULATOR KOPERASI
   Semua aturan dibatasi ke #calc-koperasi. Warna status (bahaya/waspada/aman)
   dan pembeda anggota/koperasi memakai token di atas.
   ============================================================ */
#calc-koperasi{font-size:14.5px;line-height:1.55;color:var(--fg)}
#calc-koperasi p{margin:0}
#calc-koperasi .btnsmall,#calc-koperasi .chip{font-family:inherit;cursor:pointer}
#calc-koperasi .skip{position:absolute;left:-999px;top:0;z-index:100;padding:8px 12px;background:var(--surface);color:var(--fg)}
#calc-koperasi .skip:focus{left:8px;top:8px}
#calc-koperasi h2{margin:0 0 8px;font:600 12.5px/1.3 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted)}
#calc-koperasi h3{margin:0;font:600 13px/1.4 var(--sans);color:var(--fg-muted)}
#calc-koperasi .note{margin:0;font-size:13px;line-height:1.6;color:var(--fg-muted)}
#calc-koperasi .small{font-size:12.5px}
#calc-koperasi .chartsub{margin-bottom:10px}
#calc-koperasi .muted{color:var(--fg-faint)}
#calc-koperasi .num{font-variant-numeric:tabular-nums}
#calc-koperasi .pageheader{margin-bottom:0}
#calc-koperasi .btnsmall{height:34px;padding:0 12px;border:1px solid var(--border-strong);border-radius:8px;background:transparent;color:var(--fg);font-size:13px;font-weight:600;white-space:nowrap}
#calc-koperasi .btnsmall.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
#calc-koperasi .btnsmall.danger{color:var(--danger)}
#calc-koperasi .btnsmall:hover{border-color:var(--fg-faint)}
#calc-koperasi .btnsmall.primary:hover{filter:brightness(1.06);border-color:var(--accent)}
#calc-koperasi .ic{width:1.15em;height:1.15em;flex:none;vertical-align:-.2em}

/* warna nada (dipakai banner vonis dan kotak peringatan) */
#calc-koperasi .tone-danger{--tone:var(--danger);--tone-bg:var(--danger-bg);--tone-line:var(--danger-line)}
#calc-koperasi .tone-warn{--tone:var(--warn);--tone-bg:var(--warn-bg);--tone-line:var(--warn-line)}
#calc-koperasi .tone-good{--tone:var(--good);--tone-bg:var(--good-bg);--tone-line:var(--good-line)}

/* banner vonis (menempel di semua tab) */
#calc-koperasi .verdictbar{position:sticky;top:0;z-index:30;padding:6px 0 10px;background:var(--bg)}
#calc-koperasi .verdict{display:flex;align-items:flex-start;gap:14px;padding:14px 18px;border:1px solid var(--tone-line);border-radius:10px;background:var(--tone-bg)}
#calc-koperasi .verdict .ic{flex:none;width:24px;height:24px;margin-top:3px;color:var(--tone)}
#calc-koperasi .verdict>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;min-width:0}
#calc-koperasi .verdict .vt{margin:0;font:600 22px/1.25 var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--tone)}
#calc-koperasi .verdict .vl{margin:0;font-size:16px;line-height:1.5;color:var(--fg)}
#calc-koperasi .verdict .vl+.vl{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;color:var(--fg-muted)}
#calc-koperasi .vlab{margin-right:2px;font:600 12px var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted)}
#calc-koperasi .vchip{display:inline-flex;align-items:center;height:30px;padding:0 12px;border:1px solid var(--border-strong);border-radius:6px;background:var(--surface-2);font:500 13px var(--mono);color:var(--fg)}
#calc-koperasi .verdictbar.compact .vl+.vl{display:none}
#calc-koperasi .verdictbar.compact .verdict{padding:10px 18px}
#calc-koperasi .dashcaption{margin:0 0 12px}
#calc-koperasi .sechead{margin:10px 0 -8px;padding-top:14px;border-top:1px solid var(--border)}

/* panel: baris pertama jadi kepala panel */
#calc-koperasi .card{padding:0}
#calc-koperasi .card>:first-child{margin:0;padding:0 16px;min-height:44px;display:flex;align-items:center;border-bottom:1px solid var(--border)}
#calc-koperasi .card>:not(:first-child){margin-left:16px;margin-right:16px}
#calc-koperasi .card>:nth-child(2){margin-top:12px}
#calc-koperasi .card>:last-child{margin-bottom:16px}
#calc-koperasi .card>.tablewrap{margin-left:0;margin-right:0}
#calc-koperasi .blockhead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
#calc-koperasi .blockhead h2{margin:0}
#calc-koperasi .card>.blockhead:first-child{padding:6px 16px}

#calc-koperasi .dashgrid{display:grid;grid-template-columns:minmax(0,1fr) var(--inspector-w);gap:20px;align-items:start}
#calc-koperasi .dashgrid>aside{grid-column:2;grid-row:1}
#calc-koperasi .dashgrid>.results{grid-column:1;grid-row:1}
#calc-koperasi .results{display:flex;flex-direction:column;gap:16px;min-width:0}
#calc-koperasi .cards4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}

/* kartu jawaban */
#calc-koperasi .kk{min-width:0;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:10px}
#calc-koperasi .kk>:not(.kqrow){margin-left:16px;margin-right:16px}
#calc-koperasi .kk>:last-child{margin-bottom:16px}
#calc-koperasi .kk>.mt{width:calc(100% - 32px)}
#calc-koperasi .kqrow{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;margin:0 0 16px;padding:0 10px 0 16px;border-bottom:1px solid var(--border)}
#calc-koperasi .kqrow .kq{margin:0}
#calc-koperasi .kqrow .info{margin:0}
#calc-koperasi .kq{margin:0;font:600 12.5px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-muted)}
#calc-koperasi .kb{margin:0;font:500 clamp(22px,2.1vw,30px)/1.2 var(--mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#calc-koperasi .kb small{display:block;font:400 13px/1.4 var(--sans);color:var(--fg-muted)}
#calc-koperasi .ks{margin:6px 16px 0;font-size:13px;color:var(--fg-muted)}
#calc-koperasi .pos{color:var(--good)}
#calc-koperasi .neg{color:var(--danger)}
#calc-koperasi .kbr{display:flex;align-items:center;gap:10px;margin-top:14px;margin-bottom:0}
#calc-koperasi .kbr+.kbr{margin-top:6px}
#calc-koperasi .kbr>span{flex:none;width:46px;font:400 11px var(--mono);text-transform:uppercase;color:var(--fg-faint)}
#calc-koperasi .kbar{display:flex;flex:1;min-width:0;height:8px;border-radius:4px;background:var(--border-soft);overflow:hidden}
#calc-koperasi .kbar i{display:block;height:100%}
#calc-koperasi .legend{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:8px;font-size:12px;color:var(--fg-muted)}
#calc-koperasi .legend span{display:inline-flex;align-items:center;gap:6px}
#calc-koperasi .legend em{display:inline-block;width:8px;height:8px;border-radius:2px}

/* panel isian (inspektur) */
#calc-koperasi .inputs{display:block;padding:0 0 16px}
#calc-koperasi .inputs>:not(.panel-h){margin-left:16px;margin-right:16px}
#calc-koperasi .inputs>.panel-h{margin:0}
#calc-koperasi .autosafe{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px;margin-bottom:4px}
#calc-koperasi .autosafe .btnsmall{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:1;height:38px}
#calc-koperasi .autosafe .info{margin-left:2px}
#calc-koperasi .autosafe .note{flex-basis:100%}
#calc-koperasi .autosafe .note:empty{display:none}
#calc-koperasi .grp{margin:20px 16px 2px;padding:0;border:0;font:600 11.5px/1.35 var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-faint)}
/* aturan isian (.fld) dan penjelasan (.info, .pop) sekarang ada di bagian 6b (dipakai bersama) */
#calc-koperasi .chk{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;gap:12px;margin:0;font-size:13px;font-weight:400;color:var(--fg-muted);cursor:pointer}
#calc-koperasi .chkrow{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:0;padding:10px 0;border-bottom:1px solid var(--border-soft)}
#calc-koperasi .chkrow .chk{flex:1}
#calc-koperasi .chkrow .info{margin-top:0}
#calc-koperasi .blockhead .chk{margin:0}
#calc-koperasi .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
#calc-koperasi .chip{height:34px;padding:0 12px;font-family:var(--sans);font-size:12.5px}
#calc-koperasi .seg{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
#calc-koperasi .segopt{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:1px solid var(--border-strong);border-radius:8px;background:transparent;color:var(--fg-muted);font-size:13px;font-weight:500;cursor:pointer}
#calc-koperasi .segopt input{margin:0;accent-color:var(--accent)}
#calc-koperasi .segopt:has(input:checked){border-color:var(--accent);background:var(--surface-2);color:var(--fg)}

/* penjelasan singkat (tombol i dan kotak keterangan): lihat bagian 6b */

/* tabel kecil dalam kartu, tabel pilihan */
#calc-koperasi .mt{width:100%;margin-top:6px;border-collapse:collapse;font-size:13px}
#calc-koperasi .mt th,#calc-koperasi .mt td{padding:7px 0;border:0;background:none;font-weight:400;white-space:normal}
#calc-koperasi .mt th{text-align:left;font-family:var(--sans);color:var(--fg-muted)}
#calc-koperasi .mt td{text-align:right;font:500 12.5px var(--mono);font-variant-numeric:tabular-nums}
#calc-koperasi .mt tr+tr>th,#calc-koperasi .mt tr+tr>td{border-top:1px solid var(--border-soft)}
#calc-koperasi .mt tfoot th,#calc-koperasi .mt tfoot td{border-top:1px solid var(--border-strong);font-weight:600}
#calc-koperasi .mt thead th{position:static;padding:4px 0;border-bottom:1px solid var(--border);background:none;font:600 11px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint)}
#calc-koperasi .mt thead th:not(:first-child){text-align:right}
#calc-koperasi .mt.scl th,#calc-koperasi .mt.scl td{padding:7px 8px}
#calc-koperasi .mt.mx thead th:first-child{width:38%}
#calc-koperasi .mt.mx td{padding-left:8px}
#calc-koperasi .mt.scl tr.you>*{background:var(--surface-2)}
#calc-koperasi .mt.scl td:last-child{width:4.5em}
#calc-koperasi .wr{color:var(--warn-ink)}
#calc-koperasi .opt{width:100%;border-collapse:collapse;font-size:13px}
#calc-koperasi .opt th,#calc-koperasi .opt td{padding:8px 12px 8px 0;border:0;background:none;text-align:left;vertical-align:top;white-space:normal;font:400 13px/1.5 var(--sans);color:var(--fg)}
#calc-koperasi .opt thead th{position:static;font:600 11px var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint)}
#calc-koperasi .opt tbody tr{border-top:1px solid var(--border-soft)}
#calc-koperasi .opt td:nth-child(2),#calc-koperasi .opt th:nth-child(2){text-align:left}
#calc-koperasi .opt td:first-child{font-weight:500}

/* blok syarat aman */
#calc-koperasi .syarat{display:grid;grid-template-columns:28px minmax(0,1fr) minmax(90px,150px) minmax(90px,190px);font-size:13.5px}
#calc-koperasi .syarat .h{padding:0 0 4px;border-top:0;font:600 11px var(--cond);letter-spacing:.1em;text-align:right;text-transform:uppercase;color:var(--fg-faint)}
#calc-koperasi .syarat>div{padding:9px 10px 9px 0;border-top:1px solid var(--border-soft)}
#calc-koperasi .syarat>.h{border-top:0}
#calc-koperasi .syarat .r{text-align:right;font:500 12.5px var(--mono);font-variant-numeric:tabular-nums}
#calc-koperasi .syarat .r.you{font-weight:600}
#calc-koperasi .syarat .kn{display:block;margin-top:2px;font-size:12px;line-height:1.45;color:var(--fg-muted)}
#calc-koperasi .syarat .ic{width:18px;height:18px}
#calc-koperasi .jalan{margin:0 16px 16px;padding:0;background:none}
#calc-koperasi .jalan h3{display:flex;align-items:center;margin:16px 0 4px;color:var(--fg)}
#calc-koperasi .jalan p{margin:0 0 4px;font-size:13px;color:var(--fg-muted)}

/* arti istilah */
#calc-koperasi .help summary{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 16px;list-style:none;cursor:pointer;font:600 12.5px var(--cond);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-muted)}
#calc-koperasi .help summary::-webkit-details-marker{display:none}
#calc-koperasi .help summary::after{content:"+";font:500 18px/1 var(--mono);color:var(--fg-faint)}
#calc-koperasi .help[open] summary::after{content:"\2212"}
#calc-koperasi .help:not([open])>summary{border-bottom:0}
#calc-koperasi .help dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 16px;margin:0;padding:12px 16px 16px;font-size:13px}
#calc-koperasi .help dt{font-weight:600}
#calc-koperasi .help dd{margin:0;color:var(--fg-muted)}

/* tabel dan formulir asumsi */
#calc-koperasi .grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#calc-koperasi .grid2 .tablewrap:has(> table:not(.mt)){margin-left:-16px;margin-right:-16px}
#calc-koperasi .grid2 th{white-space:normal}
#calc-koperasi .stack{display:flex;flex-direction:column;gap:16px}
#calc-koperasi .tablewrap{overflow-x:auto}
#calc-koperasi table{border-collapse:collapse;width:100%;font-size:13px}
#calc-koperasi th{padding:9px 10px;border-bottom:1px solid var(--border);background:var(--surface-2);text-align:right;font:600 11px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint);white-space:nowrap}
#calc-koperasi td{padding:6px 10px;border-bottom:1px solid var(--border-soft);text-align:right;font-variant-numeric:tabular-nums}
#calc-koperasi th:first-child,#calc-koperasi td:first-child{text-align:left}
#calc-koperasi tfoot td{border-top:1px solid var(--border-strong);border-bottom:0;font-weight:600}
#calc-koperasi td .num,#calc-koperasi .tin{width:88px;height:32px;padding:0 8px;border:1px solid var(--border-strong);border-radius:6px;background:var(--field);color:var(--fg);font:500 12.5px var(--mono);text-align:right}
#calc-koperasi .tin.wide{width:100%;min-width:130px;text-align:left;font-family:var(--sans)}
#calc-koperasi .tin.w70{width:70px}
#calc-koperasi td .sub{display:block;max-width:none;margin:0;font-size:12px;color:var(--fg-faint);text-align:right}
#calc-koperasi td.left{text-align:left}
#calc-koperasi td.negv{color:var(--danger)}
#calc-koperasi .kop-row td{background:var(--surface-2);font-style:italic}
#calc-koperasi .tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;margin-bottom:16px}
#calc-koperasi .simtable th:first-child,#calc-koperasi .simtable td:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
#calc-koperasi .simtable thead th:first-child{z-index:2;background:var(--surface-2)}
#calc-koperasi .simtable td:first-child{white-space:nowrap;font-family:var(--mono)}
#calc-koperasi .simtable td:first-child .sub{display:inline;margin-left:6px;text-align:left;font-family:var(--sans)}
#calc-koperasi .simtable td.cat{min-width:200px;text-align:left;white-space:normal;font-size:12.5px;font-variant-numeric:normal;color:var(--fg-muted)}
#calc-koperasi .simtable td:not(.cat):not(:first-child){font-family:var(--mono);font-size:12.5px}
#calc-koperasi .simtable tr.shock td:first-child{box-shadow:inset 3px 0 0 var(--warn-line)}
#calc-koperasi .tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#calc-koperasi .tile{min-width:0;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
#calc-koperasi .tile .l{font:600 11.5px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-faint)}
#calc-koperasi .tile .v{margin-top:4px;font:500 20px/1.3 var(--mono);font-variant-numeric:tabular-nums}
#calc-koperasi .tile .n{margin-top:2px;font-size:12px;line-height:1.4;color:var(--fg-muted)}
#calc-koperasi .alert{display:block;padding:10px 14px;border:1px solid var(--tone-line);border-radius:10px;background:var(--tone-bg);font-size:13.5px;line-height:1.55;color:var(--fg)}
#calc-koperasi .alert .ic{color:var(--tone)}
#calc-koperasi .chartwrap{position:relative;width:auto}
#calc-koperasi .cf{font-size:13.5px}
#calc-koperasi .cf .row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 18px;margin:6px 0 10px}
#calc-koperasi .cf .fld{min-width:170px;flex:1 1 170px;padding:0;border-bottom:0}
#calc-koperasi .cf .chkrow{padding:6px 0}
#calc-koperasi .inline3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#calc-koperasi footer.note{margin-top:22px;padding-top:12px;border-top:1px solid var(--border)}

/* skala jumlah babi (satuan ekor) */
#calc-koperasi .meter{position:relative;height:22px;margin:34px 2px 6px}
#calc-koperasi .meter .mz{position:absolute;inset:0;border-radius:4px;overflow:hidden;background:var(--surface-2)}
#calc-koperasi .meter .z{position:absolute;top:0;bottom:0}
#calc-koperasi .meter .z.rugi{background:var(--critical)}
#calc-koperasi .meter .z.rawan{background:var(--warn)}
#calc-koperasi .meter .z.aman{background:var(--good)}
#calc-koperasi .meter .mk{position:absolute;top:-5px;bottom:-5px;width:0;transform:translateX(-50%)}
#calc-koperasi .meter .mk.kap{border-left:2px dashed var(--bg)}
#calc-koperasi .meter .mk.now{border-left:2px solid var(--fg)}
#calc-koperasi .meter .mk.now span{position:absolute;bottom:100%;left:0;transform:translateX(-50%);margin-bottom:3px;padding:0 8px;border:1px solid var(--fg);border-radius:4px;background:var(--surface);color:var(--fg);font:500 12px/22px var(--mono);white-space:nowrap}
#calc-koperasi .meter .mk.now.l span{transform:none;left:-2px}
#calc-koperasi .meter .mk.now.r span{transform:translateX(-100%);left:2px}
#calc-koperasi .meterax{display:flex;justify-content:space-between;margin:0 2px 2px;font:400 11px var(--mono);color:var(--fg-faint)}
#calc-koperasi .lg-rugi{background:var(--critical)}
#calc-koperasi .lg-rawan{background:var(--warn)}
#calc-koperasi .lg-aman{background:var(--good)}
#calc-koperasi .legend em.lg-kap{width:0;height:12px;border-radius:0;background:none;border-left:2px dashed var(--fg-muted)}

/* tab Anggota: satu batang per siklus */
#calc-koperasi .tl{display:flex;align-items:flex-end;gap:1px;height:30px;min-width:150px}
#calc-koperasi .tl i{flex:1 1 0;min-width:2px;border-radius:2px 2px 0 0}
#calc-koperasi .tl i.a{background:var(--anggota)}
#calc-koperasi .tl i.q{background:repeating-linear-gradient(135deg,var(--warn-line) 0 2px,transparent 2px 4px)}
#calc-koperasi .tl i.n,#calc-koperasi .tl i.x{border-bottom:1px solid var(--baseline);border-radius:0;background:none}
#calc-koperasi .angtable th,#calc-koperasi .angtable td{padding:6px 8px}
#calc-koperasi .angtable td .num{width:64px}
#calc-koperasi .angtable .tin.wide{min-width:110px}
#calc-koperasi .angtable th.tlh{text-align:left}
#calc-koperasi .angtable td.rb{min-width:150px;padding-top:4px;padding-bottom:4px;text-align:left}
#calc-koperasi .angtable td .sub{display:block}
#calc-koperasi .legend em.lg-a{background:var(--anggota)}
#calc-koperasi .legend em.lg-q{background:repeating-linear-gradient(135deg,var(--warn-line) 0 2px,transparent 2px 4px)}
#calc-koperasi .legend em.lg-n{border-bottom:1px solid var(--baseline);border-radius:0;background:none}
#calc-koperasi .tllegend{margin:8px 16px 0}

/* ---------- 11. LAYAR SEMPIT ---------- */
@media (max-width:1180px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats:has(> :nth-child(6):last-child)::after,.stats:has(> :nth-child(5):last-child)::after{content:none}
  .stats:has(> :nth-child(5):last-child)::after{content:"";grid-column:span 1;background:var(--surface)}
  .kk-grid{grid-template-columns:minmax(0,1fr)}
  .kk-grid>.inspector{order:-1}
  .inspector .inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
  .inspector .inputs .sectionlabel{grid-column:1 / -1}
  #calc-koperasi .dashgrid{grid-template-columns:minmax(0,1fr)}
  #calc-koperasi .dashgrid>aside,#calc-koperasi .dashgrid>.results{grid-column:auto;grid-row:auto}
  #calc-koperasi .grid2{grid-template-columns:minmax(0,1fr)}
  #calc-koperasi .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .app{display:block}
  .rail{position:static;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px 16px;height:auto;padding:12px 16px;border-right:0;border-bottom:1px solid var(--border);overflow:visible}
  .brand{padding:0}
  .rail-cap,.scenario,.rail-foot{display:none}
  .calcswitch{flex:1 1 100%;flex-direction:row;gap:2px;padding:3px;border:1px solid var(--border-strong);border-radius:8px}
  .calcswitch-btn{flex:1 1 0;justify-content:center;gap:8px;padding:0 8px;font-size:13px;text-align:center}
  .calcswitch-btn.is-active::after{content:none}
  .stage{padding:16px 16px calc(24px + env(safe-area-inset-bottom,0px))}
  h1{font-size:23px}
  .inspector .inputs{display:block}
}
@media (max-width:620px){
  .navic{display:none}
  .stat .label{min-height:0}
  .stats .stat{padding:12px}
  .stat .value{font-size:15px}
  /* isian di ponsel: label di atas, kontrol selebar penuh dan cukup besar untuk disentuh */
  .field{grid-template-columns:minmax(0,1fr);row-gap:6px}
  .field>label,.field>select,.field>.percentwrap,.field>input[type=text],.field>input[type=number],.field>.chiprow{grid-column:1}
  .field>select,.field>.percentwrap,.field>input[type=text],.field>input[type=number]{width:100%}
  .field>select,.field>.percentwrap input,.field>input[type=text],.field>input[type=number]{height:44px}
  .field>.chiprow{justify-content:flex-start}
  .chip{min-width:44px;height:40px}
  .fld-chips{justify-content:flex-start}
  .viewtoggle{margin-left:0}
  .viewtoggle button{height:40px;padding:0 12px}
  .checkfield{display:flex}
  #calc-koperasi .cards4{grid-template-columns:minmax(0,1fr)}
  #calc-koperasi .tiles{grid-template-columns:minmax(0,1fr)}
  #calc-koperasi .inline3{grid-template-columns:minmax(0,1fr)}
  .fld input.num,#calc-koperasi td .num,#calc-koperasi .tin,select,input[type=number],input[type=text]{font-size:16px}
  #calc-koperasi .verdictbar{margin:0 -16px;padding:6px 16px 8px}
  #calc-koperasi .verdictbar .vl+.vl{display:none}
  #calc-koperasi .verdict{padding:10px 12px}
  #calc-koperasi .verdict .vt{font-size:19px}
  #calc-koperasi .syarat{grid-template-columns:24px minmax(0,1fr)}
  #calc-koperasi .syarat .h{display:none}
  #calc-koperasi .syarat .r{grid-column:2;text-align:left}
  #calc-koperasi .syarat .r::before{content:attr(data-l);color:var(--fg-faint);font-weight:400}
  .pageheader .actions{width:100%}
  .pageheader .actions button{flex:1}
}

/* ---------- 12. CETAK / PDF ---------- */
@media print{
  :root,:root[data-theme]{
    color-scheme:light;
    --bg:#fff; --surface:#fff; --surface-2:#f2f1ec; --rail:#fff; --field:#fff;
    --fg:#111; --fg-muted:#333; --fg-faint:#555;
    --border:#cfcec6; --border-soft:#e4e3dc; --border-strong:#999; --grid:#ddd; --baseline:#aaa;
    --accent:#1f5f0a; --accent-ink:#fff; --accent2:#8a5a00; --focus:#1f5f0a;
    --good:#2e6a0a; --warn:#8a5a00; --critical:#a32626; --bar:#5b9a1f;
    --good-bg:#edf6e2; --warn-bg:#fdf3df; --critical-bg:#fdeeee;
    --danger:#a32626; --danger-bg:#fdeeee; --danger-ink:#7a1c1c; --danger-line:#d99;
    --warn-ink:#5c3800; --warn-line:#cc9a3a;
    --good-ink:#255008; --good-line:#8fb85a;
    --anggota:#1b76a3; --kop:#b87400;
  }
  body{background:#fff;font-size:11.5px}
  .app{display:block}
  .rail,.exportbtn,.pageheader .actions,.tabbar,.chiprow,.fld-chips,.info,.pop,.viewtoggle{display:none!important}
  .stage{padding:0 12px}
  .calc[hidden]{display:none!important}
  .printonly{display:block}
  .card{border-color:#d8d7d0;break-inside:avoid}
  .tabpanel,.tabpanel[hidden]{display:block!important}
  #pb-panel-capex,#pb-panel-opex,#pb-panel-pendanaan,
  #pg-panel-capex,#pg-panel-opex,#pg-panel-pendanaan{break-before:page}
  /* tab Jalur dana: kartu asumsi selebar halaman; tabel padat seperti tabel simulasi */
  .jd-stack>.jd-asumsi{max-width:none}
  #pb-jd-ringkasTable,#pb-jd-skTable,#pb-jd-tahunTable{font-size:9px;min-width:0}
  #pb-jd-ringkasTable thead th,#pb-jd-skTable thead th,#pb-jd-tahunTable thead th{white-space:normal;padding:5px 4px;font-size:7.5px;letter-spacing:.04em}
  #pb-jd-ringkasTable tbody td,#pb-jd-skTable tbody td,#pb-jd-tahunTable tbody td{padding:3px 4px}
  #pb-jd-ringkasTable td.item,#pb-jd-skTable td.item{font-size:9.5px}
  #pb-jd-skTable input[type=text]{width:6ch;height:auto;padding:0;border:0;background:none;text-align:right;font-size:9.5px}
  h2{margin-top:18px}
  thead th{position:static}
  .tablewrap,.paneltable{overflow:visible}
  /* tabel simulasi lebar: huruf kecil dan padat; kolom status boleh turun baris tapi tidak terjepit */
  table{font-size:9.5px}
  thead th{padding:6px 5px;font-size:9px}
  tbody td{padding:4px 5px}
  td.status{min-width:150px;max-width:170px;white-space:normal;font-size:9px;line-height:1.3}
  /* tabel simulasi pembibitan: judul kolom boleh turun baris dan isi sedikit lebih kecil supaya semua kolom (termasuk keterangan) muat selebar halaman */
  #pb-table{font-size:8.5px}
  #pb-table thead th{white-space:normal;padding:5px 3px;font-size:7.5px;letter-spacing:.04em}
  #pb-table tbody td{padding:3px 4px}
  #pb-table td.status{min-width:100px;max-width:140px;font-size:8px}
  #pb-table .masuk{font-size:7px}
  #pb-table,#pg-table{min-width:0}
  #pb-table th:first-child,#pb-table td:first-child,#pg-table th:first-child,#pg-table td:first-child{position:static}
  select,input[type=number],input[type=text]{width:auto;padding:2px 0;border:0;background:none;background-image:none;text-align:left;appearance:none;-webkit-appearance:none}
  /* isian tercetak: label di atas nilainya, kotak centang asli supaya statusnya terbaca */
  .field{grid-template-columns:minmax(0,1fr);row-gap:1px;padding:3px 0;border-bottom:0}
  .field>label,.field>select,.field>.percentwrap,.field>input[type=text],.field>input[type=number]{grid-column:1}
  .percentwrap{display:flex;align-items:center;gap:2px;width:auto}
  .percentwrap input{width:5.77ch}
  .percentwrap span{position:static;transform:none}
  .checkfield{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:8px}
  input[type=checkbox]{appearance:auto;-webkit-appearance:checkbox;width:14px;height:14px;border:0;background:none}
  input[type=checkbox]::after{content:none}
  .field label{font-weight:700}
  .chartwrap svg{max-width:100%}
  svg.chart rect,.stats,.stat,.kbar i,.tl i,.meter .z,.meter .mk,.verdict,.alert,.legend em{-webkit-print-color-adjust:exact;print-color-adjust:exact}

  /* dashboard pembibitan / penggemukan: asumsi dulu, lalu ringkasan dan grafik */
  #pb-panel-dashboard,#pg-panel-dashboard{display:flex!important;flex-direction:column}
  .kk-grid{display:contents}
  .kk-grid>.inspector{order:-1;margin-bottom:12px}
  .stats{margin:0 0 12px}
  .kk-main{order:1;gap:12px}
  .panel-h{min-height:32px}
  .inspector .inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
  .inspector .inputs .sectionlabel{grid-column:1 / -1}
  #pb-panel-dashboard footer.note,#pg-panel-dashboard footer.note{order:2}

  /* koperasi */
  #calc-koperasi{font-size:11.5px}
  #calc-koperasi .actions,#calc-koperasi .autosafe,#calc-koperasi .tools,#calc-koperasi .btnsmall,#calc-koperasi .skip,#calc-koperasi .info,#calc-koperasi .pop,#calc-koperasi .segopt input,#calc-koperasi .inputs>.panel-h{display:none!important}
  #calc-koperasi .verdictbar{position:static;padding:0 0 8px;background:none}
  #calc-koperasi #kp-panel-capex,#calc-koperasi #kp-panel-opex,#calc-koperasi #kp-panel-pendanaan{break-before:page}
  #calc-koperasi .dashgrid{display:flex;flex-direction:column;gap:10px}
  #calc-koperasi .results{order:1}
  #calc-koperasi .inputs{order:2;break-inside:auto;padding:10px 12px}
  #calc-koperasi .inputs>:not(.panel-h){margin-left:0;margin-right:0}
  #calc-koperasi .inputs .grp{margin:8px 0 0;padding-top:6px}
  #calc-koperasi #kp-grpUsaha,#calc-koperasi #kp-grpKop,#calc-koperasi #kp-grpAman{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 18px}
  .fld{margin:0 0 4px;padding:0;border-bottom:0}
  .fld-hint,.fld-msg,.fld input[type=range]{display:none}
  .fld input.num{width:9ch;padding:0;border:0;background:none;text-align:right}
  #calc-koperasi .chk small{display:none}
  #calc-koperasi .card,#calc-koperasi .kk,#calc-koperasi .tile,#calc-koperasi .alert{break-inside:avoid}
  #calc-koperasi h2,#calc-koperasi h3,#calc-koperasi .blockhead{break-after:avoid}
  #calc-koperasi .syarat{grid-template-columns:24px minmax(0,1fr) 100px 130px}
  #calc-koperasi td .num,#calc-koperasi .tin{padding:0;border:0;background:none}
  #calc-koperasi table{font-size:10px}
  #calc-koperasi .simtable th:first-child,#calc-koperasi .simtable td:first-child{position:static}
  #calc-koperasi #kp-simSettingsCard,#calc-koperasi .blockhead .chk,#calc-koperasi .help{display:none}
  #calc-koperasi .grid2{grid-template-columns:minmax(0,1fr)}
  #calc-koperasi #kp-perEkor{grid-column:1 / -1}
}

/* ============================================================
   13. INSPECTOR — Layout D (Panel Geser / Inspector)
   Ditambahkan oleh kb-inspector.js. Hanya menata ulang; tidak
   mengubah token/komponen visual yang sudah ada.
   ============================================================ */

/* --- kerangka inspector --- */
.insp-panel{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.insp-panel .inputs{display:block;padding:0}

.insp-head{flex:none;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-height:58px;padding:14px 16px;border-bottom:1px solid var(--border)}
.insp-title{display:flex;flex-direction:column;gap:3px;min-width:0}
.insp-kicker{font:600 10.5px/1.3 var(--cond);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-faint)}
.insp-h{margin:0;font:600 16px/1.2 var(--sans);color:var(--fg)}
.insp-close{flex:none;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--border-strong);border-radius:8px;background:transparent;color:var(--fg-muted);cursor:pointer}
.insp-close:hover{color:var(--fg);border-color:var(--fg-faint)}
.insp-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;min-height:0}
.insp-foot{flex:none;padding:12px 16px;border-top:1px solid var(--border)}
.applybtn{display:flex;align-items:center;justify-content:center;width:100%;height:44px;border:1px solid var(--accent);border-radius:8px;background:var(--accent);color:var(--accent-ink);font:600 14px var(--sans);cursor:pointer}
.applybtn:hover{filter:brightness(1.06)}
.applybtn:active{filter:brightness(.96)}
.insp-backdrop{display:none}

/* --- accordion grup input --- */
.acc{border-bottom:1px solid var(--border-soft)}
.acc:last-child{border-bottom:0}
.acc-head{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:12px 16px;border:0;background:none;color:var(--fg);font:600 12.5px/1.3 var(--cond);letter-spacing:.1em;text-transform:uppercase;text-align:left;cursor:pointer}
.acc-head:hover{background:var(--surface-2)}
.acc-chev{display:inline-flex;color:var(--fg-faint);transition:transform .18s ease}
.acc.is-open .acc-chev{transform:rotate(180deg)}
.acc-body{display:none;padding:2px 16px 14px}
.acc.is-open .acc-body{display:block}

/* --- Koperasi: kartu Rencana jadi inspector --- */
#calc-koperasi .dashgrid>aside.insp-panel{padding:0}
#calc-koperasi .dashgrid>aside.insp-panel>.insp-head{margin:0;padding:14px 16px;min-height:0;display:flex;align-items:flex-start;border-bottom:1px solid var(--border)}
#calc-koperasi .dashgrid>aside.insp-panel>.insp-body{margin:0;padding:0}
#calc-koperasi .dashgrid>aside.insp-panel>.insp-foot{margin:0;padding:12px 16px}

/* --- desktop: kolom tetap, inspector menempel + scroll sendiri --- */
@media (min-width:1181px){
  .insp-panel{position:sticky;top:28px;max-height:calc(100vh - 56px)}
  .calc.insp-closed .kk-grid{grid-template-columns:minmax(0,1fr)}
  .calc.insp-closed .kk-grid>.inspector{display:none}
  .calc.insp-closed .dashgrid{grid-template-columns:minmax(0,1fr)}
  .calc.insp-closed .dashgrid>aside{display:none}
  .calc.insp-closed .dashgrid>.results{grid-column:1}
}

/* --- tablet & ponsel: inspector jadi drawer dari kanan --- */
@media (max-width:1180px){
  .insp-panel{
    position:fixed;top:0;right:0;bottom:0;z-index:60;
    width:min(360px,92vw);
    height:100vh;height:100dvh;
    max-height:none;
    margin:0;border-radius:0;
    border-left:1px solid var(--border);
    transform:translateX(105%);
    transition:transform .22s ease;
  }
  .calc.insp-open .insp-panel{transform:translateX(0)}
  .insp-panel .inputs{display:block}
  .insp-backdrop{display:block;position:fixed;inset:0;z-index:55;background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .22s ease}
  .insp-backdrop.is-visible{opacity:1;pointer-events:auto}
}

/* --- cetak / PDF: sembunyikan krom inspector, tampilkan isian terbuka --- */
@media print{
  .insp-head,.insp-foot,.insp-close,.applybtn,.insp-kicker,.insp-backdrop{display:none!important}
  .insp-panel{display:block!important;position:static!important;max-height:none!important;overflow:visible!important}
  .insp-body{overflow:visible!important;height:auto!important}
  .insp-panel .inputs{display:block!important}
  .acc-head{display:block;padding:6px 0 2px;border:0;cursor:default;color:var(--fg-muted);font:600 12px/1.3 var(--cond);letter-spacing:.12em;text-transform:uppercase}
  .acc-chev{display:none!important}
  .acc-body{display:block!important;padding:0}
  #calc-koperasi .dashgrid>aside.insp-panel{order:2;break-inside:auto}
}
