Repository Public
1@import 'tailwindcss';23@theme inline {4 --color-bg: var(--bg);5 --color-surface: var(--surface);6 --color-elev: var(--elev);7 --color-line: var(--line);8 --color-ink: var(--ink);9 --color-mute: var(--mute);10 --color-emerald: var(--emerald);11 --color-blue: var(--blue);12 --color-warn: var(--warn);13 --color-danger: var(--danger);14 --color-primary: var(--primary);15 --color-onprimary: var(--onprimary);16 --font-sans: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', 'Segoe UI', system-ui, sans-serif;17 --font-display: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', 'Segoe UI', system-ui, sans-serif;18 --font-mono: ui-monospace, 'SF Mono', Menlo, monospace;19}2021:root, [data-theme='light'] {22 --bg: #f4f6fb; --surface: #ffffff; --elev: #eef1f7; --line: rgba(15, 23, 42, 0.08); --ink: #0b1020; --mute: #667085;23 --emerald: #0a9d70; --blue: #2f66f5; --warn: #b4690e; --danger: #d43d51; --primary: #0b1020; --onprimary: #ffffff;24 --card-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px -12px rgba(15, 23, 42, 0.12);25 --nav-bg: rgba(255, 255, 255, 0.86);26 color-scheme: light;27}28[data-theme='dark'] {29 --bg: #080b12; --surface: #111725; --elev: #1a2336; --line: rgba(247, 249, 252, 0.08); --ink: #f7f9fc; --mute: #8b97b0;30 --emerald: #35e7ac; --blue: #6d9aff; --warn: #f4b65b; --danger: #f26d79; --primary: #35e7ac; --onprimary: #04130d;31 --card-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;32 --nav-bg: rgba(10, 14, 23, 0.86);33 color-scheme: dark;34}3536/* base rules live in the base layer so utilities (text-*, bg-*) can override them */37@layer base {38html, body, #root { height: 100%; }39body {40 margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-sans); font-size: 15px; line-height: 1.45;41 -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none;42 font-variant-numeric: tabular-nums; letter-spacing: -0.005em;43}44h1, h2, h3 { font-family: var(--font-display); }45button, input, select, textarea { font: inherit; color: inherit; }46input, select, textarea { font-size: 16px; } /* prevents iOS zoom on focus */47button { cursor: pointer; }48:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; border-radius: 8px; }49}50.safe-b { padding-bottom: max(env(safe-area-inset-bottom), 10px); }51.safe-t { padding-top: env(safe-area-inset-top); }52.card { background: var(--surface); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--card-shadow); }53.nav-glass { background: var(--nav-bg); -webkit-backdrop-filter: saturate(180%) blur(18px); backdrop-filter: saturate(180%) blur(18px); }54/* the balance card is always dark: it reads as a physical card in both themes */55.hero {56 position: relative; overflow: hidden; border-radius: 28px; color: #f7f9fc;57 background: radial-gradient(90% 120% at 100% 0%, rgba(77, 131, 255, 0.55), transparent 60%),58 radial-gradient(80% 110% at 0% 100%, rgba(53, 231, 172, 0.38), transparent 55%), linear-gradient(145deg, #131c33, #070a12 70%);59 box-shadow: 0 24px 48px -24px rgba(19, 28, 51, 0.65);60}61.hero::after { content: ''; position: absolute; inset: 0; border-radius: inherit; border: 1px solid rgba(255, 255, 255, 0.1); pointer-events: none; }62.hero-btn { background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.16); color: #fff; }63.hero-btn-main { background: #ffffff; color: #0b1020; }64.mask { filter: blur(10px); user-select: none; }65.no-scrollbar { scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; }66@keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }67/* `backwards`, not `both`: a filled transform keeps a stacking context on <main>, which trapped every sheet (position: fixed, z-30) under the bottom navigation */68.rise { animation: rise 0.26s cubic-bezier(0.2, 0.7, 0.2, 1) backwards; }69@keyframes spin { to { transform: rotate(360deg); } }70.spin { animation: spin 0.9s linear infinite; }71@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }72.pulse-dot { animation: pulse-dot 1.4s ease-in-out infinite; }73@media (prefers-reduced-motion: reduce) { .rise, .spin, .pulse-dot { animation: none; } * { transition: none !important; } }74