:root{color-scheme:dark;--bg:#101113;--panel:#191b1e;--line:#303135;--text:#f0f0ed;--muted:#929498;--lime:#c4f76b;--purple:#b8a0f9;--pink:#f49fc5;--accent:var(--lime);font-family:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}body::before{content:"";position:absolute;top:0;left:0;width:100%;height:750px;background:radial-gradient(ellipse at 75% 25%,#a098db09,transparent 58%);pointer-events:none}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:2px solid var(--lime);outline-offset:5px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}.site-shell{width:min(1280px,calc(100% - 112px));margin:auto}.site-header{height:108px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:60px}.brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:900;letter-spacing:-.7px}.brand-icon{display:inline-flex;align-items:center;font-size:31px;color:var(--lime);font-weight:900;letter-spacing:-8px;margin-right:8px;transform:skew(-9deg)}.brand-icon span{transform:translateY(-4px)}.brand-dot{font-size:11px;align-self:flex-start;margin:6px 0 0 -8px;color:var(--muted)}nav{display:flex;gap:32px;font-size:13px}nav a{display:flex;gap:10px}nav span{font-size:10px;color:#74767b}.header-status{margin-left:auto;display:flex;gap:9px;align-items:center;font-family:monospace;font-size:10px;letter-spacing:1px;color:#afb0b3}.header-status i,.hero-notes i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px #c4f76b55}.hero{display:grid;grid-template-columns:1.2fr 1fr;min-height:562px;align-items:center;gap:25px;padding:38px 0 40px}.eyebrow{font-family:monospace;font-size:10px;font-weight:500;letter-spacing:1.5px;color:var(--muted);margin:0 0 22px}.hero .eyebrow{display:flex;align-items:center;gap:10px}.tiny-star{font-size:23px;color:var(--lime)}h1{font-size:clamp(40px,4.15vw,64px);line-height:1.08;letter-spacing:-3.4px;margin:0 0 24px;font-weight:750}h1 span{color:var(--lime)}.hero-description{font-size:15px;color:#a5a6aa;line-height:1.8;margin:0 0 29px}.primary-link{display:inline-flex;background:var(--lime);color:#14180e;padding:17px 21px;align-items:center;gap:40px;border-radius:6px;font-size:14px;font-weight:bold;transition:box-shadow .2s,transform .2s}.primary-link:hover{box-shadow:0 0 28px #c4f76225;transform:translateY(-2px)}.primary-link span{font-size:22px;line-height:15px}.hero-notes{display:flex;gap:18px;margin-top:25px;font-size:10px;color:#7c7e83}.hero-notes span{display:flex;gap:6px;align-items:center}.hero-notes span+span::before{content:"/";margin-right:7px;color:#484a4e}.hero-notes i{width:4px;height:4px}.hero-art{height:440px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}.art-orbit{position:absolute;width:380px;height:380px;border:1px solid #bba0f51a;border-radius:50%;transform:rotate(-25deg) scaleY(.7);z-index:-1}.orbit-two{transform:rotate(55deg) scaleY(.7);width:440px;height:440px}.art-label{font-family:monospace;font-size:8px;letter-spacing:1.7px;color:#777682;position:absolute}.label-top{top:20px;left:65px}.label-bottom{bottom:13px;right:12px}.art-cross{position:absolute;color:#b6a5de;font-family:monospace;font-weight:100;font-size:25px}.cross-one{top:60px;right:40px}.cross-two{bottom:38px;left:22px;color:var(--lime)}.arcade-machine{width:262px;transform:rotate(-9deg);filter:drop-shadow(15px 28px 30px #0009);position:relative}.arcade-machine::after{content:"";position:absolute;top:6px;bottom:0;right:-18px;width:19px;background:#35313f;clip-path:polygon(0 0,100% 4%,100% 100%,0 96%);z-index:-1}.machine-top{height:49px;border:2px solid #9984ba;background:linear-gradient(120deg,#514362,#2c2838);border-radius:13px 10px 0 0;padding:14px 14px;display:flex;justify-content:space-between;align-items:center}.machine-top span{font-family:monospace;font-size:17px;font-weight:900;letter-spacing:2px;color:#ece0fa;text-shadow:0 0 10px #c9a5ff66}.machine-top i{font-size:7px;letter-spacing:1px;color:var(--lime);font-style:normal}.machine-screen{height:214px;border:12px solid #302c39;border-top-width:11px;border-bottom-width:18px;outline:1px solid #6b5c7f;background:#101b19;position:relative;overflow:hidden;box-shadow:inset 0 0 35px #87ec5220}.screen-grid{position:absolute;inset:0;background-image:linear-gradient(#b7ec8610 1px,transparent 1px),linear-gradient(90deg,#b7ec8610 1px,transparent 1px);background-size:18px 18px}.screen-caption{position:absolute;top:22px;width:100%;text-align:center;font-family:monospace;font-weight:bold;font-size:19px;color:var(--lime);letter-spacing:3px;text-shadow:0 0 15px #c4f76b55}.pixel-snake{position:absolute;top:89px;left:47px;display:flex;gap:3px}.pixel-snake i{width:17px;height:17px;background:var(--lime);box-shadow:0 0 10px #c4f76b22;border-radius:3px}.pixel-snake i:nth-child(1){transform:translate(20px,20px);opacity:.35}.pixel-snake i:nth-child(2){transform:translate(0,0);opacity:.5}.pixel-snake i:nth-child(3){transform:translate(0,-20px);opacity:.65}.pixel-snake i:nth-child(4){transform:translate(0,-20px);opacity:.8}.pixel-snake i:nth-child(5){transform:translate(0,-20px)}.pixel-snake i:nth-child(6){transform:translate(-20px,-40px)}.pixel-snake i:nth-child(7){transform:translate(-40px,-60px);position:relative}.pixel-snake i:nth-child(7)::after{content:"";position:absolute;width:3px;height:3px;background:#1e3020;right:3px;top:4px}.pixel-food{position:absolute;bottom:38px;right:37px;font-size:25px;color:var(--pink);text-shadow:0 0 13px #f49fc566}.screen-score{position:absolute;bottom:8px;left:11px;right:11px;font-family:monospace;font-size:7px;color:#b5ca95;letter-spacing:1px}.screen-score b{float:right}.machine-deck{height:74px;background:linear-gradient(#595068,#3a3349);border:1px solid #9e87b6;transform:perspective(250px) rotateX(18deg);transform-origin:top;position:relative}.joystick{position:absolute;left:42px;top:21px;width:32px;height:17px;background:#211e29;border-radius:50%;box-shadow:0 0 0 3px #746784}.joystick::before{content:"";position:absolute;height:28px;width:6px;background:#c2b2d5;bottom:9px;left:13px;transform:rotate(-10deg)}.joystick::after{content:"";position:absolute;width:22px;height:22px;border-radius:50%;background:radial-gradient(at 35% 30%,#ddb5fa,#9c77c3 65%);bottom:28px;left:3px}.arcade-button{position:absolute;top:22px;width:24px;height:18px;border-radius:50%;box-shadow:0 4px #191c23,0 0 0 4px #292631}.button-pink{right:72px;background:var(--pink)}.button-green{right:35px;top:16px;background:var(--lime)}.machine-deck>span{position:absolute;bottom:9px;left:102px;font-size:6px;font-family:monospace;color:#b7a8c8;letter-spacing:2px}.machine-bottom{height:38px;margin-top:-4px;background:#302a3b;border:1px solid #6b5c7f;border-radius:0 0 9px 9px;display:flex;align-items:center;justify-content:space-around}.machine-bottom span{font-family:monospace;font-size:6px;letter-spacing:1.8px;color:#9b8aaa}.machine-bottom i{width:20px;height:3px;border-radius:3px;background:#18151f}.art-sticker{position:absolute;right:15px;bottom:66px;width:94px;height:94px;border-radius:50%;background:var(--lime);color:#1a2112;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:24px;font-weight:900;line-height:1.2;transform:rotate(13deg);box-shadow:0 0 45px #c4f76b13}.art-sticker span{font-family:monospace;font-size:7px;letter-spacing:.7px}.games-section{padding:23px 0 60px;scroll-margin-top:25px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px}.section-heading .eyebrow{font-size:9px;margin-bottom:14px}h2{font-size:32px;letter-spacing:-1px;margin:0;line-height:1.2}.section-heading h2 span{color:var(--lime)}.section-counter{font-size:9px;font-family:monospace;letter-spacing:1px;color:#7e8085;padding-bottom:4px}.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.game-card{--accent:var(--lime);min-width:0}.breakout-card{--accent:var(--purple)}.pong-card{--accent:var(--pink)}.game-preview{width:100%;aspect-ratio:1.62;background:#171d19;border:1px solid #343f31;border-radius:10px;padding:0;overflow:hidden;position:relative;display:block;transition:transform .2s,border-color .2s,box-shadow .2s}.breakout-card .game-preview{background:#1c1925;border-color:#3d354c}.pong-card .game-preview{background:#241a21;border-color:#47333e}.game-preview:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 8px 30px #0004}.game-preview canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.preview-tag{position:absolute;left:15px;top:15px;z-index:1;font-family:monospace;font-size:8px;letter-spacing:.9px;color:var(--accent);background:#11151399;border:1px solid #ffffff14;border-radius:4px;padding:6px 8px}.preview-play{position:absolute;right:14px;bottom:14px;border:1px solid #ffffff20;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:var(--accent)}.card-meta{display:flex;justify-content:space-between;align-items:center;margin:21px 0 12px;font-family:monospace;font-size:8px;letter-spacing:1px;color:#85878c}.difficulty{display:flex;gap:3px;align-items:center;font-size:7px}.difficulty i{width:3px;height:7px;background:var(--accent)}.difficulty i:nth-child(2){height:10px}.difficulty i:nth-child(3){height:13px;margin-right:5px}.difficulty i.off{background:#383a3e}h3{font-size:24px;letter-spacing:-.7px;margin:0}.game-card h3{display:flex;justify-content:space-between}.game-card h3 span{font-size:20px;color:#62656b}.game-card>p{font-size:12px;color:#8d8f94;margin:10px 0 23px;line-height:1.6}.card-footer{border-top:1px solid var(--line);padding-top:16px;display:flex;align-items:center;justify-content:space-between}.card-footer>span{font-family:monospace;font-size:10px;color:#808287}.card-footer b{color:#c7c8ca;font-weight:normal;margin-left:8px}.text-button{padding:0;border:0;background:transparent;font-size:12px;color:var(--accent);display:flex;gap:24px;align-items:center}.text-button:hover{filter:brightness(1.2)}.text-button span{font-size:20px}.about-strip{border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;gap:28px;padding:31px 32px;background:linear-gradient(110deg,#1b1d1c,#17181b);margin-bottom:47px}.about-star{font-size:58px;line-height:1;color:var(--lime)}.about-strip h2{font-size:18px;letter-spacing:-.3px}.about-strip p{font-size:11px;line-height:1.8;color:#95979b;margin:9px 0 0}.about-sign{margin-left:auto;font-family:monospace;font-size:11px;line-height:1.6;letter-spacing:1px;color:#73767a;transform:rotate(-5deg);white-space:nowrap}.about-sign b{font-weight:normal;color:var(--lime)}footer{border-top:1px solid var(--line);padding:25px 0 30px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#77797e}.footer-logo{color:#b2b3b5;font-size:12px;font-weight:bold;letter-spacing:-.3px}footer>a:last-child{color:#aaa}
dialog{border:1px solid #424348;border-radius:16px;background:#17191c;color:var(--text);padding:0;width:min(790px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#060809d9;backdrop-filter:blur(9px)}body.game-open{overflow:hidden}.game-window{padding:24px}.game-header{display:flex;justify-content:space-between;align-items:center}.game-header .eyebrow{margin-bottom:6px;font-size:9px}.game-header h2{font-size:27px}.icon-button{width:38px;height:38px;border:1px solid #43464b;border-radius:50%;background:transparent;font-size:17px}.icon-button:hover{background:#303239}.scoreboard{display:flex;align-items:center;justify-content:space-between;padding:18px 0 14px;font-size:10px;color:#93979e;font-family:monospace;gap:8px}.scoreboard b{font-size:18px;color:var(--accent);margin-left:7px}.scoreboard #game-detail{color:#d4d5d7;font-size:12px}.canvas-wrap{position:relative;border:1px solid #373d3a;border-radius:8px;overflow:hidden;background:#111715}#game-canvas{display:block;width:100%;height:auto;aspect-ratio:3/2}.game-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#0b1012d9;text-align:center;pointer-events:none;padding:15px}.overlay-symbol{color:var(--accent);font-size:40px;line-height:1;margin-bottom:14px}.game-overlay h3{font-size:28px}.game-overlay p{color:#b2b5ba;font-size:13px;margin:12px 0 0;max-width:90%;line-height:1.5}.game-actions{display:flex;gap:10px;align-items:center;margin-top:16px}.solid-button,.secondary-button{border-radius:5px;padding:12px 17px;border:1px solid transparent;font-size:13px;display:flex;align-items:center;justify-content:center;gap:17px;min-height:44px}.solid-button{background:var(--accent);color:#181b16;font-weight:bold}.secondary-button{background:#24272b;border-color:#42454a}.key-hint{margin-left:auto;font-family:monospace;font-size:8px;letter-spacing:.5px;color:#878a8e}.game-rules{color:#a0a3a9;font-size:12px;line-height:1.7;margin:15px 0 0}.storage-note{font-size:11px;color:var(--pink);line-height:1.6}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.game-card>.card-controls{font-size:11px;color:var(--muted);margin:-10px 0 18px}.card-controls kbd{font:inherit;color:var(--accent);white-space:nowrap}
.hero{overflow:clip;overflow-clip-margin:8px}
.machine-screen .pixel-snake{top:109px}
dialog[data-game="breakout"]{--accent:var(--purple)}dialog[data-game="pong"]{--accent:var(--pink)}
@media(min-width:1600px){.hero{min-height:610px}}
@media(max-width:1100px){.site-shell{width:calc(100% - 64px)}.site-header{gap:35px}.header-status{font-size:8px}.hero{grid-template-columns:1.1fr 1fr;gap:0}h1{font-size:46px;letter-spacing:-2.6px}.hero-art{transform:scale(.88);margin:0 -20px}.hero .eyebrow{font-size:8px}.game-grid{gap:18px}.card-meta{letter-spacing:.5px}.difficulty{font-size:6px}.about-strip{gap:20px}.about-sign{font-size:9px}}
@media(max-width:760px){.site-shell{width:calc(100% - 40px)}.site-header{height:80px;gap:20px;justify-content:space-between}.brand{font-size:17px}.brand-icon{font-size:28px}.site-header nav{gap:19px;font-size:11px}.site-header nav span,.header-status{display:none}.hero{grid-template-columns:1fr;padding-top:44px;gap:0}.hero-copy{position:relative;z-index:1}h1{font-size:clamp(38px,7.8vw,58px);letter-spacing:-2.4px}.hero .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:19px}.hero-description{font-size:14px}.hero-art{height:340px;transform:scale(.85);margin:-4px -15px -20px}.label-top{top:0;left:calc(50% - 160px)}.label-bottom{bottom:-6px;right:calc(50% - 180px)}.art-sticker{right:calc(50% - 190px);bottom:40px}.cross-one{right:calc(50% - 190px);top:20px}.cross-two{left:calc(50% - 180px);bottom:20px}.art-orbit{width:360px;height:360px}.orbit-two{width:395px;height:395px}.games-section{padding-top:22px;padding-bottom:35px}.section-heading{margin-bottom:24px}.section-heading h2{font-size:29px}.section-heading .eyebrow{font-size:7px;letter-spacing:1px}.section-counter{display:none}.game-grid{grid-template-columns:1fr;gap:32px}.game-preview{aspect-ratio:1.8}.preview-tag{font-size:9px}.card-meta{margin-top:16px;font-size:9px}.difficulty{font-size:8px}.game-card h3{font-size:25px}.game-card>p{font-size:13px;margin-bottom:16px}.card-footer{padding-top:12px}.card-footer>span{font-size:11px}.text-button{font-size:14px;min-height:32px}.about-strip{padding:24px 19px;gap:15px;margin-bottom:30px;align-items:flex-start}.about-star{font-size:37px}.about-strip h2{font-size:16px;line-height:1.4}.about-strip p{font-size:11px}.about-sign{display:none}footer{font-size:9px;gap:18px;flex-wrap:wrap}footer>a:last-child{margin-left:auto}.game-window{padding:16px}.key-hint{display:none}.game-overlay h3{font-size:24px}.game-overlay p{font-size:12px}.scoreboard{font-size:8px}.scoreboard b{font-size:16px;margin-left:3px}.scoreboard #game-detail{font-size:10px}.game-actions{margin-top:12px}.game-rules{font-size:11px}.solid-button,.secondary-button{flex:1;padding:11px 12px}.game-header h2{font-size:23px}}
@media(max-width:380px){.site-shell{width:calc(100% - 28px)}.brand{font-size:15px}.site-header nav{gap:12px;font-size:10px}.hero-notes{gap:8px;font-size:9px}.hero-notes span+span::before{margin-right:0}.hero-art{transform:scale(.74);margin-left:-30px;margin-right:-30px;height:320px}.scoreboard #game-detail{font-size:9px}.game-window{padding:12px}}
@media(max-width:760px){.hero-art{margin-top:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}