@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
:root{color-scheme:dark;--bg:#111411;--fg:#e7e6d7;--muted:#8f9988;--green:#c4de84;--line:#343e31}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:12px 'IBM Plex Mono',monospace}header,main,footer{max-width:1300px;margin:auto}header{padding:28px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.logo{font-weight:600;font-size:20px;text-decoration:none;color:var(--fg)}.logo span{color:var(--green)}.header-note,.online{font-size:9px;letter-spacing:1px;color:var(--muted)}.online{color:var(--green)}main{padding:0 5% 80px}.hero{position:relative;padding:70px 0 55px;overflow:hidden}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--green)}h1,h2,.card h3{font-family:'Barlow Condensed',Impact,sans-serif}h1{font-size:clamp(70px,9vw,124px);line-height:.85;font-weight:800;letter-spacing:-1px;margin:30px 0}h1 em{font-style:normal;color:var(--green)}.intro{color:var(--muted);line-height:1.9}.hero-number{position:absolute;right:2%;top:30px;font:280px Arial;color:#283421;transform:rotate(-8deg);z-index:-1}.library-head{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:28px 0;gap:20px}h2{font-size:24px;font-weight:600;letter-spacing:1px;margin:0}h2 span{font:11px monospace;display:inline-block;padding:5px 8px;background:#283222;color:var(--green);vertical-align:middle;margin-left:12px}.search{border:1px solid var(--line);padding:10px 14px;color:var(--muted)}input{background:none;border:0;color:var(--fg);font:11px monospace;max-width:180px;outline-offset:6px}.filters{display:flex;gap:10px;margin:0 0 24px}.filters button{font:9px 'IBM Plex Mono',monospace;letter-spacing:1px;color:var(--muted);border:1px solid var(--line);background:transparent;padding:10px 15px;cursor:pointer}.filters .active{background:var(--green);border-color:var(--green);color:#172310}.games{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{border:1px solid var(--line);color:var(--fg);text-decoration:none;background:#1b2018;display:flex;flex-direction:column;transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-4px);border-color:var(--green)}.cover{height:200px;padding:25px;background:radial-gradient(ellipse at 40% 65%,#553b1f55,#131811);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.cover:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#0004 4px);pointer-events:none}.cover-title{font:bold 43px/.9 'Barlow Condensed',Impact,sans-serif;color:#d5c281;transform:rotate(-3deg)}.cover-title span{color:#eb5769}.cover svg{width:100%;height:50px;position:absolute;bottom:10px;opacity:.45}.generic{background:radial-gradient(ellipse,#3e563a,#131c17)}.generic .cover-title{color:var(--green);font-size:70px}.card-content{padding:23px;flex:1;display:flex;flex-direction:column}.category{font-size:8px;color:var(--green);letter-spacing:1px}.card h3{font-size:29px;margin:12px 0}.card p{font-size:10px;line-height:1.8;color:var(--muted);margin:0 0 25px}.card-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:17px;border-top:1px solid var(--line);font-size:9px;color:var(--muted)}.play{color:var(--green);letter-spacing:1px}.empty{color:var(--muted);line-height:1.8;grid-column:1/-1;padding:25px 0}footer{border-top:1px solid var(--line);padding:25px 5%;display:flex;justify-content:space-between;gap:20px;font-size:8px;color:var(--muted);letter-spacing:1px}:focus-visible{outline:2px solid var(--green);outline-offset:4px}@media(max-width:850px){.games{grid-template-columns:repeat(2,1fr)}.header-note{display:none}.hero{padding-top:45px}.hero-number{font-size:210px;opacity:.6}}@media(max-width:550px){.games{grid-template-columns:1fr}.library-head{align-items:flex-start;flex-direction:column}.search{width:100%}.search input{max-width:none;width:90%}h1{font-size:72px}.hero{padding-bottom:35px}.hero-number{right:-40px;top:60px}footer{flex-direction:column;font-size:7px}.cover{height:220px}.cover-title{font-size:50px}.card h3{font-size:32px}}@media(prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}