:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#162132;background:#e9f6f6;font-synthesis:none;letter-spacing:0}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#1f82aed1,#6ce8c1d1),radial-gradient(circle at 20% 20%,rgba(255,255,255,.68),transparent 28%),#dff8f2}.login-panel{width:min(440px,100%);background:#ffffffeb;border:1px solid rgba(255,255,255,.78);border-radius:18px;padding:32px;box-shadow:0 24px 70px #16415a38}.brand-lockup{display:flex;gap:14px;align-items:center;margin-bottom:30px}.brand-mark{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;color:#fff;font-weight:800;background:linear-gradient(135deg,#1d7fb1,#64dfc4)}.brand-lockup h1{margin:0;font-size:30px}.brand-lockup p{margin:4px 0 0;color:#687487}.login-form{display:grid;gap:18px}.login-form label{display:grid;gap:8px;color:#304051;font-weight:700}.login-form input,.search-box input{width:100%;border:1px solid #d7e6ea;border-radius:12px;background:#fff;color:#162132;outline:none}.login-form input{height:48px;padding:0 14px}.login-form input:focus,.search-box input:focus{border-color:#2f9ec0;box-shadow:0 0 0 4px #2f9ec01f}.tenant-pill,.form-error{border-radius:12px;padding:11px 12px;font-size:14px}.tenant-pill{color:#236274;background:#e9f8f6}.form-error{color:#b42318;background:#fff0ed}.primary-button{height:50px;border:0;border-radius:13px;color:#fff;font-weight:800;background:linear-gradient(135deg,#2385b5,#54d7bb);box-shadow:0 12px 28px #1f89ad47}.primary-button:disabled{opacity:.7}.primary-button.compact{width:fit-content;min-width:118px;height:44px;padding:0 18px;align-self:end}.app-shell{min-height:100vh;display:grid;grid-template-columns:292px 1fr;background:linear-gradient(135deg,#368bb8bf,#71e2bcc7 46%,#e8faf7f2),#ecfbf8}.sidebar{position:sticky;top:0;height:100vh;padding:28px 18px;background:linear-gradient(180deg,#4da2c7c2,#e6f8f7e0);border-right:1px solid rgba(255,255,255,.36);transition:width .18s ease;overflow:hidden auto}.sidebar.collapsed{width:92px}.sidebar-profile{display:flex;gap:14px;align-items:center;min-height:74px;margin-bottom:32px}.avatar,.mini-avatar{display:grid;place-items:center;flex:0 0 auto;overflow:hidden;color:#fff;font-weight:800;background:linear-gradient(135deg,#2b86bd,#72dfcd)}.avatar{width:62px;height:62px;border-radius:50%;box-shadow:0 12px 28px #1e5c7438}.avatar img{width:100%;height:100%;object-fit:cover}.profile-text{display:grid;gap:5px;min-width:0}.profile-text strong,.topbar-user strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-text span,.topbar-user span{color:#162132a3}.profile-text button{width:fit-content;padding:0;border:0;color:#245b70;background:transparent;font-weight:700}.collapse-button{position:absolute;top:112px;right:-17px;width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;color:#fff;background:#2a78a3;box-shadow:0 10px 24px #1d5d803d}.sidebar.collapsed .collapse-button svg{transform:rotate(180deg)}.menu-label-section{margin:16px 12px 14px;color:#21394b;font-weight:800}.menu-list{display:grid;gap:8px}.menu-button{min-height:46px;display:flex;align-items:center;gap:14px;width:100%;border:0;border-radius:12px;padding:0 14px;color:#233246;background:transparent;text-align:left;font-weight:750}.menu-button svg{color:#2e8bae;flex:0 0 auto}.menu-button.active,.menu-button:hover{color:#0d4f68;background:#ffffffad;box-shadow:inset 3px 0 #2c96b9}.sidebar.collapsed .profile-text,.sidebar.collapsed .menu-label-section,.sidebar.collapsed .menu-button span{display:none}.sidebar.collapsed .menu-button{justify-content:center;padding:0}.main-area{min-width:0}.topbar{position:sticky;top:0;z-index:10;min-height:78px;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:12px 30px 12px 32px;background:#ffffffe6;border-bottom-left-radius:40px;box-shadow:0 14px 36px #2461801f}.search-box{position:relative;width:min(420px,38vw)}.search-box svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#7892a2}.search-box input{height:44px;padding:0 14px 0 42px}.topbar-actions{display:flex;align-items:center;gap:12px}.icon-button,.refresh-button{border:0;background:#fff;color:#26374b;box-shadow:0 8px 22px #2353661a}.icon-button{position:relative;width:42px;height:42px;border-radius:50%;display:grid;place-items:center}.icon-button.badge span{position:absolute;top:-4px;right:-3px;min-width:18px;height:18px;display:grid;place-items:center;border-radius:50%;color:#fff;background:#e54b55;font-size:11px;font-weight:800}.refresh-button{height:42px;display:flex;align-items:center;gap:8px;padding:0 16px;border-radius:12px;font-weight:800}.spin{animation:spin .9s linear infinite}.topbar-user{display:flex;align-items:center;gap:10px;padding-left:6px}.topbar-user div:last-child{display:grid;gap:2px}.mini-avatar{width:40px;height:40px;border-radius:50%}.page-content{padding:54px 34px 42px}.hero-band{display:grid;grid-template-columns:1fr;gap:28px;margin-bottom:26px;padding:34px 38px;min-height:250px;color:#fff;background:linear-gradient(135deg,#3e97bed1,#67debec7),linear-gradient(45deg,rgba(255,255,255,.18),transparent 46%);border:1px solid rgba(255,255,255,.28);border-radius:24px;box-shadow:0 24px 58px #27627d2e}.hero-band h1{margin:0 0 8px;font-size:clamp(30px,4vw,46px);line-height:1.05}.hero-band p{margin:0;color:#ffffffdb;font-weight:700}.hero-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.metric-card,.panel{background:#fffffff0;border:1px solid rgba(255,255,255,.72);box-shadow:0 18px 40px #25556c24}.metric-card{min-height:126px;display:grid;gap:9px;padding:22px 24px;border-radius:18px;color:#182537}.metric-card span{color:#7a8795;font-weight:700}.metric-card strong{color:#237ea5;font-size:30px;line-height:1}.metric-card p{color:#182537;font-size:18px}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:26px}.quick-card{min-height:118px;border:0;border-radius:16px;padding:22px;display:grid;align-content:space-between;text-align:left;color:#fff;overflow:hidden;box-shadow:0 18px 36px #1c5d7e2e}.quick-card span{font-weight:800}.quick-card strong{font-size:22px}.quick-card.lime{background:linear-gradient(135deg,#9fd558,#6bd2bd)}.quick-card.teal{background:linear-gradient(135deg,#36a687,#66e3d1)}.quick-card.green{background:linear-gradient(135deg,#58ad43,#49c6b1)}.quick-card.blue{background:linear-gradient(135deg,#5dc0df,#2f75bd)}.content-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(360px,.7fr);gap:24px}.dashboard-promo-section{display:grid}.panel{border-radius:18px;padding:26px}.wide-panel{min-height:520px}.panel-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:18px;border-bottom:1px solid #e7eef2}.panel-header h1,.panel-header h2{margin:0}.panel-header p{margin:8px 0 0;color:#6b7888}.panel-header button{border:1px solid #b5dbe6;border-radius:10px;height:38px;padding:0 14px;color:#2c82a4;background:#fff;font-weight:800}.favorite-menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:18px;padding-top:26px}.favorite-menu button{min-height:104px;display:grid;justify-items:center;align-content:center;gap:12px;border:0;border-radius:16px;color:#334155;background:transparent;font-weight:800;text-align:center}.favorite-menu button span{width:60px;height:60px;display:grid;place-items:center;border-radius:16px;color:#2f8db4;background:linear-gradient(135deg,#b3f3df,#b9dcff)}.promo-list{display:grid;gap:14px;padding-top:22px}.promo-list.horizontal{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(320px,420px);overflow-x:auto;overflow-y:hidden;padding-bottom:10px;scroll-snap-type:x proximity}.promo-list.horizontal .promo-card{min-height:210px;scroll-snap-align:start}.promo-list.three{grid-template-columns:repeat(3,minmax(0,1fr))}.promo-card{min-height:112px;display:grid;align-content:center;gap:8px;padding:18px;border-radius:14px;color:#193045;background:linear-gradient(135deg,#54b554eb,#5fd7c4e6);overflow:hidden}.promo-card.tall{min-height:320px}.promo-card img{width:100%;max-height:180px;object-fit:cover;border-radius:10px}.promo-card strong{font-size:20px}.promo-card p{margin:0}.data-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:24px}.data-strip div{min-height:100px;display:grid;gap:10px;padding:20px;border-radius:14px;background:#f4fbfb}.data-strip span{color:#6f7d8c;font-weight:700}.data-strip strong{font-size:22px}.empty-state{margin-top:24px;padding:24px;border-radius:14px;background:#f8fbfd;color:#5e6d7d}.skeleton-stack{display:grid;gap:14px;margin-top:22px}.skeleton-stack span{height:62px;border-radius:14px;background:linear-gradient(90deg,#eef5f7,#f8fcfd,#eef5f7);background-size:200% 100%;animation:loadingShimmer 1.2s ease-in-out infinite}.record-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;margin-top:24px}.record-card{min-height:160px;display:grid;gap:16px;padding:22px;border:1px solid #e0eef2;border-radius:16px;background:linear-gradient(135deg,#fffffffa,#effcfaf5),#fff}button.record-card{width:100%;color:inherit;font:inherit;text-align:left}.clickable-card{cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.clickable-card:hover,.clickable-card.selected{transform:translateY(-2px);border-color:#62d7c7;box-shadow:0 18px 38px #24709229}.clickable-card.selected{background:linear-gradient(135deg,#eafffafa,#e2f5fffa),#fff}.record-card.large{min-height:230px}.record-card h2,.deduction-card h2,.bank-list h2{margin:0;color:#17384d;font-size:20px}.record-card p{margin:0;color:#68778a}.field-list{display:grid;gap:10px}.field-list div{display:flex;justify-content:space-between;gap:16px;padding-bottom:10px;border-bottom:1px solid #e8f0f3}.field-list span{color:#6d7b8b;font-weight:700}.field-list strong{min-width:0;text-align:right;color:#1f3448;overflow-wrap:anywhere}.filter-bar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(160px,240px) auto;gap:16px;align-items:end;margin-top:22px;padding:18px;border-radius:16px;background:#f5fbfc}.filter-bar.single{grid-template-columns:minmax(220px,320px)}.filter-bar.limit-filter{grid-template-columns:minmax(150px,220px) minmax(150px,220px) minmax(180px,260px)}.filter-bar label{display:grid;gap:8px;color:#314255;font-weight:800}.filter-bar select,.filter-bar input{height:44px;border:1px solid #d6e6eb;border-radius:12px;padding:0 12px;background:#fff;color:#182638;outline:none}.filter-bar select:focus,.filter-bar input:focus{border-color:#2f9ec0;box-shadow:0 0 0 4px #2f9ec01f}.compact-strip{margin-top:18px}.table-wrap{margin-top:22px;overflow-x:auto}table{width:100%;border-collapse:collapse;overflow:hidden;border-radius:14px;background:#fff}th,td{padding:15px 16px;border-bottom:1px solid #e8f0f3;text-align:left}th{color:#466277;background:#f4fbfc;font-size:13px;text-transform:uppercase}td{color:#243548}.danger-text{color:#d14343;font-weight:800}.success-text{color:#17865f;font-weight:800}.transaction-detail-items{display:grid;gap:4px;margin-top:8px;color:#667789;font-size:13px;line-height:1.35}.transaction-detail-items span{display:block}.table-action-button{min-height:34px;border:1px solid #b9dfe8;border-radius:10px;padding:0 12px;color:#287c9b;background:#f4fbfc;font-weight:800}.transaction-detail-row td{background:#f8fcfd}.transaction-detail-row p{margin:8px 0 0;color:#667789}.nested-table-wrap{margin-top:12px;overflow-x:auto}.nested-table{min-width:640px;border:1px solid #e0eef2;border-radius:12px}.nested-table th,.nested-table td{padding:11px 12px}.nested-table th{background:#edf8fa}.deduction-card{margin-top:24px;padding:24px;border:1px solid #e0eef2;border-radius:16px;background:#fff}.deduction-card>p{margin:6px 0 18px;color:#6b7888}.deduction-group{display:grid;gap:10px;padding:16px 0;border-top:1px solid #e8f0f3}.deduction-group h3{margin:0;color:#2b7b9b;font-size:14px}.deduction-group div{display:flex;justify-content:space-between;gap:18px}.deduction-group .subtotal{padding-top:10px;border-top:1px dashed #d5e5ea;font-weight:800}.bank-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.bank-list h2{flex-basis:100%}.bank-list span{padding:9px 12px;border:1px solid #cfe4eb;border-radius:999px;color:#2b6c84;background:#f2fbfb;font-weight:800}.limit-history-panel{margin-top:26px;padding-top:24px;border-top:1px solid #e6eef2}.profile-card{display:grid;grid-template-columns:120px minmax(0,1fr);gap:24px;margin-top:24px;align-items:start}.avatar.big{width:106px;height:106px;font-size:28px}.profile-page{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:24px}.profile-hero-card{min-height:520px;display:grid;justify-items:center;align-content:start;gap:12px;padding:42px 28px;border-radius:22px;color:#fff;background:linear-gradient(135deg,#2a86b5e6,#5bdbbee0),#2c98b8;box-shadow:0 22px 54px #22678433}.profile-avatar{width:118px;height:118px;margin-bottom:10px;font-size:30px;border:5px solid rgba(255,255,255,.78)}.profile-hero-card h1{margin:0;font-size:28px;text-align:center}.profile-hero-card p{margin:0 0 12px;color:#ffffffd1;font-weight:800}.profile-hero-card button,.scanner-header button,.scanner-error button,.scanner-result button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:1px solid rgba(255,255,255,.72);border-radius:12px;padding:0 16px;color:#1e6c88;background:#ffffffeb;font-weight:800}.profile-detail-panel{min-height:520px}.profile-list-web{display:grid;gap:12px;margin-top:22px}.profile-row-web{display:grid;grid-template-columns:34px minmax(150px,.6fr) minmax(0,1fr);align-items:center;gap:14px;min-height:58px;padding:12px 14px;border:1px solid #e0eef2;border-radius:14px;background:#fbfefe}.profile-row-web svg{color:#2c8dae}.profile-row-web span{color:#4a5d70;font-weight:800}.profile-row-web strong{text-align:right;overflow-wrap:anywhere}.edit-profile-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px;padding-top:22px;border-top:1px solid #e7eef2}.edit-profile-form label{display:grid;gap:8px;color:#314255;font-weight:800}.edit-profile-form label.wide{grid-column:1 / -1}.edit-profile-form input,.edit-profile-form textarea,.edit-profile-form select{width:100%;border:1px solid #d6e6eb;border-radius:12px;padding:11px 12px;color:#182638;background:#fff;outline:none}.edit-profile-form input:not([type=file]),.edit-profile-form select{height:44px}.edit-profile-form input:focus,.edit-profile-form textarea:focus,.edit-profile-form select:focus{border-color:#2f9ec0;box-shadow:0 0 0 4px #2f9ec01f}.edit-profile-form .form-error,.edit-profile-form .success-alert,.edit-profile-form .primary-button{grid-column:1 / -1}.success-alert{border-radius:12px;padding:11px 12px;color:#12765a;background:#ecfbf5;font-size:14px;font-weight:800}.coming-soon{display:grid;place-items:center;align-content:center;gap:12px;text-align:center}.coming-soon-icon{width:76px;height:76px;display:grid;place-items:center;border-radius:20px;color:#fff;font-weight:900;font-size:24px;background:linear-gradient(135deg,#2385b5,#59dec4)}.coming-soon h1{margin:0;font-size:34px}.coming-soon p{margin:0;color:#6b7888;font-weight:800}.scanner-page{min-height:calc(100vh - 160px);display:grid;grid-template-rows:auto 1fr;gap:18px}.scanner-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;border-radius:18px;background:#fffffff0;box-shadow:0 18px 40px #25556c24}.scanner-header h1{margin:0}.scanner-wrapper-web{position:relative;min-height:560px;overflow:hidden;border-radius:20px;background:#111827;box-shadow:0 22px 54px #1621323d}.scanner-video-web{width:100%;height:100%;min-height:560px;object-fit:cover}.scanner-overlay-web,.scanner-message,.scanner-error,.scanner-result{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:18px;color:#fff;text-align:center}.scanner-overlay-web{background:linear-gradient(180deg,#00000038,#0000005c)}.scan-frame-web{width:min(320px,64vw);aspect-ratio:1;border:4px solid #5ee5cf;border-radius:28px;box-shadow:0 0 0 999px #00000047,0 0 28px #5ee5cf6b}.scanner-message,.scanner-error,.scanner-result{padding:24px;background:#111827b8}.scanner-error p,.scanner-result p{max-width:520px;margin:0;overflow-wrap:anywhere}@keyframes spin{to{transform:rotate(360deg)}}@keyframes loadingShimmer{to{background-position:-200% 0}}@media(max-width:1120px){.app-shell{grid-template-columns:92px 1fr}.sidebar{width:92px}.sidebar .profile-text,.sidebar .menu-label-section,.sidebar .menu-button span{display:none}.sidebar .menu-button{justify-content:center;padding:0}.content-grid,.quick-grid{grid-template-columns:1fr 1fr}.topbar-user div:last-child,.search-box{display:none}}@media(max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;width:100%;height:auto;display:block;padding:16px}.sidebar-profile,.collapse-button,.menu-label-section{display:none}.menu-list{grid-auto-flow:column;grid-auto-columns:60px;overflow-x:auto}.topbar{border-radius:0;padding:12px 16px}.refresh-button{width:42px;padding:0;justify-content:center}.refresh-button{font-size:0}.page-content{padding:22px 16px 30px}.hero-band{padding:26px 20px}.hero-metrics,.quick-grid,.content-grid,.data-strip,.filter-bar,.profile-card,.profile-page,.promo-list.three{grid-template-columns:1fr}.field-list div,.deduction-group div{display:grid;gap:4px}.field-list strong,.deduction-group strong{text-align:left}.profile-row-web{grid-template-columns:28px 1fr}.profile-row-web strong{grid-column:2;text-align:left}.edit-profile-form{grid-template-columns:1fr}.scanner-wrapper-web,.scanner-video-web{min-height:460px}}