@import"https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap";:root{--mu-blue:#0035AD;--mu-yellow:#FFC726;--mu-gold:#AA800E;--mu-lightblue:#87CEEB;--c-primary:var(--mu-blue);--c-primary-700:#00267D;--c-primary-50:#EBF1FF;--c-primary-100:#D6E2FF;--c-accent:var(--mu-yellow);--c-accent-50:#FFF6D6;--c-gold-text:#7A5B00;--c-ink:#0B1F4D;--c-ink-2:#4A5675;--c-line:#E3E8F2;--c-bg:#F5F7FC;--c-surface:#FFFFFF;--lv-green-bg:#E3F6EC;--lv-green-fg:#14663A;--lv-yellow-bg:#FFF6D6;--lv-yellow-fg:#6B4E00;--lv-care-bg:#EEEAFE;--lv-care-fg:#4C2A9E;--st-red:#B42318;--st-red-50:#FEEDEB;--st-yellow:#B58100;--st-green:#15803D;--c-sos:#C2410C;--fs-xs:12px;--fs-sm:14px;--fs-md:16px;--fs-lg:18px;--fs-xl:22px;--fs-2xl:28px;--fs-3xl:40px;--lh:1.6;--s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:32px;--s6:40px;--s7:48px;--r-sm:12px;--r-md:20px;--r-lg:28px;--r-pill:999px;--shadow:0 4px 16px rgba(11,31,77,.06);--tap:48px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Noto Sans Thai,IBM Plex Sans Thai,sans-serif;font-size:var(--fs-md);line-height:var(--lh);color:var(--c-ink);background:#dfe4ee}.phone{width:390px;min-height:844px;margin:0 auto;background:var(--c-bg);position:relative;padding-bottom:96px;overflow:hidden}.teen .phone{background:radial-gradient(120% 40% at 100% 0,#FFF1BF 0,transparent 60%),var(--c-bg)}.top{display:flex;align-items:center;gap:var(--s2);padding:var(--s3);padding-top:var(--s5);min-height:88px}.top h1{font-size:var(--fs-xl);font-weight:700;flex:1;line-height:1.4}.back{width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:22px;box-shadow:var(--shadow);flex:none}.demo{position:absolute;top:6px;left:16px;font-size:var(--fs-xs);background:var(--c-ink);color:#fff;padding:0 8px;border-radius:var(--r-pill);z-index:9}.wrap{padding:0 var(--s3)}.card{background:var(--c-surface);border-radius:var(--r-md);padding:var(--s3);box-shadow:var(--shadow);margin-bottom:var(--s2)}.h2{font-size:var(--fs-xl);font-weight:700;line-height:1.45}.h3{font-size:var(--fs-lg);font-weight:600;line-height:1.5}.key{font-size:var(--fs-2xl);font-weight:700;line-height:1.3}.big{font-size:var(--fs-3xl);font-weight:700;line-height:1.25}.muted{color:var(--c-ink-2);font-size:var(--fs-sm)}.sec{font-size:var(--fs-sm);font-weight:600;color:var(--c-ink-2);margin:var(--s3) 0 var(--s2)}.btn{display:flex;align-items:center;justify-content:center;gap:var(--s2);min-height:56px;padding:0 var(--s4);border-radius:var(--r-pill);font:600 var(--fs-lg)/1.4 inherit;font-family:inherit;border:0;width:100%}.btn-primary{background:var(--c-primary);color:#fff}.teen .btn-primary{background:var(--mu-yellow);color:var(--c-ink)}.btn-ghost{background:var(--c-primary-50);color:var(--c-primary)}.btn-line{background:#fff;color:var(--c-ink);border:1.5px solid var(--c-line)}.btn-sm{min-height:44px;font-size:var(--fs-md);width:auto;padding:0 var(--s3)}.chip{display:inline-flex;align-items:center;gap:4px;min-height:32px;padding:0 12px;border-radius:var(--r-pill);font-size:var(--fs-sm);font-weight:600;background:var(--c-primary-50);color:var(--c-primary)}.chip.on{background:var(--c-primary);color:#fff}.row{display:flex;align-items:center;gap:var(--s2)}.between{justify-content:space-between}.wrapr{flex-wrap:wrap}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2)}.tile{background:#fff;border-radius:var(--r-md);padding:var(--s3) var(--s2);text-align:center;box-shadow:var(--shadow);min-height:104px;font-size:var(--fs-sm);font-weight:600;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.tile .ic{font-size:32px;line-height:1.3}.bar{height:8px;background:var(--c-primary-100);border-radius:4px;overflow:hidden}.bar>i{display:block;height:100%;background:var(--c-primary);border-radius:4px}.teen .bar>i{background:linear-gradient(90deg,var(--c-primary),#4C7DFF)}.ico{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font-size:24px;background:var(--c-primary-50);flex:none}.list>div{display:flex;align-items:center;gap:12px;min-height:56px;padding:var(--s2) 0;border-bottom:1px solid var(--c-line)}.list>div:last-child{border:0}.grow{flex:1;min-width:0}.sos{position:absolute;right:16px;bottom:88px;width:64px;height:64px;border-radius:50%;background:var(--c-sos);color:#fff;font-weight:700;display:grid;place-items:center;box-shadow:0 6px 16px #c2410c59}.nav{position:absolute;bottom:0;left:0;right:0;height:72px;background:#fff;border-top:1px solid var(--c-line);display:flex;justify-content:space-around;align-items:center}.nav a{display:flex;flex-direction:column;align-items:center;font-size:var(--fs-xs);color:var(--c-ink-2);min-width:56px;min-height:48px;justify-content:center}.nav a b{font-size:22px;font-weight:400;line-height:1.2}.nav a.on{color:var(--c-primary);font-weight:700}.dot{width:12px;height:12px;border-radius:50%;flex:none}.input{min-height:var(--tap);border:1.5px solid var(--c-line);border-radius:var(--r-sm);padding:10px var(--s3);background:#fff;width:100%;color:var(--c-ink)}.lb{display:block;font-size:var(--fs-sm);font-weight:600;margin:var(--s3) 0 var(--s2)}.cta{position:absolute;left:0;right:0;bottom:0;padding:var(--s3) var(--s3) var(--s4);background:linear-gradient(transparent,var(--c-bg) 35%)}.hero{background:linear-gradient(135deg,#00267d,#0035ad 55%,#3a6bff);color:#fff;border-radius:var(--r-lg);padding:var(--s4);margin-bottom:var(--s3);position:relative;overflow:hidden}.hero:after{content:"";position:absolute;right:-40px;top:-40px;width:160px;height:160px;border-radius:50%;background:#ffc72647}.opt{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 var(--s3);border-radius:var(--r-md);background:#fff;box-shadow:var(--shadow);margin-bottom:var(--s2);font-size:var(--fs-lg);font-weight:500}.opt.sel{outline:2px solid var(--c-primary);background:var(--c-primary-50)}:root{--c-teal:#14B8A6;--c-teal-50:#E6FAF7;--c-bg:#FAFAF7}body{background:#eef1f6}.phone{width:100%;max-width:480px;min-height:100vh}.nav,.cta{position:fixed;left:50%;transform:translate(-50%);width:100%;max-width:480px}.sos{position:fixed;right:max(16px,calc(50% - 224px));cursor:pointer;border:0;font:700 16px inherit;font-family:inherit}.teen .hero{background:linear-gradient(135deg,#0035ad,#0e7c9e 60%,#14b8a6)}.teen .tile .ic{color:var(--c-teal)}.teen .bar>i{background:linear-gradient(90deg,var(--c-primary),var(--c-teal))}.teal{background:var(--c-teal-50);color:#0f766e}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit}textarea.input{min-height:72px}.lv{white-space:nowrap;flex-shrink:0;padding:2px 10px;border-radius:999px;font-size:13px;font-weight:600}.lv-green{background:var(--lv-green-bg);color:var(--lv-green-fg)}.lv-yellow{background:var(--lv-yellow-bg);color:var(--lv-yellow-fg)}.lv-red,.lv-care{background:var(--lv-care-bg);color:var(--lv-care-fg)}.lv-staff-red{background:var(--st-red-50);color:var(--st-red)}.mb{margin-bottom:12px}.mt{margin-top:12px}@media print{.nav,.sos,.noprint{display:none!important}}.bell{position:fixed;top:10px;right:max(10px,calc(50% - 205px));z-index:30;font-size:22px;cursor:pointer;background:#fff;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0002}.bell .badge{position:absolute;top:-4px;right:-4px;background:var(--c-sos,#e11);color:#fff;font-size:11px;border-radius:9px;padding:1px 5px}.notifs{position:fixed;top:56px;right:max(10px,calc(50% - 205px));z-index:30;width:300px;max-height:60vh;overflow:auto}.score .big{text-align:center;margin:8px 0}.vph{background:#0f172a;color:#fff;border-radius:12px;padding:40px 16px;text-align:center;cursor:pointer}.tbl{width:100%;border-collapse:collapse;font-size:12px}.tbl th,.tbl td{border-bottom:1px solid #e5e7eb;padding:4px;text-align:left}@media print{.nav,.sos,.bell,.noprint,.back{display:none!important}.phone{max-width:none!important}}.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--c-bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);margin:0 -16px 12px;padding:10px 60px 10px 16px}.top h1{font-size:20px;letter-spacing:-.2px}.card{border:1px solid #E6EBF5;transition:transform .12s}.tile:active,.opt:active,.card.row:active{transform:scale(.98)}.hello{display:flex;align-items:center;gap:10px;margin:4px 52px 14px 0}.hello b{font-size:20px;flex:1}.hello .av{width:44px;height:44px;border-radius:14px;background:#fff4d1;display:flex;align-items:center;justify-content:center;font-size:24px}.hello .pts{background:#e8eefb;color:var(--mu-blue);font-weight:700;border-radius:999px;padding:4px 12px}.hero .moods{display:flex;justify-content:space-between;font-size:34px;margin:14px 0}.hero .moods a{cursor:pointer;transition:transform .1s}.hero .moods a:hover{transform:scale(1.15)}.hero .btn{margin-top:4px}.wrap>.hero{margin-bottom:14px}.tile .ic{width:52px;height:52px;margin:0 auto 6px;border-radius:16px;background:var(--c-teal-50);display:flex;align-items:center;justify-content:center;font-size:28px}.opt{border:1.5px solid #E6EBF5;font-size:16px;padding:14px 16px}.opt.on,.opt:hover{border-color:var(--c-teal);background:var(--c-teal-50)}.card.day{padding:12px}.card.day .sec{margin-top:0}.kpi{border-top:3px solid var(--c-teal)}.kpi .key{color:var(--mu-blue);font-size:26px}.empty{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:36px 20px;background:#fff;border:1.5px dashed #D5DEEE;border-radius:var(--r-lg,20px);color:var(--c-ink)}.empty span{font-size:42px}.empty small{color:#64748b;max-width:260px}.wrap:has(>.top:only-child):after{content:"กำลังโหลด…";display:block;height:120px;border-radius:16px;margin-top:8px;color:#64748b;padding:16px;background:linear-gradient(90deg,#eef2f9 25%,#f8faff,#eef2f9 75%);background-size:200% 100%;animation:sk 1.2s infinite}@keyframes sk{to{background-position:-200% 0}}.nav a.on b{transform:translateY(-2px)}.nav a{transition:color .15s}.pv{margin:16px auto;max-width:320px;border:8px solid #0B1F4D;border-radius:32px;overflow:hidden;background:var(--c-bg)}.pvh{background:#0b1f4d;color:#fff;font-size:12px;text-align:center;padding:2px 0 6px}.pvb{padding:12px;max-height:440px;overflow:auto;font-size:14px}.pvb .card{padding:10px;margin-bottom:8px}fieldset:disabled .btn{opacity:.5}