body{margin:0;font-family:"Noto Sans Thai","Noto Sans",ui-sans-serif,system-ui,sans-serif;background:#f3f5f1;color:#16201a;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:#1f6b4a;text-decoration:none}
.lgtitle{font-size:2.125rem;line-height:1.25;font-weight:600;letter-spacing:-0.02em;margin:0}
.title{font-size:1.375rem;line-height:1.3;font-weight:600;margin:0}
.headline{font-size:1.0625rem;line-height:1.4;font-weight:600;margin:0}
.body{font-size:1rem;line-height:1.6;font-weight:400;margin:0}
.sub{font-size:0.9375rem;line-height:1.55;color:#5d6c5f}
.foot{font-size:0.875rem;line-height:1.6;color:#5d6c5f;margin:0}
.grphdr{font-size:0.875rem;line-height:1.4;font-weight:600;color:#5d6c5f;padding:0 1rem 0.375rem}
.group{background:#ffffff;border-radius:0.625rem;overflow:hidden}
.row{display:flex;align-items:center;gap:0.75rem;min-height:44px;box-sizing:border-box;padding:0.6875rem 1rem;color:#16201a;background:#ffffff;position:relative}
.row + .row::before{content:"";position:absolute;left:1rem;right:0;top:0;height:1px;background:#dde3d8}
.row .val{margin-left:auto;color:#5d6c5f;display:flex;align-items:center;gap:0.5rem}
.chev{color:#5d6c5f;flex-shrink:0}
.tint{color:#1f6b4a}
.btn{display:flex;align-items:center;justify-content:center;gap:0.5em;min-height:50px;box-sizing:border-box;padding:0.875em 1.25em;border-radius:0.625rem;background:#1f6b4a;color:#ffffff;border:0;font:inherit;font-size:1.0625rem;font-weight:600;cursor:pointer;width:100%}
.btn.quiet{background:#ffffff;color:#1f6b4a}
.btn.outline{background:#ffffff;color:#16201a;border:1px solid #7f8f79}
[aria-disabled="true"]{cursor:default}
.money{font-size:1.75rem;line-height:1.2;font-weight:600;letter-spacing:-0.01em;font-variant-numeric:tabular-nums}
.badge{display:inline-flex;align-items:center;border-radius:9999px;padding:0.154em 0.77em;font-size:0.875rem;line-height:1.5;font-weight:600}
.b-due{background:#f6ecc9;color:#8a6410}
.b-ok{background:#e2ebe4;color:#1f6b4a}
.b-over{background:#f7e1de;color:#ad2a1f}
.card{background:#ffffff;border-radius:0.875rem;padding:1.25rem}
.card.raised{background:linear-gradient(180deg,#ffffff 0%,#f8faf6 100%);box-shadow:0 1px 2px rgba(22,32,26,.06), 0 8px 24px rgba(22,32,26,.08)}
.field{display:flex;align-items:center;gap:0.75rem;min-height:44px;box-sizing:border-box;padding:0.6875rem 1rem;background:#ffffff;position:relative}
.field + .field::before{content:"";position:absolute;left:1rem;right:0;top:0;height:1px;background:#dde3d8}
.field label{font-size:1rem;width:9rem;flex-shrink:0}
.field input{flex-grow:1;border:0;background:transparent;font:inherit;font-size:1rem;color:#16201a;min-height:28px;outline-offset:2px}
.tabbar{display:flex;height:56px;background:#ffffff;border-top:1px solid #dde3d8}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:0.75rem;line-height:1.35;font-weight:600;color:#5d6c5f;text-decoration:none}
.tab.on{color:#1f6b4a}
.back{display:inline-flex;align-items:center;gap:0.25rem;min-height:44px;color:#1f6b4a;font-size:1.0625rem}
.icon{display:flex;align-items:center;justify-content:center;flex-shrink:0}
.side{width:16rem;flex-shrink:0;box-sizing:border-box;background:#ffffff;border-right:1px solid #dde3d8;padding:1.25rem 0.75rem;display:flex;flex-direction:column;gap:0.125rem}
.sideitem{display:flex;align-items:center;gap:0.625rem;min-height:36px;box-sizing:border-box;padding:0.375rem 0.75rem;border-radius:0.5rem;color:#16201a;font-size:1rem}
.sideitem.on{background:#e2ebe4;color:#1f6b4a;font-weight:600}
.pane{flex-grow:1;box-sizing:border-box;padding:2rem;overflow:hidden}
.col{max-width:42rem;display:flex;flex-direction:column;gap:1.5rem}
.row:focus-visible,.btn:focus-visible,.sideitem:focus-visible,.tab:focus-visible,.back:focus-visible,.field input:focus-visible,a:focus-visible,input[type=checkbox]:focus-visible{outline:2px solid #1f6b4a;outline-offset:2px;border-radius:0.375rem}
.btn:focus-visible{outline-color:#16201a}
.dark{color:#e9ede7;background:#131714}
.dark a,.dark .tint,.dark .back,.dark .tab.on{color:#6fbf8f}
.dark .sub,.dark .foot,.dark .grphdr,.dark .row .val,.dark .chev,.dark .tab{color:#9aa89b}
.dark .group,.dark .row,.dark .field,.dark .card,.dark .tabbar,.dark .side{background:#1b201c;color:#e9ede7}
.dark .row + .row::before,.dark .field + .field::before{background:#2d342d}
.dark .tabbar{border-top-color:#2d342d}
.dark .side{border-right-color:#2d342d}
.dark .card.raised{background:#1b201c;box-shadow:0 0 0 1px #2d342d}
.dark .btn{background:#6fbf8f;color:#0f1a12}
.dark .b-due{background:#352d16;color:#e6c257}
.dark .b-ok{background:#22301f;color:#6fbf8f}
.dark .b-over{background:#3a201d;color:#ff9b90}
.dark .sideitem.on{background:#22301f;color:#6fbf8f}
.dark :focus-visible{outline-color:#6fbf8f}