55 lines
1.2 KiB
CSS
55 lines
1.2 KiB
CSS
/* Global element defaults; everything else is scoped to modules. */
|
|
:global(*),
|
|
:global(*::before),
|
|
:global(*::after) {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
:global(body) {
|
|
margin: 0;
|
|
}
|
|
|
|
.app {
|
|
/* Design tokens, inherited by all components. */
|
|
--bg: #0f0c24;
|
|
--bg-elevated: #1a1640;
|
|
--bg-sunken: #0a081a;
|
|
--surface: #231d52;
|
|
--border: #3a3278;
|
|
--text: #ece9ff;
|
|
--text-muted: #a49fcc;
|
|
--accent: #8b6cff;
|
|
--accent-strong: #a58cff;
|
|
--gold: #ffd166;
|
|
--danger: #ff6b7a;
|
|
--success: #4fd18b;
|
|
--suit-red: #e5484d;
|
|
--suit-yellow: #f2b90d;
|
|
--suit-green: #2fa46c;
|
|
--suit-blue: #3e7bfa;
|
|
--radius: 12px;
|
|
--shadow: 0 10px 30px rgb(0 0 0 / 35%);
|
|
--font: system-ui, 'Segoe UI', Roboto, sans-serif;
|
|
|
|
min-height: 100vh;
|
|
min-height: 100dvh;
|
|
background:
|
|
radial-gradient(ellipse at top, rgb(109 74 255 / 25%), transparent 60%),
|
|
radial-gradient(ellipse at bottom, rgb(255 209 102 / 8%), transparent 60%),
|
|
var(--bg);
|
|
color: var(--text);
|
|
font: 16px/1.45 var(--font);
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
.banner {
|
|
position: fixed;
|
|
inset: 0 0 auto;
|
|
z-index: 50;
|
|
padding: 8px 16px;
|
|
background: #5b2330;
|
|
color: #ffe1e6;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
}
|