@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#111310;--panel:#1a1e17;--line:#343b2e;--accent:#f4d54a;--muted:#a1aa96}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f1f2e8;font-family:'Space Grotesk','Noto Sans TC',sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}header{border-bottom:1px solid var(--line);padding:26px max(5%,calc((100vw - 1280px)/2));display:flex;align-items:center;justify-content:space-between}.brand{font-size:22px;font-weight:700;letter-spacing:2px}.brand span{font-size:12px;color:var(--accent)}header>a:last-child{font-size:12px;color:var(--muted)}main{max-width:1280px;margin:0 auto;padding:46px 32px 70px}.eyebrow{color:var(--accent);font-size:10px;letter-spacing:3px}h1{font-size:clamp(36px,5vw,60px);margin:14px 0;letter-spacing:-2px;line-height:1.2}.intro{color:var(--muted);font-size:14px;margin:0 0 30px}.search-row{display:flex;gap:16px}.search-box{position:relative;flex:1;display:flex;align-items:center;border:1px solid #58624b;background:var(--panel);min-width:0}.search-icon{font-size:24px;margin-left:17px;color:var(--accent)}input[type=search]{width:100%;padding:16px 46px 16px 14px;border:0;background:transparent;color:#f1f2e8;font-size:15px;min-width:0}input[type=search]::-webkit-search-cancel-button{display:none}input::placeholder{color:#89937e}#clear{position:absolute;right:11px;top:12px;border:0;background:transparent;color:#bbc4af;font-size:23px;padding:0 6px}.sort-box{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted)}select{background:var(--panel);border:1px solid var(--line);color:#e2e8d8;padding:16px 12px;max-width:160px}.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.filters button{background:transparent;border:1px solid var(--line);color:#b0baa3;padding:9px 14px;font-size:12px;border-radius:4px}.filters button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#1b2314;font-weight:700}.results{display:flex;align-items:center;justify-content:space-between;margin:28px 0 18px;color:var(--muted);font-size:11px}.results span:last-child{font-size:10px;letter-spacing:1px}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.game-card{border:1px solid var(--line);background:var(--panel);min-width:0;transition:transform .18s,border-color .18s}.game-card:hover{transform:translateY(-4px);border-color:var(--accent)}.cover{height:180px;position:relative;overflow:hidden;background:#e9c937;color:#223021}.cover-code{position:absolute;top:9px;left:18px;font-size:62px;font-weight:700;letter-spacing:-5px;font-style:italic;white-space:nowrap}.road{position:absolute;left:-10%;top:105px;width:130%;height:55px;background:#263024;transform:rotate(-15deg);border-top:2px solid #ece8b6;border-bottom:2px solid #ece8b6}.racer{position:absolute;left:43%;top:88px;width:130px;height:45px;background:linear-gradient(170deg,#f4ecba 20%,#a7ac91 50%,#303a2c 53%);border:2px solid #243024;border-radius:55% 50% 20% 20%;transform:rotate(-15deg);box-shadow:0 10px 12px #0005}.racer:before{content:'';position:absolute;left:33px;top:-13px;width:65px;height:20px;background:#1b413e;clip-path:polygon(15% 0,85% 0,100% 100%,0 100%)}.racer:after{content:'';position:absolute;left:8px;top:26px;width:24px;height:6px;background:#fff5b4;box-shadow:86px 0 #fff5b4}.cover-year{position:absolute;bottom:12px;left:17px;font-size:10px;letter-spacing:3px;color:#f1ebc5}.outrun .cover{background:#80c8c4}.outrun .cover-code{font-size:49px;top:20px}.outrun .racer{background:linear-gradient(170deg,#f56552,#b7362a 60%,#432720 63%)}.monaco .cover{background:#b09ad3}.monaco .cover-code{font-size:45px;letter-spacing:-3px;top:20px}.f1 .cover{background:#c6594d}.f1 .cover-code,.f1rc .cover-code{font-size:54px;top:16px;color:#f0ead3}.nfs2 .cover{background:#a5c95e}.f1rc .cover{background:#557b98}.card-info{padding:20px}.card-meta{display:flex;align-items:center;justify-content:space-between;gap:8px}.platform-label{text-transform:uppercase;font-size:9px;letter-spacing:1px;color:var(--accent)}.region{font-size:9px;color:#9aa78d}.card-info h2{font-size:20px;font-weight:500;line-height:1.3;min-height:52px;margin:14px 0 9px;letter-spacing:-.5px}.card-info p{font-size:11px;color:#a5b197;line-height:1.7;margin:0 0 20px;min-height:38px}.card-foot{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:15px;font-size:12px;font-weight:500}.card-foot span:last-child{font-size:18px;color:var(--accent)}[hidden]{display:none!important}#empty{text-align:center;padding:55px 20px;border:1px dashed var(--line)}#empty h2{font-size:22px}#empty p{font-size:13px;color:var(--muted)}#reset{margin-top:10px;border:0;background:var(--accent);color:#1b2314;padding:12px 22px}.controls{margin-top:40px;padding:24px;border:1px solid var(--line)}.controls h2{font-size:14px;margin:0 0 17px;font-weight:500}.keys{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:12px;color:#aab69b}.keys span{margin-right:12px}kbd{font:12px 'Space Grotesk',sans-serif;display:inline-grid;place-items:center;min-width:28px;height:29px;padding:4px 7px;border:1px solid #4b5840;border-radius:4px;color:#e2e7d8;background:#252d1f}.controls p{font-size:11px;line-height:1.9;color:#849476;margin:17px 0 0}footer{border-top:1px solid var(--line);padding:24px 5%;display:flex;justify-content:space-between;color:#7b8971;font-size:10px;letter-spacing:1px}@media(max-width:1000px){.game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){header{padding:22px 6%}main{padding:30px 6% 50px}.search-row{flex-direction:column;gap:12px}.sort-box{justify-content:flex-end}.sort-box select{padding:10px}.game-grid{grid-template-columns:1fr;gap:20px}.cover{height:170px}.card-info h2,.card-info p{min-height:0}.results span:last-child{display:none}.filters button{padding:9px 11px;font-size:11px}.controls{padding:20px}.brand{font-size:19px}header>a:last-child{font-size:11px}}