/* ===== คลังระเบียบศาลยุติธรรม — ระบบธีม =====
   data-palette = navy | krang | emerald | mangosteen | ocean | graphite
   data-dark    = 1 | 0 (JS เป็นผู้ตัดสินจากค่าที่เลือก: ตามระบบ/สว่าง/มืด) */
:root{
  --bg:#f6f4ef; --bg2:#efebe2; --surface:#ffffff; --surface2:#faf8f3; --line:#e4dfd3; --line2:#efeadf;
  --ink:#1c2430; --ink2:#4a5566; --ink3:#7a8494;
  --p:#1e3a5f; --p2:#2c5282; --p-ink:#ffffff; --head:#1e3a5f;
  --gold:#c8962e; --gold-soft:#f8ecd2; --gold-ink:#7a5410;
  --link:#1f5fa8; --link-soft:#e6eff9;
  --hero1:#1a3354; --hero2:#2c5282; --hero3:#3a6aa0;
  --ok:#1f7a4d; --warn:#a15c00; --warn-soft:#fff4e0; --bad:#b42318;
  --mark:#ffe58a; --shadow:0 1px 2px rgba(20,30,50,.06),0 6px 20px rgba(20,30,50,.06); --shadow2:0 10px 34px rgba(20,30,50,.14);
  --r:16px; --r2:11px; --fs:16px;
  --font:"IBM Plex Sans Thai","Sarabun","Thonburi","Leelawadee UI","Noto Sans Thai",system-ui,sans-serif;
  --font-doc:"Sarabun","IBM Plex Sans Thai","Thonburi","Leelawadee UI",serif;
  color-scheme:light;
}
:root[data-palette="krang"]{--bg:#f8f3ee;--bg2:#f0e6dc;--p:#7a1f2b;--p2:#9b2c3a;--head:#7a1f2b;--gold:#c9a227;--gold-soft:#f7edd0;--gold-ink:#6e5508;--link:#9b2c3a;--link-soft:#f8e8ea;--hero1:#5a1520;--hero2:#8a2433;--hero3:#b2454f}
:root[data-palette="emerald"]{--bg:#f3f6f1;--bg2:#e6ece2;--p:#135e4b;--p2:#1c7a62;--head:#135e4b;--gold:#c2a15a;--gold-soft:#f3ecd9;--gold-ink:#6b5520;--link:#13795f;--link-soft:#e1f3ec;--hero1:#0c4236;--hero2:#16705a;--hero3:#2a957a}
:root[data-palette="mangosteen"]{--bg:#f7f4f6;--bg2:#eee6ec;--p:#4b2353;--p2:#6a3577;--head:#4b2353;--gold:#d1a33c;--gold-soft:#f7ecd4;--gold-ink:#6e5212;--link:#6a3577;--link-soft:#f1e8f4;--hero1:#341839;--hero2:#5c2c67;--hero3:#8a4c98}
:root[data-palette="ocean"]{--bg:#f2f7f8;--bg2:#e2edf0;--p:#0b5368;--p2:#0e7490;--head:#0b5368;--gold:#e8913a;--gold-soft:#fdeedd;--gold-ink:#8a4a0e;--link:#0e7490;--link-soft:#e0f2f6;--hero1:#083f50;--hero2:#0e6b85;--hero3:#1aa0bf}
:root[data-palette="graphite"]{--bg:#f5f5f4;--bg2:#e9e8e6;--p:#2b2f36;--p2:#454c57;--head:#2b2f36;--gold:#b08d57;--gold-soft:#f1ece3;--gold-ink:#5e4826;--link:#2f5d8f;--link-soft:#e9eef4;--hero1:#1e2126;--hero2:#3a4049;--hero3:#5b6370}

:root[data-dark="1"]{
  --bg:#11151b; --bg2:#0d1116; --surface:#181e26; --surface2:#141a21; --line:#2a323e; --line2:#222933;
  --ink:#e7ebf1; --ink2:#b3bcc9; --ink3:#8792a2; --p-ink:#0f1318;
  --ok:#5fc48f; --warn:#f0b357; --warn-soft:#30261a; --bad:#ff8a80; --mark:#6b5a12;
  --shadow:0 1px 2px rgba(0,0,0,.35),0 6px 20px rgba(0,0,0,.25); --shadow2:0 10px 34px rgba(0,0,0,.45); color-scheme:dark;
  --p:#8fb3e6; --p2:#a9c6ee; --head:#a9c6ee; --gold:#e3b75a; --gold-soft:#342a19; --gold-ink:#f0cf8a; --link:#8fb8ef; --link-soft:#1c2a3c;
}
:root[data-dark="1"][data-palette="krang"]{--p:#e79aa3;--p2:#f0b4bb;--head:#f0b4bb;--gold:#e0c05c;--link:#f0a2ab;--link-soft:#38202a}
:root[data-dark="1"][data-palette="emerald"]{--p:#72d0b2;--p2:#93ddc6;--head:#93ddc6;--gold:#d8bd7c;--link:#7fd6ba;--link-soft:#173229}
:root[data-dark="1"][data-palette="mangosteen"]{--p:#cfa3dc;--p2:#ddbbe7;--head:#ddbbe7;--gold:#e4bd62;--link:#d2a8df;--link-soft:#2e2034}
:root[data-dark="1"][data-palette="ocean"]{--p:#6fcbe2;--p2:#93d9ea;--head:#93d9ea;--gold:#f2ad6a;--link:#7ad2e7;--link-soft:#132f38}
:root[data-dark="1"][data-palette="graphite"]{--p:#c9ced6;--p2:#dde0e5;--head:#e1e4e8;--gold:#cfae7c;--link:#9dbbe6;--link-soft:#202a36}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:120px;font-size:var(--fs)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:1rem;line-height:1.68;-webkit-font-smoothing:antialiased;transition:background .25s}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
button,input,select{font:inherit;color:inherit}
mark{background:var(--mark);color:inherit;border-radius:3px;padding:0 1px}
.skip{position:absolute;left:-999px;top:0;background:var(--p);color:var(--p-ink);padding:8px 12px;z-index:99}
.skip:focus{left:8px}
:focus-visible{outline:3px solid color-mix(in srgb,var(--link) 55%,transparent);outline-offset:2px;border-radius:6px}
svg.i{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em;flex:none}

/* ===== แถบบน ===== */
.topbar{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.topbar:before{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--p),var(--gold),var(--p2))}
.topbar-inner{max-width:1260px;margin:auto;display:flex;align-items:center;gap:16px;padding:9px 20px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none!important;flex:none}
.brand-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,var(--hero1),var(--hero2));display:grid;place-items:center;box-shadow:0 4px 12px color-mix(in srgb,var(--hero2) 35%,transparent)}
.brand-mark svg{width:25px;fill:#f5c96a}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-text b{font-size:1.06rem;letter-spacing:.1px}
.brand-text small{font-size:.75rem;color:var(--ink3)}
.searchwrap{position:relative;flex:1;max-width:580px}
.topsearch{display:flex;background:var(--surface2);border:1px solid var(--line);border-radius:999px;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.topsearch:focus-within{border-color:var(--link);box-shadow:0 0 0 4px var(--link-soft)}
.topsearch input{flex:1;border:0;background:transparent;padding:9px 16px;min-width:0;outline:none}
.topsearch button{border:0;background:transparent;padding:0 14px;cursor:pointer;color:var(--ink2)}
.kbd{font-size:.7rem;border:1px solid var(--line);border-radius:5px;padding:0 5px;color:var(--ink3);align-self:center;margin-right:8px}
.topnav{display:flex;align-items:center;gap:2px;flex:none}
.topnav a{color:var(--ink2);padding:7px 11px;border-radius:9px;font-size:.94rem;display:inline-flex;gap:6px;align-items:center}
.topnav a:hover,.topnav a.on{background:var(--link-soft);color:var(--link);text-decoration:none}
.iconbtn{border:1px solid var(--line);background:var(--surface);border-radius:10px;height:36px;padding:0 10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--ink2)}
.iconbtn:hover{border-color:var(--link);color:var(--link)}
.swatch-dot{width:16px;height:16px;border-radius:50%;background:conic-gradient(var(--p) 0 50%,var(--gold) 0);box-shadow:0 0 0 2px var(--surface),0 0 0 3px var(--line)}

/* ===== คำแนะนำการค้นหา ===== */
.suggest{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow2);padding:6px;z-index:60;max-height:70vh;overflow:auto;text-align:left;color:var(--ink)}
.suggest[hidden]{display:none}
.suggest .sg{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:10px;cursor:pointer;color:var(--ink)}
.suggest .sg:hover,.suggest .sg.on{background:var(--link-soft);text-decoration:none}
.suggest .sg .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;font-size:15px}
.suggest .sg b{display:block;font-weight:500;line-height:1.4;font-size:.95rem}
.suggest .sg small{color:var(--ink3);font-size:.78rem}
.suggest .all{display:block;padding:8px 10px;border-top:1px solid var(--line2);margin-top:4px;font-size:.9rem}

/* ===== แผงตั้งค่า (ธีม) ===== */
.panel{position:fixed;z-index:70;top:64px;right:16px;width:340px;max-width:calc(100vw - 24px);background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow2);padding:16px 16px 14px}
.panel[hidden]{display:none}
.panel h4{margin:0 0 8px;font-size:.82rem;color:var(--ink3);font-weight:600;letter-spacing:.2px}
.panel .row{margin-bottom:14px}
.palettes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pal{border:2px solid var(--line);background:var(--surface2);border-radius:12px;padding:8px 6px 6px;cursor:pointer;text-align:center;font-size:.78rem;color:var(--ink2);line-height:1.3}
.pal .sw{display:flex;height:26px;border-radius:7px;overflow:hidden;margin-bottom:5px}
.pal .sw i{flex:1}
.pal.on{border-color:var(--link);color:var(--ink);font-weight:600}
.seg{display:flex;background:var(--surface2);border:1px solid var(--line);border-radius:11px;padding:3px;gap:3px}
.seg button{flex:1;border:0;background:transparent;border-radius:8px;padding:6px 4px;cursor:pointer;font-size:.88rem;color:var(--ink2)}
.seg button.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow);font-weight:600}

main{max-width:1260px;margin:auto;padding:26px 20px 70px;min-height:70vh}
.loading{padding:80px;text-align:center;color:var(--ink3)}
.foot{border-top:1px solid var(--line);color:var(--ink3);font-size:.84rem;text-align:center;padding:18px 20px 40px;background:var(--bg2)}
.foot p{max-width:880px;margin:auto}

/* ===== หน้าแรก ===== */
.hero{background:radial-gradient(1200px 400px at 85% -10%,color-mix(in srgb,var(--gold) 28%,transparent),transparent 60%),linear-gradient(135deg,var(--hero1) 0%,var(--hero2) 60%,var(--hero3) 100%);color:#fff;border-radius:26px;padding:38px 38px 30px;position:relative;box-shadow:var(--shadow2);isolation:isolate}
.hero .pattern{position:absolute;inset:0;border-radius:inherit;overflow:hidden;z-index:-1;opacity:.13;background-image:radial-gradient(circle at 1px 1px,#fff 1px,transparent 1.5px);background-size:22px 22px;mask-image:linear-gradient(110deg,transparent 30%,#000 75%)}
.hero .emblem{position:absolute;right:34px;top:26px;width:150px;opacity:.16;z-index:-1}
.hero .emblem path{fill:#fff}
.hero .eyebrow{display:inline-flex;gap:8px;align-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:3px 12px;font-size:.8rem;color:#f3e1b4;margin-bottom:12px}
.hero h1{margin:0 0 8px;font-size:2rem;line-height:1.28;max-width:760px}
.hero h1 em{font-style:normal;color:#f5d27e}
.hero p{margin:0 0 20px;color:rgba(255,255,255,.82);max-width:760px}
.bigsearch-wrap{position:relative;max-width:780px}
.bigsearch{display:flex;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.bigsearch .lead-ic{display:grid;place-items:center;padding-left:16px;color:#6b7280}
.bigsearch input{flex:1;border:0;padding:16px 14px;font-size:1.12rem;outline:none;color:#1c2430;min-width:0;background:#fff}
.bigsearch button{border:0;background:var(--gold);color:#1c1606;padding:0 26px;font-weight:700;cursor:pointer;font-size:1rem}
.bigsearch button:hover{filter:brightness(1.06)}
.hint{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hint span{font-size:.82rem;color:rgba(255,255,255,.7)}
.hint a{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.22);padding:3px 13px;border-radius:999px;font-size:.88rem}
.hint a:hover{background:rgba(255,255,255,.24);text-decoration:none}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:24px;max-width:780px}
.stats div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:10px 14px;font-size:.8rem;color:rgba(255,255,255,.78)}
.stats b{display:block;font-size:1.55rem;color:#fff;line-height:1.2}
.quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:-22px;padding:0 22px;position:relative;z-index:2}
.qcard{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 16px 14px;box-shadow:var(--shadow2);color:var(--ink);display:flex;gap:12px;align-items:flex-start;transition:transform .15s,border-color .15s}
.qcard:hover{transform:translateY(-3px);border-color:var(--link);text-decoration:none}
.qcard .qi{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:none;background:var(--link-soft);color:var(--link)}
.qcard .qi svg{width:22px;height:22px}
.qcard b{display:block;font-size:1rem;line-height:1.35}
.qcard small{color:var(--ink3);font-size:.8rem;line-height:1.4;display:block;margin-top:2px}
.sec-title{display:flex;align-items:flex-end;justify-content:space-between;margin:40px 0 14px;gap:12px}
.sec-title h2{margin:0;font-size:1.32rem;display:flex;align-items:center;gap:10px}
.sec-title h2:before{content:"";width:6px;height:22px;border-radius:3px;background:linear-gradient(var(--gold),var(--p))}
.sec-title small{color:var(--ink3)}
.catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.catcard{--c:#2563eb;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:flex;gap:13px;align-items:center;color:var(--ink);box-shadow:var(--shadow);transition:transform .15s,border-color .15s;position:relative;overflow:hidden}
.catcard:after{content:"";position:absolute;right:-30px;bottom:-30px;width:90px;height:90px;border-radius:50%;background:color-mix(in srgb,var(--c) 9%,transparent)}
.catcard:hover{transform:translateY(-2px);border-color:var(--c);text-decoration:none}
.catcard .ic{font-size:22px;width:48px;height:48px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 14%,var(--surface));border-radius:14px;flex:none}
.catcard b{display:block;font-size:.98rem;line-height:1.35}
.catcard small{color:var(--ink3);font-size:.82rem}
.catcard .bar{height:4px;border-radius:2px;background:var(--line2);margin-top:6px;overflow:hidden}
.catcard .bar i{display:block;height:100%;background:var(--c);border-radius:2px}
.rolegrid{display:flex;flex-wrap:wrap;gap:8px}
.policy-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.policy-card{background:linear-gradient(140deg,var(--gold-soft),var(--surface) 75%);border:1px solid color-mix(in srgb,var(--gold) 45%,var(--line));border-radius:var(--r);padding:18px 20px;color:var(--ink);position:relative;box-shadow:var(--shadow);transition:transform .15s}
.policy-card:hover{text-decoration:none;transform:translateY(-2px);border-color:var(--gold)}
.policy-card small{color:var(--gold-ink);font-weight:700;font-size:.78rem;letter-spacing:.3px}
.policy-card b{display:block;font-size:1.06rem;margin:3px 0 6px;color:var(--head);line-height:1.4}
.policy-card p{margin:0;color:var(--ink2);font-size:.9rem}
.newstrip{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px}
.newcard{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:12px;padding:12px 14px;color:var(--ink);box-shadow:var(--shadow)}
.newcard:hover{border-color:var(--gold);text-decoration:none}
.newcard b{display:block;font-size:.93rem;line-height:1.45;font-weight:500}
.newcard small{color:var(--ink3);font-size:.78rem}

/* ===== ชิปและป้าย ===== */
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink2);border-radius:999px;padding:4px 12px;font-size:.86rem;cursor:pointer;line-height:1.5;white-space:nowrap;transition:border-color .12s,background .12s}
.chip:hover{border-color:var(--link);color:var(--link);text-decoration:none}
.chip.on{background:var(--p);border-color:var(--p);color:var(--p-ink)}
.chip .dot{width:9px;height:9px;border-radius:50%;flex:none}
.chip small{color:var(--ink3);font-size:.78rem}
.chip.on small{color:inherit;opacity:.8}
.badge{display:inline-flex;align-items:center;gap:4px;font-size:.78rem;padding:1px 9px;border-radius:999px;background:var(--surface2);border:1px solid var(--line);color:var(--ink2);white-space:nowrap;line-height:1.7}
.badge.kbs{background:color-mix(in srgb,#2563eb 10%,var(--surface));border-color:color-mix(in srgb,#2563eb 28%,var(--line));color:color-mix(in srgb,#2563eb 75%,var(--ink))}
.badge.ks{background:color-mix(in srgb,#16a34a 10%,var(--surface));border-color:color-mix(in srgb,#16a34a 28%,var(--line));color:color-mix(in srgb,#15803d 80%,var(--ink))}
.badge.pol,.badge.new{background:var(--gold-soft);border-color:color-mix(in srgb,var(--gold) 45%,var(--line));color:var(--gold-ink)}
.badge.ver{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 30%,var(--line));color:var(--warn)}
.badge.cat{--c:#2563eb;background:color-mix(in srgb,var(--c) 9%,var(--surface));border-color:color-mix(in srgb,var(--c) 25%,var(--line));color:color-mix(in srgb,var(--c) 70%,var(--ink))}

/* ===== รายการ ===== */
.layout{display:grid;grid-template-columns:270px 1fr;gap:26px;align-items:start}
.side{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;max-height:calc(100vh - 104px);overflow:auto;box-shadow:var(--shadow)}
.side h3{font-size:.8rem;color:var(--ink3);margin:8px 8px 6px;font-weight:600}
.side a{display:flex;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:9px;color:var(--ink2);font-size:.92rem;line-height:1.4}
.side a:hover{background:var(--surface2);text-decoration:none}
.side a.on{background:var(--link-soft);color:var(--link);font-weight:600}
.side a span:last-child{color:var(--ink3);font-size:.78rem}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 16px}
.filters select{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:6px 10px;font-size:.88rem}
.doclist{display:flex;flex-direction:column;gap:11px}
.docitem{--c:#2563eb;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:15px 18px 15px 20px;color:var(--ink);display:block;box-shadow:var(--shadow);position:relative;transition:border-color .12s,transform .12s}
.docitem:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:4px;border-radius:0 4px 4px 0;background:var(--c)}
.docitem:hover{border-color:color-mix(in srgb,var(--c) 60%,var(--line));text-decoration:none;transform:translateX(2px)}
.docitem .meta{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:5px}
.docitem h3{margin:0;font-size:1.03rem;line-height:1.5;color:var(--head)}
.docitem p{margin:6px 0 0;color:var(--ink2);font-size:.9rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.docitem .tagrow{margin-top:9px;display:flex;flex-wrap:wrap;gap:6px}
.docitem .snip{margin-top:8px;font-size:.88rem;color:var(--ink2);background:var(--surface2);border-left:3px solid var(--gold);padding:7px 11px;border-radius:0 9px 9px 0}
.docitem .snip b{color:var(--ink);font-weight:600}
.empty{text-align:center;color:var(--ink3);padding:56px 10px;background:var(--surface);border:1px dashed var(--line);border-radius:var(--r)}
.pagetitle{margin:0 0 4px;font-size:1.6rem;line-height:1.35;color:var(--head)}
.lead{color:var(--ink2);margin:0 0 18px}

/* ===== หน้าเอกสาร ===== */
.dochead{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px 26px 18px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.dochead:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--c,var(--p)),var(--gold))}
.crumbs{font-size:.84rem;color:var(--ink3);margin-bottom:6px}
.crumbs a{color:var(--ink3)}
.dochead h1{margin:8px 0 4px;font-size:1.55rem;line-height:1.42;color:var(--head)}
.dochead .sub{color:var(--ink2);font-size:.92rem}
.dochead .meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 2px}
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:11px;padding:7px 14px;font-size:.92rem;cursor:pointer;color:var(--ink);transition:border-color .12s,background .12s}
.btn:hover{border-color:var(--link);color:var(--link);text-decoration:none}
.btn.primary{background:var(--p);border-color:var(--p);color:var(--p-ink)}
.btn.primary:hover{filter:brightness(1.08);color:var(--p-ink)}
.btn.on{background:var(--gold-soft);border-color:var(--gold);color:var(--gold-ink)}
.tagbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0 0;padding:12px 0 0;border-top:1px dashed var(--line)}
.tagbar label{font-size:.8rem;color:var(--ink3);margin-right:4px}
.tabs{position:sticky;top:61px;z-index:15;display:flex;gap:4px;margin:14px 0 0;overflow-x:auto;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(10px);padding:8px 0;border-bottom:1px solid var(--line)}
.tabs button{border:1px solid transparent;background:transparent;padding:8px 16px;border-radius:11px;cursor:pointer;color:var(--ink2);font-weight:500;white-space:nowrap;display:inline-flex;gap:7px;align-items:center}
.tabs button:hover{background:var(--surface)}
.tabs button.on{color:var(--p-ink);background:var(--p);border-color:var(--p)}
.docbody{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:24px;margin-top:20px;align-items:start}
.toc{position:sticky;top:128px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;font-size:.88rem;max-height:calc(100vh - 150px);overflow:auto;box-shadow:var(--shadow)}
.toc b{font-size:.78rem;color:var(--ink3);display:block;margin:0 6px 6px}
.toc a{display:flex;gap:8px;align-items:center;padding:5px 8px;border-radius:7px;color:var(--ink2);line-height:1.4}
.toc a:hover{background:var(--surface2);text-decoration:none;color:var(--link)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;margin-bottom:16px;box-shadow:var(--shadow)}
.card>h2{margin:0 0 12px;font-size:1.12rem;display:flex;gap:10px;align-items:center;color:var(--head)}
.card>h2 .hi{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--link-soft);color:var(--link);flex:none}
.card>h2 .hi svg{width:18px;height:18px}
.card>h2 .n{font-size:.8rem;color:var(--ink3);font-weight:400;margin-left:auto}
.quick30{background:linear-gradient(135deg,color-mix(in srgb,var(--p) 9%,var(--surface)),var(--surface) 70%);border:1px solid color-mix(in srgb,var(--p) 25%,var(--line));border-radius:var(--r);padding:20px 22px;margin-bottom:16px;box-shadow:var(--shadow)}
.quick30 .lbl{display:inline-flex;gap:6px;align-items:center;font-size:.78rem;font-weight:700;color:var(--p);background:color-mix(in srgb,var(--p) 12%,transparent);padding:2px 10px;border-radius:999px;margin-bottom:8px}
.quick30 .overview{font-size:1.04rem;line-height:1.85}
.quick30 ul{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.quick30 li{display:flex;gap:10px;align-items:flex-start;font-size:.95rem}
.quick30 li:before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;background:var(--p);color:var(--p-ink);display:grid;place-items:center;font-size:.75rem;margin-top:2px}
.quick30 .facts{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:12px;font-size:.88rem;color:var(--ink2)}
.verbox{background:var(--warn-soft);border:1px solid color-mix(in srgb,var(--warn) 30%,transparent);border-radius:13px;padding:12px 16px;font-size:.9rem;margin-bottom:16px}
.verbox b{color:var(--warn)}
.verbox ul{margin:6px 0 0;padding-left:20px}
.kp{border-top:1px solid var(--line2);padding:13px 0;display:grid;grid-template-columns:30px 1fr;gap:10px}
.kp:first-of-type{border-top:0;padding-top:2px}
.kp .num{width:26px;height:26px;border-radius:8px;background:var(--link-soft);color:var(--link);font-size:.8rem;font-weight:700;display:grid;place-items:center;margin-top:2px}
.kp h3{margin:0 0 3px;font-size:1rem}
.kp p{margin:0;white-space:pre-line}
.ref{display:inline-block;font-size:.76rem;background:var(--link-soft);color:var(--link);border-radius:6px;padding:0 7px;margin:3px 4px 0 0;cursor:pointer;border:0;line-height:1.75;font-weight:500}
.ref:hover{text-decoration:underline}
.ref.more{background:transparent;border:1px dashed var(--line);color:var(--ink3)}
.steps{counter-reset:s;list-style:none;padding:0;margin:6px 0 0}
.steps li{counter-increment:s;position:relative;padding:4px 0 12px 42px}
.steps li:before{content:counter(s);position:absolute;left:0;top:3px;width:29px;height:29px;border-radius:50%;background:var(--p);color:var(--p-ink);display:grid;place-items:center;font-size:.85rem;font-weight:700}
.steps li:not(:last-child):after{content:"";position:absolute;left:14px;top:34px;bottom:0;width:2px;background:var(--line)}
.proc h3{margin:14px 0 6px;font-size:1rem}
.proc:first-of-type h3{margin-top:0}
.tblwrap{overflow-x:auto;margin:8px 0;border:1px solid var(--line);border-radius:12px}
table.rt{border-collapse:collapse;width:100%;font-size:.92rem}
table.rt th{background:color-mix(in srgb,var(--p) 10%,var(--surface));color:var(--head);text-align:left;font-weight:600;padding:9px 12px;border-bottom:1px solid var(--line)}
table.rt td{padding:9px 12px;border-top:1px solid var(--line2);vertical-align:top}
table.rt tbody tr:nth-child(even) td{background:var(--surface2)}
table.rt tbody tr:hover td{background:var(--link-soft)}
.rate h3{margin:12px 0 2px;font-size:1rem}
.rate:first-of-type h3{margin-top:0}
.note{font-size:.84rem;color:var(--ink3)}
.bul{margin:0;padding-left:20px}
.bul li{margin:5px 0}
.callout-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.callout-list li{padding:9px 12px;border-radius:11px;background:var(--surface2);border:1px solid var(--line2)}
.callout-list.warn li{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 22%,transparent)}
.qa details{border:1px solid var(--line2);border-radius:12px;padding:10px 14px;margin-bottom:8px;background:var(--surface2)}
.qa details[open]{background:var(--surface);border-color:var(--line)}
.qa summary{cursor:pointer;font-weight:600;list-style:none;display:flex;gap:10px}
.qa summary::-webkit-details-marker{display:none}
.qa summary:before{content:"ถาม";font-size:.72rem;background:var(--p);color:var(--p-ink);border-radius:6px;padding:0 7px;height:22px;line-height:22px;flex:none;margin-top:2px}
.qa details p{margin:8px 0 2px 46px}
dl.defs{margin:0;display:grid;grid-template-columns:minmax(130px,max-content) 1fr;gap:8px 16px}
dl.defs dt{font-weight:600}
dl.defs dd{margin:0}
.totop{position:fixed;right:20px;bottom:24px;z-index:25;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink2);box-shadow:var(--shadow2);cursor:pointer;display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;transform:translateY(8px)}
.totop.show{opacity:1;pointer-events:auto;transform:none}

/* ===== ต้นฉบับ ===== */
.orig{font-family:var(--font-doc);font-size:1.06rem;line-height:1.9}
.orig .pg{border-top:2px dashed var(--line);margin:22px 0 10px;padding-top:8px;display:flex;justify-content:space-between;align-items:center;gap:8px;font-family:var(--font);font-size:.8rem;color:var(--ink3);flex-wrap:wrap}
.orig .pg:first-child{border-top:0;margin-top:0}
.orig .pg a{background:var(--link-soft);padding:1px 10px;border-radius:999px}
.orig h4{text-align:center;margin:10px 0 4px;font-size:1.1rem;color:var(--head)}
.orig p{margin:0 0 8px;text-indent:2.2em}
.orig p.cl{text-indent:0}
.orig p.cl b.cn{color:var(--p);background:color-mix(in srgb,var(--p) 9%,transparent);padding:0 5px;border-radius:5px}
.orig p.fn{font-size:.84rem;color:var(--ink3);text-indent:0;border-left:2px solid var(--line);padding-left:8px}
.orig p.target{background:color-mix(in srgb,var(--gold) 24%,transparent);border-radius:6px;transition:background 1.6s}
.orig .pimg{margin:8px 0 14px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.orig .pimg img{display:block;width:100%;height:auto}
.orig .pimg figcaption{font-family:var(--font);font-size:.8rem;color:var(--ink3);padding:6px 10px;background:var(--surface2)}
.ocrnote{background:var(--warn-soft);font-family:var(--font);font-size:.84rem;padding:6px 10px;border-radius:8px;margin:6px 0}
.findbar{position:sticky;top:122px;z-index:5;background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:8px 10px;display:flex;gap:8px;align-items:center;margin-bottom:12px;box-shadow:var(--shadow)}
.findbar input{flex:1;border:1px solid var(--line);border-radius:9px;padding:6px 10px;background:var(--surface2);min-width:0}
.findbar span{font-size:.8rem;color:var(--ink3);white-space:nowrap}

/* ===== PDF ===== */
.pdflist{display:flex;flex-direction:column;gap:8px}
.pdfrow{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:13px;padding:10px 12px;flex-wrap:wrap;background:var(--surface2)}
.pdfrow.on{border-color:var(--link);background:var(--link-soft)}
.pdfic{font-size:.7rem;font-weight:700;color:#fff;background:#c0392b;border-radius:7px;padding:7px 8px;flex:none;letter-spacing:.5px}
.pdfmeta{flex:1;min-width:200px;display:flex;flex-direction:column;line-height:1.4}
.pdfmeta small{color:var(--ink3)}
.pdfact{display:flex;gap:6px;flex-wrap:wrap}
.pdfview{margin-top:4px}
.pdfview iframe{width:100%;height:82vh;border:1px solid var(--line);border-radius:var(--r);background:#525659}

/* ===== แท็ก ===== */
.tagcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow)}
.tagcard header{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tagcard header b{font-size:1.03rem}
.tagform{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;align-items:center}
.tagform input[type=text]{border:1px solid var(--line);border-radius:11px;padding:8px 12px;background:var(--surface);min-width:240px}
.tagform input[type=color]{width:42px;height:38px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:3px}
.pop{position:absolute;z-index:40;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow2);padding:10px;min-width:270px;max-height:360px;overflow:auto}
.pop label{display:flex;gap:8px;align-items:center;padding:5px 7px;border-radius:7px;cursor:pointer;font-size:.92rem}
.pop label:hover{background:var(--surface2)}
.pop .new{display:flex;gap:6px;margin-top:8px;border-top:1px solid var(--line2);padding-top:8px}
.pop .new input{flex:1;border:1px solid var(--line);border-radius:9px;padding:5px 9px;background:var(--surface2);min-width:0}
#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:12px;opacity:0;transition:.25s;pointer-events:none;z-index:80;font-size:.92rem}
#toast.show{opacity:1;transform:translateX(-50%)}
.prose{max-width:880px}
.prose h2{font-size:1.18rem;margin:24px 0 8px;color:var(--head)}

/* ===== แถบเมนูมือถือ ===== */
.bottomnav{display:none}
@media (max-width:1060px){
  .topnav a span{display:none}
  .quick{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .layout,.docbody{grid-template-columns:1fr}
  .side,.toc{position:static;max-height:none}
  .toc{display:none}
}
@media (max-width:720px){
  .topbar-inner{flex-wrap:wrap;gap:10px;padding:8px 14px}
  .searchwrap{order:3;flex-basis:100%;max-width:none}
  .topnav a{display:none}
  .kbd{display:none}
  .brand-text small{display:none}
  main{padding:16px 14px 96px}
  .hero{padding:26px 18px 22px;border-radius:20px}
  .hero h1{font-size:1.45rem}
  .hero .emblem{width:90px;right:14px;top:14px}
  .bigsearch input{font-size:1rem;padding:13px 10px}
  .bigsearch button{padding:0 16px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick{grid-template-columns:1fr 1fr;padding:0 6px;gap:10px}
  .qcard{padding:12px;flex-direction:column;gap:8px}
  .qcard small{display:none}
  .tabs{top:104px}
  .findbar{top:160px}
  .dochead{padding:18px 16px 14px;border-radius:18px}
  .dochead h1{font-size:1.25rem}
  .card,.quick30{padding:15px 15px}
  .orig{font-size:1rem}
  .qa details p{margin-left:0}
  dl.defs{grid-template-columns:1fr}
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:35;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .bottomnav a,.bottomnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.7rem;color:var(--ink2);padding:4px 0;border:0;background:transparent;cursor:pointer}
  .bottomnav a.on{color:var(--link)}
  .bottomnav svg{width:22px;height:22px}
  .totop{bottom:80px}
  .panel{top:auto;bottom:74px;right:12px;left:12px;width:auto}
}
@media print{
  .topbar,.foot,.actions,.tagbar,.tabs,.toc,.findbar,.side,#toast,.ref,.bottomnav,.totop,.panel{display:none!important}
  body{background:#fff;color:#000}
  main{padding:0;max-width:none}
  .card,.dochead,.quick30{box-shadow:none;border:0;padding:0}
  .docbody{display:block}
  .orig .pimg{break-inside:avoid}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* กันเนื้อหาล้นกริด (ข้อความไทยยาวไม่มีจุดตัด) */
.docbody>*,.layout>*{min-width:0}
/* ตัดบรรทัดตามคำไทย (เบราว์เซอร์ใช้พจนานุกรมไทย) — ไม่ตัดกลางคำ; ตัดกลางคำเฉพาะข้อความยาวที่ไม่มีช่องให้ตัดจริง ๆ */
body{word-break:normal;overflow-wrap:break-word;line-break:auto}

/* ===== อ่านง่าย: บูลเล็ต ย่อหน้า รายละเอียดเต็ม ===== */
.card p,.card li,.quick30 p{max-width:78ch}
.overview p{margin:0 0 8px}
.kp p{white-space:normal;margin:0 0 6px}
ul.bl{margin:4px 0 6px;padding:0;list-style:none;display:grid;gap:5px}
ul.bl li{position:relative;padding-left:20px;line-height:1.7}
ul.bl li:before{content:"";position:absolute;left:4px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--gold)}
ul.bl li b{color:var(--head)}
.refrow{margin-top:2px}
details.full{margin-top:6px}
details.full>summary{cursor:pointer;font-size:.82rem;color:var(--link);list-style:none;display:inline-flex;gap:4px;align-items:center}
details.full>summary::-webkit-details-marker{display:none}
details.full>summary:before{content:"▸";transition:transform .15s}
details.full[open]>summary:before{transform:rotate(90deg)}
details.full[open]{background:var(--surface2);border:1px solid var(--line2);border-radius:10px;padding:8px 12px}
details.full p{font-size:.94rem;color:var(--ink2)}
.quick30 .q30h{font-size:.8rem;font-weight:700;color:var(--ink3);margin:12px 0 0}
.quick30 details.full{margin:2px 0 4px}
details.verbox>summary{cursor:pointer;list-style:none}
details.verbox>summary::-webkit-details-marker{display:none}
details.verbox>summary:after{content:" ▾ ดูรายละเอียด";font-size:.78rem;color:var(--ink3)}
details.verbox[open]>summary:after{content:" ▴"}
details.verbox p{margin:6px 0}
.steps li p{margin:0}
.callout-list li p{margin:0 0 4px}
.qa .ans{margin:8px 0 2px 46px}
.qa .ans p{margin:0 0 6px}
@media (max-width:720px){.qa .ans{margin-left:0}}
/* รายการแนะนำการค้นหาในแบนเนอร์ต้องลอยเหนือการ์ดทางลัด (.quick z-index:2) */
.hero{z-index:5}
.hero:focus-within{z-index:20}

/* ===== แผนภาพ ===== */
.viewtog{display:inline-flex;background:var(--surface2);border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px;margin:-4px 0 10px}
.viewtog button{border:0;background:transparent;border-radius:7px;padding:4px 12px;font-size:.84rem;cursor:pointer;color:var(--ink2)}
.viewtog button.on{background:var(--surface);color:var(--ink);box-shadow:var(--shadow);font-weight:600}
.flow{display:flex;flex-direction:column;margin:6px 0 4px}
.fstep{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:flex-start;background:var(--surface2);border:1px solid var(--line);border-left:4px solid var(--p);border-radius:12px;padding:10px 14px}
.fno{width:30px;height:30px;border-radius:50%;background:var(--p);color:var(--p-ink);display:grid;place-items:center;font-weight:700;font-size:.9rem}
.fbody p{margin:0 0 4px}
.farrow{height:22px;position:relative}
.farrow:before{content:"";position:absolute;left:32px;top:2px;bottom:7px;width:2px;background:var(--gold)}
.farrow:after{content:"";position:absolute;left:27px;bottom:-1px;border:6px solid transparent;border-top:8px solid var(--gold)}
.tpill{display:inline-flex;gap:5px;align-items:center;font-size:.78rem;font-weight:700;color:var(--gold-ink);background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);border-radius:999px;padding:1px 10px;margin:0 0 5px}
.tpill svg{width:13px;height:13px}
ol.timeline{list-style:none;margin:4px 0 0;padding:0 0 0 6px;position:relative}
ol.timeline:before{content:"";position:absolute;left:12px;top:6px;bottom:10px;width:2px;background:linear-gradient(var(--gold),var(--p))}
ol.timeline li{position:relative;padding:2px 0 14px 34px}
ol.timeline .tdot{position:absolute;left:5px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--surface);border:3px solid var(--gold)}
ol.timeline li p{margin:0 0 4px}
.authgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.auth{display:flex;gap:10px;align-items:flex-start;background:var(--surface2);border:1px solid var(--line2);border-radius:12px;padding:10px 12px}
.auth .aic{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--link-soft);color:var(--link);flex:none}
.auth p{margin:0 0 4px}
.dtree{display:flex;flex-direction:column;align-items:center}
.dq{background:var(--p);color:var(--p-ink);border-radius:14px;padding:10px 18px;font-weight:600;text-align:center;max-width:640px;display:flex;gap:8px;align-items:center}
.dbranches{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;width:100%;margin-top:24px;position:relative}
.dbranches:before{content:"";position:absolute;left:12%;right:12%;top:-12px;height:2px;background:var(--gold)}
.dbr{position:relative;background:var(--surface2);border:1px solid var(--line);border-radius:12px}
.dbr:before{content:"";position:absolute;left:50%;top:-13px;width:2px;height:13px;background:var(--gold)}
.dif{background:var(--gold-soft);color:var(--gold-ink);font-weight:700;padding:8px 12px;font-size:.92rem;border-bottom:1px solid var(--line2);border-radius:12px 12px 0 0}
.dif:before{content:"ถ้า ";opacity:.7;font-weight:500}
.dthen{padding:8px 12px}
.dthen p{margin:0 0 4px}
.chain{display:flex;flex-wrap:wrap;align-items:stretch;gap:8px}
.cnode{flex:1 1 170px;background:var(--surface2);border:1px solid var(--line);border-top:4px solid var(--p);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.cnode b{color:var(--head)}
.cnode span{font-size:.9rem;color:var(--ink2)}
.carr{align-self:center;color:var(--gold);font-size:1.3rem}
@media (max-width:720px){.chain{flex-direction:column}.carr{transform:rotate(90deg)}.dbranches:before,.dbr:before{display:none}}
@media print{.viewtog{display:none}}

/* ===== ค้นหาแบบเจาะจง ===== */
.scopebar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--link-soft);border:1px solid color-mix(in srgb,var(--link) 25%,transparent);border-radius:12px;padding:8px 12px;margin:0 0 14px;font-size:.92rem}
.scopebar .btn{margin-left:auto;padding:4px 10px;font-size:.84rem}
.answers{background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 12%,var(--surface)),var(--surface) 60%);border:1px solid color-mix(in srgb,var(--gold) 40%,var(--line));border-radius:var(--r);padding:16px 18px;margin:0 0 18px;box-shadow:var(--shadow)}
.answers h2{margin:0 0 10px;font-size:1.08rem;color:var(--head);display:flex;gap:8px;align-items:center}
.anslist{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.answer{display:flex;flex-direction:column;gap:5px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:11px 13px;color:var(--ink)}
.answer:hover{border-color:var(--gold);text-decoration:none}
.answer:first-child{grid-column:1/-1;border-width:2px;border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
.ans-src{font-size:.84rem;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ans-src b{color:var(--head)}
.ans-lbl{font-size:.78rem;color:var(--ink3);font-weight:600}
.answer p{margin:0;font-size:.95rem}
.ans-go{font-size:.8rem;color:var(--link);margin-top:auto}
table.ansrow{border-collapse:collapse;font-size:.92rem;width:100%}
table.ansrow th{text-align:left;color:var(--ink3);font-weight:600;padding:3px 10px 3px 0;white-space:nowrap;vertical-align:top;width:1%}
table.ansrow td{padding:3px 0}
.subh{font-size:1rem;color:var(--ink2);margin:6px 0 10px}
.docsearch{display:flex;gap:8px;margin:12px 0 0;max-width:560px}
.docsearch input{flex:1;border:1px solid var(--line);border-radius:10px;padding:7px 12px;background:var(--surface2);min-width:0}
.hitflash{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px;background:color-mix(in srgb,var(--gold) 18%,transparent)!important;transition:background 1s}
tr.hitflash td{background:color-mix(in srgb,var(--gold) 25%,transparent)!important}
@media print{.docsearch{display:none}}

/* ===== ตารางแสดงเต็มโดยไม่ต้องเลื่อน ===== */
.tblwrap{overflow-x:visible}
table.rt{table-layout:auto}
table.rt th,table.rt td{word-break:normal;overflow-wrap:break-word;hyphens:auto}
@media (max-width:720px){
  /* จอแคบ: แต่ละแถวเป็นการ์ด "หัวคอลัมน์: ค่า" */
  .tblwrap{border:0;border-radius:0}
  table.rt,table.rt tbody,table.rt tr,table.rt td{display:block;width:100%}
  table.rt thead{display:none}
  table.rt tr{border:1px solid var(--line);border-radius:12px;margin:0 0 10px;background:var(--surface);overflow:hidden}
  table.rt tbody tr:nth-child(even) td{background:transparent}
  table.rt td{border-top:1px solid var(--line2);padding:7px 12px;display:grid;grid-template-columns:minmax(90px,38%) 1fr;gap:10px}
  table.rt td:first-child{border-top:0;background:color-mix(in srgb,var(--p) 8%,var(--surface))!important;font-weight:600}
  table.rt td:before{content:attr(data-th);font-weight:600;color:var(--ink3);font-size:.84rem}
  table.rt td[data-th=""]{grid-template-columns:1fr}
  table.rt td[data-th=""]:before{display:none}
}
/* ===== ปุ่มขนาดตัวอักษร ===== */
.fsbtns{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex:none}
.fsbtns button{border:0;background:var(--surface);color:var(--ink2);height:34px;min-width:38px;cursor:pointer;font-weight:700}
.fsbtns button+button{border-left:1px solid var(--line)}
.fsbtns button:hover{color:var(--link);background:var(--link-soft)}
.fsbtns button:disabled{opacity:.4;cursor:default}
@media (max-width:720px){.fsbtns button{min-width:34px}}
@media (max-width:720px){.brand{flex:1;min-width:0}.brand-text b{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-mark{width:34px;height:34px}#themeBtn span:last-child{display:none}#themeBtn{padding:0 9px}.topbar-inner{gap:8px}}
/* การ์ดทางลัดไม่ซ้อนทับแบนเนอร์ค้นหา */
.quick{margin-top:18px;padding:0}
.qcard{box-shadow:var(--shadow)}
@media (max-width:720px){.quick{margin-top:14px;padding:0}}
/* แถบบน: ให้ช่องค้นหาหดได้ ปุ่มด้านขวาไม่ล้นจอ */
.searchwrap{min-width:0}
.topbar-inner>*{flex-shrink:0}
.topbar-inner>.searchwrap{flex-shrink:1}
@media (max-width:1060px) and (min-width:721px){.brand-text small{display:none}.topnav{gap:0}.topnav a{padding:7px 8px}#themeBtn span:last-child{display:none}}

/* วลีสั้นไม่แยกบรรทัด; ภาพรวมเป็นย่อหน้าเดียวต่อเนื่อง */
.nw{white-space:nowrap}
.quick30 .overview p{margin:0;max-width:none}
.card p,.card li,.quick30 p{max-width:none}
.card .kp,.quick30 .overview,.card .callout-list,.card .qa{max-width:860px}

/* ===== แจ้งข้อมูลผิด / ผู้ดูแล ===== */
.modal-back{position:fixed;inset:0;z-index:90;background:rgba(10,14,20,.55);display:grid;place-items:center;padding:16px}
.modal{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow2);padding:20px 22px;width:min(560px,100%);max-height:92vh;overflow:auto;display:flex;flex-direction:column;gap:10px}
.modal h2{margin:0;font-size:1.15rem;display:flex;gap:8px;align-items:center;color:var(--head)}
.modal label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;font-weight:600;color:var(--ink2)}
.modal input,.modal select,.modal textarea{font-weight:400;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--surface2);color:var(--ink);font:inherit}
.modal-act{display:flex;gap:8px;justify-content:flex-end}
.mstat{margin:0;font-size:.88rem;color:var(--warn)}
.badge.okb{background:color-mix(in srgb,#16a34a 12%,var(--surface));border-color:color-mix(in srgb,#16a34a 35%,var(--line));color:color-mix(in srgb,#15803d 85%,var(--ink))}