@import "https://fonts.googleapis.com/css2?family=Bangers&family=Nunito:wght@500;700;900&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-main:#111417;--bg-panel:#1c2328;--bg-card:#252f36;--bg-card-hover:#2d3b45;--bg-overlay:#080b0ec7;--text-main:#eef4f6;--text-soft:#b8c7cf;--accent:#ffc857;--accent-2:#ff8c42;--outline:#3b4a53;--shadow:#00000073}body{background-color:var(--bg-main);min-height:100vh;color:var(--text-main);background-image:radial-gradient(circle at 12px 12px,#ffffff09 2px,#0000 0),radial-gradient(circle at 36px 36px,#ffffff05 2px,#0000 0);background-size:48px 48px;font-family:Nunito,sans-serif;line-height:1.4}#root{place-items:center;min-height:100vh;padding:1.2rem;display:grid}.app{gap:1rem;width:min(920px,100%);display:grid}.scoreboard{background-color:var(--bg-panel);border:2px solid var(--outline);box-shadow:0 10px 22px var(--shadow);border-radius:16px;padding:1rem 1.2rem}.scoreboard .scoreboard__title{letter-spacing:1.2px;color:var(--accent);text-shadow:2px 2px #000;font-family:Bangers,cursive;font-size:clamp(1.9rem,3.5vw,2.5rem)}.scoreboard .scoreboard__line{color:var(--text-main);margin-top:.3rem;font-size:clamp(.95rem,2.3vw,1.15rem)}.scoreboard .scoreboard__goal{color:var(--text-soft);margin-top:.35rem;font-size:.92rem}.game-board{grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;display:grid}.card{--mx:50%;--my:50%;--rx:0deg;--ry:0deg;--ty:0px;aspect-ratio:1;background-color:var(--bg-card);border:2px solid var(--outline);cursor:pointer;width:100%;transform-style:preserve-3d;box-shadow:0 8px 18px var(--shadow);transform:perspective(760px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(var(--ty));border-radius:14px;transition:transform .18s,box-shadow .18s,background-color .18s;position:relative;overflow:hidden}.card:hover{background-color:var(--bg-card-hover);box-shadow:0 15px 26px #00000080}.card:focus-visible{outline:3px solid var(--accent-2);outline-offset:2px}.card:disabled{cursor:not-allowed;opacity:.7}.card .card__image{object-fit:cover;width:100%;height:100%;display:block}.card .card__shine{pointer-events:none;background-image:radial-gradient(circle at var(--mx) var(--my), #ffffff38, transparent 45%);mix-blend-mode:screen;opacity:0;transition:opacity .22s;position:absolute;inset:0}.card:hover .card__shine{opacity:1}.footer{text-align:center;color:var(--text-soft);margin-top:.2rem;font-size:.95rem}.footer a{color:var(--accent);font-weight:700;text-decoration:none}.footer a:hover{color:var(--accent-2)}.modal-backdrop{background-color:var(--bg-overlay);place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{background-color:var(--bg-panel);border:2px solid var(--outline);width:min(420px,100%);box-shadow:0 16px 28px var(--shadow);border-radius:16px;padding:1.1rem}.modal .modal__title{color:var(--accent);letter-spacing:1px;font-family:Bangers,cursive;font-size:2rem}.modal .modal__message{color:var(--text-main);margin-top:.45rem}.modal .modal__gif{aspect-ratio:1;object-fit:contain;border:2px solid var(--outline);background-color:#0f1418;border-radius:10px;width:100%;margin-top:.55rem}.modal .modal__actions{justify-content:flex-end;gap:.6rem;margin-top:1rem;display:flex}.button{background-color:var(--accent);color:#111;cursor:pointer;border:2px solid #000;border-radius:999px;padding:.52rem 1rem;font-family:Nunito,sans-serif;font-weight:900;transition:transform .14s,background-color .14s}.button:hover{background-color:var(--accent-2);transform:translateY(-1px)}.button--ghost{color:var(--text-main);border-color:var(--outline);background-color:#0000}@media (width<=700px){#root{padding:.8rem}.game-board{gap:.55rem}.scoreboard{padding:.9rem}}
