@font-face{font-family:Gilroy;src:url(assets/Gilroy-Regular.ttf)}@font-face{font-family:Gilroy;src:url(assets/Gilroy-Bold.ttf);font-weight:700}@font-face{font-family:Bebas;src:url(assets/BebasNeue-Regular.ttf)}
:root{--blue:#143cff;--ink:#111216;--muted:#585c65;--canvas:#f4f4f2;--line:#d4d6dc}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font:18px Gilroy,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:5px}main{max-width:1680px;margin:auto;padding:0 64px}header{height:100px;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--line);font:15px Bebas;letter-spacing:1px}.brand{background:var(--blue);width:144px;height:100px;display:grid;place-items:center}.brand img{width:108px}.edition{margin-left:auto;color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:56px 0 44px}.eyebrow{font:15px Bebas;letter-spacing:1.1px;margin:0 0 17px;color:var(--muted)}h1{font-size:clamp(50px,5.8vw,88px);line-height:.98;letter-spacing:-4px;margin:0;font-weight:700}.lead{line-height:1.5;margin:0 0 4px;color:var(--muted)}.board{border-top:1px solid var(--line)}.endpoints{display:grid;grid-template-columns:1fr 1fr 1fr;gap:55px;padding:30px 0 0;position:relative;z-index:2}.endpoints p{font-size:16px;line-height:1.5;max-width:340px;margin:0}.endpoints>div:last-child{justify-self:end}.endpoints .eyebrow{color:var(--blue);display:block;margin-bottom:10px}.instruction{font:14px Bebas;text-align:center;letter-spacing:1px;color:#777b84;padding-top:10px}.instruction span{display:block;font:30px Gilroy;margin:12px}.board #scene{height:370px;position:relative;touch-action:pan-y}canvas{width:100%;height:100%;display:block}#labels{position:absolute;inset:0;pointer-events:none}.house{position:absolute;background:none;border:0;padding:0;text-align:center;width:190px;pointer-events:auto;transform:translate(-50%,0);color:var(--ink);transition:color .2s}.house .number{display:block;font:17px Bebas;letter-spacing:2px;color:var(--muted);margin-bottom:7px}.house strong{display:block;font-size:17px;line-height:1.22}.house.active,.house.active .number{color:var(--blue)}.house.endpoint{width:70px}.house.endpoint strong{font-size:22px}.house.endpoint .number{display:none}#bubble{position:absolute;pointer-events:none;background:var(--ink);color:white;padding:8px 12px;border-radius:6px;font:13px Bebas;letter-spacing:1px;white-space:nowrap;transform:translate(-50%,-100%)}#bubble:after{content:'';position:absolute;top:100%;left:calc(50% - 4px);border:4px solid transparent;border-top-color:var(--ink)}nav{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 0 24px}nav button{border:1px solid var(--line);background:transparent;color:var(--ink);height:44px;border-radius:50px}#reset{border:0;font-size:22px;padding:0}#reset span{font-size:14px;margin-left:8px}.arrows{display:flex;gap:8px}.arrows button{width:50px;font-size:23px}#next{background:var(--blue);color:white;border-color:var(--blue)}button:disabled{opacity:.3;cursor:default}#dots{display:flex;align-items:center;gap:4px}#dots button{width:30px;border:0;font:14px Bebas;height:34px}#dots button[aria-pressed=true]{background:var(--blue);color:white}#detail{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding:46px 0 60px;min-height:360px}h2{font-size:38px;letter-spacing:-1px;line-height:1.05;margin:0;max-width:480px}#subtitle{color:var(--muted);margin:12px 0 25px}.result{border-left:2px solid var(--blue);padding-left:18px;max-width:440px}.result .eyebrow{font-size:13px}.result p{font-size:16px;line-height:1.45;margin:9px 0}.activities ul{list-style:none;padding:0;margin:0}.activities li{font-size:16px;line-height:1.45;padding:12px 0 12px 26px;border-bottom:1px solid var(--line);position:relative}.activities li:before{content:'+';position:absolute;left:0;color:var(--blue)}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:25px;align-items:center;padding:25px 0;font:13px Bebas;letter-spacing:1px;color:var(--muted)}footer p{font:12px Gilroy;letter-spacing:0}.activities>.eyebrow{margin-bottom:4px}@media(hover:hover){.house:hover{color:var(--blue)}nav button:hover:not(:disabled){background:#e7e8eb}#next:hover:not(:disabled){background:#1030cc}}@media(max-width:700px){main{padding:0 22px}header{height:76px;gap:16px;font-size:12px}.brand{width:105px;height:76px}.brand img{width:85px}.edition{display:none}.intro{padding:36px 0;display:block}h1{letter-spacing:-2px;font-size:54px}.lead{font-size:16px;margin-top:22px}.endpoints{grid-template-columns:1fr 1fr;gap:22px;padding-top:22px}.endpoints p{font-size:13px;line-height:1.4}.endpoints .eyebrow{font-size:12px;letter-spacing:.7px}.instruction{display:none}.board #scene{height:315px;margin:0 -10px}.house{width:130px}.house strong{font-size:14px}.house .number{font-size:14px}.house.endpoint{width:38px}.house.endpoint strong{font-size:19px}#reset span{display:none}#dots{gap:0}#dots button{width:25px}.arrows button{width:38px;height:38px}#detail{grid-template-columns:1fr;gap:24px;padding:30px 0 40px}h2{font-size:32px}footer{align-items:flex-start}footer p{max-width:190px;margin:0}footer>span:last-child{display:none}#bubble{font-size:11px;padding:7px 9px}}
