:root{--sky:#cfe7ec;--sky2:#edf5f3;--ink:#2c424a;--muted:#698087;--road:#6e7979;--road2:#5c6969;--green:#7e9f79;--green2:#628461;--accent:#4d9da9;--sun:#efd99b}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);overflow:hidden}body{background:var(--sky)}button,a{font:inherit}.journey{height:100vh;display:grid;grid-template-rows:57% 38% 5%;background:linear-gradient(var(--sky),var(--sky2))}.sky{position:relative;overflow:hidden;background:linear-gradient(180deg,#c7e2e8 0%,#dceef0 58%,#edf4ef 100%)}.sky:after{content:"";position:absolute;left:0;right:0;bottom:0;height:25%;background:linear-gradient(180deg,transparent,rgba(126,159,121,.23));pointer-events:none}.sun{position:absolute;right:12%;top:10%;width:88px;height:88px;border-radius:50%;background:var(--sun);box-shadow:0 0 55px rgba(239,217,155,.7)}.cloud{position:absolute;width:160px;height:36px;background:rgba(255,255,255,.72);border-radius:50px;filter:blur(.25px);animation:drift 34s linear infinite}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud:before{width:62px;height:62px;left:25px;top:-29px}.cloud:after{width:78px;height:78px;right:25px;top:-42px}.cloud-a{left:8%;top:18%;animation-duration:42s}.cloud-b{left:51%;top:8%;transform:scale(.7);animation-duration:52s;animation-delay:-20s}.cloud-c{left:74%;top:28%;transform:scale(.5);animation-duration:45s;animation-delay:-8s}@keyframes drift{from{margin-left:-100px}to{margin-left:180px}}.sky-haze{position:absolute;inset:0;background:radial-gradient(circle at 50% 80%,rgba(255,255,255,.35),transparent 42%);pointer-events:none}.back{position:absolute;z-index:20;left:26px;top:22px;color:#405861;text-decoration:none;font-weight:800;font-size:12px;letter-spacing:.05em}.back:hover{color:#1f3c47}.title-block{position:absolute;z-index:15;left:50%;top:10%;transform:translateX(-50%);text-align:center}.title-block span{font-size:10px;letter-spacing:.3em;font-weight:900;color:#4f737d}.title-block h1{font-size:clamp(62px,9vw,124px);line-height:.88;margin:7px 0 4px;color:#2c454d;font-weight:800;letter-spacing:-.075em;text-shadow:0 2px 0 rgba(255,255,255,.28)}.title-block p{margin:0;color:#688087;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.hint{position:absolute;z-index:15;left:50%;bottom:9%;transform:translateX(-50%);font-size:11px;color:#688087;text-align:center;width:min(620px,80vw)}
.flight-lane{position:absolute;z-index:9;left:0;right:0;top:35%;height:30%;overflow:hidden;pointer-events:none}.flight-path{position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);opacity:.7}.event-track{position:absolute;inset:0}.event{position:absolute;left:50%;top:50%;width:196px;height:104px;transform:translate(calc(-50% + var(--flight-x)),calc(-50% + var(--flight-y)));opacity:0;filter:blur(1px);transition:transform 1.35s cubic-bezier(.2,.72,.15,1),opacity .8s ease,filter .8s ease;will-change:transform,opacity}.event-card{width:100%;height:100%;display:grid;grid-template-columns:54px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:11px 13px;border:1px solid rgba(255,255,255,.82);border-radius:15px;background:rgba(255,255,255,.86);box-shadow:0 14px 34px rgba(48,76,82,.13);backdrop-filter:blur(12px)}.event-icon{grid-row:1/3;width:52px;height:52px;border-radius:13px;display:grid;place-items:center;background:#edf4f5;color:#4d8d98;box-shadow:inset 0 0 0 1px rgba(72,125,135,.09)}.product-icon{display:block;width:42px;height:42px}.product-icon svg{display:block;width:100%;height:100%}.event-name{font-size:11px;line-height:1.16;font-weight:850;color:#304950}.event-meta{font-size:8px;color:#71848a;margin-top:2px}.event.active{opacity:1;filter:none;z-index:4;transform:translate(-50%,-50%)}.event.past{opacity:.16;transform:translate(calc(-50% - 120px),calc(-50% + var(--flight-y)));filter:blur(2px)}.event.past .event-card{box-shadow:none}.event.active .event-card{border-color:rgba(78,153,166,.45);box-shadow:0 18px 42px rgba(54,103,112,.2)}
.current-card{position:absolute;z-index:30;right:24px;top:20px;display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid rgba(255,255,255,.8);border-radius:12px;background:rgba(255,255,255,.72);backdrop-filter:blur(10px);box-shadow:0 10px 28px rgba(42,67,72,.12)}.current-icon{width:38px;height:38px;border-radius:9px;background:#e2f0f1;display:grid;place-items:center;color:#4d8d98}.current-icon .product-icon{width:32px;height:32px}.current-card strong{display:block;font-size:11px}.current-card span{display:block;color:#71848a;font-size:8px;margin-top:2px}
.world{position:relative;overflow:hidden;background:linear-gradient(#a9c39f 0 17%,#8ca581 17% 49%,#707c7d 49% 100%)}.distant-hills{position:absolute;left:-10%;right:-10%;top:0;height:42%;background:linear-gradient(145deg,transparent 0 17%,rgba(105,139,105,.55) 17% 32%,transparent 32% 46%,rgba(115,148,112,.5) 46% 63%,transparent 63%);animation:hills 18s linear infinite}@keyframes hills{from{transform:translateX(0)}to{transform:translateX(-7%)}}.tree-field{position:absolute;left:-15%;right:-15%;bottom:47%;height:35%;display:flex;gap:45px;align-items:flex-end;animation:trees 4.2s linear infinite;will-change:transform}.tree-field span{position:relative;flex:0 0 55px;height:105px}.tree-field span:before{content:"";position:absolute;left:24px;bottom:0;width:9px;height:48px;border-radius:5px;background:#5c6e56}.tree-field span:after{content:"";position:absolute;left:0;bottom:31px;width:55px;height:75px;background:#547552;clip-path:polygon(50% 0,75% 27%,66% 27%,90% 53%,68% 53%,100% 82%,0 82%,32% 53%,10% 53%,34% 27%,25% 27%);filter:drop-shadow(0 4px 2px rgba(44,69,48,.13))}.tree-field-back{bottom:51%;height:28%;gap:72px;opacity:.42;animation-duration:7.5s}.tree-field-back span{transform:scale(.7)}.tree-field-front{bottom:44%;height:36%;gap:26px;opacity:.9;animation-duration:3.2s}.tree-field-front span:nth-child(2n){transform:scale(1.15)}@keyframes trees{from{transform:translateX(0)}to{transform:translateX(-22%)}}.road{position:absolute;left:-5%;right:-5%;bottom:-22%;height:78%;background:linear-gradient(90deg,#626e6f,#818c8c 50%,#626e6f);clip-path:polygon(37% 0,63% 0,100% 100%,0 100%);overflow:hidden}.road-texture{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 2px,transparent 2px 8px);animation:roadtexture .9s linear infinite}.road-line{position:absolute;left:49.7%;top:-15%;width:3%;height:130%;background:repeating-linear-gradient(180deg,#e8dfb1 0 28px,transparent 28px 73px);transform:translateX(-50%);animation:roadflow .72s linear infinite}.road-edge{position:absolute;top:-10%;width:2px;height:125%;background:repeating-linear-gradient(180deg,rgba(232,223,177,.35) 0 18px,transparent 18px 52px);animation:roadflow .95s linear infinite}.edge-left{left:32%;transform:rotate(2deg)}.edge-right{right:32%;transform:rotate(-2deg)}@keyframes roadflow{from{background-position-y:0}to{background-position-y:72px}}@keyframes roadtexture{from{transform:translateX(0)}to{transform:translateX(-30px)}}
.walker{position:absolute;z-index:12;left:50%;bottom:12%;width:72px;height:118px;transform:translateX(-50%);filter:drop-shadow(0 8px 5px rgba(30,43,44,.25));animation:walkbob .48s ease-in-out infinite alternate}.walker-head{position:absolute;left:25px;top:0;width:22px;height:22px;border-radius:50%;background:#e7b995}.walker-body{position:absolute;left:22px;top:22px;width:28px;height:43px;border-radius:12px 12px 9px 9px;background:#3f6875}.walker-arm,.walker-leg{position:absolute;width:7px;border-radius:8px;background:#2f4b53;transform-origin:top center}.walker-arm{height:37px;top:28px}.arm-a{left:22px;animation:armA .48s ease-in-out infinite alternate}.arm-b{left:43px;animation:armB .48s ease-in-out infinite alternate}.walker-leg{height:45px;top:61px}.leg-a{left:26px;animation:legA .48s ease-in-out infinite alternate}.leg-b{left:39px;animation:legB .48s ease-in-out infinite alternate}.walker-leg span{position:absolute;bottom:-3px;left:-3px;width:15px;height:6px;border-radius:6px;background:#253e45;transform:rotate(-7deg)}.walker-bag{position:absolute;left:47px;top:36px;width:13px;height:18px;border-radius:3px;background:#d2a66f;transform:rotate(8deg)}.walker-shadow{position:absolute;left:10px;bottom:-4px;width:52px;height:10px;border-radius:50%;background:rgba(20,31,31,.22);filter:blur(3px)}@keyframes walkbob{from{transform:translate(-50%,0)}to{transform:translate(-50%,-4px)}}@keyframes armA{from{transform:rotate(32deg)}to{transform:rotate(-38deg)}}@keyframes armB{from{transform:rotate(-38deg)}to{transform:rotate(32deg)}}@keyframes legA{from{transform:rotate(24deg)}to{transform:rotate(-28deg)}}@keyframes legB{from{transform:rotate(-28deg)}to{transform:rotate(24deg)}}
.controls{position:absolute;z-index:30;right:24px;bottom:18px;display:flex;gap:6px}.controls button{border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.82);color:#415a62;border-radius:8px;padding:8px 10px;font-size:9px;font-weight:800;cursor:pointer}.controls button:hover{background:#fff}footer{display:flex;justify-content:space-between;align-items:center;padding:0 24px;background:#33484e;color:#b9c9cb;font-size:9px;letter-spacing:.08em;text-transform:uppercase}footer #progress{color:#e0d6a5}.instant *{transition:none!important}@media(max-width:700px){.journey{grid-template-rows:55% 40% 5%}.title-block{top:12%}.title-block h1{font-size:64px}.hint{bottom:7%;font-size:10px}.flight-lane{top:39%;height:27%}.event{width:178px}.event-card{grid-template-columns:46px 1fr;padding:9px 10px}.event-icon{width:44px;height:44px}.current-card{right:12px;top:12px}.current-card strong{max-width:145px}.back{left:15px;top:15px}.tree-field{bottom:46%}.road{bottom:-18%;height:74%}.walker{bottom:11%;transform:translateX(-50%) scale(.9)}.controls{right:12px;bottom:12px}.controls button{padding:7px 8px}footer{padding:0 12px;font-size:7px}}
.celebration{position:fixed;inset:0;z-index:100;pointer-events:none;opacity:0;visibility:hidden;overflow:hidden;background:rgba(203,226,232,.05)}
.celebration.show{opacity:1;visibility:visible}
.celebration-label{position:absolute;z-index:2;left:50%;top:14%;transform:translateX(-50%);padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);box-shadow:0 12px 32px rgba(40,65,70,.12);font-size:10px;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:#3f626b}
.celebration-cards{position:absolute;inset:0}
.solitaire-card{position:absolute;left:0;top:0;width:58px;height:76px;border-radius:9px;border:1px solid rgba(255,255,255,.95);background:rgba(255,255,255,.94);box-shadow:0 9px 20px rgba(40,65,70,.22);display:grid;place-items:center;will-change:transform,opacity}
.solitaire-icon{width:37px;height:37px;border-radius:8px;background:#edf4f5;color:#4d8d98;display:grid;place-items:center}
.solitaire-icon .product-icon{width:31px;height:31px}
.solitaire-card span{position:absolute;bottom:5px;right:6px;font-size:7px;font-weight:900;color:#6d8086}
@media(prefers-reduced-motion:reduce){.cloud{animation-duration:84s}.walker,.walker-arm,.walker-leg{animation-duration:1.1s}.tree-field{animation-duration:8s}.tree-field-back{animation-duration:15s}.tree-field-front{animation-duration:6s}.distant-hills{animation-duration:36s}.road-line{animation-duration:1.5s}.road-edge{animation-duration:1.9s}.road-texture{animation-duration:1.8s}.event{transition-duration:1.8s}.event.active{transform:translate(-50%,-50%);opacity:1;filter:none}.event:not(.active){opacity:.12}}