:root{--bg: #0d0d1a;--bg-2: #13132a;--bg-3: #1a1a35;--bg-4: #222244;--border: rgba(255,255,255,.08);--border-2: rgba(255,255,255,.14);--accent: #e94560;--accent-dim: rgba(233,69,96,.15);--accent-2: #f5a623;--success: #2ecc71;--warning: #f39c12;--danger: #e74c3c;--text: #f0f0f0;--text-2: #a0a0c0;--text-3: #606080;--font-ui: "Syne", sans-serif;--font-mono: "DM Mono", monospace;--radius: 12px;--radius-sm: 8px;--radius-lg: 18px;--nav-h: 64px;--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-ui);background:var(--bg);color:var(--text);min-height:100dvh;overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;background:none;font-family:inherit}input,textarea,select{font-family:inherit;background:none;border:none;color:inherit;outline:none}img{display:block;max-width:100%}#app{display:flex;flex-direction:column;min-height:100dvh}.page{flex:1;overflow-y:auto;padding-bottom:calc(var(--nav-h) + var(--safe-bottom) + 16px)}.top-bar{position:sticky;top:0;z-index:40;background:var(--bg);border-bottom:1px solid var(--border);padding:0 20px;height:56px;display:flex;align-items:center;justify-content:space-between;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.top-bar-title{font-size:18px;font-weight:700;letter-spacing:-.3px}.top-bar-logo{font-size:20px;font-weight:800;letter-spacing:-1px;color:var(--text)}.top-bar-logo span{color:var(--accent)}.top-bar-action{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text-2);transition:background .15s,color .15s}.top-bar-action:hover,.top-bar-action:active{background:var(--bg-3);color:var(--text)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:50;height:calc(var(--nav-h) + var(--safe-bottom));padding-bottom:var(--safe-bottom);background:var(--bg-2);border-top:1px solid var(--border);display:flex;align-items:stretch;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--text-3);font-size:10px;font-weight:600;letter-spacing:.3px;text-transform:uppercase;transition:color .15s;-webkit-tap-highlight-color:transparent;position:relative}.nav-item svg{width:22px;height:22px}.nav-item.active{color:var(--accent)}.nav-item.active:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:32px;height:2px;background:var(--accent);border-radius:0 0 2px 2px}.card{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.card+.card{margin-top:10px}.card-row{display:flex;justify-content:space-between;align-items:center}.card-label{font-size:10px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--text-3);margin-bottom:4px}.card-value{font-family:var(--font-mono);font-size:22px;font-weight:500;letter-spacing:-.5px}.card-value.large{font-size:28px}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 20px}.stat-card{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:14px}.stat-card .label{font-size:9px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text-3);margin-bottom:6px}.stat-card .value{font-family:var(--font-mono);font-size:20px;font-weight:500;letter-spacing:-.5px}.stat-card .value.accent{color:var(--accent)}.stat-card .value.success{color:var(--success)}.stat-card .value.warning{color:var(--warning)}.section-header{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 10px}.section-title{font-size:13px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--text-2)}.section-action{font-size:12px;font-weight:600;color:var(--accent)}.list-container{padding:0 20px}.list-item{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;display:flex;align-items:center;gap:12px;margin-bottom:8px;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent;cursor:pointer}.list-item:active{background:var(--bg-3);border-color:var(--border-2)}.list-item-icon{width:40px;height:40px;border-radius:10px;background:var(--bg-3);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--text-2)}.list-item-body{flex:1;min-width:0}.list-item-title{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-item-sub{font-size:12px;color:var(--text-2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-item-right{text-align:right;flex-shrink:0}.list-item-amount{font-family:var(--font-mono);font-size:14px;font-weight:500}.list-item-date{font-size:11px;color:var(--text-3);margin-top:2px}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}.badge-draft{background:var(--bg-4);color:var(--text-2)}.badge-in_progress{background:#f39c1226;color:var(--warning)}.badge-completed{background:#2ecc7126;color:var(--success)}.badge-submitted{background:#e9456026;color:var(--accent)}.badge-paid{background:#2ecc7133;color:var(--success);border:1px solid rgba(46,204,113,.3)}.badge-pending{background:#f5a62326;color:var(--accent-2)}.form-group{margin-bottom:16px}.form-label{display:block;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--text-2);margin-bottom:6px}.form-input,.form-select,.form-textarea{width:100%;background:var(--bg-3);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;color:var(--text);transition:border-color .15s;-moz-appearance:none;appearance:none;-webkit-appearance:none}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent)}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-3)}.form-textarea{resize:vertical;min-height:80px;line-height:1.5}.form-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23606080' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}.form-hint{font-size:11px;color:var(--text-3);margin-top:4px}.form-error{font-size:11px;color:var(--accent);margin-top:4px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 20px;border-radius:var(--radius-sm);font-family:var(--font-ui);font-size:14px;font-weight:700;letter-spacing:.3px;transition:all .15s;-webkit-tap-highlight-color:transparent;cursor:pointer;white-space:nowrap}.btn:disabled{opacity:.4;pointer-events:none}.btn-primary{background:var(--accent);color:#fff}.btn-primary:active{background:#c73a52}.btn-secondary{background:var(--bg-3);color:var(--text);border:1px solid var(--border)}.btn-secondary:active{background:var(--bg-4)}.btn-ghost{background:transparent;color:var(--text-2)}.btn-ghost:active{color:var(--text)}.btn-danger{background:#e74c3c26;color:var(--danger);border:1px solid rgba(231,76,60,.2)}.btn-full{width:100%}.btn-sm{padding:8px 14px;font-size:12px}.fab{position:fixed;bottom:calc(var(--nav-h) + var(--safe-bottom) + 16px);right:20px;width:52px;height:52px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #e9456066;z-index:30;transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}.fab:active{transform:scale(.94);box-shadow:0 2px 12px #e945604d}.fab svg{width:22px;height:22px}.sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:60;opacity:0;transition:opacity .25s;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.sheet-overlay.visible{opacity:1}.sheet{position:fixed;bottom:0;left:0;right:0;z-index:61;background:var(--bg-2);border-radius:var(--radius-lg) var(--radius-lg) 0 0;border:1px solid var(--border);border-bottom:none;padding-bottom:calc(16px + var(--safe-bottom));transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);max-height:92dvh;overflow-y:auto}.sheet.visible{transform:translateY(0)}.sheet-handle{width:36px;height:4px;border-radius:2px;background:var(--border-2);margin:12px auto 0}.sheet-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 12px;border-bottom:1px solid var(--border)}.sheet-title{font-size:16px;font-weight:700}.sheet-close{width:32px;height:32px;border-radius:50%;background:var(--bg-3);display:flex;align-items:center;justify-content:center;color:var(--text-2)}.sheet-body{padding:20px}.sheet-footer{padding:12px 20px 0;display:flex;gap:10px}#toast-container{position:fixed;top:64px;left:50%;transform:translate(-50%);z-index:100;display:flex;flex-direction:column;gap:8px;pointer-events:none;width:calc(100% - 40px);max-width:380px}.toast{background:var(--bg-3);border:1px solid var(--border-2);border-radius:var(--radius-sm);padding:12px 16px;font-size:13px;font-weight:500;display:flex;align-items:center;gap:10px;animation:toast-in .25s ease;pointer-events:all}.toast.success{border-color:#2ecc7166}.toast.error{border-color:#e9456066;color:#ff6b80}.toast.warning{border-color:#f39c1266}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.sync-bar{background:#e945601a;border-bottom:1px solid rgba(233,69,96,.2);padding:8px 20px;font-size:12px;color:var(--accent);display:flex;align-items:center;gap:8px;font-weight:600}.sync-bar.syncing{color:var(--accent-2);background:#f5a62314;border-color:#f5a62333}.sync-dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}.sync-bar.syncing .sync-dot{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.auth-page{min-height:100dvh;display:flex;flex-direction:column;justify-content:center;padding:40px 28px;background:var(--bg)}.auth-logo{font-size:32px;font-weight:800;letter-spacing:-1.5px;margin-bottom:6px}.auth-logo span{color:var(--accent)}.auth-tagline{font-size:14px;color:var(--text-2);margin-bottom:40px}.auth-toggle{text-align:center;margin-top:20px;font-size:13px;color:var(--text-2)}.auth-toggle a{color:var(--accent);font-weight:600}.dash-hero{padding:20px 20px 0}.dash-greeting{font-size:13px;color:var(--text-2);margin-bottom:4px}.dash-name{font-size:24px;font-weight:800;letter-spacing:-.5px}.divider{height:1px;background:var(--border);margin:16px 0}.text-muted{color:var(--text-2)}.text-small{font-size:12px}.text-mono{font-family:var(--font-mono)}.text-accent{color:var(--accent)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mb-16{margin-bottom:16px}.flex{display:flex}.flex-between{display:flex;justify-content:space-between;align-items:center}.gap-8{gap:8px}.pad-20{padding:0 20px}.pad-page{padding:16px 20px}.empty-state{text-align:center;padding:60px 40px;color:var(--text-3)}.empty-state-icon{font-size:40px;margin-bottom:12px;opacity:.5}.empty-state-title{font-size:16px;font-weight:600;color:var(--text-2);margin-bottom:6px}.empty-state-body{font-size:13px;line-height:1.5}.filter-tabs{display:flex;gap:6px;padding:12px 20px;overflow-x:auto;scrollbar-width:none}.filter-tabs::-webkit-scrollbar{display:none}.filter-tab{flex-shrink:0;padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;color:var(--text-2);background:var(--bg-2);border:1px solid var(--border);transition:all .15s}.filter-tab.active{background:var(--accent-dim);border-color:#e945604d;color:var(--accent)}.spinner{width:24px;height:24px;border:2px solid var(--border-2);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;margin:40px auto}@keyframes spin{to{transform:rotate(360deg)}}.detail-header{padding:16px 20px;border-bottom:1px solid var(--border)}.detail-ref{font-family:var(--font-mono);font-size:13px;color:var(--text-2);margin-bottom:4px}.detail-title{font-size:20px;font-weight:700;letter-spacing:-.3px}.detail-meta{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}.inline-section{padding:0 20px;margin-top:16px}.inline-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.inline-section-title{font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--text-3)}.inline-item{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.inline-item-left{flex:1;min-width:0}.inline-item-title{font-size:13px;font-weight:600}.inline-item-sub{font-size:11px;color:var(--text-2);margin-top:2px}.inline-item-right{text-align:right;flex-shrink:0}.inline-item-amount{font-family:var(--font-mono);font-size:13px}.inline-item-actions{display:flex;gap:6px;margin-top:6px;justify-content:flex-end}.status-steps{display:flex;align-items:center;padding:16px 20px;gap:0;overflow-x:auto;scrollbar-width:none}.status-steps::-webkit-scrollbar{display:none}.status-step{display:flex;flex-direction:column;align-items:center;gap:4px;flex-shrink:0}.step-dot{width:10px;height:10px;border-radius:50%;background:var(--bg-4);border:2px solid var(--bg-4);transition:all .2s}.step-dot.done{background:var(--success);border-color:var(--success)}.step-dot.active{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.step-label{font-size:9px;font-weight:600;letter-spacing:.3px;color:var(--text-3);text-transform:uppercase}.step-label.active{color:var(--accent)}.step-label.done{color:var(--success)}.step-line{flex:1;height:2px;background:var(--bg-4);min-width:20px;margin-bottom:14px;transition:background .2s}.step-line.done{background:var(--success)}