:root{--primary: #10b981;--primary-dark: #059669;--bg: #0b0f1a;--card-bg: rgba(30, 41, 59, .7);--text: #f8fafc;--text-muted: #94a3b8;--success: #10b981;--warning: #f59e0b;--border: rgba(255, 255, 255, .1);--nav-height: 76px;--glass: blur(12px) saturate(180%)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;transition:all .2s ease-in-out}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg);background-image:radial-gradient(at 0% 0%,rgba(16,185,129,.1) 0px,transparent 50%),radial-gradient(at 100% 100%,rgba(16,185,129,.05) 0px,transparent 50%);color:var(--text);line-height:1.6;overflow-x:hidden}.app-shell{display:flex;flex-direction:column;min-height:100vh;padding-bottom:calc(var(--nav-height) + env(safe-area-inset-bottom) + 20px)}main{flex:1;padding:24px;max-width:600px;margin:0 auto;width:100%}h1{font-size:28px;font-weight:800;margin-bottom:8px;background:linear-gradient(to right,#10b981,#34d399);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.card{background:var(--card-bg);backdrop-filter:var(--glass);-webkit-backdrop-filter:var(--glass);border-radius:20px;padding:24px;margin-bottom:20px;border:1px solid var(--border);box-shadow:0 10px 15px -3px #0000001a}.btn{display:flex;align-items:center;justify-content:center;height:56px;border-radius:28px;border:none;font-size:16px;font-weight:700;cursor:pointer;width:100%;box-shadow:0 4px 6px -1px #0000001a}.btn:active{transform:scale(.96)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff}.btn-outline{background:#10b9811a;border:1px solid var(--primary);color:var(--primary)}.nav-bar{position:fixed;bottom:20px;left:20px;right:20px;height:var(--nav-height);background:#1e293bcc;backdrop-filter:var(--glass);-webkit-backdrop-filter:var(--glass);border-radius:24px;border:1px solid var(--border);display:flex;justify-content:space-around;align-items:center;padding:0 10px;box-shadow:0 20px 25px -5px #0003;z-index:1000}.nav-item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--text-muted);font-size:10px;font-weight:600;padding:8px;border-radius:16px;flex:1}.nav-item.active{color:var(--primary);background:#10b9811a}.nav-icon{width:24px;height:24px;margin-bottom:4px;fill:currentColor}.badge{padding:4px 8px;border-radius:99px;font-size:12px;font-weight:600}.badge-pending{background:#451a03;color:#fbbf24}.badge-synced{background:#064e3b;color:#34d399}.status-msg{text-align:center;font-size:14px;margin-top:8px;color:var(--success)}