@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap');

:root{--ink:#11174f;--muted:#646b8b;--line:#e7e8f3;--surface:#fff;--purple:#6750ed;--shadow:0 18px 50px rgba(43,45,116,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:"Noto Sans Thai",Tahoma,sans-serif;background:#f6f7fd}button,input{font:inherit}button{color:inherit}a{color:inherit;text-decoration:none}.skip-link{position:fixed;z-index:99;top:10px;left:10px;padding:10px 18px;border-radius:8px;background:#11174f;color:#fff;transform:translateY(-150%)}.skip-link:focus{transform:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.topbar{height:88px;max-width:1180px;margin:auto;padding:0 30px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;color:#fff;font:800 22px "Plus Jakarta Sans";background:linear-gradient(145deg,#714bf1,#36a9f2);box-shadow:0 9px 20px rgba(91,74,225,.24)}.brand strong,.brand small{display:block}.brand strong{font:800 16px "Plus Jakarta Sans"}.brand small{margin-top:2px;font-size:11px;color:var(--muted)}.back-link{padding:10px 17px;border:1px solid var(--line);border-radius:30px;background:#fff;font-size:14px;font-weight:600;transition:.2s}.back-link:hover{border-color:#aea5f4;transform:translateX(-2px)}
main{max-width:1180px;margin:auto;padding:0 30px 70px}.hero{position:relative;min-height:360px;border-radius:30px;padding:66px;display:flex;align-items:center;justify-content:space-between;overflow:hidden;color:#fff;background:radial-gradient(circle at 82% 30%,rgba(255,255,255,.18) 0 90px,transparent 91px),linear-gradient(130deg,#171951 0%,#5b43df 58%,#39a9ed 100%);box-shadow:0 24px 60px rgba(49,45,140,.22)}.hero:after{content:"";position:absolute;right:-40px;bottom:-130px;width:450px;height:300px;border:1px solid rgba(255,255,255,.2);border-radius:50%;transform:rotate(-13deg)}.hero-copy{position:relative;z-index:1;max-width:650px}.eyebrow,.section-label{margin:0 0 12px;font:700 11px "Plus Jakarta Sans";letter-spacing:1.8px}.eyebrow{display:flex;align-items:center;gap:10px;color:#d9d7ff}.eyebrow span{width:25px;height:2px;background:#6cdbf4}.hero h1{margin:0;font-size:48px;line-height:1.25;letter-spacing:-1.5px}.hero h1 em{font-style:normal;color:#8ee8f7}.hero-copy>p:last-child{max-width:570px;margin:20px 0 0;color:#e2e3fb;font-size:17px;line-height:1.8}.hero-stat{position:relative;z-index:1;flex:0 0 185px;min-height:185px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(255,255,255,.1);backdrop-filter:blur(12px)}.hero-stat span,.hero-stat small{font-size:12px;color:#e7e8ff}.hero-stat strong{font:800 54px "Plus Jakarta Sans";line-height:1.1;margin:5px 0}
.finder,.units,.results{margin-top:34px}.finder{position:relative;padding:35px 40px;border-radius:24px;background:#fff;box-shadow:var(--shadow)}.finder-heading,.section-heading,.results-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.section-label{color:#6b51eb}.finder h2,.section-heading h2,.results-heading h2{margin:0;font-size:27px}.finder-heading>p{max-width:390px;margin:0;color:var(--muted);font-size:14px;line-height:1.7}.search-box{height:62px;margin-top:25px;padding:0 18px;display:flex;align-items:center;gap:12px;border:2px solid #e5e6f2;border-radius:16px;background:#fafaff;transition:.2s}.search-box:focus-within{border-color:#7866ee;box-shadow:0 0 0 4px rgba(103,80,237,.1);background:#fff}.search-box>span:first-child{font-size:30px;color:#6750ed;transform:rotate(-15deg)}.search-box input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:16px}.search-box input::placeholder{color:#9b9fb7}.search-box kbd{padding:4px 7px;border:1px solid #dddfea;border-radius:6px;color:#888da6;background:#fff;font:600 10px "Plus Jakarta Sans"}
.clear-button{border:0;background:transparent;color:#6049e5;font-weight:700;cursor:pointer}.clear-button:hover{text-decoration:underline}.unit-grid{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.unit-card{position:relative;min-height:148px;padding:18px;text-align:left;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s}.unit-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.unit-card[aria-pressed="true"]{border-color:var(--tone);box-shadow:0 0 0 3px color-mix(in srgb,var(--tone) 18%,transparent),var(--shadow)}.unit-card:after{content:"";position:absolute;right:-42px;top:-50px;width:100px;height:100px;border-radius:50%;background:var(--soft)}.unit-card.purple{--tone:#6a4bea;--soft:#eeeaff}.unit-card.blue{--tone:#168edb;--soft:#e5f5ff}.unit-card.green{--tone:#0b9d82;--soft:#e2f8f1}.unit-card.orange{--tone:#e37532;--soft:#fff0e5}.unit-icon{position:relative;z-index:1;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#fff;background:var(--tone);font-size:21px}.unit-number{position:absolute;right:16px;top:15px;z-index:1;color:var(--tone);font:800 11px "Plus Jakarta Sans"}.unit-card strong{position:relative;z-index:1;display:block;margin-top:15px;font-size:15px;line-height:1.45}
.results{padding:38px 40px;border-radius:24px;background:#fff;box-shadow:var(--shadow)}.result-count{padding:7px 14px;border-radius:30px;background:#f0edff;color:#5d45df;font-size:13px}.form-list{margin-top:20px}.form-row{display:grid;grid-template-columns:55px minmax(0,1fr) auto;gap:18px;align-items:center;padding:19px 8px;border-top:1px solid var(--line)}.file-icon{width:50px;height:54px;border-radius:12px;display:grid;place-items:center;color:#fff;background:var(--tone);font:800 11px "Plus Jakarta Sans";box-shadow:0 8px 18px color-mix(in srgb,var(--tone) 25%,transparent)}.form-info h3{margin:0;font-size:16px}.form-info p{margin:5px 0 0;color:var(--muted);font-size:13px}.form-meta{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:8px}.form-meta span{font-size:11px;color:#81869e}.tag{padding:3px 8px;border-radius:20px;background:var(--soft);color:var(--tone)!important;font-weight:700}.download{min-width:118px;padding:11px 15px;border:1px solid #dfe0ec;border-radius:12px;text-align:center;font-size:13px;font-weight:700;transition:.2s}.download:hover{color:#fff;border-color:var(--tone);background:var(--tone)}.form-row[data-unit="dorm"]{--tone:#6a4bea;--soft:#eeeaff}.form-row[data-unit="welfare"]{--tone:#168edb;--soft:#e5f5ff}.form-row[data-unit="learning"]{--tone:#0b9d82;--soft:#e2f8f1}.form-row[data-unit="admin"]{--tone:#e37532;--soft:#fff0e5}.empty-state{text-align:center;padding:45px 20px}.empty-state>span{font-size:52px;color:#7866ee}.empty-state h3{margin:8px 0}.empty-state p{color:var(--muted)}.empty-state button{padding:9px 18px;border:0;border-radius:20px;color:#fff;background:#6750ed;cursor:pointer}
footer{max-width:1180px;margin:0 auto 30px;padding:30px 40px;border-radius:24px;display:flex;justify-content:space-between;align-items:center;color:#fff;background:#15184d}footer strong{font-size:20px}footer p{margin:4px 0 0;color:#bec1dc;font-size:13px}footer a{padding:12px 19px;border-radius:30px;background:#fff;color:#15184d;font-weight:700}footer a span{margin-left:10px}
@media(max-width:900px){.unit-grid{grid-template-columns:repeat(2,1fr)}.hero{padding:50px}.hero h1{font-size:40px}.hero-stat{flex-basis:160px;min-height:160px}}
@media(max-width:640px){.topbar{height:72px;padding:0 18px}.brand small{display:none}.back-link{padding:9px 12px;font-size:12px}main{padding:0 14px 45px}.hero{min-height:390px;padding:38px 27px;display:block;border-radius:22px}.hero h1{font-size:34px}.hero-copy>p:last-child{font-size:15px}.hero-stat{width:120px;min-height:120px;margin-top:25px;border-radius:20px;align-items:flex-start;padding-left:18px}.hero-stat strong{font-size:38px}.finder,.results{padding:28px 20px}.finder-heading{display:block}.finder-heading>p{margin-top:12px}.search-box kbd{display:none}.section-heading,.results-heading{align-items:center}.unit-grid{grid-template-columns:1fr}.unit-card{min-height:116px}.form-row{grid-template-columns:48px 1fr;padding:17px 0}.file-icon{width:44px;height:48px}.download{grid-column:1/-1;width:100%}.form-meta{justify-content:flex-start;flex-wrap:wrap}footer{margin:0 14px 18px;padding:27px 22px;display:block}footer a{display:inline-block;margin-top:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.unit-card,.back-link,.download{transition:none}}
.unit-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.unit-card.pink{--tone:#c94da5;--soft:#fce8f6}.form-row[data-unit="SPD"]{--tone:#6a4bea;--soft:#eeeaff}.form-row[data-unit="SCS"]{--tone:#168edb;--soft:#e5f5ff}.form-row[data-unit="ALS"]{--tone:#e37532;--soft:#fff0e5}.form-row[data-unit="SWP"]{--tone:#0b9d82;--soft:#e2f8f1}.form-row[data-unit="PAC"]{--tone:#c94da5;--soft:#fce8f6}@media(max-width:1100px){.unit-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.unit-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.unit-grid{grid-template-columns:1fr}}