:root{--bg:#f4f3ef;--surface:#fff;--sunken:#ebe9e2;--border:#dcd9cf;--text:#1b2421;--muted:#647069;--primary:#0f5c4d;--primary-text:#fff;--primary-soft:#dcebe6;--ok:#17703f;--ok-bg:#e0f3e7;--warn:#8a5300;--warn-bg:#fdefd2;--error:#b3261e;--error-bg:#fde7e5;--bar:#0f5c4d;--nav-h:60px;--safe-b:env(safe-area-inset-bottom,0px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);font-family:Sarabun,Leelawadee UI,Noto Sans Thai,system-ui,sans-serif;font-size:16px;line-height:1.45}@media (prefers-color-scheme:dark){:root{--bg:#101614;--surface:#1a2320;--sunken:#141b19;--border:#2f3d38;--text:#e6ece9;--muted:#98a8a1;--primary:#3fae93;--primary-text:#06231c;--primary-soft:#1d3a33;--ok:#74d7a0;--ok-bg:#173526;--warn:#f2bd6a;--warn-bg:#3d2e12;--error:#ff8f85;--error-bg:#43211e;--bar:#3fae93;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);overscroll-behavior-y:none;margin:0}h1,h2,h3,p{margin:0}a{color:inherit;text-decoration:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer}.app{max-width:720px;min-height:100dvh;padding-bottom:calc(var(--nav-h) + var(--safe-b) + 16px);margin:0 auto}.topbar{z-index:5;background:var(--bg);border-bottom:1px solid var(--border);padding:10px 16px 8px;position:sticky;top:0}.topbar h1{align-items:center;gap:8px;font-size:1.2rem;font-weight:700;display:flex}.topbar .back{color:var(--primary);background:0 0;border:0;padding:4px 8px 4px 0;font-size:1.3rem;line-height:1}.age{color:var(--muted);font-size:.8rem}.age.late{color:var(--warn);font-weight:600}.page{gap:12px;padding:12px 16px;display:grid}.nav{z-index:6;background:var(--surface);border-top:1px solid var(--border);padding-bottom:var(--safe-b);position:fixed;bottom:0;left:0;right:0}.nav-inner{max-width:720px;height:var(--nav-h);grid-template-columns:repeat(5,1fr);margin:0 auto;display:grid}.nav a{color:var(--muted);align-content:center;place-items:center;gap:2px;font-size:.72rem;display:grid}.nav a svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.nav a.on{color:var(--primary);font-weight:700}.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px}.card h2{margin-bottom:8px;font-size:.95rem;font-weight:700}.muted{color:var(--muted)}.small{font-size:.82rem}.num{font-variant-numeric:tabular-nums}.right{text-align:right}.nowrap{white-space:nowrap}.error{color:var(--error);background:var(--error-bg);border-radius:10px;padding:10px 12px}.empty{text-align:center;color:var(--muted);padding:28px 12px}.tag{background:var(--sunken);color:var(--muted);white-space:nowrap;border-radius:999px;padding:1px 8px;font-size:.75rem;font-weight:600;display:inline-block}.tag.ok{background:var(--ok-bg);color:var(--ok)}.tag.warn{background:var(--warn-bg);color:var(--warn)}.tag.bad{background:var(--error-bg);color:var(--error)}.btn{border:1px solid var(--border);background:var(--surface);border-radius:10px;min-height:44px;padding:10px 14px;font-weight:600}.btn.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-text)}.btn:disabled{opacity:.55}.field{border:1px solid var(--border);background:var(--surface);border-radius:10px;width:100%;min-height:44px;padding:8px 12px}.field:focus-visible,.btn:focus-visible,.chip:focus-visible{outline:2px solid var(--primary);outline-offset:1px}.chips{scrollbar-width:none;gap:8px;margin:0 -16px;padding:0 16px;display:flex;overflow-x:auto}.chips::-webkit-scrollbar{display:none}.chip{border:1px solid var(--border);background:var(--surface);min-height:36px;color:var(--muted);border-radius:999px;flex:none;padding:6px 14px;font-size:.9rem}.chip.on{background:var(--primary);border-color:var(--primary);color:var(--primary-text);font-weight:600}.list{gap:8px;display:grid}.item{background:var(--surface);border:1px solid var(--border);border-radius:14px;grid-template-columns:56px 1fr auto;align-items:center;gap:12px;padding:10px 12px 10px 10px;display:grid}.item.no-thumb{grid-template-columns:1fr auto;padding-left:14px}.item .name{overflow-wrap:anywhere;font-weight:600}.item .side{text-align:right;justify-items:end;gap:2px;display:grid}.item .big{font-size:1.05rem;font-weight:700}.thumb{background:var(--sunken);object-fit:cover;width:56px;height:56px;color:var(--muted);border-radius:10px;place-items:center;font-size:1.3rem;display:grid;overflow:hidden}.stats{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.stats.three{grid-template-columns:repeat(3,1fr)}.stat{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px 12px}.stat .label{color:var(--muted);font-size:.78rem}.stat .value{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:700}.stat .value.good{color:var(--ok)}.stat .value.bad{color:var(--error)}.stat .sub{color:var(--muted);font-size:.78rem}.rows{display:grid}.rows>*{border-top:1px solid var(--border);justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;display:flex}.rows>:first-child{border-top:0;padding-top:0}.rows>:last-child{padding-bottom:0}.rows .grow{overflow-wrap:anywhere;flex:1;min-width:0}.best{color:var(--ok);font-weight:700}.bars{gap:6px;display:grid}.bar-row{grid-template-columns:64px 1fr auto;align-items:center;gap:8px;font-size:.85rem;display:grid}.bar-track{background:var(--sunken);border-radius:999px;height:10px;overflow:hidden}.bar-fill{background:var(--bar);border-radius:999px;min-width:2px;height:100%}.hero{aspect-ratio:4/3;object-fit:contain;background:var(--surface);border:1px solid var(--border);border-radius:14px;width:100%;max-height:320px}.camera{object-fit:cover;background:#000;border-radius:14px;width:100%;max-height:46vh}.search-row{gap:8px;display:flex}.search-row .field{flex:1}.signin{text-align:center;place-content:center;justify-items:center;gap:16px;min-height:100dvh;padding:24px;display:grid}.signin img{width:72px;height:72px}