:root{--c-bg:#f7f7f5;--c-surface:#ffffff;--c-surface-2:#f1f1ee;--c-line:#e6e6e1;--c-line-2:#d4d4cd;--c-text:#1b1b18;--c-muted:#6b6b63;--c-faint:#a3a39a;--c-brand:#2E7D4F;--c-brand-hover:#266A43;--c-brand-ink:#ffffff;--accent-soft:#E7F2EA;--accent-ink:#1E5A38;--c-ok:#2e7d32;--c-ok-bg:#d1fae5;--c-warn:#8a5a00;--c-warn-bg:#fef3c7;--c-danger:#c0392b;--c-danger-bg:#fee2e2;--c-info:#1d4ed8;--c-info-bg:#dbeafe;--pri-urgent:#C4453C;--pri-high:#C98F2B;--pri-normal:#4A7FB5;--pri-low:#98A094;--st-queue:#87909E;--st-doing:#3E82F7;--st-review:#E6A23C;--st-done:#6BC950;--sh-1:0 1px 2px rgba(27,27,24,.06);--sh-2:0 4px 12px rgba(27,27,24,.1);--sh-3:0 16px 40px rgba(27,27,24,.18);--focus:0 0 0 3px rgba(46,125,79,.32);--ev:#0E8C8C;--ship:#B26A1B;--pay:#1E5A38;--leave:#8a5a00;--leave-bg:#fef3c7;--hol:#9f1239;--hol-bg:#fde2e4;--k1:#2E7D4F;--k2:#4A7FB5;--k3:#B26A1B;--k4:#8E5AC8;--k5:#98A094;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--r-sm:6px;--r:10px;--r-lg:14px;--r-pill:999px;--tap:48px;--h-btn-sm:30px;--h-btn:36px;--h-btn-lg:48px;--h-row:40px;--h-row-phone:60px;--w-side:264px;--w-side-mini:64px;--w-panel:420px;--h-topbar:52px;--h-appbar:56px;--h-tabbar:72px;--font:system-ui,"Noto Sans Thai",sans-serif;--fs-display:32px;--fs-h1:24px;--fs-h2:20px;--fs-h3:16px;--fs-body:16px;--fs-small:14px;--fs-cap:12px}:root[data-theme=dark]{--c-bg:#141513;--c-surface:#1d1e1b;--c-surface-2:#272825;--c-line:#30312d;--c-line-2:#41423d;--c-text:#ecece6;--c-muted:#a6a69c;--c-faint:#75756d;--c-brand:#3E9A64;--c-brand-hover:#4AAB72;--c-brand-ink:#0b1a10;--accent-soft:#1c2f22;--accent-ink:#93D6AB;--c-ok:#7CD48C;--c-ok-bg:#163523;--c-warn:#F2C96B;--c-warn-bg:#3a2d0e;--c-danger:#F08C82;--c-danger-bg:#3e1d1a;--c-info:#93B8F5;--c-info-bg:#182b4a;--pri-urgent:#E0655C;--pri-high:#DEA84A;--pri-normal:#6C9CD1;--pri-low:#8E968A;--st-queue:#8F98A6;--st-doing:#5A95F5;--st-review:#EAB25A;--st-done:#79CF60;--sh-1:0 1px 2px rgba(0,0,0,.4);--sh-2:0 4px 12px rgba(0,0,0,.45);--sh-3:0 16px 40px rgba(0,0,0,.6);--focus:0 0 0 3px rgba(62,154,100,.45);--ev:#3DB7B7;--ship:#DEA84A;--pay:#93D6AB;--leave:#F2C96B;--leave-bg:#3a2d0e;--hol:#F5A3B0;--hol-bg:#3f1f25;--k1:#5FB27F;--k2:#7FA6D6;--k3:#DEA84A;--k4:#B08AE0;--k5:#8E968A}*{box-sizing:border-box}body{margin:0;background:var(--c-bg);color:var(--c-text);font:var(--fs-body)/1.6 var(--font)}.num{font-variant-numeric:tabular-nums}.muted{color:var(--c-muted)}.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}h1,h2,h3,p{margin:0}a{color:var(--accent-ink);text-decoration:none}.i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}.i.s{width:16px;height:16px}.i.l{width:22px;height:22px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--h-btn);padding:0 14px;border-radius:8px;border:1px solid transparent;font:inherit;font-size:14px;font-weight:500;line-height:1;cursor:pointer;background:var(--c-surface-2);color:var(--c-text);white-space:nowrap;text-decoration:none}.btn:hover{background:var(--c-line)}.btn:focus-visible{outline:none;box-shadow:var(--focus)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--c-brand);color:var(--c-brand-ink)}.btn.primary:hover{background:var(--c-brand-hover)}.btn.outline{background:var(--c-surface);border-color:var(--c-line-2)}.btn.outline:hover{background:var(--c-surface-2)}.btn.ghost{background:transparent;color:var(--c-muted)}.btn.ghost:hover{background:var(--c-surface-2);color:var(--c-text)}.btn.danger{background:var(--c-danger-bg);color:var(--c-danger)}.btn.sm{height:var(--h-btn-sm);padding:0 10px;font-size:13px;border-radius:var(--r-sm)}.btn.lg{height:var(--h-btn-lg);padding:0 22px;font-size:16px;border-radius:var(--r)}.btn.icon{width:var(--h-btn);padding:0}.btn.icon.sm{width:var(--h-btn-sm)}.side-top>.btn{width:var(--h-btn-sm);height:var(--h-btn-sm);padding:0;background:transparent;color:var(--c-muted);border-radius:var(--r-sm)}.side-top>.btn:hover{background:var(--c-surface-2);color:var(--c-text)}.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);font-weight:600;font-size:13px;display:inline-flex;align-items:center;justify-content:center;flex:none}.avatar.sm{width:24px;height:24px;font-size:11px}.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:var(--r-pill);font-size:12px;font-weight:500;line-height:1;background:var(--c-surface-2);color:var(--c-text);white-space:nowrap}.chip.view{height:28px;font-size:13px;border:1px solid var(--c-line);background:var(--c-surface);cursor:pointer;font-family:inherit}.chip.view.on{background:var(--accent-soft);color:var(--accent-ink);border-color:transparent}.chip.ok{background:var(--c-ok-bg);color:var(--c-ok)}.chip.warn{background:var(--c-warn-bg);color:var(--c-warn)}.chip.danger{background:var(--c-danger-bg);color:var(--c-danger)}.chip.info{background:var(--c-info-bg);color:var(--c-info)}.card{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r)}.card-h{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--c-line)}.card-h h2{font-size:15px;font-weight:600;line-height:1.4;flex:1}.tile{display:flex;flex-direction:column;gap:2px;padding:14px 16px}.tile .v{font-size:26px;font-weight:600;line-height:1.2;letter-spacing:-.01em}.badge{min-width:20px;height:20px;padding:0 6px;border-radius:var(--r-pill);background:var(--c-brand);color:var(--c-brand-ink);font-size:11px;font-weight:600;display:inline-flex;align-items:center;justify-content:center}.input{display:flex;align-items:center;gap:8px;min-height:var(--h-btn);padding:0 10px;border:1px solid var(--c-line-2);border-radius:8px;background:var(--c-surface);color:var(--c-text);font:inherit;width:100%}.input:focus-within{border-color:var(--c-brand);box-shadow:var(--focus)}.input input{flex:1;border:0;background:transparent;font:inherit;color:inherit;outline:none;min-width:0;padding:0}.logo{width:28px;height:28px;border-radius:7px;background:var(--c-brand);color:var(--c-brand-ink);font-weight:700;font-size:13px;display:inline-flex;align-items:center;justify-content:center;flex:none}.app{display:flex;height:100dvh;background:var(--c-bg);color:var(--c-text)}.app-col{flex:1;min-width:0;display:flex;flex-direction:column}.content{flex:1;min-width:0;overflow:auto;padding:20px 24px;display:flex;flex-direction:column;gap:16px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.page-head h1{font-size:22px;font-weight:600;line-height:1.3}.boot{min-height:100dvh;display:flex;align-items:center;justify-content:center;color:var(--c-muted)}.side{width:var(--w-side);height:100%;flex:none;display:flex;flex-direction:column;background:var(--c-surface);border-right:1px solid var(--c-line);overflow:hidden;transition:width .18s ease}.side.mini{width:var(--w-side-mini);align-items:center}.side-top{display:flex;align-items:center;gap:10px;height:var(--h-topbar);padding:0 12px 0 14px;border-bottom:1px solid var(--c-line);flex:none}.side.mini .side-top{flex-direction:column;height:auto;padding:10px 0;gap:6px;width:100%;justify-content:center}.wordmark{flex:1;font-weight:600;font-size:14px}.side-scroll{flex:1;overflow:auto;padding:8px 0;width:100%}.side.mini .side-scroll{display:flex;flex-direction:column;align-items:center;gap:2px}.nav{position:relative;display:flex;align-items:center;gap:10px;height:36px;padding:0 10px;margin:1px 8px;border-radius:8px;color:var(--c-text);font:inherit;font-size:14px;font-weight:500;white-space:nowrap;cursor:pointer;background:transparent;border:0;width:calc(100% - 16px);text-align:left;text-decoration:none}.nav:hover{background:var(--c-surface-2);color:var(--c-text)}.nav.on{background:var(--accent-soft);color:var(--accent-ink)}.nav .lbl,.tn .lbl{flex:1;overflow:hidden;text-overflow:ellipsis}.side.mini .nav{width:48px;height:40px;justify-content:center;padding:0;gap:0;margin:0;color:var(--c-muted)}.side.mini .nav.on{color:var(--accent-ink)}.sec{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 4px;font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--c-muted);text-transform:uppercase}.tree{display:flex;flex-direction:column}.tn{display:flex;align-items:center;gap:8px;height:32px;padding:0 10px;margin:0 8px;border-radius:7px;font-size:13px;color:var(--c-text);white-space:nowrap;cursor:pointer;background:transparent;border:0;font-family:inherit;width:calc(100% - 16px);text-align:left}.tn:hover{background:var(--c-surface-2);color:var(--c-text)}.tn.on{background:var(--accent-soft);color:var(--accent-ink)}.lock{display:inline-flex;color:var(--c-muted)}.sq{width:18px;height:18px;border-radius:5px;background:var(--c-brand);color:#fff;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none}.side.mini .sq{width:22px;height:22px;border-radius:6px;font-size:11px}.sep{width:32px;height:1px;background:var(--c-line);margin:6px 0}.side-foot{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--c-line);flex:none;width:100%}.side.mini .side-foot{justify-content:center;padding:10px 0}.foot-txt{display:flex;flex-direction:column;min-width:0;line-height:1.3;flex:1}.foot-name{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis}.foot-role{font-size:12px}.badge.side-badge{margin-left:auto}.topbar{display:flex;align-items:center;gap:12px;height:var(--h-topbar);padding:0 16px;background:var(--c-surface);border-bottom:1px solid var(--c-line);flex:none}.crumb{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--c-muted);white-space:nowrap}.crumb-part{display:inline-flex;align-items:center;gap:4px}.crumb b{color:var(--c-text);font-weight:600;font-size:14px}.tabs{display:flex;align-items:center;gap:2px;height:var(--h-topbar)}.tab{display:inline-flex;align-items:center;gap:6px;height:var(--h-topbar);padding:0 10px;font:inherit;font-size:13px;font-weight:500;color:var(--c-muted);background:transparent;border:0;border-bottom:2px solid transparent;cursor:pointer}.tab:hover{color:var(--c-text)}.tab.on{color:var(--c-text);border-bottom-color:var(--c-brand)}.search{display:flex;align-items:center;gap:8px;height:34px;width:260px;padding:0 10px;border:1px solid var(--c-line-2);border-radius:8px;background:var(--c-bg);color:var(--c-muted);font-size:13px}.search input{flex:1;border:0;background:transparent;font:inherit;color:var(--c-text);min-width:0;outline:none}.kbd{font-size:11px;padding:1px 5px;border:1px solid var(--c-line-2);border-radius:4px;background:var(--c-surface);color:var(--c-muted);font-family:system-ui,sans-serif}.filterbar{display:flex;align-items:center;gap:8px;height:44px;padding:0 16px;background:var(--c-surface);border-bottom:1px solid var(--c-line);flex:none}.vsep{width:1px;height:20px;background:var(--c-line)}.row{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 16px;border-bottom:1px solid var(--c-line)}.empty{display:flex;flex-direction:column;align-items:center;gap:4px;padding:28px 16px;color:var(--c-muted);text-align:center;font-size:14px}.empty b{color:var(--c-text);font-weight:500}.checkin{display:flex;align-items:center;gap:16px;padding:16px 20px;border-color:var(--c-brand)}.checkin-ico{width:44px;height:44px;border-radius:10px;background:var(--accent-soft);color:var(--accent-ink);display:inline-flex;align-items:center;justify-content:center;flex:none}.checkin-txt{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.checkin-txt h2{font-size:17px;font-weight:600;line-height:1.4}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.home-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px;align-items:start}.home-col{display:flex;flex-direction:column;gap:16px}.days{display:flex;gap:4px;padding:12px 12px 14px}.day{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;padding:6px 0;border-radius:8px;font-size:12px;color:var(--c-muted)}.day .d{font-size:15px;font-weight:600;color:var(--c-text);line-height:1.2}.day.today{background:var(--c-brand);color:var(--c-brand-ink)}.day.today .d{color:var(--c-brand-ink)}.grp{font-size:12px;font-weight:600;color:var(--c-muted);letter-spacing:.03em;padding:4px 4px 0}.ntf{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--c-line);align-items:flex-start}.ntf.bot{background:color-mix(in srgb,var(--accent-soft) 45%,var(--c-surface));border-left:3px solid var(--c-brand);padding-left:13px}.ico{width:32px;height:32px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex:none}.ico.bot{background:var(--c-brand);color:var(--c-brand-ink)}.ntf-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.ntf-head{display:flex;align-items:baseline;gap:8px;font-size:13px}.ntf-head .muted{font-size:12px}.ntf-when{margin-left:auto}.ntf-text{font-size:14px;line-height:1.5}.ntf-acts{display:flex;gap:8px}.preview{background:var(--c-surface);border:1px solid var(--c-line);border-radius:8px;padding:10px 12px;font-size:13px;white-space:pre-line;line-height:1.55}.seg,.appbar,.tabbar{display:none}.appbar{align-items:center;gap:10px;height:var(--h-appbar);padding:0 8px 0 16px;background:var(--c-surface);border-bottom:1px solid var(--c-line);flex:none}.appbar h1{font-size:18px;font-weight:600;flex:1}.tabbar{align-items:stretch;height:var(--h-tabbar);padding:0 4px 8px;background:var(--c-surface);border-top:1px solid var(--c-line);flex:none}.tb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:inherit;font-size:12px;font-weight:500;color:var(--c-muted);background:transparent;border:0;cursor:pointer;position:relative;min-height:var(--tap);text-decoration:none}.tb.on{color:var(--c-brand)}.sheet-bg{position:fixed;inset:0;z-index:50;background:#1b1b1873;display:flex;flex-direction:column;justify-content:flex-end}.sheet-dim{flex:1;border:0;background:transparent;cursor:default}.sheet{background:var(--c-surface);border-radius:16px 16px 0 0;padding:8px 8px 20px;display:flex;flex-direction:column;gap:2px;box-shadow:var(--sh-3)}.sheet .grab{width:36px;height:4px;border-radius:2px;background:var(--c-line-2);margin:4px auto 10px}.sheet-sep{height:1px;background:var(--c-line);margin:6px 12px}.mi{display:flex;align-items:center;gap:14px;min-height:52px;padding:0 12px;border-radius:10px;font:inherit;font-size:16px;font-weight:500;color:var(--c-text);background:transparent;border:0;cursor:pointer;width:100%;text-align:left;text-decoration:none}.mi:active{background:var(--c-surface-2)}.mi.static{cursor:default}.mi-who{display:flex;flex-direction:column;line-height:1.3;flex:1}.mi-who .muted{font-size:13px;font-weight:400}@media(max-width:640px){.side,.topbar,.filterbar{display:none}.appbar,.tabbar{display:flex}.content{padding:16px;gap:16px}.page-head h1{font-size:20px}.tiles{gap:8px}.tile{padding:12px 14px}.tile .v{font-size:22px}.home-grid{grid-template-columns:minmax(0,1fr)}.checkin{flex-direction:column;align-items:stretch;padding:16px;gap:14px}.checkin .btn{min-height:56px;font-size:18px}.card{border-radius:12px}.btn.icon{width:var(--tap)}.btn.icon.sm{width:var(--h-btn-sm)}.seg{display:flex;gap:6px;padding:10px 16px;overflow:auto;background:var(--c-surface);border-bottom:1px solid var(--c-line);flex:none}.seg .chip{height:36px;padding:0 14px;font-size:14px;border:1px solid var(--c-line);background:var(--c-surface);cursor:pointer;flex:none;font-family:inherit}.seg .chip.on{background:var(--accent-soft);color:var(--accent-ink);border-color:transparent}.ntf{padding:12px 14px;min-height:64px}.ntf.bot{padding-left:11px}.ico{width:36px;height:36px}.ntf-text{font-size:15px}.preview{font-size:14px}}.login{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:var(--c-bg)}.login-card{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px;padding:28px 24px;box-shadow:var(--sh-2)}.login-card .logo{width:48px;height:48px;border-radius:12px;font-size:20px;align-self:center}.login-card h1{font-size:var(--fs-h1);font-weight:600;text-align:center}.login-label{font-size:13px;font-weight:600}.login-chips{display:flex;flex-wrap:wrap;gap:8px}.login-chips .chip.view{height:36px;padding:0 14px;font-size:14px}.login-err{color:var(--c-danger);font-size:14px}.login-card .btn.primary{width:100%}@media(max-width:640px){.login{align-items:flex-start}.login-card{box-shadow:none;border:0;background:transparent;padding:16px 0}.login-chips .chip.view{height:var(--tap)}.login .input{min-height:var(--tap)}.login .btn.lg{height:56px;font-size:18px}}