NeuroSprint/style.css at main · Yodapp/NeuroSprint · GitHub

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

html,body{margin:0;height:100%;overflow:hidden;
font-family:-apple-system,BlinkMacSystemFont,sans-serif;
background:linear-gradient(180deg,#F4F1EC,#E6DED2);
color:#1F1F1F;}

.screen{position:fixed;width:100%;height:100dvh;display:none;}
.screen.active{display:block;}

.card{background:white;border-radius:24px;
box-shadow:0 20px 50px rgba(0,0,0,0.12);
padding:40px 24px;max-width:420px;margin:auto;}

.center{display:flex;flex-direction:column;
justify-content:center;align-items:center;
height:100%;text-align:center;}

.primary.full{width:100%;height:60px;
background:#2F5D50;color:white;border:none;
border-radius:18px;font-size:18px;margin-top:24px;
box-shadow:0 8px 20px rgba(0,0,0,0.25);}

.topbar{display:flex;justify-content:space-between;
padding:20px;font-size:16px;}

.progress-container{height:18px;background:#DDD5C9;
margin:0 20px;border-radius:20px;}

.progress-bar{height:18px;width:0%;
background:linear-gradient(90deg,#2F5D50,#3E7C6B);
border-radius:20px;transition:width .25s ease;}

.game-area{display:flex;justify-content:center;
align-items:center;height:30vh;}

.symbol{font-size:150px;}

.halves{display:flex;height:40vh;}
.half{flex:1;display:flex;justify-content:center;
align-items:center;border:4px solid transparent;
transition:border .12s ease;}

.left{background:#D6E4DD;}
.right{background:#E0E0E0;}
.choice-symbol{font-size:56px;color:#1F1F1F;}

.correct{border:4px solid #2ECC71;}
.incorrect{border:4px solid #E74C3C;}

.result-card h1{font-size:48px;margin-bottom:8px;}
.avg{font-size:20px;font-weight:600;margin-top:8px;}