body{margin:0}
a{color:inherit}a:hover{opacity:.8}
button{font:inherit;color:inherit;cursor:pointer}
.lab{font:500 10px/1.4 'IBM Plex Mono',monospace;letter-spacing:.16em;text-transform:uppercase}
.mono{font-family:'IBM Plex Mono',monospace}
.fade{animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) 1s both}
.fade2{animation:fadeUp .8s cubic-bezier(.2,.7,.2,1) 1.4s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.drift{animation:drift 38s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate(0,0)}to{transform:translate(-36px,18px)}}
.draw polygon,.draw line,.draw path,.draw circle,.draw rect{stroke-dasharray:900;stroke-dashoffset:900;animation:draw 1.8s ease 1.1s forwards}
.draw.now polygon,.draw.now line,.draw.now path,.draw.now circle,.draw.now rect{animation-duration:1.1s;animation-delay:0s}
.draw.now text{animation:glow .6s ease .5s both}
@keyframes draw{to{stroke-dashoffset:0}}
.carE{animation:carE linear infinite}
.carW{animation:carW linear infinite}
.carS{animation:carS linear infinite}
.carN{animation:carN linear infinite}
.cloud{position:absolute;left:0;border-radius:50%;background:radial-gradient(closest-side,rgba(30,34,44,.22),rgba(30,34,44,0));filter:blur(12px);animation:cloud linear infinite}
@keyframes cloud{from{transform:translateX(-80vw)}to{transform:translateX(120vw)}}
.rain{position:absolute;inset:-20% 0 0 0;pointer-events:none;background-image:repeating-linear-gradient(104deg,transparent 0 22px,rgba(80,96,116,.38) 22px 23px,transparent 23px 47px);background-size:240px 180px;animation:rain .55s linear infinite}
.rain2{opacity:.6;background-size:170px 130px;animation-duration:.8s}
@keyframes rain{from{background-position:0 0}to{background-position:-48px 180px}}
.haze{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 85% 8%,rgba(255,214,140,.45),rgba(255,190,110,0) 45%),linear-gradient(0deg,rgba(255,170,90,.12),rgba(255,170,90,0) 60%);animation:haze 4s ease-in-out infinite alternate}
@keyframes haze{from{opacity:.75}to{opacity:1}}
.flow{stroke-dasharray:14 40;animation:flow 5s linear infinite}
@keyframes flow{to{stroke-dashoffset:-54}}
.orbit{transform-origin:0 0;animation:orbit linear infinite}
@keyframes orbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.lite .hvy,.lite .flock,.lite .cloud{display:none!important}
.full{cursor:crosshair}
.full .panel,.full nav,.full aside{cursor:auto}
.full button,.full a{cursor:pointer}
.tipzone{position:absolute;pointer-events:auto}
.tip{position:absolute;left:50%;top:-6px;transform:translate(-50%,-100%);white-space:nowrap;background:#1a1a1a;color:#f4f0e8;font:500 14px/1 'IBM Plex Mono',monospace;letter-spacing:.12em;text-transform:uppercase;padding:9px 12px;opacity:0;transition:opacity .25s ease;pointer-events:none}
.full .tipzone:hover .tip,.full .egg:hover .tip{opacity:1}
.lite .tip{display:none}
.cat{animation:catWalk 46s linear infinite}
@keyframes catWalk{0%{transform:translate(0,0)}18%{transform:translate(120px,0)}28%{transform:translate(120px,0)}52%{transform:translate(-40px,2px)}62%{transform:translate(-40px,2px)}80%{transform:translate(60px,-6px)}90%{transform:translate(60px,-6px)}100%{transform:translate(0,0)}}
.catflip{transform-origin:50% 50%;animation:catFlip 46s linear infinite}
@keyframes catFlip{0%,27.9%{transform:scaleX(1)}28%,61.9%{transform:scaleX(-1)}62%,89.9%{transform:scaleX(1)}90%,100%{transform:scaleX(-1)}}
.fl1{animation:flash .5s steps(1,end) infinite}
.fl2{animation:flash .5s steps(1,end) -.25s infinite}
@keyframes flash{0%{opacity:1}50%{opacity:.08}}
.plane{position:absolute;left:0;top:0;z-index:2;pointer-events:none;animation:planeFly linear infinite}
@keyframes planeFly{from{transform:translate(-10vw,92vh)}to{transform:translate(108vw,-14vh)}}
.plane2{animation-name:planeFly2}
@keyframes planeFly2{from{transform:translate(105vw,70vh)}to{transform:translate(-12vw,8vh)}}
.heli{position:absolute;left:0;top:0;z-index:2;pointer-events:none;animation:heliWander 70s ease-in-out infinite}
@keyframes heliWander{0%{transform:translate(58vw,30vh) rotate(-20deg)}25%{transform:translate(70vw,22vh) rotate(10deg)}50%{transform:translate(64vw,46vh) rotate(160deg)}75%{transform:translate(50vw,38vh) rotate(200deg)}100%{transform:translate(58vw,30vh) rotate(340deg)}}
.rotor{transform-origin:0 0;transform-box:view-box;animation:spin .22s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.train{animation:train 44s infinite}
.trainW{animation:trainW 44s infinite}
@keyframes trainW{0%{transform:translateX(0);animation-timing-function:cubic-bezier(.3,0,.6,1)}38%{transform:translateX(-1500px)}50%{transform:translateX(-1500px);animation-timing-function:cubic-bezier(.45,0,.9,.6)}68%{transform:translateX(-2300px)}100%{transform:translateX(-2300px)}}
@keyframes train{0%{transform:translateX(0);animation-timing-function:cubic-bezier(.3,0,.6,1)}38%{transform:translateX(2900px)}50%{transform:translateX(2900px);animation-timing-function:cubic-bezier(.4,0,.7,1)}100%{transform:translateX(6200px)}}
.pax-on{animation:paxOn 44s linear infinite;opacity:0}
.pax-off{animation:paxOff 44s linear infinite;opacity:0}
@keyframes paxOn{0%{opacity:0;transform:translate(-14px,0)}8%{opacity:1;transform:translate(0,0)}44%{opacity:1;transform:translate(0,0)}48%{opacity:1;transform:translate(var(--dx),var(--dy))}49%{opacity:0;transform:translate(var(--dx),var(--dy))}100%{opacity:0;transform:translate(var(--dx),var(--dy))}}
@keyframes paxOff{0%,38.5%{opacity:0;transform:translate(0,0)}39.5%{opacity:1;transform:translate(0,0)}43%{opacity:1;transform:translate(var(--dx),var(--dy))}53%{opacity:1;transform:translate(var(--ex),var(--ey))}55%,100%{opacity:0;transform:translate(var(--ex),var(--ey))}}
@keyframes carE{from{transform:translateX(0)}to{transform:translateX(2600px)}}
@keyframes carW{from{transform:translateX(0)}to{transform:translateX(-2600px)}}
@keyframes carS{from{transform:translateY(0)}to{transform:translateY(1900px)}}
@keyframes carN{from{transform:translateY(0)}to{transform:translateY(-1900px)}}
.flock{position:absolute;left:0;pointer-events:none;animation:fly linear infinite}
@keyframes fly{0%{transform:translate(-12vw,0)}50%{transform:translate(50vw,-4vh)}100%{transform:translate(112vw,2vh)}}
.wing{transform-origin:50% 60%;transform-box:fill-box;animation:flap .45s ease-in-out infinite alternate}
@keyframes flap{from{transform:scaleY(1)}to{transform:scaleY(.35)}}
.glow{animation:glow 1.2s ease 1.5s both}
.intro-mark path{stroke-dasharray:200;stroke-dashoffset:200;animation:draw 1.1s ease .15s forwards}
.intro-mark path+path{animation-delay:.9s;animation-duration:.5s}
.intro-word{animation:fadeUp .6s ease .7s both}
.paused *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){
*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.25s!important}
.carE,.carW,.carS,.carN,.flock,.drift,.pinpulse,.train,.trainW{animation:none!important}
.pax-on,.pax-off{animation:none!important;opacity:0!important}
.rain,.cloud,.haze,.orbit,.flow,.cat,.catflip,.plane,.heli,.rotor{animation:none!important}
.plane,.heli{display:none!important}
.draw polygon,.draw line,.draw path,.draw circle,.draw rect,.intro-mark path{stroke-dashoffset:0!important}
}
@keyframes glow{from{opacity:0}to{opacity:1}}
.pinpulse{animation:pulse 2s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(168,52,74,.45)}100%{box-shadow:0 0 0 22px rgba(168,52,74,0)}}
@media (max-width:760px){
.panel{left:12px!important;right:12px!important;width:auto!important;top:auto!important;bottom:70px!important;max-height:56vh!important;padding:18px!important}
.panel h1{font-size:26px!important}
.navlinks{gap:12px!important}
.navlinks .hide-sm{display:none}
.sketch{width:100vw!important;right:0!important;top:8%!important;transform:none!important}
.hide-sm{display:none!important}
.flock{display:none!important}
.drift{animation:none!important}
}
@media (max-height: 880px){.svc-btn{min-height:31px!important}.svc-d{min-height:0!important}}
@media (max-height: 780px){.svc-h2{display:none!important}}

html,body{margin:0;background:#efe9de}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap}
.skip{position:absolute;left:-9999px;top:8px;z-index:20;background:#1a1a1a;color:#f4f0e8;padding:10px 14px;font:500 12px 'IBM Plex Mono',monospace}
.skip:focus{left:8px}
@supports (height:100dvh){#app>div{height:100dvh!important;min-height:0!important}}
.lite svg *,.lite .drift,.lite .cat,.lite .catflip{animation-play-state:paused!important}
.lite .drift{animation:none!important}
.lite [style*="mix-blend-mode"]{mix-blend-mode:normal!important}
.lite [style*="var(--tint)"]{opacity:calc(var(--tintop) * .55)!important}
.lite .rain,.lite .cloud,.lite .haze,.lite .flock{display:none!important}
.lite .glow{animation:none!important}
.lite .fade,.lite .fade2{animation-duration:.35s!important;animation-delay:.1s!important}
.lite .draw polygon,.lite .draw line,.lite .draw path,.lite .draw circle,.lite .draw rect{animation:none!important;stroke-dashoffset:0!important}
.lite .draw text{animation:none!important;opacity:1!important}
@media (max-width:760px){
nav{padding:0 14px!important}
nav>button{font-size:16px!important;white-space:nowrap}
.navlinks{gap:10px!important}
.navlinks button{font-size:9px!important;letter-spacing:.08em!important}
.mbar{display:flex!important}
.bbar{bottom:56px!important;height:40px!important}
.panel{bottom:124px!important;max-height:calc(100vh - 230px)!important}
.panel h2{font-size:28px!important}
.panel{top:74px!important;bottom:104px!important;max-height:none!important;overflow:auto!important;font-size:15px}
.panel p{font-size:15px!important;line-height:1.6!important}
aside[aria-label="Melbourne weather now"]{display:none!important}
.about-panel h1{font-size:26px!important}
.rate-card{display:none!important}
.dot{height:28px!important;padding:10px 0!important;min-width:28px}
}
.mbar{display:none;position:absolute;left:0;right:0;bottom:0;height:calc(56px + env(safe-area-inset-bottom, 0px));padding-bottom:env(safe-area-inset-bottom, 0px);box-sizing:border-box;z-index:7;border-top:1px solid #1a1a1a}
.mbar a{flex:1;display:flex;align-items:center;justify-content:center;text-decoration:none;font:500 11px/1 'IBM Plex Mono',monospace;letter-spacing:.12em;background:#f4f0e8;color:#1a1a1a}
.mbar a:first-child{background:#1a1a1a;color:#f4f0e8}