:root{--bg: #0a0a0f;--bg-card: rgba(255,255,255,.03);--bg-card-hover: rgba(255,255,255,.06);--border: rgba(255,255,255,.06);--border-active: rgba(255,255,255,.14);--text: #e8e8ed;--text-dim: #888;--text-faint: #555;--accent: #6366f1;--accent-light: #818cf8;--accent-bg: rgba(99,102,241,.1);--accent-border: rgba(99,102,241,.25);--green: #22c55e;--green-bg: rgba(34,197,94,.08);--green-border: rgba(34,197,94,.2);--red: #f87171;--red-bg: rgba(239,68,68,.06);--red-border: rgba(239,68,68,.15);--yellow: #eab308;--font: "Outfit", -apple-system, sans-serif;--mono: "JetBrains Mono", monospace;--radius: 12px;--radius-sm: 8px}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.shell{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:480px;margin:0 auto;overflow:hidden}input,select{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;outline:none;width:100%;transition:border-color .2s}input:focus,select:focus{border-color:var(--accent)}input::placeholder{color:var(--text-faint)}.btn{font-family:var(--font);font-size:14px;font-weight:500;padding:12px 20px;border-radius:var(--radius);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;transition:all .15s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff}.btn-secondary{background:var(--bg-card);border:1px solid var(--border);color:var(--text-dim)}.btn-danger{background:var(--red-bg);border:1px solid var(--red-border);color:var(--red)}.btn-small{padding:8px 14px;font-size:12px;width:auto}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px;transition:all .2s}.card:hover{background:var(--bg-card-hover);border-color:var(--border-active)}.page{display:flex;flex-direction:column;height:100%;overflow:hidden}.page-header{padding:12px 16px;display:flex;align-items:center;gap:12px;flex-shrink:0;border-bottom:1px solid var(--border)}.page-header h1{font-size:17px;font-weight:600;flex:1}.page-body{flex:1;overflow-y:auto;padding:16px}.page-footer{flex-shrink:0;padding:12px 16px;border-top:1px solid var(--border)}.logo-mark{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#4f46e5,#7c3aed);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;color:#fff;flex-shrink:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .3s ease-out}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}