@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@500;700;800&display=swap');
:root{--cream:#fff8df;--ink:#17180f;--yellow:#f7ef25;--peach:#ff9d7b;--mint:#b9dbc0;--lav:#c7b0dc;--line:2px solid var(--ink)}
*{box-sizing:border-box}html{background:var(--cream);scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Manrope,Arial,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.page{position:relative;width:100%;height:100vh;min-height:680px;overflow:hidden;isolation:isolate}.world-bg{position:absolute;inset:0;background:url('assets/glimpo-world.webp') center/cover no-repeat;filter:saturate(.92) contrast(1.03);z-index:-4}.world-bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,248,223,.26),transparent 52%,rgba(255,248,223,.06))}.grain{position:absolute;inset:0;pointer-events:none;z-index:20;opacity:.18;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='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");mix-blend-mode:multiply}.cursor-glow{position:fixed;left:var(--x,-200px);top:var(--y,-200px);width:280px;height:280px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,.38),transparent 66%);pointer-events:none;z-index:100;mix-blend-mode:soft-light}
.topbar{position:absolute;top:0;left:0;right:0;height:112px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(28px,4.2vw,82px);z-index:30}.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:23px;letter-spacing:-.05em}.brand img{width:43px;height:43px;object-fit:contain;filter:drop-shadow(0 3px 0 rgba(0,0,0,.15));transition:.3s}.brand:hover img{transform:rotate(-8deg) scale(1.08)}.nav-links{display:flex;gap:10px}.nav-pill{display:grid;place-items:center;min-height:44px;padding:0 20px;border:var(--line);border-radius:999px;background:rgba(255,248,223,.74);backdrop-filter:blur(10px);font:500 12px DM Mono,monospace;letter-spacing:.04em;box-shadow:3px 3px 0 var(--ink);transition:.18s}.nav-pill:hover{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink);background:#fff}
.hero-content{height:100%;display:grid;grid-template-columns:minmax(430px,.85fr) minmax(390px,.72fr);align-items:center;gap:3vw;padding:105px 16vw 70px 8vw}.copy-card{position:relative;z-index:3;max-width:720px}.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 19px;font:500 12px DM Mono,monospace;letter-spacing:.13em}.eyebrow span{width:27px;height:2px;background:var(--ink)}h1{font-size:clamp(72px,7.5vw,148px);letter-spacing:-.085em;line-height:.76;margin:0;font-weight:800}h1 em{position:relative;font-style:normal;color:var(--yellow);-webkit-text-stroke:3px var(--ink);text-shadow:6px 7px 0 var(--ink)}.lede{max-width:575px;margin:36px 0 0;font-size:clamp(17px,1.25vw,24px);line-height:1.5;font-weight:600;letter-spacing:-.025em}.actions{display:flex;align-items:center;gap:14px;margin-top:34px;flex-wrap:wrap}.primary-btn,.ca-btn{border:var(--line);box-shadow:5px 5px 0 var(--ink);border-radius:14px;cursor:pointer;transition:.18s}.primary-btn{display:flex;align-items:center;gap:32px;padding:17px 22px;background:var(--ink);color:#fff;font:700 13px DM Mono,monospace;letter-spacing:.03em;box-shadow:5px 5px 0 var(--peach)}.primary-btn b{font-size:21px}.primary-btn:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--peach);background:#292b18}.ca-btn{height:59px;display:flex;align-items:center;gap:7px;padding:0 16px;background:rgba(255,255,255,.68);font:500 12px DM Mono,monospace}.ca-btn strong{font-size:13px}.ca-btn small{margin-left:9px;padding:5px 7px;border-radius:7px;background:var(--yellow);font:500 9px DM Mono}.ca-btn:hover{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.ca-btn.copied small{background:var(--mint)}
.glimpo-stage{--rx:0deg;--ry:0deg;position:relative;z-index:2;display:grid;place-items:center;height:min(70vh,720px);perspective:900px}.hero-glimpo{position:relative;width:min(28vw,480px);max-height:64vh;object-fit:contain;z-index:2;transform:rotateX(var(--rx)) rotateY(var(--ry));filter:drop-shadow(0 18px 1px rgba(86,69,22,.12));animation:glimpoFloat 4.2s ease-in-out infinite;transition:transform .14s}.halo{position:absolute;width:min(34vw,600px);aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.28);border:2px dashed rgba(23,24,15,.28);animation:spin 26s linear infinite}.halo:after,.halo:before{content:"✦";position:absolute;font-size:32px}.halo:before{top:7%;left:13%;color:var(--peach)}.halo:after{right:4%;bottom:24%;color:var(--lav)}.ground-shadow{position:absolute;bottom:7%;width:58%;height:7%;border-radius:50%;background:rgba(71,55,21,.18);filter:blur(9px);animation:shadowPulse 4.2s ease-in-out infinite}.speech{position:absolute;top:20%;right:-2%;z-index:4;padding:11px 16px;border:var(--line);border-radius:14px 14px 14px 2px;background:#fff;font:500 12px DM Mono;transform:rotate(5deg);animation:speechPop 6s ease-in-out infinite}.lore-card{position:absolute;right:3.8vw;bottom:5vh;width:min(340px,22vw);padding:22px 24px;border:var(--line);border-radius:24px 24px 5px 24px;background:rgba(255,250,234,.82);backdrop-filter:blur(14px);box-shadow:7px 7px 0 rgba(23,24,15,.9);z-index:9;transform:rotate(1.5deg)}.lore-card h2{margin:11px 0 10px;font-size:22px;letter-spacing:-.04em}.lore-card p{margin:7px 0;font-size:12px;line-height:1.55}.card-index{font:500 10px DM Mono;color:#696957}.scroll-note{position:absolute;left:4.2vw;bottom:4.5vh;display:flex;align-items:center;gap:13px;font:500 10px DM Mono;letter-spacing:.08em}.scroll-note i{display:block;width:80px;height:1px;background:var(--ink)}
.orb{position:absolute;border:var(--line);border-radius:50%;background:rgba(255,255,255,.34);box-shadow:inset 8px 8px 14px #fff8;animation:drift 7s ease-in-out infinite}.orb-a{width:57px;height:57px;left:5%;top:25%}.orb-b{width:31px;height:31px;left:54%;top:14%;animation-delay:-2s}.orb-c{width:75px;height:75px;right:9%;top:16%;animation-delay:-4s}.spark{position:absolute;font-style:normal;font-size:35px;animation:twinkle 2s ease-in-out infinite}.spark-a{left:45%;top:28%;color:var(--peach)}.spark-b{left:4%;bottom:28%;color:var(--mint);animation-delay:-.7s}.spark-c{right:29%;bottom:12%;color:var(--lav);animation-delay:-1.3s}.toast{position:fixed;z-index:200;left:50%;bottom:32px;transform:translate(-50%,140%);padding:13px 20px;border:var(--line);border-radius:99px;background:var(--ink);color:#fff;font:500 11px DM Mono;transition:.35s cubic-bezier(.2,.9,.2,1.3)}.toast.show{transform:translate(-50%,0)}
.reveal{animation:reveal .8s .08s both}.reveal-late{animation:revealScale .9s .25s both}.reveal-later{animation:reveal .8s .55s both}
/* GAME */
.game-page{background:var(--cream)}.game-sky{position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 18% 17%,#fff 0 4%,transparent 20%),radial-gradient(circle at 82% 8%,rgba(199,176,220,.48),transparent 25%),linear-gradient(145deg,#fff9e6,#ffeab8 70%,#ffd8bd)}.game-sky:before{content:"";position:absolute;inset:auto -5% -25% -5%;height:58%;border-radius:50% 50% 0 0;background:#f5dd52;border-top:2px solid var(--ink);transform:rotate(-2deg)}.game-shell{height:100%;max-width:1650px;margin:auto;padding:112px 5vw 36px;display:grid;grid-template-rows:auto 1fr auto;gap:15px}.game-heading{display:flex;justify-content:space-between;align-items:end}.game-heading h1{font-size:clamp(50px,5.3vw,102px);line-height:.76}.game-heading h1 em{-webkit-text-stroke:2px var(--ink);text-shadow:4px 5px 0 var(--ink)}.game-heading>p{font:500 12px/1.6 DM Mono;margin:0 0 4px;text-align:right}.game-board{position:relative;min-height:380px;overflow:hidden;border:3px solid var(--ink);border-radius:35px;background:linear-gradient(#fffdf0 0 62%,#c8e4bd 62%);box-shadow:9px 9px 0 var(--ink);outline:none}.game-board:before{content:"";position:absolute;left:-5%;right:-5%;bottom:30%;height:20%;border-radius:50%;background:#e0f0d8;border-top:2px solid var(--ink)}.hud{position:absolute;z-index:10;top:19px;left:21px;right:21px;display:flex;justify-content:space-between;padding:11px 16px;border:2px solid var(--ink);border-radius:14px;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);font:500 11px DM Mono}.hud b{font-size:18px;margin-left:5px}.game-glimpo{position:absolute;z-index:5;left:50%;bottom:3.5%;transform:translateX(-50%);height:25%;min-height:100px;filter:drop-shadow(0 9px 0 rgba(0,0,0,.12));transition:left .08s linear}.game-glimpo.happy{animation:happy .38s ease}.game-glimpo.bonk{animation:bonk .38s ease}.start-panel{position:absolute;z-index:12;left:50%;top:54%;transform:translate(-50%,-50%);min-width:360px;text-align:center;padding:27px 38px;border:var(--line);border-radius:28px;background:rgba(255,248,223,.93);box-shadow:7px 7px 0 var(--ink);transition:.25s}.start-panel.hidden{opacity:0;visibility:hidden;transform:translate(-50%,-44%) scale(.9)}.start-panel h2{font-size:27px;margin:4px 0}.start-panel p{font:400 12px/1.7 DM Mono}.start-panel .primary-btn{margin:17px auto 0}.mini-sun{font-size:35px;color:#f3dd16;text-shadow:2px 2px 0 var(--ink)}kbd{display:inline-grid;place-items:center;min-width:24px;height:24px;border:1px solid;border-radius:5px;background:#fff;box-shadow:0 2px 0 var(--ink)}.drop{position:absolute;z-index:4;top:72px;transform:translate(-50%,-80px);animation:fall var(--fall) linear forwards;will-change:transform}.drop.good{font-size:39px;color:#f5d817;text-shadow:2px 2px 0 var(--ink)}.drop.bad{font-size:45px;filter:grayscale(.4);text-shadow:2px 3px 0 rgba(0,0,0,.2)}.burst{position:absolute;z-index:20;width:8px;height:8px;border-radius:50%;background:#f6db1d;animation:burst .65s ease-out forwards}.burst.inky{background:#777}.cloud{position:absolute;width:110px;height:35px;border:2px solid;border-radius:50px;background:#fff;opacity:.56}.cloud:before,.cloud:after{content:"";position:absolute;border:2px solid;border-bottom:0;background:#fff;border-radius:50% 50% 0 0}.cloud:before{width:41px;height:35px;left:14px;top:-27px}.cloud:after{width:55px;height:47px;right:9px;top:-39px}.cloud-one{left:8%;top:27%;animation:cloud 19s linear infinite}.cloud-two{right:7%;top:34%;transform:scale(.7);animation:cloud 24s -7s linear infinite reverse}.game-footer{display:flex;justify-content:space-between;align-items:center;font:500 10px DM Mono}.ca-btn.compact{height:43px;box-shadow:3px 3px 0 var(--ink)}
@keyframes glimpoFloat{0%,100%{transform:translateY(0) rotate(-1deg) rotateX(var(--rx)) rotateY(var(--ry))}50%{transform:translateY(-18px) rotate(1.5deg) rotateX(var(--rx)) rotateY(var(--ry))}}@keyframes shadowPulse{50%{transform:scale(.85);opacity:.55}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes speechPop{0%,20%,100%{transform:rotate(5deg) scale(0);opacity:0}27%,82%{transform:rotate(5deg) scale(1);opacity:1}}@keyframes drift{50%{transform:translate(12px,-18px)}}@keyframes twinkle{50%{transform:scale(.55) rotate(22deg);opacity:.45}}@keyframes reveal{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}@keyframes revealScale{from{opacity:0;transform:scale(.88)}to{opacity:1;transform:scale(1)}}@keyframes fall{to{transform:translate(-50%,calc(100vh - 240px)) rotate(240deg)}}@keyframes happy{50%{transform:translateX(-50%) translateY(-22px) scaleX(1.09) scaleY(.92)}}@keyframes bonk{25%{transform:translateX(-60%) rotate(-7deg)}75%{transform:translateX(-40%) rotate(7deg)}}@keyframes burst{to{transform:translate(calc(cos(var(--a))*58px),calc(sin(var(--a))*58px)) scale(0);opacity:0}}@keyframes cloud{50%{transform:translateX(45px)}}
@media(max-width:1100px){.hero-content{padding-left:6vw;padding-right:6vw}.lore-card{display:none}.hero-glimpo{width:min(37vw,430px)}.game-shell{padding-left:4vw;padding-right:4vw}}@media(max-width:760px){.page{height:auto;min-height:100svh;overflow:auto}.topbar{height:82px;padding:0 18px}.brand span{display:none}.nav-pill{padding:0 12px;min-height:38px}.hero-content{min-height:100svh;grid-template-columns:1fr;padding:112px 24px 48px;text-align:center}.copy-card{order:2}.eyebrow,.actions{justify-content:center}h1{font-size:72px}.lede{font-size:16px}.glimpo-stage{height:42vh;min-height:280px;order:1}.hero-glimpo{width:min(65vw,310px);max-height:38vh}.halo{width:min(78vw,390px)}.speech{right:5%}.scroll-note{display:none}.game-page{height:100svh;overflow:hidden}.game-shell{padding:88px 14px 18px}.game-heading h1{font-size:48px}.game-heading>p{display:none}.game-board{border-radius:24px}.start-panel{min-width:calc(100% - 36px);padding:22px 15px}.hud{top:12px;left:12px;right:12px}.game-glimpo{height:20%}.cursor-glow{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}