:root{--c-bg: #f4f5f7;--c-surface: #ffffff;--c-primary: #0ea5e9;--c-primary-d: #0284c7;--c-text: #0f172a;--c-muted: #64748b;--c-border: #e2e8f0;--c-success: #16a34a;--c-warning: #d97706;--c-danger: #dc2626;--r-sm: 8px;--r-md: 12px;--r-lg: 16px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--tabbar-h: 56px;--appbar-h: 52px;--font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif}*{box-sizing:border-box}body{font-family:var(--font);color:var(--c-text);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}button,a.btn,.tap{min-height:44px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);border:none;border-radius:var(--r-md);background:var(--c-primary);color:#fff;font:600 16px var(--font);padding:0 var(--sp-5);cursor:pointer;transition:transform .08s ease,background .15s ease}.btn:active{transform:scale(.97);background:var(--c-primary-d)}.btn[disabled]{opacity:.55;pointer-events:none}.btn-block{width:100%}.app-shell{min-height:100dvh;padding-bottom:calc(var(--tabbar-h) + var(--safe-bottom))}.appbar{position:sticky;top:0;z-index:20;height:calc(var(--appbar-h) + var(--safe-top));padding-top:var(--safe-top);display:flex;align-items:center;justify-content:center;background:var(--c-surface);border-bottom:1px solid var(--c-border);font-weight:600;font-size:17px}.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;height:calc(var(--tabbar-h) + var(--safe-bottom));padding-bottom:var(--safe-bottom);display:flex;background:var(--c-surface);border-top:1px solid var(--c-border)}.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:var(--c-muted);font-size:11px;transition:color .15s ease}.tabbar a.active{color:var(--c-primary)}.tabbar .ico{font-size:22px;line-height:1}.list{padding:var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-3)}.card{background:var(--c-surface);border-radius:var(--r-md);padding:var(--sp-4);box-shadow:0 1px 2px #0f172a0f}.row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}.muted{color:var(--c-muted);font-size:13px}.amount{font-variant-numeric:tabular-nums;font-weight:600}.badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600}.badge-paid{background:#dcfce7;color:var(--c-success)}.badge-unpaid{background:#fef3c7;color:var(--c-warning)}.badge-draft{background:#e2e8f0;color:var(--c-muted)}.sk{background:linear-gradient(90deg,#eef1f5 25%,#e2e8f0 37%,#eef1f5 63%);background-size:400% 100%;animation:sk 1.2s ease infinite;border-radius:var(--r-sm)}@keyframes sk{0%{background-position:100% 50%}to{background-position:0 50%}}.input{width:100%;height:48px;border:1px solid var(--c-border);border-radius:var(--r-md);padding:0 var(--sp-4);font-size:16px;background:var(--c-surface);color:var(--c-text)}.input:focus{outline:2px solid var(--c-primary);border-color:transparent}