*,:after,:before{box-sizing:border-box;margin:0;padding:0}@font-face{font-family:montserrat_alternatesmedium;font-style:normal;font-weight:400;src:url(../assets/fonts/394a96aa04144e700ed9.woff2) format("woff2"),url(../assets/fonts/f24490d6643041a481aa.woff) format("woff")}:root{--slate50:#f8fafc;--slate100:#f1f5f9;--slate200:#e2e8f0;--slate300:#cbd5e1;--slate400:#94a3b8;--slate500:#64748b;--slate600:#475569;--slate700:#334155;--slate800:#1e293b;--slate900:#0f172a;--slate950:#020617;--red200:#fecaca;--red300:#fca5a5;--red400:#f87171;--red500:#ef4444;--red600:#dc2626;--red700:#b91c1c;--fonts-big:2.5vw;--fonts-normal:1.5vw;--fonts-small:0.9vw;--padding-min:1vw;--radius:10px}body{background-color:var(--slate50);color:var(--slate950);display:grid;font-family:montserrat_alternatesmedium,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;gap:1vw;grid-template:[row1-start] "header" [row1-end] [row2-start] "main" [row2-end] [row3-start] "footer" [row3-end]/1fr}.body-header{background-color:var(--slate700);color:var(--slate50);grid-area:header;max-height:15vh;min-height:7vh}.body-footer,.body-header{align-items:center;display:flex;justify-content:center}.header-title{font-size:var(--fonts-big);padding:var(--padding-min)}.body-main{font-size:var(--fonts-normal);grid-area:main;grid-template:[row1-start] "instructions instructions" [row1-end] [row2-start] "player-one-name player-two-name" [row2-end] [row3-start] "player-board rival-board" [row3-end] [row4-start] "player-ships rival-ships" [row4-end]/1fr 1fr;min-height:79vh}.body-main,.instructions{align-items:center;display:grid;gap:1vw;justify-items:center}.instructions{grid-area:instructions;grid-template:[row1-start] "messages btnStart" [row1-end]/.8fr .2fr;width:100%}.messages{background-color:var(--slate300);border-radius:var(--radius);grid-area:messages;padding:var(--padding-min);width:35%}.message-field{display:flex;justify-content:center;justify-items:center}.buttons{background-color:var(--slate700);border:none;border-radius:var(--radius);box-shadow:5px 5px 5px 1px var(--slate300);color:var(--slate50);font-size:var(--fonts-normal);grid-area:btnStart;padding:var(--padding-min);width:30%}.buttons:hover{background-color:var(--slate600);box-shadow:5px 5px 5px 1px var(--slate200)}.buttons:active{box-shadow:none;transform:translateY(5px)}.players-name{align-self:end;color:var(--slate700)}.player-one-name{grid-area:player-one-name;min-width:50%;text-align:center}.player-two-name{grid-area:player-two-name}.boards{border:2px solid var(--slate700)}.cell-border{border:1px solid var(--slate300)}.cell-size,.icons-size{height:2vw;width:2vw}.player-board{grid-area:player-board}.ship-placed{background-color:var(--slate700)}.ship-shadow{background-color:var(--slate200)}.ship-shadow-invalid{background-color:var(--red400)}.rival-board{grid-area:rival-board}.ship-hit,.ship-sunked{background-color:var(--red500)}.missed-hit,.ships-container{background-color:var(--slate300)}.ships-container{border-radius:var(--radius);display:flex;flex-direction:column;height:10vw;padding:.5vw;width:15vw}.player-ships{grid-area:player-ships}.rival-ships{grid-area:rival-ships}.body-footer{background-color:var(--slate100);color:var(--slate600);font-size:var(--fonts-small);grid-area:footer;max-height:8vh;min-height:7vh}.body-footer,.credits,.footer-icons{padding:var(--padding-min)}