1 files changed, 21 insertions, 21 deletions

diff --git a/web/static/style.css b/web/static/style.css
index fe686a2..70a0c70 100644
--- a/web/static/style.css
+++ b/web/static/style.css
@@ -22,7 +22,7 @@ div#main {
 	display: grid;
 	grid-template-columns: 1fr;
 	grid-template-rows: min-content min-content 2fr 2fr;
-	grid-template-areas: "settings-bar" "rem-bar" "match" "keypad";
+	grid-template-areas: "settings-bar" "rem-bar" "visits" "keypad";
 }
 
 div#keypad {
@@ -66,7 +66,7 @@ div#rem-bar {
 	grid-template-columns: repeat(2, 1fr);
 }
 
-div#p1-state, div#p2-state {
+div#p1-info, div#p2-info {
 	background-color: #222;
 	font-size: 1.5em;
 
@@ -78,7 +78,7 @@ div#p1-state, div#p2-state {
 	align-items: center;
 }
 
-div#p1-state.active, div#p2-state.active {
+div#p1-info.active, div#p2-info.active {
 	background-color: #2a390a;
 }
 
@@ -122,24 +122,24 @@ div#prompt-container {
 	justify-content: center;
 }
 
-div#prompt-msg, div#prompt, div#prompt-sugg {
+div#prompt-msg-l, div#prompt-input, div#prompt-msg-r {
 	font-size: 1.5em;
 
 	display: grid;
 	align-items: center;
 }
 
-div#prompt-msg, div#prompt-sugg {
+div#prompt-msg-l, div#prompt-msg-r {
 	flex: 1;
 	color: #aaa;
 	padding: 0 0.4rem;
 }
 
-div#prompt-sugg {
+div#prompt-msg-r {
 	text-align: right;
 }
 
-div#prompt {
+div#prompt-input {
 	text-align: center;
 	font-size: 3em;
 	width: 4ch;
@@ -249,8 +249,8 @@ div#settings-bar div.help-button:active {
 	background-color: #6e41b8;
 }
 
-div#match {
-	grid-area: match;
+div#visits {
+	grid-area: visits;
 
 	background-color: #222;
 	font-size: clamp(1.5vh, 2vw, 2vh);
@@ -266,7 +266,7 @@ div#match {
 	grid-row-gap: 0.3em;
 }
 
-div#match div {
+div#visits div {
 	font-size: 2em;
 
 	min-width: 0;
@@ -276,17 +276,17 @@ div#match div {
 	justify-content: center;
 }
 
-div#match .visit-col1 { grid-column: 2; }
-div#match .visit-col3 { color: #888; grid-column: 4; }
-div#match .p0 { color: #f00; font-weight: bold; }
-div#match .p1 { color: #f00; }
-div#match .p20 { color: #f60; }
-div#match .p40 { color: #fa0; }
-div#match .p60 { color: #dd0; }
-div#match .p100 { color: #2c2; }
-div#match .p140 { color: #0f0; }
-div#match .p180 { color: #0f0; font-weight: bold; }
-div#match .visit-col6 { color: #888; justify-content: left; font-family: monospace; white-space: pre; }
+div#visits .visit-col1 { grid-column: 2; }
+div#visits .visit-col3 { color: #888; grid-column: 4; }
+div#visits .p0 { color: #f00; font-weight: bold; }
+div#visits .p1 { color: #f00; }
+div#visits .p20 { color: #f60; }
+div#visits .p40 { color: #fa0; }
+div#visits .p60 { color: #dd0; }
+div#visits .p100 { color: #2c2; }
+div#visits .p140 { color: #0f0; }
+div#visits .p180 { color: #0f0; font-weight: bold; }
+div#visits .visit-col6 { color: #888; justify-content: left; font-family: monospace; white-space: pre; }
 
 .modal {
 	background-color: rgba(0, 0, 0, 0.6);