:root{--color-bg: #faf3e8;--color-surface: #fffaf2;--color-border: #e8dcc8;--color-text: #3a2c22;--color-text-muted: #8a7860;--color-accent: #b5502e;--color-accent-dark: #8f3d21;--color-secondary: #8a8f52;--color-amber: #e0a458;--color-danger: #b23b3b;--color-success: #4c7a4c;--radius-md: 14px;--radius-lg: 22px;--shadow-card: 0 2px 10px rgba(58, 44, 34, .08);--font-main: "Onest", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-main);-webkit-font-smoothing:antialiased;touch-action:manipulation}#app{max-width:480px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:16px;margin:12px 16px}.quote-banner{margin:16px;padding:20px;background:linear-gradient(180deg,var(--color-surface),#fbf4e6);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-style:italic;color:var(--color-text);font-size:15px;line-height:1.5}.quote-banner .quote-meta{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-style:normal}.quote-banner .quote-meta span{font-size:12px;color:var(--color-text-muted)}.quote-banner .quote-meta a{font-size:12px;font-weight:600}h1,h2,h3{margin:0 0 8px;color:var(--color-accent-dark)}.btn{display:inline-block;border:none;border-radius:var(--radius-md);padding:10px 18px;font-size:15px;font-weight:600;cursor:pointer;background:var(--color-accent);color:#fff}.btn:active{background:var(--color-accent-dark)}.btn.secondary{background:var(--color-secondary)}.btn.ghost{background:transparent;color:var(--color-accent);border:1px solid var(--color-accent)}input,select,textarea{width:100%;padding:9px 10px;border:1px solid var(--color-border);border-radius:10px;font-size:15px;background:#fff;color:var(--color-text);font-family:inherit;margin-bottom:10px}label{font-size:13px;color:var(--color-text-muted);display:block;margin-bottom:4px}.status-pill{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;padding:3px 9px;border-radius:999px;border:1px solid transparent;white-space:nowrap}.status-pill .status-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0}.chip-row{display:flex;gap:8px;flex-wrap:wrap}.chip{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:12px;font-weight:600;padding:7px 12px;border-radius:999px;cursor:pointer}.chip.selected{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.chip.chip-add{color:var(--color-text-muted)}.toggle-row{display:flex;gap:8px}.toggle-btn{flex:1;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:12px;font-weight:600;padding:9px;border-radius:10px;cursor:pointer}.toggle-btn.selected{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#3a2c2259;display:flex;align-items:flex-end;justify-content:center;z-index:40}.sheet-panel{width:100%;max-width:480px;max-height:88vh;background:var(--color-bg);border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:0 -8px 24px #3a2c2233;display:flex;flex-direction:column;overflow:hidden}.sheet-header{flex:none;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--color-border)}.sheet-header .sheet-title{font-size:15px;font-weight:700;color:var(--color-text)}.sheet-close{border:none;background:#f4ebda;color:var(--color-text);width:28px;height:28px;border-radius:50%;font-size:14px;cursor:pointer}.sheet-body{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:14px}.sheet-footer{flex:none;padding:14px 18px;border-top:1px solid var(--color-border);background:var(--color-surface)}.field-label{font-size:11px;font-weight:600;color:var(--color-text-muted);margin-bottom:6px}.app-bar{flex:none;display:flex;align-items:center;justify-content:space-between;padding:14px 18px 12px;border-bottom:1px solid var(--color-border);background:var(--color-bg);position:sticky;top:0;z-index:10}.app-bar-left{display:flex;align-items:center;gap:10px}.menu-btn{width:34px;height:34px;border:none;background:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.menu-btn span{width:18px;height:2px;background:var(--color-text);border-radius:1px}.avatar-circle{width:34px;height:34px;border-radius:50%;color:#fffaf2;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}.app-bar-title{font-size:15px;font-weight:700;color:var(--color-text)}.app-bar-date{font-size:11px;color:var(--color-text-muted)}.online-chip{border:1px solid;font-size:11px;font-weight:600;padding:6px 10px;border-radius:999px;display:flex;align-items:center;gap:6px;background:none;cursor:default}.online-chip .dot{width:6px;height:6px;border-radius:50%}.drawer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#3a2c2259;display:flex;z-index:45}.drawer-panel{width:78%;max-width:280px;height:100%;background:var(--color-surface);box-shadow:4px 0 20px #3a2c2226;padding:20px 0;display:flex;flex-direction:column}.drawer-heading{font-size:13px;font-weight:700;color:var(--color-text-muted);padding:0 20px 14px;border-bottom:1px solid var(--color-border);margin-bottom:8px}.drawer-item{display:flex;align-items:center;gap:10px;padding:13px 20px;background:none;border:none;cursor:pointer;text-align:left;width:100%}.drawer-item .dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.drawer-item span.label{font-size:14px;font-weight:600}.pin-dots{display:flex;gap:14px}.pin-dots.shake{animation:shake .3s}.pin-dot{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--color-border)}.pin-keypad{display:grid;grid-template-columns:repeat(3,64px);gap:14px}.pin-key{height:64px;border-radius:16px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:20px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center}.pin-key.empty{visibility:hidden;cursor:default}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}75%{transform:translate(6px)}}.tabs{display:flex;gap:6px;margin:12px 16px 0;overflow-x:auto}.tabs button{flex:none;padding:8px 13px;border-radius:999px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer}.tabs button.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--color-border)}.row:last-child{border-bottom:none}.offline-banner{background:var(--color-danger);color:#fff;text-align:center;font-size:13px;padding:8px 18px}.confetti-piece{position:fixed;top:-10px;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:999}.success-toast{position:fixed;top:40%;left:50%;transform:translate(-50%,-50%);background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;padding:16px 22px;box-shadow:0 8px 24px #3a2c2233;text-align:center;font-size:14px;font-weight:700;color:var(--color-text);z-index:1000}[data-numeric]{font-variant-numeric:tabular-nums}