/* Gaya panel — port sistem desain mockup index.html (token, rail, topbar, panel, KPI, meter).
   Satu-satunya lembar gaya aplikasi sejak I-53: layouts.panel, layouts.masuk, dan kios layar.dinding memakainya;
   cangkang lama (layouts.aplikasi, dasar.css) sudah dihapus dan ArsitekturTest menolak kemunculannya kembali.
   Font swadaya (KT-06, CSP font-src 'self'): Archivo, IBM Plex Sans, IBM Plex Mono — OFL 1.1, lihat /fonts/LICENSE-*.txt.
   Status tidak pernah disampaikan dengan warna saja: chip selalu berteks (PRD §19.3). */

@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/archivo-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/archivo-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/archivo-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-600-normal.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-latin-400-normal.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-latin-500-normal.woff2) format('woff2')}

/* ============================================================ TOKENS */
:root{
  color-scheme:light;
  --ground:#EEF1F1;--surface:#FFFFFF;--surface-2:#F6F8F8;--surface-3:#EAEEEE;
  --line:#DCE2E2;--line-strong:#C2CBCC;
  --ink:#12171A;--ink-2:#434D50;--ink-3:#566469;--ink-4:#627075;
  --accent:#17636F;--accent-deep:#0E3D46;--accent-soft:#3E96A6;--accent-wash:#E4EFF1;--on-accent:#FFFFFF;
  --rail-bg:#12262B;--rail-ink:#DCE7E9;--rail-ink-2:#8FA6AB;--rail-line:#22383E;--rail-active:#1B3940;
  --st-siap:#0CA30C;--st-perhatian:#FAB219;--st-kritis:#D03B3B;--st-basi:#8A9497;
  --st-siap-wash:#E4F4E4;--st-perhatian-wash:#FDF2DC;--st-kritis-wash:#F9E5E5;--st-basi-wash:#ECEFEF;
  --st-kritis-teks:#B42B2B;
  --med-1:#134A55;--med-2:#2E7F8D;--med-3:#7FB6C0;
  --shadow:0 1px 2px rgba(18,38,43,.06),0 8px 24px -16px rgba(18,38,43,.28);
  --radius:6px;
  --f-display:'Archivo','Helvetica Neue',Arial,sans-serif;
  --f-body:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ground:#0C1011;--surface:#141A1B;--surface-2:#1A2224;--surface-3:#222C2E;
    --line:#283336;--line-strong:#3A4649;
    --ink:#F1F5F5;--ink-2:#B7C2C4;--ink-3:#ACB8BB;--ink-4:#9BAAAD;
    --accent:#4FA9BA;--accent-deep:#8FCDD9;--accent-soft:#2E7F8D;--accent-wash:#132B31;--on-accent:#0C1011;
    --st-siap-wash:#0F2A10;--st-perhatian-wash:#31260B;--st-kritis-wash:#331416;--st-basi-wash:#212A2C;
    --st-kritis-teks:#FF8A80;
    --med-1:#7FB6C0;--med-2:#3E96A6;--med-3:#1F5C68;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -16px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ground:#0C1011;--surface:#141A1B;--surface-2:#1A2224;--surface-3:#222C2E;
  --line:#283336;--line-strong:#3A4649;
  --ink:#F1F5F5;--ink-2:#B7C2C4;--ink-3:#ACB8BB;--ink-4:#9BAAAD;
  --accent:#4FA9BA;--accent-deep:#8FCDD9;--accent-soft:#2E7F8D;--accent-wash:#132B31;--on-accent:#0C1011;
  --st-siap-wash:#0F2A10;--st-perhatian-wash:#31260B;--st-kritis-wash:#331416;--st-basi-wash:#212A2C;
  --st-kritis-teks:#FF8A80;
  --med-1:#7FB6C0;--med-2:#3E96A6;--med-3:#1F5C68;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -16px rgba(0,0,0,.7);
}

/* ============================================================ BASE */
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--f-display);margin:0;text-wrap:balance;letter-spacing:-.01em}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.muted{color:var(--ink-3)}
.tiny{font-size:11.5px}
.note{font-size:11.5px;color:var(--ink-3);line-height:1.55;margin:0}
.note-kritis{color:var(--st-kritis-teks)}
.pad{padding:16px}.pad-t{padding-top:14px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lompat{position:absolute;left:-999px;top:0;z-index:99;background:var(--accent);color:#fff;padding:.5rem .75rem}.lompat:focus{left:.5rem}

/* ============================================================ SHELL */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.rail{background:var(--rail-bg);color:var(--rail-ink);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto}
.lockup{display:flex;gap:11px;align-items:center;padding:20px 18px 18px;border-bottom:1px solid var(--rail-line);text-decoration:none}
.lockup-mark{width:34px;height:34px;border-radius:50%;background:#D2232A;display:grid;place-items:center;flex:none}
.lockup-mark.has-img{width:46px;height:46px;border-radius:9px;background:#fff;padding:5px}
.lockup-mark img{width:100%;height:100%;object-fit:contain;display:block}
.lockup-txt strong{display:block;font-family:var(--f-display);font-weight:600;font-size:13px;letter-spacing:.01em;line-height:1.25}
.lockup-txt span{display:block;font-size:10.5px;color:var(--rail-ink-2);letter-spacing:.06em;text-transform:uppercase;margin-top:2px}
.nav{padding:14px 10px 24px;flex:1}
.nav-group{margin-bottom:16px}
.nav-title{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--rail-ink-2);padding:0 8px 7px;display:flex;justify-content:space-between;align-items:baseline}
.nav-title em{font-style:normal;font-family:var(--f-mono);font-size:9.5px;opacity:.7}
.nav a{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:5px;text-decoration:none;font-size:13px;color:var(--rail-ink);border-left:2px solid transparent;transition:background .12s}
.nav a:hover{background:var(--rail-active)}
.nav a.on{background:var(--rail-active);border-left-color:var(--accent-soft);font-weight:600}
.nav a .ni{width:16px;height:16px;flex:none;opacity:.75}
.nav a.on .ni{opacity:1}
.rail-foot{padding:14px 18px 18px;border-top:1px solid var(--rail-line);font-size:12px;color:var(--rail-ink-2)}
.rail-lab{font-size:10px;letter-spacing:.12em;text-transform:uppercase}
.rail-nama{color:var(--rail-ink);font-weight:600;margin-top:6px;overflow-wrap:anywhere}
.rail-peran{font-size:11.5px}
.rail-aksi{display:flex;gap:6px;margin-top:10px}
.rail-aksi form{margin:0}
.rail-aksi a,.rail-aksi button{display:inline-block;padding:5px 9px;border:1px solid var(--rail-line);border-radius:5px;background:var(--rail-active);color:var(--rail-ink);font-size:12px;text-decoration:none}
.rail-aksi a:hover,.rail-aksi button:hover{border-color:var(--accent-soft)}
/* Tombol tema (tema.js): di rail bertinta rail, di halaman masuk bertinta kertas */
.tombol-tema{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid var(--line-strong);border-radius:5px;font-size:12px;color:var(--ink-2)}
.tombol-tema:hover{border-color:var(--accent);color:var(--accent)}
.tombol-tema svg{width:14px;height:14px;flex:none}
.rail-tema{padding:0 18px 14px}
.rail-tema .tombol-tema{border-color:var(--rail-line);background:var(--rail-active);color:var(--rail-ink)}
.rail-tema .tombol-tema:hover{border-color:var(--accent-soft);color:var(--rail-ink)}

.main{min-width:0;display:flex;flex-direction:column}
.topbar{background:var(--surface);border-bottom:1px solid var(--line);padding:16px 32px 0;position:sticky;top:0;z-index:20}
.topbar-row{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.crumb{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4);margin-bottom:5px}
.topbar h1{font-size:21px;font-weight:600}
.topbar .sub{color:var(--ink-3);font-size:12.5px;margin:3px 0 0;max-width:62ch}
.topaside{display:flex;gap:20px;align-items:flex-start}
.topaside-blok{text-align:right}
.topaside .hari-h{font-size:19px;font-weight:600}
.kesegaran{display:flex;gap:6px;align-items:center;justify-content:flex-end;margin-top:3px;font-size:12.5px;flex-wrap:wrap}
.topbar-bawah{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
.phase-tabs{display:flex;gap:0}
.phase-tabs a,.phase-tabs span{padding:8px 15px;font-size:12.5px;color:var(--ink-3);border-bottom:2px solid transparent;font-weight:500;text-decoration:none}
.phase-tabs a.on{color:var(--ink);border-bottom-color:var(--accent);font-weight:600}
.phase-tabs a:hover{color:var(--ink)}
.phase-tabs .nonaktif{opacity:.4;cursor:not-allowed}
.topbar-aksi{display:flex;gap:6px;flex-wrap:wrap;padding-bottom:8px}
.content{padding:24px 32px 56px;max-width:1440px;width:100%;flex:1}
.kaki{padding:12px 32px;border-top:1px solid var(--line);color:var(--ink-4);font-size:11.5px}
.pesan{padding:10px 14px;border-left:3px solid var(--accent);background:var(--surface);border-radius:4px;margin:0 0 16px}

/* ============================================================ PANELS & PRIMITIVES */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.panel-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:13px 16px;border-bottom:1px solid var(--line)}
.panel-h h2{font-size:14px;font-weight:600}
.panel-h .hint{font-size:11.5px;color:var(--ink-3);text-align:right}
.panel-sekat{padding:12px 16px;border-bottom:1px solid var(--line)}
.stack{display:flex;flex-direction:column;gap:20px;min-width:0}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}

.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border-radius:20px;font-size:11px;font-weight:500;white-space:nowrap;background:var(--surface-3);color:var(--ink-2)}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;flex:none;display:none}
.chip-siap{background:var(--st-siap-wash)}.chip-siap::before{display:block;background:var(--st-siap)}
.chip-perhatian{background:var(--st-perhatian-wash)}.chip-perhatian::before{display:block;background:var(--st-perhatian)}
.chip-kritis{background:var(--st-kritis-wash)}.chip-kritis::before{display:block;background:var(--st-kritis)}
.chip-basi{background:var(--st-basi-wash)}.chip-basi::before{display:block;background:var(--st-basi)}
.chip-info{background:var(--accent-wash);color:var(--accent)}
a.chip{text-decoration:none}a.chip:hover{text-decoration:underline}
.chip-asal{background:none;border:1px dashed var(--line-strong);color:var(--ink-3)}
.tag{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-3);background:var(--surface-3);padding:1px 5px;border-radius:3px}
.tag.on{background:var(--accent-wash);color:var(--accent)}
.tag.off{opacity:.5}
.btn,.tombol{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line-strong);border-radius:5px;font:500 12.5px var(--f-body);background:var(--surface);color:var(--ink);text-decoration:none;cursor:pointer}
.btn:hover,.tombol:hover{border-color:var(--accent);color:var(--accent)}
.btn.sm,.tombol-kecil{padding:4px 9px;font-size:11.5px}
.btn[disabled],.tombol[disabled]{opacity:.45;cursor:not-allowed;border-color:var(--line-strong);color:var(--ink-3)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.primary:hover{background:var(--accent-deep);border-color:var(--accent-deep);color:var(--on-accent)}
.btn.primary[disabled]{background:var(--surface-3);border-color:var(--line-strong);color:var(--ink-3)}
.btn.bahaya:hover{border-color:var(--st-kritis);color:var(--st-kritis-teks)}
.kode-galat{font-family:var(--f-mono);font-size:11px;color:var(--ink-4)}
/* keluaran util.js: tabel() kosong dan teks kecil */
.kecil{font-size:12px;color:var(--ink-3)}
.panel>p.kecil,details.panel>p.kecil{padding:16px;margin:0}
.kosong,.issue-empty{padding:24px 16px;color:var(--ink-3)}
.galat{padding:12px 16px;border-left:3px solid var(--st-kritis);background:var(--surface);border-radius:4px}

/* KPI strip: satu panel dengan garis rambut, bukan kartu mengambang */
.kpi{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.kpi>div{padding:14px 18px;border-left:1px solid var(--line);min-width:0}
.kpi>div:first-child{border-left:0}
.kpi .k-lab{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}
.kpi .k-val{font-family:var(--f-display);font-weight:600;font-size:26px;line-height:1.15;margin-top:5px;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:6px}
.kpi .k-val small{font-size:12px;font-weight:500;color:var(--ink-3);font-family:var(--f-body)}
.kpi .k-note{font-size:11.5px;color:var(--ink-3);margin-top:3px}

/* Tabel */
.gulir{overflow-x:auto;position:relative}   /* relative: .sr-only absolut di dalamnya tidak melebarkan halaman */
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{text-align:left;font-weight:500;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-4);padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface)}
td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--surface-2)}
td.angka,th.angka,td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}
td a{text-decoration:none;font-weight:500}td a:hover{color:var(--accent);text-decoration:underline}
.cell-name{font-weight:500}
.cell-name em{font-style:normal;font-weight:400;color:var(--ink-4);font-size:11px;margin-left:6px}
.paginasi{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;padding:12px 16px;margin:0;border-top:1px solid var(--line);font-size:12px;color:var(--ink-3)}

/* Meter & baris komponen */
.meter{height:6px;background:var(--surface-3);border-radius:3px;overflow:hidden}
.meter i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.komp-row{display:grid;grid-template-columns:minmax(0,150px) 44px minmax(28px,1fr) max-content;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.komp-row:last-of-type{border-bottom:0}
.komp-lab{font-size:12.5px}
.komp-lab span{display:block;font-size:10.5px;color:var(--ink-4);font-family:var(--f-mono)}
.komp-val{font-family:var(--f-display);font-weight:600;font-size:15px;font-variant-numeric:tabular-nums;text-align:right}
.komp-note{font-size:11px;color:var(--ink-3);text-align:right;white-space:nowrap}
.jumlah-baris{display:flex;justify-content:space-between;padding-top:12px;margin-top:4px;border-top:1px solid var(--line);font-size:12.5px}

.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:12.5px;margin:0}
.kv dt{color:var(--ink-4)}.kv dd{margin:0;font-variant-numeric:tabular-nums}
.kv a{text-decoration:none;font-weight:500}.kv a:hover{color:var(--accent)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-3);align-items:center}
.legend i{width:9px;height:9px;border-radius:2px;display:inline-block;margin-right:5px;vertical-align:-1px}
.label-seksi{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4)}
.angka-besar{font-family:var(--f-mono);font-size:17px;font-variant-numeric:tabular-nums}

/* Rekap lintas cabor: details sebagai panel yang dapat dilipat */
details.panel>summary{list-style:none;cursor:pointer}
details.panel>summary::-webkit-details-marker{display:none}
details.panel>summary h2::before{content:"▸";display:inline-block;width:1em;color:var(--ink-4);transition:transform .12s}
details.panel[open]>summary h2::before{transform:rotate(90deg)}
details.panel:not([open])>summary{border-bottom:0}

/* ============================================================ CABOR — daftar & detail */
.cabor-split,.atlet-split{display:grid;grid-template-columns:264px minmax(0,1fr);gap:20px;align-items:start}
.picker{position:sticky;top:172px;max-height:calc(100vh - 192px);display:flex;flex-direction:column}
.picker-h{padding:11px 12px;border-bottom:1px solid var(--line)}
.picker-h input,.picker-h select{width:100%;font:12.5px var(--f-body);padding:6px 9px;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface-2);color:var(--ink)}
.picker-urut{display:flex;gap:8px;align-items:center;margin-top:8px}
.picker-urut label{font-size:11.5px;color:var(--ink-3);flex:none}
.picker-list{overflow-y:auto;flex:1;margin:0;padding:0;list-style:none}
.picker-item{position:relative;display:flex;gap:9px;align-items:center;padding:8px 12px;border-bottom:1px solid var(--line);text-decoration:none}
.picker-item:hover{background:var(--surface-2)}
.picker-item.on{background:var(--accent-wash)}
.picker-item .stripe{width:3px;align-self:stretch;border-radius:2px;flex:none}
.picker-item .p-nama{flex:1;min-width:0}
.picker-item .p-nama b{font-size:12.5px;font-weight:400;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-item.on .p-nama b{font-weight:600}
.picker-item .p-skor{font-family:var(--f-mono);font-size:12.5px}
.st-siap{background:var(--st-siap)}.st-perhatian{background:var(--st-perhatian)}.st-kritis{background:var(--st-kritis)}.st-basi{background:var(--st-basi)}
.kepala-cabor,.kepala-atlet{display:flex;gap:22px;padding:18px;align-items:center;flex-wrap:wrap}
.kepala-cabor .identitas,.kepala-atlet .identitas{flex:1;min-width:220px}
.kepala-cabor h2,.kepala-atlet h2{font-size:20px;font-weight:600}
.kepala-cabor .chips,.kepala-atlet .chips{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}
.tautan-kartu{margin-top:10px;overflow-wrap:anywhere;display:flex;gap:12px;align-items:flex-start}.tautan-kartu p{margin:0}.tautan-kartu .btn{margin-top:6px}
.tautan-qr{flex:none;width:112px;height:112px;background:#fff;border:1px solid var(--line);border-radius:4px}.tautan-qr svg{width:100%;height:100%;display:block}
.kepala-cabor .kv,.kepala-atlet .kv{min-width:240px;max-width:360px}
.donat text{font-family:var(--f-display)}
.sparkline{display:block;width:100%;height:auto}

/* ============================================================ ATLET — roster & detil (I-37) */
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:5px;overflow:hidden;flex:none}
.seg button{padding:6px 11px;font-size:12px;color:var(--ink-3);border-right:1px solid var(--line-strong)}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--accent-wash);color:var(--accent);font-weight:600}
.seg-penuh{display:flex;width:100%;margin-top:8px}.seg-penuh button{flex:1}
.saring-panel{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.saring-panel input,.saring-panel select{font:12.5px var(--f-body);padding:6px 9px;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface);color:var(--ink);min-width:0}
.saring-panel input[type=search]{flex:1 1 220px}
.saring-cacah{margin-left:auto}
.panel-gulir{max-height:420px;overflow-y:auto}
.panel-gulir .komp-row{grid-template-columns:minmax(0,180px) 44px minmax(28px,1fr) max-content}
.panel-sekat-bawah{border-top:1px solid var(--line);border-bottom:0}
.avatar{width:60px;height:60px;border-radius:50%;background:var(--accent-wash);color:var(--accent);display:grid;place-items:center;font-family:var(--f-display);font-weight:600;font-size:20px;flex:none}
img.avatar{object-fit:cover;border:1px solid var(--line)}   /* I-38a: foto atlet bagi pemegang lihat_dokumen_atlet */
.medali-baris{display:flex;gap:18px;align-items:baseline}
.angka-medali{font-family:var(--f-mono);font-size:24px;font-variant-numeric:tabular-nums}
.angka-tc{font-family:var(--f-mono);font-size:30px;font-weight:600;font-variant-numeric:tabular-nums}
.daftar-raihan{list-style:none;margin:12px 0 0;padding:0}
.daftar-raihan li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:12.5px}

/* ============================================================ FORMULIR — isian dalam panel (Kerangka Cabor) */
.formulir{--f-isian:13px;container-type:inline-size}
/* Kolom isian menyempit di samping pemilih: dua panel berdampingan baru bila lebarnya cukup */
@container (max-width:780px){.formulir .grid-2{grid-template-columns:minmax(0,1fr)}}
/* :where() menahan spesifisitas di 0,1,0 agar lebar kolom tabel isian dapat menimpanya */
.formulir :where(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%;min-width:0;font:var(--f-isian) var(--f-body);padding:7px 10px;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface);color:var(--ink)}
.formulir :where(input,select,textarea):hover{border-color:var(--ink-4)}
.formulir :where(input,select,textarea):focus{outline:2px solid var(--accent);outline-offset:-1px;border-color:var(--accent)}
.formulir :is(input,textarea).angka,.formulir textarea.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.formulir input.angka{text-align:right}
/* Lihat kata sandi (I-65, I-67): tombol mata di tepi kanan medan sandi (layouts.tombol-lihat-sandi, lihat-sandi.js); dicoret saat sandi tampil */
.medan-sandi{position:relative}
.medan-sandi input{padding-right:38px}
.medan-sandi input::-ms-reveal{display:none}   /* Edge punya tombol mata sendiri; cukup satu */
.lihat-sandi{position:absolute;top:0;right:0;bottom:0;width:36px;display:grid;place-items:center;color:var(--ink-3);border-radius:0 5px 5px 0}
.lihat-sandi[hidden]{display:none}
.lihat-sandi:hover{color:var(--ink)}
.lihat-sandi:focus-visible{outline-offset:-4px}
.lihat-sandi svg{width:16px;height:16px}
.lihat-sandi .coret{display:none}
.lihat-sandi[aria-pressed=true] .coret{display:inline}
.formulir textarea{resize:vertical;line-height:1.5;display:block}
.formulir fieldset{border:0;margin:0;padding:0;min-width:0}
.formulir code{font-family:var(--f-mono);font-size:.92em;background:var(--surface-3);padding:1px 5px;border-radius:3px}
.medan{padding:14px 0;border-top:1px solid var(--line)}
.medan:first-child{border-top:0;padding-top:0}
.medan-lab{display:block;font-size:12.5px;font-weight:500;margin-bottom:6px;padding:0}
.medan-lab .tiny{font-weight:400;margin-left:4px}
.medan-isi{display:grid;gap:8px}
.medan-isi.kolom-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.medan-isi.kolom-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.medan-isi label{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--ink-3);min-width:0}
.medan+.note{padding-top:12px;border-top:1px solid var(--line)}
/* I-46: daftar centang nomor pada formulir Sunting Atlet */
.pilih-nomor{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 18px}
.pilih-nomor label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink-2)}
.panel-kaki{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px 16px;border-top:1px solid var(--line)}
/* Hasil aksi tepat di bawah tempelan yang diprosesnya, sebelum pratinjau */
.panel-pesan{display:flex;flex-direction:column;gap:8px;padding:0 16px 14px}
.panel-pesan .pesan,.panel-pesan .galat{margin:0;background:var(--surface-2)}
/* Unggah berkas isian (Entry by Name): dua langkah bersebelahan, bertumpuk bila sempit */
.unggah-isian{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:4px 24px}
.unggah-isian .medan{border-top:0;padding:0}
.baris-kendali{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.baris-kendali select{flex:1 1 200px;min-width:0}
.formulir input[type=file]{display:block;width:100%;font:inherit;font-size:13px}
.daftar-galat{margin:8px 0 0;padding-left:20px;max-height:280px;overflow:auto;font-size:12.5px;line-height:1.55}
/* Dokumen atlet (I-38): kepala panel satu atlet, dan baris roster yang sedang dibuka */
.dok-kepala{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap}
.dok-foto{width:96px;height:128px;object-fit:cover;border-radius:6px;border:1px solid var(--line);flex:none}
.dok-ringkas{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 14px;margin:0;font-size:13px}
.dok-ringkas dt{color:var(--ink-3)}
.dok-ringkas dd{margin:0}
tr.baris-aktif td{background:var(--accent-wash)}
#dm-akar{display:flex;flex-direction:column;gap:12px}
#dm-akar .panel-kaki{padding:10px 0 0}
#dm-akar .pesan,#dm-akar .galat{margin:0;background:var(--surface-2)}
.picker-status{margin-top:6px}
.neraca .neraca-grup th{background:var(--surface-2);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding-top:7px;padding-bottom:7px}
.neraca .neraca-selisih td{font-weight:600}
.neraca tbody:not(:last-child) tr:last-child td{border-bottom:1px solid var(--line)}
.tabel-isian th,.tabel-isian td{padding:6px 6px}
.tabel-isian td:first-child,.tabel-isian th:first-child{padding-left:16px}
.tabel-isian td:last-child,.tabel-isian th:last-child{padding-right:16px}
.tabel-isian :where(input,select){padding:5px 8px}
.tabel-isian .w-kat{min-width:7rem}.tabel-isian .w-nama{min-width:12rem}.tabel-isian .w-pilih{min-width:7.5rem}.tabel-isian .w-angka{width:4.75rem}
/* Kolom isian sempit (di samping pemilih, atau ponsel): tiap baris nomor menjadi kartu dua baris berlabel.
   Label kolom datang dari data-label; tiap isian tetap punya aria-label sendiri. */
@container (max-width:900px){
  .tabel-isian thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabel-isian,.tabel-isian tbody{display:block}
  .tabel-isian tbody tr{display:grid;grid-template-columns:22px repeat(4,minmax(0,1fr)) auto;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}
  .tabel-isian tbody tr:last-child{border-bottom:0}
  .tabel-isian tbody td,.tabel-isian tbody td:first-child,.tabel-isian tbody td:last-child{padding:0;border:0;display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left}
  .tabel-isian td[data-label]::before{content:attr(data-label);font-size:11.5px;color:var(--ink-4)}
  .tabel-isian td:nth-child(1){grid-area:1/1/3/2;padding-top:22px}
  .tabel-isian td:nth-child(2){grid-area:1/2/2/3}
  .tabel-isian td:nth-child(3){grid-area:1/3/2/6}
  .tabel-isian td:nth-child(4){grid-area:2/2/3/3}
  .tabel-isian td:nth-child(5){grid-area:2/3/3/4}
  .tabel-isian td:nth-child(6){grid-area:2/4/3/5}
  .tabel-isian td:nth-child(7){grid-area:2/5/3/6}
  .tabel-isian td:nth-child(8){grid-area:1/6/2/7;justify-content:flex-end}
  .tabel-isian tbody td.issue-empty{grid-area:auto/1/auto/-1;padding:12px 0}
  .tabel-isian .w-kat,.tabel-isian .w-nama,.tabel-isian .w-pilih,.tabel-isian .w-angka{min-width:0;width:100%}
}
@container (max-width:520px){
  .tabel-isian tbody tr{grid-template-columns:22px minmax(0,1fr) minmax(0,1fr) auto}
  .tabel-isian td:nth-child(1){grid-area:1/1/5/2}
  .tabel-isian td:nth-child(2){grid-area:1/2/2/4}
  .tabel-isian td:nth-child(3){grid-area:2/2/3/5}
  .tabel-isian td:nth-child(4){grid-area:3/2/4/3}
  .tabel-isian td:nth-child(5){grid-area:3/3/4/5}
  .tabel-isian td:nth-child(6){grid-area:4/2/5/3}
  .tabel-isian td:nth-child(7){grid-area:4/3/5/5}
  .tabel-isian td:nth-child(8){grid-area:1/4/2/5}
}
details.tempel{border-top:1px solid var(--line)}
details.tempel>summary{padding:11px 16px;cursor:pointer;font-size:12.5px;font-weight:500;list-style:none}
details.tempel>summary::-webkit-details-marker{display:none}
details.tempel>summary::before{content:"▸";display:inline-block;width:1.1em;color:var(--ink-4);transition:transform .12s}
details.tempel[open]>summary::before{transform:rotate(90deg)}
details.tempel[open]>summary{border-bottom:1px solid var(--line)}
details.tempel .note{margin-bottom:10px}
/* Bilah aksi melayang di dasar layar selama kolom isian masih terlihat */
.aksi-lekat{position:sticky;bottom:12px;z-index:15;display:flex;flex-direction:column;gap:10px;padding:10px 16px;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:0 -1px 2px rgba(18,38,43,.05),0 10px 28px -12px rgba(18,38,43,.35)}
.aksi-lekat .pesan,.aksi-lekat .galat{margin:0;background:var(--surface-2)}
.aksi-baris{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.aksi-tombol{display:flex;gap:8px;flex-wrap:wrap}

/* ============================================================ ANTREAN VERIFIKASI (I-50) — pemilih + rincian per butir */
.tab-antrean{display:flex;gap:4px;box-shadow:inset 0 -1px var(--line);overflow-x:auto}
.tab-antrean a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-bottom:2px solid transparent;color:var(--ink-3);font-weight:500;text-decoration:none;white-space:nowrap}
.tab-antrean a:hover{color:var(--ink)}
.tab-antrean a.on{color:var(--ink);border-bottom-color:var(--accent);font-weight:600}
.kolom-rinci{container-type:inline-size}
.picker-item .p-nama>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.picker-item .p-umur{font-variant-numeric:tabular-nums;color:var(--ink-3);white-space:nowrap;align-self:flex-start;padding-top:2px}
.picker-item .p-kunci{color:var(--accent)}
.picker .paginasi{padding:8px 12px}
.stack-pesan{display:flex;flex-direction:column;gap:8px}
.stack-pesan .pesan,.stack-pesan .galat{margin:0}
.kepala-antrean{display:flex;gap:22px;padding:18px;align-items:flex-start;flex-wrap:wrap}
.kepala-antrean .identitas{flex:1;min-width:220px}
.kepala-antrean h2{font-size:20px;font-weight:600;margin-top:3px}
.kepala-antrean .chips{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}
.kepala-antrean .kv{min-width:240px;max-width:380px}
.kutip{margin:6px 0 0;padding-left:12px;border-left:2px solid var(--line-strong);color:var(--ink-2);white-space:pre-line}
.daftar-bukti{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.daftar-bukti li{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.daftar-bukti a{font-weight:500;color:var(--accent);text-decoration:none;overflow-wrap:anywhere}
.daftar-bukti a:hover{text-decoration:underline}
/* Subgrid: kolom nama, nilai, dan putusan sejajar di semua butir walau lebar tombolnya berbeda */
.butir-daftar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto;column-gap:20px}
.butir{grid-column:1/-1;display:grid;grid-template-columns:subgrid;border-bottom:1px solid var(--line)}
.butir:last-child{border-bottom:0}
.butir>*{grid-column:1/-1}
.butir-atas{display:grid;grid-template-columns:subgrid;row-gap:8px;align-items:center;padding:12px 16px}
.butir-nama b{display:block;font-weight:600}
.butir-nilai{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:baseline;font-variant-numeric:tabular-nums;min-width:0}
.butir-nilai .lama{color:var(--ink-3)}
.butir-nilai .panah{color:var(--ink-4)}
.butir-kanan{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.butir-alasan{margin:0;padding:0 16px 12px;font-size:12.5px;color:var(--st-kritis-teks)}
.butir details.tempel{border-top:1px dashed var(--line)}
.butir details.tempel>summary{padding:8px 16px;color:var(--ink-3)}
.butir details.tempel[open]>summary{border-bottom:0;color:var(--ink)}
.butir-kembali{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr) auto;gap:8px;align-items:start;padding:0 16px 14px}
.langkah{margin:0;padding-left:20px;display:grid;gap:8px;color:var(--ink-2);line-height:1.55}
@container (max-width:680px){
  .butir-daftar{grid-template-columns:minmax(0,1fr)}
  .butir-kanan{justify-content:flex-start}
  .butir-kembali{grid-template-columns:minmax(0,1fr)}
  .butir-kembali .btn{justify-self:start}
}

/* ============================================================ FASE PERSIAPAN (I-51) — Overview, Matriks, Kontingen, Venue, Anggaran */
/* Baris asal data tiap KPI (FR-OVW-02): mockup tidak memilikinya dan PRD mencatatnya sebagai cacat */
.kpi .k-asal{font-size:11px;color:var(--ink-4);margin-top:6px;line-height:1.4}
.kpi .k-asal .asal{border:1px dashed var(--line-strong);border-radius:10px;padding:0 6px;white-space:nowrap}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filters select,.filters input{font:12.5px var(--f-body);padding:6px 9px;border:1px solid var(--line-strong);border-radius:5px;background:var(--surface);color:var(--ink);min-width:0;width:auto;max-width:100%}
.filters label{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2)}
.issue-tools,.map-tools{padding:12px 16px;border-bottom:1px solid var(--line)}
.map-tools input[type=search]{width:230px;max-width:100%}
.issue-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:start;padding:14px 16px;border-bottom:1px solid var(--line)}
.issue-grid .dec-issue{grid-column:1/-1}
.issue-head{display:none}
.dec-name{font-family:var(--f-display);font-weight:600;font-size:13.5px}
.dec-name em{display:block;font-style:normal;font-size:11px;color:var(--ink-4);font-family:var(--f-body);font-weight:400;margin-top:1px}
.dec-chip{margin-top:8px}
.dec-issue{font-size:12.5px;color:var(--ink-2)}
.dec-age{font-size:12px;white-space:nowrap}
.issue-person{display:block;margin-top:6px}
.panel-footer{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.overview-main,.overview-side{display:grid;gap:20px;align-items:start}
.overview-main>*,.overview-side>*{min-width:0}
.tautan-teks{padding:0;font:inherit;color:var(--accent);text-decoration:underline;text-underline-offset:2px;text-align:left}
.tautan-teks.on{font-weight:600;text-decoration:none}
.daftar-tag{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.daftar-tag a.tag{text-decoration:none}.daftar-tag a.tag:hover{background:var(--accent-wash);color:var(--accent)}
.angka-tren b{font-family:var(--f-display);font-size:20px;font-variant-numeric:tabular-nums}
.legenda-peta{border-bottom:1px solid var(--line)}
.hm-band{display:grid;grid-template-columns:132px minmax(0,1fr);gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}
.hm-band:last-child{border-bottom:0}
.hm-lab{font-size:11.5px;font-weight:600;color:var(--ink-2);padding-top:2px}
.hm-lab span{display:block;font-weight:400;color:var(--ink-4);font-size:11px;margin-top:2px}
.hm-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px}
.tile{padding:10px;border:1px solid var(--line);border-left-width:3px;border-radius:4px;display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;color:inherit;min-width:0}
a.tile:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.tile .t-score{font-family:var(--f-display);font-weight:600;font-size:19px;line-height:1;font-variant-numeric:tabular-nums}
.tile .tile-status{font-size:11px;color:var(--ink-2);margin-left:6px;font-family:var(--f-body);font-weight:400}
.tile .t-name{font-size:12.5px;color:var(--ink);margin-top:6px;line-height:1.35}
.tile .t-sub{font-size:11px;color:var(--ink-4);margin-top:2px}
.tile .stale-badge{display:block;background:var(--surface-3);color:var(--ink-2);border:1px solid var(--line-strong);border-radius:4px;padding:2px 5px;font-size:11px;margin-top:8px}
.tile.stale .t-score{color:var(--ink-3)}
@media (min-width:1181px){.kpi.kpi-5{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (min-width:1200px){.overview-main{grid-template-columns:minmax(0,1.8fr) minmax(310px,1fr)}}
@media (min-width:901px) and (max-width:1199px){.overview-side{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:901px){
  .issue-grid{grid-template-columns:minmax(110px,1fr) minmax(155px,1.6fr) 66px 104px;gap:12px}
  .issue-grid .dec-issue{grid-column:auto}
  .issue-head{display:grid;background:var(--surface-2);font-size:12px;color:var(--ink-3);padding-top:10px;padding-bottom:10px}
  .issue-grid .btn{justify-content:center}
  .issue-panel .panel-h{align-items:flex-start;flex-direction:column;gap:6px}
  .dec-name,.dec-issue,.dec-age{font-size:14px}.dec-name em{font-size:12px}
  .filters select,.filters input{font-size:14px}
  .hm-lab{font-size:14px}.hm-lab span{font-size:12px}
  .hm-tiles{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
  .tile{padding:12px}.tile .t-score{font-size:22px}.tile .t-name{font-size:14px;margin-top:8px}.tile .t-sub{font-size:12px}
  .overview-side .komp-row{grid-template-columns:minmax(0,1fr) 32px 65px;gap:10px}
  .overview-side .komp-note{grid-column:1/-1;text-align:left;font-size:12px}
  .kpi .k-asal{font-size:12px}
}
@media (max-width:900px){.hm-band{grid-template-columns:1fr;gap:10px}}
@media (min-width:1181px){.kpi.kpi-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.kpi .k-kecil{font-size:.7em}
.avatar-kode{border-radius:9px;font-size:16px;letter-spacing:.02em}
/* Matriks: sel berwarna selalu berteks di title dan teks layar-pembaca; legenda memakai sel yang sama */
.mx{border-collapse:separate;border-spacing:2px;width:auto;font-size:11px}
.mx th,.mx td{padding:0;border:0;background:none}
.mx tbody tr:hover{background:none}
.mx thead th{padding:3px 2px;font-size:10.5px;letter-spacing:0;text-transform:none;color:var(--ink-3)}
.mx th.v{writing-mode:vertical-rl;transform:rotate(180deg);text-align:left;height:52px;font-family:var(--f-mono)}
.mx th.v a{text-decoration:none}.mx th.v a:hover{color:var(--accent)}
.mx .rl{font-size:12px;font-weight:400;text-align:left;padding-right:10px;white-space:nowrap;color:var(--ink)}
.mx .rl a{text-decoration:none}.mx .rl a:hover{color:var(--accent);text-decoration:underline}
.mx td.r,.mx th.r{padding-left:8px;text-align:right}
.mx .mx-jumlah{font-size:10.5px;text-align:center;color:var(--ink-3)}
.cx{width:20px;height:20px;border-radius:3px;background:var(--surface-3);display:block}
.cx.on{background:var(--accent-soft)}
.cx.core{background:var(--accent-deep)}
.cx.batal{background:var(--st-kritis-wash);box-shadow:inset 0 0 0 1px var(--st-kritis)}
.legenda-matriks{margin-left:auto}
.legend i.cx{display:inline-block;width:11px;height:11px;margin-right:5px;vertical-align:-1px}
.legend i.cx:not(.on):not(.core):not(.batal){box-shadow:inset 0 0 0 1px var(--line-strong)}
@media (max-width:900px){.legenda-matriks{margin-left:0}}
/* Tindak Lanjut Isu (layar turunan Overview) */
.isu-daftar{list-style:none;margin:0;padding:0}
.isu{border-bottom:1px solid var(--line)}
.isu:last-child{border-bottom:0}
.isu-atas{display:flex;gap:12px;padding:14px 16px}
.isu-atas .stripe{width:3px;border-radius:2px;flex:none;align-self:stretch}
.isu-isi{flex:1;min-width:0}
.isu-judul{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.isu-teks{margin:6px 0 4px;color:var(--ink-2)}
.tugas{margin:0 16px 12px 31px;padding:10px 12px;background:var(--surface-2);border-radius:5px}
.tugas-kepala{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tugas-catatan{margin:8px 0 0}
.tugas-aksi{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:start;margin-top:10px}
.isu details.tempel{border-top:1px dashed var(--line)}
.isu details.tempel>summary{padding:8px 16px 8px 31px;color:var(--ink-3)}
.isu details.tempel[open]>summary{border-bottom:0;color:var(--ink)}
.tugas-baru{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;padding:0 16px 14px 31px;align-items:end}
.tugas-baru label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--ink-3)}
.tugas-baru .tugas-baru-catatan{grid-column:1/-1}
.tugas-baru .btn{justify-self:start}
@media (max-width:900px){.tugas{margin-left:16px}.tugas-aksi{grid-template-columns:1fr}.tugas-baru,.isu details.tempel>summary{padding-left:16px}}

/* ============================================================ OPERASIONAL & ADMINISTRASI (I-52) */
.kolom-sempit{max-width:680px;width:100%}
.nowrap{white-space:nowrap}
.formulir .isian-skor{width:6.5rem;display:inline-block}
.unggah-isian .medan-lebar{grid-column:1/-1}
.riwayat-butir{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:5px;font-size:12.5px}
.riwayat-butir li{display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}
.butir-alasan-riwayat{flex-basis:100%;color:var(--st-kritis-teks);font-size:12px}
.notif-daftar{list-style:none;margin:0;padding:0}
.notif{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;border-bottom:1px solid var(--line)}
.notif:last-child{border-bottom:0}
.notif-titik{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:none;background:transparent;box-shadow:inset 0 0 0 1px var(--line-strong)}
.notif.belum .notif-titik{background:var(--accent);box-shadow:none}
.notif.belum{background:var(--accent-wash)}
.notif-isi{flex:1;min-width:0}
.notif-judul b{font-weight:500}.notif.belum .notif-judul b{font-weight:600}
.notif-pesan{margin:3px 0 4px;color:var(--ink-2);font-size:13px}
.saring-audit input[type=search]{width:190px}
@media (max-width:900px){.notif{flex-wrap:wrap}.notif .aksi-tombol{flex-basis:100%;padding-left:20px}}

/* ============================================================ PELAKSANAAN & KIOS DINDING (I-53) */
.panel-kaki .btn{white-space:nowrap;flex:none}
.live-layout{display:grid;gap:20px;align-items:start}
.live-layout>*{min-width:0}
@media (min-width:1200px){.live-layout{grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr)}}
.agenda-grup>h3{font-size:13px;font-weight:600;padding:12px 16px 0;margin:0}
.agenda-grup+.agenda-grup,.agenda-grup+details.tempel{border-top:1px solid var(--line)}
body.kios{min-height:100vh;display:flex;flex-direction:column}
.kios-kepala{display:flex;gap:16px;align-items:center;padding:16px 32px;background:var(--rail-bg);color:var(--rail-ink);flex-wrap:wrap}
.kios-judul{flex:1;min-width:240px}
.kios-judul strong{display:block;font-family:var(--f-display);font-size:22px;font-weight:600}
.kios-judul span{font-size:14px;color:var(--rail-ink-2)}
.kios-kanan{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.kios-kanan .kesegaran{color:var(--rail-ink)}
.kios-keluar{font-size:12px;color:var(--rail-ink-2)}
.kios-isi{flex:1;padding:24px 32px 40px}
.kios-kisi{display:grid;gap:24px;align-items:start}
@media (min-width:1100px){.kios-kisi{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.kios .panel-h h2{font-size:22px}
.kios table{font-size:17px}
.kios th{font-size:13px}
.kios-daftar{list-style:none;margin:0;padding:0}
.kios-daftar li{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:17px}
.kios-daftar li:last-child{border-bottom:0}
.kios-daftar b{font-family:var(--f-display);font-weight:600}
.medali{display:inline-block;padding:1px 8px;border-radius:10px;font-size:13px;font-weight:600;color:var(--on-accent)}
.medali-emas{background:var(--med-1)}.medali-perak{background:var(--med-2)}.medali-perunggu{background:var(--med-3);color:var(--ink)}
@media (max-width:900px){.kios-kepala,.kios-isi{padding-left:16px;padding-right:16px}.kios-kanan{align-items:flex-start}}

/* ============================================================ RESPONSIF */
@media (min-width:1181px){.kpi.kpi-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:1180px){
  .kpi{grid-template-columns:repeat(3,1fr)}
  .kpi>div:nth-child(4){border-left:0}
  .kpi>div:nth-child(n+4){border-top:1px solid var(--line)}
  .grid-3,.grid-2{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .rail{position:static;height:auto}
  .nav{display:grid;grid-template-columns:repeat(2,1fr);gap:0 8px}
  .topbar{position:static}
  .content,.topbar,.kaki{padding-left:16px;padding-right:16px}
  .cabor-split,.atlet-split{grid-template-columns:1fr}
  .picker{position:static;max-height:360px}
  .kpi{grid-template-columns:repeat(2,1fr)}
  .kpi>div:nth-child(odd){border-left:0}.kpi>div:nth-child(4){border-left:1px solid var(--line)}
  .kpi>div:nth-child(n+3){border-top:1px solid var(--line)}
  .topaside{width:100%;justify-content:space-between}
  .topaside-blok{text-align:left}.kesegaran{justify-content:flex-start}
  .panel-h{flex-direction:column;align-items:flex-start;gap:4px}.panel-h .hint{text-align:left}
  .kepala-cabor .kv,.kepala-atlet .kv,.kepala-antrean .kv{max-width:none;width:100%}
  .saring-panel select{flex:1 1 140px}.saring-cacah{margin-left:0;width:100%}
  .cell-name em{display:block;margin-left:0}
  .aksi-tombol,.aksi-tombol .btn{flex:1 1 auto;justify-content:center}
  .panel-kaki{flex-wrap:wrap}
}

/* Skala baca desktop dan hierarki, seperti mockup */
@media (min-width:901px){
  .topbar h1{font-size:26px}
  .topbar .sub,.phase-tabs a,.phase-tabs span,.nav a{font-size:14px}
  .nav a{padding-top:10px;padding-bottom:10px}
  .panel-h h2{font-size:18px;line-height:1.35}
  .panel-h .hint,.tiny,.note,.kpi .k-note,.legend,.paginasi{font-size:13px}
  .btn,.tombol,.btn.sm,.tombol-kecil,.picker-h input,.picker-h select,.saring-panel input,.saring-panel select,.seg button{font-size:13px}
  table{font-size:14px}
  th{font-size:12px;letter-spacing:0;text-transform:none}
  .kpi .k-lab{font-size:14px;letter-spacing:0;text-transform:none;color:var(--ink-2)}
  .kpi .k-val{font-size:32px}
  .chip{font-size:12px}
  .kv{font-size:13.5px}
  .komp-lab{font-size:14px}.komp-lab span{font-size:12px}.komp-val{font-size:17px}.komp-note{font-size:12px}
  .picker-item .p-nama b,.picker-item .p-skor{font-size:14px}
  .kepala-cabor h2,.kepala-atlet h2,.kepala-antrean h2{font-size:24px}
  .tab-antrean a,.picker-item .p-umur{font-size:14px}
  .butir-alasan{font-size:13.5px}
  .cell-name em,.daftar-raihan li{font-size:13px}
  .formulir{--f-isian:14px}
  .medan-lab,details.tempel>summary{font-size:14px}
  .medan-isi label{font-size:13px}
  .neraca .neraca-grup th{font-size:12px;letter-spacing:.04em}
}

/* I-98: keadaan unggahan wire:model (aksi-livewire.js) tepat di bawah isian berkas */
.status-unggah{margin:6px 0 0}
.status-unggah.tiny{color:var(--ink-3)}

/* I-94: Pengesahan Hasil — panel sahkan dan formulir koreksi di dalam panel nomor */
.pengesahan .panel-h h2 .tiny{font-family:var(--f-body);font-weight:400;margin-left:6px}
.pengesahan .sahkan-panel{border-top:1px solid var(--line);background:var(--surface-2);display:flex;flex-direction:column;gap:12px}
.pengesahan .sahkan-panel .medan{padding:0;border:0}
.pengesahan .koreksi-panel{padding:6px 0 4px;display:flex;flex-direction:column;gap:10px}
.pengesahan .koreksi-panel .medan{padding:0;border:0}

/* ============================================================ CETAK (FR-EXP-08, §17.7.6) — A4 potret */
@page{size:A4 portrait;margin:20mm}
@media print{
  /* [data-theme] ikut disebut agar cetak tetap terang walau pengguna memilih tema gelap */
  :root,:root[data-theme]{color-scheme:light;--ground:#fff;--surface:#fff;--surface-2:#fff;--surface-3:#eee;--ink:#000;--ink-2:#222;--ink-3:#333;--ink-4:#444;--line:#999;--line-strong:#777;--accent:#0E3D46;--accent-wash:#eee;--st-kritis-teks:#B42B2B}
  .rail,.tombol-tema,.phase-tabs,.tab-antrean,.topbar-aksi,.picker,.seg,.saring-panel,.btn,.tombol,.lompat,.paginasi button,#muat-ulang,.aksi-lekat,details.tempel{display:none!important}
  .app{display:block}.topbar{position:static;border-bottom:2px solid #000;padding:0 0 6pt}
  .topbar::after{content:"KONI Provinsi Kalimantan Barat · Porprov XIV 2026";display:block;font-size:9pt}
  .content{padding:0;max-width:none}.cabor-split,.atlet-split{display:block}
  .panel-gulir{max-height:none;overflow:visible}
  body{background:#fff;font-size:10.5pt}
  .panel{break-inside:avoid;box-shadow:none;margin-bottom:10pt}
  details.panel:not([open]){display:none}
  thead{display:table-header-group}tr{page-break-inside:avoid}
  .chip{border:1px solid #000;background:#fff!important}
  a{text-decoration:none}.gulir{overflow:visible}
  .grid-2,.grid-3{grid-template-columns:1fr 1fr}
}

/* I-100: logo kontingen (unggahan admin, I-99 Fase B) di Profil Kontingen, Command Center, dan Mode Dinding */
.logo-kontingen{display:inline-block;width:22px;height:22px;object-fit:contain;vertical-align:middle;margin-right:7px;flex:none}
.logo-kosong{font-size:8px;font-weight:600;line-height:22px;text-align:center;border-radius:4px;background:var(--accent-wash);color:var(--accent);letter-spacing:.02em}
.picker-item .p-logo{flex:none;display:flex;align-items:center}
.picker-item .p-logo .logo-kontingen{width:26px;height:26px;margin-right:0}
img.avatar-logo{object-fit:contain;border-radius:9px;background:#fff;padding:3px}
.kios .logo-kontingen{width:30px;height:30px;margin-right:9px}
.kios .logo-kosong{font-size:10px;line-height:30px}