:root {
  color-scheme: dark;
  --bg: #07110f;
  --surface: #0c1916;
  --surface-2: #11231e;
  --line: rgba(213, 255, 236, 0.1);
  --text: #f1fff8;
  --muted: #87a69a;
  --green: #61f2a7;
  --green-2: #20cc7a;
  --amber: #ffd77a;
  --danger: #ff7e88;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.36);
  font-family: Inter, "SF Pro Display", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

/* v0.5 · topic bands, private profile and minimal public frequency cards */
.bands-screen,.profile-screen { background:#f4f6f4; }
.bands-screen { padding-bottom:118px; }
.bands-intro { display:flex; gap:18px; align-items:center; margin:0 22px 28px; padding:20px; border:1px solid #dfe6e1; border-radius:24px; background:linear-gradient(145deg,#0c1a14,#10271c); color:#fff; box-shadow:0 16px 34px rgba(19,45,32,.14); }
.bands-intro__signal { display:flex; align-items:center; justify-content:center; gap:3px; width:74px; min-width:74px; height:74px; border-radius:22px; background:#00ad57; overflow:hidden; }
.bands-intro__signal i { display:block; width:4px; border-radius:4px; background:#fff; animation:band-bars 1.5s ease-in-out infinite; }
.bands-intro__signal i:nth-child(1),.bands-intro__signal i:nth-child(5){height:14px}.bands-intro__signal i:nth-child(2),.bands-intro__signal i:nth-child(4){height:32px;animation-delay:-.25s}.bands-intro__signal i:nth-child(3){height:48px;animation-delay:-.5s}
.bands-intro strong { display:block; margin-bottom:7px; font-size:17px; letter-spacing:-.02em; }.bands-intro p { margin:0; color:#adc1b6; font-size:12px; line-height:1.65; }
.bands-featured { padding:0 22px; }.band-list { display:grid; gap:12px; margin-top:14px; }
.band-card { --band-color:#00ad57; display:grid; grid-template-columns:66px 1fr auto; gap:14px; align-items:center; padding:16px; border:1px solid #dfe5e1; border-radius:22px; background:rgba(255,255,255,.91); box-shadow:0 8px 24px rgba(40,56,48,.045); animation:card-in .45s both; animation-delay:var(--delay); }
.band-card--active { border-color:color-mix(in srgb,var(--band-color) 45%,#dfe5e1); box-shadow:0 12px 30px color-mix(in srgb,var(--band-color) 12%,transparent); }
.band-card__signal { position:relative; display:grid; place-items:center; width:66px; height:66px; border-radius:20px; color:var(--band-color); background:color-mix(in srgb,var(--band-color) 9%,#fff); overflow:hidden; }
.band-card__signal span { z-index:1; font-size:9px; font-weight:850; letter-spacing:.11em; }.band-card__signal i { position:absolute; width:44px; height:44px; border:1px solid currentColor; border-radius:50%; opacity:.17; }.band-card__signal i:nth-child(2){width:25px;height:25px}.band-card__signal i:nth-child(3){width:8px;height:8px;background:currentColor;opacity:.9}.band-card__signal i:nth-child(4){width:70px;height:70px}
.band-card__body>span { display:flex; justify-content:space-between; align-items:baseline; gap:8px; }.band-card__body strong { font-size:16px; }.band-card__body small { color:var(--band-color); font-size:10px; font-weight:750; }.band-card__body p { margin:6px 0 0; color:#768078; font-size:11px; line-height:1.55; }
.band-card>button { padding:10px 12px; border:0; border-radius:13px; color:var(--band-color); background:color-mix(in srgb,var(--band-color) 10%,#fff); font-weight:800; white-space:nowrap; }.band-card--active>button { color:#fff; background:var(--band-color); }
.band-boundaries { margin:28px 22px 14px; padding:6px 18px; border-top:1px solid #dfe5e1; border-bottom:1px solid #dfe5e1; }.band-boundaries>div { display:flex; gap:14px; align-items:center; padding:14px 0; }.band-boundaries>div+div { border-top:1px solid #e6eae7; }.band-boundaries b { color:#acb5af; font:700 10px/1 ui-monospace,monospace; }.band-boundaries span { display:flex; flex-direction:column; gap:3px; }.band-boundaries strong { font-size:13px; }.band-boundaries small { color:#89918c; font-size:10px; line-height:1.45; }
.band-create-preview { display:flex; align-items:center; gap:14px; width:calc(100% - 44px); margin:0 22px; padding:17px; border:1px dashed #aebbb3; border-radius:20px; color:#6f7b73; background:transparent; text-align:left; }.band-create-preview>span:first-child { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; color:#00a653; background:#e4f6eb; font-size:22px; }.band-create-preview>span:nth-child(2) { display:flex; flex:1; flex-direction:column; gap:4px; }.band-create-preview strong { color:#28332c; }.band-create-preview small { font-size:10px; }.band-create-preview>i { font-style:normal; font-size:10px; }
.active-band-filter { display:flex; align-items:center; gap:8px; width:max-content; margin:0 0 15px; padding:8px 10px 8px 12px; border:1px solid #a8dec0; border-radius:999px; color:#086d3c; background:#ebf9f1; }.active-band-filter[hidden] { display:none; }.active-band-filter span { font-size:10px; opacity:.68; }.active-band-filter strong { font-size:11px; }.active-band-filter i { display:grid; place-items:center; width:17px; height:17px; border-radius:50%; background:#ccecd9; font-style:normal; }

.profile-screen { padding-bottom:118px; }.profile-header { padding-bottom:12px; }.profile-settings-button { display:grid; place-items:center; width:42px; height:42px; border:1px solid #dce3de; border-radius:15px; color:#344139; background:#fff; }.profile-settings-button svg { width:20px; fill:none; stroke:currentColor; stroke-width:1.5; }
.profile-hero { display:flex; gap:18px; align-items:center; margin:4px 22px 18px; }.profile-avatar { position:relative; width:88px; height:88px; flex:0 0 88px; padding:0; border:3px solid #fff; border-radius:29px; color:#fff; background:linear-gradient(145deg,#0d3624,#00ad57); box-shadow:0 12px 26px rgba(0,124,65,.22); overflow:hidden; }.profile-avatar>span { font-size:31px; font-weight:850; }.profile-avatar img { width:100%; height:100%; object-fit:cover; }.profile-avatar i { position:absolute; right:6px; bottom:6px; padding:4px 7px; border-radius:8px; color:#fff; background:rgba(7,18,12,.68); font-style:normal; font-size:9px; backdrop-filter:blur(8px); }
.profile-identity>span { display:inline-flex; padding:5px 8px; border-radius:8px; color:#078347; background:#dff4e8; font-size:9px; font-weight:800; }.profile-identity h2 { margin:8px 0 4px; font-size:24px; letter-spacing:-.04em; }.profile-identity p { margin:0; color:#7f8882; font-size:11px; }.profile-identity p i { margin-left:5px; color:#adb4af; font-style:normal; }.profile-identity>button { margin-top:9px; padding:0; border:0; color:#009a4d; background:transparent; font-size:11px; font-weight:750; }
.profile-energy-card { position:relative; display:flex; align-items:center; justify-content:space-between; min-height:130px; margin:0 22px 15px; padding:24px; border-radius:27px; color:#fff; background:linear-gradient(135deg,#0b1912,#143322); overflow:hidden; box-shadow:0 14px 30px rgba(14,36,24,.14); }.profile-energy-card>div { position:relative; z-index:1; display:flex; flex-direction:column; }.profile-energy-card span { color:#a9bdb1; font-size:11px; }.profile-energy-card strong { margin:4px 0; font-size:36px; letter-spacing:-.04em; }.profile-energy-card small { color:#8fa79a; font-size:10px; }.profile-energy-orbit { position:absolute; right:-22px; display:grid; place-items:center; width:150px; height:150px; }.profile-energy-orbit i { position:absolute; width:80px; height:80px; border:1px solid rgba(77,241,153,.28); border-radius:50%; }.profile-energy-orbit i:nth-child(2){width:116px;height:116px}.profile-energy-orbit i:nth-child(3){width:14px;height:14px;border:0;background:#00d56b;box-shadow:0 0 24px #00d56b}
.profile-energy-recharge { position:relative; z-index:2; display:flex; gap:7px; align-items:center; margin-left:14px; padding:9px 12px 9px 9px; border:1px solid rgba(181,255,214,.22); border-radius:14px; color:#effff6; background:rgba(255,255,255,.075); box-shadow:0 8px 22px rgba(0,0,0,.12); backdrop-filter:blur(12px); }
.profile-energy-recharge span { display:grid; place-items:center; width:24px; height:24px; border-radius:8px; color:#062415; background:#51e997; font-size:16px; font-weight:500; }
.profile-energy-recharge b { font-size:11px; letter-spacing:.02em; }

.energy-recharge-sheet { max-height:min(88dvh,760px); }
.energy-recharge-balance { display:flex; justify-content:space-between; align-items:flex-end; margin:14px 0 20px; padding:20px; border-radius:20px; color:#fff; background:linear-gradient(135deg,#0c1a14,#163a27); overflow:hidden; }
.energy-recharge-balance>span { display:flex; flex-direction:column; gap:4px; }
.energy-recharge-balance small { color:#9bb0a4; font-size:9px; }
.energy-recharge-balance strong { font-size:27px; letter-spacing:-.04em; }
.energy-recharge-balance strong i { color:#85a091; font-style:normal; font-size:10px; font-weight:600; letter-spacing:0; }
.energy-recharge-balance em { color:#65d99b; font:700 8px/1 ui-monospace,monospace; letter-spacing:.16em; }
.energy-package-fieldset { margin:0; padding:0; border:0; }
.energy-package-fieldset legend { margin-bottom:10px; color:#303b34; font-size:11px; font-weight:800; }
.energy-package-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.energy-package-grid button { display:flex; min-height:92px; flex-direction:column; align-items:flex-start; padding:14px; border:1px solid #dfe5e1; border-radius:17px; color:#303b34; background:#f8faf8; text-align:left; transition:border-color .16s ease,background-color .16s ease,transform .16s ease; }
.energy-package-grid button:active { transform:scale(.98); }
.energy-package-grid button>span { color:#068a47; font-size:22px; font-weight:850; letter-spacing:-.04em; }
.energy-package-grid button>strong { margin:5px 0 2px; font-size:11px; }
.energy-package-grid button>small { color:#939c96; font-size:8px; }
.energy-package-grid button.is-selected { border-color:#0aa458; background:#eaf8f0; box-shadow:inset 0 0 0 1px rgba(10,164,88,.12); }
.energy-recharge-summary { display:grid; grid-template-columns:1fr 1fr; margin:15px 0; border-top:1px solid #e4e8e5; border-bottom:1px solid #e4e8e5; }
.energy-recharge-summary>span { display:flex; flex-direction:column; gap:4px; padding:13px 10px; }
.energy-recharge-summary>span+span { border-left:1px solid #e4e8e5; }
.energy-recharge-summary small { color:#929a95; font-size:8px; }
.energy-recharge-summary strong { color:#273229; font-size:13px; }
.energy-recharge-notice { display:flex; gap:10px; align-items:flex-start; margin-bottom:14px; padding:12px 13px; border-radius:14px; background:#f3f5f3; }
.energy-recharge-notice>span { display:grid; place-items:center; width:21px; height:21px; flex:0 0 21px; border-radius:50%; color:#5c6b62; background:#e2e7e3; font:700 10px/1 ui-monospace,monospace; }
.energy-recharge-notice p { display:flex; flex-direction:column; gap:3px; margin:0; }
.energy-recharge-notice strong { color:#4b574f; font-size:10px; }
.energy-recharge-notice small { color:#8b948e; font-size:8px; line-height:1.55; }
.energy-recharge-submit { width:100%; margin:0; }
.energy-recharge-history { margin-top:18px; padding-top:14px; border-top:1px solid #e6e9e6; }
.energy-recharge-history>div:first-child { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.energy-recharge-history>div:first-child strong { color:#344038; font-size:11px; }
.energy-recharge-history>div:first-child small { color:#a0a7a2; font-size:8px; }
#energy-recharge-history-list article { display:flex; justify-content:space-between; align-items:center; padding:9px 2px; border-top:1px solid #eef0ee; }
#energy-recharge-history-list article span { display:flex; flex-direction:column; gap:2px; }
#energy-recharge-history-list article strong { color:#087c42; font-size:11px; }
#energy-recharge-history-list article small,#energy-recharge-history-list time { color:#969e99; font-size:8px; }
#energy-recharge-history-list p { margin:0; padding:12px 2px; color:#9ba39e; font-size:9px; }
.profile-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin:0 22px 18px; border:1px solid #dde4df; border-radius:23px; background:#dde4df; overflow:hidden; }.profile-stats button { display:flex; min-width:0; flex-direction:column; gap:2px; align-items:flex-start; padding:17px 13px; border:0; color:#202a24; background:#fff; text-align:left; }.profile-stats strong { font-size:21px; }.profile-stats span { font-size:11px; font-weight:750; }.profile-stats small { color:#9aa19d; font-size:8px; white-space:nowrap; }
.profile-quota { margin:0 22px 18px; padding:19px; border:1px solid #dde4df; border-radius:24px; background:#fff; }.profile-section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:15px; }.profile-section-heading>span { display:flex; flex-direction:column; }.profile-section-heading small { color:#00a653; font-size:9px; font-weight:800; text-transform:uppercase; }.profile-section-heading strong { font-size:16px; }.profile-section-heading em { color:#a0a7a2; font-style:normal; font-size:9px; }.profile-quota-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.profile-quota-grid>div { padding:12px; border-radius:16px; background:#f3f6f4; }.profile-quota-grid span { display:flex; flex-direction:column; }.profile-quota-grid small { color:#8d9690; font-size:8px; }.profile-quota-grid strong { margin:3px 0 9px; font-size:17px; }.profile-quota-grid strong i { color:#a7afaa; font-style:normal; font-size:9px; }.profile-quota-grid b { display:block; height:3px; border-radius:4px; background:#dfe5e1; overflow:hidden; }.profile-quota-grid b i { display:block; width:var(--quota); height:100%; border-radius:inherit; background:#00ad57; }
.profile-menu { margin:0 22px; border:1px solid #dde4df; border-radius:24px; background:#fff; overflow:hidden; }.profile-menu>button { display:flex; width:100%; gap:13px; align-items:center; padding:15px 16px; border:0; color:#273129; background:#fff; text-align:left; }.profile-menu>button+button { border-top:1px solid #edf0ee; }.profile-menu-icon { display:grid; place-items:center; width:38px; height:38px; border-radius:13px; color:#008d48; background:#e9f7ef; }.profile-menu>button>span:nth-child(2) { display:flex; flex:1; flex-direction:column; gap:3px; }.profile-menu strong { font-size:13px; }.profile-menu small { color:#929a95; font-size:9px; }.profile-menu>button>i { color:#9ea6a1; font-style:normal; }.profile-boundary-note { margin:16px 28px 0; color:#9aa19d; font-size:9px; line-height:1.55; text-align:center; }
.wave-source--button { appearance:none; padding:0; border:0; color:inherit; background:transparent; font:inherit; text-align:left; cursor:pointer; }.wave-source--button:hover span { color:#008e48; }.wave-source--button:focus-visible { outline:2px solid #00ad57; outline-offset:4px; border-radius:6px; }
.public-profile-sheet,.listened-frequencies-sheet { max-height:min(82dvh,720px); }.public-profile-hero { display:flex; gap:16px; align-items:center; padding:10px 0 18px; }.public-profile-avatar { display:grid; place-items:center; width:74px; height:74px; border-radius:25px; color:#fff; background:linear-gradient(145deg,#103f2a,#00ad57); font-size:22px; font-weight:850; }.public-profile-hero h3 { margin:0 0 6px; font-size:21px; }.public-profile-hero p { margin:0 0 4px; color:#5f6b63; font-size:11px; }.public-profile-hero div>span { color:#9aa29d; font-size:9px; }.public-profile-bio { margin:0 0 16px; padding:15px 17px; border-radius:17px; color:#465149; background:#f2f5f3; font-size:12px; line-height:1.6; }.public-profile-live { display:flex; justify-content:space-between; align-items:center; padding:16px 0; border-top:1px solid #e7ebe8; border-bottom:1px solid #e7ebe8; }.public-profile-live>span { display:flex; flex-direction:column; gap:3px; }.public-profile-live small { color:#8f9792; font-size:9px; }.public-profile-live strong { font-size:14px; }.public-profile-live button { padding:8px 11px; border:0; border-radius:11px; color:#008c47; background:#e6f6ed; font-size:10px; font-weight:800; }.public-profile-actions { display:grid; grid-template-columns:1fr 1.35fr; gap:10px; margin:18px 0 12px; }.public-profile-actions>button { height:50px; border:1px solid #cfe2d6; border-radius:16px; color:#08713e; background:#fff; font-weight:850; }.public-profile-actions>button.is-listening { color:#fff; background:#123124; border-color:#123124; }.public-profile-actions .primary-button { margin:0; color:#fff; background:#00a653; border-color:#00a653; }.public-profile-boundary { padding:13px 15px; border-radius:15px; background:#f6f7f6; }.public-profile-boundary span { color:#9aa19d; font-size:9px; }.public-profile-boundary p { margin:3px 0 0; color:#646e67; font-size:10px; }
.listened-frequencies-copy { margin:0 0 16px; color:#78817b; font-size:11px; line-height:1.65; }.listened-frequency-list { display:grid; gap:10px; }.listened-frequency-list article { display:grid; grid-template-columns:46px 1fr 34px; gap:11px; align-items:center; padding:12px; border:1px solid #e0e6e2; border-radius:18px; }.listened-frequency-list article>span { display:grid; place-items:center; width:46px; height:46px; border-radius:15px; color:#fff; background:#123124; font-size:13px; font-weight:850; }.listened-frequency-list article>button { border:0; background:transparent; text-align:left; }.listened-frequency-list article>button:nth-child(2) { display:flex; min-width:0; flex-direction:column; gap:4px; }.listened-frequency-list strong { color:#253029; font-size:13px; }.listened-frequency-list small { color:#8e9691; font-size:9px; }.listened-frequency-list article>button:last-child { display:grid; place-items:center; width:30px; height:30px; border-radius:10px; color:#8b948e; background:#f0f3f1; text-align:center; }.listened-frequency-empty { display:flex; min-height:220px; flex-direction:column; align-items:center; justify-content:center; color:#9aa29d; text-align:center; }.listened-frequency-empty[hidden]{display:none}.listened-frequency-empty span{font-size:35px;color:#00a653}.listened-frequency-empty strong{margin:12px 0 5px;color:#38433c;font-size:15px}.listened-frequency-empty small{max-width:240px;font-size:10px;line-height:1.55}
@keyframes band-bars { 0%,100%{transform:scaleY(.55)}50%{transform:scaleY(1)} }
@media (max-width:390px){.band-card{grid-template-columns:58px 1fr}.band-card__signal{width:58px;height:58px}.band-card>button{grid-column:2;width:max-content}.profile-stats small{display:none}.profile-quota-grid{grid-template-columns:1fr}.profile-quota-grid>div{display:flex;align-items:center;justify-content:space-between}.profile-quota-grid b{width:45%}}
@media (prefers-reduced-motion:reduce){.bands-intro__signal i,.band-card{animation:none}}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: #030806; }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--text); background: radial-gradient(circle at 50% -20%, #17372d 0, var(--bg) 38%, #030806 100%); }
button, input, textarea { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }

.app-shell { position: relative; width: min(100%, 480px); min-height: 100dvh; margin: 0 auto; overflow: hidden; background: linear-gradient(180deg, rgba(8, 19, 16, .94), rgba(4, 10, 8, .98)); box-shadow: 0 0 100px rgba(0,0,0,.45); }
.screen { display: none; min-height: 100dvh; padding: 0 20px 118px; }
.screen--active { display: block; }
.topbar, .simple-header { display: flex; align-items: center; justify-content: space-between; min-height: 88px; padding-top: env(safe-area-inset-top); }
.brand { display: flex; gap: 11px; align-items: center; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; }
.brand > span:last-child { display: flex; align-items: baseline; gap: 7px; }
.brand strong { font-size: 21px; letter-spacing: -.6px; }
.brand small { color: var(--muted); font-size: 12px; }
.brand-mark { display: flex; align-items: center; justify-content: center; gap: 2px; width: 35px; height: 35px; border-radius: 11px; background: var(--green); box-shadow: 0 0 28px rgba(97, 242, 167, .25); }
.brand-mark i { display: block; width: 3px; border-radius: 5px; background: #07110f; }
.brand-mark i:nth-child(1), .brand-mark i:nth-child(5) { height: 14px; }
.brand-mark i:nth-child(2), .brand-mark i:nth-child(4) { height: 8px; }
.brand-mark i:nth-child(3) { height: 19px; }
.brand-mark--small { width: 42px; height: 42px; border-radius: 50%; }
.brand-asset { position: relative; display: block; flex: 0 0 auto; overflow: hidden; background: #00a743; box-shadow: 0 8px 20px rgba(0,167,67,.2); }
.brand-asset img { position: absolute; top: 50%; left: 50%; width: 146.2%; max-width: none; transform: translate(-50%,-50%); }
.brand-asset--header { width: 35px; height: 35px; border-radius: 11px; }
.brand-asset--radar { width: 44px; height: 44px; border-radius: 50%; }
.brand-asset--transmit { z-index: 2; width: 48px; height: 48px; border-radius: 50%; box-shadow: none; }
.brand-asset--identity { z-index: 2; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,.18); border-radius: 11px; box-shadow: 0 0 18px rgba(50,255,154,.2); }
.brand-asset--onboarding { width: 60px; height: 60px; border-radius: 19px; }
.topbar-actions { display: flex; gap: 8px; align-items: center; }
.live-pill { display: inline-flex; align-items: center; gap: 6px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 999px; color: #b6d2c7; background: rgba(255,255,255,.025); font-size: 11px; }
.live-pill i, .expiry-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); animation: blink 1.8s infinite; }
.icon-button { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; color: #cce3da; background: rgba(255,255,255,.03); cursor: pointer; }
.icon-button svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.radar-hero { position: relative; padding-top: 28px; }
.eyebrow { display: block; margin-bottom: 7px; color: var(--green); font-size: 10px; font-weight: 700; letter-spacing: 1.9px; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
.radar-copy { position: relative; z-index: 3; max-width: 320px; }
.radar-copy h1, .simple-header h1 { margin-bottom: 10px; font-size: clamp(29px, 8vw, 38px); line-height: 1.08; letter-spacing: -1.8px; }
.radar-copy p { max-width: 280px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.radar { position: relative; width: 330px; height: 300px; margin: -15px auto -28px; transform: perspective(600px) rotateX(58deg) rotateZ(-9deg); }
.radar-ring { position: absolute; inset: 50%; border: 1px solid rgba(97,242,167,.2); border-radius: 50%; transform: translate(-50%, -50%); box-shadow: inset 0 0 40px rgba(97,242,167,.02); }
.ring-1 { width: 105px; height: 105px; }
.ring-2 { width: 210px; height: 210px; }
.ring-3 { width: 315px; height: 315px; border-color: rgba(97,242,167,.1); }
.radar::before, .radar::after { content: ""; position: absolute; z-index: 0; background: rgba(97,242,167,.11); }
.radar::before { top: 50%; left: 5%; width: 90%; height: 1px; }
.radar::after { top: 5%; left: 50%; width: 1px; height: 90%; }
.radar-sweep { position: absolute; z-index: 1; top: 50%; left: 50%; width: 155px; height: 155px; transform-origin: 0 0; background: conic-gradient(from 5deg, rgba(97,242,167,.4), rgba(97,242,167,0) 40deg, transparent 40deg); animation: sweep 4.2s linear infinite; }
.radar-core { position: absolute; z-index: 4; top: 50%; left: 50%; transform: translate(-50%, -50%) rotateZ(9deg) rotateX(-58deg); filter: drop-shadow(0 0 20px rgba(97,242,167,.35)); }
.signal-dot { position: absolute; z-index: 5; width: 8px; height: 8px; border: 2px solid #d8ffe9; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 7px rgba(97,242,167,.08), 0 0 20px var(--green); animation: signal 2.4s infinite; }
.dot-1 { top: 31%; left: 22%; }.dot-2 { top: 29%; right: 23%; animation-delay: .5s; }.dot-3 { bottom: 25%; left: 34%; animation-delay: 1s; }.dot-4 { bottom: 22%; right: 17%; animation-delay: 1.5s; }

.range-card, .send-range { display: grid; grid-template-columns: 1fr auto; gap: 2px 16px; padding: 16px 17px 13px; border: 1px solid var(--line); border-radius: 18px; background: rgba(16, 35, 29, .78); backdrop-filter: blur(14px); }
.range-card strong, .send-range strong { display: block; font-size: 13px; }.range-card small, .send-range small { color: var(--muted); font-size: 10px; }
.range-card output, .send-range output { align-self: center; color: var(--green); font-size: 13px; font-weight: 700; }
input[type="range"] { grid-column: 1 / -1; width: 100%; margin: 13px 0 5px; accent-color: var(--green); cursor: pointer; }
.range-marks { display: flex; grid-column: 1 / -1; justify-content: space-between; color: #547065; font-size: 8px; }.range-marks i { font-style: normal; }

.feed-section { margin-top: 35px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; }
.section-heading h2 { margin: 0; font-size: 20px; letter-spacing: -.6px; }
.gesture-hint { display: flex; justify-content: space-between; margin: -7px 1px 13px; color: #58736a; font-size: 9px; }.gesture-hint b { color: #91b1a5; }
.text-button { padding: 6px 0; border: 0; color: var(--muted); background: none; font-size: 11px; cursor: pointer; }.text-button:hover { color: var(--green); }.text-button.danger { color: var(--danger); }
.wave-feed { display: grid; gap: 12px; }
.wave-card { position: relative; overflow: hidden; padding: 16px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, rgba(17,35,30,.94), rgba(9,21,17,.96)); box-shadow: 0 12px 30px rgba(0,0,0,.12); animation: card-in .42s both; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.wave-card--pressing { border-color: rgba(255,126,136,.5); transform: scale(.985); transition: transform .65s linear, border-color .2s; }
.wave-card::after { content: ""; position: absolute; top: -50px; right: -50px; width: 130px; height: 130px; border-radius: 50%; background: radial-gradient(circle, var(--signal-color, rgba(97,242,167,.08)), transparent 67%); pointer-events: none; }
.wave-meta { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 10px; }
.wave-source { display: flex; align-items: center; gap: 8px; }.wave-source i { width: 7px; height: 7px; border-radius: 50%; background: var(--signal-accent, var(--green)); box-shadow: 0 0 10px var(--signal-accent, var(--green)); }
.wave-distance { display: flex; align-items: center; gap: 4px; }.wave-distance::before { content: "⌁"; color: var(--green); font-size: 14px; }
.wave-content { margin: 15px 0 13px; font-size: 16px; line-height: 1.5; letter-spacing: -.2px; }
.wave-card[data-type="audio"] .wave-content { display: flex; align-items: center; gap: 12px; }
.audio-play { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border: 0; border-radius: 50%; color: #06110d; background: var(--green); cursor: pointer; }
.waveform { display: flex; align-items: center; gap: 3px; height: 27px; }.waveform i { width: 2px; height: var(--h); border-radius: 2px; background: #b7d3c8; }
.media-swatch { display: grid; place-items: center; min-height: 138px; margin: 14px 0; border-radius: 15px; color: rgba(255,255,255,.85); background: radial-gradient(circle at 70% 20%, rgba(255,215,122,.45), transparent 32%), linear-gradient(135deg, #254c44, #101c2c 55%, #3d2438); font-size: 32px; }
.media-swatch.video { background: radial-gradient(circle at 40% 40%, rgba(97,242,167,.26), transparent 25%), linear-gradient(145deg, #111e2b, #2d2133); }
.expiry { display: flex; align-items: center; gap: 8px; color: #6e8d81; font-size: 9px; }.expiry-track { flex: 1; height: 2px; overflow: hidden; border-radius: 2px; background: rgba(255,255,255,.08); }.expiry-track i { display: block; width: var(--life); height: 100%; background: linear-gradient(90deg, var(--green), var(--amber)); transition: width 1s linear; }
.empty-state { padding: 44px 20px; text-align: center; color: var(--muted); }.empty-state .empty-wave { display: block; color: var(--green); font-size: 46px; }.empty-state h3 { margin-bottom: 5px; color: #d9eee5; font-size: 16px; }.empty-state p { font-size: 11px; }

.simple-header { align-items: flex-end; padding-bottom: 12px; }.simple-header h1 { margin: 0; font-size: 27px; }
.privacy-card { display: flex; gap: 13px; margin: 13px 0 22px; padding: 16px; border: 1px solid rgba(97,242,167,.14); border-radius: 18px; background: rgba(97,242,167,.055); }.privacy-icon { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 50%; color: var(--green); background: rgba(97,242,167,.1); font-size: 26px; }.privacy-card strong { font-size: 12px; }.privacy-card p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }

.bottom-nav { position: fixed; z-index: 20; right: max(0px, calc((100vw - 480px)/2)); bottom: 0; left: max(0px, calc((100vw - 480px)/2)); display: grid; grid-template-columns: 1fr 100px 1fr; align-items: end; height: calc(82px + env(safe-area-inset-bottom)); padding: 8px 24px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(5,13,10,.9); backdrop-filter: blur(22px); }
.nav-item { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 5px 10px; border: 0; color: #607b70; background: none; font-size: 9px; cursor: pointer; }.nav-item svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }.nav-item--active { color: var(--green); }
.nav-item[data-nav="radar"] svg circle { fill:currentColor; stroke:none; }
.transmit-button { position: relative; display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 12px; border: 0; border-radius: 50%; color: #07110f; background: var(--green); box-shadow: 0 0 0 7px #07110f, 0 0 0 8px rgba(97,242,167,.18), 0 8px 32px rgba(32,204,122,.3); cursor: pointer; }.transmit-button svg { z-index: 2; width: 25px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }.transmit-ripple { position: absolute; inset: -1px; border: 1px solid var(--green); border-radius: 50%; animation: ripple 2.4s infinite; }

.sheet-backdrop { position: fixed; z-index: 30; inset: 0; background: rgba(0,0,0,.68); backdrop-filter: blur(5px); }
.bottom-sheet { position: fixed; z-index: 40; right: max(0px, calc((100vw - 480px)/2)); bottom: 0; left: max(0px, calc((100vw - 480px)/2)); max-height: 93dvh; overflow-y: auto; padding: 8px 20px calc(24px + env(safe-area-inset-bottom)); border: 1px solid var(--line); border-bottom: 0; border-radius: 26px 26px 0 0; background: #0b1714; box-shadow: var(--shadow); animation: sheet-up .28s ease-out; }
.sheet-handle { width: 42px; height: 4px; margin: 0 auto 18px; border-radius: 3px; background: #31473f; }
.bottom-sheet header { display: flex; align-items: flex-start; justify-content: space-between; }.bottom-sheet h2 { margin-bottom: 4px; font-size: 25px; letter-spacing: -1px; }.bottom-sheet header .icon-button { border: 0; font-size: 24px; }
.type-picker { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 18px 0; }.type-button { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 10px 5px; border: 1px solid var(--line); border-radius: 14px; color: #759287; background: rgba(255,255,255,.02); font-size: 9px; cursor: pointer; }.type-button span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #a7c1b7; background: rgba(255,255,255,.05); font-size: 14px; }.type-button .type-asset { position: relative; display: block; overflow: hidden; background: #000; }.type-asset img { position: absolute; top: 50%; left: 50%; width: 183.5%; max-width: none; transform: translate(-50%,-50%); }.type-button--active { border-color: rgba(97,242,167,.3); color: var(--green); background: rgba(97,242,167,.07); }.type-button--active span { color: #06110d; background: var(--green); }.type-button--active .type-asset { background: #000; }
.compose-field { position: relative; display: block; }.compose-field > span { display: block; margin-bottom: 8px; color: #aec5bc; font-size: 11px; }.compose-field textarea { width: 100%; min-height: 115px; resize: none; padding: 15px 15px 28px; border: 1px solid var(--line); border-radius: 15px; color: var(--text); background: rgba(255,255,255,.025); line-height: 1.5; }.compose-field textarea::placeholder { color: #4e675e; }.compose-field small { position: absolute; right: 12px; bottom: 10px; color: #526b62; font-size: 9px; }
.attachment-preview { display: flex; align-items: center; gap: 13px; margin-top: 12px; padding: 11px; border-radius: 14px; background: rgba(255,255,255,.035); }.preview-visual { display: flex; align-items: center; justify-content: center; gap: 2px; flex: 0 0 48px; height: 48px; border-radius: 10px; color: var(--green); background: linear-gradient(145deg,#16372d,#0b2019); }.preview-visual i { display: none; width: 2px; height: 12px; background: var(--green); }.attachment-preview strong { display: block; font-size: 11px; }.attachment-preview small { color: var(--muted); font-size: 9px; }
.send-range { margin-top: 14px; background: rgba(255,255,255,.025); }.expiry-row { display: flex; align-items: center; gap: 11px; margin: 14px 2px; }.expiry-row > span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; }.expiry-row strong { font-size: 10px; }.expiry-row small { color: var(--muted); font-size: 9px; }
.primary-button { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; height: 52px; border: 0; border-radius: 16px; color: #06110d; background: var(--green); font-weight: 800; cursor: pointer; box-shadow: 0 12px 30px rgba(32,204,122,.18); }.primary-button svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.info-sheet > p { color: var(--muted); font-size: 12px; line-height: 1.7; }.principles { display: grid; gap: 9px; margin-top: 17px; }.principles > div { display: grid; grid-template-columns: 36px 1fr; padding: 13px; border: 1px solid var(--line); border-radius: 14px; }.principles b { grid-row: 1 / 3; color: var(--green); font-size: 11px; }.principles strong { font-size: 11px; }.principles small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.about-brand { display: flex; align-items: center; gap: 13px; margin: 14px 0 10px; padding: 10px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.03); }.about-brand > img { width: 58px; height: 58px; border-radius: 14px; object-fit: cover; }.about-brand > span { display: flex; flex-direction: column; gap: 3px; }.about-brand strong { color: var(--text); font-size: 17px; letter-spacing: -.5px; }.about-brand small { color: var(--muted); font-size: 9px; }
.device-pass { display: flex; align-items: center; gap: 13px; margin: 10px 0 14px; padding: 14px; border: 1px solid rgba(97,242,167,.18); border-radius: 16px; background: linear-gradient(135deg, rgba(97,242,167,.09), rgba(97,242,167,.02)); }.device-pass__icon { position: relative; display: block; flex: 0 0 42px; height: 42px; overflow: hidden; border-radius: 13px; background: #08a9df; }.device-pass__icon img { position: absolute; top: 50%; left: 50%; width: 183.5%; max-width: none; transform: translate(-50%,-50%); }.device-pass div { display: grid; gap: 2px; }.device-pass small { color: var(--muted); font-size: 9px; }.device-pass strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; letter-spacing: 1px; }.device-pass em { display: flex; align-items: center; gap: 5px; color: #83ad9d; font-size: 8px; font-style: normal; }.device-pass em i { width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.report-target { display: flex; align-items: center; gap: 13px; margin: 16px 0 12px; padding: 14px; border: 1px solid rgba(255,126,136,.14); border-radius: 16px; background: rgba(255,126,136,.045); }.jammed-signal { display: grid; place-items: center; flex: 0 0 42px; height: 42px; border-radius: 50%; color: var(--danger); background: rgba(255,126,136,.1); font-size: 29px; }.report-target div { min-width: 0; }.report-target small { display: block; margin-bottom: 4px; color: var(--danger); font-size: 9px; }.report-target strong { display: block; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.report-explainer { color: var(--muted); font-size: 10px; line-height: 1.6; }
.report-reasons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.report-reasons button { display: flex; flex-direction: column; gap: 3px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; color: #b7cec5; background: rgba(255,255,255,.025); text-align: left; cursor: pointer; }.report-reasons button span { font-size: 11px; font-weight: 700; }.report-reasons button small { color: #607b70; font-size: 8px; }.report-reasons button[aria-checked="true"] { border-color: rgba(255,126,136,.5); color: #ffdadd; background: rgba(255,126,136,.09); }.report-reasons button[aria-checked="true"] small { color: #d38c92; }
.consensus-note { display: flex; align-items: center; gap: 12px; margin: 13px 0; padding: 11px 2px; }.consensus-meter { position: relative; flex: 0 0 38px; height: 38px; border: 3px solid #253c34; border-radius: 50%; }.consensus-meter::after { content: "85"; position: absolute; inset: 0; display: grid; place-items: center; color: var(--green); font-size: 8px; }.consensus-meter i { position: absolute; inset: -3px; border: 3px solid transparent; border-top-color: var(--green); border-right-color: var(--green); border-bottom-color: var(--green); border-radius: 50%; transform: rotate(18deg); }.consensus-note > span:last-child { display: flex; flex-direction: column; gap: 3px; }.consensus-note strong { font-size: 10px; }.consensus-note small { color: var(--muted); font-size: 8px; }
.primary-button--danger { color: #21080a; background: var(--danger); box-shadow: 0 12px 30px rgba(255,126,136,.13); }.primary-button:disabled { opacity: .32; cursor: not-allowed; box-shadow: none; }.cancel-button { width: 100%; margin-top: 7px; padding: 10px; border: 0; color: var(--muted); background: none; font-size: 10px; cursor: pointer; }
.toast { position: fixed; z-index: 60; left: 50%; bottom: 105px; max-width: calc(100% - 40px); padding: 11px 16px; border: 1px solid rgba(97,242,167,.2); border-radius: 999px; color: #dffbed; background: rgba(13,29,24,.96); box-shadow: var(--shadow); font-size: 11px; opacity: 0; pointer-events: none; transform: translate(-50%, 14px); transition: .25s; }.toast--visible { opacity: 1; transform: translate(-50%, 0); }

/* Longwave high-priority arrival bubble */
.longwave-priority-notice { --longwave-notice-color:#0b9a58; position:fixed; z-index:90; top:max(12px,env(safe-area-inset-top)); left:50%; display:grid; grid-template-columns:minmax(0,1fr) 42px; width:min(430px,calc(100vw - 24px)); padding:6px; border:1px solid color-mix(in srgb,var(--longwave-notice-color) 48%,rgba(255,255,255,.2)); border-radius:20px; color:#f5fff9; background:rgba(9,24,16,.96); box-shadow:0 18px 50px rgba(3,16,9,.34),0 0 0 1px rgba(255,255,255,.035) inset; opacity:0; overflow:hidden; transform:translate(-50%,-18px) scale(.98); transition:opacity .2s ease,transform .24s cubic-bezier(.2,.8,.2,1); backdrop-filter:blur(20px) saturate(1.2); }
.longwave-priority-notice[hidden] { display:none; }
.longwave-priority-notice--visible { opacity:1; transform:translate(-50%,0) scale(1); }
.longwave-priority-notice::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--longwave-notice-color); box-shadow:0 0 18px var(--longwave-notice-color); }
.longwave-priority-notice__body { display:grid; grid-template-columns:44px minmax(0,1fr) 18px; gap:11px; min-width:0; align-items:center; padding:8px 8px 8px 9px; border:0; color:inherit; background:transparent; text-align:left; cursor:pointer; }
.longwave-priority-notice__signal { display:grid; width:44px; height:44px; place-items:center; border-radius:14px; color:#07150d; background:color-mix(in srgb,var(--longwave-notice-color) 78%,#fff); box-shadow:0 8px 20px color-mix(in srgb,var(--longwave-notice-color) 22%,transparent); font-size:20px; font-weight:900; }
.longwave-priority-notice__copy { display:flex; min-width:0; flex-direction:column; gap:3px; }
.longwave-priority-notice__copy small { overflow:hidden; color:color-mix(in srgb,var(--longwave-notice-color) 58%,#fff); font-size:8px; font-weight:800; letter-spacing:.03em; text-overflow:ellipsis; white-space:nowrap; }
.longwave-priority-notice__copy strong { overflow:hidden; color:#f6fff9; font-size:12px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
.longwave-priority-notice__copy>span { overflow:hidden; color:#a7b9ae; font-size:9px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
.longwave-priority-notice__body>i { color:#7f9488; font-style:normal; font-size:14px; }
.longwave-priority-notice__close { align-self:stretch; border:0; border-left:1px solid rgba(223,255,237,.1); border-radius:0 14px 14px 0; color:#b4c3ba; background:transparent; font-size:23px; font-weight:300; cursor:pointer; }
.longwave-priority-notice__close:hover { color:#fff; background:rgba(255,255,255,.045); }
.longwave-priority-notice :is(button):focus-visible { outline:2px solid color-mix(in srgb,var(--longwave-notice-color) 72%,#fff); outline-offset:-2px; }
.longwave-card--targeted { animation:longwave-target-pulse 2.5s ease both!important; }
@keyframes longwave-target-pulse { 0%,100%{box-shadow:0 6px 20px rgba(28,39,32,.035)} 18%,62%{border-color:var(--longwave-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--longwave-color) 14%,transparent),0 16px 36px color-mix(in srgb,var(--longwave-color) 13%,transparent);transform:translateY(-2px)} }
@media(max-width:390px){.longwave-priority-notice{width:calc(100vw - 16px);grid-template-columns:minmax(0,1fr) 38px}.longwave-priority-notice__body{grid-template-columns:40px minmax(0,1fr);gap:9px}.longwave-priority-notice__signal{width:40px;height:40px}.longwave-priority-notice__body>i{display:none}}
@media(prefers-reduced-motion:reduce){.longwave-priority-notice{transition:opacity .12s}.longwave-card--targeted{animation:none!important;outline:3px solid var(--longwave-color);outline-offset:3px}}

@keyframes sweep { to { transform: rotate(360deg); } }
@keyframes signal { 50% { opacity: .4; transform: scale(.7); } }
@keyframes blink { 50% { opacity: .45; } }
@keyframes ripple { to { opacity: 0; transform: scale(1.42); } }
@keyframes sheet-up { from { opacity: .4; transform: translateY(50%); } }
@keyframes card-in { from { opacity: 0; transform: translateY(12px); } }
@media (min-width: 700px) { body { padding: 22px 0; }.app-shell { min-height: calc(100dvh - 44px); border: 1px solid var(--line); border-radius: 30px; }.screen { min-height: calc(100dvh - 44px); }.bottom-nav { bottom: 22px; border-radius: 0 0 30px 30px; }.bottom-sheet { bottom: 22px; border-radius: 26px; }.sheet-backdrop { background: rgba(0,0,0,.75); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Brand alignment: derived from the original Waves UI and logo assets. */
:root {
  color-scheme: light;
  --bg: #f3f4f3;
  --surface: #ffffff;
  --surface-2: #f7f8f7;
  --line: rgba(15, 25, 21, .09);
  --text: #121513;
  --muted: #7b8581;
  --green: #00aa49;
  --green-2: #00c464;
  --cyan: #08a9df;
  --amber: #ffb800;
  --danger: #f13a48;
  --shadow: 0 20px 50px rgba(22, 36, 29, .11);
}

html { background: #e8ebe9; }
body { background: linear-gradient(135deg, #edf0ee, #dfe5e2); }
.app-shell { background: var(--bg); box-shadow: 0 0 80px rgba(27, 42, 35, .18); }
.topbar { margin: 0 -20px; padding-right: 20px; padding-left: 20px; background: rgba(255,255,255,.95); }
.brand-mark { background: var(--cyan); box-shadow: 0 8px 20px rgba(8,169,223,.2); }
.brand-mark i { background: #fff; }
.brand strong, .radar-copy h1, .simple-header h1, .section-heading h2, .bottom-sheet h2 { color: var(--text); }
.brand small, .radar-copy p { color: var(--muted); }
.live-pill { border-color: #e7ece9; color: #557068; background: #f7faf8; }
.live-pill i { background: var(--green); box-shadow: 0 0 8px rgba(0,170,73,.4); }
.icon-button { border-color: #e4e9e6; color: #202522; background: #fff; box-shadow: 0 4px 14px rgba(16,32,23,.06); }
.radar-hero { margin: 0 -20px; padding: 28px 20px 23px; background: #fff; box-shadow: 0 10px 24px rgba(30,48,39,.04); }
.radar-ring { border-color: rgba(0,170,73,.2); }
.ring-3 { border-color: rgba(0,170,73,.1); }
.radar::before, .radar::after { background: rgba(0,170,73,.1); }
.radar-sweep { background: conic-gradient(from 5deg, rgba(0,170,73,.3), rgba(0,170,73,0) 40deg, transparent 40deg); }
.radar-core .brand-mark { background: var(--green); box-shadow: 0 0 26px rgba(0,170,73,.22); }
.signal-dot { border-color: #fff; background: var(--cyan); box-shadow: 0 0 0 6px rgba(8,169,223,.09), 0 0 16px rgba(8,169,223,.45); }
.range-card, .send-range { border-color: #e6ebe8; background: #f7f9f8; backdrop-filter: none; }
.range-card strong, .send-range strong, .privacy-card strong { color: var(--text); }
.range-card small, .send-range small { color: var(--muted); }
.range-marks { color: #a2aaa6; }
.feed-section { margin-top: 28px; }
.eyebrow { color: var(--green); }
.text-button { color: #6f7c76; }
.gesture-hint { color: #909a95; }
.wave-card { border-color: #e6eae8; background: #fff; box-shadow: 0 8px 24px rgba(27, 42, 35, .055); }
.wave-card--received { border-left: 4px solid var(--cyan); }
.wave-card--mine { border-left: 4px solid var(--green); }
.wave-card--pressing { border-color: rgba(241,58,72,.45); }
.wave-meta { color: #77837e; }
.wave-card--received .wave-source i { background: var(--cyan); box-shadow: 0 0 8px rgba(8,169,223,.4); }
.wave-card--mine .wave-source i { background: var(--green); box-shadow: 0 0 8px rgba(0,170,73,.4); }
.wave-distance::before { color: var(--cyan); }
.wave-content { color: #151917; }
.audio-play { color: #fff; background: var(--cyan); }
.waveform i { background: var(--cyan); }
.media-swatch { color: #fff; background: radial-gradient(circle at 74% 20%, rgba(255,202,91,.8), transparent 31%), linear-gradient(135deg, #08a9df, #056fa5 58%, #22474e); }
.media-swatch.video { background: radial-gradient(circle at 40% 40%, rgba(255,255,255,.25), transparent 25%), linear-gradient(145deg, #00aa49, #087d50); }
.expiry { color: #9aa39f; }
.expiry-track { background: #edf0ee; }
.expiry-track i { background: linear-gradient(90deg, var(--cyan), var(--green)); }
.privacy-card { border-color: rgba(0,170,73,.15); background: rgba(0,170,73,.055); }
.privacy-icon { color: var(--green); background: rgba(0,170,73,.1); }
.privacy-card p { color: var(--muted); }
.bottom-nav { grid-template-columns: repeat(5, 1fr); height: calc(78px + env(safe-area-inset-bottom)); border-top-color: #e4e8e6; background: rgba(255,255,255,.96); box-shadow: 0 -9px 28px rgba(32,46,39,.07); backdrop-filter: blur(18px); }
.nav-item { padding: 5px 2px; color: #9ba29f; }
.nav-item svg { width: 23px; }
.nav-item--active { color: #111; }
.nav-item--active span { color: var(--green); }
.transmit-button { width: 60px; height: 60px; margin-bottom: 13px; color: #fff; background: var(--green); box-shadow: 0 0 0 7px #fff, 0 0 0 8px rgba(0,170,73,.13), 0 8px 28px rgba(0,170,73,.25); }
.transmit-ripple { border-color: var(--green); }
.sheet-backdrop { background: rgba(16, 24, 20, .42); }
.bottom-sheet { border-color: #e5e9e7; background: #fff; }
.sheet-handle { background: #d4dbd7; }
.type-button { border-color: #e5eae7; color: #7f8984; background: #fafbfa; }
.type-button span { color: #6f7b75; background: #edf1ef; }
.type-button--active { border-color: rgba(0,170,73,.28); color: var(--green); background: rgba(0,170,73,.055); }
.type-button--active span { color: #fff; background: var(--green); }
.compose-field > span { color: #5e6d66; }
.compose-field textarea { border-color: #e2e8e4; color: var(--text); background: #f8faf9; }
.compose-field textarea::placeholder { color: #a7afab; }
.attachment-preview { background: #f5f8f6; }
.attachment-preview strong, .expiry-row strong { color: var(--text); }
.send-range { background: #f7f9f8; }
.primary-button { color: #fff; background: var(--green); box-shadow: 0 12px 28px rgba(0,170,73,.18); }
.info-sheet > p { color: var(--muted); }
.principles > div { border-color: #e4e9e6; background: #fbfcfb; }
.principles strong { color: var(--text); }
.device-pass { border-color: rgba(0,170,73,.17); background: linear-gradient(135deg, rgba(0,170,73,.08), rgba(8,169,223,.05)); }
.device-pass__icon { color: #fff; background: var(--cyan); }
.device-pass strong, .report-target strong, .consensus-note strong { color: var(--text); }
.report-target { border-color: rgba(241,58,72,.15); background: rgba(241,58,72,.045); }
.jammed-signal { color: var(--danger); background: rgba(241,58,72,.09); }
.report-explainer { color: var(--muted); }
.report-reasons button { border-color: #e3e8e5; color: #333b37; background: #fafbfa; }
.report-reasons button[aria-checked="true"] { border-color: rgba(241,58,72,.45); color: #b41f2b; background: rgba(241,58,72,.07); }
.consensus-meter { border-color: #e1e7e3; }
.primary-button--danger { color: #fff; background: var(--danger); }
.toast { border-color: rgba(0,170,73,.18); color: #fff; background: rgba(13,32,23,.94); }
.empty-state h3 { color: #3d4742; }
.empty-state { color: var(--muted); }

@media (min-width: 700px) {
  .app-shell { border-color: rgba(20,35,27,.08); }
  .bottom-nav { border-radius: 0 0 30px 30px; }
}

.wave-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin: 13px -5px -7px; padding-top: 9px; border-top: 1px solid #eef1ef; }
.wave-action { display: flex; align-items: center; justify-content: center; gap: 4px; min-height: 34px; padding: 4px 2px; border: 0; border-radius: 9px; color: #7f8984; background: transparent; font-size: 9px; cursor: pointer; }
.wave-action span { font-size: 17px; line-height: 1; }
.wave-action b { color: #a0a9a5; font-size: 8px; font-weight: 600; }
.wave-action:hover { color: var(--green); background: rgba(0,170,73,.05); }
.wave-action--active { color: var(--danger); }
.wave-action--active span { font-weight: 800; }
.wave-action--recommended { color: var(--green); background: rgba(0,170,73,.055); }
.wave-action:disabled { opacity: .38; cursor: default; }

.echo-sheet { display: flex; flex-direction: column; height: min(91dvh, 790px); overflow: hidden; }
.echo-parent { flex: 0 0 auto; margin: 15px 0 12px; padding: 15px; border: 1px solid #e4e9e6; border-left: 4px solid var(--cyan); border-radius: 16px; background: #f9fbfa; }
.echo-parent__meta { display: flex; justify-content: space-between; color: #79857f; font-size: 9px; }
.echo-parent p { margin: 10px 0 12px; color: var(--text); font-size: 14px; line-height: 1.5; }
.echo-parent__expiry { display: flex; align-items: center; gap: 5px; color: #96a09b; font-size: 8px; }
.echo-parent__expiry strong { color: var(--green); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; }
.echo-thread-heading { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; padding: 0 2px 9px; }
.echo-thread-heading strong { color: var(--text); font-size: 12px; }
.echo-thread-heading small { color: var(--muted); font-size: 9px; }
.echo-thread { display: grid; flex: 1 1 auto; gap: 10px; min-height: 70px; overflow-y: auto; padding: 1px 2px 12px; overscroll-behavior: contain; }
.echo-item { display: grid; grid-template-columns: 32px 1fr; gap: 9px; align-items: start; }
.echo-avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: #fff; background: var(--cyan); font-size: 17px; }
.echo-item--mine .echo-avatar { background: var(--green); font-size: 9px; font-weight: 700; }
.echo-item > div { min-width: 0; padding: 9px 11px; border-radius: 3px 13px 13px 13px; background: #f1f4f2; }
.echo-item--mine > div { background: rgba(0,170,73,.075); }
.echo-item small { display: block; margin-bottom: 3px; color: #77837d; font-size: 8px; }
.echo-item p { margin: 0; color: #202522; font-size: 11px; line-height: 1.45; }
.echo-audio-chip { display: inline-grid; place-items: center; width: 23px; height: 23px; margin-right: 6px; border-radius: 50%; color: #fff; background: var(--green); font-size: 14px; vertical-align: middle; }
.echo-empty { display: flex; flex: 1 1 auto; flex-direction: column; align-items: center; justify-content: center; min-height: 100px; color: var(--muted); text-align: center; }
.echo-empty > span { color: var(--cyan); font-size: 30px; }
.echo-empty strong { margin: 3px 0; color: #4c5852; font-size: 11px; }
.echo-empty small { font-size: 8px; }
.echo-composer { flex: 0 0 auto; padding: 10px; border: 1px solid #dfe6e2; border-radius: 16px; background: #f7f9f8; }
.echo-composer textarea { width: 100%; resize: none; padding: 2px 3px 7px; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 12px; line-height: 1.45; }
.echo-composer textarea::placeholder { color: #a6afaa; }
.echo-composer__tools { display: flex; align-items: center; gap: 8px; }
.echo-composer__tools small { margin-left: auto; color: #9aa39f; font-size: 8px; }
.echo-audio { display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 50%; color: #fff; background: var(--cyan); font-size: 17px; cursor: pointer; }
.echo-send { min-width: 78px; height: 32px; border: 0; border-radius: 10px; color: #fff; background: var(--green); font-size: 10px; font-weight: 700; cursor: pointer; }
.echo-rule { flex: 0 0 auto; margin: 8px 2px 0; color: #929d98; font-size: 8px; line-height: 1.4; text-align: center; }

.send-range-marks { margin-top: -1px; }
.send-policy { margin-top: 12px; padding: 14px; border: 1px solid #dfe6e2; border-radius: 17px; background: linear-gradient(145deg, #fbfdfc, #f2f7f4); }
.send-policy__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.band-badge { padding: 5px 9px; border-radius: 999px; color: #fff; background: var(--cyan); font-size: 8px; font-weight: 800; letter-spacing: .5px; }
.energy-balance { color: #84908a; font-size: 8px; }.energy-balance b { color: var(--green); font-size: 11px; }
.send-policy > strong { display: block; color: var(--text); font-size: 12px; }
.send-policy > p { margin: 4px 0 12px; color: var(--muted); font-size: 8px; line-height: 1.5; }
.send-policy__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.send-policy__stats > span { min-width: 0; padding: 9px 7px; border: 1px solid #e5ebe7; border-radius: 11px; background: #fff; }
.send-policy__stats small { display: block; margin-bottom: 3px; overflow: hidden; color: #929c97; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.send-policy__stats b { display: block; overflow: hidden; color: #25302a; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.country-boundary { display: flex; align-items: center; gap: 9px; margin-top: 10px; padding: 9px 10px; border-radius: 11px; color: var(--green); background: rgba(0,170,73,.065); }
.country-boundary > span:first-child { font-size: 19px; }
.country-boundary > span:last-child { display: flex; flex-direction: column; gap: 2px; }.country-boundary strong { color: #16623a; font-size: 8px; }.country-boundary small { color: #729083; font-size: 7px; }
.upgrade-route { display: grid; grid-template-columns: auto 1fr; gap: 3px 8px; margin-top: 9px; padding-top: 9px; border-top: 1px dashed #dbe5df; }
.upgrade-route span { color: var(--green); font-size: 8px; font-weight: 800; }
.upgrade-route b { color: #4d5c54; font-size: 8px; text-align: right; }
.upgrade-route small { grid-column: 1 / -1; color: #8a9690; font-size: 7px; line-height: 1.45; }

/* Opportunity relay: transport can hop, visibility cannot. */
.relay-status { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; width: 100%; margin-top: 10px; padding: 11px 12px; border: 1px solid rgba(8,169,223,.16); border-radius: 15px; color: inherit; text-align: left; background: linear-gradient(135deg, rgba(8,169,223,.065), rgba(0,170,73,.045)); cursor: pointer; }
.relay-status__signal { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #fff; box-shadow: 0 5px 15px rgba(8,169,223,.09); }
.relay-status__signal i { position: absolute; border: 1px solid rgba(8,169,223,.38); border-radius: 50%; }
.relay-status__signal i:nth-child(1) { width: 7px; height: 7px; border: 0; background: var(--cyan); }
.relay-status__signal i:nth-child(2) { width: 18px; height: 18px; }
.relay-status__signal i:nth-child(3) { width: 29px; height: 29px; opacity: .6; }
.relay-status > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.relay-status strong { color: var(--text); font-size: 10px; }
.relay-status small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.relay-status em { display: flex; align-items: center; gap: 5px; color: var(--green); font-size: 8px; font-style: normal; font-weight: 800; white-space: nowrap; }
.relay-status em i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px rgba(0,170,73,.45); animation: blink 1.8s infinite; }
.relay-status em.relay-status-state--off { color: #9aa29e; }

.identity-entry { position: relative; }
.identity-entry > i { position: absolute; right: 2px; bottom: 2px; width: 8px; height: 8px; border: 2px solid #fff; border-radius: 50%; background: var(--amber); }
.identity-entry > i.identity-entry-state--protected { background: var(--green); }
.identity-entry > i.identity-entry-state--trusted { background: var(--cyan); box-shadow: 0 0 0 3px rgba(8,169,223,.12); }

.identity-sheet { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
.identity-hero { display: flex; align-items: center; gap: 15px; margin: 14px 0 10px; padding: 17px; overflow: hidden; border-radius: 20px; color: #fff; background: radial-gradient(circle at 12% 40%, rgba(79,255,171,.2), transparent 28%), linear-gradient(135deg, #071411, #0b3228); }
.identity-orbit { position: relative; display: grid; place-items: center; flex: 0 0 62px; height: 62px; }
.identity-orbit::before, .identity-orbit::after, .identity-orbit i { position: absolute; border: 1px solid rgba(112,255,187,.25); border-radius: 50%; content: ""; }
.identity-orbit::before { inset: 2px; animation: pulse-ring 2.6s infinite; }
.identity-orbit::after { inset: 10px; }
.identity-orbit i:first-child { inset: 18px; }
.identity-orbit b { color: #79ffc0; font-size: 29px; font-weight: 500; }
.identity-hero > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.identity-hero small { color: rgba(255,255,255,.58); font-size: 7px; }
.identity-hero strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 18px; letter-spacing: .7px; }
.identity-hero em { align-self: flex-start; padding: 4px 7px; border-radius: 999px; color: #6fffb6; background: rgba(69,255,157,.1); font-size: 7px; font-style: normal; font-weight: 800; }
.identity-frequency-code-actions { display:flex; gap:8px; align-items:center; }
.identity-frequency-code-actions em { align-self:auto; }
.identity-frequency-code-actions button { padding:4px 7px; border:1px solid rgba(255,255,255,.14); border-radius:8px; color:#d8eee1; background:rgba(255,255,255,.055); font-size:7px; font-weight:750; }
.identity-intro { margin: 0 3px 10px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.identity-boundaries { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 12px; }
.identity-boundaries span { padding: 5px 7px; border-radius: 999px; color: #447361; background: #eef7f2; font-size: 7px; font-weight: 700; }
.identity-protection { padding: 13px; border: 1px solid rgba(0,170,73,.14); border-radius: 17px; background: rgba(0,170,73,.045); }
.identity-protection > div { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.identity-protection__icon { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 50%; color: #fff; background: var(--green); font-size: 21px; }
.identity-protection > div > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.identity-protection small { color: #789087; font-size: 7px; }
.identity-protection strong { color: #21352b; font-size: 9px; }
.device-integrity { margin-top: 10px; padding: 13px; border: 1px solid rgba(8,169,223,.16); border-radius: 17px; background: rgba(8,169,223,.035); transition: border-color .2s ease, background .2s ease; }
.device-integrity__header { display: flex; align-items: center; gap: 9px; }
.device-integrity__header > span:nth-child(2) { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 2px; }
.device-integrity__header small { color: #718b92; font-size: 7px; }
.device-integrity__header strong { color: #17343b; font-size: 9px; }
.device-integrity__header em { padding: 4px 7px; border-radius: 999px; color: #087b9f; background: rgba(8,169,223,.1); font-size: 7px; font-style: normal; font-weight: 900; }
.device-integrity__icon { display: grid; place-items: center; flex: 0 0 30px; height: 30px; border-radius: 50%; color: white; background: var(--cyan); font-size: 12px; font-weight: 900; }
.device-integrity p { margin: 10px 1px 8px; color: #718287; font-size: 7px; line-height: 1.5; }
.device-integrity__signals { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 9px; }
.device-integrity__signals span { padding: 4px 7px; border: 1px solid rgba(8,169,223,.1); border-radius: 999px; color: #59818d; background: rgba(255,255,255,.7); font-size: 6px; font-weight: 800; }
.device-integrity .secondary-button { min-height: 34px; margin-top: 0; font-size: 8px; }
.device-integrity--blocked { border-color: rgba(216,78,78,.2); background: rgba(216,78,78,.045); }
.device-integrity--blocked .device-integrity__icon { background: #d84e4e; }
.device-integrity--blocked .device-integrity__header em { color: #b63636; background: rgba(216,78,78,.1); }
.device-integrity--blocked .device-integrity__header strong { color: #8c2e2e; }
.primary-button--security-blocked { background: #68736e; box-shadow: none; }
.secondary-button { width: 100%; min-height: 39px; margin-top: 7px; border: 1px solid #dce4e0; border-radius: 12px; color: #4d5c55; background: #fff; font-size: 9px; font-weight: 800; cursor: pointer; }
.identity-levels { display: grid; gap: 6px; margin-top: 12px; }
.identity-levels > div { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px 10px; border: 1px solid #e8ecea; border-radius: 13px; background: #fafbfa; }
.identity-levels > div > b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #9ba49f; background: #edf1ef; font-size: 8px; }
.identity-levels > div > span { display: flex; flex-direction: column; gap: 2px; }
.identity-levels strong { color: #3e4943; font-size: 9px; }
.identity-levels small { color: #929b97; font-size: 7px; }
.identity-levels em { color: #9ba49f; font-size: 7px; font-style: normal; }
.identity-levels > div.identity-level--complete > b { color: #fff; background: var(--green); }
.identity-levels > div.identity-level--active { border-color: rgba(0,170,73,.22); background: rgba(0,170,73,.04); }
.identity-levels > div.identity-level--active em { color: var(--green); font-weight: 800; }
.identity-trust-button { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 11px; width: 100%; margin: 14px 0 18px; padding: 14px; border: 1px solid rgba(0,170,73,.34); border-radius: 16px; color: inherit; text-align: left; background: linear-gradient(135deg,rgba(0,170,73,.12),rgba(8,169,223,.07)); box-shadow: 0 10px 28px rgba(0,120,62,.09); cursor: pointer; transition: border-color .2s, box-shadow .2s, transform .2s; }
.identity-trust-button:hover { border-color: rgba(0,170,73,.58); box-shadow: 0 12px 30px rgba(0,120,62,.15); transform: translateY(-1px); }
.identity-trust-button > b { display: grid; place-items: center; min-width: 58px; height: 30px; padding: 0 9px; border-radius: 999px; color: #fff; background: #087e42; font-size: 7px; white-space: nowrap; }
.identity-trust-button > span { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.identity-trust-button strong { color: #153e2a; font-size: 10px; line-height: 1.25; }
.identity-trust-button small { color: #678076; font-size: 7px; line-height: 1.45; }
.identity-trust-button > i { padding: 8px 10px; border-radius: 10px; color: #fff; background: var(--green); font-size: 8px; font-style: normal; font-weight: 800; white-space: nowrap; }
.identity-trust-button--attention { border-color: #24c873; box-shadow: 0 0 0 4px rgba(36,200,115,.16),0 14px 34px rgba(0,120,62,.18); }
.identity-trust-button--done { border-color: rgba(0,170,73,.2); background: rgba(0,170,73,.055); box-shadow: none; cursor: default; }
.identity-trust-button--done > b { color: #08733e; background: rgba(0,170,73,.12); }
.identity-trust-button--done strong { color: #17653e; }
.identity-trust-button--done > i { color: #08733e; background: transparent; }
.identity-legal-note { margin: 8px 7px 0; color: #9aa39f; font-size: 7px; line-height: 1.45; text-align: center; }

.recovery-sheet > p { color: var(--muted); font-size: 9px; line-height: 1.55; }
.recovery-code { margin: 16px 0 12px; padding: 18px 12px; border: 1px dashed rgba(8,169,223,.32); border-radius: 16px; color: #117a9d; background: rgba(8,169,223,.05); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 14px; font-weight: 800; text-align: center; letter-spacing: .7px; }
.recovery-input-field { display: grid; gap: 8px; margin: 16px 0 12px; color: var(--muted); font-size: 8px; font-weight: 800; }
.recovery-input-field[hidden] { display: none; }
.recovery-input-field input { width: 100%; box-sizing: border-box; padding: 16px 14px; border: 1px solid rgba(8,169,223,.24); border-radius: 15px; outline: 0; color: #117a9d; background: rgba(8,169,223,.045); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; font-weight: 800; letter-spacing: .35px; text-transform: uppercase; }
.recovery-input-field input:focus { border-color: rgba(8,169,223,.52); box-shadow: 0 0 0 3px rgba(8,169,223,.08); }

.onboarding-sheet { padding: 30px 25px calc(24px + env(safe-area-inset-bottom)); text-align: center; }
.onboarding-signal { display: grid; place-items: center; width: 88px; height: 88px; margin: 0 auto 19px; border: 1px solid rgba(0,170,73,.16); border-radius: 50%; background: radial-gradient(circle, rgba(0,170,73,.13), rgba(0,170,73,.03) 48%, transparent 50%); box-shadow: 0 0 0 16px rgba(0,170,73,.025); }
.onboarding-sheet h2 { margin: 6px 0 8px; color: var(--text); font-size: 25px; letter-spacing: -.8px; }
.onboarding-sheet > p { margin: 0 auto; max-width: 360px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.onboarding-identity { display: flex; flex-direction: column; gap: 5px; margin: 19px 0 12px; padding: 15px; border-radius: 17px; color: #fff; background: #0a1a15; }
.onboarding-identity small { color: rgba(255,255,255,.48); font-size: 7px; }
.onboarding-identity strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 18px; letter-spacing: 1px; }
.onboarding-identity span { color: #76efb2; font-size: 7px; }
.onboarding-identity i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--green); }
.onboarding-rules { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin-bottom: 15px; }
.onboarding-rules span { display: flex; min-height: 56px; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 7px; border-radius: 12px; color: #64716a; background: #f3f6f4; font-size: 7px; }
.onboarding-rules b { color: var(--green); font-size: 8px; }
.onboarding-restore { margin-top: 12px; }

@keyframes pulse-ring { 0%,100% { transform: scale(.9); opacity: .4; } 50% { transform: scale(1.05); opacity: 1; } }

.relay-trace { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 12px 0 10px; padding: 8px 9px; border-radius: 10px; color: #087ca4; background: rgba(8,169,223,.06); font-size: 8px; }
.relay-trace span { font-weight: 800; white-space: nowrap; }
.relay-trace b { overflow: hidden; color: #698079; font-size: 7px; font-weight: 600; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.relay-trace--waiting { color: var(--green); background: rgba(0,170,73,.055); }
.wave-clock-state { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 9px 0 10px; color: var(--green); font-size: 7px; }
.wave-clock-state span { padding: 4px 7px; border-radius: 999px; background: rgba(0,170,73,.07); font-weight: 800; white-space: nowrap; }
.wave-clock-state b { overflow: hidden; color: #8b9690; font-size: 7px; font-weight: 600; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.wave-clock-state--residual { color: #94701a; }
.wave-clock-state--residual span { background: rgba(255,184,0,.1); }
.wave-card--residual { border-left-color: var(--amber); }
.wave-card--residual .wave-source i { background: var(--amber); box-shadow: 0 0 8px rgba(255,184,0,.35); }
.wave-card--residual .expiry-track i { background: linear-gradient(90deg, var(--amber), #d99a00); }
.wave-card--residual .wave-content { opacity: .86; }

.relay-sheet { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
.relay-visual { display: flex; align-items: center; justify-content: center; margin: 15px 0 13px; padding: 18px 12px; border-radius: 18px; background: radial-gradient(circle at 50% 50%, rgba(8,169,223,.08), transparent 62%), #f7faf8; }
.relay-visual > i { position: relative; width: 46px; height: 1px; margin: 0 7px; overflow: visible; background: linear-gradient(90deg, var(--green), var(--cyan)); }
.relay-visual > i::after { position: absolute; top: -3px; right: 0; width: 7px; height: 7px; border-top: 1px solid var(--cyan); border-right: 1px solid var(--cyan); content: ""; transform: rotate(45deg); }
.relay-device { display: grid; place-items: center; flex: 0 0 54px; height: 54px; border: 1px solid rgba(8,169,223,.23); border-radius: 50%; color: var(--cyan); background: #fff; box-shadow: 0 8px 20px rgba(8,169,223,.1); font-size: 17px; font-weight: 800; }
.relay-device small { margin-top: -11px; color: #8b9691; font-size: 7px; font-weight: 600; }
.relay-device--origin { border-color: rgba(0,170,73,.25); color: var(--green); box-shadow: 0 8px 20px rgba(0,170,73,.09); }
.relay-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 13px 14px; border: 1px solid #e1e7e3; border-radius: 15px; color: inherit; text-align: left; background: #fff; cursor: pointer; }
.relay-toggle > span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.relay-toggle strong { color: var(--text); font-size: 11px; }
.relay-toggle small { color: var(--muted); font-size: 8px; }
.relay-toggle > i { position: relative; flex: 0 0 42px; height: 24px; margin-left: 12px; border-radius: 999px; background: #dfe5e2; transition: background .2s; }
.relay-toggle > i b { position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 7px rgba(0,0,0,.16); transition: transform .2s; }
.relay-toggle[aria-checked="true"] > i { background: var(--green); }
.relay-toggle[aria-checked="true"] > i b { transform: translateX(18px); }
.relay-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 10px; }
.relay-stats span { display: flex; flex-direction: column; gap: 4px; padding: 11px 9px; border-radius: 12px; background: #f5f8f6; text-align: center; }
.relay-stats small { color: #8d9792; font-size: 7px; }
.relay-stats strong { color: #26322c; font-size: 15px; }
.relay-boundary { display: flex; gap: 10px; align-items: center; margin-top: 10px; padding: 12px; border: 1px solid rgba(0,170,73,.13); border-radius: 14px; background: rgba(0,170,73,.055); }
.relay-boundary__icon { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 50%; color: #fff; background: var(--green); font-size: 19px; }
.relay-boundary > span:last-child { display: flex; flex-direction: column; gap: 3px; }
.relay-boundary strong { color: #16623a; font-size: 10px; }
.relay-boundary small { color: #6f897d; font-size: 8px; line-height: 1.45; }
.relay-rules { display: grid; gap: 7px; margin-top: 10px; }
.relay-rules > div { display: grid; grid-template-columns: 28px 1fr; gap: 7px; padding: 9px 10px; border: 1px solid #e7ebe9; border-radius: 12px; }
.relay-rules b { color: var(--cyan); font-size: 8px; }
.relay-rules span { display: flex; flex-direction: column; gap: 2px; }
.relay-rules strong { color: #303a35; font-size: 9px; }
.relay-rules small { color: #8b9590; font-size: 7px; line-height: 1.4; }
.relay-demo-button { margin-top: 12px; }
.relay-prototype-note { margin: 9px 8px 0; color: #939c98; font-size: 7px; line-height: 1.45; text-align: center; }

@media (max-width: 360px) {
  .relay-status { grid-template-columns: 34px minmax(0,1fr); }
  .relay-status em { display: none; }
  .relay-status__signal { width: 34px; height: 34px; }
  .relay-device { flex-basis: 48px; height: 48px; }
  .relay-visual > i { width: 34px; }
}

/* Frequency book: keep the person, never the conversation history. */
.contacts-screen { background: #f5f6f5; }
.frequency-manifesto { display: flex; gap: 13px; margin: 14px 0 25px; padding: 17px; border: 1px solid rgba(0,170,73,.14); border-radius: 19px; background: linear-gradient(135deg, rgba(0,170,73,.075), rgba(8,169,223,.045)); }
.frequency-manifesto__icon { display: grid; place-items: center; flex: 0 0 40px; height: 40px; border-radius: 50%; color: #fff; background: var(--green); font-size: 26px; }
.frequency-manifesto strong { color: var(--text); font-size: 12px; }
.frequency-manifesto p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.active-channel-section, .contact-book { margin-top: 22px; }
.contact-section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 10px; }
.contact-section-heading h2 { margin: 2px 0 0; color: var(--text); font-size: 19px; letter-spacing: -.5px; }
.contact-section-heading > small { color: #929b97; font-size: 8px; }
.active-channel-list, .contact-list { display: grid; gap: 9px; }
.active-channel-card { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 10px; align-items: center; width: 100%; padding: 12px; border: 1px solid rgba(0,170,73,.13); border-radius: 16px; color: inherit; text-align: left; background: #fff; box-shadow: 0 7px 20px rgba(24,41,32,.045); cursor: pointer; }
.active-channel-card > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.active-channel-card strong { color: #232a26; font-size: 10px; }
.active-channel-card small { overflow: hidden; color: #8b9590; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.active-channel-card > b { color: var(--green); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; }
.channel-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 108px; padding: 16px; border: 1px dashed #dce3df; border-radius: 17px; color: #929c97; text-align: center; background: rgba(255,255,255,.5); }
.channel-empty > span { color: var(--cyan); font-size: 27px; }
.channel-empty strong { margin: 3px 0; color: #59645e; font-size: 10px; }
.channel-empty small { font-size: 8px; }
.contact-card { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid #e5e9e7; border-radius: 16px; background: #fff; box-shadow: 0 6px 18px rgba(25,41,33,.04); }
.contact-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; }
.contact-avatar--cyan { background: var(--cyan); box-shadow: 0 5px 14px rgba(8,169,223,.18); }
.contact-avatar--green { background: var(--green); box-shadow: 0 5px 14px rgba(0,170,73,.18); }
.contact-card__identity { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.contact-card__identity strong { color: #222a26; font-size: 11px; }
.contact-card__identity small { overflow: hidden; color: #929b97; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.contact-card > button { display: flex; min-width: 66px; min-height: 34px; flex-direction: column; align-items: center; justify-content: center; padding: 6px 9px; border: 0; border-radius: 10px; color: #fff; background: var(--green); font-size: 8px; font-weight: 800; cursor: pointer; }
.contact-card > button b { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; }
.contact-card > button small { margin-top: 1px; color: rgba(255,255,255,.8); font-size: 6px; }
.contact-book-empty { display: flex; min-height: 150px; flex-direction: column; align-items: center; justify-content: center; color: var(--muted); text-align: center; }
.contact-book-empty > span { color: var(--cyan); font-size: 30px; }
.contact-book-empty strong { color: #4d5852; font-size: 11px; }
.contact-book-empty small { margin-top: 4px; font-size: 8px; }
.contact-boundary-note { margin: 24px 4px 0; color: #9aa39f; font-size: 7px; line-height: 1.5; text-align: center; }
.contact-header-actions { display: flex; align-items: center; gap: 14px; }
.contact-header-actions .text-button { white-space: nowrap; }
.contact-header-actions .text-button:first-child { color: #737d77; }
.contact-header-actions .text-button b { display: inline-grid; place-items: center; min-width: 15px; height: 15px; margin-left: 2px; border-radius: 999px; color: #fff; background: #2c342f; font-size: 7px; }

.add-contact-intro { margin: 12px 0 14px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.contact-methods { display: grid; gap: 8px; }
.contact-methods > button { display: grid; grid-template-columns: 37px minmax(0,1fr) auto; padding: 11px; border: 1px solid #e5e9e7; border-radius: 14px; color: inherit; text-align: left; background: #fafbfa; cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.contact-methods > button:hover { transform: translateY(-1px); }
.contact-methods > button[aria-selected="true"] { border-color: rgba(0,170,73,.28); background: rgba(0,170,73,.055); }
.contact-methods > button > span { display: grid; grid-row: 1 / 3; place-items: center; width: 29px; height: 29px; border-radius: 50%; color: var(--cyan); background: rgba(8,169,223,.08); font-size: 16px; }
.contact-methods > button[aria-selected="true"] > span { color: #fff; background: var(--green); }
.contact-methods > button > i { grid-column: 3; grid-row: 1 / 3; align-self: center; color: #98a19c; font-size: 7px; font-style: normal; }
.contact-methods > button[aria-selected="true"] > i { color: var(--green); font-weight: 800; }
.contact-methods strong { color: #313a35; font-size: 10px; }
.contact-methods small { margin-top: 3px; color: #8b9590; font-size: 8px; line-height: 1.4; }
.contact-method-panel { margin-top: 13px; animation: pairing-panel-in .2s ease-out; }
.contact-consent-preview { display: flex; align-items: center; gap: 11px; margin: 13px 0; padding: 13px; border-radius: 15px; background: rgba(0,170,73,.055); }
.contact-consent-preview > span:last-child { display: flex; flex-direction: column; gap: 2px; }
.contact-consent-preview small { color: #8b9590; font-size: 7px; }
.contact-consent-preview strong { color: #28332d; font-size: 10px; }
.contact-consent-preview em { color: var(--green); font-size: 7px; font-style: normal; }

.pairing-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin: 17px 2px 11px; }
.pairing-section-heading > span { display: grid; gap: 3px; }
.pairing-section-heading small { color: #8a948e; font-size: 7px; }
.pairing-section-heading strong { color: #29322d; font-size: 10px; }
.pairing-section-heading > em { color: var(--green); font: 700 7px/1 ui-monospace, SFMono-Regular, Consolas, monospace; font-style: normal; white-space: nowrap; }
.pairing-qr-wrap { position: relative; display: grid; place-items: center; width: min(64vw, 232px); aspect-ratio: 1; margin: 0 auto; padding: 12px; border: 1px solid #e2e7e3; border-radius: 23px; background: #fff; box-shadow: 0 16px 38px rgba(23,40,31,.08); }
.pairing-qr-wrap canvas { width: 100%; height: 100%; border-radius: 10px; image-rendering: pixelated; }
.pairing-qr-logo { position: absolute; display: grid; place-items: center; width: 34px; height: 34px; border: 5px solid #fff; border-radius: 50%; color: #fff; background: var(--green); font-size: 21px; box-shadow: 0 4px 11px rgba(0,170,73,.2); }
.pairing-code-caption { display: block; margin: 10px 0 8px; color: #4e5a53; font: 750 10px/1 ui-monospace, SFMono-Regular, Consolas, monospace; text-align: center; letter-spacing: .6px; }
.pairing-actions { display: flex; justify-content: center; gap: 8px; }
.pairing-actions button, .pairing-regenerate, .pairing-submit-row > button:first-child { padding: 8px 10px; border: 1px solid #dfe5e1; border-radius: 10px; color: #566159; background: #fff; font-size: 7px; font-weight: 700; cursor: pointer; }
.pairing-regenerate { display: block; margin: 9px auto 0; }
.pairing-divider { display: flex; align-items: center; gap: 9px; margin: 16px 0 12px; color: #929b96; font-size: 7px; }
.pairing-divider::before, .pairing-divider::after { height: 1px; flex: 1; background: #e6e9e7; content: ""; }
.pairing-code-input { display: grid; gap: 6px; }
.pairing-code-input > span { color: #68736d; font-size: 8px; font-weight: 700; }
.pairing-code-input input { width: 100%; box-sizing: border-box; padding: 13px 14px; border: 1px solid #dfe5e1; border-radius: 13px; outline: 0; color: #243029; background: #f8faf9; font: 750 11px/1 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .5px; text-transform: uppercase; }
.pairing-code-input input:focus { border-color: rgba(0,170,73,.42); box-shadow: 0 0 0 3px rgba(0,170,73,.07); }
.pairing-submit-row { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 8px; margin-top: 9px; }
.pairing-submit-row .primary-button { margin: 0; min-height: 38px; }
.pairing-prototype-note { margin: 9px 6px 0; color: #929b96; font-size: 6.5px; line-height: 1.5; text-align: center; }
.invite-code-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; width: 100%; padding: 17px; border: 1px solid rgba(0,170,73,.17); border-radius: 17px; color: inherit; text-align: left; background: linear-gradient(135deg, rgba(0,170,73,.085), rgba(8,169,223,.04)); cursor: pointer; }
.invite-code-card code { color: #087a3a; font: 800 16px/1 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .6px; }
.invite-code-card > span { display: grid; gap: 3px; text-align: right; }
.invite-code-card strong { color: #137e40; font-size: 7px; }
.invite-code-card small { color: #7e8f85; font-size: 6px; }
.frequency-code-own { display:flex; justify-content:space-between; align-items:center; padding:15px 16px; border:1px solid rgba(0,170,73,.17); border-radius:17px; background:linear-gradient(135deg,rgba(0,170,73,.075),rgba(8,169,223,.035)); }
.frequency-code-own>span { display:flex; flex-direction:column; gap:5px; }
.frequency-code-own small { color:#7d8c83; font-size:7px; }
.frequency-code-own strong { color:#087a3a; font:800 15px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.6px; }
.frequency-code-own>button { padding:8px 10px; border:1px solid #d7e2db; border-radius:10px; color:#087a3a; background:#fff; font-size:7px; font-weight:800; }
.frequency-code-submit { width:100%; margin:10px 0 0; }
@keyframes pairing-panel-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 380px) {
  .pairing-submit-row { grid-template-columns: 1fr; }
  .invite-code-card { grid-template-columns: 1fr; }
  .invite-code-card > span { text-align: left; }
}

.channel-sheet { display: flex; flex-direction: column; height: min(94dvh, 820px); overflow: hidden; }
.channel-sheet header > div { min-width: 0; }
.channel-sheet header small { display: block; max-width: 280px; overflow: hidden; color: var(--muted); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.channel-lifetime { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; flex: 0 0 auto; margin: 12px 0; padding: 11px 12px; border: 1px solid rgba(0,170,73,.14); border-radius: 15px; background: rgba(0,170,73,.055); }
.channel-lifetime__pulse { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #fff; }
.channel-lifetime__pulse i { width: 9px; height: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 6px rgba(0,170,73,.1), 0 0 13px rgba(0,170,73,.28); animation: blink 1.8s infinite; }
.channel-lifetime > span:nth-child(2) { display: grid; grid-template-columns: auto 1fr; gap: 2px 5px; align-items: baseline; }
.channel-lifetime small { grid-column: 1 / -1; color: #78857f; font-size: 7px; }
.channel-lifetime strong { color: var(--green); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 17px; }
.channel-lifetime em { color: #79847e; font-size: 8px; font-style: normal; }
.channel-lifetime button { padding: 7px 8px; border: 0; border-radius: 9px; color: #a33a43; background: rgba(241,58,72,.07); font-size: 7px; cursor: pointer; }
.channel-transport { display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:9px; align-items:center; margin:-3px 0 10px; padding:9px 10px; border:1px solid #e2e8e4; border-radius:14px; background:#fbfcfb; }
.channel-transport__signal { position:relative; display:grid; place-items:center; width:34px; height:34px; color:var(--green); }
.channel-transport__signal i { position:absolute; width:27px; height:27px; border:1px solid currentColor; border-radius:50%; opacity:.2; }
.channel-transport__signal i:nth-child(2) { width:18px; height:18px; opacity:.42; }
.channel-transport__signal b { width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 10px currentColor; }
.channel-transport>span:nth-child(2) { display:grid; gap:2px; min-width:0; }
.channel-transport strong { color:#29352e; font-size:8px; }
.channel-transport small { overflow:hidden; color:#89948e; font-size:6px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
.channel-transport button { padding:6px 8px; border:0; border-radius:8px; color:#147446; background:#edf8f2; font-size:6px; font-weight:800; cursor:pointer; }
.channel-transport--fallback .channel-transport__signal { color:#d59625; }
.channel-transport--fallback button { color:#805d20; background:#fbf3e5; }
.channel-thread { display: grid; flex: 1 1 auto; align-content: start; gap: 10px; min-height: 100px; overflow-y: auto; padding: 4px 2px 14px; overscroll-behavior: contain; }
.channel-thread-empty { display: flex; flex: 1 1 auto; min-height: 130px; flex-direction: column; align-items: center; justify-content: center; color: var(--muted); text-align: center; }
.channel-thread-empty > span { color: var(--cyan); font-size: 31px; }
.channel-thread-empty strong { color: #4c5751; font-size: 10px; }
.channel-thread-empty small { margin-top: 4px; font-size: 8px; }
.channel-message { display: grid; grid-template-columns: 31px minmax(0,1fr); gap: 8px; align-items: start; max-width: 88%; }
.channel-message--outgoing { justify-self: end; grid-template-columns: minmax(0,1fr) 31px; }
.channel-message--outgoing .channel-message__avatar { grid-column: 2; }
.channel-message--outgoing > div { grid-row: 1; text-align: right; border-radius: 13px 3px 13px 13px; background: rgba(0,170,73,.08); }
.channel-message__avatar { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; color: #fff; background: var(--cyan); font-size: 9px; font-weight: 800; }
.channel-message--outgoing .channel-message__avatar { background: var(--green); }
.channel-message > div { padding: 9px 11px; border-radius: 3px 13px 13px 13px; background: #f1f4f2; }
.channel-message small { display: block; margin-bottom: 3px; color: #84908a; font-size: 7px; }
.channel-message p { margin: 0; color: #202622; font-size: 10px; line-height: 1.5; }
.channel-message__delivery { display:block; margin-top:5px; color:#008e48; font-size:6px; font-style:normal; }
.channel-message__delivery--mailbox_queued { color:#a06c14; }
.channel-message__delivery--mailbox_deleted { color:#597168; }
.channel-media-chip, .channel-audio-chip { display: inline-block; padding: 7px 9px; border-radius: 9px; color: #fff; background: var(--cyan); font-size: 8px; }
.channel-audio-chip { background: var(--green); }
.channel-composer { flex: 0 0 auto; padding: 10px; border: 1px solid #dfe5e2; border-radius: 16px; background: #f7f9f8; }
.channel-composer textarea { width: 100%; resize: none; padding: 2px 3px 8px; border: 0; outline: 0; color: var(--text); background: transparent; font-size: 11px; line-height: 1.5; }
.channel-composer textarea::placeholder { color: #a5aea9; }
.channel-composer__tools { display: flex; align-items: center; gap: 7px; }
.channel-tool { display: grid; place-items: center; width: 30px; height: 30px; border: 0; border-radius: 50%; color: var(--cyan); background: rgba(8,169,223,.09); font-size: 15px; cursor: pointer; }
.channel-composer__tools small { margin-left: auto; color: #99a29e; font-size: 7px; }
.channel-send { min-width: 70px; height: 31px; border: 0; border-radius: 10px; color: #fff; background: var(--green); font-size: 9px; font-weight: 800; cursor: pointer; }
.channel-rule { flex: 0 0 auto; margin: 7px 2px 0; color: #929b97; font-size: 7px; line-height: 1.45; text-align: center; }
.channel-call-control { display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 10px; align-items: center; flex: 0 0 auto; padding: 11px 0; border-top: 1px solid #e7eae7; border-bottom: 1px solid #e7eae7; }
.channel-call-control__icon { display: flex; align-items: center; justify-content: center; gap: 2px; width: 36px; height: 36px; border-radius: 50%; color: #fff; background: #111713; }
.channel-call-control__icon i { width: 2px; height: 8px; border-radius: 2px; background: #4bda8b; }
.channel-call-control__icon i:nth-child(2), .channel-call-control__icon i:nth-child(4) { height: 14px; }
.channel-call-control__icon i:nth-child(3) { height: 20px; }
.channel-call-control > span:nth-child(2) { display: grid; gap: 3px; }
.channel-call-control strong { color: #253029; font-size: 10px; }
.channel-call-control small { color: #89928d; font-size: 7px; }
.channel-call-control > button { min-width: 58px; height: 32px; border: 0; border-radius: 10px; color: #fff; background: #0aa049; font-size: 8px; font-weight: 750; cursor: pointer; }
.channel-call-permission { display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; width: 100%; padding: 9px 0; border: 0; color: #2f3a34; background: transparent; text-align: left; cursor: pointer; }
.channel-call-permission > span { display: grid; gap: 2px; }
.channel-call-permission strong { font-size: 8px; }
.channel-call-permission small { color: #909993; font-size: 6px; }
.channel-call-permission > i { position: relative; width: 31px; height: 18px; border-radius: 999px; background: #0aa049; transition: background .2s ease; }
.channel-call-permission > i b { position: absolute; top: 3px; left: 16px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: left .2s ease; }
.channel-call-permission[aria-checked="false"] > i { background: #c9cfcb; }
.channel-call-permission[aria-checked="false"] > i b { left: 3px; }
.voice-call-panel { display: flex; flex: 1 1 auto; min-height: 330px; flex-direction: column; align-items: center; justify-content: center; padding: 16px 8px 4px; text-align: center; }
.voice-call-panel .eyebrow { margin-bottom: 18px; }
.voice-call-identity { display: flex; align-items: center; gap: 10px; text-align: left; }
.voice-call-identity .contact-avatar { width: 48px; height: 48px; }
.voice-call-identity > span:last-child { display: grid; gap: 3px; }
.voice-call-identity strong { color: #1f2923; font-size: 15px; }
.voice-call-identity small { color: #89928d; font-size: 8px; }
.voice-call-wave { display: flex; align-items: center; justify-content: center; gap: 3px; width: min(100%, 260px); height: 76px; margin: 18px 0 4px; }
.voice-call-wave i { width: 2px; height: 10px; border-radius: 2px; background: #0aa049; animation: call-wave 1.1s ease-in-out infinite alternate; }
.voice-call-wave i:nth-child(2n) { animation-delay: -.35s; }.voice-call-wave i:nth-child(3n) { animation-delay: -.7s; }.voice-call-wave i:nth-child(4n) { animation-delay: -.2s; }
.voice-call-panel--connecting .voice-call-wave i { animation-duration: 1.8s; opacity: .45; }
.voice-call-panel--muted .voice-call-wave i { height: 3px; opacity: .28; animation: none; }
.voice-call-panel p { max-width: 280px; margin: 0 0 16px; color: #77827c; font-size: 8px; line-height: 1.55; }
.voice-call-clocks { display: grid; width: min(100%, 250px); grid-template-columns: 1fr 1fr; margin-bottom: 19px; border-top: 1px solid #e5e9e6; border-bottom: 1px solid #e5e9e6; }
.voice-call-clocks span { display: grid; gap: 3px; padding: 11px; }
.voice-call-clocks span + span { border-left: 1px solid #e5e9e6; }
.voice-call-clocks small { color: #949d97; font-size: 6px; }
.voice-call-clocks strong { color: #263129; font: 650 13px/1 ui-monospace, SFMono-Regular, Consolas, monospace; }
.voice-call-actions { display: flex; gap: 20px; margin-bottom: 15px; }
.voice-call-actions button { display: grid; gap: 5px; place-items: center; min-width: 70px; border: 0; color: #445048; background: transparent; cursor: pointer; }
.voice-call-actions button span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #edf1ee; font-size: 18px; }
.voice-call-actions button b { font-size: 7px; }
.voice-call-actions button[aria-pressed="true"] span { color: #fff; background: #252c28; }
.voice-call-actions .voice-call-end span { color: #fff; background: #e84552; font-size: 27px; font-weight: 300; }
.voice-call-privacy { color: #99a19c; font-size: 6px; }
.channel-sheet--calling .channel-transport, .channel-sheet--calling .channel-call-control, .channel-sheet--calling .channel-call-permission, .channel-sheet--calling .channel-thread, .channel-sheet--calling .channel-thread-empty, .channel-sheet--calling .channel-composer, .channel-sheet--calling .channel-rule { display: none; }
@keyframes call-wave { from { height: 8px; opacity: .38; } to { height: 46px; opacity: 1; } }
.echo-composer--locked { opacity: .55; }
.echo-composer--locked textarea, .echo-composer--locked button { cursor: not-allowed; }

/* Private relationship safety: blocking is explicit, reversible and separate from reporting. */
.private-safety-eyebrow { color: #c33d48; }
.private-block-profile { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 12px; align-items: center; margin: 16px 0 12px; padding: 14px; border: 1px solid rgba(216,74,84,.12); border-radius: 16px; background: rgba(216,74,84,.045); }
.private-block-profile .contact-avatar { width: 48px; height: 48px; background: #252c28; box-shadow: none; }
.private-block-profile > span:last-child { display: grid; gap: 4px; }
.private-block-profile strong { color: #252c28; font-size: 12px; }
.private-block-profile small { color: #7e8882; font-size: 8px; }
.private-block-copy { margin: 12px 0 14px; color: #6f7973; font-size: 9px; line-height: 1.65; }
.private-block-effects { display: grid; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.private-block-effects li { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 10px; align-items: center; padding: 10px 11px; border: 1px solid #e7eae8; border-radius: 13px; }
.private-block-effects li > i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #bc3e48; background: rgba(216,74,84,.075); font-size: 14px; font-style: normal; }
.private-block-effects li > span { display: grid; gap: 3px; }
.private-block-effects strong { color: #303833; font-size: 9px; }
.private-block-effects small { color: #87908b; font-size: 7px; line-height: 1.45; }
.private-block-list { display: grid; gap: 9px; margin-top: 14px; }
.private-block-card { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid #e4e8e5; border-radius: 15px; background: #fafbfa; }
.private-block-card .contact-avatar { width: 40px; height: 40px; background: #59615c; box-shadow: none; }
.private-block-card > span:nth-child(2) { display: grid; min-width: 0; gap: 3px; }
.private-block-card strong { overflow: hidden; color: #29312c; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.private-block-card small { color: #858f89; font-size: 7px; line-height: 1.4; }
.private-block-card button { padding: 7px 9px; border: 1px solid #d8ded9; border-radius: 9px; color: #4d5851; background: #fff; font-size: 7px; font-weight: 700; cursor: pointer; }
.private-block-empty { display: flex; min-height: 180px; flex-direction: column; align-items: center; justify-content: center; color: #929b96; text-align: center; }
.private-block-empty > span { color: #0aa049; font-size: 30px; }
.private-block-empty strong { color: #505a54; font-size: 10px; }
.private-block-empty small { margin-top: 4px; font-size: 7px; }

@media (max-width: 380px) {
  .contact-header-actions { gap: 8px; }
  .contact-header-actions .text-button { font-size: 9px; }
}

/* Unified composer: text is the message, media is an optional attachment. */
.compose-field { margin-top: 18px; }
.composer-attachment-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 11px; }
.composer-attachment-row > em { color: #9ba49f; font-size: 7px; font-style: normal; white-space: nowrap; }
.add-attachment-button { display: grid; grid-template-columns: 28px auto; grid-template-rows: auto auto; gap: 0 8px; align-items: center; padding: 7px 11px 7px 7px; border: 1px solid #dfe6e2; border-radius: 13px; color: #3d4943; background: #fff; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.add-attachment-button > span { display: grid; grid-row: 1 / 3; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #fff; background: var(--green); font-size: 18px; font-weight: 400; line-height: 1; }
.add-attachment-button > b { font-size: 9px; }
.add-attachment-button > small { color: #8d9792; font-size: 7px; }
.add-attachment-button[aria-expanded="true"], .add-attachment-button--active { border-color: rgba(0,170,73,.25); background: rgba(0,170,73,.045); }
.attachment-menu { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 9px; padding: 9px; border: 1px solid #e2e8e4; border-radius: 16px; background: #f7f9f8; box-shadow: 0 10px 28px rgba(24,42,33,.07); }
.attachment-menu > button { display: flex; min-width: 0; flex-direction: column; align-items: center; padding: 10px 5px 9px; border: 1px solid transparent; border-radius: 12px; color: #46524c; background: #fff; cursor: pointer; }
.attachment-menu > button:hover, .attachment-menu > button:focus-visible { border-color: rgba(0,170,73,.24); background: rgba(0,170,73,.04); }
.attachment-menu > button > span { position: relative; display: grid; place-items: center; width: 32px; height: 32px; margin-bottom: 5px; overflow: hidden; border-radius: 50%; color: var(--green); background: rgba(0,170,73,.08); }
.attachment-menu svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.attachment-menu > button > b { font-size: 9px; }
.attachment-menu > button > small { margin-top: 2px; overflow: hidden; color: #959e99; font-size: 6px; text-overflow: ellipsis; white-space: nowrap; }
.attachment-menu .attachment-menu__asset { background: #000; }
.attachment-menu__asset img { position: absolute; top: 50%; left: 50%; width: 183.5%; max-width: none; transform: translate(-50%,-50%); }
.voice-recorder { margin-top: 9px; padding: 13px; border: 1px solid rgba(0,170,73,.18); border-radius: 18px; background: linear-gradient(145deg, rgba(0,170,73,.06), rgba(8,169,223,.035)); }
.voice-recorder__copy { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 2px 10px; }
.voice-recorder__copy > span { display: flex; align-items: center; gap: 7px; }
.voice-recorder__copy i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(0,170,73,.08); }
.voice-recorder__copy strong { color: #25312b; font-size: 9px; }
.voice-recorder__copy small { color: #86918b; font-size: 7px; }
.voice-record-button { position: relative; display: grid; grid-template-columns: 50px minmax(0,1fr) auto; align-items: center; gap: 11px; width: 100%; min-height: 72px; overflow: hidden; padding: 10px 15px 10px 10px; border: 0; border-radius: 18px; color: #fff; background: linear-gradient(135deg,#00b950,#009f44); box-shadow: 0 12px 25px rgba(0,170,73,.18); cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; }
.voice-record-button::after { position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.22); border-radius: inherit; content: ""; pointer-events: none; }
.voice-record-button__asset { position: relative; display: block; width: 50px; height: 50px; overflow: hidden; border: 3px solid rgba(255,255,255,.24); border-radius: 50%; background: #000; }
.voice-record-button__asset img { position: absolute; top: 50%; left: 50%; width: 183.5%; max-width: none; transform: translate(-50%,-50%); }
.voice-record-button > b { justify-self: start; font-size: 13px; letter-spacing: .2px; }
.voice-record-button > em { min-width: 54px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; font-style: normal; font-weight: 800; text-align: right; }
.voice-recorder--recording { border-color: rgba(241,58,72,.25); background: rgba(241,58,72,.045); }
.voice-recorder--recording .voice-recorder__copy i { background: var(--danger); box-shadow: 0 0 0 4px rgba(241,58,72,.1), 0 0 13px rgba(241,58,72,.3); animation: blink .7s infinite; }
.voice-record-button--recording { background: linear-gradient(135deg,#f14b57,#cf2635); box-shadow: 0 12px 27px rgba(241,58,72,.2); transform: scale(.985); }
.voice-record-button--recording .voice-record-button__asset { animation: voice-pulse .8s infinite alternate; }
.voice-recorder__footer { display: flex; align-items: center; justify-content: space-between; margin: 9px 2px 0; }
.voice-recorder__footer > span { color: #87918c; font-size: 7px; }
.voice-recorder__footer button { padding: 4px 0; border: 0; color: #8b9690; background: none; font-size: 7px; cursor: pointer; }
.attachment-preview { position: relative; display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 12px; margin-top: 9px; padding: 10px; border: 1px solid rgba(8,169,223,.12); background: linear-gradient(135deg, rgba(8,169,223,.055), rgba(0,170,73,.035)); }
.attachment-preview > div:nth-child(2) { min-width: 0; }
.attachment-preview strong, .attachment-preview small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attachment-preview[data-attachment-type="image"] .preview-visual span { font-size: 10px; font-weight: 900; }
.attachment-preview[data-attachment-type="image"] .preview-visual { position: relative; overflow: hidden; }
.attachment-preview[data-attachment-type="image"] .preview-visual img { width: 100%; height: 100%; object-fit: cover; }
.attachment-preview[data-attachment-type="image"] .preview-visual img:not([hidden]) + span { position: absolute; right: 3px; bottom: 3px; padding: 2px 4px; border-radius: 999px; color: #fff; background: rgba(3,15,9,.72); font-size: 7px; backdrop-filter: blur(6px); }
.attachment-preview[data-attachment-type="video"] .preview-visual { position: relative; overflow: hidden; }
.attachment-preview[data-attachment-type="video"] .preview-visual video { width: 100%; height: 100%; object-fit: cover; }
.attachment-preview[data-attachment-type="video"] .preview-visual video:not([hidden]) ~ span { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; background: rgba(3,15,9,.16); text-shadow: 0 1px 8px rgba(0,0,0,.72); }
.attachment-preview--processing { opacity: .72; pointer-events: none; }
.media-slot-progress { --media-progress:0%; position:absolute; inset:0; z-index:5; display:grid!important; grid-template-rows:1fr auto auto; place-items:center; padding:7px 4px 5px; overflow:hidden; color:#fff!important; background:rgba(4,17,11,.72)!important; text-align:center; backdrop-filter:blur(3px); }
.media-slot-progress[hidden] { display:none!important; }
.media-slot-progress b { align-self:end; color:#fff; font:850 10px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:-.04em; }
.media-slot-progress small { overflow:hidden; width:100%; margin-top:3px; color:rgba(255,255,255,.82)!important; font-size:5px!important; line-height:1!important; text-overflow:ellipsis; white-space:nowrap; }
.media-slot-progress i { align-self:end; width:calc(100% - 4px); height:2px; margin-top:5px; border-radius:999px; background:linear-gradient(90deg,#43df91 0 var(--media-progress),rgba(255,255,255,.2) var(--media-progress) 100%); box-shadow:0 0 8px rgba(67,223,145,.45); }
.media-slot-progress--connecting i { animation:media-progress-search 1.15s ease-in-out infinite; background:linear-gradient(90deg,transparent,#43df91,transparent); background-size:45% 100%; }
.media-slot-progress--verifying { background:rgba(8,31,22,.78)!important; }
.media-slot-progress--error { background:rgba(99,26,30,.8)!important; }
.media-slot-progress--error i { background:rgba(255,255,255,.28); box-shadow:none; }
@keyframes media-progress-search { from { background-position:-80% 0; } to { background-position:180% 0; } }
.attachment-preview--error { border-color:rgba(203,69,69,.28); background:linear-gradient(135deg,rgba(203,69,69,.075),rgba(166,50,50,.025)); }
.attachment-preview--error .preview-visual { color:#fff; background:linear-gradient(145deg,#c64a4a,#8e3030); }
.attachment-preview[data-attachment-type="audio"] .preview-visual { color: #fff; background: #111; }
.attachment-preview[data-attachment-type="video"] .preview-visual { color: #fff; background: linear-gradient(145deg,#00aa49,#087d50); }
.attachment-preview__actions { display: flex; gap: 5px; }
.attachment-preview__actions > button { display: grid; place-items: center; width: 27px; height: 27px; border: 0; border-radius: 50%; cursor: pointer; }
.attachment-preview__actions > button:first-child { color: #fff; background: var(--green); font-size: 15px; }
.attachment-remove { display: grid; place-items: center; width: 27px; height: 27px; border: 0; border-radius: 50%; color: #77827c; background: rgba(255,255,255,.85); font-size: 16px; cursor: pointer; }

.media-swatch.image-gallery { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); grid-auto-rows: minmax(54px,1fr); place-items: stretch; gap: 3px; padding: 3px; overflow: hidden; background: #eaf2ee; }
.media-swatch.image-gallery > i { position: relative; display: grid; place-items: center; height: 100%; min-height: 62px; overflow: hidden; color: rgba(255,255,255,.84); background: radial-gradient(circle at calc(28% + var(--tile) * 12%) 20%, rgba(255,215,122,.65), transparent 28%), linear-gradient(135deg,#08a9df,#066e9d 58%,#23494f); font-size: 22px; font-style: normal; }
.media-swatch.image-gallery--1 { grid-template-columns: 1fr; }
.media-swatch.image-gallery--1 > i { min-height: 132px; border-radius: 12px; }
.media-swatch.image-gallery--2 { grid-template-columns: repeat(2,1fr); grid-template-rows: 132px; }
.media-swatch.image-gallery--3 > i:first-child { grid-row: 1 / 3; }
.media-swatch.image-gallery > b { position: absolute; right: 9px; bottom: 9px; padding: 4px 7px; border-radius: 999px; color: #fff; background: rgba(0,0,0,.48); font-size: 8px; }

/* Timeline previews follow the bounded social-feed pattern: landscape media fills
   the card, while tall media is cropped into a finite preview and opens separately. */
.adaptive-media {
  position: relative;
  width: 100%;
  min-height: 0;
  aspect-ratio: var(--media-ratio, 1.3333);
  margin: 12px auto 14px;
  padding: 0;
  overflow: hidden;
  border: 0;
  cursor: zoom-in;
  background: #07100c;
}
.adaptive-media--portrait { aspect-ratio: 4 / 5; max-height: min(56dvh, 480px); }
.adaptive-media--square { aspect-ratio: 1; }
.adaptive-media--wide { aspect-ratio: var(--media-ratio, 2.2); }
.adaptive-media > img,
.adaptive-media > video { display: block; width: 100%; height: 100%; object-fit: cover; background: #07100c; }
.adaptive-media .media-placeholder-icon { display: grid; place-items: center; width: 100%; height: 100%; font-size: 28px; }
.waves-watermark { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 5px 8px; border: 1px solid rgba(255,255,255,.15); border-radius: 999px; color: rgba(255,255,255,.88); background: rgba(4,12,8,.38); font-size: 8px; font-weight: 750; letter-spacing: .2px; text-shadow: 0 1px 3px rgba(0,0,0,.4); backdrop-filter: blur(8px); pointer-events: none; }
.waves-watermark i { color: #69efa9; font-size: 10px; font-style: normal; }
.media-play-mark { position: absolute; top: 50%; left: 50%; display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; color: #fff; background: rgba(4,12,8,.48); font-size: 18px; transform: translate(-50%,-50%); backdrop-filter: blur(10px); }
.image-gallery--multiple { width: 100%; min-height: 0; aspect-ratio: 16 / 10; margin: 12px 0 14px; border: 0; cursor: zoom-in; }
.image-gallery--multiple.is-expanded { aspect-ratio: 1 / 1; cursor: zoom-out; }
.image-gallery--multiple.image-gallery--2 { grid-template-rows: 1fr; aspect-ratio: 16 / 9; }
.image-gallery--multiple.image-gallery--2.is-expanded { aspect-ratio: 4 / 3; }
.image-gallery--multiple .image-gallery__tile { min-height: 0; }
.image-gallery--multiple .image-gallery__tile > span { display: grid; place-items: center; width: 100%; height: 100%; }
.adaptive-media:focus-visible,
.image-gallery--multiple:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }

.media-viewer { position: fixed; z-index: 100; inset: 0; display: block; padding: 0; color: #fff; background: #020503; opacity: 0; transition: opacity .18s ease; }
.media-viewer[hidden] { display: none; }
.media-viewer.is-open { opacity: 1; }
.media-viewer__stage { display: grid; width: 100vw; height: 100dvh; min-width: 0; min-height: 0; place-items: center; overflow: hidden; touch-action: none; overscroll-behavior: contain; }
.media-viewer__media { position: relative; display: grid; width: 100vw; height: 100dvh; max-width: none; max-height: none; place-items: center; cursor: zoom-in; transform: translate3d(var(--media-pan-x,0),var(--media-pan-y,0),0) scale(var(--media-zoom,1)); transform-origin: center; transition: transform .12s ease-out; will-change: transform; }
.media-viewer__media.is-zoomed { cursor: grab; }
.media-viewer__media.is-zoomed:active { cursor: grabbing; }
.media-viewer__stage img,.media-viewer__stage video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; max-width: none; max-height: none; object-fit: contain; border-radius: 0; box-shadow: none; }
.media-viewer__media.is-edge-cover :is(img,video) { object-fit: cover; }
.media-viewer__stage :is(img,video)[hidden] { display: none; }
.waves-watermark--viewer { right: max(14px,env(safe-area-inset-right)); bottom: max(82px,calc(env(safe-area-inset-bottom) + 72px)); }
.media-viewer__close { position: absolute; z-index: 4; top: max(12px,env(safe-area-inset-top)); right: max(14px,env(safe-area-inset-right)); display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; color: #fff; background: rgba(14,20,16,.72); font-size: 25px; cursor: pointer; backdrop-filter: blur(12px); }
.media-viewer__footer { position: absolute; z-index: 3; right: 0; bottom: 0; left: 0; display: grid; width: 100%; grid-template-columns: minmax(0,1fr) auto auto auto; align-items: center; gap: 9px; padding: 28px max(14px,calc((100vw - 980px)/2)) max(14px,env(safe-area-inset-bottom)); background: none; }
.media-viewer[data-media-type="video"] .media-viewer__footer { bottom: 46px; }
.media-viewer[data-media-type="video"] .waves-watermark--viewer { bottom: max(128px,calc(env(safe-area-inset-bottom) + 118px)); }
.media-viewer__copy { display: grid; gap: 3px; min-width: 0; }
.media-viewer__footer strong { overflow: hidden; color: rgba(255,255,255,.82); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.media-viewer__footer small { color: rgba(255,255,255,.5); font-size: 8px; }
.media-viewer__footer button { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 6px; min-width: 36px; min-height: 36px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: #fff; background: rgba(255,255,255,.1); font-size: 10px; font-weight: 700; cursor: pointer; backdrop-filter: blur(10px); }
.media-viewer__footer button:disabled { cursor: wait; opacity: .5; }
.media-viewer__footer button span { color: #69efa9; font-size: 15px; }
.media-viewer__fit { min-width: 48px; justify-self: end; }
.media-viewer__zoom { display: flex; align-items: center; gap: 4px; padding: 3px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.05); }
.media-viewer__zoom button { min-width: 30px; min-height: 30px; padding: 4px 7px; border: 0; background: transparent; font-size: 14px; }
.media-viewer__zoom #media-viewer-scale { min-width: 46px; color: rgba(255,255,255,.66); font-size: 8px; }
@media (max-width:520px){.media-viewer__copy{display:none}.media-viewer__footer{grid-template-columns:1fr auto auto;padding-right:max(10px,env(safe-area-inset-right));padding-left:max(10px,env(safe-area-inset-left))}.media-viewer__zoom{justify-self:start}.media-viewer__fit{min-width:42px;padding-right:8px;padding-left:8px}}
@media (prefers-reduced-motion:reduce){.media-viewer__media{transition:none}}
.media-processing-note { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 10px; margin-top: 9px; padding: 10px 11px; border: 1px solid rgba(0,166,83,.14); border-radius: 12px; background: rgba(0,166,83,.045); }
.media-processing-note[hidden] { display: none; }
.media-processing-note>span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; color: #fff; background: #0a9e50; font-size: 12px; font-weight: 850; }
.media-processing-note div { display: grid; gap: 2px; }
.media-processing-note strong { font-size: 8px; }
.media-processing-note small,.media-processing-note em { color: #839089; font-size: 6px; font-style: normal; }
.media-processing-note em { color: #0a8750; white-space: nowrap; }
.media-processing-note--error { border-color:rgba(203,69,69,.24); background:rgba(203,69,69,.055); }
.media-processing-note--error>span { background:#b83f3f; }
.media-processing-note--error small,.media-processing-note--error em { color:#a24747; }

@keyframes voice-pulse { to { transform: scale(1.08); } }

@media (max-width: 360px) {
  .contact-card, .active-channel-card { grid-template-columns: 38px minmax(0,1fr) auto; gap: 8px; }
  .contact-avatar { width: 38px; height: 38px; }
  .contact-card__identity small { max-width: 120px; }
  .channel-message { max-width: 94%; }
  .composer-attachment-row > em { display: none; }
}

/* Premium refinement: quiet editorial surfaces, deliberate hierarchy. */
:root {
  --bg: #f4f5f2;
  --surface: #ffffff;
  --surface-2: #f7f8f6;
  --line: #e4e7e3;
  --text: #141714;
  --muted: #747b76;
  --green: #00a64a;
  --green-2: #008f3f;
  --cyan: #149bc3;
  --amber: #b98518;
  --danger: #d84a54;
  --shadow: 0 22px 60px rgba(20, 28, 23, .10);
  font-family: Inter, "SF Pro Text", "SF Pro Display", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

html { background: #e7e9e6; }
body {
  color: var(--text);
  background: #e7e9e6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, textarea { letter-spacing: inherit; }
.app-shell {
  background: var(--bg);
  box-shadow: 0 24px 80px rgba(27, 35, 30, .12);
}
.screen { padding-right: 22px; padding-left: 22px; }

/* Header and typography */
.topbar, .simple-header { min-height: 76px; }
.topbar {
  margin: 0 -22px;
  padding-right: 22px;
  padding-left: 22px;
  border-bottom: 1px solid rgba(228, 231, 227, .72);
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(18px) saturate(140%);
}
.brand { gap: 10px; }
.brand > span:last-child { gap: 6px; }
.brand strong { font-size: 19px; font-weight: 720; letter-spacing: -.55px; }
.brand small { color: #919792; font-size: 10px; }
.brand-asset--header { width: 32px; height: 32px; border-radius: 9px; box-shadow: none; }
.topbar-actions { gap: 5px; }
.live-pill {
  gap: 6px;
  padding: 6px 9px;
  border-color: transparent;
  color: #69716b;
  background: transparent;
  font-size: 9px;
  font-weight: 600;
}
.live-pill i, .expiry-dot { width: 5px; height: 5px; box-shadow: none; }
.icon-button {
  width: 36px;
  height: 36px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}
.icon-button:hover { background: #f1f3f0; }
.eyebrow {
  margin-bottom: 9px;
  color: #16864a;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: none;
}
.radar-copy h1, .simple-header h1 {
  font-weight: 730;
  letter-spacing: -1.35px;
}
.radar-copy h1 { font-size: clamp(29px, 7.5vw, 35px); }
.radar-copy p { color: #727a75; font-size: 12px; line-height: 1.7; }
.section-heading h2 { font-size: 18px; font-weight: 700; letter-spacing: -.45px; }

/* The radar remains the signature, but no longer dominates the page. */
.radar-hero {
  margin: 0 -22px;
  padding: 30px 22px 24px;
  border-bottom: 1px solid var(--line);
  background: #fff;
  box-shadow: none;
}
.radar { width: 300px; height: 265px; margin: -18px auto -24px; opacity: .9; }
.radar-ring { border-color: rgba(0, 166, 74, .14); box-shadow: none; }
.ring-1 { width: 96px; height: 96px; }
.ring-2 { width: 190px; height: 190px; }
.ring-3 { width: 284px; height: 284px; border-color: rgba(0, 166, 74, .075); }
.radar::before, .radar::after { background: rgba(0, 166, 74, .07); }
.radar-sweep { width: 142px; height: 142px; background: conic-gradient(from 5deg, rgba(0,166,74,.19), rgba(0,166,74,0) 36deg, transparent 36deg); }
.radar-core { filter: none; }
.brand-asset--radar { width: 40px; height: 40px; box-shadow: 0 8px 22px rgba(0, 166, 74, .14); }
.signal-dot {
  width: 7px;
  height: 7px;
  border-width: 1px;
  background: var(--green);
  box-shadow: 0 0 0 5px rgba(0,166,74,.07);
}
.range-card, .send-range {
  padding: 15px 0 12px;
  border-width: 1px 0 0;
  border-radius: 0;
  background: transparent;
}
.range-card strong, .send-range strong { font-size: 12px; font-weight: 680; }
.range-card small, .send-range small { font-size: 9px; }
.range-card output, .send-range output { color: #0b7d3d; font-size: 12px; font-variant-numeric: tabular-nums; }
input[type="range"] { height: 3px; margin-top: 15px; }
.range-marks { color: #a0a6a2; font-size: 7px; }
.relay-status {
  grid-template-columns: 28px minmax(0,1fr) auto;
  gap: 10px;
  margin-top: 8px;
  padding: 10px 0 0;
  border-width: 1px 0 0;
  border-color: var(--line);
  border-radius: 0;
  background: transparent;
}
.relay-status__signal { width: 28px; height: 28px; background: #f4f7f4; box-shadow: none; }
.relay-status__signal i:nth-child(3) { width: 25px; height: 25px; }
.relay-status strong { font-size: 9px; }
.relay-status small, .relay-status em { font-size: 7px; }
.relay-status em i { box-shadow: none; }

/* Feed cards read like a publication, not a dashboard. */
.feed-section { margin-top: 26px; }
.section-heading { margin-bottom: 13px; }
.gesture-hint { margin-bottom: 12px; color: #919892; font-size: 8px; }
.wave-feed { gap: 10px; }
.wave-card {
  padding: 17px 18px 15px;
  border-color: #e6e8e5;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(27, 35, 30, .035);
}
.wave-card--received, .wave-card--mine, .wave-card--residual { border-left-width: 1px; }
.wave-card::after { display: none; }
.wave-meta { color: #7d847f; font-size: 9px; }
.wave-source { gap: 7px; }
.wave-source i { width: 5px; height: 5px; box-shadow: none !important; }
.wave-distance::before { color: #8a938d; font-size: 12px; }
.wave-content { margin: 14px 0; color: #1a1d1b; font-size: 15px; line-height: 1.58; letter-spacing: -.14px; }
.audio-play { width: 36px; height: 36px; background: #111512; }
.waveform i { background: #88a395; }
.media-swatch { border-radius: 11px; }
.expiry { color: #969c98; font-size: 8px; }
.expiry-track { height: 1px; background: #e9ece9; }
.expiry-track i { background: #8eb89f; }
.wave-actions { gap: 0; margin-right: -9px; margin-left: -9px; padding-top: 8px; border-color: #eef0ed; }
.wave-action { min-height: 31px; border-radius: 7px; color: #7f8781; font-size: 8px; }
.wave-action span { font-size: 15px; }
.wave-action b { font-size: 7px; }
.wave-action--recommended { color: #0c7e3e; background: transparent; }

/* Navigation */
.bottom-nav {
  height: calc(72px + env(safe-area-inset-bottom));
  padding: 8px 18px calc(8px + env(safe-area-inset-bottom));
  border-top-color: rgba(221, 225, 221, .88);
  background: rgba(255,255,255,.94);
  box-shadow: 0 -10px 30px rgba(24, 32, 27, .045);
  backdrop-filter: blur(22px) saturate(145%);
}
.nav-item { gap: 2px; color: #979d99; font-size: 8px; }
.nav-item svg { width: 21px; stroke-width: 1.55; }
.nav-item--active { color: #171a18; }
.nav-item--active span { color: #171a18; font-weight: 650; }
.transmit-button {
  width: 54px;
  height: 54px;
  margin-bottom: 10px;
  background: #0a9e46;
  box-shadow: 0 0 0 6px #fff, 0 8px 24px rgba(0, 135, 58, .18);
}
.brand-asset--transmit { width: 46px; height: 46px; }
.transmit-ripple { display: none; }
.primary-action-icon { position: relative; z-index: 2; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; }
.primary-action-icon img { width: 46px; height: 46px; object-fit: contain; }
.primary-action-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.transmit-button { transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.transmit-button:active { transform: scale(.94); }
.transmit-button.primary-action--bands { background: #153628; box-shadow: 0 0 0 6px #fff, 0 8px 24px rgba(21,54,40,.2); }
.transmit-button.primary-action--band { background: var(--primary-action-color, #00a653); }
.transmit-button.primary-action--contacts { background: #157f78; box-shadow: 0 0 0 6px #fff, 0 8px 24px rgba(21,127,120,.2); }
.transmit-button.primary-action--profile { background: #2e3430; box-shadow: 0 0 0 6px #fff, 0 8px 24px rgba(30,38,33,.18); }

/* Sheets and composer */
.sheet-backdrop { background: rgba(24, 29, 26, .34); backdrop-filter: blur(3px); }
.bottom-sheet {
  padding: 8px 22px calc(24px + env(safe-area-inset-bottom));
  border-color: #e0e3df;
  border-radius: 24px 24px 0 0;
  background: #fff;
  box-shadow: 0 -16px 56px rgba(20, 27, 23, .13);
}
.sheet-handle { width: 34px; height: 3px; margin-bottom: 20px; background: #d9ddda; }
.bottom-sheet h2 { font-size: 23px; font-weight: 730; letter-spacing: -.9px; }
.compose-field { margin-top: 20px; }
.compose-field > span { margin-bottom: 9px; color: #525b55; font-size: 10px; font-weight: 600; }
.compose-field textarea {
  min-height: 124px;
  padding: 16px 16px 30px;
  border-color: #e0e4e0;
  border-radius: 13px;
  background: #fafbfa;
  line-height: 1.62;
}
.compose-field textarea:focus { border-color: #a5cdb4; background: #fff; }
.compose-field textarea::placeholder { color: #a2a8a4; }
.composer-attachment-row { margin-top: 10px; }
.composer-attachment-row > em { color: #929995; font-size: 7px; }
.add-attachment-button {
  padding: 6px 9px 6px 6px;
  border-color: transparent;
  border-radius: 10px;
  background: transparent;
}
.add-attachment-button:hover, .add-attachment-button[aria-expanded="true"], .add-attachment-button--active { border-color: transparent; background: #f3f6f3; }
.add-attachment-button > span { width: 26px; height: 26px; background: #171b18; font-size: 16px; }
.add-attachment-button > b { font-size: 9px; font-weight: 650; }
.add-attachment-button > small { font-size: 6px; }
.attachment-menu {
  gap: 0;
  padding: 7px 0;
  border-width: 1px 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.attachment-menu > button { border-radius: 9px; background: transparent; }
.attachment-menu > button:not(:last-child) { border-right: 1px solid #eceeeb; }
.attachment-menu > button > span { background: #f0f3f0; }
.attachment-menu > button > b { font-weight: 650; }
.attachment-preview { border-color: #e1e5e1; border-radius: 12px; background: #f7f9f7; }
.preview-visual { border-radius: 9px; }
.send-range { margin-top: 18px; }
.send-policy {
  margin-top: 12px;
  padding: 15px 0 4px;
  border-width: 1px 0 0;
  border-radius: 0;
  background: transparent;
}
.send-policy__header { margin-bottom: 10px; }
.band-badge { padding: 4px 0; border-radius: 0; background: transparent !important; font-size: 8px; letter-spacing: .3px; }
.energy-balance { font-size: 8px; }
.send-policy > strong { font-size: 11px; }
.send-policy > p { margin-bottom: 10px; color: #7d847f; font-size: 7px; }
.send-policy__stats { gap: 0; border-top: 1px solid #eceeeb; border-bottom: 1px solid #eceeeb; }
.send-policy__stats > span { padding: 10px 8px; border: 0; border-radius: 0; background: transparent; }
.send-policy__stats > span:not(:last-child) { border-right: 1px solid #eceeeb; }
.send-policy__stats small { font-size: 6px; }
.send-policy__stats b { font-size: 8px; }
.country-boundary { margin-top: 8px; padding: 9px 0; border-radius: 0; background: transparent; }
.country-boundary > span:first-child { color: #737c76; font-size: 16px; }
.country-boundary strong { color: #3d4942; }
.upgrade-route { border-top-style: solid; }
.upgrade-route span { color: #0c7e3e; }
.expiry-row { margin: 14px 1px; }
.primary-button {
  height: 50px;
  border-radius: 12px;
  background: #0a9e46;
  box-shadow: none;
  font-size: 13px;
  font-weight: 720;
}
.voice-recorder { padding: 12px 0 0; border-width: 1px 0 0; border-radius: 0; background: transparent; }
.voice-record-button { min-height: 66px; border-radius: 13px; background: #0d9e48; box-shadow: none; }
.voice-record-button::after { display: none; }
.voice-record-button__asset { width: 46px; height: 46px; border-width: 2px; }
.voice-record-button > b { font-size: 12px; }

/* Identity and system sheets: fewer boxes, more structure. */
.identity-hero {
  margin-top: 15px;
  padding: 20px 18px;
  border-radius: 15px;
  background: #101713;
}
.identity-orbit::before, .identity-orbit::after, .identity-orbit i { border-color: rgba(116, 232, 164, .18); }
.identity-hero strong { font-size: 17px; }
.identity-hero em { padding: 3px 0; color: #75d99b; background: transparent; }
.identity-intro { margin: 12px 1px; font-size: 8px; line-height: 1.65; }
.identity-boundaries { gap: 0; margin-bottom: 12px; border-top: 1px solid #e8ebe7; border-bottom: 1px solid #e8ebe7; }
.identity-boundaries span { padding: 8px 7px; border-radius: 0; color: #626c65; background: transparent; font-size: 6px; }
.identity-boundaries span:not(:last-child) { border-right: 1px solid #e8ebe7; }
.identity-protection, .device-integrity {
  padding: 13px 0;
  border-width: 0 0 1px;
  border-color: #e6e9e5;
  border-radius: 0;
  background: transparent;
}
.identity-protection__icon, .device-integrity__icon { border-radius: 9px; }
.device-integrity { margin-top: 0; }
.device-integrity__header em { padding: 3px 0; background: transparent; }
.device-integrity__signals { gap: 0; margin-bottom: 8px; }
.device-integrity__signals span { padding: 3px 7px; border: 0; border-radius: 0; background: transparent; }
.device-integrity__signals span:not(:last-child) { border-right: 1px solid #e4e7e3; }
.identity-levels { gap: 0; margin-top: 10px; border-top: 1px solid #e6e9e5; }
.identity-levels > div {
  padding: 11px 2px;
  border-width: 0 0 1px;
  border-color: #e6e9e5;
  border-radius: 0;
  background: transparent !important;
}
.identity-levels > div > b { background: #eef0ed; }
.identity-levels > div.identity-level--active { border-color: #d9e5dc; }
.identity-trust-button { margin: 14px 0 18px; }
.identity-legal-note { margin-top: 12px; color: #989e9a; }
.relay-visual, .relay-toggle, .relay-boundary, .relay-rules > div, .principles > div,
.device-pass, .report-target, .echo-parent, .channel-composer {
  border-radius: 12px;
  box-shadow: none;
}
.relay-stats { gap: 0; border-top: 1px solid #e7eae6; border-bottom: 1px solid #e7eae6; }
.relay-stats span { border-radius: 0; background: transparent; }
.relay-stats span:not(:last-child) { border-right: 1px solid #e7eae6; }

.toast { border: 0; border-radius: 10px; background: rgba(18, 23, 20, .94); box-shadow: 0 12px 32px rgba(0,0,0,.16); }

@media (min-width: 700px) {
  body { padding: 24px 0; }
  .app-shell { min-height: calc(100dvh - 48px); border: 1px solid rgba(30, 38, 33, .08); border-radius: 26px; }
  .screen { min-height: calc(100dvh - 48px); }
  .bottom-nav { bottom: 24px; border-radius: 0 0 26px 26px; }
  .bottom-sheet { bottom: 24px; border-radius: 24px; }
}

/* Public listening is independent from private frequency channels. */
.public-receive-toggle {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) 42px;
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 12px 0;
  border: 0;
  border-top: 1px solid var(--line);
  color: inherit;
  text-align: left;
  background: transparent;
  cursor: pointer;
}
.public-receive-toggle__signal { position: relative; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; color: var(--green); background: #edf6f0; }
.public-receive-toggle__signal i { position: absolute; border: 1px solid currentColor; border-radius: 50%; opacity: .45; }
.public-receive-toggle__signal i:nth-child(1) { width: 5px; height: 5px; border: 0; background: currentColor; opacity: 1; }
.public-receive-toggle__signal i:nth-child(2) { width: 15px; height: 15px; }
.public-receive-toggle__signal i:nth-child(3) { width: 24px; height: 24px; opacity: .24; }
.public-receive-toggle > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.public-receive-toggle strong { color: #202622; font-size: 10px; font-weight: 680; }
.public-receive-toggle small { color: #7e8781; font-size: 8px; }
.switch-track { position: relative; display: block; width: 40px; height: 23px; border-radius: 999px; background: var(--green); transition: background .2s ease; }
.switch-track b { position: absolute; top: 3px; left: 20px; width: 17px; height: 17px; border-radius: 50%; background: #fff; box-shadow: 0 2px 7px rgba(19,30,23,.2); transition: left .2s ease; }
.public-receive-toggle--paused .public-receive-toggle__signal { color: #8e9690; background: #eff1ef; }
.public-receive-toggle--paused .switch-track { background: #cbd0cc; }
.public-receive-toggle--paused .switch-track b { left: 3px; }
.radar-hero .radar, .radar-hero .range-card { transition: opacity .25s ease, filter .25s ease; }
.radar-hero--paused .radar { opacity: .25; filter: grayscale(1); }
.radar-hero--paused .radar-sweep { animation-play-state: paused; }
.radar-hero--paused .range-card { opacity: .5; }
.radar-hero--paused .range-card input { cursor: not-allowed; }
.live-pill--paused { color: #919792; }
.live-pill--paused i { background: #a7ada8; animation: none; }

/* A public encounter can become a private frequency only by mutual consent. */
.frequency-request-panel {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  flex: 0 0 auto;
  margin: 0 0 13px;
  padding: 11px 0;
  border-top: 1px solid #e7eae6;
  border-bottom: 1px solid #e7eae6;
}
.frequency-request-panel__icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; color: #fff; background: #151a17; font-size: 20px; }
.frequency-request-panel > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.frequency-request-panel strong { color: #242a26; font-size: 9px; }
.frequency-request-panel small { color: #7f8882; font-size: 7px; line-height: 1.45; }
.frequency-request-panel button {
  min-width: 76px;
  min-height: 32px;
  padding: 7px 9px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: #0a9e46;
  font-size: 8px;
  font-weight: 700;
  cursor: pointer;
}
.frequency-request-panel button[data-request-state="contact"] { color: #0a7d3a; background: #eaf5ee; }
.frequency-request-panel button:disabled { color: #8a928c; background: #eef0ee; cursor: default; }
.frequency-request-section { margin-top: 22px; }
.frequency-request-list { display: grid; gap: 8px; }
.frequency-request-card {
  display: grid;
  grid-template-columns: 40px minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 0;
  border-top: 1px solid #e5e8e4;
  border-bottom: 1px solid #e5e8e4;
}
.frequency-request-card > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.frequency-request-card strong { color: #252b27; font-size: 9px; }
.frequency-request-card small { color: #828b85; font-size: 7px; }
.frequency-request-card > button { padding: 7px 9px; border: 0; border-radius: 9px; color: #0a7d3a; background: #eaf5ee; font-size: 7px; font-weight: 700; cursor: pointer; }

@media (max-width: 380px) {
  .frequency-request-panel { grid-template-columns: 30px minmax(0,1fr); }
  .frequency-request-panel button { grid-column: 2; justify-self: start; }
}

/* Server-derived city attribution; raw IP addresses are never rendered. */
.wave-meta { align-items: flex-start; gap: 10px; }
.wave-source { min-width: 0; flex-wrap: wrap; row-gap: 3px; }
.wave-source > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wave-source em {
  padding-left: 7px;
  border-left: 1px solid #dfe3df;
  color: #7d867f;
  font-size: 7px;
  font-style: normal;
  font-weight: 600;
  white-space: nowrap;
}
.echo-parent__meta > span:first-child { display: flex; min-width: 0; align-items: center; gap: 7px; }
.echo-parent__meta b { padding-left: 7px; border-left: 1px solid #dfe3df; color: #66746b; font-size: 7px; font-weight: 650; white-space: nowrap; }
.contact-card__identity em { overflow: hidden; color: #a0a7a2; font-size: 6px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }

@media (max-width: 360px) {
  .wave-source em { flex-basis: calc(100% - 14px); margin-left: 14px; padding-left: 0; border-left: 0; }
}

/* Optional shared frequency nickname and receiver-only contact remark. */
.identity-nickname {
  display: grid;
  gap: 9px;
  padding: 13px 0;
  border-bottom: 1px solid #e6e9e5;
}
.identity-nickname > span { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.identity-nickname strong { color: #253029; font-size: 10px; }
.identity-nickname small { color: #87908a; font-size: 7px; }
.identity-nickname label { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }
.identity-nickname input, .contact-remark-field input {
  min-width: 0;
  height: 39px;
  padding: 0 12px;
  border: 1px solid #dfe4df;
  border-radius: 10px;
  color: var(--text);
  background: #f8faf8;
  font-size: 10px;
  outline: 0;
}
.identity-nickname input:focus, .contact-remark-field input:focus { border-color: #8fc6a4; background: #fff; }
.identity-nickname label button { min-width: 58px; border: 0; border-radius: 10px; color: #fff; background: #151a17; font-size: 8px; font-weight: 700; cursor: pointer; }
.identity-nickname p { margin: 0; color: #929a95; font-size: 7px; line-height: 1.5; }

.language-settings { display: grid; gap: 9px; padding: 13px 0; border-bottom: 1px solid #e6e9e5; }
.language-settings > span { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.language-settings strong { color: #253029; font-size: 10px; }
.language-settings small { color: #87908a; font-size: 7px; text-align: right; }
.language-settings label { position: relative; display: block; }
.language-settings select {
  width: 100%;
  height: 41px;
  appearance: none;
  padding: 0 38px 0 12px;
  border: 1px solid #dde3df;
  border-radius: 10px;
  outline: 0;
  color: #253029;
  background: #f8faf8;
  font-size: 10px;
  cursor: pointer;
}
.language-settings select:focus { border-color: #8fc6a4; background: #fff; }
.language-settings label i { position: absolute; top: 50%; right: 13px; color: #6f7b74; font-size: 12px; font-style: normal; transform: translateY(-53%); pointer-events: none; }
.language-settings p { margin: 0; color: #16864a; font-size: 7px; line-height: 1.5; }

.contact-card > .contact-card__identity {
  display: flex;
  min-width: 0;
  min-height: 0;
  align-items: flex-start;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 0;
  color: inherit;
  text-align: left;
  background: transparent;
  font-size: inherit;
  font-weight: 400;
  cursor: pointer;
}
.contact-card > .contact-card__identity:hover strong { color: #087d3b; }
.contact-card > .contact-card__identity::after { align-self: flex-start; margin-top: 1px; color: #a5aca7; content: "编辑"; font-size: 6px; }

.contact-remark-profile {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr);
  gap: 12px;
  align-items: center;
  margin: 15px 0 20px;
  padding: 14px 0;
  border-top: 1px solid #e6e9e5;
  border-bottom: 1px solid #e6e9e5;
}
.contact-remark-profile .contact-avatar { width: 44px; height: 44px; }
.contact-remark-profile > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.contact-remark-profile strong { color: #232a26; font-size: 12px; }
.contact-remark-profile small { color: #737d76; font-size: 8px; }
.contact-remark-profile em { color: #0a7d3a; font-size: 7px; font-style: normal; }
.contact-remark-field { display: grid; gap: 7px; margin-bottom: 16px; }
.contact-remark-field > span { color: #3b463f; font-size: 9px; font-weight: 700; }
.contact-remark-field > small { color: #8d9690; font-size: 7px; }
.contact-remark-sheet .cancel-button { margin-top: 9px; }

/* Signature scanner: a quiet oscilloscope whose trace reacts to incoming waves. */
.radar.oscilloscope {
  isolation: isolate;
  width: calc(100% + 44px);
  height: 172px;
  margin: 20px -22px 16px;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
  transform: none;
}
.radar.oscilloscope::before,
.radar.oscilloscope::after { display: none; }
.oscilloscope-head,
.oscilloscope-foot { position: relative; z-index: 3; display: flex; align-items: center; justify-content: space-between; }
.oscilloscope-head { height: 19px; padding: 0 22px; color: #87928c; font: 600 7px/1 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: 1.05px; }
.oscilloscope-head span { display: flex; align-items: center; gap: 7px; }
.oscilloscope-head i { width: 5px; height: 5px; border-radius: 50%; background: #20cf77; box-shadow: 0 0 8px rgba(32,207,119,.65); }
.oscilloscope-head strong { color: #76827b; font-size: 7px; font-weight: 500; letter-spacing: .45px; }
.oscilloscope-display {
  position: relative;
  height: 126px;
  margin: 2px 0 3px;
  overflow: hidden;
  border: 0;
  background: transparent;
}
.oscilloscope-display svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.oscilloscope-centerline { fill: none; stroke: rgba(0, 133, 59, .12); stroke-width: .7; stroke-dasharray: 2 6; vector-effect: non-scaling-stroke; }
.oscilloscope-trace { fill: none; stroke: #00ad51; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.oscilloscope-trace--ghost { opacity: .1; stroke: #00ad51; stroke-width: 5; filter: blur(3px); }
.oscilloscope-playhead {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  left: -4px;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(0,173,81,.14) 22%, rgba(0,173,81,.48) 50%, rgba(0,173,81,.14) 78%, transparent);
  box-shadow: 0 0 9px rgba(0,173,81,.13);
  animation: scope-read 3.6s linear infinite;
}
.oscilloscope-foot { height: 13px; padding: 0 22px; color: #9aa39e; font: 500 6px/1 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .7px; }
.oscilloscope-foot span:last-child { color: #87928c; }
.oscilloscope[data-signal-state="incoming"] { background: transparent; }
.oscilloscope[data-signal-state="incoming"] .oscilloscope-head strong,
.oscilloscope[data-signal-state="incoming"] .oscilloscope-foot span:last-child { color: #47dd8b; }
.radar-hero--paused .radar.oscilloscope { opacity: .58; filter: grayscale(.85); }
.radar-hero--paused .oscilloscope-playhead { animation-play-state: paused; }

@keyframes scope-read { to { transform: translateX(min(100vw, 480px)); } }

@media (prefers-reduced-motion: reduce) {
  .oscilloscope-playhead { display: none; }
}

/* v0.6 · isolated band channels */
.band-channel-screen { padding:0 22px 164px; background:#f4f6f4; }
.band-channel-header { display:grid; grid-template-columns:44px 1fr 44px; gap:12px; align-items:center; padding:24px 0 18px; }
.band-channel-header>button { display:grid; place-items:center; width:42px; height:42px; padding:0; border:1px solid #dce3de; border-radius:15px; color:#2d3931; background:#fff; font-size:18px; }
.band-channel-header>button:last-child { color:#718078; font-size:10px; font-weight:800; }
.band-channel-header>div { text-align:center; }.band-channel-header h1 { margin:4px 0 0; font-size:25px; letter-spacing:-.04em; }.band-channel-header .eyebrow { font-size:9px; }
.band-channel-hero { --band-color:#00ad57; position:relative; display:flex; gap:20px; align-items:center; min-height:150px; padding:24px; border-radius:29px; color:#fff; background:linear-gradient(135deg,#0b1812,#112d20); overflow:hidden; box-shadow:0 17px 34px rgba(20,42,29,.15); }
.band-channel-hero::after { content:""; position:absolute; right:-45px; width:180px; height:180px; border:1px solid color-mix(in srgb,var(--band-color) 35%,transparent); border-radius:50%; box-shadow:0 0 0 26px color-mix(in srgb,var(--band-color) 7%,transparent),0 0 0 54px color-mix(in srgb,var(--band-color) 4%,transparent); }
.band-channel-scope { position:relative; z-index:1; display:grid; place-items:center; width:86px; height:86px; flex:0 0 86px; border-radius:27px; color:var(--band-color); background:color-mix(in srgb,var(--band-color) 17%,#0d2017); }
.band-channel-scope i { position:absolute; width:64px; height:64px; border:1px solid currentColor; border-radius:50%; opacity:.26; }.band-channel-scope i:nth-child(2){width:39px;height:39px;opacity:.45}.band-channel-scope i:nth-child(3){width:9px;height:9px;background:currentColor;opacity:1;box-shadow:0 0 20px currentColor}.band-channel-scope span { position:absolute; bottom:10px; font:800 8px/1 ui-monospace,monospace; letter-spacing:.13em; }
.band-channel-hero>div:last-child { position:relative; z-index:1; display:flex; min-width:0; flex-direction:column; }.band-channel-hero>div:last-child>span { color:var(--band-color); font-size:9px; font-weight:850; letter-spacing:.08em; }.band-channel-hero>div:last-child>strong { margin:7px 0 11px; font-size:14px; line-height:1.5; }.band-channel-hero>div:last-child>small { color:#a7b9ae; font-size:10px; }.band-channel-hero>div:last-child>small b { color:#fff; font-size:14px; }
.band-permission-card { display:flex; gap:12px; align-items:center; margin:14px 0 28px; padding:14px 16px; border:1px solid #d5e7dc; border-radius:19px; background:#edf8f2; }.band-permission-dot { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:12px; background:#d4f1e0; }.band-permission-dot i { width:8px; height:8px; border-radius:50%; background:#00ad57; box-shadow:0 0 0 5px rgba(0,173,87,.12); }.band-permission-card>div { display:flex; min-width:0; flex:1; flex-direction:column; gap:3px; }.band-permission-card strong { color:#183526; font-size:11px; }.band-permission-card small { color:#769082; font-size:8px; }.band-permission-card em { padding:5px 8px; border-radius:8px; color:#008a46; background:#d9f3e4; font-style:normal; font-size:9px; font-weight:800; }
.band-owner-tools { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; align-items:center; margin:-16px 0 28px; padding:11px 12px; border:1px solid #dfe7e2; border-radius:16px; background:#f7faf8; }.band-owner-tools[hidden]{display:none}.band-owner-tools>div { display:flex; min-width:0; flex-direction:column; gap:2px; }.band-owner-tools span,.band-owner-tools small { color:#87928b; font-size:7px; }.band-owner-tools strong { overflow:hidden; color:#18392a; font:800 10px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.04em; text-overflow:ellipsis; white-space:nowrap; }.band-owner-tools>button { height:32px; padding:0 10px; border:1px solid #d5e2da; border-radius:10px; color:#087340; background:#fff; font-size:8px; font-weight:800; }.band-owner-tools>button:last-child { border-color:#0b8e4b; color:#fff; background:#0b8e4b; }
.band-channel-feed { padding-bottom:18px; }.band-channel-feed .section-heading { margin-bottom:11px; }.band-channel-feed .gesture-hint { margin-bottom:14px; }
.compose-destination { --destination-color:#00ad57; display:grid; grid-template-columns:48px 1fr; column-gap:12px; align-items:center; margin:4px 0 17px; padding:12px 14px; border:1px solid color-mix(in srgb,var(--destination-color) 24%,#dfe5e1); border-radius:17px; background:color-mix(in srgb,var(--destination-color) 7%,#fff); }.compose-destination>span { grid-row:1/3; display:grid; place-items:center; width:48px; height:48px; border-radius:15px; color:#fff; background:var(--destination-color); font:850 8px/1 ui-monospace,monospace; letter-spacing:.08em; }.compose-destination strong { align-self:end; color:#26332b; font-size:12px; }.compose-destination small { align-self:start; color:#829087; font-size:9px; }
@media (max-width:380px){.band-channel-hero{padding:20px;gap:14px}.band-channel-scope{width:72px;height:72px;flex-basis:72px}.band-permission-card em{display:none}}

/* v0.7 · favorite bands, unread badges and notification boundaries */
.nav-item { position:relative; }.nav-unread-badge { position:absolute; top:3px; left:calc(50% + 8px); display:grid; place-items:center; min-width:17px; height:17px; padding:0 5px; border:2px solid #fff; border-radius:999px; color:#fff; background:#ff4c56; font-size:8px; font-weight:850; line-height:1; }.nav-unread-badge[hidden]{display:none}
.favorite-bands { margin:0 22px 28px; padding:18px; border:1px solid #dbe4de; border-radius:24px; background:#fff; box-shadow:0 10px 28px rgba(35,51,42,.05); }.favorite-bands>.contact-section-heading { margin-bottom:12px; }.favorite-bands>p { margin:12px 3px 0; color:#929b95; font-size:9px; line-height:1.5; }
.my-bands { margin:0 22px 18px; padding:18px; border:1px solid #d9e5de; border-radius:24px; background:linear-gradient(145deg,#fbfdfc,#f1f8f4); box-shadow:0 10px 28px rgba(35,51,42,.045); }.my-bands>.contact-section-heading { margin-bottom:12px; }.my-band-list { display:grid; gap:10px; }.my-band-card { --band-color:#00a653; position:relative; display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; padding:14px; border-radius:19px; color:#fff; background:linear-gradient(135deg,#0b1d14,#153425); overflow:hidden; }.my-band-card::after { content:""; position:absolute; right:-35px; bottom:-55px; width:130px; height:130px; border:1px solid color-mix(in srgb,var(--band-color) 38%,transparent); border-radius:50%; box-shadow:0 0 0 22px color-mix(in srgb,var(--band-color) 8%,transparent); }.my-band-card__signal { position:relative; z-index:1; display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:var(--band-color); font:850 8px/1 ui-monospace,monospace; letter-spacing:.06em; }.my-band-card__body { position:relative; z-index:1; display:flex; min-width:0; flex-direction:column; }.my-band-card__title { display:flex; gap:7px; align-items:center; }.my-band-card__title strong { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.my-band-card__title em { padding:3px 6px; border-radius:6px; color:#a7f0c7; background:rgba(0,179,88,.14); font-style:normal; font-size:7px; font-weight:800; }.my-band-card__body>p { overflow:hidden; margin:6px 0 8px; color:#b2c1b8; font-size:9px; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }.my-band-card__meta { display:flex; flex-wrap:wrap; gap:5px 9px; color:#829c8d; font-size:7px; }.my-band-card__meta b { color:#d6e8de; font:700 7px/1.4 ui-monospace,monospace; letter-spacing:.04em; }.my-band-card__actions { position:relative; z-index:1; grid-column:1/-1; display:grid; grid-template-columns:1fr auto; gap:8px; margin-top:1px; }.my-band-card__actions button { height:35px; border:1px solid rgba(255,255,255,.13); border-radius:11px; color:#fff; background:rgba(255,255,255,.07); font-size:9px; font-weight:800; }.my-band-card__actions button:first-child { border-color:var(--band-color); background:var(--band-color); }.my-band-empty { display:flex; min-height:142px; flex-direction:column; align-items:center; justify-content:center; padding:18px; border:1px dashed #cfded5; border-radius:18px; color:#89958e; text-align:center; }.my-band-empty[hidden]{display:none}.my-band-empty>span { display:grid; place-items:center; width:38px; height:38px; border-radius:13px; color:#008e48; background:#e5f4eb; font-size:20px; }.my-band-empty strong { margin:9px 0 4px; color:#3e4b43; font-size:12px; }.my-band-empty small { font-size:8px; }.my-band-empty button { height:34px; margin-top:11px; padding:0 13px; border:0; border-radius:11px; color:#fff; background:#143325; font-size:9px; font-weight:800; }
.my-band-empty { width:100%; background:rgba(255,255,255,.16); font:inherit; cursor:pointer; transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.my-band-empty:hover { border-color:#8fc7aa; background:rgba(236,249,242,.7); }
.my-band-empty:active { transform:scale(.992); }
.my-band-empty:focus-visible { outline:3px solid rgba(0,166,83,.18); outline-offset:3px; }
.my-band-empty>span { width:44px; height:44px; border-radius:14px; font-size:23px; transition:transform .18s ease,background .18s ease; }
.my-band-empty:hover>span { transform:translateY(-2px); background:#d9f1e3; }
.favorite-band-list { display:grid; gap:9px; }.favorite-band-card { --band-color:#00ad57; display:grid; grid-template-columns:1fr auto; gap:8px; align-items:stretch; }.favorite-band-card>button:first-child { display:grid; min-width:0; grid-template-columns:38px 1fr auto; gap:10px; align-items:center; padding:11px; border:0; border-radius:16px; color:#28332c; background:color-mix(in srgb,var(--band-color) 7%,#f4f6f4); text-align:left; }.favorite-band-card>button:first-child>span:first-child { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; color:#fff; background:var(--band-color); font:800 7px/1 ui-monospace,monospace; letter-spacing:.07em; }.favorite-band-card>button:first-child>span:nth-child(2) { display:flex; min-width:0; flex-direction:column; gap:4px; }.favorite-band-card strong { font-size:12px; }.favorite-band-card small { overflow:hidden; color:#7c8780; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }.favorite-band-card>button:first-child>b { display:grid; place-items:center; min-width:20px; height:20px; padding:0 5px; border-radius:999px; color:#fff; background:#ff4c56; font-size:8px; }
.band-card__body strong em { display:inline-flex; margin-left:7px; padding:3px 5px; border-radius:6px; color:var(--band-color); background:color-mix(in srgb,var(--band-color) 10%,#fff); font-style:normal; font-size:7px; vertical-align:middle; }.band-card__latest { display:flex; min-width:0; gap:6px; align-items:center; margin-top:9px; padding-top:8px; border-top:1px solid #edf0ee; }.band-card__latest b { flex:0 0 auto; color:var(--band-color); font-size:8px; }.band-card__latest span { overflow:hidden; color:#8b948e; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }.band-card>button { position:relative; }.band-card>button>b { position:absolute; top:-7px; right:-7px; display:grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border:2px solid #fff; border-radius:999px; color:#fff; background:#ff4c56; font-size:7px; }
.band-notification-button { display:grid; place-items:center; width:42px; min-width:42px; padding:0; border:1px solid #cfe5d8; border-radius:14px; color:#008f49; background:#eef9f3; }.band-notification-button[hidden]{display:none!important}.band-notification-button svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }.band-notification-button .band-notification-slash { opacity:0; stroke-width:2.2; }.band-notification-button.is-muted { color:#8e9791!important; background:#f0f2f1!important; border-color:#e0e4e1!important; }.band-notification-button.is-muted .band-notification-slash { opacity:1; }
@media (max-width:380px){.favorite-bands,.my-bands{margin-right:0;margin-left:0}.favorite-band-card small{max-width:150px}.band-card__latest{grid-column:1/-1}}
.favorite-band-card>button:first-child>b.is-active,.band-card>button>b.is-active { background:var(--band-color); }

/* v0.8 · pinned favorites, direct follow and channel directory */
.favorite-band-empty { display:flex; min-height:116px; flex-direction:column; align-items:center; justify-content:center; padding:14px; border:1px dashed #d8e1db; border-radius:17px; color:#8d9891; text-align:center; }.favorite-band-empty[hidden]{display:none}.favorite-band-empty>span{color:#00a653;font-size:25px}.favorite-band-empty strong{margin:7px 0 4px;color:#435047;font-size:12px}.favorite-band-empty small{max-width:260px;font-size:9px;line-height:1.5}
.band-search { margin:0 22px 22px; }.band-search>div { margin-bottom:10px; }.band-search h2 { margin:3px 0 0; font-size:18px; }.band-search>label { display:grid; grid-template-columns:20px 1fr auto; gap:8px; align-items:center; padding:6px 7px 6px 13px; border:1px solid #d9e1dc; border-radius:17px; background:#fff; box-shadow:0 7px 20px rgba(36,52,43,.04); }.band-search svg { width:18px; fill:none; stroke:#758078; stroke-width:1.7; }.band-search input { min-width:0; height:36px; border:0; outline:0; color:#273229; background:transparent; font-size:12px; }.band-search input::placeholder{color:#a0a8a3}.band-search label>button { height:36px; padding:0 14px; border:0; border-radius:11px; color:#fff; background:#143325; font-size:10px; font-weight:800; }.band-search>small { display:block; margin:7px 4px 0; color:#9aa29d; font-size:8px; }
.band-search-results { margin:0 22px 25px; padding:18px; border:1px solid #dce4df; border-radius:24px; background:#fff; }.band-search-results[hidden]{display:none}.band-search-results>.contact-section-heading{margin-bottom:12px}.band-search-results>.contact-section-heading button{padding:0;border:0;background:transparent}.band-search-results>div:nth-child(2){display:grid;gap:10px}
.band-directory-card { --band-color:#338e70; display:grid; grid-template-columns:44px 1fr; gap:12px; padding:14px; border:1px solid #e1e6e3; border-radius:18px; }.band-directory-card>span { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; color:#fff; background:var(--band-color); font:800 7px/1 ui-monospace,monospace; letter-spacing:.06em; }.band-directory-card>div:nth-child(2)>span { display:flex; gap:7px; align-items:center; }.band-directory-card h3,.band-directory-card strong{font-size:13px}.band-directory-card em{padding:3px 5px;border-radius:6px;color:var(--band-color);background:color-mix(in srgb,var(--band-color) 9%,#fff);font-style:normal;font-size:7px}.band-directory-card p{margin:5px 0;color:#707b73;font-size:9px;line-height:1.45}.band-directory-card small{color:#9aa29d;font-size:8px}.band-directory-card>div:last-child{grid-column:2;display:flex;gap:7px}.band-directory-card>div:last-child button{min-height:34px;padding:0 11px;border:0;border-radius:10px;color:#087442;background:#e9f7ef;font-size:9px;font-weight:800}.band-directory-card>div:last-child button:last-child{color:#fff;background:#00a653}.band-directory-card>div:last-child button:only-child{color:#fff;background:#143325}.band-directory-card>div:last-child button:disabled{color:#7e8982;background:#e9eeeb}
.band-search-empty { display:flex; min-height:150px; flex-direction:column; align-items:center; justify-content:center; color:#929c95; text-align:center; }.band-search-empty[hidden]{display:none}.band-search-empty span{font-size:28px;color:#00a653}.band-search-empty strong{margin:8px 0 4px;color:#39463e;font-size:12px}.band-search-empty small{font-size:9px}
.band-card__actions { display:flex; flex-direction:column; gap:7px; align-items:stretch; }.band-card__actions>button { min-width:48px; min-height:34px; border:0; border-radius:11px; font-size:9px; font-weight:800; }.band-card__favorite-button { color:#7a867e; background:#f0f3f1; font-size:16px!important; }.band-card__favorite-button.is-followed { color:#fff; background:var(--band-color); }.band-card__enter-button { position:relative; color:var(--band-color); background:color-mix(in srgb,var(--band-color) 10%,#fff); }.band-card--active .band-card__enter-button{color:#fff;background:var(--band-color)}.band-card__enter-button>b { position:absolute; top:-7px; right:-7px; display:grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border:2px solid #fff; border-radius:999px; color:#fff; background:#ff4c56; font-size:7px; }.band-card__enter-button>b.is-active{background:var(--band-color)}
@media(max-width:390px){.band-search,.band-search-results{margin-right:0;margin-left:0}.band-card{grid-template-columns:58px 1fr}.band-card__actions{grid-column:2;flex-direction:row}.band-card__actions>button{min-width:58px}}
.band-channel-header { grid-template-columns:44px 1fr auto; }.band-channel-header-actions { display:flex; gap:7px; }.band-channel-header-actions>button { display:grid; place-items:center; width:39px; height:39px; padding:0; border:1px solid #dce3de; border-radius:13px; color:#718078; background:#fff; font-size:9px; font-weight:800; }.band-channel-header-actions>button[hidden]{display:none}.band-channel-header-actions>#band-follow-button { color:#008f49; font-size:21px; }.band-channel-header-actions>#band-follow-button.is-followed { color:#fff; background:#00a653; border-color:#00a653; }.band-channel-header-actions>.band-notification-button { color:#008f49; background:#eef9f3; border-color:#cfe5d8; }

/* v0.9 · temporary band creation */
.band-create-preview { border-style:solid; border-color:#d8e5dd; background:linear-gradient(135deg,#fbfdfc,#f0f8f3); box-shadow:0 10px 26px rgba(31,57,42,.045); }.band-create-preview>i { padding:5px 8px; border-radius:8px; color:#008b47; background:#ddf3e6; font-weight:800; }
.temporary-band-sheet { max-height:94dvh; }.temporary-band-intro { margin:8px 0 18px; color:#77827b; font-size:10px; line-height:1.65; }.temporary-band-existing { display:grid; grid-template-columns:42px 1fr auto; gap:11px; align-items:center; margin-bottom:16px; padding:12px; border:1px solid #cfe4d7; border-radius:17px; background:#eff9f3; }.temporary-band-existing[hidden]{display:none}.temporary-band-existing>span { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; color:#fff; background:#00a653; font:800 7px/1 ui-monospace,monospace; letter-spacing:.08em; }.temporary-band-existing>div { display:flex; min-width:0; flex-direction:column; gap:3px; }.temporary-band-existing small,.temporary-band-existing em { color:#789084; font-size:8px; font-style:normal; }.temporary-band-existing strong { overflow:hidden; color:#21372b; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.temporary-band-existing>button { height:34px; padding:0 12px; border:0; border-radius:11px; color:#fff; background:#123628; font-size:9px; font-weight:800; }
.temporary-band-field { display:block; margin:0 0 14px; }.temporary-band-field>span { display:flex; justify-content:space-between; align-items:center; margin:0 2px 7px; }.temporary-band-field>span strong { color:#344139; font-size:10px; }.temporary-band-field>span small { color:#9aa39d; font-size:8px; font-weight:500; }.temporary-band-field>span b { color:#65736a; }.temporary-band-field input,.temporary-band-field textarea { width:100%; border:1px solid #dfe5e1; border-radius:14px; outline:none; color:#27332c; background:#f8faf9; font:inherit; font-size:11px; transition:.18s; }.temporary-band-field input { height:46px; padding:0 14px; }.temporary-band-field textarea { min-height:78px; padding:13px 14px; resize:none; line-height:1.55; }.temporary-band-field input:focus,.temporary-band-field textarea:focus { border-color:#8bd0aa; background:#fff; box-shadow:0 0 0 3px rgba(0,166,83,.07); }.temporary-band-field input::placeholder,.temporary-band-field textarea::placeholder { color:#a6ada9; }
.temporary-band-options { min-width:0; margin:0 0 15px; padding:0; border:0; }.temporary-band-options legend { margin:0 0 8px 2px; color:#344139; font-size:10px; font-weight:750; }.temporary-band-options>p { margin:7px 2px 0; color:#969f99; font-size:8px; line-height:1.45; }.temporary-band-choice { display:grid; gap:8px; }.temporary-band-choice--two { grid-template-columns:repeat(2,1fr); }.temporary-band-choice--three { grid-template-columns:repeat(3,1fr); }.temporary-band-choice--four { grid-template-columns:repeat(2,1fr); }.temporary-band-choice button { display:flex; min-width:0; min-height:56px; flex-direction:column; align-items:flex-start; justify-content:center; gap:4px; padding:10px 11px; border:1px solid #e0e5e2; border-radius:14px; color:#506058; background:#fafbfa; text-align:left; }.temporary-band-choice button strong { font-size:10px; }.temporary-band-choice button small { overflow:hidden; width:100%; color:#949d97; font-size:7px; text-overflow:ellipsis; white-space:nowrap; }.temporary-band-choice button.is-selected { border-color:#8dd4ad; color:#007f41; background:#eef9f3; box-shadow:inset 0 0 0 1px rgba(0,166,83,.04); }.temporary-band-choice button.is-selected small { color:#5f9275; }
.temporary-band-colors { display:flex; gap:10px; }.temporary-band-colors button { position:relative; width:34px; height:34px; border:4px solid #fff; border-radius:50%; background:var(--choice-color); box-shadow:0 0 0 1px #dce2de; }.temporary-band-colors button:nth-child(1){--choice-color:#00a653}.temporary-band-colors button:nth-child(2){--choice-color:#168f88}.temporary-band-colors button:nth-child(3){--choice-color:#6a69c7}.temporary-band-colors button:nth-child(4){--choice-color:#b17a25}.temporary-band-colors button.is-selected { box-shadow:0 0 0 2px #183d2c,0 5px 12px rgba(26,48,36,.13); }.temporary-band-colors button.is-selected::after { content:"✓"; position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-size:12px; font-weight:900; }
.temporary-band-policy { margin:17px 0 13px; padding:14px; border:1px solid #dce7e0; border-radius:17px; background:linear-gradient(145deg,#f8fcfa,#eef7f2); }.temporary-band-policy>div { display:grid; grid-template-columns:repeat(3,1fr); }.temporary-band-policy>div>span { display:flex; min-width:0; flex-direction:column; gap:4px; padding:2px 9px; }.temporary-band-policy>div>span:not(:last-child){border-right:1px solid #dfe8e2}.temporary-band-policy small { color:#8b9790; font-size:7px; }.temporary-band-policy strong { overflow:hidden; color:#164c31; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.temporary-band-policy p { margin:12px 2px 0; padding-top:10px; border-top:1px solid #dfe8e2; color:#7e8b83; font-size:8px; line-height:1.5; }.temporary-band-submit { margin-top:0; }.temporary-band-submit:disabled { color:#8c9790; background:#e5e9e6; box-shadow:none; }.temporary-band-validation { margin:9px 2px 0; color:#929b95; font-size:8px; line-height:1.5; text-align:center; }.temporary-band-validation.is-ready { color:#008b47; }
.band-renewal-sheet { max-height:88dvh; }.band-renewal-status { display:flex; flex-direction:column; gap:4px; margin:10px 0 18px; padding:15px 16px; border:1px solid #d9e8df; border-radius:17px; background:linear-gradient(145deg,#f2faf5,#fff); }.band-renewal-status span,.band-renewal-status small { color:#829087; font-size:8px; }.band-renewal-status strong { color:#173d2b; font-size:15px; }.band-renewal-sheet>.primary-button:disabled { color:#8c9790; background:#e5e9e6; box-shadow:none; }
@media(max-width:380px){.temporary-band-choice button{padding:9px 8px}.temporary-band-policy>div>span{padding:2px 6px}.temporary-band-sheet{padding-right:18px;padding-left:18px}.band-owner-tools{grid-template-columns:1fr 1fr}.band-owner-tools>div{grid-column:1/-1}}

/* v1.0 · temporary band governance */
.band-channel-header-actions>.band-requests-button { position:relative; color:#176d4a; background:#edf7f1; border-color:#d4e6db; }.band-requests-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }.band-requests-button b { position:absolute; top:-6px; right:-6px; display:grid; place-items:center; min-width:17px; height:17px; padding:0 4px; border:2px solid #fff; border-radius:999px; color:#fff; background:#ff4c56; font-size:7px; line-height:1; }.band-requests-button b[hidden]{display:none}
.band-requests-sheet { max-height:88dvh; }.band-requests-intro { margin:9px 0 17px; color:#76827a; font-size:10px; line-height:1.6; }.band-request-list { display:grid; gap:10px; }.band-request-card { display:grid; grid-template-columns:43px 1fr; gap:11px; padding:13px; border:1px solid #dde5e0; border-radius:18px; background:#fbfcfb; }.band-request-card>span { display:grid; place-items:center; width:43px; height:43px; border-radius:14px; color:#fff; background:#173f2d; font:800 8px/1 ui-monospace,monospace; }.band-request-card>div:nth-child(2) { display:flex; min-width:0; flex-direction:column; gap:3px; }.band-request-card strong { color:#27342c; font-size:11px; }.band-request-card small { color:#8b958f; font-size:8px; }.band-request-card p { margin:5px 0 0; color:#5f6b63; font-size:9px; line-height:1.5; }.band-request-card>div:last-child { grid-column:2; display:flex; gap:8px; justify-content:flex-end; }.band-request-card>div:last-child button { min-width:66px; height:34px; border:1px solid #dce3df; border-radius:11px; color:#657169; background:#fff; font-size:9px; font-weight:800; }.band-request-card>div:last-child button:last-child { color:#fff; background:#00a653; border-color:#00a653; }.band-request-empty { display:flex; min-height:185px; flex-direction:column; align-items:center; justify-content:center; padding:24px; border:1px dashed #d9e2dc; border-radius:19px; color:#8d9891; text-align:center; }.band-request-empty[hidden]{display:none}.band-request-empty>span { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:#008d48; background:#e8f6ee; font-size:18px; }.band-request-empty strong { margin:11px 0 5px; color:#354139; font-size:12px; }.band-request-empty small { max-width:260px; font-size:9px; line-height:1.55; }.band-request-simulate { width:100%; height:42px; margin-top:13px; border:1px solid #d9e3dc; border-radius:13px; color:#087644; background:#f0f8f3; font-size:10px; font-weight:800; }.band-request-boundary { margin:9px 2px 0; color:#9aa29d; font-size:8px; line-height:1.5; text-align:center; }
.band-eject-control { margin:0 0 12px; padding:13px; border:1px solid #f0d8d9; border-radius:16px; background:#fff8f8; }.band-eject-control[hidden]{display:none}.band-eject-control>div { display:flex; gap:10px; align-items:center; }.band-eject-control>div>span:first-child { display:grid; place-items:center; width:35px; height:35px; flex:0 0 35px; border-radius:12px; color:#b14f56; background:#f9e8e9; font-size:17px; }.band-eject-control>div>span:last-child { display:flex; min-width:0; flex-direction:column; gap:3px; }.band-eject-control strong { color:#5a3235; font-size:10px; }.band-eject-control small { color:#987b7d; font-size:8px; line-height:1.45; }.band-eject-control>button { width:100%; height:39px; margin-top:11px; border:1px solid #e7c6c9; border-radius:12px; color:#a94149; background:#fff; font-size:9px; font-weight:850; }.band-eject-control>button:disabled { color:#9b9696; background:#f0eeee; border-color:#e5e1e1; }
.band-ejected-state { display:flex; gap:8px; align-items:center; margin:-2px 0 10px; padding:8px 10px; border-radius:11px; background:#f4f1f1; }.band-ejected-state span { padding:3px 5px; border-radius:6px; color:#fff; background:#8b8f8c; font-size:7px; font-weight:850; }.band-ejected-state small { color:#7e8580; font-size:8px; line-height:1.4; }
@media(max-width:390px){.band-channel-header-actions{gap:5px}.band-channel-header-actions>button{width:36px;height:36px}.band-request-card>div:last-child{grid-column:1/-1}.band-request-card>div:last-child button{flex:1}}

/* Longwave foundation · paid near-field persistence without paid ranking */
.longwave-screen { padding-bottom:118px; background:#f4f6f4; }
.longwave-header { padding-bottom:16px; }
.longwave-hero { position:relative; min-height:238px; padding:24px 22px 18px; border-radius:24px; color:#f4fff8; background:#0d1913; overflow:hidden; box-shadow:0 16px 34px rgba(18,39,27,.13); }
.longwave-hero::after { content:""; position:absolute; right:-58px; bottom:-118px; width:230px; height:230px; border:1px solid rgba(80,226,145,.12); border-radius:50%; box-shadow:0 0 0 32px rgba(80,226,145,.025),0 0 0 66px rgba(80,226,145,.018); }
.longwave-hero__trace { position:absolute; z-index:0; top:14px; right:0; left:0; height:72px; opacity:.82; }
.longwave-hero__trace svg { width:100%; height:100%; overflow:visible; }
.longwave-hero__trace path:first-child { fill:none; stroke:#52df91; stroke-width:1.5; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 8px rgba(82,223,145,.28)); }
.longwave-hero__trace path:last-child { fill:none; stroke:rgba(180,233,204,.12); stroke-width:1; stroke-dasharray:3 7; }
.longwave-hero__copy { position:relative; z-index:1; padding-top:69px; }
.longwave-hero__copy>span { color:#55dd93; font:750 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.13em; }
.longwave-hero__copy h2 { max-width:310px; margin:8px 0 7px; font-size:23px; line-height:1.22; letter-spacing:-.04em; }
.longwave-hero__copy p { max-width:340px; margin:0; color:#94a99d; font-size:10px; line-height:1.62; }
.longwave-hero__facts { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:18px; border-top:1px solid rgba(217,255,234,.1); }
.longwave-hero__facts>span { display:flex; flex-direction:column; gap:2px; padding:13px 8px 0 0; }
.longwave-hero__facts strong { font:760 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace; }
.longwave-hero__facts small { color:#71877b; font-size:7px; }
.longwave-filters { display:flex; gap:7px; margin:18px -22px 20px; padding:0 22px 3px; overflow-x:auto; scrollbar-width:none; }
.longwave-filters::-webkit-scrollbar { display:none; }
.longwave-filters button { flex:0 0 auto; height:34px; padding:0 13px; border:1px solid #dce3de; border-radius:999px; color:#78817b; background:#fff; font-size:9px; font-weight:720; }
.longwave-filters button.is-selected { border-color:#173c2b; color:#fff; background:#173c2b; }
.longwave-feed>.contact-section-heading { margin-bottom:12px; }
.longwave-list { display:grid; gap:11px; }
.longwave-card { --longwave-color:#0b9a58; padding:17px 17px 14px; border:1px solid #e0e5e1; border-radius:17px; background:#fff; box-shadow:0 6px 20px rgba(28,39,32,.035); animation:card-in .45s both; animation-delay:var(--delay); }
.longwave-card--mine { border-color:color-mix(in srgb,var(--longwave-color) 32%,#e0e5e1); }
.longwave-card__meta { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; color:#89918c; font-size:8px; }
.longwave-card__meta>span:first-child { display:flex; min-width:0; align-items:center; gap:6px; }
.longwave-card__meta i { width:5px; height:5px; flex:0 0 5px; border-radius:50%; background:var(--longwave-color); }
.longwave-card__meta strong { overflow:hidden; color:#5d6760; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.longwave-card__meta em { padding-left:6px; border-left:1px solid #dfe3e0; font-style:normal; white-space:nowrap; }
.longwave-card__meta>span:last-child { flex:0 0 auto; white-space:nowrap; }
.longwave-card__heading { display:flex; gap:11px; align-items:center; margin:15px 0 9px; }
.longwave-card__heading>span { display:grid; place-items:center; width:38px; height:38px; flex:0 0 38px; border-radius:12px; color:var(--longwave-color); background:color-mix(in srgb,var(--longwave-color) 9%,#fff); font-size:17px; }
.longwave-card__heading>div { display:flex; min-width:0; flex-direction:column; gap:3px; }
.longwave-card__heading small { color:var(--longwave-color); font-size:7px; font-weight:800; }
.longwave-card__heading h3 { margin:0; color:#202a24; font-size:15px; line-height:1.35; letter-spacing:-.02em; }
.longwave-card>p { margin:0; color:#606a63; font-size:10px; line-height:1.65; }
.longwave-card__route { display:grid; grid-template-columns:1fr auto auto; gap:9px; align-items:center; margin:15px 0 12px; }
.longwave-card__route>span { height:2px; border-radius:99px; background:#e9edea; overflow:hidden; }
.longwave-card__route>span i { display:block; width:var(--life); height:100%; border-radius:inherit; background:var(--longwave-color); transition:width .3s linear; }
.longwave-card__route b { color:#344139; font:760 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace; }
.longwave-card__route small { color:#969e99; font-size:7px; }
.longwave-card footer { display:flex; gap:9px; align-items:center; padding-top:11px; border-top:1px solid #edf0ed; color:#929a95; font-size:7px; }
.longwave-card footer span:nth-child(2) { margin-left:auto; }
.longwave-card footer button { padding:4px 0 4px 7px; border:0; color:#8b948e; background:transparent; font-size:7px; }
.longwave-media { margin:2px 0 12px; border-radius:14px; overflow:hidden; }.longwave-media .media-swatch { width:100%; margin:0; border-radius:14px; }.longwave-media--detail { margin:2px 0 16px; }.longwave-media--detail .media-swatch { max-height:min(64vh,520px); }
.longwave-media-grid { display:grid; gap:3px; margin:2px 0 12px; border-radius:14px; overflow:hidden; background:#e5ebe7; }.longwave-media-grid--2 { grid-template-columns:1fr 1fr; }.longwave-media-grid--3,.longwave-media-grid--4 { grid-template-columns:1fr 1fr; }.longwave-media-grid button { min-height:110px; padding:0; border:0; background:#dce4df; overflow:hidden; }.longwave-media-grid--3 button:first-child { grid-row:span 2; }.longwave-media-grid img { width:100%; height:100%; min-height:110px; object-fit:cover; display:block; }.longwave-media-grid--detail button { min-height:150px; }.longwave-media-grid--detail img { min-height:150px; max-height:330px; }
.longwave-empty { display:flex; min-height:190px; flex-direction:column; align-items:center; justify-content:center; border:1px dashed #d5ddd8; border-radius:20px; color:#8e9891; text-align:center; }
.longwave-empty[hidden] { display:none; }
.longwave-empty>span { color:#15945a; font-size:26px; }
.longwave-empty strong { margin:8px 0 4px; color:#344139; font-size:12px; }
.longwave-empty small { max-width:250px; font-size:8px; line-height:1.5; }
.longwave-boundary { display:flex; gap:12px; align-items:flex-start; margin-top:18px; padding:15px 2px; border-top:1px solid #dfe4e0; }
.longwave-boundary span { flex:0 0 auto; padding:4px 7px; border-radius:7px; color:#557064; background:#e7ede9; font-size:7px; font-weight:800; }
.longwave-boundary p { margin:0; color:#8a938d; font-size:8px; line-height:1.55; }
.transmit-button.primary-action--longwave { background:#194332; box-shadow:0 0 0 6px #fff,0 8px 24px rgba(25,67,50,.23); }

.longwave-compose-sheet { max-height:94dvh; }
.longwave-compose-intro { margin:9px 0 17px; color:#77817b; font-size:9px; line-height:1.6; }
.longwave-compose-options { margin:0 0 15px; padding:0; border:0; }
.longwave-compose-options legend { margin-bottom:8px; color:#344038; font-size:9px; font-weight:800; }
.longwave-compose-categories { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.longwave-compose-categories button { display:flex; min-width:0; height:58px; flex-direction:column; gap:5px; align-items:center; justify-content:center; border:1px solid #e0e5e1; border-radius:13px; color:#69736c; background:#f8faf8; }
.longwave-compose-categories button span { font-size:15px; }.longwave-compose-categories button strong { font-size:8px; }
.longwave-compose-categories button.is-selected { border-color:#78c49a; color:#087a42; background:#edf8f2; }
.longwave-compose-field { display:grid; gap:7px; margin-bottom:14px; }
.longwave-compose-field>span { display:flex; justify-content:space-between; align-items:baseline; }
.longwave-compose-field strong { color:#344038; font-size:9px; }.longwave-compose-field small { color:#99a19c; font-size:7px; }
.longwave-compose-field input,.longwave-compose-field textarea { width:100%; border:1px solid #dfe5e1; border-radius:13px; outline:0; color:#29342d; background:#fafbfa; font:inherit; font-size:10px; line-height:1.55; }
.longwave-compose-field input { height:43px; padding:0 12px; }.longwave-compose-field textarea { min-height:86px; padding:11px 12px; resize:none; }
.longwave-compose-field :is(input,textarea):focus { border-color:#8bc9a5; background:#fff; }
.longwave-media-draft { margin:-2px 0 16px; padding:13px; border:1px solid #dfe5e1; border-radius:16px; background:#f8faf8; }
.longwave-media-draft--error { border-color:rgba(190,68,68,.28); background:rgba(190,68,68,.045); }
.longwave-media-draft__heading { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; margin-bottom:10px; }.longwave-media-draft__heading>span { display:flex; flex-direction:column; gap:3px; }.longwave-media-draft__heading strong { color:#344038; font-size:9px; }.longwave-media-draft__heading small { color:#939c96; font-size:7px; }.longwave-media-draft__heading button { padding:4px 0; border:0; color:#9a5656; background:transparent; font-size:7px; font-weight:750; }
.longwave-media-picker { display:grid; grid-template-columns:1fr 1fr; gap:7px; }.longwave-media-picker[hidden] { display:none; }.longwave-media-picker button { display:grid; grid-template-columns:30px 1fr; grid-template-rows:auto auto; gap:2px 8px; min-height:52px; align-items:center; padding:9px; border:1px solid #dce4df; border-radius:12px; color:#526159; background:#fff; text-align:left; }.longwave-media-picker button>span { display:grid; grid-row:1/3; width:30px; height:30px; place-items:center; border-radius:9px; color:#087c45; background:#eaf7f0; font-size:13px; }.longwave-media-picker strong { font-size:8px; }.longwave-media-picker small { color:#98a09b; font-size:6px; }
.longwave-media-preview { display:grid; grid-template-columns:64px 1fr auto; gap:10px; align-items:center; }.longwave-media-preview[hidden] { display:none; }.longwave-media-preview>div { display:grid; grid-template-columns:repeat(2,1fr); width:64px; height:52px; gap:2px; border-radius:10px; overflow:hidden; background:#e5ebe7; }.longwave-media-preview>div[data-type="video"] { display:block; }.longwave-media-preview :is(img,video) { width:100%; height:100%; object-fit:cover; }.longwave-media-preview>span { display:flex; min-width:0; flex-direction:column; gap:4px; }.longwave-media-preview>span strong { color:#354139; font-size:8px; }.longwave-media-preview>span small { color:#8f9992; font-size:6px; line-height:1.45; }.longwave-media-preview>button { display:grid; width:28px; height:28px; place-items:center; border:1px solid #d9e2dc; border-radius:9px; color:#087d45; background:#fff; font-size:14px; }
.longwave-media-processing-mark { display:flex; grid-column:1/-1; align-items:center; justify-content:center; gap:3px; }.longwave-media-processing-mark i { width:4px; height:18px; border-radius:99px; background:#20af68; animation:longwave-media-pulse .8s ease-in-out infinite alternate; }.longwave-media-processing-mark i:nth-child(2){height:29px;animation-delay:.15s}.longwave-media-processing-mark i:nth-child(3){height:12px;animation-delay:.3s}@keyframes longwave-media-pulse{to{transform:scaleY(.45);opacity:.45}}
.longwave-media-status { margin:10px 0 0; padding-top:9px; border-top:1px solid #e5eae7; color:#8f9992; font-size:6px; line-height:1.55; }
.longwave-media-error-mark { display:grid; width:100%; height:100%; place-items:center; color:#fff; background:linear-gradient(145deg,#c64a4a,#8e3030); font-size:18px; font-weight:900; }
.longwave-media-draft--error .longwave-media-status,.longwave-media-draft--error .longwave-media-preview>span small { color:#a24747; }
.longwave-compose-choice { display:grid; gap:7px; }.longwave-compose-choice--three { grid-template-columns:repeat(3,1fr); }.longwave-compose-choice--four { grid-template-columns:repeat(4,1fr); }
.longwave-compose-choice button { display:flex; min-width:0; min-height:52px; flex-direction:column; gap:3px; align-items:flex-start; justify-content:center; padding:9px 10px; border:1px solid #dfe5e1; border-radius:13px; color:#344038; background:#fafbfa; text-align:left; }
.longwave-compose-choice button strong { font-size:9px; }.longwave-compose-choice button small { color:#939c96; font-size:7px; }
.longwave-compose-choice button.is-selected { border-color:#69bd8e; color:#087b42; background:#eef8f2; }
.longwave-price { margin:2px 0 12px; border-top:1px solid #e4e8e5; border-bottom:1px solid #e4e8e5; }
.longwave-price>div { display:grid; grid-template-columns:repeat(3,1fr); }
.longwave-price>div>span { display:flex; flex-direction:column; gap:4px; padding:12px 9px; }
.longwave-price>div>span+span { border-left:1px solid #e4e8e5; }
.longwave-price small { color:#929a95; font-size:7px; }.longwave-price strong { color:#26322a; font-size:10px; }
.longwave-price p { margin:0; padding:9px 2px 11px; border-top:1px solid #eef0ee; color:#8b948e; font-size:7px; line-height:1.5; }
.longwave-country { display:flex; gap:10px; align-items:center; margin-bottom:12px; color:#57645c; }
.longwave-country>span:first-child { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border-radius:9px; background:#edf1ee; }
.longwave-country>span:last-child { display:flex; flex-direction:column; gap:2px; }.longwave-country strong { font-size:8px; }.longwave-country small { color:#909993; font-size:7px; }
.longwave-validation { margin:8px 0 0; color:#909993; font-size:7px; line-height:1.5; text-align:center; }
.longwave-submit:disabled { color:#909a94; background:#e4e9e6; }
@media(max-width:380px){.longwave-compose-categories{grid-template-columns:repeat(5,52px);overflow-x:auto}.longwave-compose-choice button{padding:8px 6px}.longwave-card__meta em{display:none}.longwave-card footer span:nth-child(2){display:none}}

/* Longwave v0.2: dedicated detail, short public echoes and private catch requests. */
.longwave-card { cursor:pointer; transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease; }
.longwave-card:hover { border-color:color-mix(in srgb,var(--longwave-color) 36%,#dce4df); box-shadow:0 10px 28px rgba(28,50,37,.07); transform:translateY(-1px); }
.longwave-card:focus-visible { outline:2px solid var(--longwave-color); outline-offset:3px; }
.longwave-card--processing { background:linear-gradient(135deg,#fff 0,#fff 72%,#f2f7f4 100%); }
.longwave-card--resolved { opacity:.72; }
.longwave-detail-screen { --longwave-color:#0b9a58; padding-bottom:174px; background:#f4f6f4; }
.longwave-detail-header { display:grid; grid-template-columns:40px 1fr auto; gap:11px; align-items:center; padding:20px 0 14px; }
.longwave-detail-header>button { height:38px; padding:0 11px; border:1px solid #dce3de; border-radius:13px; color:#46534b; background:#fff; font-size:9px; font-weight:760; }
.longwave-detail-header>button:first-child { width:38px; padding:0; font-size:18px; }
.longwave-detail-header>div { display:flex; min-width:0; flex-direction:column; gap:3px; }
.longwave-detail-header .eyebrow { font-size:7px; }.longwave-detail-header strong { color:#27322b; font-size:12px; }
.longwave-detail-hero { --longwave-color:#0b9a58; position:relative; padding:22px 20px 17px; border:1px solid color-mix(in srgb,var(--longwave-color) 24%,#dce3de); border-radius:23px; background:#fff; overflow:hidden; box-shadow:0 14px 36px rgba(29,50,38,.07); }
.longwave-detail-hero::before { content:""; position:absolute; top:-58px; right:-70px; width:190px; height:190px; border:1px solid color-mix(in srgb,var(--longwave-color) 18%,transparent); border-radius:50%; box-shadow:0 0 0 28px color-mix(in srgb,var(--longwave-color) 3%,transparent),0 0 0 56px color-mix(in srgb,var(--longwave-color) 2%,transparent); pointer-events:none; }
.longwave-detail-identity { position:relative; z-index:1; display:flex; justify-content:space-between; gap:10px; color:#8a938d; font-size:7px; }
.longwave-detail-identity>span:first-child { display:flex; min-width:0; gap:6px; align-items:center; }
.longwave-detail-identity i { width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:var(--longwave-color); box-shadow:0 0 0 4px color-mix(in srgb,var(--longwave-color) 9%,transparent); }
.longwave-detail-identity strong { overflow:hidden; color:#56635b; text-overflow:ellipsis; white-space:nowrap; }.longwave-detail-identity em { padding-left:6px; border-left:1px solid #dde3df; font-style:normal; white-space:nowrap; }
.longwave-detail-category { position:relative; z-index:1; display:flex; gap:13px; align-items:flex-start; margin:25px 0 14px; }
.longwave-detail-category>span { display:grid; width:46px; height:46px; flex:0 0 46px; place-items:center; border-radius:15px; color:var(--longwave-color); background:color-mix(in srgb,var(--longwave-color) 9%,#fff); font-size:21px; }
.longwave-detail-category>div { min-width:0; }.longwave-detail-category small { color:var(--longwave-color); font-size:7px; font-weight:850; letter-spacing:.04em; }
.longwave-detail-category h1 { margin:5px 0 0; color:#1f2b24; font-size:21px; line-height:1.3; letter-spacing:-.04em; }
.longwave-detail-hero>p { position:relative; z-index:1; margin:0; color:#59655d; font-size:11px; line-height:1.75; }
.longwave-detail-life { display:grid; grid-template-columns:1fr auto auto; gap:9px; align-items:center; margin:21px 0 15px; }
.longwave-detail-life>span { height:3px; border-radius:99px; background:#e8ede9; overflow:hidden; }.longwave-detail-life i { display:block; width:var(--life); height:100%; border-radius:inherit; background:var(--longwave-color); transition:width .3s linear; }
.longwave-detail-life strong { color:#2c3931; font:760 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace; }.longwave-detail-life small { color:#8f9892; font-size:7px; }
.longwave-detail-scope { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #edf0ee; }
.longwave-detail-scope>span { display:flex; flex-direction:column; gap:4px; padding:13px 8px 1px 0; }.longwave-detail-scope>span+span { padding-left:11px; border-left:1px solid #edf0ee; }
.longwave-detail-scope small { color:#98a09b; font-size:7px; }.longwave-detail-scope strong { color:#354139; font-size:9px; }
.longwave-progress,.longwave-echoes,.longwave-owner-console { margin-top:14px; padding:18px; border:1px solid #e0e5e1; border-radius:20px; background:#fff; }
.longwave-section-heading { display:flex; justify-content:space-between; gap:12px; align-items:flex-end; margin-bottom:13px; }
.longwave-section-heading>div { display:flex; flex-direction:column; gap:4px; }.longwave-section-heading .eyebrow { font-size:7px; }.longwave-section-heading h2 { margin:0; color:#26322a; font-size:15px; letter-spacing:-.03em; }
.longwave-section-heading>button { padding:6px 9px; border:0; border-radius:9px; color:#087e45; background:#edf8f2; font-size:7px; font-weight:800; }.longwave-section-heading>span { color:#718078; font-size:7px; }
.longwave-progress-list { display:grid; gap:0; }.longwave-progress-list article { display:grid; grid-template-columns:25px 1fr; gap:9px; padding:10px 0; border-top:1px solid #edf0ee; }
.longwave-progress-list article>span { padding-top:2px; color:var(--longwave-color); font:760 7px/1 ui-monospace,SFMono-Regular,Consolas,monospace; }.longwave-progress-list p { margin:0 0 5px; color:#49564e; font-size:9px; line-height:1.58; }.longwave-progress-list small { color:#9aa19d; font-size:7px; }
.longwave-progress-empty,.longwave-echo-empty,.longwave-request-empty { display:flex; min-height:80px; flex-direction:column; align-items:center; justify-content:center; color:#9aa29d; text-align:center; }
.longwave-progress-empty[hidden],.longwave-echo-empty[hidden],.longwave-request-empty[hidden] { display:none; }.longwave-progress-empty span,.longwave-echo-empty>span { color:#5bbd87; font-size:19px; }.longwave-progress-empty p { max-width:260px; margin:6px 0 0; font-size:8px; line-height:1.55; }
.longwave-echo-list { display:grid; gap:8px; }.longwave-echo-card { display:grid; grid-template-columns:32px 1fr auto; gap:9px; align-items:start; padding:11px 0; border-top:1px solid #edf0ee; }
.longwave-echo-card>span { display:grid; width:32px; height:32px; place-items:center; border-radius:11px; color:#14784a; background:#edf7f1; font-size:9px; font-weight:800; }.longwave-echo-card>div>div { display:flex; gap:8px; align-items:baseline; }.longwave-echo-card strong { color:#344038; font-size:8px; }.longwave-echo-card small { color:#9aa19d; font-size:6px; }.longwave-echo-card small b { color:#758078; font:inherit; }.longwave-echo-card p { margin:5px 0 0; color:#56625a; font-size:9px; line-height:1.55; }.longwave-echo-card>button { border:0; color:#98a19b; background:transparent; font-size:9px; }
.longwave-echo-composer { margin-top:11px; padding:11px; border:1px solid #dce4df; border-radius:14px; background:#f8faf8; }.longwave-echo-composer[hidden] { display:none; }.longwave-echo-composer textarea { width:100%; min-height:50px; padding:0; border:0; outline:0; color:#2d3931; background:transparent; font:inherit; font-size:9px; line-height:1.55; resize:none; }.longwave-echo-composer>div { display:flex; justify-content:space-between; gap:10px; align-items:center; }.longwave-echo-composer small { color:#99a19c; font-size:6px; }.longwave-echo-composer button { height:31px; padding:0 12px; border:0; border-radius:10px; color:#fff; background:#163e2c; font-size:8px; font-weight:800; }
.longwave-owner-console { border-color:#bddbca; background:#eef8f2; }.longwave-owner-console[hidden] { display:none; }.longwave-owner-console>div:first-child h2 { margin:5px 0 4px; color:#173d2b; font-size:15px; }.longwave-owner-console>div:first-child p { margin:0; color:#6a7e72; font-size:8px; }
.longwave-owner-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0 8px; }.longwave-owner-actions button { min-height:38px; border:1px solid #c8dfd2; border-radius:11px; color:#2b513e; background:#fff; font-size:8px; font-weight:800; }.longwave-owner-actions button:first-child { display:flex; justify-content:center; gap:7px; align-items:center; }.longwave-owner-actions b { display:grid; min-width:17px; height:17px; place-items:center; border-radius:99px; color:#fff; background:#0b9a58; font-size:7px; }
.longwave-status-actions { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; }.longwave-status-actions button { min-height:34px; padding:5px; border:1px solid #d7e5dd; border-radius:9px; color:#728078; background:#f9fbfa; font-size:7px; font-weight:750; }.longwave-status-actions button.is-selected { border-color:#1b6945; color:#fff; background:#1b6945; }.longwave-status-actions button.danger { color:#a94f4f; }
.longwave-response-boundary { display:flex; gap:10px; margin-top:14px; padding:14px 3px; border-top:1px solid #dfe5e1; }.longwave-response-boundary span { height:max-content; padding:4px 7px; border-radius:7px; color:#557064; background:#e6ece8; font-size:7px; font-weight:800; }.longwave-response-boundary p { margin:0; color:#89938d; font-size:8px; line-height:1.55; }
.longwave-detail-actions { position:fixed; z-index:18; right:max(14px,calc((100vw - 452px)/2)); bottom:calc(86px + env(safe-area-inset-bottom)); left:max(14px,calc((100vw - 452px)/2)); display:grid; grid-template-columns:1fr 1.35fr; gap:8px; padding:9px; border:1px solid rgba(215,225,219,.9); border-radius:18px; background:rgba(255,255,255,.92); box-shadow:0 12px 34px rgba(31,49,38,.16); backdrop-filter:blur(18px); }.longwave-detail-actions button { min-height:44px; border:1px solid #dce4df; border-radius:13px; color:#536158; background:#f5f8f6; font-size:9px; font-weight:820; }.longwave-detail-actions button.primary { border-color:#143f2b; color:#fff; background:#143f2b; }.longwave-detail-actions button:disabled { border-color:#e1e5e2; color:#9aa19d; background:#edf0ee; }.longwave-detail-actions--owner { grid-template-columns:1fr 1.35fr; }
.longwave-update-sheet>p,.longwave-requests-intro { margin:8px 0 16px; color:#7d8781; font-size:9px; line-height:1.6; }.longwave-update-field { display:grid; gap:7px; margin-bottom:14px; }.longwave-update-field>span { color:#334038; font-size:9px; font-weight:800; }.longwave-update-field textarea { min-height:102px; padding:12px; border:1px solid #dce4df; border-radius:14px; outline:0; color:#2f3b33; background:#f8faf8; font:inherit; font-size:10px; line-height:1.6; resize:none; }.longwave-update-field small { color:#98a09b; font-size:7px; text-align:right; }
.longwave-request-list { display:grid; gap:8px; }.longwave-request-card { display:grid; grid-template-columns:38px 1fr; gap:10px; padding:13px; border:1px solid #e0e5e1; border-radius:15px; background:#f8faf8; }.longwave-request-card>span { display:grid; width:38px; height:38px; place-items:center; border-radius:12px; color:#0c8047; background:#e7f5ed; font-size:10px; font-weight:850; }.longwave-request-card>div:nth-child(2) { min-width:0; }.longwave-request-card strong { color:#303d35; font-size:9px; }.longwave-request-card small { display:block; margin-top:3px; color:#919b95; font-size:7px; }.longwave-request-card p { margin:7px 0 0; color:#647168; font-size:8px; }.longwave-request-card>div:last-child { grid-column:1/-1; display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:6px; }.longwave-request-card>div:last-child button { min-height:32px; border:1px solid #d9e2dc; border-radius:9px; color:#657168; background:#fff; font-size:7px; font-weight:800; }.longwave-request-card>div:last-child button:first-child { border-color:#17643f; color:#fff; background:#17643f; }.longwave-request-card>div:last-child button.danger { color:#a44e4e; }.longwave-request-empty strong { margin:5px 0 3px; color:#3b4840; font-size:10px; }.longwave-request-empty small { font-size:7px; }.longwave-request-simulate { width:100%; min-height:38px; margin-top:10px; border:1px dashed #b9c8bf; border-radius:11px; color:#64736a; background:transparent; font-size:8px; font-weight:760; }.longwave-request-boundary { margin:10px 0 0; color:#9aa29d; font-size:7px; line-height:1.5; text-align:center; }
@media(max-width:380px){.longwave-detail-identity em{display:none}.longwave-detail-category h1{font-size:19px}.longwave-detail-scope>span{padding-left:6px}.longwave-status-actions{grid-template-columns:1fr 1fr}.longwave-detail-actions{right:10px;left:10px}.longwave-echo-card>div>div{display:block}.longwave-echo-card small{display:block;margin-top:2px}}

/* v1.1 · adaptive light/dark appearance */
.theme-settings { display:grid; gap:10px; padding:13px 0; border-bottom:1px solid #e6e9e5; }
.theme-settings>span { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.theme-settings>span strong { color:#253029; font-size:10px; }
.theme-settings>span small { color:#16864a; font-size:7px; }
.theme-choice { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.theme-choice>button { display:grid; grid-template-columns:32px 1fr; gap:9px; align-items:center; min-height:54px; padding:9px 11px; border:1px solid #dfe5e1; border-radius:14px; color:#4d5952; background:#f8faf8; text-align:left; cursor:pointer; transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.theme-choice>button:active { transform:scale(.985); }
.theme-choice>button>i { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; color:#657169; background:#edf1ee; font-size:15px; font-style:normal; }
.theme-choice>button>span { display:flex; min-width:0; flex-direction:column; gap:2px; }
.theme-choice>button strong { color:#2a352e; font-size:9px; }
.theme-choice>button small { color:#929a95; font-size:7px; }
.theme-choice>button[aria-pressed="true"] { border-color:#8ed1aa; background:#eef9f3; box-shadow:inset 0 0 0 1px rgba(0,166,74,.05); }
.theme-choice>button[aria-pressed="true"]>i { color:#fff; background:#00a64a; }
.theme-system-toggle { display:flex; align-items:center; justify-content:space-between; width:100%; padding:9px 2px 1px; border:0; color:#2e3932; background:transparent; text-align:left; cursor:pointer; }
.theme-system-toggle>span { display:flex; flex-direction:column; gap:2px; }
.theme-system-toggle strong { font-size:9px; }.theme-system-toggle small { color:#929a95; font-size:7px; }
.theme-system-toggle>i { position:relative; width:34px; height:20px; border-radius:999px; background:#00a64a; transition:background .2s ease; }
.theme-system-toggle>i b { position:absolute; top:3px; left:17px; width:14px; height:14px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(19,30,23,.2); transition:left .2s ease; }
.theme-system-toggle[aria-checked="false"]>i { background:#c7cdc9; }.theme-system-toggle[aria-checked="false"]>i b { left:3px; }

html[data-theme="dark"] {
  color-scheme:dark;
  --bg:#080c09;
  --surface:#101713;
  --surface-2:#172019;
  --surface-raised:#141d17;
  --surface-soft:#19241d;
  --line:#2d3a32;
  --line-strong:#3b4b41;
  --text:#f0f6f2;
  --text-secondary:#b8c4bc;
  --text-tertiary:#94a39a;
  --text-disabled:#75837b;
  --icon:#cad6ce;
  --icon-muted:#99a89f;
  --muted:#a6b3ab;
  --green:#4ade91;
  --green-2:#19bd68;
  --cyan:#55c7e7;
  --amber:#efbd57;
  --danger:#ff7d87;
  --shadow:0 24px 70px rgba(0,0,0,.42);
  background:#050805;
}
html[data-theme="dark"] body { color:var(--text); background:#050805; }
html[data-theme="dark"] .app-shell { background:#090e0b; box-shadow:0 24px 90px rgba(0,0,0,.52); }
html[data-theme="dark"] :is(.bands-screen,.profile-screen,.contacts-screen,.band-channel-screen,.longwave-screen) { background:#090e0b; }
html[data-theme="dark"] :is(.topbar,.radar-hero) { border-color:#202a24; background:rgba(12,18,14,.95); box-shadow:none; }
html[data-theme="dark"] .topbar { backdrop-filter:blur(20px) saturate(120%); }
html[data-theme="dark"] .bottom-nav { border-top-color:#222c26; background:rgba(10,15,12,.96); box-shadow:0 -12px 32px rgba(0,0,0,.28); }
html[data-theme="dark"] .nav-item { color:#6f7c75; }
html[data-theme="dark"] .nav-item--active,html[data-theme="dark"] .nav-item--active span { color:#e8f2ec; }
html[data-theme="dark"] .transmit-button { box-shadow:0 0 0 7px #0a0f0c,0 0 0 8px rgba(66,217,137,.19),0 8px 30px rgba(0,0,0,.42); }
html[data-theme="dark"] .bottom-sheet { border-color:#26312b; background:#101713; box-shadow:0 -22px 70px rgba(0,0,0,.45); }
html[data-theme="dark"] .sheet-handle { background:#39443e; }
html[data-theme="dark"] .sheet-backdrop { background:rgba(0,0,0,.67); }
html[data-theme="dark"] :is(.brand strong,.radar-copy h1,.simple-header h1,.section-heading h2,.bottom-sheet h2,.contact-section-heading h2,.profile-identity h2,.profile-section-heading strong,.band-card__body strong,.favorite-band-card strong) { color:var(--text); }
html[data-theme="dark"] :is(.brand small,.radar-copy p,.text-button,.gesture-hint,.wave-meta,.expiry,.profile-identity p,.profile-boundary-note,.bands-intro p) { color:var(--muted); }

html[data-theme="dark"] :is(
  .wave-card,.range-card,.send-range,.principles>div,.echo-parent,.echo-item>div,.echo-composer,
  .send-policy__stats>span,.relay-status__signal,.secondary-button,.identity-levels>div,.onboarding-rules span,
  .relay-device,.relay-toggle,.relay-stats span,.active-channel-card,.contact-card,.contact-methods>button,
  .pairing-qr-wrap,.pairing-actions button,.pairing-regenerate,.pairing-submit-row>button:first-child,
  .frequency-code-own>button,.channel-lifetime__pulse,.channel-transport,.channel-message>div,.channel-composer,
  .private-block-card,.private-block-card button,.add-attachment-button,.attachment-menu,.attachment-menu>button,
  .profile-settings-button,.energy-package-grid button,.energy-recharge-notice,.profile-stats button,.profile-quota,
  .profile-menu,.profile-menu>button,.public-profile-actions>button,.listened-frequency-list article,
  .favorite-bands,.band-card,.band-search>label,.band-search-results,.band-channel-header>button,
  .band-channel-header-actions>button,.band-owner-tools,.band-owner-tools>button,.band-request-card,
  .band-request-card>div:last-child button,.temporary-band-choice button
) { border-color:#27332c; background:#121a15; box-shadow:none; }
html[data-theme="dark"] :is(.profile-quota-grid>div,.public-profile-bio,.public-profile-boundary,.listened-frequency-list article>button:last-child,.attachment-preview,.type-button,.channel-transport--fallback,.band-ejected-state) { background:#151e19; }
html[data-theme="dark"] :is(.wave-card,.active-channel-card,.contact-card,.favorite-bands,.band-card,.band-search-results,.my-bands) { box-shadow:0 12px 28px rgba(0,0,0,.16); }
html[data-theme="dark"] .my-bands { border-color:#26352d; background:linear-gradient(145deg,#101713,#0d1711); }
html[data-theme="dark"] .my-band-empty { border-color:#33443a; color:#819087; background:rgba(255,255,255,.015); }
html[data-theme="dark"] .my-band-empty:hover { border-color:#4d8c68; background:rgba(66,217,137,.045); }
html[data-theme="dark"] .my-band-empty>span { color:#49dc90; background:#173024; }
html[data-theme="dark"] .favorite-band-card>button:first-child { color:var(--text); background:color-mix(in srgb,var(--band-color) 10%,#121a15); }
html[data-theme="dark"] .band-card__signal { background:color-mix(in srgb,var(--band-color) 13%,#121a15); }
html[data-theme="dark"] :is(.band-card>button,.band-card__enter-button) { background:color-mix(in srgb,var(--band-color) 14%,#121a15); }
html[data-theme="dark"] .band-card__latest { border-top-color:#27332c; }
html[data-theme="dark"] .band-boundaries,html[data-theme="dark"] .band-boundaries>div+div { border-color:#27332c; }
html[data-theme="dark"] .band-permission-card { border-color:#284536; background:#11271c; }
html[data-theme="dark"] .band-permission-card strong { color:#cce9d8; }
html[data-theme="dark"] .band-owner-tools strong { color:#bce8ce; }

html[data-theme="dark"] :is(
  .wave-content,.echo-parent p,.echo-item p,.channel-message p,.profile-stats button,.profile-menu>button,
  .public-profile-hero h3,.public-profile-bio,.public-profile-live strong,.listened-frequency-list strong,
  .energy-package-fieldset legend,.energy-package-grid button,.energy-recharge-summary strong,
  .energy-recharge-history>div:first-child strong,.identity-nickname strong,.language-settings strong,
  .contact-remark-profile strong,.contact-remark-field>span,.temporary-band-field>span strong,
  .temporary-band-options legend,.temporary-band-choice button,.band-request-card strong,
  .band-request-empty strong,.my-band-empty strong,.channel-call-control strong,.channel-call-permission strong
) { color:var(--text); }
html[data-theme="dark"] :is(
  .band-card__body p,.band-boundaries small,.favorite-band-card small,.band-search>small,.band-request-card small,
  .temporary-band-field>span small,.temporary-band-options>p,.temporary-band-choice button small,
  .channel-message small,.channel-rule,.contact-card__identity small,.frequency-manifesto p,
  .public-profile-hero p,.public-profile-boundary p,.energy-recharge-notice small
) { color:#87958d; }

html[data-theme="dark"] :is(
  .compose-field textarea,.identity-nickname input,.contact-remark-field input,.language-settings select,
  .pairing-code-input input,.temporary-band-field input,.temporary-band-field textarea,.band-search input
) { border-color:#2a372f; color:var(--text); background:#0d1410; }
html[data-theme="dark"] :is(.compose-field textarea,.identity-nickname input,.contact-remark-field input,.temporary-band-field input,.temporary-band-field textarea)::placeholder { color:#647169; }
html[data-theme="dark"] :is(.compose-field textarea,.identity-nickname input,.contact-remark-field input,.language-settings select,.temporary-band-field input,.temporary-band-field textarea):focus { border-color:#3c8c61; background:#101a14; }
html[data-theme="dark"] .type-button--active { border-color:#367b57; background:rgba(66,217,137,.08); }
html[data-theme="dark"] .attachment-menu { border-color:#26332b; background:#0e1511; box-shadow:0 14px 32px rgba(0,0,0,.25); }
html[data-theme="dark"] .attachment-menu>button>span { background:#1c2721; }
html[data-theme="dark"] .wave-actions { border-top-color:#27312b; }
html[data-theme="dark"] .expiry-track { background:#253029; }
html[data-theme="dark"] .oscilloscope-head,html[data-theme="dark"] .oscilloscope-head strong,html[data-theme="dark"] .oscilloscope-foot,html[data-theme="dark"] .oscilloscope-foot span:last-child { color:#74847a; }
html[data-theme="dark"] .oscilloscope-centerline { stroke:rgba(66,217,137,.14); }
html[data-theme="dark"] .oscilloscope-trace { stroke:#42d989; }
html[data-theme="dark"] .oscilloscope-trace--ghost { stroke:#42d989; }

html[data-theme="dark"] .theme-settings { border-bottom-color:#28332c; }
html[data-theme="dark"] .theme-settings>span strong { color:var(--text); }
html[data-theme="dark"] .theme-choice>button { border-color:#2a372f; color:#9ba9a0; background:#0d1410; }
html[data-theme="dark"] .theme-choice>button>i { color:#9aa79f; background:#1a241e; }
html[data-theme="dark"] .theme-choice>button strong,html[data-theme="dark"] .theme-system-toggle { color:var(--text); }
html[data-theme="dark"] .theme-choice>button[aria-pressed="true"] { border-color:#3b8c60; background:#11271b; }
html[data-theme="dark"] .theme-choice>button[aria-pressed="true"]>i { color:#07100b; background:#42d989; }
html[data-theme="dark"] .theme-system-toggle[aria-checked="false"]>i { background:#3b4640; }
html[data-theme="dark"] .theme-system-toggle>i b { background:#eaf3ed; }
html[data-theme="dark"] .identity-nickname,html[data-theme="dark"] .language-settings,html[data-theme="dark"] .contact-remark-profile { border-color:#28332c; }
html[data-theme="dark"] .identity-boundaries span { border-color:#29352e; color:#93a097; background:#151d18; }
html[data-theme="dark"] .identity-protection { border-color:#285039; background:linear-gradient(145deg,#10251a,#101c16); }
html[data-theme="dark"] .device-integrity { border-color:#294033; background:#111d16; }
html[data-theme="dark"] .identity-trust-button { border-color:#315f47; background:linear-gradient(135deg,#122a1d,#10221a); box-shadow:0 12px 30px rgba(0,0,0,.2); }
html[data-theme="dark"] .identity-trust-button strong { color:#e2f3e9; }
html[data-theme="dark"] .identity-trust-button small { color:#91a99c; }
html[data-theme="dark"] .identity-trust-button>i { color:#06110a; background:#42d989; }
html[data-theme="dark"] .identity-trust-button--done { border-color:#294638; background:#111e17; }
html[data-theme="dark"] .identity-trust-button--done>b,html[data-theme="dark"] .identity-trust-button--done>i { color:#63d99a; background:rgba(66,217,137,.08); }
html[data-theme="dark"] .nav-unread-badge,html[data-theme="dark"] .band-card__enter-button>b,html[data-theme="dark"] .band-requests-button b { border-color:#101713; }
html[data-theme="dark"] .longwave-hero { border:1px solid #27352d; background:#0d1711; box-shadow:none; }
html[data-theme="dark"] .longwave-filters button { border-color:#29362f; color:#839087; background:#111914; }
html[data-theme="dark"] .longwave-filters button.is-selected { border-color:#42d989; color:#07100b; background:#42d989; }
html[data-theme="dark"] .longwave-card { border-color:#27332c; background:#121a15; box-shadow:none; }
html[data-theme="dark"] .longwave-card--mine { border-color:#35644b; }
html[data-theme="dark"] .longwave-card__meta strong,html[data-theme="dark"] .longwave-card>p { color:#929f97; }
html[data-theme="dark"] .longwave-card__meta em { border-left-color:#2d3932; }
html[data-theme="dark"] .longwave-card__heading>span { background:color-mix(in srgb,var(--longwave-color) 13%,#121a15); }
html[data-theme="dark"] .longwave-card__heading h3,html[data-theme="dark"] .longwave-card__route b,html[data-theme="dark"] .longwave-empty strong { color:var(--text); }
html[data-theme="dark"] .longwave-card__route>span { background:#29342e; }
html[data-theme="dark"] .longwave-card footer { border-top-color:#27322c; }
html[data-theme="dark"] .longwave-empty { border-color:#304038; background:rgba(255,255,255,.012); }
html[data-theme="dark"] .longwave-boundary { border-top-color:#28342d; }
html[data-theme="dark"] .transmit-button.primary-action--longwave { background:#42d989; color:#07100b; }
html[data-theme="dark"] :is(.longwave-compose-categories button,.longwave-compose-choice button) { border-color:#29362f; color:#a7b2ab; background:#121a15; }
html[data-theme="dark"] :is(.longwave-compose-categories button,.longwave-compose-choice button).is-selected { border-color:#3d8d61; color:#58de98; background:#11271b; }
html[data-theme="dark"] :is(.longwave-compose-field input,.longwave-compose-field textarea) { border-color:#2a372f; color:var(--text); background:#0d1410; }
html[data-theme="dark"] :is(.longwave-compose-field strong,.longwave-compose-options legend,.longwave-price strong,.longwave-country strong) { color:var(--text); }
html[data-theme="dark"] .longwave-price { border-color:#29342e; }
html[data-theme="dark"] .longwave-price>div>span+span,html[data-theme="dark"] .longwave-price p { border-color:#29342e; }
html[data-theme="dark"] .longwave-country>span:first-child { background:#19241e; }
html[data-theme="dark"] .longwave-media-draft { border-color:#29362f; background:#111914; }
html[data-theme="dark"] .longwave-media-draft__heading strong,html[data-theme="dark"] .longwave-media-preview>span strong { color:var(--text); }
html[data-theme="dark"] .longwave-media-picker button { border-color:#2b3931; color:#a0aca4; background:#172019; }
html[data-theme="dark"] .longwave-media-picker button>span { color:#55de95; background:#15271d; }
html[data-theme="dark"] .longwave-media-preview>div { background:#26332b; }
html[data-theme="dark"] .longwave-media-preview>button { border-color:#2d3a32; color:#55de95; background:#172019; }
html[data-theme="dark"] .longwave-media-status { border-top-color:#29352e; }
html[data-theme="dark"] .longwave-media-grid { background:#243129; }
html[data-theme="dark"] .longwave-detail-screen { background:#090e0b; }
html[data-theme="dark"] .longwave-detail-header>button { border-color:#29362f; color:#a3afa7; background:#121a15; }
html[data-theme="dark"] .longwave-detail-header strong,html[data-theme="dark"] .longwave-section-heading h2 { color:var(--text); }
html[data-theme="dark"] .longwave-detail-hero,html[data-theme="dark"] :is(.longwave-progress,.longwave-echoes) { border-color:#27352d; background:#121a15; box-shadow:none; }
html[data-theme="dark"] .longwave-detail-identity strong,html[data-theme="dark"] .longwave-detail-hero>p,html[data-theme="dark"] .longwave-progress-list p,html[data-theme="dark"] .longwave-echo-card p { color:#9aa69e; }
html[data-theme="dark"] .longwave-detail-identity em { border-left-color:#2b3730; }
html[data-theme="dark"] .longwave-detail-category>span { background:color-mix(in srgb,var(--longwave-color) 13%,#121a15); }
html[data-theme="dark"] .longwave-detail-category h1,html[data-theme="dark"] .longwave-detail-life strong,html[data-theme="dark"] .longwave-detail-scope strong,html[data-theme="dark"] .longwave-echo-card strong { color:var(--text); }
html[data-theme="dark"] :is(.longwave-detail-scope,.longwave-detail-scope>span+span,.longwave-progress-list article,.longwave-echo-card) { border-color:#27332c; }
html[data-theme="dark"] .longwave-detail-life>span { background:#29352e; }
html[data-theme="dark"] .longwave-echo-card>span { color:#52db91; background:#15271d; }
html[data-theme="dark"] .longwave-echo-composer { border-color:#2b3931; background:#0d1410; }
html[data-theme="dark"] .longwave-echo-composer textarea { color:var(--text); }
html[data-theme="dark"] .longwave-owner-console { border-color:#2c5c42; background:#102419; }
html[data-theme="dark"] .longwave-owner-console>div:first-child h2 { color:#62dc9b; }
html[data-theme="dark"] .longwave-owner-actions button { border-color:#31563f; color:#a2b0a7; background:#121b15; }
html[data-theme="dark"] .longwave-status-actions button { border-color:#2b3931; color:#87948c; background:#111914; }
html[data-theme="dark"] .longwave-status-actions button.is-selected { border-color:#4bd98d; color:#07110b; background:#4bd98d; }
html[data-theme="dark"] .longwave-response-boundary { border-top-color:#27342c; }
html[data-theme="dark"] .longwave-detail-actions { border-color:#28352d; background:rgba(14,21,17,.93); box-shadow:0 12px 34px rgba(0,0,0,.34); }
html[data-theme="dark"] .longwave-detail-actions button { border-color:#2b3831; color:#a1ada5; background:#151e18; }
html[data-theme="dark"] .longwave-detail-actions button.primary { border-color:#4bd98d; color:#07110b; background:#4bd98d; }
html[data-theme="dark"] .longwave-update-field textarea,html[data-theme="dark"] .longwave-request-card { border-color:#29362f; color:var(--text); background:#111914; }
html[data-theme="dark"] .longwave-request-card strong,html[data-theme="dark"] .longwave-request-empty strong { color:var(--text); }
html[data-theme="dark"] .longwave-request-card>span { color:#55de95; background:#15271d; }
html[data-theme="dark"] .longwave-request-card>div:last-child button { border-color:#2b3931; color:#919e96; background:#172019; }
html[data-theme="dark"] .longwave-request-card>div:last-child button:first-child { border-color:#49d88a; color:#07110b; background:#49d88a; }

/* Dark theme contrast pass: keep hierarchy without washing text and icons out. */
html[data-theme="dark"] body {
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
html[data-theme="dark"] :is(h1,h2,h3,legend) { color:var(--text); }
html[data-theme="dark"] :is(button,input,textarea,select) { color:inherit; }
html[data-theme="dark"] :is(button,select) svg { color:inherit; }
html[data-theme="dark"] svg:not(.oscilloscope-svg):not(.longwave-hero__trace svg) {
  opacity:1;
}
html[data-theme="dark"] :is(
  .icon-button,.profile-settings-button,.nav-item,.band-requests-button,.band-notification-button,
  .band-search label,.attachment-menu>button,.primary-button,.longwave-detail-header>button,
  .longwave-detail-actions button
) svg {
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
}
html[data-theme="dark"] :is(.icon-button,.profile-settings-button) {
  border-color:var(--line);
  color:var(--icon);
  background:var(--surface-raised);
}
html[data-theme="dark"] :is(.icon-button,.profile-settings-button):hover {
  border-color:var(--line-strong);
  color:#fff;
  background:#1b261f;
}
html[data-theme="dark"] :is(.text-button,.gesture-hint,.profile-boundary-note,.bands-intro p) {
  color:var(--text-secondary);
}
html[data-theme="dark"] :is(.brand small,.radar-copy p,.profile-identity p,.profile-boundary-note,.frequency-manifesto p) {
  color:var(--text-secondary);
}
html[data-theme="dark"] :is(.wave-meta,.wave-source em,.wave-distance,.expiry,.range-marks,.energy-balance) {
  color:var(--text-tertiary);
}
html[data-theme="dark"] .wave-source em,
html[data-theme="dark"] .echo-parent__meta b { border-color:var(--line-strong); }
html[data-theme="dark"] .wave-content { color:#edf4ef; }
html[data-theme="dark"] .wave-actions { border-color:var(--line); }
html[data-theme="dark"] .wave-action { color:#abb8b0; }
html[data-theme="dark"] .wave-action span { color:var(--icon); opacity:1; }
html[data-theme="dark"] .wave-action b { color:#94a39a; }
html[data-theme="dark"] .wave-action--recommended,
html[data-theme="dark"] .wave-action--recommended span,
html[data-theme="dark"] .wave-action--recommended b { color:#59df99; }
html[data-theme="dark"] .expiry-track { background:#2d3932; }

html[data-theme="dark"] .nav-item {
  color:#9aa89f;
  opacity:1;
}
html[data-theme="dark"] .nav-item svg { stroke-width:1.8; }
html[data-theme="dark"] .nav-item span { color:inherit; }
html[data-theme="dark"] .nav-item--active,
html[data-theme="dark"] .nav-item--active span { color:#f4f8f5; }
html[data-theme="dark"] .nav-item[data-nav="radar"] svg circle { fill:currentColor; stroke:none; }
html[data-theme="dark"] .bottom-nav :is(button,[role="button"]):focus-visible {
  outline:2px solid var(--green);
  outline-offset:3px;
}

html[data-theme="dark"] :is(
  .range-card strong,.send-range strong,.relay-status strong,.send-policy>strong,.country-boundary strong,
  .public-receive-toggle strong,.frequency-request-panel strong,.frequency-request-card strong,
  .echo-parent strong,.echo-item strong,.channel-lifetime strong,.channel-transport strong,
  .channel-call-control strong,.channel-call-permission strong,.voice-call-identity strong,
  .voice-call-clocks strong,.private-block-profile strong,.private-block-effects strong,
  .private-block-card strong,.voice-recorder__copy strong,.media-processing-note strong,
  .contact-methods strong,.contact-consent-preview strong,.pairing-section-heading strong,
  .band-create-preview strong,.band-boundaries strong,.profile-menu strong,.profile-quota-grid strong,
  .energy-recharge-notice strong,.energy-recharge-history strong,.public-profile-live strong,
  .listened-frequency-empty strong,.identity-nickname strong,.language-settings strong,
  .identity-protection strong,.device-integrity__header strong,.identity-levels strong
) { color:var(--text); }
html[data-theme="dark"] :is(
  .range-card small,.send-range small,.relay-status small,.relay-status em,.send-policy>p,
  .send-policy__stats small,.country-boundary small,.public-receive-toggle small,
  .frequency-request-panel small,.frequency-request-card small,.echo-parent small,.echo-item small,
  .channel-lifetime small,.channel-lifetime em,.channel-transport small,.channel-message small,
  .channel-rule,.channel-call-control small,.channel-call-permission small,.voice-call-identity small,
  .voice-call-panel p,.voice-call-clocks small,.voice-call-privacy,.private-block-profile small,
  .private-block-copy,.private-block-effects small,.private-block-card small,.private-block-empty,
  .voice-recorder__copy small,.voice-recorder__footer>span,.composer-attachment-row>em,
  .attachment-menu>button>small,.media-processing-note small,.contact-methods small,
  .contact-consent-preview small,.pairing-section-heading small,.pairing-divider,
  .pairing-prototype-note,.band-create-preview small,.band-boundaries small,.profile-menu small,
  .profile-stats small,.profile-section-heading em,.profile-quota-grid small,.profile-boundary-note,
  .energy-recharge-notice small,.energy-recharge-history small,.public-profile-hero p,
  .public-profile-live small,.public-profile-boundary p,.listened-frequencies-copy,
  .listened-frequency-list small,.identity-nickname small,.identity-nickname p,
  .language-settings small,.identity-protection small,.device-integrity__header small,
  .device-integrity p,.identity-levels small,.identity-levels em,.identity-intro,.identity-legal-note
) { color:var(--text-secondary); }

html[data-theme="dark"] :is(
  .relay-status__signal,.public-receive-toggle__signal,.profile-menu-icon,.attachment-menu>button>span,
  .type-button span,.listened-frequency-list article>button:last-child,.energy-recharge-notice>span
) {
  color:var(--icon);
  background:var(--surface-soft);
}
html[data-theme="dark"] .profile-menu-icon { color:#64e3a0; }
html[data-theme="dark"] .profile-menu>button>i,
html[data-theme="dark"] .band-create-preview>i,
html[data-theme="dark"] .contact-methods>button>i { color:var(--icon-muted); }
html[data-theme="dark"] .profile-menu>button+button,
html[data-theme="dark"] .frequency-request-panel,
html[data-theme="dark"] .frequency-request-card,
html[data-theme="dark"] .identity-boundaries,
html[data-theme="dark"] .identity-boundaries span:not(:last-child),
html[data-theme="dark"] .device-integrity__signals span:not(:last-child),
html[data-theme="dark"] .identity-levels,
html[data-theme="dark"] .identity-levels>div,
html[data-theme="dark"] .relay-stats,
html[data-theme="dark"] .relay-stats span:not(:last-child),
html[data-theme="dark"] .voice-call-clocks,
html[data-theme="dark"] .voice-call-clocks span+span { border-color:var(--line); }

html[data-theme="dark"] .public-receive-toggle__signal {
  color:#5ce19c;
  background:#15291e;
}
html[data-theme="dark"] .public-receive-toggle--paused .public-receive-toggle__signal {
  color:#9aa79f;
  background:#1a221d;
}
html[data-theme="dark"] .public-receive-toggle--paused .switch-track { background:#4a554f; }
html[data-theme="dark"] .live-pill,
html[data-theme="dark"] .live-pill--paused { color:var(--text-secondary); }
html[data-theme="dark"] .range-card output,
html[data-theme="dark"] .send-range output { color:#5ee09c; }

html[data-theme="dark"] :is(.compose-field>span,.composer-attachment-row>em,.add-attachment-button,.attachment-menu>button,.type-button) {
  color:var(--text-secondary);
}
html[data-theme="dark"] .add-attachment-button:hover,
html[data-theme="dark"] .add-attachment-button[aria-expanded="true"],
html[data-theme="dark"] .add-attachment-button--active { background:#1a241e; }
html[data-theme="dark"] .add-attachment-button>span { color:#07100b; background:#55df98; }
html[data-theme="dark"] .attachment-menu>button:not(:last-child) { border-right-color:var(--line); }
html[data-theme="dark"] .attachment-menu>button>b { color:var(--text); }
html[data-theme="dark"] .attachment-menu svg { color:var(--icon); opacity:1; }
html[data-theme="dark"] .type-button { border-color:var(--line); background:#111914; }
html[data-theme="dark"] .type-button--active { color:#58df98; background:#11271b; }
html[data-theme="dark"] .type-button--active span { color:#07100b; background:#58df98; }
html[data-theme="dark"] :is(
  .compose-field textarea,.identity-nickname input,.contact-remark-field input,.language-settings select,
  .pairing-code-input input,.temporary-band-field input,.temporary-band-field textarea,.band-search input,
  .longwave-compose-field input,.longwave-compose-field textarea,.longwave-update-field textarea
)::placeholder { color:#7f8e85; opacity:1; }

html[data-theme="dark"] .identity-protection small,
html[data-theme="dark"] .device-integrity__header small,
html[data-theme="dark"] .device-integrity p { color:#adc0b5; }
html[data-theme="dark"] .device-integrity__signals span {
  border-color:#315044;
  color:#99c5b2;
  background:transparent;
}
html[data-theme="dark"] .device-integrity__header em { color:#6bd5ed; }
html[data-theme="dark"] .identity-levels>div>b {
  color:#b0bcb5;
  background:#202a24;
}
html[data-theme="dark"] .identity-levels>div.identity-level--complete>b {
  color:#07100b;
  background:#4ade91;
}
html[data-theme="dark"] .identity-levels>div.identity-level--active { background:rgba(74,222,145,.045)!important; }
html[data-theme="dark"] .identity-levels>div.identity-level--active em { color:#5ce09b; }
html[data-theme="dark"] .identity-trust-button>b { color:#07100b; background:#5ce09b; }
html[data-theme="dark"] .identity-trust-button--done>b { color:#63dfa0; background:rgba(74,222,145,.1); }

html[data-theme="dark"] .profile-stats { border-color:var(--line); background:var(--line); }
html[data-theme="dark"] .profile-stats button,
html[data-theme="dark"] .profile-menu>button { background:#121a15; }
html[data-theme="dark"] .profile-quota-grid b { background:#2a352e; }
html[data-theme="dark"] .profile-identity>span { color:#61dfa0; background:#15291e; }
html[data-theme="dark"] .band-create-preview {
  border-color:#405247;
  color:var(--text-secondary);
}
html[data-theme="dark"] .band-create-preview>span:first-child { color:#61dfa0; background:#173024; }
html[data-theme="dark"] .band-boundaries>b,
html[data-theme="dark"] .band-boundaries b { color:var(--text-tertiary); }
html[data-theme="dark"] .band-search label svg { color:var(--icon-muted); }

html[data-theme="dark"] :is(
  .contact-methods>button,.pairing-actions button,.pairing-regenerate,.pairing-submit-row>button:first-child,
  .frequency-code-own>button,.channel-transport button,.private-block-card button,
  .energy-package-grid button,.public-profile-actions>button,.longwave-owner-actions button,
  .longwave-status-actions button,.longwave-request-card>div:last-child button
) { color:var(--text-secondary); }
html[data-theme="dark"] :is(.frequency-request-panel button[data-request-state="contact"],.frequency-request-card>button) {
  color:#5bdf99;
  background:#15291e;
}
html[data-theme="dark"] :is(button,input,textarea,select):disabled {
  color:var(--text-disabled);
  opacity:.72;
}
html[data-theme="dark"] button:disabled svg { color:var(--text-disabled); opacity:1; }

html[data-theme="dark"] .longwave-filters button { color:var(--text-secondary); }
html[data-theme="dark"] .longwave-card__meta strong,
html[data-theme="dark"] .longwave-card>p,
html[data-theme="dark"] .longwave-detail-identity strong,
html[data-theme="dark"] .longwave-detail-hero>p,
html[data-theme="dark"] .longwave-progress-list p,
html[data-theme="dark"] .longwave-echo-card p { color:var(--text-secondary); }
html[data-theme="dark"] .longwave-status-actions button { color:var(--text-secondary); }
html[data-theme="dark"] .longwave-detail-actions button { color:#c1ccc5; }
html[data-theme="dark"] .oscilloscope-head,
html[data-theme="dark"] .oscilloscope-head strong,
html[data-theme="dark"] .oscilloscope-foot,
html[data-theme="dark"] .oscilloscope-foot span:last-child { color:#9dadA3; }
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .language-settings p,
html[data-theme="dark"] .theme-settings>span small { color:#5ade99; }
html[data-theme="dark"] .language-settings label i { color:var(--icon-muted); }
html[data-theme="dark"] .identity-protection__icon,
html[data-theme="dark"] .device-integrity__icon { color:#07100b; }
html[data-theme="dark"] .primary-button {
  color:#07100b;
  background:#4ade91;
}
html[data-theme="dark"] .primary-button svg { color:#07100b; }
html[data-theme="dark"] .primary-button:disabled {
  color:var(--text-disabled);
  background:#26322b;
}
html[data-theme="dark"] .relay-trace { color:#58c9e9; background:rgba(85,199,231,.07); }
html[data-theme="dark"] .relay-trace b { color:#a7b8ae; }
html[data-theme="dark"] .relay-trace--waiting { color:#5ade99; }
html[data-theme="dark"] :is(.favorite-band-empty strong,.band-search-empty strong,.band-request-empty strong) { color:var(--text); }
html[data-theme="dark"] :is(.favorite-band-empty,.band-search-empty,.band-request-empty) { color:var(--text-secondary); }
html[data-theme="dark"] :is(
  .band-card__signal,.band-card__body small,.band-card__latest b,.band-card__body strong em,
  .favorite-band-card>button:first-child>span:first-child
) { color:color-mix(in srgb,var(--band-color) 48%,#fff); }
html[data-theme="dark"] :is(.favorite-band-card>button:first-child>b.is-active,.band-card>button>b.is-active,.band-card__enter-button>b.is-active) {
  color:#07100b;
  background:color-mix(in srgb,var(--band-color) 62%,#fff);
}
html[data-theme="dark"] :is(
  .longwave-card__heading>span,.longwave-card__heading small,
  .longwave-detail-category>span,.longwave-detail-category small,
  .longwave-progress-list article>span
) { color:color-mix(in srgb,var(--longwave-color) 52%,#fff); }

@media (min-width:700px) {
  html[data-theme="dark"] .app-shell { border-color:#26312b; }
}