File size: 1,343 Bytes
23b413b | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | @tailwind base;
@tailwind components;
@tailwind utilities;
:root {
--bg: 0 0% 4%;
--fg: 0 0% 98%;
/* Persona thumbnails */
--hp-persona-thumb-sm: 48px;
--hp-persona-thumb-md: 72px;
--hp-persona-thumb-lg: 88px;
--hp-persona-thumb-xl: 112px;
/* Focus ring */
--hp-focus-ring: rgba(168, 85, 247, 0.55);
}
/* Persona thumbnail utilities */
.hp-persona-thumb {
width: var(--hp-persona-thumb-lg);
height: var(--hp-persona-thumb-lg);
border-radius: 14px;
overflow: hidden;
}
.hp-persona-thumb--md {
width: var(--hp-persona-thumb-md);
height: var(--hp-persona-thumb-md);
}
.hp-persona-thumb--xl {
width: var(--hp-persona-thumb-xl);
height: var(--hp-persona-thumb-xl);
}
body {
background: hsl(var(--bg));
color: hsl(var(--fg));
font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
font-feature-settings: "liga" 1, "calt" 1;
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.10); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.18); }
@keyframes fadeIn {
from { opacity: 0; transform: translateY(2px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes accountMenuIn {
from { opacity: 0; transform: translateY(8px) scale(0.97); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
|