@charset "UTF-8";
:root {
  color-scheme: dark;
  --bg: #0b1017; --surface: #151e29; --surface-2: #101923;
  --border: #293a4a; --text: #c0cad5; --muted: #899bab;
  --blue: #10a7ff; --blue-light: #6acaff; --track: #243342;
  font-family: "Segoe UI", Inter, system-ui, sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }
button, input { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--blue-light); outline-offset: 3px; }
.skip-link { position: fixed; top: -100px; left: 12px; z-index: 10; padding: 10px 14px; background: var(--blue); color: #061522; }
.skip-link:focus { top: 12px; }
.app { min-height: 100vh; display: grid; grid-template-columns: 232px minmax(0, 1fr); }
.sidebar { min-height: 100vh; background: #101720; border-right: 1px solid #24313d; padding: 28px 18px; display: flex; flex-direction: column; }
.brand { display: inline-flex; align-items: center; gap: 9px; width: fit-content; font-size: 24px; letter-spacing: -.8px; line-height: 1; }
.brand strong { font-weight: 700; }
.brand strong > span, .blue, .dot { color: var(--blue); }
.logo-mark { display: inline-block; flex: 0 0 auto; width: 42px; height: 38px; position: relative; overflow: hidden; }
.logo-mark img { position: absolute; left: 50%; top: 50%; width: 205%; max-width: none; height: auto; transform: translate(-50%,-50%); mix-blend-mode: screen; filter: contrast(1.1); }
.section-label, .eyebrow { color: #8da8bd; font-weight: 700; font-size: 10px; letter-spacing: 1.6px; line-height: 1.4; }
.section-label { margin: 66px 12px 14px; font-size: 9px; color: #74899c; }
.sidebar nav { display: grid; gap: 4px; }
.nav { display: flex; align-items: center; gap: 11px; min-height: 43px; padding: 10px 12px; border: 1px solid transparent; border-radius: 7px; color: var(--muted); font-size: 12px; transition: background .15s, color .15s, border-color .15s; }
.nav-symbol { width: 20px; text-align: center; font-size: 16px; line-height: 1; }
.nav:hover { background: #18232e; color: var(--text); }
.nav.active { color: #78cfff; background: #172c3d; border-color: #25475d; }
.sidebar-bottom { margin-top: auto; padding: 20px 12px 0; color: #788e9f; font-size: 11px; }
.sidebar-bottom p { margin: 30px 0 0; color: #617687; font-size: 9px; letter-spacing: .8px; }
.owner-link:hover { color: var(--blue-light); }
main { width: 100%; max-width: 1540px; min-width: 0; margin: 0 auto; padding: 0 clamp(28px, 5vw, 76px); }
.topbar, main > header { height: 76px; border-bottom: 1px solid #22303c; display: flex; justify-content: space-between; align-items: center; color: #879bad; font-size: 10px; letter-spacing: 1.2px; }
.topbar-kicker { color: #b0bdc9; }
.topbar-divider, main > header i { margin: 0 10px; color: #526777; font-style: normal; }
.subtle { border: 0; padding: 8px 0; background: transparent; color: var(--muted); font-size: 11px; letter-spacing: 0; }
.subtle:hover { color: var(--blue-light); }
.auth { display: grid; grid-template-columns: minmax(0,1fr) minmax(340px,420px); gap: clamp(50px,8vw,130px); align-items: center; min-height: min(720px,calc(100vh - 150px)); padding: 58px 0; }
.auth-copy { max-width: 520px; }
.pulse-dot { display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 12px #00aaff80; vertical-align: 1px; }
.auth-copy h1, .hero h1 { font-size: clamp(42px,4.8vw,66px); line-height: 1.08; letter-spacing: -2.8px; font-weight: 650; margin: 20px 0 22px; }
.auth-copy h1 em { color: var(--blue); font-style: normal; }
.auth-copy > p, .hero p, .download > p { color: var(--muted); line-height: 1.75; max-width: 440px; }
.auth-note { margin-top: 52px; display: flex; align-items: flex-start; gap: 12px; }
.auth-note-icon { color: var(--blue-light); font-size: 16px; }
.auth-note strong, .auth-note small { display: block; }
.auth-note strong { color: #adbbc7; font-size: 12px; font-weight: 600; }
.auth-note small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.auth-card, .card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 12px 32px #00000016; }
.auth-card { padding: 30px; }
.card-intro h2 { font-size: 24px; line-height: 1.2; letter-spacing: -.5px; margin: 10px 0 7px; font-weight: 650; }
.card-intro p { margin: 0; color: var(--muted); font-size: 12px; }
.tabs { display: flex; gap: 25px; margin: 28px 0 24px; border-bottom: 1px solid #30404f; }
.tab { padding: 0 0 13px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--muted); font-size: 12px; }
.tab.active { color: #d1dbe4; border-color: var(--blue); }
label { display: block; margin: 17px 0 8px; color: #afbdc8; font-size: 12px; font-weight: 500; }
label small { color: var(--muted); font-size: 11px; font-weight: 400; }
input { width: 100%; min-width: 0; height: 44px; padding: 0 13px; border: 1px solid #394b5b; border-radius: 6px; outline: none; background: #0d151e; color: var(--text); }
input::placeholder { color: #6e8292; opacity: 1; }
input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px #10a7ff1a; }
.primary { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 44px; padding: 12px 15px; border: 1px solid transparent; border-radius: 6px; background: var(--blue); color: #071721; font-size: 12px; font-weight: 700; transition: background .15s; }
.primary:hover { background: #65c8ff; }
.primary:disabled, .download-link.disabled { opacity: .42; pointer-events: none; }
.wide { width: 100%; }
form .primary { margin-top: 23px; }
.help { color: var(--muted); font-size: 11px; line-height: 1.6; }
.message { min-height: 16px; color: #f19da5; font-size: 12px; }
.message.ok { color: #7ed8b5; }
.auth-foot { border-top: 1px solid #30404f; margin-top: 20px; padding-top: 16px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.auth-foot p { margin: 0; }
.discord-inline, .text-link { display: inline-block; color: var(--blue-light); font-size: 11px; }
.discord-inline { margin-top: 8px; }
.text-link { padding: 0; border: 0; background: transparent; text-align: left; }
.text-link:hover, .discord-inline:hover { text-decoration: underline; }
#migrate-back { margin-top: 16px; }
.dashboard { padding-top: 42px; }
.hero { display: flex; justify-content: space-between; align-items: center; min-height: 190px; gap: 25px; }
.hero h1 { font-size: clamp(36px,4vw,48px); margin: 14px 0 8px; letter-spacing: -1.8px; }
.hero p { margin: 0; font-size: 12px; }
.hero p strong { color: #b4c6d4; font-weight: 500; overflow-wrap: anywhere; }
.hero-symbol { width: 170px; height: 112px; }
.purchase-banner { display: flex; align-items: center; gap: 18px; margin: 12px 0 18px; padding: 22px 24px; border: 1px solid #2a485d; border-radius: 10px; background: linear-gradient(105deg,#142a3a,#151f2b 68%); }
.banner-icon, .card-icon { flex: 0 0 auto; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #285876; border-radius: 8px; background: #15354b; color: #71d1ff; font-size: 17px; }
.banner-copy { flex: 1; min-width: 0; }
.banner-copy h2 { margin: 5px 0; font-size: 17px; font-weight: 600; }
.banner-copy p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.banner-action { flex: 0 0 auto; }
.cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.card { min-width: 0; padding: 25px; }
.card-top { display: flex; align-items: center; gap: 10px; }
.card h2 { margin: 22px 0 10px; font-size: 19px; letter-spacing: -.3px; font-weight: 600; }
.license-name { margin: 0 0 12px; color: #c4d0d9; font-size: 14px; }
.status { display: inline-block; padding: 4px 9px; border: 1px solid #385463; border-radius: 20px; background: #203542; color: #a8c2d0; font-size: 10px; }
.status.active { border-color: #28615c; background: #173e3d; color: #8dddc2; }
dl { margin: 23px 0; }
dl div { display: flex; justify-content: space-between; gap: 15px; padding: 10px 0; border-top: 1px solid #2c3a47; font-size: 12px; }
dt { color: var(--muted); }
dd { margin: 0; text-align: right; }
.inline { display: flex; align-items: stretch; gap: 8px; }
.small-button { flex: 0 0 auto; padding: 9px 13px; border: 1px solid #405361; border-radius: 6px; background: #21303d; color: var(--text); font-size: 11px; }
.small-button:hover { border-color: #5a829e; background: #293d4c; }
.download > p { font-size: 12px; }
.download-panel { display: flex; align-items: center; gap: 13px; margin: 23px 0 18px; padding: 14px; border: 1px solid #304455; border-radius: 8px; background: #101b26; }
.file-icon { width: 40px; height: 40px; border-radius: 6px; background: #153b53; }
.download-panel strong, .download-panel small { display: block; }
.download-panel strong { font-size: 12px; }
.download-panel small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.file-badge { margin-left: auto; color: #849dae; font-size: 9px; letter-spacing: .7px; }
footer { display: flex; justify-content: space-between; gap: 12px; margin-top: 58px; padding: 21px 0; border-top: 1px solid #24313c; color: #758b9c; font-size: 10px; letter-spacing: .7px; }
.account-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.accounts-page { padding-top: 50px; }
.page-intro { margin-bottom: 34px; }
.page-intro h1 { font-size: clamp(36px,4vw,48px); line-height: 1.1; letter-spacing: -1.8px; margin: 14px 0 9px; font-weight: 650; }
.page-intro p { color: var(--muted); margin: 0; }
.settings-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-bottom: 18px; }
.access-card { margin-bottom: 18px; }
.access-card .primary { margin-top: 15px; }
.account-head { margin-bottom: 20px; }
.account-head h2 { margin: 7px 0 0; }
.account-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid var(--border); padding: 16px 0; }
.account-row strong, .account-row small { display: block; overflow-wrap: anywhere; }
.account-row small { margin-top: 5px; color: var(--muted); }
.account-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.account-actions button { min-height: 34px; }
.settings-card { min-width: 0; }
.settings-card h2 { margin: 12px 0 0; }
.settings-card .help { margin: 8px 0; }
dialog { width: min(440px,90vw); padding: 24px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--text); }
dialog::backdrop { background: #000b; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.dialog-actions .primary { margin: 0; }
@media(max-width: 920px) {
  .app { display: block; }
  .sidebar { min-height: 0; padding: 12px 22px; border-right: 0; border-bottom: 1px solid #263442; flex-direction: row; align-items: center; gap: 26px; }
  .section-label, .sidebar-bottom { display: none; }
  .sidebar nav { display: flex; flex-wrap: wrap; gap: 4px; }
  .nav { min-height: 37px; }
  .auth { grid-template-columns: 1fr; gap: 32px; min-height: 0; padding: 55px 0; }
  .auth-copy h1 { font-size: 48px; }
  .auth-note { margin-top: 24px; }
  .auth-card { max-width: 520px; width: 100%; }
}
@media(max-width: 650px) {
  main { padding: 0 20px; }
  .sidebar { padding: 10px 16px; gap: 10px; flex-wrap: wrap; }
  .sidebar nav { width: 100%; justify-content: space-between; }
  .nav { padding: 8px; font-size: 11px; gap: 5px; }
  .nav-symbol { width: 16px; }
  .topbar, main > header { height: 62px; }
  .auth { padding: 42px 0; }
  .auth-copy h1 { font-size: 40px; letter-spacing: -1.5px; }
  .auth-card, .card { padding: 21px; }
  .dashboard { padding-top: 25px; }
  .hero { min-height: 150px; }
  .hero-symbol { width: 100px; height: 80px; }
  .purchase-banner { flex-wrap: wrap; align-items: flex-start; padding: 20px; }
  .banner-copy { flex-basis: calc(100% - 60px); }
  .banner-action { margin-left: 56px; }
  .cards { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }
  .account-row { align-items: flex-start; flex-direction: column; }
  footer { margin-top: 36px; }
}
@media(prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition: none !important; } }

.device-card { margin-top: 18px; }
.device-card > p { color: var(--muted, #9baabd); font-size: 13px; line-height: 1.6; }
.device-list { margin-top: 16px; }
.device-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid rgba(140,170,200,.14); }
.device-row strong, .device-row small { display: block; }
.device-row small { color: #8d9eb0; margin-top: 5px; font-size: 12px; }
.device-remove { flex-shrink: 0; }

.broadcast-card { margin-bottom:18px; }
.broadcast-card textarea { display:block; width:100%; padding:11px; background:#0c141d; color:#abb6c4; border:1px solid #344454; border-radius:7px; resize:vertical; font:inherit; }
.news-card { margin-bottom:18px; }
.news-card h2 { margin:8px 0; }
.news-text { white-space:pre-wrap; line-height:1.6; color:#a4b6c6; }
.news-card a { color:#45bdff; }

.reset-options { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:10px; }
.reset-options .reset-show { display:flex; align-items:center; gap:8px; margin:0; }
.reset-options input[type=checkbox] { width:16px; height:16px; min-width:16px; margin:0; accent-color:var(--blue); }
#account-search { margin-bottom:15px; }
@media(max-width:510px){ .reset-options { flex-wrap:wrap; } }

/* Wave: a focused, dark product layout with the original PNG mark. */
:root { --bg:#0b0d11; --surface:#12161c; --surface-2:#101319; --border:#292e36; --text:#c4ccd6; --muted:#89929f; --blue:#168ecb; --blue-light:#72bbdc; --track:#1b2630; }
body { background:radial-gradient(ellipse 65% 450px at 70% 260px,#0b29374d,transparent 75%),var(--bg); }
.app { display:block; min-height:100vh; }
.sidebar { position:relative; z-index:2; min-height:0; height:96px; padding:0 max(32px,calc((100vw - 1320px)/2)); display:flex; flex-direction:row; align-items:center; gap:30px; background:#0c0d10eF; border-right:0; border-bottom:1px solid #24282e; }
.sidebar .brand { flex-shrink:0; font-size:24px; font-weight:750; letter-spacing:-1.2px; }
.sidebar .section-label,.sidebar-bottom p { display:none; }
.sidebar nav { display:flex; align-items:center; justify-content:flex-end; gap:20px; margin-left:auto; }
.nav { min-height:40px; padding:9px 2px; border:0; border-radius:0; color:#969fab; background:transparent; font-size:11px; letter-spacing:1px; font-weight:650; text-transform:uppercase; }
.nav:hover,.nav.active { background:transparent; color:#bfcfda; border-color:transparent; }
.nav-cta { min-height:46px; padding:12px 20px; border-radius:5px; color:#c8dce6; background:#146d94; border:0; letter-spacing:.3px; text-transform:none; }
.nav-cta:hover,.nav-cta.active { color:#d7e5ee; background:#1885af; }
.sidebar-bottom { display:flex; align-items:center; margin:0; padding:0; font-size:11px; white-space:nowrap; }
.owner-link { color:#84909b; }
main { max-width:1380px; padding-inline:clamp(26px,5.2vw,76px); }
body.guest main > .topbar { display:none; }
.landing-hero { min-height:620px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:12px; position:relative; }
.landing-copy { position:relative; z-index:1; padding:60px 0 76px; }
.landing-copy h1 { margin:26px 0 22px; font-size:clamp(58px,6.5vw,94px); line-height:1.03; font-weight:750; letter-spacing:-4.5px; color:#c4cdd7; }
.landing-copy h1 span { color:#55add7; }
.landing-copy > p { max-width:420px; color:var(--muted); font-size:16px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:34px; margin-top:44px; }
.hero-actions .primary,.landing-banner .primary { min-width:150px; min-height:52px; }
.hero-secondary { color:#b4bec9; font-size:12px; }
.hero-secondary:hover { color:var(--blue-light); }
.landing-caption { display:flex; align-items:center; gap:11px; margin-top:82px; color:#6f7e8b; font-size:9px; font-weight:700; letter-spacing:1.6px; }
.caption-line { display:block; width:30px; height:1px; background:#277fa7; }
.landing-art { position:relative; min-height:470px; display:grid; place-items:center; background:radial-gradient(circle at 50% 50%,#0c739b40,transparent 58%); overflow:hidden; }
.landing-logo { width:min(100%,440px); height:310px; }
.art-orbit { position:absolute; border:1px solid #1b6d8d55; border-radius:50%; transform:rotate(-20deg); }
.orbit-one { width:400px; height:260px; }.orbit-two { width:480px; height:330px; border-color:#1b6d8d25; }
.art-index { position:absolute; bottom:35px; right:35px; color:#56778b; font-size:10px; font-weight:700; letter-spacing:1.6px; }
.feature-section { padding:70px 0 75px; border-top:1px solid #262a30; }
.feature-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }
.feature-heading h2,.landing-banner h2 { margin:12px 0 0; color:#c5cdd7; font-size:clamp(32px,4vw,52px); line-height:1.1; letter-spacing:-2px; }
.feature-heading > p,.landing-banner p { color:var(--muted); font-size:13px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; margin-top:44px; border:1px solid #262c33; background:#262c33; }
.feature-item { min-height:210px; padding:30px; background:#101319; }
.feature-item > span { color:#659ab4; font-size:10px; font-weight:700; letter-spacing:1.3px; }
.feature-item h3 { margin:35px 0 10px; color:#c0cad3; font-size:20px; letter-spacing:-.5px; }
.feature-item p { margin:0; max-width:270px; color:var(--muted); font-size:12px; line-height:1.7; }
.landing-banner { display:flex; justify-content:space-between; align-items:center; gap:30px; padding:42px; border:1px solid #26323a; background:radial-gradient(ellipse at 90% 0,#12374a77,transparent 55%),#10151a; }
.landing-banner h2 { font-size:34px; }
.auth { display:flex; align-items:center; justify-content:center; min-height:650px; padding:105px 0 100px; }
.auth-card { width:min(100%,390px); padding:0; background:transparent; border:0; box-shadow:none; }
.card-intro h2 { font-size:30px; letter-spacing:-1px; margin:14px 0 8px; }
.tabs { margin:30px 0 26px; border-color:#30343a; }
input,.broadcast-card textarea { background:#121419; border-color:#272d33; border-radius:4px; }
input:focus { border-color:#267fa7; box-shadow:0 0 0 3px #168ecb1e; }
.primary { border-radius:4px; background:#146d94; color:#d3e2eb; }
.primary:hover { background:#1885af; }
.card,.auth-card { box-shadow:none; }
.card { border-radius:5px; background:#12161c; }
.dashboard { padding-top:42px; }.dashboard .hero { min-height:205px; }
.hero h1 { font-size:clamp(42px,5vw,62px); letter-spacing:-2.5px; }
.purchase-banner { border-radius:5px; border-color:#263c49; background:linear-gradient(110deg,#102431,#12171d 72%); }
.card-icon,.banner-icon { border-radius:4px; background:#142b37; border-color:#244a5d; }
.download-panel { background:#0d1218; border-color:#28343c; border-radius:4px; }
.small-button { background:#1a242c; border-color:#35414a; border-radius:4px; }
.status,.status.active { border-radius:4px; }
.news-card,.device-card { margin-top:18px; }
.accounts-page { padding-top:60px; }
footer { border-color:#282d34; }
@media(max-width:920px) {
 .sidebar { height:auto; min-height:78px; padding:16px 26px; gap:18px; flex-wrap:wrap; }
 .sidebar nav { margin-left:auto; gap:15px; flex-wrap:wrap; }
 .sidebar-bottom { display:flex; }
 .landing-hero { min-height:520px; }.landing-copy h1 { font-size:clamp(48px,7vw,68px); letter-spacing:-3px; }
 .landing-art { min-height:370px; }.landing-logo { width:300px; height:240px; }.orbit-one { width:290px; height:210px; }.orbit-two { width:350px; height:260px; }
 .auth { min-height:560px; padding:80px 0; }
}
@media(max-width:650px) {
 .sidebar { padding:14px 20px; gap:10px; }.sidebar .brand { font-size:21px; }
 .sidebar nav { order:3; width:100%; justify-content:flex-start; gap:16px; }
 .sidebar-bottom { margin-left:auto; }.nav { font-size:10px; padding:8px 0; }.nav-cta { padding:9px 13px; min-height:37px; }
 .landing-hero { grid-template-columns:1fr; min-height:0; gap:0; }.landing-copy { padding:70px 0 10px; }
 .landing-copy h1 { font-size:clamp(44px,12vw,64px); letter-spacing:-2.7px; }.landing-copy > p { font-size:14px; }
 .landing-caption { margin-top:35px; }.landing-art { min-height:270px; }.landing-logo { width:250px; height:190px; }
 .orbit-one { width:240px; height:165px; }.orbit-two { width:280px; height:210px; }.art-index { bottom:10px; right:10px; }
 .feature-section { padding:55px 0; }.feature-heading { display:block; }.feature-heading h2 { font-size:34px; }.feature-grid { grid-template-columns:1fr; margin-top:28px; }.feature-item { min-height:150px; padding:24px; }.feature-item h3 { margin-top:22px; }
 .landing-banner { padding:25px; flex-wrap:wrap; }.landing-banner h2 { font-size:30px; }.auth { padding:65px 0; min-height:0; }.auth-card { max-width:390px; }
 .hero h1 { font-size:40px; }.hero-symbol { width:100px; height:80px; }.purchase-banner { padding:20px; }
}

/* A compact, isolated advertising placement. */
.ad-strip { margin:0 0 22px; padding:12px 16px 14px; border:1px solid #26323a; border-radius:5px; background:#10151a; }
.ad-strip > span { display:block; color:#647b8d; font-size:10px; font-weight:700; letter-spacing:.12em; }
.ad-frame-host:empty { display:none; }
.ad-frame-host iframe { display:block; margin-top:8px; width:100%; height:265px; border:0; background:#10151a; }
@media(max-width:650px) { .ad-strip { padding:10px; }.ad-frame-host iframe { height:520px; } }
