
:root{color-scheme:dark;--cyan:#00d4ff;--purple:#b537ff;--pink:#ff007a;--text-gray:#b3bfd2;--card-border:#ffffff21}
body{background:radial-gradient(ellipse at 15% 0,#12163b,transparent 55%),#060818;color:#f3f7fc;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
header{position:relative;background:transparent;padding:20px max(24px,calc((100vw - 1152px)/2));backdrop-filter:none}
.logo-img{height:38px}.logo-text{background:linear-gradient(135deg,var(--cyan),var(--purple),var(--pink));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:1.35rem;letter-spacing:-.06em}.container{padding-top:28px}
.eyebrow{font-size:.68rem;font-weight:800;letter-spacing:.2em;color:#00d4ff;margin-bottom:12px}
h1{font-size:clamp(1.8rem,4vw,3rem);letter-spacing:-.055em;background:linear-gradient(135deg,var(--cyan),var(--blue),var(--purple));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1.15}
.subtitle{font-size:1rem;margin-top:12px;margin-bottom:28px}.search-filter-wrapper{flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.search-box{max-width:390px}.search-input{background:#10142e;border-radius:10px}.filter-tab{min-height:44px;border-radius:8px}.filter-tab.active{background:linear-gradient(135deg,var(--cyan),var(--purple));color:#fff;box-shadow:0 4px 15px #00d4ff30}
.section-title{font-size:1rem;font-weight:750;background:linear-gradient(135deg,var(--purple),var(--pink));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.games-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.game-card{padding:0 20px 20px;background:#10132e;border-radius:16px;box-shadow:none}.game-card:hover{transform:translateY(-4px);background:#1a2042;box-shadow:0 14px 35px #0005;border-color:#00d4ff80}.game-card::before{display:none}.game-icon{font-size:0;height:170px;margin:0 -20px 18px;background-size:cover;background-position:center}.game-title{font-size:1.15rem;letter-spacing:-.025em}.game-description{font-size:.85rem;line-height:1.6}.code-bracket{display:none}footer{margin-top:32px;font-size:.85rem}
:focus-visible{outline:3px solid #ffaa00!important;outline-offset:4px}
@media(max-width:900px){.search-filter-wrapper{flex-direction:column;align-items:stretch}.search-box{max-width:none}.games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){header{padding:16px}.container{padding:24px 14px}.games-grid{gap:12px}.game-card{padding:0 12px 14px}.game-icon{margin:0 -12px 12px;height:112px}.game-title{font-size:1rem}.game-description{font-size:.76rem}.filter-tabs{gap:5px}.filter-tab{padding:8px 10px;font-size:.8rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.game-card[href*="/snake/"] .game-icon{background-image:url("img/arcade/snake.svg")}
.game-card[href*="/tic-tac-toe/"] .game-icon{background-image:url("img/arcade/tic-tac-toe.svg")}
.game-card[href*="/2048/"] .game-icon{background-image:url("img/arcade/2048.svg")}
.game-card[href*="/memory/"] .game-icon{background-image:url("img/arcade/memory.svg")}
.game-card[href*="/tetris/"] .game-icon{background-image:url("img/arcade/tetris.svg")}
.game-card[href*="/pong/"] .game-icon{background-image:url("img/arcade/pong.svg")}
.game-card[href*="/breakout/"] .game-icon{background-image:url("img/arcade/breakout.svg")}
.game-card[href*="/flappy-bird/"] .game-icon{background-image:url("img/arcade/flappy-bird.svg")}
.game-card[href*="/minesweeper/"] .game-icon{background-image:url("img/arcade/minesweeper.svg")}
.game-card[href*="/sliding-puzzle/"] .game-icon{background-image:url("img/arcade/sliding-puzzle.svg")}
.game-card[href*="/lava-run/"] .game-icon{background-image:url("img/arcade/lava-run.svg")}
.game-card[href*="/pac-man/"] .game-icon{background-image:url("img/arcade/pac-man.svg")}
.game-card[href*="/asteroids/"] .game-icon{background-image:url("img/arcade/asteroids.svg")}
.game-card[href*="/space-invaders/"] .game-icon{background-image:url("img/arcade/space-invaders.svg")}
.game-card[href*="/poly-track/"] .game-icon{background-image:url("img/arcade/poly-track.svg")}
