@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,300italic,400italic");
@import url("fontawesome-all.min.css");

/* =========================================
   Reset & Basics
========================================= */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
    margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; -webkit-text-size-adjust: none; background-color: rgb(255, 255, 255); background-repeat: repeat, no-repeat; background-size: auto, 100% 100%; background-attachment: fixed; overflow-y: scroll; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; width: 100%; }
mark { background-color: transparent; color: inherit; }
input::-moz-focus-inner { border: 0; padding: 0; }
input, select, textarea { appearance: none; }
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

body.is-preload *, body.is-preload *:before, body.is-preload *:after { animation: none !important; transition: none !important; }

/* =========================================
   Typography
========================================= */
body, input, textarea, select { font-family: "Helvetica Neue", sans-serif; font-weight: 400; color: #000f24; font-size: 20pt; line-height: 1.75em; }
strong, h1, h2, h3, h4, h5, h6 { font-weight: 400; color: #000f24; }
b { font-weight: 700; }
h1 { font-size: 2.4em; letter-spacing: -0.015em; }
h2 { font-size: 24pt; letter-spacing: -0.015em; }
h3, h4, h5, h6 { font-size: 1.25em; letter-spacing: -0.015em; }
blockquote { border-left: solid 0.5em #ddd; padding: 1em 0 1em 2em; font-style: italic; }
em, i { font-style: italic; }
hr { border: 0; border-top: solid 2px #000000; opacity: 0.05; }
sub { position: relative; top: 0.5em; font-size: 0.8em; }
sup { position: relative; top: -0.5em; font-size: 0.8em; }
br.clear { clear: both; }
p, ul, ol, dl, table, blockquote, form { margin-bottom: 2em; margin-top: 1.5em; line-height: 22pt; font-size: 12pt; }
a { color: #002b66; text-decoration: none; transition: color .25s ease-in-out, background-color .25s ease-in-out; }
a:hover { color: #5db3e6; }

@media screen and (max-width: 1680px) { body, input, textarea, select { font-size: 15pt; } }
@media screen and (max-width: 1280px) { body, input, textarea, select { font-size: 14pt; } }
@media screen and (max-width: 736px) { 
    body, input, textarea, select { font-size: 12pt; }
    h1 { font-size: 1.75em; } h2 { font-size: 1.375em; } h3, h4, h5, h6 { font-size: 1em; }
}
@media screen and (max-width: 600px) { 
    h1 { font-size: 1.5em; } h2 { font-size: 1.2em; } 
    p, ul, ol { font-size: 8pt; line-height: 16pt; }
}
@media screen and (max-width: 360px) { body, input, textarea, select { font-size: 11pt; } }

/* =========================================
   Grid System
========================================= */
.row { display: flex; flex-wrap: wrap; box-sizing: border-box; align-items: stretch; margin: -1.25em 0 0 -1.25em; }
.row > * { box-sizing: border-box; padding: 1.25em 0 0 1.25em; }
.row.gtr-uniform > * > :last-child { margin-bottom: 0; }
.row.aln-left { justify-content: flex-start; }
.row.aln-center { justify-content: center; }
.row.aln-right { justify-content: flex-end; }
.row.aln-top { align-items: flex-start; }
.row.aln-middle { align-items: center; }
.row.aln-bottom { align-items: flex-end; }
.row > .imp { order: -1; }

.row > .col-1 { width: 8.33333%; } .row > .off-1 { margin-left: 8.33333%; }
.row > .col-2 { width: 16.66667%; } .row > .off-2 { margin-left: 16.66667%; }
.row > .col-3 { width: 25%; } .row > .off-3 { margin-left: 25%; }
.row > .col-4 { width: 33.33333%; } .row > .off-4 { margin-left: 33.33333%; }
.row > .col-5 { width: 41.66667%; } .row > .off-5 { margin-left: 41.66667%; }
.row > .col-6 { width: 50%; } .row > .off-6 { margin-left: 50%; }
.row > .col-7 { width: 58.33333%; } .row > .off-7 { margin-left: 58.33333%; }
.row > .col-8 { width: 66.66667%; } .row > .off-8 { margin-left: 66.66667%; }
.row > .col-9 { width: 75%; } .row > .off-9 { margin-left: 75%; }
.row > .col-10 { width: 83.33333%; } .row > .off-10 { margin-left: 83.33333%; }
.row > .col-11 { width: 91.66667%; } .row > .off-11 { margin-left: 91.66667%; }
.row > .col-12 { width: 100%; } .row > .off-12 { margin-left: 100%; }

.row.gtr-0 { margin: 0; } .row.gtr-0 > * { padding: 0; }
.row.gtr-25 { margin: -0.3125em 0 0 -0.3125em; } .row.gtr-25 > * { padding: 0.3125em 0 0 0.3125em; }
.row.gtr-50 { margin: -0.625em 0 0 -0.625em; } .row.gtr-50 > * { padding: 0.625em 0 0 0.625em; }
.row.gtr-150 { margin: -1.875em 0 0 -1.875em; } .row.gtr-150 > * { padding: 1.875em 0 0 1.875em; }
.row.gtr-200 { margin: -2.5em 0 0 -2.5em; } .row.gtr-200 > * { padding: 2.5em 0 0 2.5em; }

/* Grid Media Queries */
@media screen and (max-width: 1680px) {
    .row > .imp-xlarge { order: -1; }
    .row > .col-1-xlarge { width: 8.33333%; } .row > .off-1-xlarge { margin-left: 8.33333%; }
    .row > .col-2-xlarge { width: 16.66667%; } .row > .off-2-xlarge { margin-left: 16.66667%; }
    .row > .col-3-xlarge { width: 25%; } .row > .off-3-xlarge { margin-left: 25%; }
    .row > .col-4-xlarge { width: 33.33333%; } .row > .off-4-xlarge { margin-left: 33.33333%; }
    .row > .col-5-xlarge { width: 41.66667%; } .row > .off-5-xlarge { margin-left: 41.66667%; }
    .row > .col-6-xlarge { width: 50%; } .row > .off-6-xlarge { margin-left: 50%; }
    .row > .col-7-xlarge { width: 58.33333%; } .row > .off-7-xlarge { margin-left: 58.33333%; }
    .row > .col-8-xlarge { width: 66.66667%; } .row > .off-8-xlarge { margin-left: 66.66667%; }
    .row > .col-9-xlarge { width: 75%; } .row > .off-9-xlarge { margin-left: 75%; }
    .row > .col-10-xlarge { width: 83.33333%; } .row > .off-10-xlarge { margin-left: 83.33333%; }
    .row > .col-11-xlarge { width: 91.66667%; } .row > .off-11-xlarge { margin-left: 91.66667%; }
    .row > .col-12-xlarge { width: 100%; } .row > .off-12-xlarge { margin-left: 100%; }
}
@media screen and (max-width: 1280px) {
    .row > .imp-large { order: -1; }
    .row > .col-1-large { width: 8.33333%; } .row > .off-1-large { margin-left: 8.33333%; }
    .row > .col-2-large { width: 16.66667%; } .row > .off-2-large { margin-left: 16.66667%; }
    .row > .col-3-large { width: 25%; } .row > .off-3-large { margin-left: 25%; }
    .row > .col-4-large { width: 33.33333%; } .row > .off-4-large { margin-left: 33.33333%; }
    .row > .col-5-large { width: 41.66667%; } .row > .off-5-large { margin-left: 41.66667%; }
    .row > .col-6-large { width: 50%; } .row > .off-6-large { margin-left: 50%; }
    .row > .col-7-large { width: 58.33333%; } .row > .off-7-large { margin-left: 58.33333%; }
    .row > .col-8-large { width: 66.66667%; } .row > .off-8-large { margin-left: 66.66667%; }
    .row > .col-9-large { width: 75%; } .row > .off-9-large { margin-left: 75%; }
    .row > .col-10-large { width: 83.33333%; } .row > .off-10-large { margin-left: 83.33333%; }
    .row > .col-11-large { width: 91.66667%; } .row > .off-11-large { margin-left: 91.66667%; }
    .row > .col-12-large { width: 100%; } .row > .off-12-large { margin-left: 100%; }
}
@media screen and (max-width: 980px) {
    .row > .imp-medium { order: -1; }
    .row > .col-1-medium { width: 8.33333%; } .row > .off-1-medium { margin-left: 8.33333%; }
    .row > .col-2-medium { width: 16.66667%; } .row > .off-2-medium { margin-left: 16.66667%; }
    .row > .col-3-medium { width: 25%; } .row > .off-3-medium { margin-left: 25%; }
    .row > .col-4-medium { width: 33.33333%; } .row > .off-4-medium { margin-left: 33.33333%; }
    .row > .col-5-medium { width: 41.66667%; } .row > .off-5-medium { margin-left: 41.66667%; }
    .row > .col-6-medium { width: 50%; } .row > .off-6-medium { margin-left: 50%; }
    .row > .col-7-medium { width: 58.33333%; } .row > .off-7-medium { margin-left: 58.33333%; }
    .row > .col-8-medium { width: 66.66667%; } .row > .off-8-medium { margin-left: 66.66667%; }
    .row > .col-9-medium { width: 75%; } .row > .off-9-medium { margin-left: 75%; }
    .row > .col-10-medium { width: 83.33333%; } .row > .off-10-medium { margin-left: 83.33333%; }
    .row > .col-11-medium { width: 91.66667%; } .row > .off-11-medium { margin-left: 91.66667%; }
    .row > .col-12-medium { width: 100%; } .row > .off-12-medium { margin-left: 100%; }
}
@media screen and (max-width: 736px) {
    .row > .imp-small { order: -1; }
    .row > .col-1-small { width: 8.33333%; } .row > .off-1-small { margin-left: 8.33333%; }
    .row > .col-2-small { width: 16.66667%; } .row > .off-2-small { margin-left: 16.66667%; }
    .row > .col-3-small { width: 25%; } .row > .off-3-small { margin-left: 25%; }
    .row > .col-4-small { width: 33.33333%; } .row > .off-4-small { margin-left: 33.33333%; }
    .row > .col-5-small { width: 41.66667%; } .row > .off-5-small { margin-left: 41.66667%; }
    .row > .col-6-small { width: 50%; } .row > .off-6-small { margin-left: 50%; }
    .row > .col-7-small { width: 58.33333%; } .row > .off-7-small { margin-left: 58.33333%; }
    .row > .col-8-small { width: 66.66667%; } .row > .off-8-small { margin-left: 66.66667%; }
    .row > .col-9-small { width: 75%; } .row > .off-9-small { margin-left: 75%; }
    .row > .col-10-small { width: 83.33333%; } .row > .off-10-small { margin-left: 83.33333%; }
    .row > .col-11-small { width: 91.66667%; } .row > .off-11-small { margin-left: 91.66667%; }
    .row > .col-12-small { width: 100%; } .row > .off-12-small { margin-left: 100%; }
}

/* =========================================
   Tables & Forms
========================================= */
table.default tbody tr { border-bottom: solid 1px #f4f4f4; }
table.default td, table.default th { padding: 0.5em 1em; text-align: left; }
table.default thead { border-bottom: solid 2px #f4f4f4; }

form label { display: block; font-weight: 400; color: #363636; margin: 0 0 1em 0; }
form input[type="text"], form input[type="email"], form input[type="password"], form select, form textarea {
    border: 0; background: #f4f4f4; padding: 0.75em; width: 100%;
    transition: background-color .25s ease-in-out; line-height: 1.35em;
}
form input[type="text"]:focus, form input[type="email"]:focus, form input[type="password"]:focus, form select:focus, form textarea:focus {
    background: #f8f8f8;
}
form ::placeholder { color: #999; }

/* Buttons */
input[type="button"], input[type="submit"], input[type="reset"], button, .button {
    transition: background-color .25s ease-in-out; display: inline-block; background-color: #222;
    color: #fff; border: 0; cursor: pointer; outline: 0; padding: 0.7em 1.5em;
}
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover, button:hover, .button:hover { background-color: #333; }
input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active, button:active, .button:active { background-color: #444; }

.button.alt { background-color: #777; }
.button.alt:hover { background-color: #888; }
.button.alt:active { background-color: #999; }

.button.small { font-size: 0.75em; }
.button.large { font-size: 1.25em; padding: 0.5em 1.25em; }
.button.xlarge { font-size: 1.5em; padding: 0.5em 1.25em; }

@media screen and (max-width: 736px) { .button { width: 100%; } }

/* =========================================
   Lists & Icons
========================================= */
ul { list-style: disc; padding-left: 1em; }
ul li { padding-left: 0.5em; }
ol { list-style: decimal; padding-left: 1.25em; }
ol li { padding-left: 0.25em; }

ul.actions { list-style: none; padding-left: 0; }
ul.actions li { display: inline-block; padding-left: 0; margin: 0 0 0 0.5em; }
ul.actions li:first-child { margin-left: 0; }
@media screen and (max-width: 736px) {
    ul.actions li { display: block; margin: 0.75em 0 0 0; }
    ul.actions li:first-child { margin-top: 0; }
}

.icon { text-decoration: none; position: relative; }
.icon:before {
    -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block;
    font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; text-transform: none !important;
    font-family: 'Font Awesome 5 Free'; font-weight: 400; line-height: inherit;
}
.icon.solid:before { font-weight: 900; }
.icon.brands:before { font-family: 'Font Awesome 5 Brands'; }
.icon > .label { display: none; }

/* =========================================
   Images
========================================= */
.image { display: inline-block; }
.image img, .image.fit, .image.featured { display: block; width: 100%; }
.image.featured { margin: 0 0 2em 0; }
.image.left { float: left; }
.image.centered { display: block; margin: 0 0 2em 0; }
.image.centered img { margin: 0 auto; width: auto; }
.center-image { display: block; margin: 0 auto 1em auto; }

.caption-im { text-align: left; color: #00204d; opacity: 1; margin-bottom: 1em; line-height: 15pt; font-size: 10pt; }
figcaption.caption-im { text-align: center; }

@media screen and (max-width: 960px) { 
	.image.left { float: none; width: 100%; } 
	.caption-im { line-height: 14pt; font-size: 8pt; } 
}

.unselectable-image {
    user-select: none; -webkit-user-drag: none; pointer-events: none;
}

/* =========================================
   Layout & Panels
========================================= */
section, article { margin-bottom: 3em; }
section > :last-child, section:last-child, article > :last-child, article:last-child { margin-bottom: 0; }
header { margin: 0 0 1.5em 0; text-align: center; }
header > p { margin: 0.5em 0 0 0; color: #000f24; }

@media screen and (max-width: 736px) { header { margin: 0 0 1em 0; } }

#wrapper { width: 50em; margin: 0 auto; min-height: 100vh; max-width: 100%; padding: 4em 0; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: opacity 1s ease-in-out; }
body.is-preload #wrapper { opacity: 0; }

@media screen and (max-width: 1280px) { #wrapper { padding: 3em 0; } }
@media screen and (max-width: 980px) { #wrapper { padding: 1.5em 4em; } }
@media screen and (max-width: 736px) { #wrapper { padding: 1em 1em; } }

#main { position: relative; overflow: hidden; width: 100%; border-radius: 1em; transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out; }
#main > .panel { transition: opacity 0.25s ease-in-out; margin-bottom: 0; position: relative; padding: 2.5em 4em; width: 100%; }
#main > .panel.inactive { opacity: 0; }

@media screen and (max-width: 960px) { #main > .panel { padding: 2em 2em 1.5em 2em; } }
@media screen and (max-width: 736px) { #main > .panel { padding: 2em 1.5em 1.5em 1.5em; } }

/* Intro Panel */
#main > .panel.intro { padding: 0; height: auto; display: flex; flex-direction: row; align-items: center; }
#main > .panel.intro .pic { position: relative; flex-grow: 0; flex-shrink: 0; width: 17em; height: 100%; }
#main > .panel.intro .pic:before { content: ''; position: absolute; top: 0; left: 0; background: url("images/overlay.png"); width: 100%; height: 100%; z-index: 1; }
#main > .panel.intro .pic img { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
#main > .panel.intro .pic .arrow { display: block; position: absolute; right: 0; top: 50%; margin-top: -1.375em; width: 2.75em; height: 2.75em; background: rgba(0, 0, 0, 0.75); color: #fff; text-align: center; line-height: 2.75em; font-size: 1.5em; z-index: 1; transition: width .15s ease-in-out, padding-right .15s ease-in-out; }
#main > .panel.intro .pic .arrow:before { position: relative; top: 0.125em; }
#main > .panel.intro .pic .arrow span { display: block; text-indent: -9999px; }
#main > .panel.intro .pic:hover .arrow { width: 3em; padding-right: 0.25em; }

#main > .panel.intro header { flex-grow: 1; flex-shrink: 1; padding: 3.5em 2.5em; margin-bottom: 0; width: 100%; }
#main > .panel.intro header h1 { line-height: 1.25em; font-size: 2.4em; margin-bottom: 0;}
#main > .panel.intro header h2 { line-height: 1.25em; font-size: 1.25em; margin-bottom: 0.2em; }
#main > .panel.intro header p { letter-spacing: -0.015em; font-size: 0.8em; margin: 0.25em 0 0 0; }

@media screen and (max-width: 960px) {
    #main > .panel.intro { flex-direction: column; }
    #main > .panel.intro .pic { height: 25em; width: 100%; }
    #main > .panel.intro header { padding: 2em; text-align: center; }
}
@media screen and (max-width: 736px) {
    #main > .panel.intro .pic { height: 20em; }
    #main > .panel.intro header { padding: 2.75em 2em 2.5em 2em; }
    #main > .panel.intro header h1 { font-size: 2em; }
    #main > .panel.intro header p { font-size: 0.75em; line-height: 1.5em; }
}
/* @media screen and (max-width: 576px) {
    #main > .panel.intro header h1 { font-size: 1.75em; }
    #main > .panel.intro header h2 { font-size: 1em; }
}
@media screen and (max-width: 320px) {
    #main > .panel.intro header { padding: 2.75em 1em 2.5em 1em; }
    #main > .panel.intro header h1 { font-size: 1.25em; }
    #main > .panel.intro header h2 { font-size: 0.75em; }
} */

/* Contact Panel */
#main > .panel.contact p { margin-bottom: -10pt; }
#main > .panel.contact ul { list-style-type: none; }
#main > .panel.contact li i { margin-right: 10px; }

/* Container Columns */
.container { display: flex; justify-content: center; align-items: center; }
.left-col{ width: 33%; } .right-col2 { width: 33%; }
.right-col{ width: 63%; margin-left: 4%; }
.left-col2 { width: 63%; margin-right: 4%; }
.left-col, .right-col, .left-col2, .right-col2 { float: left; }

@media (max-width: 1080px) {
  .container { flex-direction: column; }
  .left-col, .right-col, .left-col2, .right-col2 { width: 100%; margin-left: 0; }
}

/* =========================================
   Navigation & Footer
========================================= */
#top-bar { display: flex; align-items: center; height: 2.5em; width: 100%; position: relative; margin-bottom: 0em; }
#nav { display: flex; justify-content: center; width: 100%; gap: 1em; flex: 0 0 auto; margin-right: 3em; }
#nav a { position: relative; font-size: 0.7em; color: #002b66; text-decoration: none; line-height: 1; transition: color 0.25s, background-color 0.25s; }
#nav a:hover, #nav a.active { color: #fff; background-color: #5db3e6; }
#nav a span { position: absolute; bottom: 130%; left: 50%; transform: translateX(-50%); background: #222; color: #fff; font-size: 0.7em; padding: 0.4em 0.75em; border-radius: 0.2em; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.25s ease-in-out; }
#nav a span::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border-width: 0.4em 0.4em 0 0.4em; border-style: solid; border-color: #222 transparent transparent transparent; }
#nav a:hover span { opacity: 1; }

@media screen and (max-width: 980px) { #nav { justify-content: center; margin-right: 0; } #nav a span, #top-bar::after { display: none; } }
@media screen and (max-width: 480px) { #nav a { font-size: 0.6em; } }

#footer { color: #000f24; text-align: center; padding: 2em 0 0 0; font-size: 0; }
#footer a { color: #000f24; transition: color .25s ease-in-out; }
#footer .copyright { list-style: none; padding-left: 0; }
#footer .copyright li { display: inline-block; padding-left: 1em; margin-left: 1em; border-left: solid 1px rgba(0, 0, 0, 0.25); line-height: 1; font-size: 8pt;}
#footer .copyright li:first-child { padding-left: 0; margin-left: 0; border-left: 0; }
#footer .icon { margin-inline: 0.2em; font-size: 1.2em; }
@media screen and (max-width: 736px) { #footer .copyright li { padding-left: 0.5em; margin-left: 0.5em; font-size: 5pt;} }

/* =========================================
   Details / Summary 
========================================= */
details > p { margin-left: 2%; margin-top: 0em; margin-bottom: 0em; }
details > ol { margin-top: 1em; margin-bottom: 0em; }
summary::-webkit-details-marker { display: none; }
summary::marker { display: none; }
summary { cursor: pointer; font-size: 1em; display: flex; align-items: center; }

@media screen and (max-width: 480px) { summary { font-size: 1em; line-height: 1.5em; } }

.details.arrow { display: block; width: 0; height: 0; margin-right: 1em; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 10px solid #5db3e6; transition: transform 0.3s ease; }
details[open] .details.arrow { transform: rotate(90deg); }

/* =========================================
   Vertical Timeline
========================================= */
.timeline {
    display: flex;
    flex-direction: column;
    gap: 1em; /* Space between each timeline entry */
    margin: 2em 0;
}

.timeline-item {
    display: flex;
    align-items: stretch;
    gap: 1em; /* Space between the date, the bar, and the text */
}

.timeline-date {
    /* The magic trick for bottom-to-top vertical text */
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    
    text-align: center;
    font-size: 12pt;
    color: #001533;
    margin: -1em;
    white-space: nowrap;
}

.timeline-bar {
    width: 20px;
    flex-shrink: 0; /* Prevents the bar from getting squished on small screens */
}

/* Timeline specific colors */
.timeline-bar.color-red { background-color: #5db3e6 }
.timeline-bar.color-orange { background-color: #002b66; }
.timeline-bar.color-blue { background-color: #000f24; }
.timeline-bar.color-purple { background-color: #7b1fa2; }

.timeline-content {
    padding-bottom: 0.5em; 
}

.timeline-content h3 {
    margin: 0 0 0.25em 0;
    font-size: 16pt;
    font-weight: 600;
    line-height: 28pt;
	color: #000f24;
}

.timeline-content p {
    margin: 0; /* Overrides the default Astral 2em paragraph margin */
    color: #000f24;
}

/* Mobile Adjustments */
@media screen and (max-width: 736px) {
    .timeline-item {
        gap: 0.75em;
    }
    .timeline-date {
        font-size: 0.7em;
    }
    .timeline-bar {
        width: 5px;
    }
}

/* =========================================
   Animations (GW Wave & Binary Mass)
========================================= */
.signal-container { width: 100%; max-width: 400px; margin: -1em auto; }
.gw-wave path { fill: none; stroke: #5db4e6; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1500; stroke-dashoffset: 1500; animation: drawChirp 10s infinite linear; }
@keyframes drawChirp { 0% { stroke-dashoffset: 1500; } 40%, 60% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1500; } }

.binary-container { position: relative; width: 100%; max-width: 200px; aspect-ratio: 1 / 1; margin: 0 auto; border-radius: 50%; overflow: hidden; }
.mass { position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; background: #5db4e6; border-radius: 50%; margin-top: -20px; margin-left: -20px; animation-duration: 10s; animation-timing-function: cubic-bezier(0, 0, 0.9, 0.2); animation-iteration-count: infinite; }
.body-a { animation-name: inspiralA; }
.body-b { animation-name: inspiralB; }

@keyframes inspiralA { 0% { transform: rotate(0deg) translateX(50px); opacity: 0; } 75% { transform: rotate(1800deg) translateX(0px); opacity: 1; } 76%, 100% { transform: rotate(1800deg) translateX(0px); opacity: 0; } }
@keyframes inspiralB { 0% { transform: rotate(180deg) translateX(50px); opacity: 0; } 75% { transform: rotate(1980deg) translateX(0px); opacity: 1; } 100% { transform: rotate(1980deg) translateX(0px); opacity: 0; } }

.merger-flash { position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; border-radius: 50%; transform: translate(-50%, -50%); opacity: 0; animation: flash 10s ease-out infinite; }
@keyframes flash {
  0%, 74% { opacity: 0; transform: translate(-50%, -50%) scale(1); box-shadow: 0 0 0 0 rgba(93, 180, 230, 0); }
  75% { opacity: 1; transform: translate(-50%, -50%) scale(1.5); box-shadow: 0 0 40px 20px rgba(93, 180, 230, 0.8); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(2); box-shadow: 0 0 80px 40px rgba(93, 180, 230, 0); }
}