:root {
  --ink:#171720; --paper:#f5f1e8; --cream:#fffaf0; --lime:#d8ff5f;
  --violet:#7456ff; --coral:#ff705d; --cyan:#47e6e0; --muted:#6f6c70;
  --border:rgba(23,23,32,.14);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.container{width:min(1180px,calc(100% - 48px));margin:auto}
.noise{position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.nav-wrap{position:sticky;top:0;z-index:50;background:rgba(245,241,232,.84);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
.nav{height:76px;display:flex;align-items:center;justify-content:space-between}
.logo{font:700 26px "Space Grotesk";letter-spacing:-2px}.logo span{color:var(--violet)}
.nav-links{display:flex;gap:34px;font-size:14px;font-weight:600}.nav-links a:hover{color:var(--violet)}
.nav-button{padding:11px 18px;border:1.5px solid var(--ink);border-radius:999px;font-weight:700;font-size:13px;transition:.2s}
.nav-button:hover{background:var(--ink);color:white;transform:translateY(-2px)}
.hero{min-height:calc(100vh - 76px);display:grid;grid-template-columns:1.08fr .92fr;align-items:center;padding-block:80px}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:2.2px;display:flex;align-items:center;gap:10px;margin:0 0 22px}
.eyebrow span{width:26px;height:3px;background:var(--violet);display:inline-block}.eyebrow.coral span{background:var(--coral)}
h1,h2,h3{font-family:"Space Grotesk",sans-serif;margin:0;letter-spacing:-.055em}
h1{font-size:clamp(58px,7vw,105px);line-height:.91}
h1 em{font-style:normal;color:var(--violet)}
.hero-text{font-size:18px;line-height:1.65;max-width:610px;color:var(--muted);margin:34px 0}
.hero-actions{display:flex;align-items:center;gap:28px}
.primary-btn{display:inline-flex;align-items:center;gap:18px;background:var(--ink);color:white;padding:16px 22px;border-radius:4px;font-weight:700;transition:.2s;box-shadow:6px 6px 0 var(--lime)}
.primary-btn:hover{transform:translate(-2px,-2px);box-shadow:9px 9px 0 var(--lime)}
.text-link{font-weight:700;border-bottom:1px solid currentColor;padding-bottom:4px}
.hero-art{height:520px;position:relative}
.orb{position:absolute;border-radius:50%;filter:blur(1px)}.orb-one{width:360px;height:360px;background:var(--lime);right:25px;top:60px}.orb-two{width:180px;height:180px;background:var(--cyan);left:25px;bottom:20px}
.code-card{position:absolute;top:105px;left:45px;width:420px;background:#1d1b2d;color:#f7f2ff;padding:25px 30px 35px;border-radius:12px;box-shadow:22px 26px 0 rgba(116,86,255,.9);transform:rotate(-3deg);font:500 16px/1.8 monospace}
.code-card b{color:#ff79c6}.code-card span{color:#8be9fd}.code-card em{color:#d8ff5f;font-style:normal}.code-top{display:flex;gap:7px;margin-bottom:18px}.code-top i{width:10px;height:10px;border-radius:50%;background:#ff705d}.code-top i:nth-child(2){background:#ffe05f}.code-top i:nth-child(3){background:#62e68b}
.floating-tag{position:absolute;padding:12px 18px;font:700 13px "Space Grotesk";letter-spacing:1px;border:2px solid var(--ink);background:var(--cream)}
.tag-kotlin{right:0;top:55px;transform:rotate(8deg);background:#ff9f8e}.tag-design{left:10px;bottom:45px;transform:rotate(-8deg);background:var(--cyan)}
.game-section{background:var(--ink);color:white;padding:110px 0}
.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:55px;gap:30px}
.section-heading h2{font-size:clamp(45px,6vw,78px)}.section-number{font:600 12px "Space Grotesk";letter-spacing:2px;color:#9d99a5}
.game-card{display:grid;grid-template-columns:1fr 1fr;background:#272633;border:1px solid rgba(255,255,255,.1);min-height:650px}
.game-visual{display:grid;place-items:center;overflow:hidden;position:relative;background:radial-gradient(circle at 50% 50%,#4329a5 0,#191729 62%);padding:45px}
.phone{width:270px;height:540px;background:#090911;border:7px solid #55536a;border-radius:40px;padding:14px;box-shadow:0 0 70px rgba(71,230,224,.22);transform:rotate(-4deg)}
.speaker{width:70px;height:7px;border-radius:10px;background:#55536a;margin:0 auto 10px}
.game-screen{height:475px;position:relative;overflow:hidden;background:linear-gradient(#16123d,#071c2d);border-radius:22px;color:var(--cyan);font-family:monospace}
.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(transparent 0 4px,rgba(255,255,255,.025) 5px);z-index:5;pointer-events:none}
.warning{text-align:center;padding:24px 0;color:#ff5364;font-weight:800;animation:blink 1s infinite}@keyframes blink{50%{opacity:.35}}
.battery-character{position:absolute;left:96px;top:190px;filter:drop-shadow(0 0 12px #d8ff5f)}.battery-head{width:22px;height:10px;background:var(--lime);margin:auto}.battery-body{width:62px;height:82px;border:5px solid var(--lime);display:grid;place-items:center;font-weight:900;font-size:20px}.battery-legs{width:50px;height:22px;border-left:5px solid var(--lime);border-right:5px solid var(--lime);margin:auto}
.enemy{position:absolute;border:2px solid #ff5364;color:#ff5364;padding:9px;font-size:10px;font-weight:900;box-shadow:0 0 10px #ff5364}.enemy-a{left:20px;top:300px}.enemy-b{right:25px;top:145px;border-radius:50%;padding:13px;background:#65122d}
.particle{position:absolute;color:var(--lime);font-size:25px}.p1{left:50px;top:130px}.p2{right:40px;bottom:100px}.p3{left:70px;bottom:50px}.hud{position:absolute;bottom:18px;left:18px;font-size:11px}
.game-info{padding:70px 65px;display:flex;flex-direction:column;justify-content:center}.label{font-size:11px;letter-spacing:2px;color:var(--cyan);font-weight:700}
.game-info h3{font-size:clamp(38px,4vw,60px);line-height:1.02;margin:12px 0 25px}.game-info>p:not(.label){color:#bbb8c2;line-height:1.75;font-size:16px}
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0 32px}.chips span{border:1px solid #55515f;border-radius:999px;padding:8px 13px;font-size:12px;color:#ddd9e4}
.game-actions{margin-bottom:45px}.mini-features{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #44414d;padding-top:25px}.mini-features div{display:flex;gap:12px;align-items:center}.mini-features strong{font-size:25px;color:var(--lime)}.mini-features span{font-size:11px;color:#aaa7b0;line-height:1.4}
.design-section{padding:120px 0}.design-intro{max-width:390px;color:var(--muted);line-height:1.6;margin:0}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.design-card{margin:0;background:white;border:1px solid var(--border);padding:14px;transition:.25s;overflow:hidden}.design-card:hover{transform:translateY(-7px);box-shadow:10px 12px 0 var(--ink)}
.design-card img{width:100%;aspect-ratio:1/1;object-fit:cover}.design-card.wide img{aspect-ratio:16/9}
.design-card figcaption{display:flex;justify-content:space-between;align-items:center;padding:18px 4px 5px}.design-card figcaption span{font:700 17px "Space Grotesk"}.design-card small{color:var(--muted)}
.about-section{background:var(--violet);color:white;padding:110px 0}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.about-grid h2{font-size:clamp(48px,5vw,75px);line-height:1}.about-grid .eyebrow span{background:var(--lime)}
.about-copy{font-size:18px;line-height:1.75;color:#e4defe}.about-copy p:first-child{margin-top:0}.about-copy strong{color:white}.light{display:inline-block;color:white;margin-top:20px}
footer{background:#111117;color:#aaa7b0;padding:35px 0;font-size:13px}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-inner strong,.footer-inner a{color:white}
@media(max-width:850px){
 .container{width:min(100% - 32px,1180px)}.nav-links{display:none}.hero{grid-template-columns:1fr;padding-block:70px}.hero-art{height:430px;margin-top:20px}.code-card{left:6%;width:82%;font-size:13px}.orb-one{width:280px;height:280px}.game-card{grid-template-columns:1fr}.game-info{padding:50px 30px}.section-heading{align-items:start;flex-direction:column}.gallery{grid-template-columns:1fr}.about-grid{grid-template-columns:1fr;gap:45px}.footer-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:480px){h1{font-size:52px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-art{height:380px}.code-card{top:80px;padding:20px;width:88%;left:1%}.tag-kotlin{right:5px}.game-visual{padding:35px 10px}.phone{transform:scale(.88) rotate(-4deg)}.mini-features{gap:10px}.mini-features div{display:block}.design-card figcaption{align-items:flex-start;gap:8px;flex-direction:column}}