:root{font-family:-apple-system,BlinkMacSystemFont,"Noto Sans Thai","Sarabun",system-ui,sans-serif;color:#202436;background:#f9f4ff;font-size:16px}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #a99af7;outline-offset:2px}a{color:#6654c3}h1,h2,h3,p{margin:0}h1{font-size:2.1rem;line-height:1.25;letter-spacing:-.03em}h2{font-size:1.12rem}small{font-size:.8rem}input,select,textarea{border:1px solid #ded9ed;border-radius:10px;background:#fff;color:#262737;padding:11px 12px;min-width:0}textarea{min-height:90px;resize:vertical}input[type=file]{padding:8px}input[type=checkbox]{width:auto}label{display:grid;gap:6px;font-size:.92rem;color:#656478;font-weight:500}label span.hint{font-size:.76rem;color:#9090a0;font-weight:400}.button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #e2dfee;border-radius:10px;background:#fff;color:#5f5c71;padding:10px 14px;font-size:.9rem;font-weight:600;white-space:nowrap}.button:hover{background:#f7f4ff}.button.dark{background:#1e2235;color:#fff;border-color:#1e2235}.button.dark:hover{background:#34395a}.button.purple{background:#f0ebff;color:#6754c4;border-color:#eee7ff}.button.green{color:#267852;border-color:#d5eddf;background:#f0fbf4}.button.red{color:#bc4a65;border-color:#f5dbe2;background:#fff8f9}.button.tiny{font-size:.8rem;padding:6px 9px;border-radius:7px}.button.icon{padding:7px 9px}.button.plain{border:0;background:transparent;color:#6a58c8;padding:6px}.button-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.muted{color:#87889a}.num{font-variant-numeric:tabular-nums}.empty{border:1px dashed #dcd7eb;border-radius:17px;padding:40px;text-align:center;color:#88889d;background:#fff}.error{color:#bd3d5b}.app-shell{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh;padding:12px 12px 12px 0;max-width:1800px;margin:auto}.sidebar{background:#f9f4ff;padding:24px 16px 16px;display:flex;flex-direction:column;gap:26px;min-width:0}.brand{display:flex;align-items:center;gap:11px;padding:0 4px;white-space:nowrap}.brand img{width:48px;height:48px;border-radius:13px;box-shadow:0 6px 14px #06c75525}.brand strong{font-size:1.42rem;letter-spacing:-.03em}.workspace-card{display:flex;gap:10px;align-items:center;padding:13px;background:#ffffffb8;border:1px solid #e8e0f5;border-radius:16px}.workspace-icon{width:37px;height:37px;border-radius:10px;background:#eee9ff;display:grid;place-items:center;color:#6d5bd1;font-size:1.35rem;flex-shrink:0}.workspace-card strong,.workspace-card small{display:block}.workspace-card strong{font-size:.91rem}.workspace-card small{color:#9994a9}.nav-title{font-size:.82rem;color:#9693a6;padding:0 12px;margin-bottom:-14px}nav{display:grid;gap:6px}nav button{display:flex;align-items:center;gap:12px;text-align:left;width:100%;border:0;background:transparent;color:#5d6074;padding:11px 13px;border-radius:11px;font-size:.96rem}nav button:hover{background:#efeaff}nav button.active{background:#eee9ff;color:#6b56d2;font-weight:700}nav .nav-icon{width:22px;text-align:center;font-size:1.12rem;line-height:1}nav .count{margin-left:auto;background:#e6ddff;border-radius:7px;padding:2px 6px;font-size:.78rem}.sidebar-bottom{margin-top:auto}.private-note{color:#9691a8;font-size:.86rem;margin:12px 12px 18px}.profile{border-top:1px solid #e4ddef;margin-top:14px;padding:15px 4px 0;display:flex;align-items:center;gap:10px}.profile>span:first-child{background:#e8e1fb;color:#6552ad;width:35px;height:35px;border-radius:50%;display:grid;place-items:center;font-size:.78rem;font-weight:700}.profile strong,.profile small{display:block}.profile small{color:#8e8c9b}.main{background:#fff;border-radius:22px;padding:27px 32px 20px;min-width:0;box-shadow:0 2px 14px #2b1b4506}.topline{display:flex;justify-content:space-between;align-items:center;color:#878a9a;font-size:.87rem;margin-bottom:28px}.private-chip{color:#6f5bbc;background:#f5f1ff;border-radius:8px;padding:7px 10px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:24px}.page-heading p{color:#9292a3;margin-top:5px}.page-heading .button-row{justify-content:flex-end}footer{border-top:1px solid #eeebf4;color:#9995a5;margin-top:32px;padding-top:17px;font-size:.79rem}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:20px 0}.toolbar input.search{flex:1;min-width:240px}.toolbar select{min-width:145px}.summary-strip{display:flex;justify-content:space-between;gap:16px;align-items:center;background:#f9f6ff;border:1px solid #eee8fa;padding:14px 18px;border-radius:15px;margin-bottom:18px}.summary-strip strong{display:block}.summary-strip small{color:#8b86a0}.summary-strip.green{background:#f5fcf8;border-color:#dcefe4}.grid-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:18px 0 26px}.kpi{padding:17px;border-radius:16px;min-height:125px;color:#fff;background:#6858d3}.kpi:nth-child(2){background:#f3d47a;color:#463726}.kpi:nth-child(3){background:#cdece4;color:#27473e}.kpi:nth-child(4){background:#202438}.kpi strong{font-size:1.7rem;display:block;margin:8px 0 4px}.kpi small{opacity:.78}.cards-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:13px 0 26px}.bank-card{min-height:186px;border-radius:17px;padding:19px;color:#fff;background:linear-gradient(125deg,#505397,#8582ca);position:relative;overflow:hidden}.bank-card:after{content:"";position:absolute;width:200px;height:200px;border-radius:50%;background:#ffffff0d;top:-120px;right:-75px}.bank-card.green{background:linear-gradient(125deg,#346c60,#79b29d)}.bank-card.blue{background:linear-gradient(125deg,#315e9a,#71a9c9)}.bank-card.black{background:linear-gradient(125deg,#1e2639,#5b6072)}.bank-card.coral{background:linear-gradient(125deg,#a44760,#e3939d)}.bank-card header{display:flex;justify-content:space-between;gap:12px;font-weight:700}.bank-card .digits{opacity:.8;letter-spacing:.18em;margin:12px 0 15px}.bank-card .balance{font-size:1.65rem;font-weight:700}.bank-card .bank-foot{display:flex;justify-content:space-between;font-size:.78rem;margin-top:12px}.bank-card .meter{height:7px;border-radius:8px;background:#ffffff45;margin-top:10px;overflow:hidden}.bank-card .meter span{height:100%;display:block;background:#fff}.bank-card .bank-actions{display:flex;gap:6px;margin-top:12px}.bank-card .bank-actions button{background:#ffffff22;color:#fff;border:1px solid #ffffff55;padding:5px 9px;border-radius:7px;font-size:.8rem}.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:26px 0 12px}.section-head small{color:#8c879c}.list-panel{border:1px solid #e9e6f1;border-radius:18px;overflow:hidden;background:#fff}.group-label{background:#faf7ff;border-bottom:1px solid #eee8f6;padding:10px 16px;color:#695a9d;font-size:.84rem;font-weight:700}.due-row{display:grid;grid-template-columns:55px 46px minmax(190px,1fr) 140px 140px 125px auto;gap:11px;align-items:center;padding:15px 16px;border-bottom:1px solid #eeeaf5}.due-row:last-child,.line-row:last-child{border-bottom:0}.date-tile{background:#f2efff;color:#6e60a5;border-radius:11px;display:grid;place-items:center;padding:5px;line-height:1.1;font-size:.7rem}.date-tile strong{font-size:1.5rem}.date-tile.overdue{background:#202438;color:#fff}.line-logo{height:40px;width:40px;border-radius:11px}.item-title{font-size:1rem;font-weight:700}.item-meta{color:#9290a0;font-size:.79rem;margin-top:2px}.priority{font-size:.77rem;padding:3px 7px;border-radius:7px;font-weight:700;white-space:nowrap}.priority.high{background:#fde9ee;color:#bd4560}.priority.low{background:#eaf6ef;color:#3b8060}.priority.unspecified{background:#f1eff5;color:#78748a}.item-price small{display:block;color:#9290a0;font-size:.75rem}.item-price strong{font-size:.92rem}.item-price .paid{color:#3b8661}.item-price .pending{color:#b28338}.total-price{font-weight:750;white-space:nowrap}.pin-controls{display:flex;align-items:center;gap:2px;color:#6b55ce}.pin-controls button{border:0;background:transparent;color:inherit;padding:4px;font-size:1.08rem}.pin-controls .rank{font-size:.8rem;font-weight:700}.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0}.pagination .button-row{justify-content:flex-end}.line-list{display:grid;gap:14px}.line-row{border:1px solid #e9e6f1;border-radius:18px;padding:18px;background:#fff}.line-main{display:flex;gap:13px;align-items:flex-start}.line-main .line-logo{margin-top:2px;flex-shrink:0}.line-main .title-flex{flex:1;min-width:0}.line-main .title-flex h2{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.line-main .title-flex p{color:#9693a5;font-size:.83rem;margin-top:3px}.amount-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:15px 0}.amount-cell{border-left:1px solid #e8e3f2;padding-left:13px}.amount-cell small{color:#8d8a9c;display:block;font-size:.79rem}.amount-cell strong{font-size:1.1rem}.amount-cell.total strong{color:#6654c3}.line-actions{border-top:1px solid #eeeaf4;padding-top:12px;display:flex;gap:7px;flex-wrap:wrap}.tabs{display:flex;gap:7px;border-bottom:1px solid #ebe6f2;padding-bottom:11px}.tabs button{border:0;background:transparent;color:#78758e;padding:8px 12px;border-radius:9px}.tabs button.active{background:#eee9ff;color:#6856c8;font-weight:700}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.calendar-weekday{text-align:center;color:#89849a;padding:8px;font-size:.82rem}.calendar-day{min-height:100px;border:1px solid #eeeaf3;border-radius:10px;padding:9px}.calendar-day.empty-day{background:#faf9fc}.calendar-day strong{display:block}.calendar-day button{border:0;background:#f2edff;color:#6a55c3;border-radius:6px;padding:4px 6px;margin-top:5px;font-size:.78rem;text-align:left;width:100%}.users-grid{display:grid;gap:10px}.user-row,.setting-row{border:1px solid #eeeaf3;border-radius:14px;padding:17px;display:flex;justify-content:space-between;align-items:center;gap:12px}.user-row small,.setting-row small{display:block;color:#8a899a}.log-table{width:100%;border-collapse:collapse;font-size:.86rem}.log-table th,.log-table td{text-align:left;padding:10px;border-bottom:1px solid #eeeaf4}.log-table th{color:#838195;font-weight:500;background:#faf8ff}.log-table td:last-child{max-width:360px;overflow-wrap:anywhere}.settings-panel{border:1px solid #ece7f4;border-radius:16px;padding:22px;margin-bottom:18px}.settings-panel h2{margin-bottom:15px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .full{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.check-row{display:flex;align-items:center;gap:8px;border:1px solid #eeeaf4;padding:10px;border-radius:9px;font-size:.85rem}dialog{border:0;border-radius:19px;padding:0;max-width:min(720px,calc(100vw - 25px));width:100%;box-shadow:0 25px 90px #17182c45}dialog::backdrop{background:#17162590}#modal-content{padding:25px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:20px}.modal-head h2{font-size:1.3rem}.modal-close{border:0;background:#f3f0fa;border-radius:8px;padding:5px 9px;font-size:1.1rem;color:#77728c}.modal-note{color:#8c8b9d;font-size:.85rem;margin-bottom:16px}.slip-preview{max-width:100%;max-height:70vh;object-fit:contain}#toast{position:fixed;bottom:18px;right:20px;background:#24283d;color:white;border-radius:11px;padding:11px 15px;box-shadow:0 12px 35px #24283d30;z-index:100;display:none;font-size:.87rem}.login-view{min-height:100vh;display:grid;place-items:center;padding:18px}.login-view[hidden],.app-shell[hidden]{display:none}.login-card{background:#fff;padding:32px;width:min(370px,100%);border:1px solid #ebe6f2;box-shadow:0 14px 45px #291d4f12;border-radius:21px;display:grid;gap:17px}.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:6px}.login-brand img{width:43px}.login-brand strong{font-size:1.26rem}.login-card h1{font-size:1.8rem}.login-card .button{width:100%}.login-card #login-error{font-size:.86rem;color:#b64661;min-height:1em}
@media(max-width:1200px){.grid-cards{grid-template-columns:repeat(2,1fr)}.cards-grid{grid-template-columns:repeat(2,1fr)}.due-row{grid-template-columns:45px 40px minmax(160px,1fr) 115px 115px 95px auto;gap:7px;padding:12px}.item-price strong{font-size:.83rem}}
@media(max-width:900px){.app-shell{grid-template-columns:1fr;padding:0}.sidebar{gap:13px;padding:14px}.brand img{width:38px;height:38px}.brand strong{font-size:1.17rem}.workspace-card,.sidebar-bottom,.nav-title{display:none}#nav{display:flex;overflow-x:auto;white-space:nowrap}#nav button{width:auto;padding:9px 11px}#nav button .count{display:none}.main{border-radius:17px 17px 0 0;padding:20px 16px}.due-row{grid-template-columns:42px 38px minmax(150px,1fr) auto}.due-row .item-price{display:none}.due-row .total-price{display:none}.cards-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.page-heading{align-items:flex-start;flex-direction:column}.page-heading .button-row{justify-content:flex-start}.grid-cards,.cards-grid{grid-template-columns:1fr 1fr}.kpi{min-height:100px;padding:13px}.kpi strong{font-size:1.3rem}.bank-card{min-height:160px;padding:13px}.bank-card .balance{font-size:1.25rem}.toolbar input.search{min-width:100%}.toolbar select{flex:1}.line-row{padding:13px}.amount-grid{gap:5px}.amount-cell{padding-left:6px}.amount-cell strong{font-size:.88rem}.amount-cell small{font-size:.7rem}.form-grid,.check-grid{grid-template-columns:1fr}.form-grid .full{grid-column:1}.calendar-day{min-height:60px;padding:4px;font-size:.75rem}.calendar-day button{font-size:.65rem}.log-table{font-size:.74rem}.log-table th,.log-table td{padding:6px}.summary-strip{flex-direction:column;align-items:flex-start}.pagination{flex-wrap:wrap}.due-row{grid-template-columns:40px 32px minmax(100px,1fr) auto;padding:9px;gap:6px}.line-logo{width:32px;height:32px}.item-title{font-size:.88rem}.item-meta{font-size:.69rem}}
@media(max-width:900px){.sidebar-bottom{display:block;margin-top:0}.sidebar-bottom .private-note,.sidebar-bottom .profile{display:none}#bottom-nav{display:flex;gap:4px;overflow-x:auto}#bottom-nav button{width:auto;white-space:nowrap;padding:8px 11px;font-size:.83rem}}
@media(max-width:900px){.due-row{align-items:start}.due-row .item-price{display:block;grid-column:3/5}.due-row .item-price small{display:inline}.due-row .item-price strong{font-size:.88rem}.due-row .total-price{display:block;grid-column:3/5;color:#6753c7}.due-row .pin-controls{grid-column:4;grid-row:1;justify-self:end}}

.login-card[hidden]{display:none!important}.login-card #setup-error{font-size:.86rem;color:#b64661;min-height:1em}
.card-preview{max-width:380px;margin-top:10px}.card-preview .bank-card{min-height:190px}.network-mark{display:inline-flex;align-items:center;justify-content:center;min-width:62px;min-height:31px;padding:3px 7px;border-radius:7px;background:#fff;color:#18294a;font-family:Arial,sans-serif;font-size:.77rem;font-weight:900;letter-spacing:-.04em;line-height:1;white-space:nowrap;position:relative;z-index:1}.network-visa{color:#173a8a;font-style:italic;font-size:1.18rem}.network-jcb{font-size:1.13rem;letter-spacing:.04em;color:#286aa4}.network-unionpay{color:#d82943;font-size:.73rem}.network-amex{background:#276bb8;color:#fff;font-size:.67rem;max-width:66px;white-space:normal;text-align:center}.network-discover{color:#292929}.network-other{font-size:.75rem}.network-mastercard{min-width:64px;gap:0}.network-mastercard i{width:27px;height:27px;border-radius:50%;background:#eb001b;display:block}.network-mastercard i+i{background:#f79e1b;margin-left:-10px;mix-blend-mode:multiply}.signup-charge{color:#34855c!important;font-weight:700!important}
.network-jcb{gap:1px;padding:2px 5px;letter-spacing:0}.network-jcb i{display:grid;place-items:center;width:16px;height:26px;color:#fff;font-size:1rem;font-style:normal;border-radius:2px;background:#2084ba}.network-jcb i:nth-child(2){background:#db3e54}.network-jcb i:nth-child(3){background:#55a74e}.network-unionpay{gap:4px;color:#363c54;padding:3px 5px}.network-unionpay i{width:16px;height:24px;border-radius:2px;background:linear-gradient(110deg,#e43850 0 37%,#288c95 37% 68%,#3761a6 68%);transform:skew(-12deg)}.network-unionpay b{font-size:.68rem}.network-discover{font-size:.57rem;letter-spacing:0}.discover-dot{display:inline-grid;place-items:center;width:12px;height:12px;background:#ef8c31;color:#fff;border-radius:50%}
.credit-warnings{border:1px solid #f3c8ce;background:#fff7f8;color:#8d3043;border-radius:15px;padding:15px 18px;margin:14px 0 18px}.credit-warnings p{font-size:.81rem;margin:3px 0 10px;color:#a15b69}.credit-warning-row{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid #f5dfe3;font-size:.86rem}.credit-warning-row b{color:#aa2442}.next-row{display:grid;grid-template-columns:40px minmax(160px,1fr) minmax(110px,140px) minmax(125px,155px) minmax(115px,140px);gap:14px;align-items:center;padding:15px 16px;border-bottom:1px solid #eeeaf5}.next-row:last-child{border-bottom:0}.next-name{min-width:0}.next-name strong{display:block;overflow-wrap:anywhere}.next-name small,.next-charge small{display:block;color:#9290a0;font-size:.78rem}.next-charge strong{font-size:.96rem}.next-total strong{color:#6654c3}.section-head .button-row label{font-size:.79rem}.section-head .button-row input[type=date]{padding:7px 10px}
@media(max-width:900px){.next-row{grid-template-columns:36px minmax(150px,1fr) repeat(3,minmax(90px,1fr));gap:8px}.next-row .line-logo{width:36px;height:36px}}
@media(max-width:650px){.next-row{grid-template-columns:32px 1fr 1fr;gap:8px;padding:12px}.next-row .line-logo{width:32px;height:32px}.next-name{grid-column:2/4}.next-charge{grid-column:2/4;display:flex;justify-content:space-between}.credit-warning-row{display:grid}.section-head{align-items:flex-start;flex-wrap:wrap}}
