:root{--gradient-dark:linear-gradient(140deg, #4b3f26 0%, #261d14 32.81%, #140d0b 53.21%, #32281a 79.75%, #4b3f26 100%);--gradient-medium:linear-gradient(141deg, #4b3f26 0%, #86724a 22.66%, #b59b66 43.05%, #c7ab71 53.21%, #a9915f 65.92%, #5e4f31 93.45%, #4b3f26 100%);--gradient-default:linear-gradient(141deg, #9e8858 0%, #bea97a 14%, #dfcb9c 31%, #f3dfb1 45%, #fbe7b9 54%, #ecca82 76%, #c5ab75 100%);--gradient-bright:linear-gradient(141deg, #9e8858 0%, #a59062 3.62%, #d3c39e 27.31%, #efe3c4 44.73%, #faefd2 53.89%, #f9eccb 58.15%, #f6e3b7 64.37%, #f0d597 71.77%, #edcb82 75.98%, #c6ac75 100%);--gold:#88754c;--gold-dark:#655639;--black:#000;--white:linear-gradient(141deg, #9e8858 0%, #a59062 3.62%, #d3c39e 27.31%, #efe3c4 44.73%, #faefd2 53.89%, #f9eccb 58.15%, #f6e3b7 64.37%, #f0d597 71.77%, #edcb82 75.98%, #c6ac75 100%);--dot-length:.5s;--dash-length:calc(var(--dot-length) * 3);--space-length:calc(var(--dot-length) * 1);--transition-time:calc(var(--dot-length) * .25);--black-gap:.5s;--screen-fade-dur:.5s;--title-fade-dur:var(--screen-fade-dur);--dot-timing:linear;--dot-fill:none;--dash-timing:linear;--dash-fill:none;--ratio-dark:.15;--ratio-medium:.2;--ratio-default:.25;--ratio-bright:.3;--ratio-white:.5;--v-screen-start:calc(var(--title-fade-dur) + var(--black-gap));--v-symbol-time-1:calc(var(--v-screen-start) + var(--transition-time));--v-symbol-time-2:calc(var(--v-symbol-time-1) + var(--dot-length) + var(--space-length));--v-symbol-time-3:calc(var(--v-symbol-time-2) + var(--dot-length) + var(--space-length));--v-symbol-time-4:calc(var(--v-symbol-time-3) + var(--dot-length) + var(--space-length));--screen-v-total-time:calc((var(--transition-time) * 2) + (var(--dot-length) * 3) + (var(--space-length) * 3) + var(--dash-length) + (var(--dot-length) * var(--ratio-white)));--g-screen-start:calc(var(--v-screen-start) + var(--screen-v-total-time) + var(--black-gap));--g-symbol-time-1:calc(var(--g-screen-start) + var(--transition-time));--g-symbol-time-2:calc(var(--g-symbol-time-1) + var(--dash-length) + var(--space-length));--g-symbol-time-3:calc(var(--g-symbol-time-2) + var(--dash-length) + var(--space-length));--screen-g-total-time:calc((var(--transition-time) * 2) + (var(--dash-length) * 2) + (var(--space-length) * 2) + var(--dot-length) + (var(--dot-length) * var(--ratio-white)));--r-screen-start:calc(var(--g-screen-start) + var(--screen-g-total-time) + var(--black-gap));--r-symbol-time-1:calc(var(--r-screen-start) + var(--transition-time));--r-symbol-time-2:calc(var(--r-symbol-time-1) + var(--dot-length) + var(--space-length));--r-symbol-time-3:calc(var(--r-symbol-time-2) + var(--dash-length) + var(--space-length));--screen-r-total-time:calc((var(--transition-time) * 2) + (var(--dot-length) * 2) + (var(--space-length) * 2) + var(--dash-length) + (var(--dot-length) * var(--ratio-white)));--end-screen-start:calc(var(--r-screen-start) + var(--screen-r-total-time) + var(--black-gap))}html,body{margin:0;padding:0}body{font-optical-sizing:auto;color:var(--gold);font-family:Inter,sans-serif}h2{text-transform:uppercase;margin-top:0;padding-left:1.5rem;padding-right:1.5rem;font-size:2rem;font-weight:700}.container{background:var(--black);place-items:center;height:100vh;margin:0;display:grid;position:relative;overflow:hidden}.screen{text-align:center;opacity:0;pointer-events:none;visibility:hidden;z-index:1;grid-area:1/1;width:100%;height:100%;display:none;position:absolute}#animation-container{pointer-events:none;z-index:1;grid-area:1/1;width:100%;height:100%;position:absolute;inset:0}#animation-container>.screen{width:100%;height:100%}.screen-title{opacity:1;visibility:visible;pointer-events:auto;background:var(--gradient-default);flex-direction:column;justify-content:center;align-items:center;display:flex}.screen-title:after{content:"";background:var(--black);z-index:10;pointer-events:none;animation:.8s ease-out .2s forwards fadeOut;position:absolute;inset:0}.title-lockup,.morse-lockup{justify-content:center;width:100%;margin:0 0 2rem;display:flex}.title-lockup{margin-bottom:3rem}.title-svg,.morse-svg{width:100%;max-height:80vh;margin:0 auto;padding:0 2rem;display:block}.title-svg{height:clamp(260px,50vh,550px)}.morse-svg{width:auto;max-width:90vw;height:clamp(280px,45vh,400px);margin:0 auto;display:block}.container.is-replay{--title-fade-dur:0s}.container.is-replay .screen-title{animation:none!important;display:none!important}.screen-end{background:var(--gradient-default)}.golden-record-container{justify-content:center;margin:0 auto 1.5rem;display:flex}.golden-record-img{width:auto;max-width:100vw;height:clamp(200px,50vh,320px);display:block}.no-line-break{white-space:nowrap}@media (width>=400px){.no-line-break-md{white-space:nowrap}}.actions{flex-direction:column;display:flex}.actions noscript{justify-content:center;display:flex}.btn{color:var(--gold-dark);border:2px solid var(--gold-dark);cursor:pointer;text-transform:uppercase;-webkit-user-select:none;user-select:none;background:0 0;border-radius:4px;padding:.5rem 1.75rem;font-size:1rem;text-decoration:none;display:block}.btn-compact{padding:.5rem}.btn-wide{padding:.5rem 3.5rem}.btn:hover{color:#fff;background:var(--gold-dark)}label.btn:focus{outline-offset:4px;outline:3px solid #00f}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.btn:focus-visible,.link:focus-visible,#state-play:focus-visible~.screen-title .btn,#state-skip:focus-visible~.skip-container .btn{outline-offset:4px;outline:3px solid #06c}noscript{display:inline-block}#state-play{visibility:hidden}#state-play:checked~.screen-title{animation:fadeOut var(--screen-fade-dur) ease-out forwards;display:flex}#state-play:checked,.container.is-replay #state-play{visibility:hidden!important}#state-play:checked~#animation-container .screen-animation-v{animation:phaseDisplay var(--screen-v-total-time) linear both;animation-delay:var(--v-screen-start);z-index:2;flex-direction:column;justify-content:center;align-items:center;display:flex}#state-play:checked~#animation-container .screen-animation-v .morse-lockup{opacity:0;animation:lockupPulseDot var(--dot-length) var(--dot-timing) none, lockupPulseDot var(--dot-length) var(--dot-timing) none, lockupPulseDot var(--dot-length) var(--dot-timing) none, lockupPulseDash var(--dash-length) var(--dash-timing) none;animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~#animation-container .screen-animation-g{animation:phaseDisplay var(--screen-g-total-time) linear both;animation-delay:var(--g-screen-start);z-index:3;flex-direction:column;justify-content:center;align-items:center;display:flex}#state-play:checked~#animation-container .screen-animation-g .morse-lockup{opacity:0;animation:lockupPulseDash var(--dash-length) var(--dash-timing) none, lockupPulseDash var(--dash-length) var(--dash-timing) none, lockupPulseDot var(--dot-length) var(--dot-timing) none;animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~#animation-container .screen-animation-r{animation:phaseDisplay var(--screen-r-total-time) linear both;animation-delay:var(--r-screen-start);z-index:4;flex-direction:column;justify-content:center;align-items:center;display:flex}#state-play:checked~#animation-container .screen-animation-r .morse-lockup{opacity:0;animation:lockupPulseDot var(--dot-length) var(--dot-timing) none, lockupPulseDash var(--dash-length) var(--dash-timing) none, lockupPulseDot var(--dot-length) var(--dot-timing) none;animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~.screen-end{animation:fadeIn var(--screen-fade-dur) ease-out both;animation-delay:var(--end-screen-start);flex-direction:column;justify-content:center;align-items:center;display:flex}#state-skip:checked{visibility:hidden!important;animation:none!important}.morse-lockup{z-index:2;position:relative}.morse-backdrop{z-index:0;pointer-events:none;background:var(--black);position:absolute;inset:0}.backdrop-layer{opacity:0;position:absolute;inset:0}.layer-dark{background:var(--gradient-dark);z-index:2}.layer-medium{background:var(--gradient-medium);z-index:3}.layer-default{background:var(--gradient-default);z-index:4}.layer-bright{background:var(--gradient-bright);z-index:5}.layer-white{background:var(--white);z-index:6}#state-play:checked~#animation-container .screen-animation-v .layer-dark{animation:dotDark var(--dot-length) var(--dot-timing) var(--dot-fill), dotDark var(--dot-length) var(--dot-timing) var(--dot-fill), dotDark var(--dot-length) var(--dot-timing) var(--dot-fill), dashDark var(--dash-length) var(--dash-timing) var(--dash-fill);animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-dark))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~#animation-container .screen-animation-v .layer-medium{animation:dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill), dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill), dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill), dashMedium var(--dash-length) var(--dash-timing) var(--dash-fill);animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-medium))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-medium))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-medium))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-medium)))}#state-play:checked~#animation-container .screen-animation-v .layer-default{animation:dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill), dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill), dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill), dashDefault var(--dash-length) var(--dash-timing) var(--dash-fill);animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-default))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-default))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-default))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-default)))}#state-play:checked~#animation-container .screen-animation-v .layer-bright{animation:dotBright var(--dot-length) var(--dot-timing) var(--dot-fill), dotBright var(--dot-length) var(--dot-timing) var(--dot-fill), dotBright var(--dot-length) var(--dot-timing) var(--dot-fill), dashBright var(--dash-length) var(--dash-timing) var(--dash-fill);animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-bright))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-bright))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-bright))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-bright)))}#state-play:checked~#animation-container .screen-animation-v .layer-white{animation:dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill), dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill), dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill), dashWhite var(--dash-length) var(--dash-timing) var(--dash-fill);animation-delay:calc(var(--v-symbol-time-1) + (var(--dot-length) * var(--ratio-white))), calc(var(--v-symbol-time-2) + (var(--dot-length) * var(--ratio-white))), calc(var(--v-symbol-time-3) + (var(--dot-length) * var(--ratio-white))), calc(var(--v-symbol-time-4) + (var(--dot-length) * var(--ratio-white)))}#state-play:checked~#animation-container .screen-animation-g .layer-dark{animation:dashDark var(--dash-length) var(--dash-timing) var(--dash-fill), dashDark var(--dash-length) var(--dash-timing) var(--dash-fill), dotDark var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~#animation-container .screen-animation-g .layer-medium{animation:dashMedium var(--dash-length) var(--dash-timing) var(--dash-fill), dashMedium var(--dash-length) var(--dash-timing) var(--dash-fill), dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-medium))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-medium))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-medium)))}#state-play:checked~#animation-container .screen-animation-g .layer-default{animation:dashDefault var(--dash-length) var(--dash-timing) var(--dash-fill), dashDefault var(--dash-length) var(--dash-timing) var(--dash-fill), dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-default))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-default))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-default)))}#state-play:checked~#animation-container .screen-animation-g .layer-bright{animation:dashBright var(--dash-length) var(--dash-timing) var(--dash-fill), dashBright var(--dash-length) var(--dash-timing) var(--dash-fill), dotBright var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-bright))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-bright))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-bright)))}#state-play:checked~#animation-container .screen-animation-g .layer-white{animation:dashWhite var(--dash-length) var(--dash-timing) var(--dash-fill), dashWhite var(--dash-length) var(--dash-timing) var(--dash-fill), dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--g-symbol-time-1) + (var(--dot-length) * var(--ratio-white))), calc(var(--g-symbol-time-2) + (var(--dot-length) * var(--ratio-white))), calc(var(--g-symbol-time-3) + (var(--dot-length) * var(--ratio-white)))}#state-play:checked~#animation-container .screen-animation-r .layer-dark{animation:dotDark var(--dot-length) var(--dot-timing) var(--dot-fill), dashDark var(--dash-length) var(--dash-timing) var(--dash-fill), dotDark var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-dark))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-dark))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-dark)))}#state-play:checked~#animation-container .screen-animation-r .layer-medium{animation:dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill), dashMedium var(--dash-length) var(--dash-timing) var(--dash-fill), dotMedium var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-medium))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-medium))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-medium)))}#state-play:checked~#animation-container .screen-animation-r .layer-default{animation:dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill), dashDefault var(--dash-length) var(--dash-timing) var(--dash-fill), dotDefault var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-default))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-default))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-default)))}#state-play:checked~#animation-container .screen-animation-r .layer-bright{animation:dotBright var(--dot-length) var(--dot-timing) var(--dot-fill), dashBright var(--dash-length) var(--dash-timing) var(--dash-fill), dotBright var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-bright))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-bright))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-bright)))}#state-play:checked~#animation-container .screen-animation-r .layer-white{animation:dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill), dashWhite var(--dash-length) var(--dash-timing) var(--dash-fill), dotWhite var(--dot-length) var(--dot-timing) var(--dot-fill);animation-delay:calc(var(--r-symbol-time-1) + (var(--dot-length) * var(--ratio-white))), calc(var(--r-symbol-time-2) + (var(--dot-length) * var(--ratio-white))), calc(var(--r-symbol-time-3) + (var(--dot-length) * var(--ratio-white)))}@keyframes dotDark{0%{opacity:0}50%{opacity:1}95%{opacity:0}to{opacity:0}}@keyframes dotMedium{0%{opacity:0}10%{opacity:1}90%{opacity:0}to{opacity:0}}@keyframes dotDefault{0%{opacity:0}40%{opacity:1}75%{opacity:0}to{opacity:0}}@keyframes dotBright{0%{opacity:0}35%{opacity:1}60%{opacity:0}to{opacity:0}}@keyframes dotWhite{0%{opacity:0}30%{opacity:1}45%{opacity:0}to{opacity:0}}@keyframes dashDark{0%{opacity:0}16.6%,83.3%{opacity:1}to{opacity:0}}@keyframes dashMedium{0%{opacity:0}16.6%,80%{opacity:1}to{opacity:0}}@keyframes dashDefault{0%{opacity:0}16.6%,75%{opacity:1}to{opacity:0}}@keyframes dashBright{0%{opacity:0}16.6%,70%{opacity:1}to{opacity:0}}@keyframes dashWhite{0%{opacity:0}16.6%,60%{opacity:1}to{opacity:0}}@keyframes lockupPulseDot{0%,10%{opacity:0}35%,65%{opacity:.5}80%,to{opacity:0}}@keyframes lockupPulseDash{0%{opacity:0}20%,90%{opacity:.5}to{opacity:0}}@keyframes phaseDisplay{0%{opacity:0;pointer-events:none;visibility:hidden}5%,92%{opacity:1;pointer-events:none;visibility:visible}to{opacity:0;pointer-events:none;visibility:hidden}}@keyframes fadeIn{0%{opacity:0;pointer-events:none;visibility:hidden}to{opacity:1;pointer-events:auto;visibility:visible}}@keyframes fadeOut{0%{opacity:1;pointer-events:auto;visibility:visible}to{opacity:0;pointer-events:none;visibility:hidden}}.skip-container{z-index:50;opacity:0;pointer-events:none;visibility:hidden;position:absolute;bottom:2rem;right:2rem}#state-skip{visibility:hidden}#state-play:checked~.skip-container{animation:fadeIn var(--screen-fade-dur) ease-out both, fadeOut var(--screen-fade-dur) ease-out forwards;animation-delay:calc(var(--g-screen-start)), var(--end-screen-start)}#state-play:checked~#state-skip{animation:fadeIn var(--screen-fade-dur) ease-out both, fadeOut var(--screen-fade-dur) ease-out forwards;animation-delay:var(--g-screen-start), var(--end-screen-start)}.container.is-replay .skip-container{opacity:1;pointer-events:auto;visibility:visible}.container.is-replay #state-skip{visibility:visible}.container.is-replay #state-play:checked~#state-skip,.container.is-replay #state-play:checked~.skip-container{animation:fadeOut var(--screen-fade-dur) ease-out forwards;animation-delay:var(--end-screen-start)}#state-skip:checked~.screen-title,#state-skip:checked~#animation-container,#state-skip:checked~.skip-container{animation:none!important;display:none!important}#state-skip:checked~.screen-end{z-index:100;flex-direction:column;justify-content:center;align-items:center;opacity:1!important;visibility:visible!important;pointer-events:auto!important;animation:none!important;display:flex!important}#animation-focus{pointer-events:none;outline:none;width:100%;height:100%;display:block;position:absolute;inset:0;overflow:hidden}.motion-fallback{display:none}@media (prefers-reduced-motion:reduce){.motion-fallback{max-width:40rem;margin:-1rem 1rem 1.5rem;font-size:.9rem;line-height:1.5rem;display:block}.screen-title:after,#state-play:checked~.screen-title{animation:none!important;display:none!important}#state-skip{visibility:hidden!important;animation:none!important}#state-play:checked~#animation-container .screen-animation-v,#state-play:checked~#animation-container .screen-animation-g,#state-play:checked~#animation-container .screen-animation-r{animation:none!important;display:none!important}#state-play:checked~.screen-end{z-index:100;flex-direction:column;justify-content:center;align-items:center;opacity:1!important;pointer-events:auto!important;visibility:visible!important;animation:none!important;display:flex!important}}