*{box-sizing:border-box} :root{--ink:#173b58;--aqua:#67c8cb;--gold:#f1c666;--paper:#f8fcff}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 'Trebuchet MS',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible{outline:3px solid #7255a7;outline-offset:5px}header{max-width:1320px;margin:auto;padding:26px 5%;display:flex;justify-content:space-between;align-items:center;gap:15px}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;font-size:28px;font-weight:bold;line-height:1.2}.brand small{display:block;font-size:11px;letter-spacing:.04em;font-weight:normal}.brand-star{color:#b68c30;font-size:40px}.quiet{border:1px solid #b7d3dd;background:transparent;border-radius:30px;padding:9px 16px;color:var(--ink);font-size:13px}.welcome{text-align:center;padding:44px 15px 20px;background:radial-gradient(ellipse at 50% 70%,#ddf3f7,transparent 65%)}.eyebrow{font-size:13px;color:#4a6d7a;margin:0 0 15px}h1,h2{font-family:Georgia,serif;font-weight:normal;line-height:1.08}h1{font-size:clamp(38px,5vw,66px);letter-spacing:-.04em;margin:10px 0 20px}p{margin:12px 0}.welcome>p:last-child{color:#567382}.journey{display:flex;justify-content:center;gap:13px;margin:25px auto 38px;padding:10px 15px;flex-wrap:wrap}.step{border:0;border-radius:50%;width:44px;height:44px;background:#e5eff3;color:#597684;font-weight:bold;position:relative}.step.current{background:var(--ink);color:white;outline:5px solid #d9edf1}.step.done{background:#f7e4ad;color:#69501e}.step .lock{font-size:9px;position:absolute;bottom:-13px;left:0;right:0;font-weight:normal}.portal{max-width:1190px;margin:auto;display:grid;grid-template-columns:1.08fr 1fr;min-height:590px;padding:0 28px;gap:45px;align-items:center}.scene{isolation:isolate;min-height:560px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 52%,#bde3e9 0,#e3f4f9 45%,#f8fcff 70%);overflow:hidden;border-radius:47% 47% 18% 18%}.bear{width:93%;height:510px;object-fit:contain;z-index:2;filter:drop-shadow(0 18px 16px #62859c26)}.orbit{position:absolute;border:1px solid #b4d9e5;border-radius:50%;width:90%;height:78%;transform:rotate(-22deg);z-index:-1}.orbit-two{width:72%;height:92%;transform:rotate(28deg)}.cloud{position:absolute;background:#fff;border-radius:50%;filter:blur(3px);height:60px;width:180px;z-index:3;bottom:22px;opacity:.75}.cloud-left{left:-60px}.cloud-right{right:-70px;bottom:90px}.speck{position:absolute;color:#d3ac55;font-size:35px}.s1{top:12%;left:13%}.s2{top:42%;right:2%;font-size:19px}.s3{bottom:18%;left:8%;font-size:20px}.scene-note{position:absolute;bottom:0;color:#7795a4;font-size:11px}.bril{--bril:#f1c666;position:absolute;top:15%;right:1%;width:92px;padding:0;background:none;border:0;z-index:4;transform:rotate(12deg);filter:drop-shadow(0 0 15px #e7cc7a88)}.bril svg{display:block;width:100%;overflow:visible}.bril path{fill:var(--bril);stroke:#fff4d5;stroke-width:4;stroke-linejoin:round}.bril ellipse{fill:#594e3b}.bril.play{animation:hop 850ms ease-in-out}.story{padding:25px 0}.story-top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:#617e8e}.story h2{font-size:clamp(32px,3.6vw,48px);letter-spacing:-.035em;margin:21px 0 14px}.value{font-size:13px;color:#527e87}.challenge{padding:19px 23px;background:#eaf4f6;border-left:3px solid #8bbbc7;margin:25px 0;font-size:16px}.challenge strong{display:block;font-size:12px;margin-bottom:7px}.story-text{min-height:135px;font-size:18px;line-height:1.7}.primary{background:var(--ink);color:white;border:0;border-radius:38px;padding:15px 29px;box-shadow:0 9px 20px #173b581a;font-weight:bold;font-size:15px}.text-button{background:none;border:0;color:var(--ink);text-decoration:underline;font-size:13px;padding:12px 0;display:block}.status{font-size:12px;color:#627f8b;min-height:20px}.colors{display:flex;gap:15px;padding:14px 0}.colors[hidden]{display:none}.colors button{width:40px;height:40px;background:var(--swatch);border:3px solid white;border-radius:50%;box-shadow:0 0 0 1px #a4bac4}.homeward{text-align:center;margin:65px 0 0;padding:55px 20px 65px;background:#eaf5f8;border-radius:50% 50% 0 0/12% 12% 0 0}.homeward>span{font-size:50px;color:#8bb7c4}.homeward h2{font-size:40px;letter-spacing:-.03em;margin:10px}.homeward p{font-size:15px;color:#597786}.homeward a{color:var(--ink);font-size:14px}footer{display:flex;justify-content:space-between;align-items:center;gap:15px;max-width:1200px;margin:auto;padding:24px 30px;font-size:12px;color:#62808e}dialog{border:0;border-radius:24px;max-width:530px;width:calc(100% - 32px);padding:36px;color:var(--ink);background:var(--paper);box-shadow:0 30px 100px #102e4266}dialog::backdrop{background:#15364b88;backdrop-filter:blur(5px)}dialog h2{font-size:34px}dialog p{font-size:15px}dialog hr{margin:27px 0;border:0;border-top:1px solid #d3e4eb}.close{position:absolute;top:10px;right:18px;border:0;background:none;font-size:29px;color:var(--ink)}.fallback{padding:30px} @keyframes hop{0%,100%{transform:translateY(0) rotate(12deg)}45%{transform:translateY(-30px) rotate(-15deg)}}@media(max-width:720px){header{padding:18px 22px}.brand{font-size:23px}.quiet{font-size:11px;padding:8px 11px}.welcome{padding:25px 15px 5px}.welcome p:last-child{font-size:15px}.journey{gap:10px;margin:19px auto 12px}.step{width:35px;height:35px}.portal{grid-template-columns:1fr;gap:0;padding:0 22px}.scene{min-height:350px;max-width:470px;width:100%;margin:auto}.bear{height:350px}.bril{width:73px;right:6%;top:12%}.story{padding:17px 0}.story h2{font-size:36px}.story-text{min-height:0}.challenge{margin:18px 0}.homeward{margin-top:30px}.homeward h2{font-size:33px}footer{display:block;padding:24px}.primary{width:100%}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}
[hidden]{display:none!important}
