/* P441 — Our Students. Public website styles */
.school-site-body .p441-students{--p441-primary:#087d59;--p441-secondary:#e891a8;--p441-accent:#d6a83b;color:#123c32;font-family:Sarabun,"Noto Sans Thai",sans-serif;width:100%;max-width:100%;box-sizing:border-box}
.school-site-body .p441-students *{box-sizing:border-box}
.school-site-body .p441-reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.school-site-body .p441-reveal.is-visible{opacity:1;transform:none}
.school-site-body .p441-head,.school-site-body .p441-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.school-site-body .p441-head{margin:0 0 16px}
.school-site-body .p441-controls{margin:0 0 18px}
.school-site-body .p441-head-label{display:inline-flex;align-items:center;gap:9px;font-size:19px;font-weight:800;color:#104e3b}
.school-site-body .p441-head-label i{color:var(--p441-primary)}
.school-site-body .p441-year-list,.school-site-body .p441-chart-switch,.school-site-body .p441-quick-stats{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.school-site-body .p441-year-list a,.school-site-body .p441-chart-switch button{border:1px solid #cfe4d8;border-radius:999px;background:#fff;padding:8px 14px;color:#176245;font:700 13px Sarabun,sans-serif;text-decoration:none;cursor:pointer;transition:all .18s ease}
.school-site-body .p441-year-list a:hover,.school-site-body .p441-year-list a.active,.school-site-body .p441-chart-switch button:hover,.school-site-body .p441-chart-switch button.active{background:#10523d;color:#fff;border-color:#10523d;box-shadow:0 10px 22px rgba(9,81,58,.15)}
.school-site-body .p441-quick-stats span{border-radius:999px;background:#edf7f1;padding:8px 12px;color:#41675c;font-size:13px;white-space:nowrap}
.school-site-body .p441-quick-stats b{color:#0d573f;font-size:14px}
.school-site-body .p441-main{display:block}
.school-site-body .p441-chart-card,.school-site-body .p441-detail-card{border:1px solid #dcebe4;border-radius:24px;background:linear-gradient(180deg,#ffffff 0%,#f8fcfa 100%);box-shadow:0 18px 44px rgba(15,77,58,.07)}
.school-site-body .p441-chart-card{padding:22px 22px 18px}
.school-site-body .p441-chart-card:hover,.school-site-body .p441-detail-card:hover{transform:translateY(-4px);transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 22px 54px rgba(15,77,58,.12)}
.school-site-body .p441-chart-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.school-site-body .p441-chart-card-head h3,.school-site-body .p441-card-head h3{margin:0;color:#124c3c;font-size:22px;font-weight:800}
.school-site-body .p441-chart-card-head p,.school-site-body .p441-card-head p{margin:6px 0 0;color:#678478;font-size:13px;line-height:1.7}
.school-site-body .p441-chart-panel{border:1px solid #e4efea;border-radius:18px;padding:20px 14px 16px;background:linear-gradient(180deg,#fff 0%,#f5faf7 100%);min-width:0;overflow:hidden}
.school-site-body .p441-columns{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:clamp(3px,.9vw,12px);align-items:stretch;height:290px;width:100%;min-width:0;position:relative;isolation:isolate}
.school-site-body .p441-column{min-width:0;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;border:0;border-radius:0;background:none;padding:0;box-shadow:none;transition:opacity .65s ease,transform .65s ease}
.school-site-body .p441-column.is-visible:hover{transform:translateY(-2px);box-shadow:none}
.school-site-body .p441-bar-label{order:3;display:block;margin:10px 0 0;width:100%;min-height:26px;font-weight:800;font-size:clamp(10px,1.15vw,13px);color:#386355;overflow-wrap:anywhere;line-height:1.25;white-space:nowrap}
.school-site-body .p441-bar-value{order:1;display:block;color:#124c37;font-size:clamp(11px,1.35vw,16px);font-weight:900;line-height:1.25;font-variant-numeric:tabular-nums;margin:0 0 9px;white-space:nowrap;transition:color .2s ease,transform .2s ease}
.school-site-body .p441-bar-stage{order:2;height:210px;width:100%;min-width:0;display:flex;align-items:flex-end;justify-content:center;position:relative;border-radius:0;background:transparent;padding:0}
.school-site-body .p441-bar{position:relative;width:clamp(7px,2.5vw,29px);max-width:94%;height:var(--p441-height);max-height:100%;transform-origin:bottom center;transform:scaleY(0);transition:transform .85s cubic-bezier(.2,.8,.2,1),filter .22s ease,box-shadow .22s ease;border-radius:999px 999px 4px 4px;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--p441-primary) 54%,white) 0%,var(--p441-primary) 85%);box-shadow:0 6px 18px rgba(3,100,70,.16)}
.school-site-body .p441-column.is-visible .p441-bar{transform:scaleY(1)}
.school-site-body .p441-students[data-shape="square"] .p441-bar,.school-site-body .p441-students[data-shape="square"] .p441-h-fill,.school-site-body .p441-students[data-shape="square"] .p441-area-track i{border-radius:0}
.school-site-body .p441-students[data-finish="flat"] .p441-bar{background:var(--p441-primary)}
.school-site-body .p441-students[data-chart="stacked"] .p441-bar{display:flex;flex-direction:column-reverse;background:none;overflow:hidden}
.school-site-body .p441-students[data-chart="stacked"] .p441-bar span{display:block;width:100%}
.school-site-body .p441-students[data-chart="stacked"] .p441-bar-m{height:var(--p441-part-m);background:var(--p441-primary)}
.school-site-body .p441-students[data-chart="stacked"] .p441-bar-f{height:var(--p441-part-f);background:var(--p441-secondary)}
.school-site-body .p441-students[data-chart="stacked"] .p441-bar-o{height:var(--p441-part-o);background:var(--p441-accent)}
.school-site-body .p441-horizontal{display:none;flex-direction:column;gap:12px}
.school-site-body .p441-students[data-chart="horizontal"] .p441-columns{display:none}
.school-site-body .p441-students[data-chart="horizontal"] .p441-horizontal{display:flex}
.school-site-body .p441-horizontal-row{display:grid;grid-template-columns:minmax(56px,88px) minmax(0,1fr) 48px;align-items:center;gap:12px;font-size:14px;border:1px solid #e6efea;background:#fff;border-radius:16px;padding:11px 14px;box-shadow:0 8px 22px rgba(9,81,58,.05)}
.school-site-body .p441-level-name{font-weight:700;color:#2d6957;overflow-wrap:anywhere}
.school-site-body .p441-horizontal-row strong{font-weight:800;color:#114b37;font-variant-numeric:tabular-nums;text-align:right}
.school-site-body .p441-h-track{background:#e6f0e9;border-radius:999px;min-width:0;height:18px;overflow:hidden}
.school-site-body .p441-h-fill{display:block;width:var(--p441-fill);height:100%;transform-origin:left center;transform:scaleX(0);transition:transform .8s cubic-bezier(.2,.8,.2,1),width .4s ease;background:linear-gradient(90deg,var(--p441-primary),color-mix(in srgb,var(--p441-primary) 55%,white));border-radius:999px}
.school-site-body .p441-horizontal-row.is-visible .p441-h-fill{transform:scaleX(1)}
.school-site-body .p441-students[data-finish="flat"] .p441-h-fill{background:var(--p441-primary)}
.school-site-body .p441-detail-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;margin-top:18px}
.school-site-body .p441-detail-card{padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.school-site-body .p441-detail-card:nth-child(1){grid-column:span 4}
.school-site-body .p441-detail-card:nth-child(2){grid-column:span 4}
.school-site-body .p441-detail-card:nth-child(3){grid-column:span 4}
.school-site-body .p441-total-card{background:linear-gradient(135deg,#0d513e 0%,#116446 100%);color:#fff;border-color:#0d5a44}
.school-site-body .p441-total-card span{display:block;color:#d4efde;font-size:13px;font-weight:700}
.school-site-body .p441-total-card strong{display:block;color:#fff!important;font-size:clamp(42px,4.8vw,62px);font-weight:900;line-height:1.1;margin:2px 0}
.school-site-body .p441-total-card small{display:block;color:#d6ece2;font-size:12px}
.school-site-body .p441-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}
.school-site-body .p441-summary-grid div{border-radius:14px;background:rgba(255,255,255,.12);padding:12px 10px;text-align:center}
.school-site-body .p441-summary-grid b{display:block;font-size:21px;color:#fff}
.school-site-body .p441-summary-grid span{display:block;font-size:12px;color:#cfe9db}
.school-site-body .p441-card-head{display:flex;flex-direction:column;gap:2px}
.school-site-body .p441-gender{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center;padding-top:4px}
.school-site-body .p441-donut{height:116px;width:116px;flex:0 0 116px;border-radius:50%;background:conic-gradient(var(--p441-primary) 0 var(--p441-male-pct),var(--p441-secondary) var(--p441-male-pct) var(--p441-known-pct),var(--p441-accent) var(--p441-known-pct) 100%);display:grid;place-items:center;box-shadow:0 10px 28px rgba(9,81,58,.10)}
.school-site-body .p441-donut span{background:white;height:74px;width:74px;border-radius:50%}
.school-site-body .p441-gender-legend{display:grid;gap:10px;color:#305d4e;font-size:14px}
.school-site-body .p441-gender-legend span{display:flex;align-items:center;gap:8px;white-space:nowrap}
.school-site-body .p441-gender-legend b{color:#124a37}
.school-site-body .p441-dot{height:11px;width:11px;display:inline-block;border-radius:4px}
.school-site-body .p441-dot.male{background:var(--p441-primary)}.school-site-body .p441-dot.female{background:var(--p441-secondary)}.school-site-body .p441-dot.other{background:var(--p441-accent)}
.school-site-body .p441-area-list{display:flex;flex-direction:column;gap:11px}
.school-site-body .p441-area-row{display:grid;grid-template-columns:minmax(88px,130px) minmax(0,1fr) 42px;align-items:center;gap:12px}
.school-site-body .p441-area-name{font-weight:700;color:#2f5d50;overflow-wrap:anywhere}
.school-site-body .p441-area-track{height:16px;border-radius:999px;background:#eaf3ee;overflow:hidden}
.school-site-body .p441-area-track i{display:block;height:100%;width:var(--p441-fill);transform-origin:left center;transform:scaleX(0);transition:transform .8s cubic-bezier(.2,.8,.2,1);background:linear-gradient(90deg,var(--p441-primary),color-mix(in srgb,var(--p441-primary) 60%,white));border-radius:999px}
.school-site-body .p441-area-row.is-visible .p441-area-track i{transform:scaleX(1)}
.school-site-body .p441-area-row strong{font-weight:800;color:#114b37;text-align:right}
.school-site-body .p441-source-note{font-size:12px;line-height:1.7;color:#57766a;border-radius:14px;background:#eff7f1;padding:12px 13px;margin-top:auto}
.school-site-body .p441-empty{text-align:center;padding:58px 18px;color:#527368}.school-site-body .p441-empty i{font-size:35px;color:#76b7a0}.school-site-body .p441-empty p{margin:8px 0 0}
@media(max-width:1080px){.school-site-body .p441-detail-card:nth-child(1),.school-site-body .p441-detail-card:nth-child(2),.school-site-body .p441-detail-card:nth-child(3){grid-column:span 6}}
@media(max-width:780px){.school-site-body .p441-detail-card:nth-child(1),.school-site-body .p441-detail-card:nth-child(2),.school-site-body .p441-detail-card:nth-child(3){grid-column:1/-1}.school-site-body .p441-chart-card,.school-site-body .p441-detail-card{padding:18px}.school-site-body .p441-columns{gap:5px;grid-auto-columns:minmax(0,1fr)}.school-site-body .p441-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.school-site-body .p441-head-label{font-size:17px}.school-site-body .p441-year-list a,.school-site-body .p441-chart-switch button{padding:7px 11px}.school-site-body .p441-quick-stats{width:100%}.school-site-body .p441-quick-stats span{padding:7px 10px}.school-site-body .p441-chart-card-head h3,.school-site-body .p441-card-head h3{font-size:19px}.school-site-body .p441-chart-panel{padding:12px 7px}.school-site-body .p441-columns{height:218px;gap:2px;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);grid-template-columns:none}.school-site-body .p441-bar-value{font-size:10px;margin-bottom:7px}.school-site-body .p441-bar-label{font-size:9px;min-height:20px;margin-top:7px}.school-site-body .p441-bar-stage{height:160px}.school-site-body .p441-bar{width:clamp(5px,2.15vw,12px)}.school-site-body .p441-horizontal-row{grid-template-columns:56px minmax(0,1fr) 36px;gap:8px;padding:10px 12px}.school-site-body .p441-gender{justify-content:flex-start}.school-site-body .p441-area-row{grid-template-columns:minmax(68px,96px) minmax(0,1fr) 36px;gap:8px}.school-site-body .p441-summary-grid{grid-template-columns:1fr}}


/* P008: a single continuous plot replaces the per-grade mini-cards. */
.school-site-body .p441-columns::before{content:"";position:absolute;inset:36px 0 31px;z-index:0;pointer-events:none;background:linear-gradient(to bottom,transparent 24.75%,rgba(25,102,77,.11) 25%,transparent 25.25%,transparent 49.75%,rgba(25,102,77,.11) 50%,transparent 50.25%,transparent 74.75%,rgba(25,102,77,.11) 75%,transparent 75.25%,transparent 99.5%,rgba(25,102,77,.22) 100%)}
.school-site-body .p441-column:hover .p441-bar{filter:brightness(1.09);box-shadow:0 10px 23px rgba(3,100,70,.25)}
.school-site-body .p441-column:hover .p441-bar-value{color:var(--p441-primary);transform:translateY(-2px)}
.school-site-body .p441-students[data-chart="horizontal"] .p441-columns::before{display:none}
@media(max-width:560px){.school-site-body .p441-columns::before{inset:31px 0 24px}}
@media(prefers-reduced-motion:reduce){.school-site-body .p441-column,.school-site-body .p441-bar,.school-site-body .p441-bar-value{transition:none!important}}

/* CMS admin page */
.p441-admin{max-width:1200px;margin:0 auto;color:#133f34;font-family:Sarabun,'Noto Sans Thai',sans-serif}.p441-admin *{box-sizing:border-box}
.p441-admin-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:8px 0 20px;flex-wrap:wrap}.p441-admin-top span{font-weight:800;letter-spacing:.08em;font-size:11px;color:#0b9067}.p441-admin-top h2{font-size:30px;color:#144c3c;margin:3px 0}.p441-admin-top p{font-size:14px;color:#617a70;margin:0}
.p441-admin a{text-decoration:none}.p441-view,.p441-admin-years a,.p441-admin button{transition:all .15s ease}
.p441-admin .p441-view{border-radius:12px;padding:11px 17px;background:#0b644c;color:white;font-weight:750;white-space:nowrap}.p441-admin .p441-view:hover{background:#084834}
.p441-admin-card{background:#fff;border:1px solid #daebe1;box-shadow:0 7px 24px rgba(24,82,57,.05);border-radius:18px;padding:22px;margin-bottom:17px}
.p441-admin-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px}.p441-admin-card-head h3{font-size:19px;margin:0;color:#124c3c;display:flex;gap:9px;align-items:center}.p441-admin-card-head h3 i{color:#0b8e62}.p441-admin-card-head .p441-subtle{font-size:12px;color:#678478}
.p441-status{font-size:12px;color:#067e58;background:#ecf7f0;padding:7px 12px;border-radius:30px;font-weight:800}.p441-admin-years{display:flex;gap:8px;flex-wrap:wrap}.p441-admin-years a{color:#146047;background:#f0f7f2;border:1px solid #cfe6d8;padding:8px 13px;border-radius:10px;font-weight:700}.p441-admin-years a.active,.p441-admin-years a:hover{color:#fff;background:#116649;border-color:#116649}
.p441-new-year{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:17px}.p441-new-year label{font-weight:750;font-size:13px}.p441-new-year input{width:112px}.p441-admin input:not([type=color]),.p441-admin select{padding:10px 12px;border:1px solid #ccdcd3;border-radius:10px;background:#fff;color:#194b3a;min-width:0;font:inherit}.p441-admin input:focus,.p441-admin select:focus{outline:2px solid #73c7a1;outline-offset:1px}
.p441-admin button{border:0;background:#0d674a;color:#fff;padding:11px 16px;border-radius:10px;cursor:pointer;font:700 14px Sarabun,sans-serif}.p441-admin button:hover{background:#084e39}
.p441-notice{border-radius:12px;padding:13px 16px;margin:10px 0 15px;font-weight:750}.p441-notice.success{background:#e4f7e9;color:#126440}.p441-notice.error{background:#fff0f0;color:#a32929}
.p441-admin-help{color:#607d70;font-size:13px;margin-bottom:14px}.p441-data-table-wrap{width:100%;overflow-x:auto}.p441-data-table{width:100%;border-collapse:separate;border-spacing:0 7px;min-width:660px}.p441-data-table th{text-align:left;color:#537467;font-size:13px;padding:4px 8px}.p441-data-table th:not(:first-child),.p441-data-table td:not(:first-child){text-align:center}.p441-data-table td{padding:5px 6px;background:#f5f9f6}.p441-data-table td:first-child{border-radius:10px 0 0 10px}.p441-data-table td:last-child{border-radius:0 10px 10px 0}.p441-data-table td:first-child input{width:100%;min-width:130px}.p441-data-table td input[type=number]{width:94px;max-width:100%;text-align:center}.p441-data-table .p441-row-total{display:inline-block;min-width:44px;color:#095e42}.p441-admin .p441-remove-row{background:#fff0f0;color:#b93939;padding:9px 10px}.p441-admin .p441-remove-row:hover{background:#fbdada}
.p441-row-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.p441-admin .p441-add-row{background:#e3f5eb;color:#076345}.p441-admin .p441-add-row:hover{background:#ccefdc}.p441-admin .p441-import{background:#edf3f9;color:#195c86}.p441-admin .p441-import:hover{background:#dceafa}.p441-current-count{background:#0c634c;color:white;padding:8px 15px;font-size:14px;font-weight:800;border-radius:12px}
.p441-config-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.p441-config-grid label{display:flex;flex-direction:column;gap:8px;font-weight:750;font-size:13px}.p441-colors{display:flex;gap:23px;flex-wrap:wrap;margin-top:22px}.p441-colors label{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:750}.p441-colors input{height:41px;width:64px;background:white;border:1px solid #d5e5da;border-radius:9px;cursor:pointer;padding:3px}
.p441-admin-preview{border-radius:13px;border:1px solid #e4eee8;background:#f5faf7;margin-top:19px;padding:15px}.p441-admin-preview>span{font-size:12px;color:#627b6e}.p441-preview-bars{--p441-primary:#087d59;--p441-secondary:#e891a8;--p441-accent:#d6a83b;height:96px;display:flex;align-items:end;justify-content:center;gap:15px;margin-top:5px}.p441-preview-bars i{display:block;width:38px;height:65%;background:linear-gradient(180deg,color-mix(in srgb,var(--p441-primary) 65%,white),var(--p441-primary));border-radius:10px 10px 0 0}.p441-preview-bars i:nth-child(2){height:85%}.p441-preview-bars i:nth-child(3){height:45%;background:var(--p441-secondary)}.p441-preview-bars i:nth-child(4){height:100%}.p441-preview-bars i:nth-child(5){height:58%;background:var(--p441-accent)}.p441-preview-bars[data-shape=square] i{border-radius:0}.p441-preview-bars[data-finish=flat] i{background:var(--p441-primary)}.p441-preview-bars[data-finish=flat] i:nth-child(3){background:var(--p441-secondary)}.p441-preview-bars[data-finish=flat] i:nth-child(5){background:var(--p441-accent)}
.p441-save-bar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:22px 0;flex-wrap:wrap}.p441-save-bar a{color:#547267;font-weight:750}.p441-admin .p441-save-bar button{font-size:16px;padding:13px 22px;background:#096c4b}.p441-admin .p441-restore button{background:transparent;color:#9a5d30;border:1px solid #e7d9cb;margin-bottom:25px}.p441-admin .p441-restore button:hover{background:#fff3e9}
@media(max-width:700px){.p441-admin-top h2{font-size:25px}.p441-admin-card{padding:16px}.p441-config-grid{grid-template-columns:1fr}.p441-colors{gap:12px}.p441-save-bar button{width:100%}.p441-admin .p441-new-year input{width:100px}}