:root{font-family:Trebuchet MS,Arial,sans-serif;color:#173d59}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow:hidden;background:#82cfee url(assets/background.png) center/cover no-repeat}.game{position:relative;min-height:100vh;padding:14px 24px;background:linear-gradient(#18558222,#ffdc8033)}.back,.ok,.exit{display:inline-flex;align-items:center;justify-content:center;border:5px solid #fff;border-radius:22px;background:linear-gradient(#5ce0ff,#159bd3);box-shadow:inset 0 5px 4px #fff8,0 7px #075e87;color:#fff;text-decoration:none;font-weight:900;text-shadow:0 2px #075477;cursor:pointer}.back{position:absolute;z-index:5;left:24px;top:20px;padding:11px 18px}.hud{position:relative;z-index:3;display:grid;grid-template-columns:130px minmax(280px,460px) 130px 190px;justify-content:center;gap:14px;align-items:center}.hud>div,.hud h1,.lives,.message{border:5px solid #fff;background:linear-gradient(#fff9d5,#ffc74f);box-shadow:inset 0 5px 5px #fff9,0 7px #c16a18,0 12px 25px #26375044}.hud>div{padding:7px 15px;border-radius:22px;text-align:center}.hud .counter,.hud .lives{border:6px solid #fff;box-shadow:inset 0 7px 5px #fff8,0 8px #6626a0,0 14px 22px #26375055}.hud .counter:nth-of-type(1){background:linear-gradient(#ad7aff,#7338cf);color:#fff}.hud .counter:nth-of-type(2){background:linear-gradient(#54dcff,#148fd0);color:#fff}.hud .lives{background:linear-gradient(#ff77c6,#d52b87)}.hud .counter small,.hud .lives small{color:#fff;text-shadow:0 2px #633383}.hud .counter b{font-size:24px;text-shadow:0 2px #3d226d}.hud small,.hud b{display:block}.hud small{font-weight:900;color:#9a4b16}.hud b{font-size:22px}.hud h1{margin:0;padding:12px 25px;border-radius:28px;text-align:center;border-color:#fff;background:linear-gradient(135deg,#8d5be7,#d64fab);box-shadow:inset 0 7px 5px #fff7,0 9px #56258f,0 15px 24px #26375055;color:#fff;font-size:clamp(25px,3vw,42px);text-shadow:0 3px #56258f}.info{position:absolute;z-index:6;right:28px;top:22px;width:76px;height:68px;border:0;background:transparent url(assets/info-button.png) center/contain no-repeat;color:transparent;font-size:0;cursor:pointer}.lives{position:relative;padding:8px 16px;border-radius:22px;text-align:center}.lives small{display:block;color:#9a4b16;font-weight:900}.lives span{display:inline-block;width:34px;height:34px;transition:.3s}.lives span img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 1px #8e124c)}.lives span.lost{filter:grayscale(1);opacity:.25;transform:scale(.75)}.playground{position:relative;z-index:2;display:flex;justify-content:center;align-items:center;gap:clamp(20px,4vw,75px);margin:105px auto 0;max-width:1120px}.card{position:relative;width:min(36vw,470px);aspect-ratio:1;border:13px solid #fff;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff,#fff8cf 70%,#ffd369);box-shadow:0 12px #dc8221,0 24px 35px #25364766,inset 0 0 0 6px #ffad35}.symbol{position:absolute;display:grid;place-items:center;width:23%;height:23%;border:0;background:transparent;color:var(--color);font:900 clamp(30px,5vw,70px) "Trebuchet MS";text-shadow:0 4px #fff,2px 0 #fff,-2px 0 #fff,0 -2px #fff,0 7px 8px #26375055;cursor:pointer;transform:translate(-50%,-50%) rotate(var(--rot))}.symbol:hover{filter:brightness(1.12);scale:1.12}.symbol.correct{animation:pop .55s ease}.symbol.wrong{animation:shake .4s ease}.match-sign{display:grid;place-items:center;width:72px;height:72px;border:7px solid #fff;border-radius:50%;background:#ec4fa1;box-shadow:0 7px #9d1d64;color:#fff;font-size:50px;font-weight:900}.message{position:relative;z-index:3;width:max-content;max-width:90%;margin:28px auto 0;border-radius:22px;font-size:20px;font-weight:900;min-height:0;padding:0;border:0;background:transparent;box-shadow:none}dialog{width:min(570px,92vw);border:8px solid #fff;border-radius:38px;background:linear-gradient(#fffef0,#ddf8ff);box-shadow:0 12px #8244b9,0 30px 70px #172b3c99;padding:34px;text-align:center;color:#174c6a}dialog::backdrop{background:#15376199;backdrop-filter:blur(5px)}dialog h2{margin:0 0 10px;font-size:38px}dialog p{font-size:20px;font-weight:700}.result-dialog{overflow:visible;border-color:#fff7cf;background:linear-gradient(145deg,#fffbdc,#d8f8ff);box-shadow:0 14px #d77820,0 30px 70px #172b3c99,inset 0 8px 10px #fff}.result-star{display:grid;place-items:center;width:94px;height:94px;margin:-82px auto 12px;border:7px solid #fff;border-radius:50%;background:linear-gradient(#ffe75a,#ff9f19);box-shadow:0 8px #bd5916;color:#fff;font-size:54px;text-shadow:0 4px #dc7614}.result-actions{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:22px}.result-actions .exit{margin:0}.close{position:absolute;right:14px;top:12px;width:45px;height:45px;border:4px solid #fff;border-radius:50%;background:#ec4f9e;box-shadow:0 5px #941957;color:#fff;font-size:27px;font-weight:900}.ok,.exit{padding:12px 24px;font-size:18px}.ok{background:linear-gradient(#9bee4e,#43bd28);box-shadow:inset 0 5px 4px #fff8,0 7px #267b1c}.exit{margin-left:12px;background:linear-gradient(#ff87c9,#e43089);box-shadow:inset 0 5px 4px #fff8,0 7px #8c174f}@keyframes pop{50%{transform:translate(-50%,-50%) scale(1.5)}}@keyframes shake{25%{translate:-10px}75%{translate:10px}}@media(max-width:760px){body{overflow:auto}.game{min-height:100svh;padding:8px}.back{position:relative;left:auto;top:auto;padding:8px 12px}.hud{grid-template-columns:90px 1fr 90px;margin-top:10px}.hud h1{font-size:21px;padding:10px 4px}.hud>div{padding:5px}.hud b{font-size:16px}.info{right:8px;top:80px;width:54px;height:54px}.lives{right:70px;top:80px}.playground{gap:8px;margin-top:80px}.card{width:44vw;border-width:8px}.match-sign{width:38px;height:38px;border-width:4px;font-size:25px}.symbol{font-size:clamp(22px,8vw,48px)}.giraffe{display:none}.message{font-size:16px}}.symbol{width:25%;height:25%;padding:0;color:transparent;font-size:0;text-shadow:none;filter:drop-shadow(0 6px 5px #26375044)}.symbol img{display:block;width:100%;height:100%;object-fit:contain}.symbol:hover{filter:brightness(1.12) drop-shadow(0 8px 6px #26375055)}