* { box-sizing:border-box; }
body { margin:0; padding:18px 3vw 38px; color:#151515; background-color:#35383e; background-image:radial-gradient(#4b4e54 22%,transparent 24%); background-size:4px 4px; font:15px/1.45 Arial,Helvetica,sans-serif; }
a { color:#003b8f; text-decoration:underline; }
a:visited { color:#523b72; }
a:hover { color:#8d1620; background:#efd84a; }
a:focus { outline:2px solid #efd84a; outline-offset:2px; }
.browser-note { color:#e3e1db; font:10px "Courier New",monospace; text-align:center; letter-spacing:1px; text-shadow:1px 1px #111111; }
.site { width:1340px; max-width:100%; margin:auto; overflow:hidden; background:#d2d0c8; border:3px ridge #f2f1eb; box-shadow:0 0 0 2px #202226,10px 10px 0 rgba(0,0,0,.26); }
.head { min-height:148px; padding:21px clamp(24px,3vw,46px) 17px; color:#ffffff; background-color:#11182a; background-image:repeating-linear-gradient(135deg,transparent 0 10px,rgba(255,255,255,.018) 10px 11px); border-bottom:6px ridge #b9b8b1; }
.head small { color:#a7b6de; font:10px "Courier New",monospace; letter-spacing:1px; }
.head h1 { margin:8px 0 0; font:900 clamp(36px,3.5vw,54px)/.86 Impact,"Arial Black",Arial,sans-serif; letter-spacing:-1px; text-shadow:3px 3px #000000; }
.head h1 span { display:block; color:#b9bbc2; font-size:.92em; letter-spacing:0; }
.signal { padding:7px 3vw; color:#e4e7ef; background:#263d78; font:bold 10px "Courier New",monospace; }
.marks { color:#24a4db; }.marks b { color:#e63836; }.marks i { color:#f3ce31; }.marks em { color:#33a86e; }
.nav { width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; }.nav td { width:20%; padding:0; background:#d7d5ce; border:2px outset #f5f4ef; font:11px "Courier New",monospace; text-align:left; }.nav td.current { background:#254990; border-style:inset; }.nav a { display:block; min-height:50px; padding:8px 1.4vw; color:#172342; text-decoration:none; }.nav a b { display:block; font-size:12px; }.nav a small { display:block; margin-top:3px; color:#656862; font-size:8px; letter-spacing:.6px; }.nav td.current a,.nav td.current a small { color:#ffffff; }.nav td:not(.current) a:hover { color:#ffffff; background:#3d568f; }.nav td:not(.current) a:hover small { color:#e8ecf6; }
.layout { width:100%; border-collapse:collapse; }.side { width:210px; padding:13px; background:#b9b8b1; vertical-align:top; border-right:3px groove #ffffff; }.main { padding:clamp(18px,2vw,30px); vertical-align:top; background-color:#e8e7e1; background-image:linear-gradient(rgba(255,255,255,.25) 1px,transparent 1px); background-size:100% 4px; }
.box { margin:0 0 16px; padding:10px; background:#f0efe9; border:2px groove #ffffff; box-shadow:2px 2px 0 rgba(73,73,68,.18); }.box h2,.box h3 { margin:-10px -10px 10px; padding:6px 8px; color:#ffffff; background:#263d78; font:bold 11px "Courier New",monospace; letter-spacing:.25px; }
.counter { width:86px; margin:8px auto; padding:3px; color:#53ff6d; background:#000000; border:3px inset #999999; font:bold 25px "Courier New",monospace; letter-spacing:4px; text-align:center; }
.quick a { display:block; padding:4px; border-bottom:1px dotted #999999; }
.welcome h2 { margin:-10px -10px 10px; padding:6px 8px; color:#ffffff; background:#263d78; font:bold 18px "Times New Roman",serif; }.welcome p { max-width:900px; line-height:1.4; }
.feature { margin-bottom:16px; border:2px solid #263d78; background:#dfe3ec; box-shadow:3px 3px 0 rgba(57,57,53,.2); }.feature.playing { border-color:#151515; background:#f4f4ef; }.bar { padding:7px 10px; color:#ffffff; background:#263d78; font:bold 12px "Courier New",monospace; letter-spacing:.35px; }.playing .bar { background:#333d53; }.feature-inner { padding:22px 28px 24px; border-top:1px solid #ffffff; }.playing .feature-inner { border-left:6px solid #a7353c; }.feature-inner p { max-width:800px; line-height:1.5; }.game-title { color:#173578; font:bold italic 32px Impact,"Arial Black",sans-serif; letter-spacing:-.5px; }.code { color:#555555; font:9px "Courier New",monospace; }.enter { display:inline-block; padding:7px 9px; color:#ffffff!important; background:#a7353c; border:2px outset #db7d81; font:bold 10px "Courier New",monospace; text-decoration:none; }.enter:hover { color:#ffffff; background:#84252b; }
.crumb { padding:5px 7px; color:#555555; background:#d2d2ca; border:1px solid #999999; font:9px "Courier New",monospace; }.page-title { padding:14px; color:#ffffff; background:linear-gradient(120deg,#07143e,#0b357f); border:3px double #9ab0e0; box-shadow:3px 3px 0 #aaa; }.page-title h2 { margin:3px 0; font:bold 28px "Times New Roman",serif; }.kicker { color:#f0d631; font:bold 9px "Courier New",monospace; letter-spacing:.6px; }
.index { width:100%; border-collapse:collapse; }.index th { padding:6px; color:#ffffff; background:#071b64; font:9px "Courier New",monospace; text-align:left; }.index td { padding:7px; background:#ffffff; border:1px solid #aaaaaa; }.index tr.alt td { background:#e5e8ef; }.online { color:#149132; font:bold 9px "Courier New",monospace; }.queued { color:#777777; font:bold 9px "Courier New",monospace; }
.facts { width:100%; border-collapse:collapse; }.facts th { width:110px; padding:6px; color:#13327d; background:#d8deed; border:1px solid #aaaaaa; font:9px "Courier New",monospace; text-align:left; }.facts td { padding:6px; background:#ffffff; border:1px solid #aaaaaa; font:10px "Courier New",monospace; }.article { line-height:1.45; }.photo { display:inline-block; width:45%; height:110px; margin:6px; padding-top:45px; color:#ffffff; background:#26365f; border:3px inset #cccccc; text-align:center; vertical-align:top; }.note { padding:8px; background:#fff7c6; border:1px dashed #9d8600; }.verdict { padding:13px; color:#ffffff; background:#081742; border:4px double #b7c5ea; }
/* PlayStation game pages */
.game-page { max-width:none; }.game-hero { display:grid; grid-template-columns:190px 1fr; gap:24px; align-items:center; padding:18px; color:#ffffff; background:linear-gradient(135deg,#06133c,#123a8c); border:3px double #bac9ec; box-shadow:3px 3px 0 #aaa; }.game-hero h2 { margin:4px 0 8px; font:italic 42px/.95 Impact,"Arial Black",sans-serif; letter-spacing:-1px; }.game-tagline { font:bold 14px/1.45 "Arial Narrow",Arial,sans-serif; letter-spacing:.25px; }.rating-strip { display:inline-block; padding:6px 9px; color:#111111; background:#deded7; border:2px outset #ffffff; font:10px "Courier New",monospace; }.rating-strip b { margin-left:10px; color:#d5a800; font-size:16px; letter-spacing:1px; text-shadow:1px 1px #333333; }
.case-placeholder { position:relative; width:155px; height:175px; margin:auto; padding-left:15px; background:#bfc4cc; border:3px outset #f3f4f7; box-shadow:5px 5px 0 rgba(0,0,0,.25); }.case-spine { position:absolute; left:0; top:0; bottom:0; width:15px; padding:4px 2px; color:#ffffff; background:#070707; font:7px/1 "Courier New",monospace; writing-mode:vertical-rl; }.case-cover { height:100%; position:relative; overflow:hidden; padding:10px; color:#ffffff; background:linear-gradient(155deg,transparent 44%,#df302e 45% 47%,transparent 48%),repeating-linear-gradient(168deg,#0e1435 0 13px,#172c67 14px 19px,#0e1435 20px 31px); }.case-cover:after { content:""; position:absolute; right:-20px; bottom:18px; width:100px; height:23px; background:#dddddd; border:4px solid #191919; transform:skewX(-25deg) rotate(-15deg); }.case-cover span { display:block; font:bold 8px Arial,sans-serif; }.case-cover strong { display:block; margin-top:24px; font:italic 22px/.78 Impact,"Arial Black",sans-serif; letter-spacing:-1px; transform:skewY(-5deg); }.case-cover em { position:absolute; left:8px; bottom:7px; z-index:1; font:normal 7px "Courier New",monospace; }.case-placeholder.muted .case-cover { filter:grayscale(1); opacity:.72; }
.spec-table { margin:14px 0; border:2px solid #071b64; box-shadow:2px 2px 0 #b1b1aa; }.spec-table h3,.article-box h3,.contents-box h3 { margin:0; padding:6px 8px; color:#ffffff; background:#071b64; font:bold 11px "Courier New",monospace; letter-spacing:.3px; }.spec-table table { width:100%; border-collapse:collapse; }.spec-table th { width:10%; padding:8px 7px; color:#13327d; background:#d8deed; border:1px solid #aaaaaa; font:bold 8px "Courier New",monospace; text-align:left; }.spec-table td { width:23%; padding:8px 7px; background:#ffffff; border:1px solid #aaaaaa; font:10px "Courier New",monospace; }
.game-columns { display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:14px; }.article-box,.contents-box { margin-bottom:14px; background:#ffffff; border:2px groove #ffffff; box-shadow:2px 2px 0 rgba(73,73,68,.18); }.article-box p,.article-box ul,.contents-box p { margin:12px 14px; line-height:1.55; }.article-box li { margin-bottom:7px; }.contents-box a { display:block; padding:9px 10px; border-bottom:1px dotted #aaaaaa; font-size:13px; }
.photo-slots { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:14px; }.photo-slots div { height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#d6dcf0; background:repeating-linear-gradient(45deg,#202e55 0 8px,#26365f 8px 16px); border:3px inset #c5c5c5; }.photo-slots span { font:9px "Courier New",monospace; }.photo-slots b { margin:5px 0; color:#ffffff; }.photo-slots small { color:#9ca7c6; }.editor-note { margin:0 14px 14px!important; padding:9px; background:#fff7c6; border:1px dashed #9d8600; }
.verdict-box { margin-bottom:14px; padding:15px 17px; color:#ffffff; background:#081742; border:4px double #b7c5ea; box-shadow:3px 3px 0 #aaa; }.verdict-box h3 { margin:3px 0 7px; color:#ffffff; font:bold 18px "Times New Roman",serif; }.verdict-box p:last-child { margin:0; line-height:1.55; }.game-nav { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; padding:9px; background:#c8c8c0; border:2px outset #eeeeee; font:bold 9px/1.4 "Courier New",monospace; text-align:center; }.game-nav span:first-child { text-align:left; }.game-nav span:last-child { text-align:right; }

/* RetroAchievements log */
.achievement-title { background:#202a3d; }.ra-profile { margin-bottom:14px; padding:10px 12px; color:#e8edf8; background:#20242b; border:3px inset #72757b; font:10px/1.5 "Courier New",monospace; }.ra-profile b { color:#f0d631; }.run-grid { display:table; width:100%; table-layout:fixed; border-collapse:separate; border-spacing:1px; background:#777777; }.run-card { display:table-cell; width:50%; padding:14px; background:#ffffff; vertical-align:top; }.run-top { margin:-14px -14px 12px; padding:6px 8px; color:#ffffff; background:#333d53; font:9px "Courier New",monospace; }.run-top b { float:right; color:#79ef8e; }.run-card p { line-height:1.45; }.run-facts,.log { width:100%; border-collapse:collapse; }.run-facts th,.run-facts td,.log th,.log td { padding:7px; border:1px solid #aab0bc; text-align:left; }.run-facts th { width:105px; color:#173578; background:#d8deed; font:8px "Courier New",monospace; }.log { margin-top:14px; background:#ffffff; }.log th { color:#ffffff; background:#263d78; font:10px "Courier New",monospace; }.log td:first-child { width:125px; color:#173578; background:#d8deed; font:bold 9px "Courier New",monospace; }
.footer { padding:16px; color:#dfe6ff; background:#11182a; border-top:5px solid #8f8f89; font:9px "Courier New",monospace; text-align:center; }.footer a { color:#f6df29; }.badge { display:inline-block; width:84px; height:27px; margin:3px; padding-top:4px; color:#ffffff; background:#263d78; border:2px outset #9bb2ee; font:8px Arial,sans-serif; }.badge b { color:#efd84a; }
@media (max-width:760px) { body{padding:0}.browser-note{display:none}.site{max-width:100%;width:100%;border-left:0;border-right:0;box-shadow:none}.head{min-height:112px;padding:15px 13px 12px}.head h1{font-size:29px}.head h1 span{font-size:27px}.layout,.layout tbody,.layout tr,.layout td{display:block;width:auto}.main{padding:12px}.side{border-right:0;border-top:3px groove #ffffff}.photo{display:block;width:auto}.nav{display:block}.nav tbody,.nav tr{display:grid;grid-template-columns:1fr 1fr}.nav td{display:block;width:auto;font-size:9px}.nav td:last-child{grid-column:1/-1}.nav a{min-height:44px;padding:7px 5px}.nav a small{display:none}.feature-inner{padding:18px}.run-grid,.run-card{display:block;width:100%}.run-card+ .run-card{border-top:2px solid #777777}.run-top b{float:none;display:block;margin-top:3px}.log td:first-child{width:90px} }
@media (max-width:760px) { .game-hero{grid-template-columns:140px 1fr;gap:12px;padding:12px}.game-hero h2{font-size:32px}.case-placeholder{width:125px;height:150px}.spec-table table,.spec-table tbody{display:block}.spec-table tr{display:grid;grid-template-columns:88px 1fr}.spec-table th,.spec-table td{display:block;width:auto;padding:7px}.game-columns{grid-template-columns:1fr}.contents-box{display:none}.photo-slots{grid-template-columns:1fr}.game-nav{grid-template-columns:1fr}.game-nav span{text-align:center!important} }
@media (max-width:430px) { .game-hero{grid-template-columns:1fr;text-align:center}.game-tagline br{display:none}.rating-strip{display:block}.photo-slots div{height:130px} }
