:root{color-scheme:dark;--ink:#080b1b;--night:#11162d;--panel:#171d38;--line:#3c466b;--cream:#fff8e7;--gold:#ffc857;--mint:#76e6c0;--violet:#8b5cf6;font-family:ui-monospace,"Cascadia Mono","Noto Sans Mono CJK JP",monospace;background:var(--ink);color:var(--cream)}
*{box-sizing:border-box}html{background:var(--ink)}body{position:relative;min-width:300px;min-height:100vh;margin:0;overflow-x:hidden;background:var(--night)}a{color:inherit}
.sky{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,#43337726,transparent 36%),linear-gradient(90deg,transparent 49.7%,#ffffff05 50%,transparent 50.3%);background-size:auto,16px 16px}.sky i{position:absolute;width:3px;height:3px;background:#5d688e;box-shadow:5px 0 #5d688e,0 5px #5d688e}.sky i:nth-child(1){top:8%;left:8%}.sky i:nth-child(2){top:13%;right:10%}.sky i:nth-child(3){top:29%;left:17%}.sky i:nth-child(4){top:44%;right:16%}.sky i:nth-child(5){top:67%;left:7%}.sky i:nth-child(6){top:82%;right:8%}
.topbar,main,footer{position:relative;width:min(calc(100% - 36px),520px);margin-inline:auto}.topbar{display:flex;align-items:center;justify-content:space-between;min-height:64px;padding-top:max(8px,env(safe-area-inset-top))}.brand{display:inline-flex;gap:11px;align-items:center;color:var(--cream);text-decoration:none;font-size:14px;font-weight:900;letter-spacing:3px}.brand b{display:grid;width:30px;height:30px;place-items:center;border:3px solid var(--ink);background:var(--gold);box-shadow:3px 3px 0 var(--ink);color:#33245f;font-family:sans-serif;font-size:20px;line-height:1}.status{padding:5px 8px;border:2px solid #566188;background:#20294a;color:#cad2ef;font-size:8px;font-weight:900;letter-spacing:1px}.status i{display:inline-block;width:6px;height:6px;margin-right:5px;background:var(--mint)}
.hero{padding:54px 0 34px}.eyebrow{margin:0 0 12px;color:#7e8ab0;font-size:9px;font-weight:900;letter-spacing:2px}h1{margin:0;font-family:"Yu Gothic",sans-serif;font-size:clamp(42px,13vw,62px);font-weight:900;letter-spacing:2px;line-height:.98;text-shadow:4px 4px #513b91,7px 7px var(--ink)}.tagline{margin:23px 0 0;color:var(--gold);font-size:clamp(15px,4.5vw,19px);font-weight:900;letter-spacing:.5px}.intro{margin:12px 0 0;color:#d1d8ef;font-family:"Yu Gothic",sans-serif;font-size:12px;font-weight:600;line-height:1.9}
.section-title{display:flex;align-items:center;gap:9px;margin-bottom:14px}.section-title i{width:13px;height:13px;background:var(--mint)}.section-title.violet i{background:var(--violet)}.section-title h2{flex:none;margin:0;font-family:"Yu Gothic",sans-serif;font-size:13px;font-weight:900;letter-spacing:1px}.section-title span{width:100%;height:2px;background:var(--line)}
.game-card{overflow:hidden;border:3px solid var(--ink);background:var(--ink);box-shadow:7px 7px 0 #060812}.pixel-scene{position:relative;height:clamp(185px,53vw,270px);overflow:hidden;background:#403478}.pixel-scene>.moon{position:absolute;top:12%;right:17%;width:46px;height:46px;background:#ffe69a;box-shadow:-7px 10px #ffe69a,7px 10px #ffe69a}.mountain{position:absolute;bottom:25%;width:0;height:0;border-style:solid;border-color:transparent transparent #29275b}.mountain.a{left:-8%;border-width:0 105px 105px}.mountain.b{right:-14%;border-width:0 145px 130px}.ground{position:absolute;inset:70% 0 0;background:#17253b}.grass{position:absolute;bottom:29%;width:70px;height:5px;background:var(--mint)}.grass.a{left:7%;box-shadow:24px -5px var(--mint)}.grass.b{right:3%;box-shadow:-28px 4px var(--mint)}
.monster{position:absolute;left:27%;bottom:25%;width:70px;height:82px}.monster i{position:absolute;display:block;background:var(--ink)}.monster .body{left:13px;top:16px;width:44px;height:48px}.monster .ear{top:1px;width:14px;height:28px}.monster .ear.l{left:7px;transform:skew(8deg)}.monster .ear.r{right:6px;transform:skew(-8deg)}.monster .tail{right:-9px;top:45px;width:28px;height:12px}.monster .foot{top:60px;width:14px;height:20px}.monster .foot.l{left:13px}.monster .foot.r{right:13px}.monster .eye{top:31px;left:43px;width:7px;height:7px;background:var(--gold)}.pixel-scene>span{position:absolute;right:14px;bottom:12px;font-size:9px;font-weight:900;letter-spacing:1px}
.game-copy{padding:17px}.meta{display:flex;align-items:center;justify-content:space-between;color:#697597;font-size:9px;font-weight:900;letter-spacing:1.4px}.meta em{padding:5px 8px;background:var(--mint);color:#10271f;font-style:normal}.game-copy h3{margin:14px 0 9px;font-family:"Yu Gothic",sans-serif;font-size:clamp(23px,7vw,30px);line-height:1.2;letter-spacing:.5px}.game-copy>p{margin:0;color:#b7c0dc;font-family:"Yu Gothic",sans-serif;font-size:11px;line-height:1.7}.play{display:flex;min-height:54px;margin-top:18px;align-items:center;justify-content:center;gap:6px;border:3px solid var(--ink);background:var(--gold);box-shadow:4px 4px #01030b;color:#211600;font-family:"Yu Gothic",sans-serif;font-size:14px;font-weight:900;letter-spacing:.6px;text-decoration:none;transition:transform .1s,box-shadow .1s}.play:hover,.play:focus-visible{transform:translate(-1px,-1px);box-shadow:5px 5px #01030b}.play:active{transform:translate(3px,3px);box-shadow:1px 1px #01030b}.play:focus-visible{outline:3px solid var(--cream);outline-offset:4px}.game-copy>small{display:block;margin-top:12px;color:#737f9f;font-size:9px;text-align:center}
.next{padding-top:38px}.coming-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.coming{display:grid;min-height:154px;padding:14px;border:2px solid var(--line);background:var(--panel);box-shadow:4px 4px var(--ink);grid-template-columns:1fr auto;align-content:space-between;color:#bcc5e1}.coming>span{color:#7782a5;font-size:8px;font-weight:900;letter-spacing:1px}.coming>b{font-size:24px;line-height:.8}.coming>strong{align-self:end;font-size:13px}.coming>em{justify-self:start;padding:4px 6px;background:#252d50;font-size:7px;font-style:normal;font-weight:900;letter-spacing:.8px}.coming.mint>b,.coming.mint>em{color:var(--mint)}.coming.yellow>b,.coming.yellow>em{color:var(--gold)}
footer{display:flex;min-height:170px;padding:42px 0 max(28px,env(safe-area-inset-bottom));align-items:center;flex-direction:column;gap:17px;color:#8f9abe;font-family:"Yu Gothic",sans-serif;font-size:11px;font-weight:700;letter-spacing:1px;text-align:center}footer small{color:#555f7d;font-family:ui-monospace,monospace;font-size:8px;letter-spacing:1.4px}
@media(max-width:350px){.topbar,main,footer{width:min(calc(100% - 24px),520px)}.coming-grid{gap:8px}.coming{padding:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
