feat: update style

src/ui/Duel/Message/NewModal/index.tsx

 import { Button, Modal, type ModalProps } from "antd";
 import { type FC, useRef, useState, type CSSProperties } from "react";
-import { MinusOutlined } from "@ant-design/icons";
+import { MinusOutlined, UpOutlined } from "@ant-design/icons";
 import classNames from "classnames";
 import "./index.scss";
 
@@ -8,16 +8,18 @@ interface Props extends ModalProps {
   canBeMinimized?: boolean;
 }
 
-export const NewModal: FC<Props> = (props) => {
+export const NeosModal: FC<Props> = (props) => {
   const { canBeMinimized = true } = props;
   const [mini, setMini] = useState(false);
   return (
     <Modal
       className={classNames("neos-modal", { "neos-modal-mini": mini })}
       centered
+      maskClosable={false}
       onCancel={() => setMini(!mini)}
-      closeIcon={<MinusOutlined />}
+      closeIcon={mini ? <UpOutlined /> : <MinusOutlined />}
       bodyStyle={{ padding: "10px 0" }}
+      mask={!mini}
       {...props}
     />
   );

src/ui/Duel/Message/NewSelectActionModal/index.tsx

@@ -25,7 +25,7 @@ import { matStore } from "@/stores";
 
 import { groupBy } from "../../utils";
 
-import { NewModal } from "../NewModal";
+import { NeosModal } from "../NewModal";
 import { YgoCard } from "@/ui/Shared";
 import "./index.scss";
 
@@ -133,7 +133,7 @@ export const NewSelectActionsModal: FC = () => {
   );
 
   return (
-    <NewModal
+    <NeosModal
       title={
         <>
           <span>{preHintMsg}</span>
@@ -204,7 +204,7 @@ export const NewSelectActionsModal: FC = () => {
           ))}
         </Space>
       </div>
-    </NewModal>
+    </NeosModal>
   );
 };
 

src/ui/Duel/PlayMat/Bg/index.scss

@@ -19,7 +19,7 @@ section#mat {
     height: var(--block-height-m);
     width: var(--block-width);
     // background-color: rgba(128, 128, 128, 0.447);
-    background: radial-gradient(#232323, #212121);
+    background: radial-gradient(#262626, #303030);
     // box-shadow: 0 0 0 1px purple;
     position: relative;
     &.extra {
@@ -29,13 +29,17 @@ section#mat {
       height: var(--block-height-s);
     }
     &.highlight {
-      box-shadow: 0 0 0 1px #00b0ff, 0 0 13px 0px #0077ff,
-        0 0 11px 0 skyblue inset;
+      // box-shadow: 0 0 0 1px #00b0ff, 0 0 13px 0px #0077ff,
+      //   0 0 11px 0 skyblue inset;
+      background: #142f47;
+      .triangle {
+        --color: #006eff;
+      }
     }
     .triangle {
       width: 0;
       height: 0;
-      --color: #292929;
+      --color: #444444;
       border-width: 5px;
       border-style: solid;
       position: absolute;

src/ui/Duel/PlayMat/Card/index.scss

@@ -94,7 +94,7 @@ section#mat {
   }
 }
 
-.highlight {
+.mat-card .highlight {
   box-shadow: 0 0 10px 2px #5db7ff;
 }