:root{color-scheme:dark;--night:#101a24;--cream:#e8d9bc;--light:#eee6d7;--gold:#ddc298;--ink:#3d403d;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}*{box-sizing:border-box}html{min-height:100%;background:var(--night)}body{min-height:100svh;margin:0;overflow-x:hidden;isolation:isolate;position:relative;background:radial-gradient(ellipse at 49% 43%,#1e3039 0,transparent 62%),linear-gradient(115deg,#111a25,#101c25 70%,#192630);color:var(--light)}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #f1d6a7;outline-offset:6px}[hidden]{display:none!important}p{margin:0}#night-sky{position:absolute;inset:0;width:100%;height:100%;z-index:-3;pointer-events:none}.atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 95%,#8b837811,transparent 65%);z-index:-2;pointer-events:none}
.masthead{max-width:1600px;margin:auto;padding:26px 5.5% 0;display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:65px}.home-mark{display:flex;align-items:center;gap:13px;text-decoration:none;color:#d2c3aa}.home-mark svg{stroke:currentColor;stroke-width:1;fill:none}.home-mark>span{font-size:9px;letter-spacing:.22em;white-space:nowrap}.small-arrow{margin:0 7px;color:#8e9a9e}.header-actions{display:flex;align-items:center;gap:20px}.preview-badge{font-size:7px;letter-spacing:.16em;color:#a7b0b3;border:1px solid #bbc3ca25;padding:8px 10px;border-radius:2px}.icon-button{width:38px;height:38px;border:0;background:none;display:flex;align-items:center;justify-content:center;color:#a4afb6;border-radius:50%}.icon-button:hover{color:var(--cream);background:#ffffff06}.icon-button svg{stroke:currentColor;stroke-width:1.3;fill:none;stroke-linecap:round;stroke-linejoin:round}.replay-button{border:0;background:none;color:#adb8be;min-height:38px;font-size:9px;letter-spacing:.06em;padding:0}.replay-button span{font-size:18px;margin-left:5px}.replay-button:hover{color:var(--cream)}
.story{max-width:1100px;padding:35px 40px 31px;margin:auto;position:relative}.introduction{text-align:center}.eyebrow{font-size:8px;letter-spacing:.25em;color:#c1b394;margin-bottom:19px;font-weight:400}h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(45px,5.2vw,74px);font-weight:400;letter-spacing:-.055em;line-height:1.1;margin:0 0 17px}h1 em{color:#dcc39c;font-weight:400}.phone-break{display:none}.intro-caption{font-size:11px;letter-spacing:.025em;color:#a8b3ba;line-height:1.7}.journey-stage{width:100%;max-width:870px;aspect-ratio:1000/610;margin:-16px auto -12px;position:relative}.australia-map{width:100%;height:100%;overflow:visible}.coastline{stroke:#a9b4ad;stroke-opacity:.47;stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke}.island{stroke-opacity:.34}.map-grid{stroke:#a6b7b5;stroke-width:.6;stroke-opacity:.035;stroke-dasharray:2 8;fill:none}.ocean-label{font-size:6px;letter-spacing:4px;fill:#9caeb0;opacity:.37}.australia-label{font-family:Georgia,'Times New Roman',serif;font-size:14px;letter-spacing:7px;fill:#b5b9ac;opacity:.2}.route-guide{stroke:#ddc298;stroke-opacity:.16;stroke-width:1;stroke-dasharray:3 8;fill:none;vector-effect:non-scaling-stroke}.route-line{stroke:#e2c69b;stroke-width:1.2;stroke-opacity:.9;fill:none;vector-effect:non-scaling-stroke}.pin-ring{stroke:#d9bd92;stroke-width:1;fill:none;opacity:.4;vector-effect:non-scaling-stroke}.pin-star{fill:#edd6ad;filter:drop-shadow(0 0 5px #ebc79066)}.pin-city{fill:#e2d5bd;font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400;letter-spacing:-.6px}.pin-detail{fill:#a2aeb5;font-size:6px;letter-spacing:1.4px}.sydney-pin .pin-ring{opacity:.15;transition:opacity .8s}.sydney-pin .pin-star{opacity:.42;transition:opacity .8s}.arrival-halo{opacity:.25;transition:opacity .8s}.cartography{transition:opacity 1.2s}.story[data-stage="travelling"] .travelling-letter{filter:drop-shadow(0 0 9px #f2d4a533)}.story[data-stage="arrived"] .cartography,.story[data-stage="opened"] .cartography{opacity:.48}.story[data-stage="arrived"] .sydney-pin .pin-ring,.story[data-stage="opened"] .sydney-pin .pin-ring{opacity:.6}.story[data-stage="arrived"] .sydney-pin .pin-star,.story[data-stage="opened"] .sydney-pin .pin-star{opacity:1}.story[data-stage="arrived"] .arrival-halo,.story[data-stage="opened"] .arrival-halo{opacity:.9}.story[data-stage="arrived"] .route-line,.story[data-stage="opened"] .route-line{stroke-opacity:.35}.story[data-stage="arrived"] .australia-label,.story[data-stage="opened"] .australia-label{opacity:0}
.envelope-wrap{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:min(370px,48%);perspective:1100px;z-index:3;animation:envelope-arrive 1s both}.envelope-shadow{position:absolute;width:88%;height:24%;left:6%;bottom:-10%;border-radius:50%;background:#0009;filter:blur(22px);opacity:.4}.envelope{width:100%;aspect-ratio:370/235;display:block;position:relative;border:0;background:none;padding:0;text-align:left;transform:rotate(-5deg);transition:transform .45s;transform-style:preserve-3d;filter:drop-shadow(0 15px 26px #0005);--paper-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%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' opacity='.12' filter='url(%23n)'/%3E%3C/svg%3E")}.envelope:hover{transform:rotate(-3deg) translateY(-4px)}.envelope:focus-visible{outline-offset:12px}.envelope-back{position:absolute;inset:0;border-radius:3px;background-color:#d9c7a8;background-image:var(--paper-noise);border:1px solid #a99a7d}.envelope-front{position:absolute;inset:0;z-index:3;clip-path:polygon(0 0,50% 49%,100% 0,100% 100%,0 100%);border-radius:2px;background-color:#e6d9bd;background-image:linear-gradient(32deg,transparent 49.8%,#b5a78b35 50%,transparent 50.4%),linear-gradient(-32deg,transparent 49.8%,#b5a78b35 50%,transparent 50.4%),var(--paper-noise);box-shadow:inset 0 -1px 0 #f8efd5}.envelope-flap{position:absolute;left:0;top:0;width:100%;height:62%;z-index:5;clip-path:polygon(0 0,100% 0,50% 91%);background-color:#eaddc2;background-image:linear-gradient(180deg,#ffffff05,#b6a38725),var(--paper-noise);transform-origin:50% 0;transition:transform .85s cubic-bezier(.5,.05,.25,1),opacity .85s;backface-visibility:visible;filter:drop-shadow(0 2px 1px #7b6c5050)}.address{position:absolute;left:8%;bottom:19%;z-index:4;display:block;color:#4d514a;transform:rotate(1deg)}.recipient-address{display:block;font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:clamp(23px,3vw,33px);letter-spacing:-1px}.destination-address{display:block;font-size:6px;letter-spacing:.19em;margin-top:7px}.postmark{position:absolute;right:7%;bottom:18%;z-index:4;width:58px;height:58px;border:1px solid #6e776c65;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transform:rotate(-12deg);color:#6c75696e}.postmark span{font-size:5px;letter-spacing:.15em}.postmark svg{width:15px;height:15px;fill:currentColor}.wax-seal{width:51px;height:51px;border-radius:48% 52% 49% 51% / 52% 48% 53% 47%;position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(7deg);z-index:6;background:radial-gradient(circle at 35% 25%,#a46468,#84474f 40%,#693340 85%);box-shadow:inset 0 1px 2px #d09c9255,inset 0 -2px 3px #4d1f3299,0 3px 5px #64513d66;border:1px solid #9c5c5e;display:flex;align-items:center;justify-content:center;transition:opacity .35s,transform .6s}.wax-seal svg{width:34px;height:34px;fill:#bb8982;stroke:#d0a193;stroke-width:.5;filter:drop-shadow(0 1px 0 #452630)}.wax-seal svg circle{fill:none;stroke:#bb8b7c;stroke-width:.6;opacity:.6}.envelope-return{position:absolute;left:8%;bottom:7%;z-index:4;font-size:5px;letter-spacing:.16em;color:#7d7d69}.letter-peek{position:absolute;left:6%;right:6%;top:8%;height:80%;background:#f5eddb;border:1px solid #ddd1b8;border-radius:2px;z-index:2;padding:25px;transition:transform .9s .12s;box-shadow:0 0 2px #5d533a22;text-align:center;color:#79786a;overflow:hidden}.letter-peek>span:first-child{display:block;font-size:6px;letter-spacing:.24em;margin:10px 0 25px}.peek-line{display:block;width:85%;height:1px;background:#9f9a8444;margin:12px auto}.peek-line.short{width:65%}.envelope.opening{transform:rotate(0)}.envelope.opening .envelope-flap{transform:rotateX(180deg);opacity:.7;z-index:1}.envelope.opening .wax-seal{opacity:0;transform:translate(-50%,40%) rotate(25deg)}.envelope.opening .letter-peek{transform:translateY(-38%)}.envelope-hint{font-family:Georgia,'Times New Roman',serif;font-size:13px;font-style:italic;color:#c8c6b9;text-align:center;position:absolute;top:calc(100% + 40px);width:130%;left:-15%;line-height:1.5;letter-spacing:.01em}.story[data-stage="opened"] .envelope-hint{opacity:0}.envelope-wrap.leaving .envelope-hint{opacity:0;transition:opacity .2s}@keyframes envelope-arrive{from{opacity:0;transform:translate(-50%,-42%) scale(.88)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.journey-controls{text-align:center;position:relative;z-index:4;min-height:133px}.journey-status{font-family:Georgia,'Times New Roman',serif;font-size:15px;font-style:italic;color:#c1c5bd;line-height:1.6;margin-bottom:18px;min-height:24px}.primary-button{display:inline-flex;align-items:center;gap:30px;justify-content:space-between;background:#e6d7ba;color:#26323a;border:1px solid #eee0c3;padding:15px 22px;border-radius:2px;min-height:48px;font-size:11px;letter-spacing:.02em;box-shadow:0 3px 8px #0002;transition:background .25s,transform .25s}.primary-button svg{stroke:currentColor;stroke-width:1;fill:none;stroke-linecap:round;stroke-linejoin:round}.primary-button:hover{background:#f2e5cb;transform:translateY(-2px)}.skip-button{display:block;margin:5px auto 0;padding:10px 14px;min-height:36px;background:none;border:0;color:#93a2ac;font-size:8px;letter-spacing:.035em}.skip-button:hover{color:#d5c9b4}.city-times{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:23px auto 0;max-width:750px;border-top:1px solid #a0b1bb19;padding-top:23px}.city-time{display:flex;align-items:center;gap:11px;white-space:nowrap;min-width:140px}.clock-dot{width:4px;height:4px;border-radius:50%;background:#d5bd92;box-shadow:0 0 10px #d5bd9240;flex:none}.clock-city{font-size:7px;letter-spacing:.2em;color:#a9b4b8}.city-time time{font-family:Georgia,'Times New Roman',serif;font-size:14px;color:#d8d1c2}.time-connection{display:flex;align-items:center;gap:17px;color:#b9aa8e;flex:1;justify-content:center;font-size:17px}.time-connection span{height:1px;width:65px;background:linear-gradient(90deg,transparent,#acb7b42b)}.time-connection span:last-child{transform:rotate(180deg)}.preview-footnote{font-size:8px;color:#87969f;text-align:center;margin-top:24px;line-height:1.7;letter-spacing:.02em}
dialog{color-scheme:light;width:min(660px,calc(100% - 36px));max-height:calc(100svh - 48px);border:0;padding:0;border-radius:2px;color:var(--ink);background:#f3ecdc;box-shadow:0 30px 100px #0009;overflow:auto;scrollbar-width:thin;scrollbar-color:#aea594 #f3ecdc;overscroll-behavior:contain}dialog::backdrop{background:#07121bd4;backdrop-filter:blur(7px)}dialog[open]{animation:unfold-letter .65s both}@keyframes unfold-letter{from{opacity:0;transform:translateY(35px) rotate(-2deg) scale(.96)}to{opacity:1;transform:translateY(0) rotate(0) scale(1)}}.opened-letter{position:relative;padding:55px 65px 34px;background-image:linear-gradient(90deg,transparent 49.8%,#afa38b12 50%,transparent 50.3%),linear-gradient(180deg,transparent 32%,#b9ad9617 32.15%,transparent 32.5%,transparent 65%,#b9ad9617 65.15%,transparent 65.5%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.06' filter='url(%23n)'/%3E%3C/svg%3E");min-height:580px}.close-letter{position:absolute;right:12px;top:10px;width:44px;height:44px;border:0;background:transparent;color:#7d7c70;font-size:16px}.close-letter:focus-visible,.return-to-map:focus-visible{outline-color:#785348}.close-letter:hover{color:#713e45}.letter-route{display:flex;justify-content:center;align-items:center;gap:13px;color:#837d6d;margin-bottom:47px}.letter-route>span:not(.letter-route-line){font-size:7px;letter-spacing:.2em}.letter-route-line{height:1px;width:50px;background:#b4aa933c}.letter-route svg{fill:#a18c6d}.letter-dedication{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:26px;line-height:1.4;letter-spacing:-.02em;color:#635c4e;margin-bottom:26px}h2{font-family:Georgia,'Times New Roman',serif;font-size:29px;font-weight:400;line-height:1.3;letter-spacing:-.025em;margin:0 0 30px;color:#4e5048}.poem-content{font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.9;color:#454b43;text-align:left;overflow-wrap:anywhere}.poem-content p{white-space:pre-wrap;margin-bottom:28px}.poem-content p:last-child{margin-bottom:0}.poem-placeholder{padding:8px 0 20px;text-align:left}.placeholder-star{color:#aa9373;font-size:30px;display:block;margin-bottom:24px}.placeholder-label{font-size:7px;letter-spacing:.24em;color:#8c8371;margin-bottom:17px}.placeholder-copy{font-family:Georgia,'Times New Roman',serif;font-size:20px;line-height:1.8;color:#7a7869}.placeholder-lines{margin:25px 0 27px;display:flex;flex-direction:column;gap:15px;width:80%}.placeholder-lines span{display:block;height:1px;background:#a8997c2b}.placeholder-lines span:nth-child(2){width:88%}.placeholder-lines span:nth-child(3){width:65%}.placeholder-detail{font-size:9px;line-height:1.8;color:#938a79}.signature-area{margin-top:39px}.sender-name{font-family:Georgia,'Times New Roman',serif;font-size:26px;font-style:italic;color:#665c4b}.signature-location{font-size:6px;letter-spacing:.2em;color:#96866d;margin-top:12px}.signature-area img{max-width:170px;max-height:90px;object-fit:contain;object-position:left center}.return-to-map{display:block;margin:40px auto 0;padding:12px 0;border:0;border-top:1px solid #a79a7e26;background:none;min-height:44px;color:#8a7b64;font-size:9px;letter-spacing:.02em}.return-to-map span{margin-left:6px}.return-to-map:hover{color:#6e4648}#poem-audio{width:100%;margin-top:30px}body.letter-open{overflow:hidden}.noscript-message{padding:20px;text-align:center;color:var(--cream);font-size:13px}.still *,.still *:before,.still *:after{animation:none!important;transition:none!important}
@media(min-width:1600px){.story{padding-top:65px}.journey-stage{max-width:960px;margin-top:-5px}.city-times{max-width:820px}.preview-footnote{margin-top:29px}}
@media(max-width:900px){.story{padding:40px 28px 30px}.journey-stage{margin-top:-3px;aspect-ratio:1000/650}.city-times{margin-top:8px}.envelope-wrap{width:44%;top:49%}.envelope-hint{font-size:12px}.address{bottom:17%}.recipient-address{font-size:26px}.destination-address{font-size:5px}.wax-seal{width:45px;height:45px}.wax-seal svg{width:30px;height:30px}.postmark{width:46px;height:46px}.postmark span{font-size:4px}.envelope-return{font-size:4px}}
@media(max-width:600px){.masthead{padding:20px 6% 0;min-height:53px;gap:8px}.home-mark{gap:8px}.home-mark svg{width:23px}.home-mark>span{font-size:6px;letter-spacing:.16em}.small-arrow{margin:0 4px}.header-actions{gap:7px}.preview-badge{font-size:5px;letter-spacing:.1em;padding:6px}.icon-button{width:32px;height:34px}.replay-button{font-size:7px;min-height:34px}.replay-button span{font-size:16px;margin-left:3px}.story{padding:43px 20px 27px}.eyebrow{font-size:6px;letter-spacing:.22em;margin-bottom:20px}h1{font-size:clamp(51px,12.8vw,68px);line-height:1.03;margin-bottom:20px}.phone-break{display:block}.intro-caption{font-size:9px;letter-spacing:.015em}.journey-stage{aspect-ratio:auto;height:300px;max-width:440px;margin:10px auto 0}.australia-map{position:absolute;left:-6%;width:112%;top:0;height:100%}.pin-city{font-size:29px}.pin-detail{font-size:7px;letter-spacing:1px}.ocean-label{display:none}.australia-label{font-size:17px;letter-spacing:5px}.envelope-wrap{width:75%;max-width:300px;top:47%}.envelope-hint{top:calc(100% + 28px);font-size:12px;left:-10%;width:120%}.recipient-address{font-size:29px}.destination-address{font-size:5px}.postmark{width:45px;height:45px}.wax-seal{width:46px;height:46px}.envelope-return{font-size:4px}.address{bottom:18%}.journey-controls{min-height:132px;margin-top:2px}.journey-status{font-size:13px;margin-bottom:17px}.primary-button{font-size:10px;min-height:46px;padding:14px 20px;gap:30px}.skip-button{font-size:7px;min-height:34px;margin-top:7px}.city-times{gap:10px;padding-top:22px;margin-top:18px}.city-time{min-width:0;gap:7px}.clock-city{font-size:6px;letter-spacing:.14em}.city-time time{font-size:12px}.clock-dot{width:3px;height:3px}.time-connection{font-size:15px;gap:9px}.time-connection span{width:15px}.preview-footnote{margin-top:24px;font-size:7px}.story[data-stage="arrived"] .cartography,.story[data-stage="opened"] .cartography{opacity:.2}.story[data-stage="arrived"] .city-pin,.story[data-stage="opened"] .city-pin{opacity:.4}dialog{width:calc(100% - 24px);max-height:calc(100svh - 28px)}.opened-letter{padding:43px 30px 24px;min-height:560px}.letter-route{gap:10px;margin-bottom:39px}.letter-route>span:not(.letter-route-line){font-size:6px}.letter-route-line{width:31px}.letter-dedication{font-size:24px;margin-bottom:23px}h2{font-size:26px;margin-bottom:26px}.placeholder-copy{font-size:18px}.placeholder-detail{font-size:8px}.poem-content{font-size:16px;line-height:1.85}.signature-area{margin-top:29px}.sender-name{font-size:24px}.return-to-map{font-size:8px;margin-top:33px}.placeholder-label{font-size:6px}}
@media(max-width:360px){.masthead{padding-left:5%;padding-right:5%}.home-mark>span{font-size:5.5px}.header-actions{gap:4px}.preview-badge{font-size:4.5px;padding:5px}.story{padding:38px 17px 25px}.journey-stage{height:270px;margin-top:12px}.journey-status{font-size:12px}.envelope-hint{font-size:11px}.wax-seal{width:41px;height:41px}.postmark{width:38px;height:38px}.recipient-address{font-size:25px}.destination-address{font-size:4px}.city-times{gap:5px}.city-time{gap:5px}.clock-city{font-size:5px}.city-time time{font-size:11px}.time-connection{gap:6px}.time-connection span{width:9px}.opened-letter{padding-left:23px;padding-right:23px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}