header{width:100vw;padding:1px;background-color:var(--header-clr)}header h1{font-size:clamp(1.25rem,5vw,1.5rem);color:var(--header-text-clr)}.form__input-button,.form__input-text,.multiplier__button{font-family:Poppins,sans-serif;padding:5px;border:2px solid var(--search-border-clr);border-radius:2px}.response-interface{color:var(--main-text-clr);text-align:center}.svg-response{margin-top:10px;width:10%;fill:var(--svg-interface-clr)}main{padding:10px}span{margin-top:10px}form{width:fit-content}label{margin-right:10px;color:var(--main-text-clr)}input[type=text]{text-indent:3px;background-color:transparent;color:var(--main-text-clr)}input[type=text]:focus{outline-color:var(--search-border-focus-clr)}input[type=text]:hover{border-color:var(--search-border-hover-clr)}input[type=submit]{background-color:transparent;color:var(--main-text-clr)}.triple-tile-colour{background-color:var(--triple-tile-clr);color:var(--primary-tile-text-clr)}.double-tile-colour{background-color:var(--double-tile-clr);color:var(--primary-tile-text-clr)}.blank-tile-colour{background-color:var(--blank-tile-clr);color:var(--secondary-tile-text-clr)}.restore-tile-colour{background-color:var(--restore-tile-clr);color:var(--primary-tile-text-clr)}ul.tile-list{padding:0;flex-wrap:wrap;list-style:none;gap:10px}ul.tile-list li{display:flex;flex-direction:column;padding:0}ul.tile-list h2{cursor:pointer;border:2px solid var(--tile-border-clr);border-radius:3px;width:2em;height:2em;-webkit-user-select:none;-ms-user-select:none;user-select:none}ul.tile-list h3{color:var(--main-text-clr)}#multiplier__buttons{gap:10px;margin-bottom:10px}#score{font-size:1.5rem;color:var(--main-text-clr)}.multiplier__button{background-color:var(--multipler-btn-clr);color:var(--main-text-clr)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080}.modal{width:90%;max-width:500px;border-radius:10px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);padding:10px;background-color:var(--modal-clr);z-index:1}.modal h2,.modal p,.modal label{color:var(--modal-text-clr)}.modal p{font-size:.8rem}.modal button{font-family:Poppins,sans-serif;padding:5px;border:none;border-radius:2px}button.close-button{position:absolute;top:10px;right:10px;background-color:transparent;font-size:1rem;cursor:pointer;fill:(--modal-checkbox-clr);width:32px;height:32px}select{-webkit-appearance:base-select;-moz-appearance:base-select;appearance:base-select;color:var(--modal-text-clr);background-color:var(--modal-clr)}input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none}input[type=checkbox]{position:relative;width:1.5em;height:1.5em;border:1px solid var(--modal-checkbox-clr);vertical-align:-7px;color:var(--modal-checkbox-clr);margin-right:10px}input[type=checkbox]:before{content:"✔";position:absolute;font-size:1.2rem;left:1px;top:-5px;visibility:hidden}input[type=checkbox]:checked:before{visibility:visible}ul.modal-list{list-style-type:disc;padding-left:1.5em;margin:0;max-height:300px;overflow-y:auto;color:var(--modal-text-clr)}ul.modal-list>li{cursor:pointer}.mobile-bar{margin-top:30px;gap:20px}.bar-button{width:50%;max-width:150px;background-color:transparent;color:var(--svg-buttons-clr)}.bar-button:hover{color:var(--svg-buttons-hover-clr)}.bar-button svg{--size: 25px;width:var(--size);height:var(--size);margin-right:10px;fill:var(--svg-buttons-clr)}.bar-button:hover svg{fill:var(--svg-buttons-hover-clr)}body[data-theme=water-theme]{--background-clr: #e0f7fa;--main-text-clr: #000;--multipler-btn-clr: #b2ebf2;--triple-tile-clr: #00acc1;--double-tile-clr: #80deea;--blank-tile-clr: #b2ebf2;--restore-tile-clr: var(--blank-tile-clr);--primary-tile-text-clr: #004d4f;--secondary-tile-text-clr: var(--blank-tile-clr);--link-clr: #00acc1;--link-hover-clr: #1de9b6;--svg-buttons-clr: #0e92a4;--svg-buttons-hover-clr: #004d4f;--svg-interface-clr: #0e92a4;--header-clr: #006064;--header-text-clr: #ffffff;--modal-clr: #00796b;--modal-text-clr: #ffffff;--modal-checkbox-clr: #ffffff;--tile-border-clr: #00796b;--search-border-clr: #004d40;--search-border-focus-clr: #1de9b6;--search-border-hover-clr: #00bfae}:root{--background-clr: #fff;--main-text-clr: #000000;--multipler-btn-clr: #f4c8c8;--triple-tile-clr: #0077b6;--double-tile-clr: #90e0ef;--blank-tile-clr: #fcf1e1;--restore-tile-clr: var(--blank-tile-clr);--primary-tile-text-clr: #000;--secondary-tile-text-clr: var(--blank-tile-clr);--link-clr: #0000ff;--link-hover-clr: #808080;--svg-buttons-clr: #000;--svg-buttons-hover-clr: #555555;--svg-interface-clr: #000;--header-clr: #225e3c;--header-text-clr: #ffffff;--modal-clr: #225e3c;--modal-text-clr: #fff;--modal-checkbox-clr: #fff;--tile-border-clr: #000;--search-border-clr: #000;--search-border-focus-clr: #27a05b;--search-border-hover-clr: #808080}body[data-theme=dark-theme]{--background-clr: #121212;--main-text-clr: #f5f5f5;--multipler-btn-clr: #2b2b2b;--triple-tile-clr: #0096c7;--double-tile-clr: #48cae4;--blank-tile-clr: #2b2b2b;--restore-tile-clr: var(--blank-tile-clr);--primary-tile-text-clr: #ffffff;--secondary-tile-text-clr: var(--blank-tile-clr);--link-clr: #48cae4;--link-hover-clr: #0096c7;--svg-buttons-clr: #ffffff;--svg-buttons-hover-clr: #cccccc;--svg-interface-clr: #ffffff;--header-clr: #162f22;--header-text-clr: #e8ffe8;--modal-clr: #1b3a2a;--modal-text-clr: #ffffff;--modal-checkbox-clr: #fff;--tile-border-clr: #e0e0e0;--search-border-clr: #cccccc;--search-border-focus-clr: #27a05b;--search-border-hover-clr: #aaaaaa}body[data-theme=pastel-earth-theme]{--background-clr: #fdf8f2;--main-text-clr: #4b3f36;--multipler-btn-clr: #f5e8d0;--triple-tile-clr: #cbb69c;--double-tile-clr: #dcd3b2;--blank-tile-clr: #f5e8d0;--restore-tile-clr: var(--blank-tile-clr);--primary-tile-text-clr: #4b3f36;--secondary-tile-text-clr: var(--blank-tile-clr);--link-clr: #a79982;--link-hover-clr: #cbb69c;--svg-buttons-clr: #4b3f36;--svg-buttons-hover-clr: #8c7b6b;--svg-interface-clr: #8c7b6b;--header-clr: #a79982;--header-text-clr: #fdf8f2;--modal-clr: #e8dfd3;--modal-text-clr: #4b3f36;--modal-checkbox-clr: #4b3f36;--tile-border-clr: #cbb69c;--search-border-clr: #b3a391;--search-border-focus-clr: #a79982;--search-border-hover-clr: #9b8f7f}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Poppins,sans-serif}body{background:var(--background-clr)}.flex-centre-row{display:flex;align-items:center;justify-content:center}.flex-centre-column{display:flex;flex-direction:column;align-items:center;justify-content:center}button,input[type=submit]{cursor:pointer}a{color:var(--link-clr)}a:hover{color:var(--link-hover-clr)}