/* 07.05.2026 22:10 Works according to Milestone 1 */
/* ================== БАЗОВІ СТИЛІ ТА ФОН ================== */
:root {
/*
  --dark-cell: rgb(181, 136, 99);
  --white-cell: rgb(240, 217, 181);
  --dark-side-board: rgba(100, 70, 50, 0.5);
  --color-border-cell: rgba(0,0,0,0.5);

  --font-family: 'Newsreader', -apple-system, BlinkMacSystemFont, 'Segoe UI', Georgia, serif;

  --cell-litera-gap: 3.4rem;
  --cell-litera-font-size: 1.0rem;
  --cell-number-gap: 2.8rem;
  --cell-number-font-size: 1.0rem;
*/


  /*--dark-cell: rgb(252, 191, 250);*/
  /*--dark-side-board: rgba(217, 121, 200, 0.5);*/
  
  /*--sideR: 35;
  --sideG: 70;
  --sideB: 50;
  */

  --dark-cell: rgb(140, 242, 242);
  --dark-side-board: rgba(105, 172, 192, 0.5);
  
  --white-cell: rgb(255, 255, 255);
  --color-border-cell: rgba(0, 0, 0, 0.75);

  --font-family: 'Press Start 2P', cursive;
  --cell-litera-gap: 2.8rem;
  --cell-litera-font-size: 1.0rem;

  --cell-number-gap: 2.8rem;
  --cell-number-font-size: 1.0rem;  

}


*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}


html {
  /*font-size: 1.2vmax;*/
  font-size: 1vmin;

  transition: font-size 0.4s ease-in-out; /* плавний перехід при зміні орієнтації */
}

/* Високі, майже квадратні екрани (4:3, 5:4, 3:2) */
@media (max-aspect-ratio: 6/4) {
  html {
    /*font-size: 1.5vmax;*/
  font-size: 1.75vmin;
  }
}


/* Звичайні екрани (16:10, 16:9)*/
@media (min-aspect-ratio: 6/4) and (max-aspect-ratio: 21/9) {
  html {
    /*font-size: 1.15vmax;*/
    font-size: 1.91vmin;
  }
}


/* Дуже широкі екрани (21:9 і більше) */
@media (min-aspect-ratio: 21/9) {
  html {
    /*font-size: 1vh;*/
    font-size: 1.91vmin;
  }
}


/* Надвисокі портретні дисплеї (наприклад, телефони 9:16) 
@media (max-aspect-ratio: 9/16) {
  html {
    font-size: 1.6vh;
  }
}
*/


body {
	width: 100vw;
	height: auto;

	display: flex;
	flex-direction: column;

	/*font-family: 'Roboto', sans-serif;*/

	/*font-family: 'Newsreader', -apple-system, BlinkMacSystemFont, Georgia, serif;	*/

	font-family: 'Newsreader', -apple-system, BlinkMacSystemFont, 'Segoe UI', Georgia, serif;

	/*Згладжування шрифтів і зазубринок
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
*/

	color: rgb(201, 209, 217);
	background-color: rgb(0, 0, 0);

	overflow: hidden;
	overflow-y: auto;
}

/* ===================================== GLOBAL =============================================*/
h1, h2, h3 {
	font-family: 'Orbitron', sans-serif;
	font-weight: 700;
	color: rgb(255, 255, 255);
}

/*
        body {
            font-family: 'Roboto', sans-serif;
            color: #C9D1D9;
            background-color: #0D1117;
            background-image:
                radial-gradient(circle at 15% 25%, rgba(138, 43, 226, 0.2), transparent 40%),
                radial-gradient(circle at 85% 75%, rgba(0, 229, 255, 0.15), transparent 40%),
                url('https://www.transparenttextures.com/patterns/cubes.png');
            background-attachment: fixed;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            padding: 2rem 1rem;
        }
*/