:root{--font-sans: "Noto Sans Thai", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--text-xs: 11px;--text-sm: 12.5px;--text-base: 14px;--text-md: 15px;--text-lg: 18px;--text-xl: 22px;--text-2xl: 28px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--r-sm: 8px;--r-md: 11px;--r-lg: 15px;--r-xl: 20px;--r-full: 999px;--ease: cubic-bezier(.32, .72, 0, 1);--fast: .12s;--base: .2s;--bg: #ffffff;--bg-sunken: #f1f5fa;--surface: #ffffff;--surface-2: #f4f7fb;--surface-hover: #e9eff7;--border: #dbe3ee;--border-strong: #bfcbdc;--fg: #0a1834;--fg-2: #46556f;--fg-3: #6b7a93;--accent: #1d4ed8;--accent-hover: #1740b8;--accent-ink: #ffffff;--accent-wash: #e5edfd;--brand: #1b3fae;--brand-deep: #10286f;--brand-ink: #ffffff;--cta: #c8f53f;--cta-hover: #d7fa63;--cta-ink: #16240a;--on-brand: #ffffff;--on-brand-2: rgba(255, 255, 255, .76);--on-brand-3: rgba(255, 255, 255, .5);--ok: #05715a;--ok-wash: #dff3ed;--warn: #94590a;--warn-wash: #fdf0d9;--danger: #b3261e;--danger-wash: #fceceb;--overlay: rgba(10, 24, 52, .5);color-scheme:light}:root[data-theme=dark]{--bg: #070c18;--bg-sunken: #04070f;--surface: #0d162a;--surface-2: #141f38;--surface-hover: #1b2846;--border: #22304f;--border-strong: #35476e;--fg: #eef3fc;--fg-2: #95a4c0;--fg-3: #66748f;--accent: #5b8def;--accent-hover: #7ba5f5;--accent-ink: #05080f;--accent-wash: #12224a;--brand: #142a6b;--brand-deep: #0a1740;--brand-ink: #eef3fc;--cta: #c8f53f;--cta-hover: #d7fa63;--cta-ink: #16240a;--on-brand: #ffffff;--on-brand-2: rgba(255, 255, 255, .72);--on-brand-3: rgba(255, 255, 255, .46);--ok: #4ade9f;--ok-wash: #0c2b22;--warn: #f5b940;--warn-wash: #2e2210;--danger: #f8827b;--danger-wash: #33130f;--overlay: rgba(0, 0, 0, .7);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overscroll-behavior:none}button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}.tabular{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.2px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.app-shell{display:flex;flex-direction:column;height:100dvh;background:var(--bg);overflow:hidden}@media (min-width: 520px){.app-shell{max-width:440px;height:92dvh;margin:4dvh auto;border:1px solid var(--border);border-radius:var(--r-xl)}}.app-header{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);padding-top:max(var(--sp-3),env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--border);color:var(--fg);flex-shrink:0}.app-header__title{flex:1;min-width:0;font-size:var(--text-lg);font-weight:600;letter-spacing:-.2px}.icon-btn{background:transparent;border:none;color:var(--fg-2);cursor:pointer;width:36px;height:36px;border-radius:var(--r-sm);display:inline-flex;align-items:center;justify-content:center;transition:background var(--fast) var(--ease)}.icon-btn:hover{background:var(--surface-hover)}.icon-btn:active{transform:scale(.94)}.list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);cursor:pointer;background:var(--surface);transition:background var(--fast) var(--ease)}.row:active{background:var(--surface-hover)}.row--unread{background:var(--accent-wash)}.row__body{flex:1;min-width:0}.row__title{font-size:var(--text-base);font-weight:500;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row__preview{font-size:var(--text-sm);color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.row__meta{font-size:var(--text-xs);color:var(--fg-3);flex-shrink:0;align-self:flex-start;padding-top:2px}.avatar{width:42px;height:42px;border-radius:13px;background:var(--accent-wash);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:500;font-size:var(--text-base);flex-shrink:0;object-fit:cover;overflow:hidden}.badge{display:inline-block;font-size:var(--text-xs);font-weight:500;padding:1px 7px;border-radius:6px;white-space:nowrap}.badge--ok{background:var(--ok-wash);color:var(--ok)}.badge--warn{background:var(--warn-wash);color:var(--warn)}.badge--accent{background:var(--accent-wash);color:var(--accent)}.unread-dot{min-width:20px;height:20px;padding:0 6px;border-radius:var(--r-full);background:var(--accent);color:var(--accent-ink);font-size:var(--text-xs);font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.tabbar{display:flex;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom);flex-shrink:0}.tab{flex:1;background:transparent;border:none;cursor:pointer;padding:var(--sp-2) 0 var(--sp-3);display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--fg-3);font-size:var(--text-xs);transition:color var(--fast) var(--ease)}.tab.is-active{color:var(--accent);font-weight:500}.tab:active{transform:scale(.96)}@keyframes cc-spin{to{transform:rotate(360deg)}}@keyframes cc-slide{0%{transform:translate(-100%)}to{transform:translate(250%)}}.empty{padding:var(--sp-10) var(--sp-6);text-align:center;color:var(--fg-3);font-size:var(--text-sm);line-height:1.7}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}