From 66362f1e1d52bb8ec0c050f377a20f91db0b78fe Mon Sep 17 00:00:00 2001
From: Rintim <rintim@foxmail.com>
Date: Tue, 16 Apr 2024 02:48:58 +0800
Subject: [PATCH] pref: format @/theme.

---
 theme/music/style.css             | 158 +++++++++--------
 theme/simple/style.css            | 202 +++++++++++----------
 theme/style/card/custom.css       |  50 +++---
 theme/style/card/music.css        |  24 +--
 theme/style/card/new.css          |  52 +++---
 theme/style/card/ol.css           |  53 +++---
 theme/style/card/simple.css       |  52 +++---
 theme/style/card/wood.css         |  24 +--
 theme/style/cardback/custom.css   |   9 +-
 theme/style/cardback/feicheng.css |  13 +-
 theme/style/cardback/liusha.css   |  13 +-
 theme/style/cardback/music.css    |  11 +-
 theme/style/cardback/new.css      |  13 +-
 theme/style/cardback/official.css |  13 +-
 theme/style/cardback/ol.css       |  13 +-
 theme/style/cardback/wood.css     |  11 +-
 theme/style/hp/custom.css         | 101 ++++++-----
 theme/style/hp/emotion.css        | 109 ++++++------
 theme/style/hp/glass.css          | 109 ++++++------
 theme/style/hp/official.css       | 103 ++++++-----
 theme/style/hp/ol.css             | 113 ++++++------
 theme/style/hp/round.css          | 109 ++++++------
 theme/style/hp/xinglass.css       | 109 ++++++------
 theme/style/hp/xinround.css       | 109 ++++++------
 theme/woodden/style.css           | 279 +++++++++++++++++-------------
 25 files changed, 1004 insertions(+), 848 deletions(-)

diff --git a/theme/music/style.css b/theme/music/style.css
index aa0ee1a32..6c90e91fd 100644
--- a/theme/music/style.css
+++ b/theme/music/style.css
@@ -1,130 +1,150 @@
-html{
+html {
 	color: white;
 	text-shadow: black 0 0 2px;
-	background: url('grid.png'),linear-gradient(#333333, #222222) fixed;
+	background: url("grid.png"), linear-gradient(#333333, #222222) fixed;
 }
-#system>div>div,#mebg,.control,.player,.card,.avatar,.avatar2,.button,#window>.dialog.popped,
+#system > div > div,
+#mebg,
+.control,
+.player,
+.card,
+.avatar,
+.avatar2,
+.button,
+#window > .dialog.popped,
 #arena:not(.long) .player.unseen .equips:not(*:empty),
-#arena.long .player.unseen2 .equips:not(*:empty),.menu,#splash>div,
-#arena.mobile:not(.chess) .player[data-position='0'] .equips,.playerbg,#window .player.playerbg,.menubg,.mebg{
+#arena.long .player.unseen2 .equips:not(*:empty),
+.menu,
+#splash > div,
+#arena.mobile:not(.chess) .player[data-position="0"] .equips,
+.playerbg,
+#window .player.playerbg,
+.menubg,
+.mebg {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
 	background-image: linear-gradient(#4b4b4b, #464646);
 	border-radius: 8px;
 }
-#arena.observe .handcards>.card{
+#arena.observe .handcards > .card {
 	background: linear-gradient(#4b4b4b, #464646) !important;
 }
 
-.videonode.menubutton.extension.current{
-	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 133, 255, 0.4) 0 2px 5px, rgba(0, 133, 255, 0.5) 0 0 12px, rgba(0, 133, 255, 0.8) 0 0 15px;
+.videonode.menubutton.extension.current {
+	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 133, 255, 0.4) 0 2px 5px,
+		rgba(0, 133, 255, 0.5) 0 0 12px, rgba(0, 133, 255, 0.8) 0 0 15px;
 }
-body[data-background_color_music='blue'] #system>div>div,
-body[data-background_color_music='blue'] #mebg,
-body[data-background_color_music='blue'] .control,
-body[data-background_color_music='blue'] .player,
-body[data-background_color_music='blue'] .card,
-body[data-background_color_music='blue'] .avatar,
-body[data-background_color_music='blue'] .avatar2,
-body[data-background_color_music='blue'] .button,
-body[data-background_color_music='blue'] #window>.dialog.popped,
-body[data-background_color_music='blue'] .player.unseen .equips:not(*:empty),
-body[data-background_color_music='blue'] .menu,
-body[data-background_color_music='blue'] #splash>div,
-body[data-background_color_music='blue'] #arena.mobile:not(.chess) .player[data-position='0'] .equips{
+body[data-background_color_music="blue"] #system > div > div,
+body[data-background_color_music="blue"] #mebg,
+body[data-background_color_music="blue"] .control,
+body[data-background_color_music="blue"] .player,
+body[data-background_color_music="blue"] .card,
+body[data-background_color_music="blue"] .avatar,
+body[data-background_color_music="blue"] .avatar2,
+body[data-background_color_music="blue"] .button,
+body[data-background_color_music="blue"] #window > .dialog.popped,
+body[data-background_color_music="blue"] .player.unseen .equips:not(*:empty),
+body[data-background_color_music="blue"] .menu,
+body[data-background_color_music="blue"] #splash > div,
+body[data-background_color_music="blue"] #arena.mobile:not(.chess) .player[data-position="0"] .equips {
 	background-image: linear-gradient(#6c7989, #434b55);
 }
 
-.marks>.card.fullskin>.markcount.menubutton{
-	background: url('wood3.png');
+.marks > .card.fullskin > .markcount.menubutton {
+	background: url("wood3.png");
 }
 
-
 /*.player.current_action{
 	background-image: linear-gradient(rgba(57, 123, 4,1), rgb(48, 103, 3));
 }*/
-#window>.dialog.popped{
+#window > .dialog.popped {
 	border-radius: 6px;
 }
-.control,#system>div>div,.judges>div,.marks>div,
+.control,
+#system > div > div,
+.judges > div,
+.marks > div,
 #arena:not(.long) .player.unseen .equips:not(*:empty),
-#arena.long .player.unseen2 .equips:not(*:empty){
-	border-radius:4px;
+#arena.long .player.unseen2 .equips:not(*:empty) {
+	border-radius: 4px;
 	overflow: hidden;
 }
 
-#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty)>.card:not(.selected),
-#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty)>.card:not(.selected){
+#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty) > .card:not(.selected),
+#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty) > .card:not(.selected) {
 	background: none !important;
 }
 
-.player,#mebg{
+.player,
+#mebg {
 	/*background:url('wood.png') left repeat-y,url('wood.png') right repeat-y,linear-gradient(#4b4b4b, #464646);*/
 }
-.card{
-	color:white;
+.card {
+	color: white;
 }
-.cardbg{
+.cardbg {
 	background-size: initial !important;
 }
-.card:not(*:empty),.cardbg{
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('wood3.png');
+.card:not(*:empty),
+.cardbg {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("wood3.png");
 }
-.marks>.card:not(.fullskin){
+.marks > .card:not(.fullskin) {
 	color: white;
 	text-shadow: black 0 0 2px;
 	background: linear-gradient(#4b4b4b, #464646);
 }
-#me>div>div>.card,#arena>.card:not(*:empty){
+#me > div > div > .card,
+#arena > .card:not(*:empty) {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
 }
 
-#system>div>.glow {
-    background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1));
+#system > div > .glow {
+	background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1));
 	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px !important;
 }
 
-.fire{
-	color: rgb(255,119,63);
+.fire {
+	color: rgb(255, 119, 63);
 }
-.thunder{
-	color: rgb(117,186,255);
+.thunder {
+	color: rgb(117, 186, 255);
 }
-.poison{
-	color: rgb(104,221,127);
+.poison {
+	color: rgb(104, 221, 127);
 }
-.brown{
-	color: rgb(195,161,223);
+.brown {
+	color: rgb(195, 161, 223);
 }
 
-#roundmenu.clock>div:nth-of-type(15){
+#roundmenu.clock > div:nth-of-type(15) {
 	background: linear-gradient(#4b4b4b, #464646);
-	box-shadow: rgba(0,0,0,0.6) 0 0 5px inset;
+	box-shadow: rgba(0, 0, 0, 0.6) 0 0 5px inset;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -6px -6px;
 }
 
-.woodbg{
-	color:rgba(77, 60, 51,0.8) !important;
-	text-shadow:none !important;
+.woodbg {
+	color: rgba(77, 60, 51, 0.8) !important;
+	text-shadow: none !important;
 }
-.woodbg .menubutton.large{
-	background: url('wood3.png') !important;
+.woodbg .menubutton.large {
+	background: url("wood3.png") !important;
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important;
 }
 
-#window .player.minskin.obstacle[data-obscolor='blue']{
-    background: repeating-linear-gradient(
-        135deg,
-        rgba(0, 133, 255, 0.5),
-        rgba(0, 133, 255, 0.5) 10px,
-        rgba(0, 0, 0, 0) 10px,
-        rgba(0, 0, 0, 0) 20px
-    );
-    box-shadow: rgba(0, 133, 255, 0.5) 0 0 0 1px;
+#window .player.minskin.obstacle[data-obscolor="blue"] {
+	background: repeating-linear-gradient(
+		135deg,
+		rgba(0, 133, 255, 0.5),
+		rgba(0, 133, 255, 0.5) 10px,
+		rgba(0, 0, 0, 0) 10px,
+		rgba(0, 0, 0, 0) 20px
+	);
+	box-shadow: rgba(0, 133, 255, 0.5) 0 0 0 1px;
 }
diff --git a/theme/simple/style.css b/theme/simple/style.css
index 5e6dfc79a..25e92cd55 100644
--- a/theme/simple/style.css
+++ b/theme/simple/style.css
@@ -1,8 +1,8 @@
-html{
+html {
 	color: white;
 	text-shadow: black 0 0 2px;
 	min-height: 100%;
-	background-image: url('../../image/background/ol_bg.jpg');
+	background-image: url("../../image/background/ol_bg.jpg");
 	background-size: cover;
 	background-position: 50% 50%;
 }
@@ -19,100 +19,120 @@ html{
 	-webkit-backdrop-filter: blur(3px);
 	box-shadow: rgba(0, 0, 0, 0.6) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 3px 10px;
 }
-#system>div>div,#mebg,.control,.player,.card,.avatar,.avatar2,.button,#window>.dialog.popped,
+#system > div > div,
+#mebg,
+.control,
+.player,
+.card,
+.avatar,
+.avatar2,
+.button,
+#window > .dialog.popped,
 #arena:not(.long) .player.unseen .equips:not(*:empty),
-#arena.long .player.unseen2 .equips:not(*:empty),.menu,.menubutton,#splash>div,
-#arena.mobile:not(.chess) .player[data-position='0'] .equips,.playerbg,#window .player.playerbg,.menubg,.mebg{
+#arena.long .player.unseen2 .equips:not(*:empty),
+.menu,
+.menubutton,
+#splash > div,
+#arena.mobile:not(.chess) .player[data-position="0"] .equips,
+.playerbg,
+#window .player.playerbg,
+.menubg,
+.mebg {
 	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
-	background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4));
+	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
 	border-radius: 8px;
 }
-#arena.mobile.textequip:not(.chess) .player[data-position='0'] .equips{
+#arena.mobile.textequip:not(.chess) .player[data-position="0"] .equips {
 	background-image: none;
 	box-shadow: rgba(0, 0, 0, 0.2) -1px 0px 0px 0px;
 	overflow-y: scroll;
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card{
-	background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)) !important;
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card {
+	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)) !important;
 }
-#arena.observe .handcards>.card{
-	background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)) !important;
+#arena.observe .handcards > .card {
+	background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)) !important;
 }
-.videonode.menubutton.extension.current{
-	background-image: linear-gradient(rgba(89, 111, 117, 0.4),rgba(89, 111, 117, 0.4));
+.videonode.menubutton.extension.current {
+	background-image: linear-gradient(rgba(89, 111, 117, 0.4), rgba(89, 111, 117, 0.4));
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
 }
 
 /*.player.current_action{
 	background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1));
 }*/
-.menubutton{
+.menubutton {
 	border-radius: 4px;
 }
 /*.player{
 	background-image: url('card.png');
 	background-size: cover;
 }*/
-#window>.dialog.popped{
+#window > .dialog.popped {
 	border-radius: 6px;
 }
-.control,#system>div>div,.judges>div,.marks>div,
+.control,
+#system > div > div,
+.judges > div,
+.marks > div,
 #arena:not(.long) .player.unseen .equips:not(*:empty),
-#arena.long .player.unseen2 .equips:not(*:empty){
-	border-radius:4px;
+#arena.long .player.unseen2 .equips:not(*:empty) {
+	border-radius: 4px;
 	overflow: hidden;
 }
-#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty)>.card:not(.selected),
-#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty)>.card:not(.selected){
+#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty) > .card:not(.selected),
+#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty) > .card:not(.selected) {
 	background: none !important;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 4px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 4px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
+	height: 100%;
+	left: 0;
+	top: 0;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: left top;
-    left: 2px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: left top;
+	left: 2px;
+	top: 3px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name.long{
-    top: 2px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name.long {
+	top: 2px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: right top;
-    right: 3px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: right top;
+	right: 3px;
+	top: 3px;
 }
-.cardbg{
+.cardbg {
 	background-size: 100% 100% !important;
 }
-.card{
-	color:white;
+.card {
+	color: white;
 }
-.card:not(*:empty),.cardbg{
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('card.png');
-	background-size:100% 100%;
+.card:not(*:empty),
+.cardbg {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("card.png");
+	background-size: 100% 100%;
 }
-.card .markcount{
+.card .markcount {
 	box-shadow: rgba(0, 0, 0, 0.8) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
-	background: url('card.png');
+	background: url("card.png");
 	background-size: cover;
 	/*color: white;*/
 }
-#me>div>div>.card,#arena>.card:not(*:empty){
+#me > div > div > .card,
+#arena > .card:not(*:empty) {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
 }
 /*.player{
@@ -125,58 +145,58 @@ html{
     );
 }*/
 
-.card:empty,.card.infohidden{
-    background: url('../style/cardback/image/official.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("../style/cardback/image/official.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('../style/cardback/image/official2.png');
+.card.infohidden:not(.infoflip) {
+	background: url("../style/cardback/image/official2.png");
 	background-size: 100% 100%;
 }
 
-#system>div>.glow {
-    background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1));
+#system > div > .glow {
+	background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1));
 	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px !important;
 }
 
-.menupaused{
+.menupaused {
 	opacity: 0.3 !important;
 }
 
-.player .marks>div:first-child>div{
+.player .marks > div:first-child > div {
 	filter: invert(0.8) sepia(1);
 	-webkit-filter: invert(0.8) sepia(1);
 }
 
-.fire{
-	color: rgb(255,119,63);
+.fire {
+	color: rgb(255, 119, 63);
 }
-.thunder{
-	color: rgb(117,186,255);
+.thunder {
+	color: rgb(117, 186, 255);
 }
-.poison{
-	color: rgb(104,221,127);
+.poison {
+	color: rgb(104, 221, 127);
 }
-.brown{
-	color: rgb(195,161,223);
+.brown {
+	color: rgb(195, 161, 223);
 }
-#roundmenu.clock>div:nth-of-type(15){
-	background: rgba(0,0,0,0.3);
-	box-shadow: rgba(0,0,0,0.6) 0 0 5px inset;
+#roundmenu.clock > div:nth-of-type(15) {
+	background: rgba(0, 0, 0, 0.3);
+	box-shadow: rgba(0, 0, 0, 0.6) 0 0 5px inset;
 }
 
-
-.woodbg{
-	color:rgba(77, 60, 51,1) !important;
-	text-shadow:none !important;
+.woodbg {
+	color: rgba(77, 60, 51, 1) !important;
+	text-shadow: none !important;
 }
-.woodbg .menubutton.large{
-	background: url('card2.png') !important;
+.woodbg .menubutton.large {
+	background: url("card2.png") !important;
 	background-size: 100% 100% !important;
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important;
 }
 
-.player>.glassbg{
+.player > .glassbg {
 	left: 0;
 	top: 0;
 	margin: 0;
@@ -189,12 +209,12 @@ html{
 	z-index: 1;
 	pointer-events: none;
 }
-.player>.glassbg>div:last-child{
+.player > .glassbg > div:last-child {
 	width: 100%;
 	height: 100%;
-	background: rgba(0,0,0,0.4);
+	background: rgba(0, 0, 0, 0.4);
 }
-.player>.glassbg>div:first-child{
+.player > .glassbg > div:first-child {
 	left: 0;
 	top: 0;
 	margin: 0;
@@ -205,22 +225,22 @@ html{
 	filter: blur(3px);
 	-webkit-filter: blur(3px);
 }
-.popup-container>.prompt-container>div>div{
-	background: rgba(0,0,0,0.6);
+.popup-container > .prompt-container > div > div {
+	background: rgba(0, 0, 0, 0.6);
 }
 
-.popup-container>.menu.visual>.button.dashedmenubutton{
+.popup-container > .menu.visual > .button.dashedmenubutton {
 	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px !important;
 	border: none;
-	background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)) !important;
+	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)) !important;
 }
-.popup-container>.menu.visual>.button.dashedmenubutton:not(.hpbutton){
+.popup-container > .menu.visual > .button.dashedmenubutton:not(.hpbutton) {
 	width: 90px;
 	height: 90px;
 }
-.popup-container>.menu.visual>.button.dashedmenubutton.controlbutton{
-    height: 26px;
+.popup-container > .menu.visual > .button.dashedmenubutton.controlbutton {
+	height: 26px;
 }
-.popup-container>.menu.visual>.button.dashedmenubutton.controlbutton>div{
+.popup-container > .menu.visual > .button.dashedmenubutton.controlbutton > div {
 	line-height: 26px;
 }
diff --git a/theme/style/card/custom.css b/theme/style/card/custom.css
index da2a6ea87..c26388df2 100644
--- a/theme/style/card/custom.css
+++ b/theme/style/card/custom.css
@@ -1,35 +1,35 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background-size:100% 100%;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background-size: 100% 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 4px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 4px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
+	height: 100%;
+	left: 0;
+	top: 0;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: left top;
-    left: 2px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: left top;
+	left: 2px;
+	top: 3px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name.long{
-    top: 2px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name.long {
+	top: 2px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: right top;
-    right: 3px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: right top;
+	right: 3px;
+	top: 3px;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -4px -4px;
 }
diff --git a/theme/style/card/music.css b/theme/style/card/music.css
index 1b618d9c4..ada0dac32 100644
--- a/theme/style/card/music.css
+++ b/theme/style/card/music.css
@@ -1,20 +1,20 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('../../music/wood3.png');
-    background-size:auto;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("../../music/wood3.png");
+	background-size: auto;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -6px -6px;
 }
 
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 100%;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: none;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: none;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: none;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: none;
 }
diff --git a/theme/style/card/new.css b/theme/style/card/new.css
index 2ed8cf53f..775751a96 100644
--- a/theme/style/card/new.css
+++ b/theme/style/card/new.css
@@ -1,36 +1,36 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('image/new.png');
-	background-size:100% 100%;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("image/new.png");
+	background-size: 100% 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 4px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 4px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
+	height: 100%;
+	left: 0;
+	top: 0;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: left top;
-    left: 2px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: left top;
+	left: 2px;
+	top: 3px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name.long{
-    top: 2px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name.long {
+	top: 2px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: right top;
-    right: 3px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: right top;
+	right: 3px;
+	top: 3px;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -4px -4px;
 }
diff --git a/theme/style/card/ol.css b/theme/style/card/ol.css
index f7aea61c0..333ea3341 100644
--- a/theme/style/card/ol.css
+++ b/theme/style/card/ol.css
@@ -1,37 +1,36 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('image/ol.png');
-	background-size:100% 100%;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("image/ol.png");
+	background-size: 100% 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 4px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 4px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
+	height: 100%;
+	left: 0;
+	top: 0;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: left top;
-    left: 2px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: left top;
+	left: 2px;
+	top: 3px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name.long{
-    top: 2px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name.long {
+	top: 2px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: right top;
-    right: 3px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: right top;
+	right: 3px;
+	top: 3px;
 }
 
-
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -4px -4px;
 }
diff --git a/theme/style/card/simple.css b/theme/style/card/simple.css
index 2c3f44fe4..97f6e4ac4 100644
--- a/theme/style/card/simple.css
+++ b/theme/style/card/simple.css
@@ -1,36 +1,36 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('../../simple/card.png');
-	background-size:100% 100%;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("../../simple/card.png");
+	background-size: 100% 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 4px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 4px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	width: 100%;
-    height: 100%;
-    left: 0;
-    top: 0;
+	height: 100%;
+	left: 0;
+	top: 0;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: left top;
-    left: 2px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: left top;
+	left: 2px;
+	top: 3px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name.long{
-    top: 2px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name.long {
+	top: 2px;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: block;
-    transform: scale(0.43) !important;
-    transform-origin: right top;
-    right: 3px;
-    top: 3px;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: block;
+	transform: scale(0.43) !important;
+	transform-origin: right top;
+	right: 3px;
+	top: 3px;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -4px -4px;
 }
diff --git a/theme/style/card/wood.css b/theme/style/card/wood.css
index 28f26d3c3..2944bc944 100644
--- a/theme/style/card/wood.css
+++ b/theme/style/card/wood.css
@@ -1,20 +1,20 @@
-.card:not(*:empty){
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('../../woodden/wood.jpg');
-    background-size:auto;
+.card:not(*:empty) {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("../../woodden/wood.jpg");
+	background-size: auto;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -6px -6px;
 }
 
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5 {
-    border-radius: 100%;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 {
+	border-radius: 100%;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.name{
-    display: none;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .name {
+	display: none;
 }
-#arena.mobile:not(.chess) .player[data-position='0']>.equips>.equip5>.info{
-    display: none;
+#arena.mobile:not(.chess) .player[data-position="0"] > .equips > .equip5 > .info {
+	display: none;
 }
diff --git a/theme/style/cardback/custom.css b/theme/style/cardback/custom.css
index 2c5227441..cea1873a3 100644
--- a/theme/style/cardback/custom.css
+++ b/theme/style/cardback/custom.css
@@ -1,6 +1,7 @@
-.card:empty,.card.infohidden{
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/feicheng.css b/theme/style/cardback/feicheng.css
index 1bc014678..c529b428f 100644
--- a/theme/style/cardback/feicheng.css
+++ b/theme/style/cardback/feicheng.css
@@ -1,8 +1,9 @@
-.card:empty,.card.infohidden{
-    background: url('image/feicheng.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("image/feicheng.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('image/feicheng2.png');
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background: url("image/feicheng2.png");
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/liusha.css b/theme/style/cardback/liusha.css
index f0c4001c7..e4007acb1 100644
--- a/theme/style/cardback/liusha.css
+++ b/theme/style/cardback/liusha.css
@@ -1,8 +1,9 @@
-.card:empty,.card.infohidden{
-    background: url('image/liusha.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("image/liusha.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('image/liusha2.png');
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background: url("image/liusha2.png");
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/music.css b/theme/style/cardback/music.css
index 04c28ed7b..d0b6c7c9e 100644
--- a/theme/style/cardback/music.css
+++ b/theme/style/cardback/music.css
@@ -1,6 +1,7 @@
-.card:empty,.card.infohidden{
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('../../music/wood3.png');
-    background-size:auto;
+.card:empty,
+.card.infohidden {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("../../music/wood3.png");
+	background-size: auto;
 }
diff --git a/theme/style/cardback/new.css b/theme/style/cardback/new.css
index ed76ef759..2497863d1 100644
--- a/theme/style/cardback/new.css
+++ b/theme/style/cardback/new.css
@@ -1,8 +1,9 @@
-.card:empty,.card.infohidden{
-    background: url('image/new.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("image/new.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('image/new2.png');
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background: url("image/new2.png");
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/official.css b/theme/style/cardback/official.css
index 9d1883c57..43982188c 100644
--- a/theme/style/cardback/official.css
+++ b/theme/style/cardback/official.css
@@ -1,8 +1,9 @@
-.card:empty,.card.infohidden{
-    background: url('image/official.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("image/official.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('image/official2.png');
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background: url("image/official2.png");
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/ol.css b/theme/style/cardback/ol.css
index 9a8925e8c..49c574e07 100644
--- a/theme/style/cardback/ol.css
+++ b/theme/style/cardback/ol.css
@@ -1,8 +1,9 @@
-.card:empty,.card.infohidden{
-    background: url('image/ol.png');
-    background-size: 100% 100%;
+.card:empty,
+.card.infohidden {
+	background: url("image/ol.png");
+	background-size: 100% 100%;
 }
-.card.infohidden:not(.infoflip){
-	background: url('image/ol2.png');
-    background-size: 100% 100%;
+.card.infohidden:not(.infoflip) {
+	background: url("image/ol2.png");
+	background-size: 100% 100%;
 }
diff --git a/theme/style/cardback/wood.css b/theme/style/cardback/wood.css
index af180ffc2..9492072df 100644
--- a/theme/style/cardback/wood.css
+++ b/theme/style/cardback/wood.css
@@ -1,6 +1,7 @@
-.card:empty,.card.infohidden{
-	color:rgb(77, 60, 51);
-	text-shadow:none;
-	background: url('../../woodden/wood.jpg');
-    background-size:auto;
+.card:empty,
+.card.infohidden {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
+	background: url("../../woodden/wood.jpg");
+	background-size: auto;
 }
diff --git a/theme/style/hp/custom.css b/theme/style/hp/custom.css
index 4fb3677ff..218a18a2e 100644
--- a/theme/style/hp/custom.css
+++ b/theme/style/hp/custom.css
@@ -1,59 +1,68 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/emotion.css b/theme/style/hp/emotion.css
index a777b0c52..a3a2cfba4 100644
--- a/theme/style/hp/emotion.css
+++ b/theme/style/hp/emotion.css
@@ -1,63 +1,72 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/emotion1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:brightness(0.8) contrast(1.5);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/emotion1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: brightness(0.8) contrast(1.5);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/emotion2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:brightness(0.8) contrast(1.5);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/emotion2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: brightness(0.8) contrast(1.5);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/emotion3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:brightness(0.8) contrast(1.5);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/emotion3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: brightness(0.8) contrast(1.5);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/emotion4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/emotion4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/glass.css b/theme/style/hp/glass.css
index 28b474511..88a8e10aa 100644
--- a/theme/style/hp/glass.css
+++ b/theme/style/hp/glass.css
@@ -1,63 +1,72 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/glass1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/glass1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/glass2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/glass2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/glass3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/glass3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/glass4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/glass4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/official.css b/theme/style/hp/official.css
index 48a3b2249..5d74eed03 100644
--- a/theme/style/hp/official.css
+++ b/theme/style/hp/official.css
@@ -1,60 +1,69 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/official1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/official1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/official2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/official2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/official3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/official3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/official4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/official4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/ol.css b/theme/style/hp/ol.css
index 7e9ba13bf..f5c030ab0 100644
--- a/theme/style/hp/ol.css
+++ b/theme/style/hp/ol.css
@@ -1,64 +1,73 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/ol1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.6);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/ol1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.6);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/ol2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.6);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/ol2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.6);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/ol3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.6);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/ol3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.6);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/ol4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.6);
-    border-radius: 0px;
-    filter:grayscale(1) opacity(0.8);
-    -webkit-filter:grayscale(1) opacity(0.8);
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/ol4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.6);
+	border-radius: 0px;
+	filter: grayscale(1) opacity(0.8);
+	-webkit-filter: grayscale(1) opacity(0.8);
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.6);
-    border-radius: 0px;
-    filter:grayscale(1) opacity(0.8);
-    -webkit-filter:grayscale(1) opacity(0.8);
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.6);
+	border-radius: 0px;
+	filter: grayscale(1) opacity(0.8);
+	-webkit-filter: grayscale(1) opacity(0.8);
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/round.css b/theme/style/hp/round.css
index 1131a3138..9a8f1544e 100644
--- a/theme/style/hp/round.css
+++ b/theme/style/hp/round.css
@@ -1,63 +1,72 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/round1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/round1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/round2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/round2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/round3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/round3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/round4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/round4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/xinglass.css b/theme/style/hp/xinglass.css
index 690ef0729..b30389d12 100644
--- a/theme/style/hp/xinglass.css
+++ b/theme/style/hp/xinglass.css
@@ -1,63 +1,72 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/xinglass1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/xinglass1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/xinglass2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/xinglass2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/xinglass3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/xinglass3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/xinglass4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/xinglass4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/xinglass4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/xinglass4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/style/hp/xinround.css b/theme/style/hp/xinround.css
index d937436d9..dfc33624c 100644
--- a/theme/style/hp/xinround.css
+++ b/theme/style/hp/xinround.css
@@ -1,63 +1,72 @@
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    background: url('image/xinround1.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"] > div:not(.lost):not(.shield) {
+	background: url("image/xinround1.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    background: url('image/xinround2.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"] > div:not(.lost):not(.shield) {
+	background: url("image/xinround2.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    background: url('image/xinround3.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    -webkit-filter:none;
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"] > div:not(.lost):not(.shield) {
+	background: url("image/xinround3.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	-webkit-filter: none;
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    background: url('image/xinround4.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	background: url("image/xinround4.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
-.hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    background: url('image/shield.png');
-    box-shadow: none;
-    border: none;
-    background-size: 100% 100%;
-    transform: scale(1.4);
-    border-radius: 0px;
+.hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	background: url("image/shield.png");
+	box-shadow: none;
+	border: none;
+	background-size: 100% 100%;
+	transform: scale(1.4);
+	border-radius: 0px;
 }
 
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="high"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="mid"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]>div:not(.lost):not(.shield){
-    transform: scale(1.6);
+#arena.oldlayout
+	.player
+	.hp:not(.text):not(.actcount):not(.treasure)[data-condition="low"]
+	> div:not(.lost):not(.shield) {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.lost{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .lost {
+	transform: scale(1.6);
 }
-#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure)>.shield{
-    transform: scale(1.6);
+#arena.oldlayout .player .hp:not(.text):not(.actcount):not(.treasure) > .shield {
+	transform: scale(1.6);
 }
 
-.button.newstyle>.hp>.text{
-    margin-left: 5px;
+.button.newstyle > .hp > .text {
+	margin-left: 5px;
 }
diff --git a/theme/woodden/style.css b/theme/woodden/style.css
index 1a47c40dc..06e25c3eb 100644
--- a/theme/woodden/style.css
+++ b/theme/woodden/style.css
@@ -1,248 +1,285 @@
-html{
+html {
 	color: white;
 	text-shadow: black 0 0 2px;
-	background: url('grid.png'),linear-gradient(#6c7989, #434b55) fixed;
+	background: url("grid.png"), linear-gradient(#6c7989, #434b55) fixed;
 }
-#system>div>div,#mebg,.control,.player,.card,.avatar,.avatar2,.button,.dialog>.bar,.menu,#splash>div,
-#arena.mobile:not(.chess) .player[data-position='0'] .equips,.playerbg,.menubg,.mebg{
+#system > div > div,
+#mebg,
+.control,
+.player,
+.card,
+.avatar,
+.avatar2,
+.button,
+.dialog > .bar,
+.menu,
+#splash > div,
+#arena.mobile:not(.chess) .player[data-position="0"] .equips,
+.playerbg,
+.menubg,
+.mebg {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px;
 	border-radius: 8px;
 }
 
-.dialog.choose-character>.packnode>div{
+.dialog.choose-character > .packnode > div {
 	box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
-	background-image: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4));
+	background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));
 	color: white;
 	text-shadow: black 0 0 2px;
 }
-.dialog.choose-character>.packnode>div.active{
+.dialog.choose-character > .packnode > div.active {
 	box-shadow: rgba(27, 63, 95, 0.8) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px !important;
-	background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1));
+	background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1));
 }
 
-.button-downloading>.button-progress>div{
-	background: rgba(77,224,100,0.45);
+.button-downloading > .button-progress > div {
+	background: rgba(77, 224, 100, 0.45);
 }
 
-.menu.main>.menu-tab>div:not(.active):not(*:hover),
-.menu.main>.menu-tab>.disabled{
-	color: rgba(77, 60, 51,0.5);
+.menu.main > .menu-tab > div:not(.active):not(*:hover),
+.menu.main > .menu-tab > .disabled {
+	color: rgba(77, 60, 51, 0.5);
 }
-#window>.dialog.popped,.menu,.menubg{
-	background:url('wood2.png');
-	color:rgba(77, 60, 51,0.8);
-	text-shadow:none;
-}
-.popup-container>.menu.visual>.dashedmenubutton{
-	color:rgba(77, 60, 51,0.8);
+#window > .dialog.popped,
+.menu,
+.menubg {
+	background: url("wood2.png");
+	color: rgba(77, 60, 51, 0.8);
 	text-shadow: none;
-	border-color:rgba(77, 60, 51,0.8);
 }
-.cardbg{
+.popup-container > .menu.visual > .dashedmenubutton {
+	color: rgba(77, 60, 51, 0.8);
+	text-shadow: none;
+	border-color: rgba(77, 60, 51, 0.8);
+}
+.cardbg {
 	background-size: initial !important;
 }
-#splash>div{
-	background:url('wood2.png');
+#splash > div {
+	background: url("wood2.png");
 }
 
 #arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty),
 #arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty),
 #arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty),
-#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty){
-	background: url('wood.png');
-	border-radius:4px;
+#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty) {
+	background: url("wood.png");
+	border-radius: 4px;
 	overflow: hidden;
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 2px 10px;
 }
-#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty)>.card:not(.selected),
-#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty)>.card,
-#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty)>.card:not(.selected){
+#arena:not(.long).mobile:not(.oldlayout) .player.unseen:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena:not(.long):not(.mobile):not(.oldlayout) .player.unseen .equips:not(*:empty) > .card:not(.selected),
+#arena.long.mobile:not(.oldlayout) .player.unseen2:not([data-position="0"]) .equips:not(*:empty) > .card,
+#arena.long:not(.mobile):not(.oldlayout) .player.unseen2 .equips:not(*:empty) > .card:not(.selected) {
 	background: none !important;
 }
 
-.coin_menu .content>.caption>.coin_buy>.menubutton{
+.coin_menu .content > .caption > .coin_buy > .menubutton {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important;
 }
 
-.popup.fire{
-	color: rgb(255,119,63);
+.popup.fire {
+	color: rgb(255, 119, 63);
 }
-.popup.thunder{
-	color: rgb(117,186,255);
+.popup.thunder {
+	color: rgb(117, 186, 255);
 }
-.control .thundertext,.thundertext.thunderauto,
+.control .thundertext,
+.thundertext.thunderauto,
 .dialog.popped .bluetext,
-.menubg .bluetext{
+.menubg .bluetext {
 	color: rgba(29, 63, 137, 1);
 }
-.control .controlthundertext{
+.control .controlthundertext {
 	color: rgb(62, 41, 30);
 }
 .dialog.popped .yellowtext,
-.menubg .yellowtext{
-	color:#631515;
+.menubg .yellowtext {
+	color: #631515;
 }
 .dialog.popped .firetext,
-.menubg .firetext{
-	color:#a20000;
+.menubg .firetext {
+	color: #a20000;
 }
 .dialog.popped .greentext,
-.menubg .greentext,.control span.greentext,.poisontext.poisonauto{
-	color:#00312d;
+.menubg .greentext,
+.control span.greentext,
+.poisontext.poisonauto {
+	color: #00312d;
 }
-.control span.firetext{
-	color:#631515;
+.control span.firetext {
+	color: #631515;
 }
-.legendtext.legendauto{
+.legendtext.legendauto {
 	color: rgba(106, 27, 154, 1);
 }
-.player,.card,.dialog>.bar,.cardbg,
-#arena.mobile:not(.chess) .player[data-position='0'] .equips,.playerbg,#window .player.playerbg{
-	background: url('wood.jpg');
+.player,
+.card,
+.dialog > .bar,
+.cardbg,
+#arena.mobile:not(.chess) .player[data-position="0"] .equips,
+.playerbg,
+#window .player.playerbg {
+	background: url("wood.jpg");
 }
-.cardbg.button{
-	background: url('wood.png');
+.cardbg.button {
+	background: url("wood.png");
 }
-#arena.observe .handcards>.card{
-	background: url('wood.jpg') !important;
+#arena.observe .handcards > .card {
+	background: url("wood.jpg") !important;
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card{
-	background: url('wood.jpg') !important;
-	color:rgb(77, 60, 51) !important;
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card {
+	background: url("wood.jpg") !important;
+	color: rgb(77, 60, 51) !important;
 	text-shadow: none !important;
-	box-shadow: rgba(0,0,0,0.4) 1px 0 0 1px;
+	box-shadow: rgba(0, 0, 0, 0.4) 1px 0 0 1px;
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card:first-child{
-	box-shadow: rgba(0,0,0,0.4) 0 1px 0 0;
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card:first-child {
+	box-shadow: rgba(0, 0, 0, 0.4) 0 1px 0 0;
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.selected{
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card.selected {
 	-webkit-filter: sepia(0.8) !important;
-	background-image: url('wood.jpg') !important;
+	background-image: url("wood.jpg") !important;
 	/*background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)) !important;*/
 	/*color: white !important;
 	box-shadow: rgba(0,0,0,0.4) 1px 0 0 1px !important;*/
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card.selected:first-child{
-	box-shadow: rgba(0,0,0,0.4) 0 1px 0 0 !important;
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card.selected:first-child {
+	box-shadow: rgba(0, 0, 0, 0.4) 0 1px 0 0 !important;
 }
-#arena:not(.chess).textequip .player[data-position='0'] .equips>.card>.name2{
+#arena:not(.chess).textequip .player[data-position="0"] .equips > .card > .name2 {
 	transition: opacity 0.5s, color 0s;
 }
 
-.control,#system>div>div,.menubutton,#system>div>.pressdown2{
-	background: url('wood2.jpg');
-	color:rgba(77, 60, 51,0.8);
-	text-shadow:none;
-	border-radius:4px;
+.control,
+#system > div > div,
+.menubutton,
+#system > div > .pressdown2 {
+	background: url("wood2.jpg");
+	color: rgba(77, 60, 51, 0.8);
+	text-shadow: none;
+	border-radius: 4px;
 }
-#roundmenu>div:not(.clock){
-	background:rgba(77, 60, 51,0.8);
-	box-shadow:none;
+#roundmenu > div:not(.clock) {
+	background: rgba(77, 60, 51, 0.8);
+	box-shadow: none;
 }
-#system>div>.pressdown2{
+#system > div > .pressdown2 {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.8) 0 0 0 2px, rgba(0, 133, 255, 1) 0 0 5px !important;
 }
-.judges>div,.marks>div{
-	border-radius:4px;
+.judges > div,
+.marks > div {
+	border-radius: 4px;
 }
-#mebg,.menubutton,.menubutton.highlight,.menubutton.active,.mebg{
-	background: url('wood.png');
+#mebg,
+.menubutton,
+.menubutton.highlight,
+.menubutton.active,
+.mebg {
+	background: url("wood.png");
 }
-.menubutton.large{
+.menubutton.large {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important;
 }
 .menubutton.large.active,
 .menubutton.round.active,
 .menubutton.active,
-.menubutton.highlight.update{
+.menubutton.highlight.update {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.4) 0 0 0 2px, rgba(0, 133, 255, 1) 0 0 5px !important;
 }
-.connectevents.icon.highlight{
+.connectevents.icon.highlight {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important;
-	background: url('wood.jpg');
+	background: url("wood.jpg");
 }
-.videonode.menubutton.extension>.caption>.menubutton.active{
+.videonode.menubutton.extension > .caption > .menubutton.active {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px !important;
 }
-.videonode.menubutton.extension.current{
+.videonode.menubutton.extension.current {
 	box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.4) 0 0 0 2px, rgba(0, 133, 255, 1) 0 0 5px !important;
 }
-.themebutton{
+.themebutton {
 	box-shadow: rgba(0, 0, 0, 0.45) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px !important;
 }
-.config.toggle>div>div{
-	background: url('wood.png');
+.config.toggle > div > div {
+	background: url("wood.png");
 	box-shadow: rgba(151, 151, 151, 1) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px;
 }
-.config.toggle.on>div{
+.config.toggle.on > div {
 	background-color: transparent;
 }
-.config.toggle.on>div::before{
-	content:'开';
+.config.toggle.on > div::before {
+	content: "开";
 	position: absolute;
 	left: 13px;
 	opacity: 0.5;
 	font-size: 14px;
 	line-height: 26px;
-	font-family: 'xinwei'
+	font-family: "xinwei";
 }
-.popup-container>.menu:not(.visual)>div:hover{
-    color:white;
+.popup-container > .menu:not(.visual) > div:hover {
+	color: white;
 	background-image: linear-gradient(rgb(0, 133, 255), rgb(5, 119, 220));
 	box-shadow: none;
 }
-.control,#system>div>div,.popup,.dialog>.bar{
+.control,
+#system > div > div,
+.popup,
+.dialog > .bar {
 	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 2px 10px;
 }
-.card{
-	text-shadow:rgba(0,0,0,0.1) 0 0 1px;
+.card {
+	text-shadow: rgba(0, 0, 0, 0.1) 0 0 1px;
 }
-.card.equip3>.range,
-.card.equip4>.range{
+.card.equip3 > .range,
+.card.equip4 > .range {
 	text-shadow: white 0 0 2px;
 }
-.card,.menubg,.cardbg,.button.character.cardbg{
-	color:rgb(77, 60, 51);
-	text-shadow:none;
+.card,
+.menubg,
+.cardbg,
+.button.character.cardbg {
+	color: rgb(77, 60, 51);
+	text-shadow: none;
 }
-#arena.mobile:not(.chess) .player[data-position='0'] .card.fullskin.epic>.name2{
+#arena.mobile:not(.chess) .player[data-position="0"] .card.fullskin.epic > .name2 {
 	color: rgba(0, 66, 165, 1);
 }
-#arena.mobile:not(.chess) .player[data-position='0'] .card.fullskin.legend>.name2{
+#arena.mobile:not(.chess) .player[data-position="0"] .card.fullskin.legend > .name2 {
 	color: rgba(106, 27, 154, 1);
 	/*color: rgb(117,186,0);*/
 }
-.bordered{
-	border:1px solid rgba(255, 255, 255,0.5);
+.bordered {
+	border: 1px solid rgba(255, 255, 255, 0.5);
 }
 
-.dialog.popped .config>.toggle.onoff>div{
-	border:1px solid rgba(77, 60, 51,0.8);
+.dialog.popped .config > .toggle.onoff > div {
+	border: 1px solid rgba(77, 60, 51, 0.8);
 	box-shadow: none;
 }
-.dialog.popped .config>.toggle.onoff>div>div{
-	background:rgba(77, 60, 51,0.8);
-	border:1px solid rgba(77, 60, 51,0);
-	box-shadow:none;
+.dialog.popped .config > .toggle.onoff > div > div {
+	background: rgba(77, 60, 51, 0.8);
+	border: 1px solid rgba(77, 60, 51, 0);
+	box-shadow: none;
 }
 
-.player>.turned{
-	color: rgba(0,0,0,0.8);
+.player > .turned {
+	color: rgba(0, 0, 0, 0.8);
 	background: white;
 }
-.player .marks>div:first-child>div{
+.player .marks > div:first-child > div {
 	-webkit-filter: invert(0.8) sepia(1);
 }
 
-#roundmenu.clock>div:nth-of-type(15){
-	background: url('wood2.png');
-	box-shadow: rgba(0,0,0,0.5) 0 0 5px inset;
+#roundmenu.clock > div:nth-of-type(15) {
+	background: url("wood2.png");
+	box-shadow: rgba(0, 0, 0, 0.5) 0 0 5px inset;
 }
-.menubg.charactercard>.ava>.avatar{
-    box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px;
+.menubg.charactercard > .ava > .avatar {
+	box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px;
 }
 
-#arena:not(.chess) .player[data-position='0']>.equips>.equip5>.image{
+#arena:not(.chess) .player[data-position="0"] > .equips > .equip5 > .image {
 	background-position: -6px -6px;
 }