/* V58_231 — โครงหน้าส่วนสาธารณะ (แถบบน เมนูหลัก แท็บล่างมือถือ breadcrumb ส่วนท้าย) · ฟอนต์ในเครื่อง */
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-sans-thai-thai-400-normal.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-sans-thai-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/noto-sans-thai-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-sans-thai-thai-600-normal.woff2) format('woff2');unicode-range:U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC}
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-sans-thai-latin-ext-600-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'GT Sans Thai';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/noto-sans-thai-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--ps-ink:#16324a;--ps-muted:#5f7385;--ps-line:#dbe5ee;--ps-soft:#f3f7fb;--ps-bg:#eef3f8;--ps-brand:#17557f;--ps-brand-d:#123f5f;--ps-brand-2:#1f73a8;--ps-accent:#e8a317;--ps-font:'GT Sans Thai',Tahoma,'Leelawadee UI','Noto Sans Thai',Arial,sans-serif;--ps-tabs-h:64px}
body.ps{font-family:var(--ps-font)!important;color:var(--ps-ink);background:var(--ps-bg);line-height:1.7;-webkit-font-smoothing:antialiased}
body.ps h1,body.ps h2,body.ps h3,body.ps h4,body.ps h5{font-weight:600;line-height:1.45}
.ps-lock{overflow:hidden}
.ps-in{max-width:1180px;margin:0 auto;padding:0 20px}
.ps-skip{position:fixed;left:12px;top:12px;z-index:3000;transform:translateY(-200%);background:#fff;color:var(--ps-ink);padding:.6rem .9rem;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.2);font-weight:600;text-decoration:none}
.ps-skip:focus{transform:none}

/* แถบบน */
.ps-top{background:#fff;border-bottom:1px solid var(--ps-line);z-index:1020}
.ps-top.is-sticky{position:sticky;top:0}
.ps-top>.ps-in{display:flex;align-items:center;gap:18px;min-height:64px}
.ps-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ps-ink);flex:0 0 auto}
.ps-logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--ps-brand-d),var(--ps-brand-2));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.25rem}
.ps-name b{display:block;font-size:1.05rem;line-height:1.25}
.ps-name small{display:block;font-size:.74rem;color:var(--ps-muted);line-height:1.3}
.ps-nav{flex:1;min-width:0}
.ps-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:2px;justify-content:center}
.ps-li{position:relative}
.ps-a{display:inline-flex;align-items:center;gap:7px;border:0;background:none;color:var(--ps-ink);font:inherit;font-size:.96rem;font-weight:500;padding:9px 13px;border-radius:10px;text-decoration:none;cursor:pointer;white-space:nowrap}
.ps-a:hover,.ps-li.open>.ps-a{background:var(--ps-soft);color:var(--ps-brand)}
.ps-li.on>.ps-a{color:var(--ps-brand);font-weight:600;box-shadow:inset 0 -3px 0 var(--ps-accent);border-radius:10px 10px 4px 4px}
.ps-a>.bi:first-child{font-size:1.05rem;opacity:.85}
.ps-caret{font-size:.7rem;opacity:.6;transition:transform .15s}
.ps-li.open .ps-caret{transform:rotate(180deg)}
.ps-sub{display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);width:340px;background:#fff;border:1px solid var(--ps-line);border-radius:16px;box-shadow:0 18px 44px rgba(18,52,80,.16);padding:8px;z-index:1030}
.ps-li.open .ps-sub{display:block}
.ps-sub a{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:12px;text-decoration:none;color:var(--ps-ink)}
.ps-sub a:hover,.ps-sub a:focus-visible{background:var(--ps-soft)}
.ps-sub a>.bi{flex:0 0 36px;height:36px;border-radius:10px;background:#e7f1fa;color:var(--ps-brand);display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}
.ps-sub b{display:block;font-weight:600;font-size:.96rem;line-height:1.35}
.ps-sub small{display:block;color:var(--ps-muted);font-size:.8rem;line-height:1.4;margin-top:2px}
.ps-login{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;border:1.5px solid #c3d4e3;color:var(--ps-brand);border-radius:999px;padding:7px 14px;font-weight:600;font-size:.9rem;text-decoration:none}
.ps-login:hover{background:var(--ps-soft);color:var(--ps-brand)}
.ps-crumb{border-top:1px solid #edf2f6;background:#fbfcfe}
.ps-crumb ol{list-style:none;margin:0;padding:6px 0;display:flex;flex-wrap:wrap;gap:4px;font-size:.84rem;color:var(--ps-muted)}
.ps-crumb li+li::before{content:"\203A";margin:0 6px;color:#9fb0bf}
.ps-crumb a{color:var(--ps-brand);text-decoration:none}
.ps-crumb a:hover{text-decoration:underline}

/* ส่วนท้าย */
.ps-foot{background:#123048;color:#c9d7e3;margin-top:40px;padding:34px 0 26px;font-size:.92rem}
.ps-foot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.ps-foot h2{font-size:.95rem;color:#fff;margin:0 0 8px}
.ps-foot ul{list-style:none;margin:0;padding:0}
.ps-foot li{margin:4px 0}
.ps-foot a{color:#c9d7e3;text-decoration:none}
.ps-foot a:hover{color:#fff;text-decoration:underline}
.ps-foot-note{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;border-top:1px solid rgba(255,255,255,.12);margin-top:22px;padding-top:14px;font-size:.84rem;color:#9fb3c4}

/* แท็บล่าง + แผ่นเมนู (มือถือ) */
.ps-tabs{display:none}
.ps-sheet{position:fixed;inset:0;z-index:10900}
.ps-sheet[hidden]{display:none}
.ps-sheet-bg{position:absolute;inset:0;background:rgba(10,30,45,.45)}
.ps-sheet-box{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;padding:14px 14px calc(16px + env(safe-area-inset-bottom));max-height:80vh;overflow:auto;box-shadow:0 -10px 30px rgba(0,0,0,.18)}
.ps-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 8px}
.ps-sheet-head h2{font-size:1.1rem;margin:0}
.ps-sheet-head button{border:0;background:var(--ps-soft);width:40px;height:40px;border-radius:50%}
.ps-sheet-list a{display:flex;align-items:center;gap:12px;padding:12px 8px;border-bottom:1px solid #eef3f7;text-decoration:none;color:var(--ps-ink)}
.ps-sheet-list a:last-child{border-bottom:0}
.ps-sheet-list a>.bi:first-child{flex:0 0 40px;height:40px;border-radius:12px;background:#e7f1fa;color:var(--ps-brand);display:inline-flex;align-items:center;justify-content:center;font-size:1.15rem}
.ps-sheet-list a>span{flex:1;min-width:0}
.ps-sheet-list b{display:block;font-weight:600}
.ps-sheet-list small{display:block;color:var(--ps-muted);font-size:.82rem;line-height:1.4}
.ps-sheet-list .bi-chevron-right{color:#a7b6c3}

@media(max-width:991.98px){
 .ps-nav{display:none}
 .ps-top>.ps-in{min-height:58px;justify-content:space-between}
 .ps-tabs{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:1040;background:#fff;border-top:1px solid var(--ps-line);box-shadow:0 -4px 16px rgba(22,50,74,.08);padding-bottom:env(safe-area-inset-bottom)}
 .ps-tabs a,.ps-tabs button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:var(--ps-tabs-h);border:0;background:none;color:var(--ps-muted);font:inherit;font-size:.72rem;text-decoration:none;-webkit-tap-highlight-color:transparent}
 .ps-tabs .bi{font-size:1.3rem;line-height:1}
 .ps-tabs .on{color:var(--ps-brand);font-weight:600}
 .ps-tabs .on .bi{color:var(--ps-brand)}
 body.ps{padding-bottom:calc(var(--ps-tabs-h) + env(safe-area-inset-bottom))}
 body.ps .pc-pref{bottom:calc(var(--ps-tabs-h) + 10px + env(safe-area-inset-bottom))}
 body.ps .pc-consent{bottom:calc(var(--ps-tabs-h) + 8px + env(safe-area-inset-bottom))}
 .ps-foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:575.98px){
 .ps-in{padding:0 14px}
 .ps-name small{display:none}
 .ps-login span{display:none}
 .ps-login{padding:8px 10px}
 .ps-foot{padding-top:26px}
}
@media print{.ps-top,.ps-tabs,.ps-foot,.ps-sheet{display:none!important}body.ps{padding:0}}

/* ===== หน้าแรก ===== */
.ph-hero{background:radial-gradient(circle at 85% -10%,rgba(255,255,255,.16),transparent 40%),linear-gradient(125deg,var(--ps-brand-d) 0%,var(--ps-brand) 55%,var(--ps-brand-2) 100%);color:#fff;padding:42px 0 46px}
.ph-hero h1{font-size:clamp(1.55rem,3.4vw,2.3rem);margin:0 0 8px}
.ph-hero p{opacity:.9;font-size:1.04rem;max-width:640px;margin:0}
.ph-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.ph-btn{display:inline-flex;align-items:center;gap:8px;border-radius:12px;min-height:48px;padding:0 18px;font-weight:600;text-decoration:none;border:0}
.ph-btn-main{background:var(--ps-accent);color:#2b1d00}
.ph-btn-main:hover{filter:brightness(1.05);color:#2b1d00}
.ph-btn-line{background:rgba(255,255,255,.12);color:#fff;border:1.5px solid rgba(255,255,255,.35)}
.ph-btn-line:hover{background:rgba(255,255,255,.2);color:#fff}
.ph-stats{display:flex;flex-wrap:wrap;gap:18px;margin-top:22px;font-size:.86rem;opacity:.88}
.ph-stats b{font-size:1.05rem;margin-right:4px}
.ph-due{display:inline-flex;align-items:center;gap:8px;margin-top:16px;background:#fff7e0;color:#6b4a00;border-radius:999px;padding:6px 14px;font-size:.9rem;font-weight:600;text-decoration:none}
.ph-sec{padding:30px 0 6px;scroll-margin-top:70px}
.ph-sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}
.ph-sec-head h2{font-size:1.3rem;margin:0;display:flex;align-items:center;gap:10px}
.ph-sec-head h2 .bi{width:36px;height:36px;border-radius:10px;background:#e7f1fa;color:var(--ps-brand);display:inline-flex;align-items:center;justify-content:center;font-size:1.05rem}
.ph-sec-head p{margin:2px 0 0 46px;color:var(--ps-muted);font-size:.92rem}
.ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.ph-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--ps-line);border-radius:16px;padding:18px;text-decoration:none;color:var(--ps-ink);transition:border-color .15s,box-shadow .15s,transform .15s;min-height:100%}
.ph-card:hover{border-color:#a9c4da;box-shadow:0 10px 26px rgba(22,50,74,.10);transform:translateY(-2px);color:var(--ps-ink)}
.ph-card .ph-ic{width:46px;height:46px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:12px;background:#e7f1fa;color:var(--ps-brand)}
.ph-card h3{font-size:1.08rem;margin:0 0 4px}
.ph-card p{font-size:.9rem;color:var(--ps-muted);margin:0 0 14px;line-height:1.6}
.ph-card .ph-go{margin-top:auto;font-weight:600;color:var(--ps-brand);font-size:.92rem;display:inline-flex;align-items:center;gap:6px}
.ph-card.feat{grid-column:span 2;background:linear-gradient(135deg,#fff 0%,#f4f9fd 100%)}
.ph-tag{position:absolute;top:14px;right:14px;font-size:.72rem;font-weight:600;border-radius:999px;padding:2px 9px;background:#fff4dc;color:#7a5200}
.ph-ic.t-gold{background:#fff4dc;color:#a46b00}.ph-ic.t-green{background:#e3f4ec;color:#11684a}.ph-ic.t-teal{background:#e0f3f1;color:#0f6f68}.ph-ic.t-violet{background:#efe9fb;color:#5b3fa6}.ph-ic.t-rose{background:#fbe9ec;color:#9d2c45}
.ph-join{display:flex;flex-wrap:wrap;align-items:center;gap:14px;background:#fff;border:1px dashed #b9cbdb;border-radius:16px;padding:16px 18px}
.ph-join .ph-ic{margin:0}
.ph-join div{flex:1;min-width:220px}
.ph-join b{display:block}
.ph-join small{color:var(--ps-muted)}
@media(max-width:575.98px){.ph-card.feat{grid-column:auto}.ph-hero{padding:28px 0 32px}.ph-sec-head p{margin-left:0}.ph-grid{grid-template-columns:1fr 1fr;gap:10px}.ph-card{padding:14px}.ph-card p{display:none}.ph-card .ph-ic{width:42px;height:42px;font-size:1.2rem;margin-bottom:10px}.ph-card h3{font-size:.98rem}.ph-tag{display:none}}

/* ===== V58_231 unify: page headers and themes of existing pages follow the shell ===== */
body.ps .hero,body.ps .quiz-header{background:linear-gradient(135deg,#123f60 0%,#17557f 55%,#1f6f9e 100%)!important;color:#fff!important;padding:26px 0 24px;position:relative}
body.ps .hero h1,body.ps .hero h2,body.ps .hero h3,body.ps .quiz-header h1,body.ps .quiz-header h2{color:#fff!important}
body.ps .hero p,body.ps .hero .lead,body.ps .hero small{color:rgba(255,255,255,.86)}
body.ps.sh-ui,body.ps.sh-ui.dr-page{--ui-sans:var(--ps-font);--ui-serif:var(--ps-font);--page:var(--ps-bg);--brand:#17557f;--brand-deep:#0f3d5c;--brand-soft:#e6f0f7;--head:#123f60;--line:#dbe5ee;--line-soft:#e9f0f6}
body.ps{--font:var(--ps-font)}                          /* textbook/index.php */
body.ps:not(.tb-reader){--page:var(--ps-bg);--brand:#17557f;--brand-deep:#0f3d5c;--brand-soft:#e6f0f7;--head:#123f60;--line:#dbe5ee;--line-soft:#e9f0f6}
body.ps *:not(code):not(kbd):not(pre):not(samp):not(.bi){font-family:var(--ps-font)!important}
body.ps .policy table{display:block;overflow-x:auto}
@media print{.ps-top,.ps-foot,.ps-tabs,.ps-sheet,.ps-skip{display:none!important}body.ps{padding:0!important;background:#fff!important}}
/* V58_234 ลิงก์สถิติบนหน้าแรก */
.ph-stats .ph-stats-link{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.ph-stats .ph-stats-link:hover{color:#ffe7a8}