:root {
  --hue-primary: #8245e5;
  --hue-primary-dark: #6324c4;
  --hue-primary-light: #f3edff;
  --hue-accent: #00c853;
  --hue-surface: #ffffff;
  --hue-bg-alt: #f8fafc;
  --hue-text: #0f172a;
  --hue-muted: #64748b;
  --hue-border: rgba(130, 69, 229, 0.15);
  --radius-main: 12px;
  --radius-inner: 8px;
  --shadow-subtle: 0 10px 30px -10px rgba(130, 69, 229, 0.12);
  --shadow-hover: 0 20px 40px -12px rgba(130, 69, 229, 0.22);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background-color: #fafbfe;
  color: var(--hue-text);
  line-height: 1.7;
  word-break: break-word;
  overflow-wrap: break-word;
}

.casing {
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.topline {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--hue-border);
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
}

.nexus {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  width: 100%;
}

.relay {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}

.emblem {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.emblem img {
  height: 40px;
  width: auto;
  display: block;
}

.roster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.strand {
  color: var(--hue-text);
  text-decoration: none;
  font-weight: 500;
  padding: 8px 16px;
  border-radius: var(--radius-inner);
  transition: all 0.25s ease;
  font-size: 15px;
}

.strand:hover,
.strand.active {
  color: var(--hue-primary);
  background-color: var(--hue-primary-light);
}

.dispatch {
  flex: 1 0 auto;
  width: 100%;
}

.airwave {
  padding: 64px 0 80px 0;
  background: linear-gradient(180deg, rgba(243, 237, 255, 0.6) 0%, rgba(250, 251, 254, 1) 100%);
  border-bottom: 1px solid var(--hue-border);
}

.headline-h1 {
  font-size: 36px;
  font-weight: 800;
  line-height: 1.25;
  color: var(--hue-text);
  letter-spacing: -0.5px;
  margin-bottom: 16px;
  white-space: normal;
}

.morse {
  font-size: 16px;
  color: var(--hue-muted);
  line-height: 1.7;
  max-width: 800px;
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 40px;
}

.telegram {
  flex: 1 1 300px;
  min-width: 0;
  background: var(--hue-surface);
  border: 1px solid var(--hue-border);
  border-radius: var(--radius-main);
  padding: 28px;
  box-shadow: var(--shadow-subtle);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.telegram:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
}

.dot {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-inner);
  background: var(--hue-primary-light);
  color: var(--hue-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

.dot svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.headline-h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--hue-text);
}

.strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: var(--hue-muted);
  margin-top: 16px;
  margin-bottom: 24px;
  padding-top: 12px;
  border-top: 1px dashed rgba(130, 69, 229, 0.15);
}

.keyer {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: linear-gradient(135deg, var(--hue-primary), var(--hue-primary-dark));
  color: #ffffff;
  font-weight: 600;
  padding: 13px 24px;
  border-radius: var(--radius-inner);
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(130, 69, 229, 0.35);
  transition: all 0.25s ease;
  font-size: 15px;
}

.keyer:hover {
  opacity: 0.92;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(130, 69, 229, 0.45);
}

.pulse {
  background: transparent;
  color: var(--hue-primary);
  border: 1.5px solid var(--hue-primary);
  box-shadow: none;
}

.pulse:hover {
  background: var(--hue-primary-light);
  box-shadow: none;
}

.station {
  padding: 80px 0;
}

.headline-h2 {
  font-size: 28px;
  font-weight: 700;
  color: var(--hue-text);
  margin-bottom: 16px;
  letter-spacing: -0.3px;
}

.cipher {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 24px;
  margin-top: 36px;
}

.slip {
  background: var(--hue-surface);
  border: 1px solid var(--hue-border);
  border-radius: var(--radius-main);
  padding: 24px;
  box-shadow: var(--shadow-subtle);
}

.tap {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  background: var(--hue-primary-light);
  color: var(--hue-primary);
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 12px;
}

.conduit {
  padding: 80px 0;
  background: var(--hue-bg-alt);
  border-top: 1px solid var(--hue-border);
  border-bottom: 1px solid var(--hue-border);
}

.plate {
  width: 100%;
  max-width: 960px;
  height: auto;
  border-radius: var(--radius-main);
  box-shadow: var(--shadow-subtle);
  border: 1px solid var(--hue-border);
  margin-top: 32px;
  display: block;
}

.circuit {
  padding: 80px 0;
}

.node {
  background: var(--hue-surface);
  border: 1px solid var(--hue-border);
  border-radius: var(--radius-main);
  padding: 24px;
  margin-top: 24px;
}

.node table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 16px;
  font-size: 14px;
}

.node th,
.node td {
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid #f1f5f9;
}

.node th {
  background: var(--hue-bg-alt);
  color: var(--hue-text);
  font-weight: 600;
}

.terminus {
  background: #0f172a;
  color: #94a3b8;
  padding: 60px 0 36px 0;
  margin-top: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.logbook {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  justify-content: space-between;
  margin-bottom: 40px;
}

.depot {
  flex: 1 1 250px;
  min-width: 0;
}

.depot h4 {
  color: #ffffff;
  font-size: 16px;
  margin-bottom: 16px;
}

.depot a {
  color: #94a3b8;
  text-decoration: none;
  display: block;
  margin-bottom: 10px;
  font-size: 14px;
  transition: color 0.25s ease;
}

.depot a:hover {
  color: #ffffff;
}

.depot p {
  font-size: 14px;
  line-height: 1.6;
}

@media (max-width: 768px) {
  .headline-h1 {
    font-size: 26px;
  }
  .headline-h2 {
    font-size: 22px;
  }
  .relay {
    height: auto;
    padding: 16px 0;
    flex-direction: column;
    gap: 16px;
  }
  .roster {
    justify-content: center;
    width: 100%;
  }
  .cluster {
    flex-direction: column;
  }
  .cipher {
    grid-template-columns: 1fr;
  }
}

.beacon-topline {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    line-height: 1.7;
    word-break: break-word;
    color: var(--hue-slate);
}
.beacon-topline,
.beacon-topline *,
.beacon-topline *::before,
.beacon-topline *::after {
    box-sizing: border-box;
}

.beacon-topline [role="navigation"],
.beacon-topline div,
.beacon-topline section,
.beacon-topline article,
.beacon-topline aside,
.beacon-topline p,
.beacon-topline h1,
.beacon-topline h2,
.beacon-topline h3,
.beacon-topline h4,
.beacon-topline h5,
.beacon-topline h6,
.beacon-topline a {
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    line-height: inherit;
}

.beacon-topline p,
.beacon-topline h1,
.beacon-topline h2,
.beacon-topline h3,
.beacon-topline h4,
.beacon-topline h5,
.beacon-topline h6 {
    text-decoration: none;
}

.beacon-topline img {
    display: block;
    max-width: 100%;
    height: auto;
    border: 0;
}

.beacon-topline {
    box-shadow: none;
    filter: none;
    text-shadow: none;
    background-image: none;
    border-top: none;
    border-left: none;
    border-right: none;
    outline: none;
}

.beacon-topline a.beacon-strand {
    --aisite-shell-nav-padding: 9px 16px;
    --aisite-shell-nav-margin: 0;
    --aisite-shell-nav-line-height: normal;
    --aisite-shell-nav-display: inline;
    --aisite-shell-nav-height: auto;
    --aisite-shell-nav-min-height: auto;
}

.beacon-topline a.beacon-strand,
.beacon-topline a.beacon-strand:hover,
.beacon-topline a.beacon-strand:focus,
.beacon-topline a.beacon-strand:active,
.beacon-topline a.beacon-strand.active,
.beacon-topline a.beacon-strand[aria-current="page"] {
    background: transparent;
    border: none;
    border-bottom: none;
    box-shadow: none;
    outline: none;
    text-decoration: none;
    padding: var(--aisite-shell-nav-padding, 0);
    margin: var(--aisite-shell-nav-margin, 0);
    line-height: var(--aisite-shell-nav-line-height, normal);
    display: var(--aisite-shell-nav-display, inline);
    height: var(--aisite-shell-nav-height, auto);
    min-height: var(--aisite-shell-nav-min-height, auto);
}

.beacon-topline .beacon-nexus{
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 24px;
        }

.beacon-topline{
            position: sticky;
            top: 0;
            z-index: 1000;
            background: rgba(255, 255, 255, 0.92);
            backdrop-filter: blur(12px);
            border-bottom: 1px solid #e2e8f0;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
        }

.beacon-topline .beacon-relay{
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            height: 76px;
        }

.beacon-topline .beacon-emblem{
            display: flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
        }

.beacon-topline .beacon-emblem img{
            height: 40px;
            width: auto;
            display: block;
        }

.beacon-topline .beacon-roster{
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 8px;
        }

.beacon-topline .beacon-strand{
            text-decoration: none;
            color: #475569;
            font-weight: 500;
            font-size: 15px;
            padding: 9px 16px;
            border-radius: 8px;
            transition: all 0.25s ease;
        }

.beacon-topline .beacon-strand:hover{
            color: #8245e5;
            background: #f3edff;
        }

.beacon-topline .beacon-strand.active{
            color: #8245e5;
            background: #f3edff;
            font-weight: 600;
        }

@media (max-width: 768px){.beacon-topline .beacon-relay{
                height: auto;
                padding: 16px 0;
                flex-direction: column;
                gap: 16px;
            }

.beacon-topline .beacon-roster{
                width: 100%;
                justify-content: center;
            }}

.beacon-topline {
    background: rgb(255, 255, 255);
    background-image: none;
}

.terminus-terminus {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    line-height: 1.7;
    word-break: break-word;
    color: var(--hue-slate);
}
.terminus-terminus,
.terminus-terminus *,
.terminus-terminus *::before,
.terminus-terminus *::after {
    box-sizing: border-box;
}

.terminus-terminus [role="navigation"],
.terminus-terminus div,
.terminus-terminus section,
.terminus-terminus article,
.terminus-terminus aside,
.terminus-terminus p,
.terminus-terminus h1,
.terminus-terminus h2,
.terminus-terminus h3,
.terminus-terminus h4,
.terminus-terminus h5,
.terminus-terminus h6,
.terminus-terminus a {
    margin: 0;
    padding: 0;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    line-height: inherit;
}

.terminus-terminus p,
.terminus-terminus h1,
.terminus-terminus h2,
.terminus-terminus h3,
.terminus-terminus h4,
.terminus-terminus h5,
.terminus-terminus h6 {
    text-decoration: none;
}

.terminus-terminus img {
    display: block;
    max-width: 100%;
    height: auto;
    border: 0;
}

.terminus-terminus {
    box-shadow: none;
    filter: none;
    text-shadow: none;
    background-image: none;
    border-top: none;
    border-left: none;
    border-right: none;
    outline: none;
}

.terminus-terminus a,
.terminus-terminus a:hover,
.terminus-terminus a:focus,
.terminus-terminus a:active {
    background: transparent;
    box-shadow: none;
    outline: none;
    text-decoration: none;
}

.terminus-terminus .terminus-nexus{
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 24px;
        }

.terminus-terminus .terminus-morse-desc{
            font-size: 14px;
            color: #475569;
            line-height: 1.6;
            margin-bottom: 20px;
            flex-grow: 1;
        }

.terminus-terminus{
            background: #0b0f19;
            color: #94a3b8;
            padding: 64px 0 32px 0;
            border-top: 1px solid #1e293b;
        }

.terminus-terminus .terminus-logbook-grid{
            display: grid;
            grid-template-columns: 2fr repeat(3, minmax(0, 1fr));
            gap: 40px;
            margin-bottom: 48px;
        }

.terminus-terminus .terminus-logbook-brand{
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

.terminus-terminus .terminus-logbook-headline{
            font-size: 22px;
            font-weight: 800;
            color: #ffffff;
            letter-spacing: -0.5px;
        }

.terminus-terminus .terminus-logbook-col-head{
            font-size: 15px;
            font-weight: 700;
            color: #ffffff;
            margin-bottom: 16px;
        }

.terminus-terminus .terminus-logbook-links{
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

.terminus-terminus .terminus-logbook-strand{
            color: #94a3b8;
            text-decoration: none;
            font-size: 14px;
            transition: all 0.25s ease;
        }

.terminus-terminus .terminus-logbook-strand:hover{
            color: #ffffff;
        }

.terminus-terminus .terminus-depot{
            border-top: 1px solid #1e293b;
            padding-top: 24px;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            font-size: 13px;
        }

@media (max-width: 1024px){.terminus-terminus .terminus-logbook-grid{
                grid-template-columns: 1fr 1fr;
                gap: 32px;
            }}

@media (max-width: 768px){.terminus-terminus .terminus-logbook-grid{
                grid-template-columns: 1fr;
            }

.terminus-terminus .terminus-depot{
                flex-direction: column;
                gap: 12px;
                text-align: center;
            }}

/* Download page refresh */
:root {
  --dl-ink: #173b42;
  --dl-copy: #49656a;
  --dl-teal: #0f8b83;
  --dl-teal-dark: #096d69;
  --dl-mint: #dff3ed;
  --dl-coral: #f5a184;
  --dl-sun: #f7c96e;
  --dl-paper: #fbfaf6;
  --dl-line: #d8e8e3;
}

html { scroll-behavior: smooth; }
body {
  background: var(--dl-paper);
  color: var(--dl-ink);
  letter-spacing: 0;
}
#main-content > div { overflow: hidden; }
.beacon-topline { background: rgba(251, 250, 246, .94) !important; border-bottom: 1px solid var(--dl-line) !important; box-shadow: 0 3px 20px rgba(23,59,66,.05) !important; }
.beacon-topline .beacon-nexus, .terminus-terminus .terminus-nexus { max-width: 1180px; }
.beacon-topline .beacon-relay { height: 82px; }
.beacon-topline .beacon-emblem { gap: 10px; color: var(--dl-ink); }
.brand-symbol { width: 37px; height: 37px; display: grid; place-items: center; background: var(--dl-teal); color: #fff; border-radius: 12px 12px 12px 4px; transform: rotate(-6deg); box-shadow: 0 7px 16px rgba(15,139,131,.22); }
.brand-symbol svg { width: 21px; height: 21px; fill: currentColor; transform: rotate(6deg); }
.brand-name { font-size: 18px; font-weight: 800; letter-spacing: .02em; line-height: 1.05; }
.brand-name span { display: block; margin-top: 4px; font-size: 7px; font-weight: 700; letter-spacing: .16em; color: #7d9998; }
.beacon-topline .beacon-roster a.beacon-strand { color: #526b6d; border-radius: 999px; font-size: 14px; padding: 9px 15px; }
.beacon-topline .beacon-roster a.beacon-strand:hover, .beacon-topline .beacon-roster a.beacon-strand.active { color: var(--dl-teal-dark); background: var(--dl-mint); }

.dl-container { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.dl-hero { position: relative; min-height: 610px; padding: 88px 0 90px; background: #f6f7f1; }
.dl-hero:before { content: ""; position: absolute; width: 540px; height: 540px; right: -190px; top: -210px; border: 1px solid rgba(15,139,131,.16); border-radius: 50%; }
.hero-layout { display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: 32px; }
.hero-copy { position: relative; z-index: 2; padding-bottom: 14px; }
.eyebrow, .section-kicker { color: var(--dl-teal); font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 22px; }
.eyebrow span { display: inline-block; width: 25px; height: 2px; background: var(--dl-coral); }
.hero-copy h1 { color: var(--dl-ink); font-size: clamp(46px, 5.5vw, 72px); font-weight: 800; letter-spacing: -.055em; line-height: 1.06; }
.accent-text { color: var(--dl-coral); }
.hero-description { max-width: 390px; margin-top: 23px; color: var(--dl-copy); font-size: 16px; line-height: 1.9; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 31px; }
.action-link, .guide-link, .platform-action, .text-link { text-decoration: none; }
.action-link { display: inline-flex; align-items: center; gap: 12px; padding: 13px 20px; color: #fff; background: var(--dl-teal); border-radius: 5px; font-size: 14px; font-weight: 700; box-shadow: 0 9px 20px rgba(15,139,131,.2); transition: transform .2s ease, background .2s ease; }
.action-link:hover { color: #fff; background: var(--dl-teal-dark); transform: translateY(-2px); }
.action-link svg, .platform-action svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.guide-link { color: var(--dl-ink); font-size: 14px; font-weight: 700; border-bottom: 1px solid #a7bbb6; padding-bottom: 3px; }
.guide-link span, .text-link span { color: var(--dl-coral); margin-left: 6px; font-size: 17px; }
.hero-notes { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 37px; color: #6b8181; font-size: 12px; }
.hero-notes i { display: inline-grid; place-items: center; width: 16px; height: 16px; margin-right: 5px; color: var(--dl-teal); border: 1px solid #9acbc1; border-radius: 50%; font-style: normal; font-size: 10px; }

.hero-art { position: relative; min-height: 430px; }
.desktop-scene { position: absolute; z-index: 2; right: 3%; bottom: 18px; width: min(495px, 90%); height: 300px; overflow: hidden; background: #fff; border: 7px solid #fff; border-radius: 12px; box-shadow: 0 24px 45px rgba(31,78,78,.18), 0 2px 0 rgba(23,59,66,.06); transform: rotate(2.5deg); }
.desktop-toolbar { height: 33px; display: flex; align-items: center; gap: 12px; padding: 0 13px; color: #728b8b; background: #eef6f1; font: 600 9px/1 Arial, sans-serif; }
.desktop-toolbar > span:nth-last-child(2) { flex: 1; text-align: center; font-weight: 700; color: #476664; }
.window-dots { display: flex; gap: 4px; }.window-dots i { width: 6px; height: 6px; display: block; border-radius: 50%; background: #f7ab8b; }.window-dots i:nth-child(2) { background:#f5cd73; }.window-dots i:nth-child(3) { background:#86c9aa; }
.desktop-body { display: grid; grid-template-columns: 37% 63%; height: calc(100% - 33px); }
.chat-sidebar { padding: 10px; background: #f7fbf8; border-right: 1px solid #e2eee9; }.mock-search { display: block; padding: 7px 9px; color: #89a19d; background: #e7f1ec; border-radius: 4px; font-size: 8px; }.mock-contact { display: flex; align-items: center; gap: 7px; padding: 9px 4px; color: #51706d; font-size: 8px; }.mock-contact.selected { border-radius: 5px; background: #dff2e9; color: #173b42; }.mock-contact small, .conversation-header small, .chat-bubble small, .shared-card p { display:block; color: #90a39f; font-size: 7px; font-weight: 400; margin-top: 3px; }.avatar { display: grid; place-items: center; flex: 0 0 auto; width: 23px; height: 23px; border-radius: 50%; color: #fff; font-style: normal; font-size: 9px; font-weight: 700; }.avatar.mint { background: #74bba2; }.avatar.peach { background: #eca37f; }.avatar.lilac { background: #a8a9d4; }.sidebar-lines { display:flex; flex-direction:column; gap:7px; margin: 17px 4px; }.sidebar-lines i { display:block; width: 76%; height: 4px; border-radius: 4px; background:#e2eee9; }.sidebar-lines i:nth-child(2) { width: 58%; }.sidebar-lines i:nth-child(3) { width: 69%; }
.chat-conversation { position: relative; padding: 11px 14px; background: #fff; }.conversation-header { display:flex; align-items:center; gap:7px; color:#315c5b; font-size:9px; font-weight:700; }.conversation-header b { margin-left:auto; color:#8da6a0; font-size:13px; font-weight:400; }.chat-date { display:block; width:max-content; margin: 10px auto 8px; padding:3px 7px; color:#88a39c; background:#f2f6f2; border-radius:5px; font-size:7px; }.chat-bubble { width:max-content; max-width: 75%; padding:7px 9px; color:#4e6c69; background:#e4f4ed; border-radius: 3px 9px 9px 9px; font-size:8px; line-height:1.45; }.chat-bubble small { text-align:right; }.chat-bubble.sent { margin: 7px 0 7px auto; color:#fff; background:#4ca89a; border-radius: 9px 3px 9px 9px; }.chat-bubble.sent small { color:#d3f3ea; }.shared-card { width: 72%; overflow: hidden; margin: 8px auto 0 0; border: 1px solid #e0ece6; border-radius: 7px; background:#fff; }.landscape { height: 50px; position:relative; overflow:hidden; background:#b1d9ce; }.landscape:before { content:""; position:absolute; width:110px; height:55px; left:22px; bottom:-24px; border-radius:50%; background:#71b395; transform:rotate(-14deg); }.landscape:after { content:""; position:absolute; width:85px; height:42px; right:8px; bottom:-19px; border-radius:50%; background:#e8bb87; transform:rotate(12deg); }.landscape span { position:absolute; width:23px; height:23px; top:6px; right:35px; border-radius:50%; background:#f9dfa9; }.landscape i { position:absolute; width:40px; height:8px; left:43px; top:16px; border-radius:50%; background:#f3ece1; transform:rotate(-20deg); }.shared-card p { padding: 7px 9px; margin:0; color:#54716b; font-size:8px; }.shared-card p span { float:right; color:#efa37f; font-size:12px; }.compose-bar { position:absolute; right:14px; bottom:9px; left:14px; padding:7px 9px; border-radius: 5px; color:#99aaa6; background:#f2f7f3; font-size:8px; }.compose-bar span { float:right; color:#42a790; font-size:11px; }
.phone-scene { position:absolute; z-index: 3; right: 0; bottom: -1px; width: 139px; height: 280px; padding: 20px 10px 13px; overflow:hidden; border: 5px solid #fff; border-radius: 22px; background: #f1f7f2; box-shadow: 0 20px 38px rgba(31,78,78,.19); transform: rotate(-8deg); }.phone-notch { position:absolute; top:0; left:38px; width:56px; height:12px; background:#fff; border-radius:0 0 10px 10px; }.phone-header { display:flex; align-items:center; gap:6px; color:#5b7b75; font-size:9px; }.phone-header span { flex:1; font-weight:700; }.phone-header small { display:block; margin-top:2px; font-size:6px; font-weight:400; color:#9ab0aa; }.phone-plane { display:grid; place-items:center; width:59px; height:59px; margin:19px auto 14px; border-radius:21px 21px 21px 6px; background:var(--dl-teal); box-shadow: 0 9px 18px rgba(15,139,131,.2); }.phone-plane svg { width:30px; fill:#fff; }.phone-message { width: 89%; padding: 7px 8px; border-radius: 3px 8px 8px 8px; color:#52706b; background:#dcefe6; font-size:7px; line-height:1.5; }.phone-message small { display:block; text-align:right; color:#89aaa0; font-size:6px; }.phone-message.second { margin: 7px 0 0 auto; border-radius:8px 3px 8px 8px; color:#fff; background:#56ac9d; }.phone-message.second small { color:#d7f3e9; }.phone-compose { position:absolute; right:10px; bottom:17px; left:10px; padding:6px; border-radius:5px; color:#a0b2ac; background:#fff; font-size:7px; }.phone-compose span { float:right; color:#36a18f; font-size:9px; }.phone-home { position:absolute; bottom:5px; left:49px; width:31px; height:2px; background:#9bb0a8; border-radius:2px; }
.floating-note { position:absolute; z-index:4; left: -2%; top: 12px; display:flex; align-items:center; gap:9px; padding:10px 13px 10px 9px; color:#3f6661; background:#fff; border-radius:6px; box-shadow:0 10px 25px rgba(31,78,78,.11); font-size:10px; font-weight:700; transform:rotate(-5deg); }.floating-note small { display:block; margin-top:3px; color:#a1b5ae; font-size:6px; letter-spacing:.15em; }.note-icon { display:grid; place-items:center; width:27px; height:27px; border-radius:8px 8px 8px 3px; color:#fff; background:var(--dl-coral); font-size:17px; }.art-orbit { position:absolute; border:1px solid rgba(15,139,131,.25); border-radius:50%; }.orbit-one { width:390px; height:390px; top: -12px; left: 14%; }.orbit-two { width:280px; height:280px; top: 40px; left: 28%; border-style:dashed; opacity:.6; }.art-spark { position:absolute; z-index:1; color:var(--dl-coral); font-size:22px; }.spark-one { top:45px; right:17%; }.spark-two { bottom:75px; left:8%; color:var(--dl-teal); font-size:14px; }.sync-note { position:absolute; z-index:4; right:7%; bottom: -11px; padding: 8px 12px; color:#587570; background:#fff; box-shadow:0 8px 22px rgba(31,78,78,.12); border-radius:4px; font-size:9px; }.sync-note span { display:inline-grid; place-items:center; width:14px; height:14px; margin-right:4px; color:#fff; background:var(--dl-teal); border-radius:50%; }

.platform-section { padding: 91px 0 85px; background:#fbfaf6; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; }.section-heading h2, .start-intro h2 { margin-top:12px; color:var(--dl-ink); font-size:37px; letter-spacing:-.045em; line-height:1.12; }.section-heading p { margin-top:10px; color:var(--dl-copy); font-size:14px; }.platform-label { padding-bottom:7px; color:#718b87; font-size:12px; }.platform-label i { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:#7ebca6; }.platform-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:39px; }.platform-card { position:relative; min-height:328px; padding:24px 21px 20px; border:1px solid var(--dl-line); border-radius:6px; background:#fff; transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease; }.platform-card:hover { transform:translateY(-5px); border-color:#acd4c8; box-shadow:0 18px 30px rgba(33,83,78,.1); }.card-top { display:flex; justify-content:space-between; align-items:center; }.platform-icon { display:grid; place-items:center; width:40px; height:40px; color:var(--dl-teal); background:var(--dl-mint); border-radius:10px; }.platform-icon svg { width:21px; height:21px; fill:currentColor; }.apple-icon { color:#5f8c9b; background:#e5f0f3; }.android-icon { color:#66ae8a; background:#e1f2ea; }.ios-icon { color:#8e86b4; background:#eeebf6; }.ios-icon svg { fill:none; stroke:currentColor; stroke-width:1.7; }.card-tag { padding:4px 8px; color:#6d8b85; background:#f1f7f3; border-radius:3px; font-size:10px; }.platform-card h3 { margin-top:24px; color:var(--dl-ink); font-size:23px; letter-spacing:-.02em; }.platform-card > p { min-height:52px; margin-top:9px; color:var(--dl-copy); font-size:12px; line-height:1.7; }.platform-format { margin-top:22px; padding-top:12px; border-top:1px dashed #d6e7e0; color:#89a19b; font-size:10px; }.platform-action { display:flex; align-items:center; justify-content:space-between; gap:4px; margin-top:16px; color:var(--dl-teal-dark); font-size:12px; font-weight:700; }.platform-action:hover { color:var(--dl-coral); }.platform-action svg { width:14px; height:14px; }.platform-footnote { display:flex; align-items:center; gap:7px; margin-top:25px; color:#8a9f9a; font-size:11px; }.platform-footnote svg { width:15px; height:15px; fill:none; stroke:#9cbdb3; stroke-width:1.5; }
.start-section { padding: 0 0 86px; background:#fbfaf6; }.start-panel { display:grid; grid-template-columns: .82fr 1.18fr; gap:65px; padding:50px 56px; border-radius:7px; background:#e8f3ec; }.start-intro h2 { font-size:30px; }.start-intro p { margin-top:14px; color:#55736d; font-size:14px; line-height:1.8; }.text-link { display:inline-block; margin-top:25px; padding-bottom:3px; color:var(--dl-teal-dark); border-bottom:1px solid #9cc9bc; font-size:12px; font-weight:700; }.start-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:23px; }.start-step { border-left:1px solid #bbd9cb; padding-left:15px; }.step-number { color:var(--dl-coral); font:700 12px/1 Georgia, serif; letter-spacing:.12em; }.start-step h3 { margin-top:22px; color:var(--dl-ink); font-size:14px; }.start-step p { margin-top:11px; color:#638078; font-size:11px; line-height:1.8; }
.terminus-terminus { margin-top:0; background:#173b42; border-top:0; }.terminus-terminus .terminus-morse-desc { color:#adbfbe; }.terminus-terminus .terminus-logbook-strand { color:#adbfbe; }.terminus-terminus .terminus-logbook-strand:hover { color:#aee4d6; }.terminus-terminus .terminus-depot { color:#adbfbe; border-color:rgba(209,242,231,.16); }
.android-icon svg { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.action-link:focus-visible, .platform-action:focus-visible, .guide-link:focus-visible, .text-link:focus-visible, .beacon-topline a:focus-visible, .terminus-terminus a:focus-visible { outline:2px solid var(--dl-teal); outline-offset:5px; }
.beacon-topline .beacon-roster a.beacon-strand:focus-visible, .terminus-terminus a.terminus-logbook-strand:focus-visible { outline:2px solid #75bcaa; outline-offset:3px; }
#start-guide { scroll-margin-top:30px; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.platform-card, .action-link { transition:none; }.platform-card:hover, .action-link:hover { transform:none; } }
@media (max-width:640px) { .beacon-topline .beacon-roster a.beacon-strand { padding:7px 10px; font-size:12px; } }

@media (max-width: 980px) { .hero-layout { grid-template-columns:1fr; }.dl-hero { padding:66px 0 70px; }.hero-copy { max-width:600px; }.hero-art { min-height:405px; margin-top:15px; }.platform-grid { grid-template-columns:repeat(2,1fr); }.start-panel { grid-template-columns:1fr; gap:30px; }.start-intro { display:grid; grid-template-columns:1fr 1fr; align-items:end; column-gap:25px; }.start-intro .section-kicker, .start-intro h2 { grid-column:1; }.start-intro p { grid-column:1; }.start-intro .text-link { grid-column:2; grid-row:2; margin-top:0; justify-self:end; } }
@media (max-width: 640px) { .dl-container { width:min(100% - 32px, 1180px); }.beacon-topline .beacon-relay { padding:14px 0; gap:10px; }.beacon-topline .beacon-roster { gap:2px; justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:2px; }.beacon-topline .beacon-strand { flex:0 0 auto; padding:7px 10px; font-size:12px; }.brand-name { font-size:16px; }.brand-name span { font-size:6px; }.dl-hero { min-height:0; padding:54px 0 64px; }.hero-copy h1 { font-size:48px; }.hero-description { font-size:14px; }.hero-actions { gap:17px; flex-wrap:wrap; }.hero-notes { gap:10px 15px; margin-top:27px; }.hero-art { min-height:300px; margin-top:20px; }.desktop-scene { right:0; width:90%; height:202px; border-width:4px; border-radius:8px; }.desktop-toolbar { height:23px; padding:0 8px; font-size:6px; }.desktop-body { height:calc(100% - 23px); }.chat-sidebar { padding:6px; }.mock-search { padding:4px 5px; font-size:5px; }.mock-contact { gap:4px; padding:5px 2px; font-size:5px; }.mock-contact small { font-size:4px; }.avatar { width:15px; height:15px; font-size:6px; }.sidebar-lines { margin:8px 2px; gap:4px; }.chat-conversation { padding:7px 8px; }.conversation-header { font-size:6px; }.conversation-header small, .chat-bubble small, .shared-card p { font-size:4px; }.chat-date { margin:6px auto 5px; padding:2px 4px; font-size:4px; }.chat-bubble { padding:4px 5px; font-size:5px; }.shared-card { margin-top:5px; }.landscape { height:32px; }.shared-card p { padding:4px 5px; }.compose-bar { right:8px; bottom:6px; left:8px; padding:4px 5px; font-size:5px; }.phone-scene { width:95px; height:210px; padding:15px 7px 9px; border-width:3px; border-radius:16px; }.phone-notch { left:27px; width:39px; height:8px; }.phone-header { font-size:6px; }.phone-header small { font-size:4px; }.phone-plane { width:40px; height:40px; margin:13px auto 9px; border-radius:14px 14px 14px 4px; }.phone-plane svg { width:20px; }.phone-message { padding:5px; font-size:5px; }.phone-message small { font-size:4px; }.phone-compose { right:7px; bottom:11px; left:7px; padding:4px; font-size:5px; }.phone-home { bottom:3px; left:33px; width:23px; }.floating-note { left:0; top:0; padding:6px 8px 6px 5px; gap:5px; font-size:7px; }.floating-note small { font-size:4px; }.note-icon { width:20px; height:20px; font-size:12px; }.orbit-one { width:280px; height:280px; top:0; left:3%; }.orbit-two { width:215px; height:215px; top:32px; left:19%; }.sync-note { right:2%; bottom:-8px; padding:5px 7px; font-size:6px; }.sync-note span { width:10px; height:10px; font-size:7px; }.platform-section { padding:64px 0 58px; }.section-heading { align-items:start; flex-direction:column; }.section-heading h2, .start-intro h2 { font-size:31px; }.platform-label { padding:0; }.platform-grid { grid-template-columns:1fr; gap:11px; margin-top:27px; }.platform-card { min-height:0; padding:19px; }.platform-card > p { min-height:0; }.platform-format { margin-top:17px; }.start-section { padding-bottom:58px; }.start-panel { padding:31px 22px; gap:28px; }.start-intro { display:block; }.start-intro .text-link { margin-top:20px; }.start-steps { grid-template-columns:1fr; gap:20px; }.start-step { padding:0 0 0 14px; }.start-step h3 { margin-top:11px; }.terminus-terminus { padding-top:45px; }.terminus-terminus .terminus-nexus { padding:0 16px; } }