@import"https://fonts.googleapis.com/css2?family=Itim&family=Noto+Sans+Thai:wght@400;500;600;700&display=swap";:root{--bg: #F2FAFE;--card: #FFFFFF;--ink: #234A5E;--ink-soft: #5E8597;--muted: #9DB6C4;--aqua: #3BAFDA;--aqua-lt: #5CC2E6;--aqua-dk: #2E97BE;--aqua-tint: #DCF1FB;--matcha: #5FBF85;--matcha-tint: #E3F5EA;--coral: #F0876F;--coral-tint: #FCE7E0;--sun: #F6C85A;--line: #E2EEF4;--shadow: 0 12px 30px rgba(59,175,218,.14);--shadow-sm: 0 5px 16px rgba(59,175,218,.1);--r: 20px;--r-lg: 26px;--r-sm: 16px;--ease: cubic-bezier(.2,.85,.2,1)}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{min-height:100%}body{font-family:Noto Sans Thai,sans-serif;color:var(--ink);background:radial-gradient(1100px 520px at 85% -10%,#E4F4FD 0,transparent 60%),radial-gradient(800px 460px at -5% 108%,#E9F7EE 0,transparent 55%),var(--bg);background-attachment:fixed;-webkit-font-smoothing:antialiased}.itim{font-family:Itim,cursive}.num{font-variant-numeric:tabular-nums}.app{max-width:460px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 8px;position:sticky;top:0;z-index:30;background:linear-gradient(180deg,var(--bg) 72%,transparent)}.brand{font-family:Itim,cursive;font-size:23px;color:var(--ink);display:flex;align-items:center;gap:8px}.brand .bi{font-size:24px}.logout{display:inline-flex;align-items:center;gap:5px;color:var(--ink-soft);font-size:13px;font-weight:600;padding:8px 13px;border-radius:999px;background:var(--card);box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .12s}.logout:active{transform:scale(.95)}.content{flex:1;padding:6px 16px calc(96px + env(safe-area-inset-bottom))}.screen{display:flex;flex-direction:column;gap:12px;animation:pop .35s var(--ease)}@keyframes pop{0%{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}.h2{font-size:14px;color:var(--ink-soft);font-weight:600;margin:16px 4px 2px;display:flex;align-items:center;gap:8px}.card{background:var(--card);border-radius:var(--r-lg);padding:16px;display:flex;flex-direction:column;gap:13px;box-shadow:var(--shadow-sm)}.card.hl{box-shadow:var(--shadow);outline:2px solid var(--aqua-tint)}.lbl{font-size:13px;color:var(--ink-soft);font-weight:600;margin-bottom:-6px}.inp,.dp-trigger{background:var(--bg);border:2px solid var(--line);color:var(--ink);border-radius:var(--r-sm);padding:13px 15px;font-size:16px;width:100%;outline:none;font-family:inherit;transition:border-color .18s}.inp:focus{border-color:var(--aqua-lt)}.inp::placeholder{color:var(--muted)}.inp.err{border-color:var(--coral);background:var(--coral-tint)}.err-msg{color:var(--coral);font-size:12.5px;font-weight:600;margin-top:-7px}.cab.err,.cab-row.err .cab{border-color:var(--coral)}select.inp{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%235E8597' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:42px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.btn{border:none;border-radius:var(--r);padding:15px;font-family:Itim,cursive;font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;width:100%;transition:transform .12s var(--ease)}.btn:active{transform:scale(.97)}.btn.primary{background:linear-gradient(135deg,var(--aqua-lt),var(--aqua-dk));box-shadow:0 9px 22px #3bafda66}.btn.primary:disabled{background:#cfe3ec;color:#fff;box-shadow:none;cursor:default}.btn.ghost{background:var(--card);color:var(--aqua-dk);box-shadow:var(--shadow-sm);border:2px dashed var(--aqua-lt)}.btn.file{display:flex}.muted{color:var(--ink-soft);font-size:14px;padding:4px 2px}.badge{background:var(--sun);color:#6b4a00;border-radius:999px;padding:1px 10px;font-size:13px;font-weight:700;font-family:Itim,cursive;min-width:22px;text-align:center}.cab-row{display:flex;gap:11px}.cab{flex:1;aspect-ratio:1;max-width:72px;display:flex;align-items:center;justify-content:center;background:var(--bg);border:2.5px solid var(--line);border-radius:20px;font-family:Itim,cursive;font-size:26px;color:var(--muted);cursor:pointer;transition:all .18s var(--ease)}.cab:active{transform:scale(.93)}.cab.on{background:var(--aqua-tint);border-color:var(--aqua);color:var(--aqua-dk);box-shadow:var(--shadow-sm)}.round{display:flex;align-items:center;gap:11px;padding:13px 6px;border-bottom:1px solid var(--line);font-size:15px;cursor:pointer;border-radius:14px;transition:background .15s}.round:last-child{border-bottom:none}.round.sel{background:var(--aqua-tint)}.ck{width:24px;height:24px;border-radius:9px;border:2px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;transition:all .15s}.round.sel .ck{background:var(--aqua);border-color:var(--aqua)}.rdate{font-weight:600;white-space:nowrap}.rcab{color:var(--aqua-dk);font-size:13px}.rnote{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:34%}.row-acts{margin-left:auto;display:flex;gap:4px;flex-shrink:0}.iact{width:32px;height:32px;border-radius:11px;border:none;background:var(--aqua-tint);color:var(--aqua-dk);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:transform .1s}.iact:active{transform:scale(.9)}.iact.danger{background:var(--coral-tint);color:var(--coral)}.hrow{display:flex;align-items:center;gap:11px;padding:13px 6px;border-bottom:1px solid var(--line);font-size:15px}.hrow:last-child{border-bottom:none}.hamt{font-family:Itim,cursive;font-size:19px;color:var(--matcha)}.hint{font-size:12px;margin-top:5px}.total-line{font-size:15px;text-align:right;color:var(--ink-soft)}.total-line b{font-family:Itim,cursive;color:var(--aqua-dk);font-size:30px;font-weight:400}.seg{display:flex;background:var(--bg);border-radius:var(--r-sm);padding:4px;gap:4px}.seg-i{flex:1;text-align:center;padding:11px;border-radius:12px;color:var(--ink-soft);font-size:15px;font-weight:600;cursor:pointer;transition:all .18s var(--ease)}.seg-i.on{background:linear-gradient(135deg,var(--aqua-lt),var(--aqua-dk));color:#fff;box-shadow:var(--shadow-sm)}.list{gap:0;padding:8px 16px}.erow{display:grid;grid-template-columns:max-content 1fr max-content;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px}.erow:last-child{border-bottom:none}.edate{color:var(--muted);font-size:12px;white-space:nowrap}.eitem{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ecat{color:var(--muted);font-size:12px}.eamt{font-family:Itim,cursive;font-size:18px;color:var(--coral)}.rev-amt{color:var(--matcha)}.kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px}.kpi{background:var(--card);border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.kpi:after{content:"";position:absolute;right:-18px;top:-18px;width:60px;height:60px;border-radius:50%;background:var(--aqua-tint);opacity:.6}.kpi.rev:after{background:var(--matcha-tint)}.kpi.exp:after{background:var(--coral-tint)}.kpi.pos:after{background:var(--matcha-tint)}.kpi.neg:after{background:var(--coral-tint)}.kpi-l{font-size:13px;color:var(--ink-soft);font-weight:600;position:relative}.kpi-v{font-family:Itim,cursive;font-size:27px;margin-top:5px;position:relative}.kpi-s{font-size:11.5px;color:var(--muted);margin-top:2px;position:relative}.kpi.rev .kpi-v{color:var(--matcha)}.kpi.exp .kpi-v{color:var(--coral)}.kpi.pos .kpi-v{color:var(--matcha)}.kpi.neg .kpi-v{color:var(--coral)}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:460px;display:flex;justify-content:space-around;background:#ffffffeb;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:9px 6px calc(9px + env(safe-area-inset-bottom));z-index:30}.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0;color:var(--muted);font-size:11.5px;font-weight:600;cursor:pointer;transition:color .18s}.tab .te{font-size:24px;line-height:1;transition:transform .2s var(--ease)}.tab.on{color:var(--aqua-dk)}.tab.on .te{transform:translateY(-2px) scale(1.08)}.toast{position:fixed;bottom:calc(92px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%);background:var(--ink);color:#eaf7fc;padding:12px 20px;border-radius:999px;font-size:14px;font-weight:600;z-index:40;max-width:88%;box-shadow:var(--shadow);animation:toastin .26s var(--ease)}@keyframes toastin{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.dp-trigger{display:flex;align-items:center;gap:10px;cursor:pointer;text-align:left;font-family:Itim,cursive;font-size:17px}.dp-trigger .dp-ic{color:var(--aqua-dk);flex-shrink:0}.dp-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#234a5e57;z-index:50;display:flex;align-items:flex-end;justify-content:center;animation:fade .2s}@keyframes fade{0%{opacity:0}to{opacity:1}}.dp-sheet{width:100%;max-width:460px;background:var(--card);border-radius:28px 28px 0 0;padding:12px 18px calc(20px + env(safe-area-inset-bottom));box-shadow:0 -12px 34px #3bafda38;animation:sheetup .3s var(--ease)}@keyframes sheetup{0%{transform:translateY(100%)}to{transform:none}}.dp-grab{width:44px;height:5px;border-radius:3px;background:var(--line);margin:4px auto 14px}.dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.dp-title{font-family:Itim,cursive;font-size:19px;color:var(--ink)}.dp-nav{width:40px;height:40px;border-radius:14px;background:var(--aqua-tint);color:var(--aqua-dk);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer}.dp-nav:active{transform:scale(.92)}.dp-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:6px}.dp-dow span{text-align:center;font-size:12px;color:var(--muted);font-weight:600}.dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.dp-cell{aspect-ratio:1;border:none;background:var(--bg);color:var(--ink);border-radius:14px;font-family:Itim,cursive;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .1s}.dp-cell.empty{background:transparent;cursor:default}.dp-cell:not(.empty):active{transform:scale(.9)}.dp-cell.today{box-shadow:inset 0 0 0 2px var(--aqua-lt);color:var(--aqua-dk)}.dp-cell.sel{background:linear-gradient(135deg,var(--aqua-lt),var(--aqua-dk));color:#fff}.dp-today{width:100%;margin-top:14px;padding:13px;border-radius:var(--r-sm);background:var(--aqua-tint);color:var(--aqua-dk);font-family:Itim,cursive;font-size:17px;border:none;cursor:pointer}.erow{cursor:pointer}.exd-row{display:flex;justify-content:space-between;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line);font-size:16px}.exd-row:last-of-type{border-bottom:none}.exd-k{color:var(--muted);flex-shrink:0}.exd-v{color:var(--ink);font-weight:600;text-align:right}.exd-amt{color:var(--aqua-dk)}.exd-slip{margin-top:14px}.exd-img{width:100%;border-radius:16px;border:2px solid var(--line);display:block}.exd-close{width:40px;height:40px;border-radius:14px;background:var(--aqua-tint);color:var(--aqua-dk);border:none;font-size:18px;display:flex;align-items:center;justify-content:center;cursor:pointer}.exd-close:active{transform:scale(.92)}.login{min-height:100vh;max-width:360px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px;animation:pop .4s var(--ease)}.login-logo{width:84px;height:84px;border-radius:28px;background:linear-gradient(135deg,var(--aqua-lt),var(--aqua-dk));display:flex;align-items:center;justify-content:center;font-size:44px;box-shadow:0 12px 28px #3bafda66;margin-bottom:6px}.login-title{font-family:Itim,cursive;font-size:30px;color:var(--ink)}.login-sub{color:var(--ink-soft);font-size:14px;margin-bottom:6px}.login-dots{display:flex;gap:12px;margin:12px 0}.dot{width:13px;height:13px;border-radius:50%;background:var(--line);transition:all .18s var(--ease)}.dot.on{background:var(--aqua);transform:scale(1.15)}.login-err{color:var(--coral);font-size:14px}.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;width:100%;margin:10px 0}.key{background:var(--card);border-radius:18px;padding:17px;text-align:center;font-family:Itim,cursive;font-size:24px;color:var(--ink);cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .1s}.key:active{transform:scale(.93);background:var(--aqua-tint)}.key.alt{background:var(--aqua-tint);color:var(--aqua-dk)}.login .btn{width:100%;margin-top:6px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}