1/**
2 * Vite 프로젝트 스타일
3 */
4
5:root {
6 --primary-color: #646cff;
7 --primary-hover: #535bf2;
8 --bg-color: #242424;
9 --text-color: rgba(255, 255, 255, 0.87);
10}
11
12* {
13 margin: 0;
14 padding: 0;
15 box-sizing: border-box;
16}
17
18body {
19 font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
20 min-height: 100vh;
21 display: flex;
22 justify-content: center;
23 align-items: center;
24 background-color: var(--bg-color);
25 color: var(--text-color);
26}
27
28#app {
29 text-align: center;
30 padding: 2rem;
31}
32
33h1 {
34 font-size: 3rem;
35 margin-bottom: 1rem;
36 background: linear-gradient(135deg, var(--primary-color), #a855f7);
37 -webkit-background-clip: text;
38 -webkit-text-fill-color: transparent;
39}
40
41p {
42 margin-bottom: 2rem;
43 color: #888;
44}
45
46button {
47 padding: 0.8rem 1.6rem;
48 font-size: 1rem;
49 font-weight: 500;
50 background-color: var(--primary-color);
51 color: white;
52 border: none;
53 border-radius: 8px;
54 cursor: pointer;
55 transition: all 0.25s;
56}
57
58button:hover {
59 background-color: var(--primary-hover);
60 transform: translateY(-2px);
61}
62
63button:active {
64 transform: translateY(0);
65}