:root {
  --bg: #06111f;
  --surface: rgba(10, 29, 48, 0.92);
  --surface-strong: #0b2037;
  --border: rgba(106, 167, 220, 0.34);
  --text: #edf6ff;
  --muted: #a8bfd5;
  --muted-2: #7f9bb5;
  --accent: #1683ff;
  --accent-strong: #0a57c9;
  --danger: #c35c78;
  font-family: "Manrope", system-ui, sans-serif;
  color: var(--text);
  background: var(--bg);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
[hidden] { display: none !important; }
body { min-width: 320px; margin: 0; background: radial-gradient(circle at 18% 0%, #123b65 0, transparent 34rem), var(--bg); }
body:not(.app-ready) .app-shell { visibility: hidden; }
a { color: #a8d5ff; text-decoration: none; }
button, input, textarea { font: inherit; }
button { border: 1px solid var(--border); border-radius: 8px; padding: 0.55rem 0.76rem; background: #102a45; color: var(--text); cursor: pointer; }
button:hover:not(:disabled) { border-color: #85c7ff; }
button:disabled { cursor: not-allowed; opacity: 0.55; }
.primary { border-color: #4ea7f4; background: linear-gradient(135deg, var(--accent), var(--accent-strong)); color: #fff; }
.danger { border-color: #a95670; background: #421c2c; }

.app-shell { min-height: 100vh; padding-bottom: 4.7rem; }
.topbar, .mobile-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid var(--border); background: rgba(6, 20, 35, 0.9); backdrop-filter: blur(14px); }
.topbar { position: sticky; z-index: 5; top: 0.8rem; width: min(1180px, calc(100% - 2rem)); margin: 0.8rem auto 0; padding: 0.72rem 1rem; border-radius: 16px; }
.mobile-header { display: none; padding: 0.55rem 0.75rem; }
.mobile-header-tools { display: flex; align-items: center; justify-content: flex-end; gap: .35rem; min-width: 0; }
.mobile-header-tools button { padding: .48rem .58rem; font-size: .78rem; white-space: nowrap; }
.brand { display: inline-flex; align-items: center; gap: 0.65rem; min-width: 0; color: #fff; }
.brand-logo { width: 36px; height: 36px; border-radius: 10px; object-fit: cover; }
.brand-copy { display: grid; }
.brand-copy strong { font-family: "Bebas Neue", sans-serif; letter-spacing: 0.05em; font-size: 1.34rem; font-weight: 400; }
.brand-copy small { color: var(--muted-2); font-size: 0.7rem; }
.nav-links { display: flex; align-items: center; justify-content: center; gap: 0.25rem; overflow-x: auto; }
.nav-links a { border-radius: 7px; padding: 0.5rem 0.7rem; color: var(--muted); font-size: 0.9rem; white-space: nowrap; }
.nav-links a:hover, .nav-links a.active { color: #fff; background: rgba(255,255,255,0.09); }
.wallet-tools { display: flex; align-items: center; gap: 0.5rem; white-space: nowrap; }

.page { width: min(980px, calc(100% - 2rem)); margin: 0 auto; padding: 1.1rem 0 2rem; }
.card { position: relative; overflow: hidden; margin: 1rem 0; padding: 1rem; border: 1px solid var(--border); border-top: 4px solid var(--accent); border-radius: 12px; background: linear-gradient(135deg, rgba(5,16,29,0.98), var(--surface)); box-shadow: 0 18px 45px rgba(0,0,0,0.24); }
.agent-connect-notice { min-height: min(440px, calc(100vh - 10rem)); align-items: center; justify-content: center; gap: 1.35rem; padding: clamp(2rem, 6vw, 4.5rem); text-align: center; }
.agent-connect-notice:not([hidden]) { display: flex; }
.agent-connect-notice-icon { display: grid; width: 76px; height: 76px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(117,188,247,.62); border-radius: 18px; background: linear-gradient(145deg, rgba(22,131,255,.4), rgba(10,87,201,.18)); color: #fff; font-family: "Bebas Neue", sans-serif; font-size: 2rem; letter-spacing: .08em; box-shadow: 0 16px 38px rgba(0,0,0,.24); }
.agent-connect-notice-copy { display: grid; justify-items: center; gap: .75rem; max-width: 620px; }
.agent-connect-notice-copy p { margin: 0; color: var(--muted); line-height: 1.6; }
.agent-connect-notice-copy .eyebrow { color: var(--accent); line-height: 1.2; }
.agent-connect-notice-copy button { min-width: 180px; margin-top: .35rem; padding: .75rem 1rem; font-weight: 800; }
.agent-connect-notice-copy .agent-connect-notice-status { margin-top: .35rem; color: var(--text); }
.profile-card.has-cover::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(3,9,17,.16) 0%, rgba(8,20,34,.34) 68%, var(--panel) 100%), var(--profile-cover-image) center/cover no-repeat; }
.profile-card > * { position: relative; }
.profile-header { display: flex; align-items: center; gap: 0.95rem; }
.avatar-wrap { position: relative; flex: 0 0 auto; }
.avatar-edit-button { position: absolute; right: -6px; bottom: -6px; min-width: 0; padding: .34rem .44rem; border-radius: 5px; }
.avatar, .mini-avatar { aspect-ratio: 1 / 1; box-sizing: border-box; flex: 0 0 auto; display: grid; place-items: center; overflow: hidden; border: 2px solid #75bcf7; background: #15446d; color: #fff; font-weight: 800; }
.avatar { width: 104px; height: 104px; border-radius: 5px; font-size: 1.65rem; }
.avatar img, .mini-avatar img { display: block; width: 100%; height: 100%; min-width: 100%; min-height: 100%; object-fit: cover; }
.mini-avatar { width: 38px; min-width: 38px; max-width: 38px; height: 38px; min-height: 38px; max-height: 38px; border-radius: 5px; font-size: .76rem; }
.eyebrow { margin: 0; color: #8dcbff; font-size: 0.72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
h1, h2, h3 { margin: 0; }
h1 { font-size: clamp(1.6rem, 4vw, 2.35rem); }
h2 { font-size: 1.15rem; }
h3 { font-size: 1.03rem; }
.wallet-text, .muted-copy { color: var(--muted); }
.profile-stats { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: 1rem; }
.stat-pill { display: inline-flex; box-sizing: border-box; min-height: 36px; align-items: center; justify-content: center; gap: .28rem; margin: 0; border: 1px solid rgba(129,192,246,.36); border-radius: 5px; padding: .42rem .7rem; background: rgba(37,117,183,.15); color: #c8e7ff; font-size: .84rem; line-height: 1; white-space: nowrap; vertical-align: middle; }
.stat-pill strong { line-height: 1; font-variant-numeric: tabular-nums; }
.stat-pill-button { cursor: pointer; }
.stat-pill-button:hover { border-color: #85c7ff; background: rgba(37,117,183,.26); }
.action-row, .post-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.icon-action-button { display: inline-grid; width: 2.35rem; height: 2.35rem; place-items: center; padding: 0; font-size: 1.05rem; line-height: 1; }
.icon-action-button .action-icon { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.counted-action-button { display: inline-flex; width: auto; min-width: 3.4rem; gap: .35rem; padding: 0 .62rem; }
.action-count { color: #c8e7ff; font-size: .78rem; font-weight: 800; line-height: 1; }
.block-blab-actions { display: flex; justify-content: flex-end; gap: .4rem; margin-top: .65rem; }
.block-blab-actions[hidden] { display: none; }
.block-blab-speaker { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .65rem; align-items: start; margin-top: .7rem; }
.block-blab-avatar { width: 38px; height: 38px; }
.block-blab-speaker .post-excerpt { margin-top: 0; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.stack { display: grid; gap: .8rem; }
.stack-head { margin-top: 1.6rem; }
.feed-section { display: grid; gap: 1rem; }
.feed-tabs-row { display: flex; align-items: center; justify-content: space-between; gap: .85rem; flex-wrap: wrap; }
.feed-tabs { display: inline-flex; flex-wrap: wrap; gap: .35rem; padding: .25rem; border: 1px solid var(--border); border-radius: 5px; background: rgba(2,11,22,.54); }
.feed-tab { border: 0; border-radius: 5px; background: transparent; padding: .5rem .82rem; color: var(--muted); }
.feed-tab.active { background: #175b92; color: #fff; }
.feed-tabs-actions { display: flex; gap: .45rem; align-items: center; }
.feed-pane[hidden] { display: none !important; }
.segmented { display: inline-flex; gap: .25rem; padding: .2rem; border: 1px solid var(--border); border-radius: 9px; background: rgba(2,11,22,.54); }
.segmented button { border: 0; background: transparent; padding: .4rem .58rem; }
.segmented button.active { background: #175b92; }
.empty-state { border: 1px dashed rgba(129,192,246,.43); border-radius: 10px; padding: 1.2rem; color: var(--muted); text-align: center; }
.empty-state.compact { padding: .76rem; }
.network-list { display: grid; gap: .55rem; margin-top: .75rem; }
.network-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .62rem 0; border-bottom: 1px solid rgba(123,173,214,.18); }
.network-wallet { display: flex; align-items: center; min-width: 0; gap: .62rem; }
.network-wallet span:last-child { display: grid; min-width: 0; }
.network-wallet strong { overflow: hidden; color: #f3f8ff; text-overflow: ellipsis; white-space: nowrap; }
.network-wallet small { overflow: hidden; color: var(--muted-2); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.meta-row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; color: var(--muted-2); font-size: .76rem; }
.post-excerpt { margin: .7rem 0 0; color: #d6e6f5; line-height: 1.55; white-space: pre-wrap; }
.post-excerpt-group { display: grid; gap: .45rem; }
.post-excerpt-toggle { width: fit-content; margin-top: 0; border-radius: 8px; padding: .5rem .75rem; background: #102a45; color: var(--text); }
.media-preview-shell { margin-top: .8rem; overflow: hidden; border: 1px solid rgba(123,173,214,.18); border-radius: 10px; background: rgba(8, 24, 40, .55); }
.link-preview-card { display: grid; grid-template-columns: minmax(0, 220px) 1fr; color: inherit; text-decoration: none; transition: border-color .18s ease, transform .18s ease; }
.link-preview-card:hover { border-color: rgba(78,167,244,.7); transform: translateY(-1px); }
.link-preview-image { width: 100%; height: 100%; min-height: 150px; max-height: 260px; object-fit: cover; background: rgba(3,14,24,.92); }
.link-preview-image[hidden] { display: none; }
.link-preview-image[hidden] + .link-preview-copy { grid-column: 1 / -1; }
.link-preview-copy { display: grid; align-content: center; gap: .45rem; min-width: 0; padding: 1rem; }
.link-preview-copy strong { overflow-wrap: anywhere; }
.link-preview-copy small { color: var(--muted); }
.link-preview-copy em { color: var(--muted); font-size: .9rem; font-style: normal; line-height: 1.45; }
.link-preview-copy > span { color: #78bff7; font-weight: 800; }
.media-preview { display: block; width: 100%; max-width: 100%; min-height: 420px; max-height: min(86vh, 760px); object-fit: contain; background: rgba(3, 14, 24, .92); }
.media-audio { display: block; width: 100%; max-width: 100%; min-width: 0; }
.media-player-card { width: min(880px, 100%); }
.media-player-head { display: grid; grid-template-columns: minmax(0, 180px) minmax(0, 1fr); gap: 1rem; align-items: center; margin-top: .9rem; padding: 1rem; border: 1px solid rgba(120, 191, 247, .2); border-radius: 16px; background: linear-gradient(135deg, rgba(9, 28, 46, .96), rgba(14, 47, 74, .88)); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }
.media-player-artwork { aspect-ratio: 1 / 1; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(120, 191, 247, .22); border-radius: 18px; background: radial-gradient(circle at 30% 20%, rgba(45, 144, 226, .45), rgba(5, 18, 32, .92)); color: #dff3ff; font-family: "Bebas Neue", sans-serif; font-size: 2rem; letter-spacing: .08em; }
.media-player-artwork img { width: 100%; height: 100%; object-fit: cover; }
.media-player-copy { display: grid; gap: .8rem; min-width: 0; }
.media-player-meta { margin: 0; color: #d6efff; font-size: .92rem; line-height: 1.5; }
.media-player-transport { display: flex; flex-wrap: wrap; gap: .55rem; }
.media-player-transport button { min-width: 110px; }
.media-player-status { margin: .75rem 0 0; }
.media-player-frame { width: 100%; min-height: min(68vh, 620px); border: 0; border-radius: 10px; background: rgba(3, 14, 24, .92); }
.media-player-video, .media-player-image { display: block; width: 100%; max-height: min(68vh, 620px); border-radius: 10px; background: rgba(3, 14, 24, .92); object-fit: contain; }
.media-player-audio { width: 100%; }
.status { margin: 1rem 0; padding: .76rem .9rem; border: 1px solid rgba(83,169,255,.5); border-radius: 10px; background: rgba(17,74,122,.35); color: #d6efff; }
.profile-status { width: fit-content; max-width: min(100%, 480px); margin: .75rem 0 0 auto; padding: .55rem .75rem; text-align: right; backdrop-filter: blur(8px); }
.modal-shell { position: fixed; z-index: 20; inset: 0; display: grid; place-items: start center; padding: calc(2.5rem + env(safe-area-inset-top, 0px)) 1rem calc(1rem + env(safe-area-inset-bottom, 0px)); overflow-y: auto; scroll-padding-top: calc(2.5rem + env(safe-area-inset-top, 0px)); }
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.68); }
.modal-card { z-index: 1; width: min(650px, 100%); max-height: calc(100dvh - 3.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); margin: 0; overflow: auto; overscroll-behavior: contain; }
.network-modal-card { width: min(760px, 100%); }
.network-modal-card > .section-head { position: static; }
.network-modal-card > .segmented { margin: .9rem 0 .75rem; }
.network-modal-list { max-height: min(62vh, 560px); overflow: auto; padding-right: .2rem; }
.comments-modal-card { display: flex; width: min(720px, 100%); height: calc(100dvh - 4rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); flex-direction: column; }
.comments-list { display: grid; flex: 1 1 auto; gap: .65rem; min-height: 0; margin-top: .8rem; overflow: auto; padding-right: .2rem; }
.comment-row { padding: .75rem; border: 1px solid rgba(123,173,214,.18); border-radius: 10px; background: rgba(8,24,40,.55); }
.comment-form { margin-top: .8rem; }
.modal-card > .section-head { position: sticky; top: 0; z-index: 2; margin: -1rem -1rem 0; padding: 1rem; background: linear-gradient(180deg, rgba(5,16,29,.98), rgba(5,16,29,.94)); border-bottom: 1px solid rgba(123,173,214,.18); }
.modal-actions { position: sticky; bottom: 0; z-index: 2; margin: 0 -1rem -1rem; padding: .9rem 1rem calc(.9rem + env(safe-area-inset-bottom, 0px)); background: linear-gradient(0deg, rgba(5,16,29,.98), rgba(5,16,29,.94)); border-top: 1px solid rgba(123,173,214,.18); }
.composer-form { display: grid; gap: .75rem; }
.modal-card.post-composer-card { display: flex; flex-direction: column; overflow: hidden; }
.post-composer-card > .section-head { position: static; flex: 0 0 auto; }
.post-composer-form { flex: 1 1 auto; min-height: 0; margin: 0 -1rem -1rem; padding: .75rem 1rem 1rem; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; -webkit-overflow-scrolling: touch; scroll-padding-block: .75rem calc(4.75rem + env(safe-area-inset-bottom, 0px)); }
.post-composer-form > .modal-actions { margin-right: -1rem; margin-bottom: -1rem; margin-left: -1rem; }
.field { display: grid; gap: .4rem; margin-top: .75rem; color: #d7e9f9; font-size: .88rem; }
.upload-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: center; }
.upload-row input[type="file"] { min-width: 0; padding: .5rem; }
.upload-row button { white-space: nowrap; }
.access-details { border: 1px solid rgba(129,192,246,.28); border-radius: 8px; padding: .75rem .85rem; background: rgba(20,76,123,.16); color: #d6e6f5; }
.access-details summary { cursor: pointer; font-weight: 800; color: #e7f6ff; }
.access-details p { margin: .55rem 0 .7rem; color: #b9d2e5; line-height: 1.5; }
.access-details .pill { width: fit-content; }
.access-details-warning { border-color: rgba(242,194,76,.58); background: rgba(112,78,12,.22); }
.access-details-warning summary { min-height: 24px; color: #ffe19a; }
.access-details-summary-icon { display: inline-grid; width: 24px; height: 24px; margin-right: .35rem; place-items: center; border: 1px solid rgba(255,225,154,.58); border-radius: 50%; font-size: .78rem; line-height: 1; vertical-align: middle; }
.access-details-summary-hint { margin-left: .3rem; color: #d7c38f; font-size: .76rem; font-weight: 600; }
.split-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.helper-copy { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }
input, textarea { width: 100%; border: 1px solid #416789; border-radius: 8px; padding: .65rem; background: #071727; color: var(--text); }
select { width: 100%; border: 1px solid #416789; border-radius: 8px; padding: .65rem; background: #071727; color: var(--text); }
textarea { resize: vertical; }
.row-form { display: grid; grid-template-columns: 1fr auto; gap: .6rem; margin-top: .85rem; }
.wallet-assets-toolbar { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.wallet-assets-filter-label { color: var(--muted); font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.wallet-assets-filter { width: auto; min-width: 180px; max-width: 100%; }
.list-card { display: grid; gap: .8rem; }
.list-cover { overflow: hidden; border-radius: 10px; background: rgba(16, 42, 69, .92); }
.list-cover img { display: block; width: 100%; max-height: 260px; object-fit: cover; }
.list-meta, .list-items, .list-item-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.pill { display: inline-flex; align-items: center; border: 1px solid rgba(129,192,246,.36); border-radius: 5px; padding: .26rem .6rem; background: rgba(20,76,123,.2); color: #c8e7ff; font-size: .74rem; }
.icon-pill { aspect-ratio: 1 / 1; box-sizing: border-box; flex: 0 0 2rem; justify-content: center; width: 2rem; min-width: 2rem; max-width: 2rem; height: 2rem; min-height: 2rem; max-height: 2rem; padding: .28rem; border-radius: 5px; }
.icon-pill img { display: block; aspect-ratio: 1 / 1; width: 100%; height: 100%; border-radius: 5px; object-fit: cover; }
.efp-pill, .ub-pill { position: relative; gap: .32rem; text-decoration: none; }
.efp-pill img { width: 14px; height: 14px; border-radius: 3px; object-fit: cover; }
.icon-pill.efp-pill img { width: 100%; height: 100%; }
.protocol-check { position: absolute; right: -4px; bottom: -4px; display: grid; place-items: center; width: 14px; height: 14px; border: 2px solid #071827; border-radius: 999px; background: #17c964; color: #03120a; font-size: 9px; font-weight: 900; line-height: 1; }
.ub-pill img { border-radius: 5px; }
.network-row .icon-pill { aspect-ratio: 1 / 1; width: 2rem; min-width: 2rem; max-width: 2rem; height: 2rem; min-height: 2rem; max-height: 2rem; border-radius: 5px; }
.network-row .icon-pill img { aspect-ratio: 1 / 1; width: 100%; height: 100%; border-radius: 5px; object-fit: cover; }
.network-wallet .mini-avatar,
.network-wallet .mini-avatar img { border-radius: 5px; }
.list-items { display: grid; gap: .55rem; }
.list-item { display: grid; gap: .5rem; padding: .75rem; border: 1px solid rgba(123,173,214,.18); border-radius: 10px; background: rgba(8, 24, 40, .55); }
.list-item-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; min-width: 0; }
.list-item-copy { color: #d6e6f5; line-height: 1.5; white-space: pre-wrap; }
.list-item-actions { margin-top: .1rem; }
.subtle-status { border-style: dashed; background: rgba(12, 41, 66, .24); }
.asset-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.asset-card { display: grid; gap: .7rem; padding: .9rem; border: 1px solid rgba(123,173,214,.18); border-radius: 12px; background: rgba(8, 24, 40, .55); }
.asset-card-media { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 10px; background: rgba(16, 42, 69, .92); display: grid; place-items: center; min-width: 0; }
.asset-card-media img { width: 100%; height: 100%; object-fit: contain; }
.asset-card-placeholder { padding: .8rem; text-align: center; color: var(--muted); font-weight: 800; letter-spacing: .06em; }
.asset-card-copy { display: grid; gap: .35rem; min-width: 0; }
.asset-card-copy p { margin: 0; color: #d6e6f5; }
.asset-card-title { font-size: 1rem; font-weight: 700; color: #fff; }
.asset-card-meta { color: var(--muted); font-size: .8rem; }
.asset-card-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.nft-details-card { width: min(900px, calc(100% - 1rem)); }
.nft-details-layout { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); gap: 1rem; margin-top: 1rem; }
.nft-details-media { display: grid; min-height: 280px; place-items: center; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: #070b10; }
.nft-details-media img { display: block; width: 100%; max-height: 520px; object-fit: contain; }
.nft-details-copy { min-width: 0; }
.nft-details-facts { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .45rem .75rem; margin: 1rem 0; }
.nft-details-facts dt { color: var(--muted-2); font-size: .78rem; }
.nft-details-facts dd { min-width: 0; margin: 0; overflow-wrap: anywhere; font-size: .82rem; }
.nft-transfer-form { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(123,173,214,.2); }
.chat-list { display: grid; gap: .45rem; margin-top: .8rem; }
.chat-row { display: flex; justify-content: space-between; width: 100%; text-align: left; }
.chat-row.selected { border-color: #78c2fb; background: #12466f; }
.chat-row small { color: var(--muted-2); }
.message-thread { display: grid; gap: .65rem; max-height: 430px; overflow: auto; margin-top: .9rem; padding: .4rem 0; }
.message { max-width: 78%; padding: .65rem .75rem; border-radius: 11px; background: #102f4b; }
.message.mine { justify-self: end; background: #125b93; }
.message small { color: #c5e3fb; font-size: .72rem; }
.message p { margin: .25rem 0 0; white-space: pre-wrap; }
.message-form { display: grid; grid-template-columns: 1fr auto; gap: .6rem; margin-top: .8rem; }
.mobile-bottom-nav { display: none; }
.startup-loader { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; background: radial-gradient(circle at 50% 18%, #123b65 0, transparent 24rem), var(--bg); transition: opacity .18s ease, visibility .18s ease; }
.startup-loader-card { display: grid; gap: .85rem; place-items: center; padding: 1.5rem; text-align: center; }
.startup-loader-brand { width: 74px; height: 74px; border-radius: 18px; object-fit: cover; box-shadow: 0 18px 45px rgba(0,0,0,.28); }
.startup-loader-title { font-family: "Bebas Neue", sans-serif; font-size: 2.4rem; letter-spacing: .06em; }
.startup-loader-ens { width: 88px; max-width: 34vw; filter: drop-shadow(0 18px 24px rgba(0,0,0,.28)); animation: ensDrop .78s cubic-bezier(.16,1,.3,1) both; }
.startup-loader-copy { margin: 0; color: #dff3ff; font-size: .9rem; font-weight: 800; letter-spacing: .18em; }
body.app-ready .startup-loader { visibility: hidden; opacity: 0; pointer-events: none; }
@keyframes ensDrop {
  0% { opacity: 0; transform: translateY(-120px) scale(.82); filter: drop-shadow(0 2px 4px rgba(0,0,0,.1)); }
  62% { opacity: 1; transform: translateY(10px) scale(1.06); filter: drop-shadow(0 24px 28px rgba(0,0,0,.34)); }
  78% { transform: translateY(-7px) scale(.98); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: drop-shadow(0 18px 24px rgba(0,0,0,.28)); }
}

@media (max-width: 780px) {
  .agent-connect-notice { min-height: calc(100dvh - 9.5rem); flex-direction: column; padding: 2rem 1.25rem; }
  .nft-details-layout { grid-template-columns: 1fr; }
  .nft-details-media { min-height: 220px; }
  .link-preview-card { grid-template-columns: 1fr; }
  .link-preview-image { max-height: 240px; }
  .desktop-topbar { display: none; }
  .mobile-header { display: flex; position: sticky; z-index: 5; top: 0; }
  .mobile-header .brand-copy small { display: none; }
  .brand.compact .brand-copy small { display: none; }
  .page { width: min(100% - 1rem, 980px); padding-bottom: 4.5rem; }
  .section-head { align-items: flex-start; flex-direction: column; }
  .profile-header { align-items: flex-start; }
  .meta-row { flex-direction: column; align-items: flex-start; }
  .media-preview-shell { border-radius: 8px; }
  .media-preview { min-height: 360px; max-height: min(78vh, 620px); object-fit: contain; }
  .media-audio, .media-player-audio, audio { width: 100%; max-width: 100%; min-width: 0; }
  .media-player-head { grid-template-columns: 1fr; padding: .8rem; }
  .media-player-artwork { max-width: 220px; width: 100%; margin: 0 auto; }
  .media-player-transport { width: 100%; }
  .media-player-transport button { flex: 1 1 0; min-width: 0; }
  .asset-grid { grid-template-columns: 1fr; }
  .asset-card-media { aspect-ratio: auto; min-height: 180px; max-height: 260px; }
  .asset-card-media img { height: auto; max-height: 260px; object-fit: contain; }
  .wallet-assets-filter { width: 100%; min-width: 0; }
  .action-row, .post-actions, .list-item-actions { width: 100%; }
  .action-row > *, .post-actions > *, .list-item-actions > *, .feed-tabs-actions > * { max-width: 100%; }
  .list-item-head, .section-head, .feed-tabs-row, .feed-tabs-actions, .asset-card, .list-card, .list-item, .network-row, .chat-row { min-width: 0; }
  .network-row { display: grid; grid-template-columns: 1fr; gap: .55rem; align-items: start; }
  .network-wallet { width: 100%; }
  .network-row .list-item-actions { justify-content: flex-start; }
  .network-modal-card > .segmented { width: 100%; }
  .network-modal-card > .segmented button { flex: 1 1 0; line-height: 1.25; }
  .modal-shell { place-items: start center; padding: calc(1.75rem + env(safe-area-inset-top, 0px)) .5rem calc(5.25rem + env(safe-area-inset-bottom, 0px)); scroll-padding-top: calc(1.75rem + env(safe-area-inset-top, 0px)); }
  .modal-card { width: 100%; max-height: calc(100dvh - 7rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); border-radius: 12px; }
  .comments-modal-card { height: calc(100dvh - 7rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .modal-card > .section-head { flex-direction: row; align-items: center; }
  .modal-card > .section-head button { margin-left: auto; }
  .modal-actions { position: sticky; }
  .feed-tabs-row { align-items: flex-start; }
  .feed-tabs { width: 100%; }
  .split-fields { grid-template-columns: 1fr; }
  .row-form, .message-form, .upload-row { grid-template-columns: 1fr; }
  .mobile-bottom-nav { position: fixed; z-index: 9; inset: auto 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .15rem; padding: .45rem; border-top: 1px solid var(--border); background: rgba(5,18,32,.96); backdrop-filter: blur(12px); }
  .mobile-bottom-nav a, .mobile-bottom-nav button { display: grid; place-items: center; gap: .12rem; border: 0; border-radius: 8px; padding: .4rem; background: transparent; color: var(--muted); font-size: .67rem; }
  .mobile-bottom-nav a.active, .mobile-bottom-nav button.active { color: #fff; background: rgba(39,133,209,.34); }
  .mobile-bottom-nav strong { font-size: .65rem; }
}

body .page.app-profile { width: min(1180px, calc(100% - 2rem)); }
.profile-content-grid { display: grid; grid-template-columns: minmax(0, 40%) minmax(0, 60%); gap: 1rem; align-items: start; }
.profile-side-panel { position: sticky; top: 5.9rem; display: grid; max-height: calc(100vh - 6.8rem); align-self: start; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.side-card { margin: 0; }
.block-features-card { display: grid; gap: 0; overflow: visible; }
.block-feature-group { padding: .2rem 0 1rem; border-bottom: 1px solid rgba(123,173,214,.2); }
.block-feature-group + .block-feature-group { padding-top: 1rem; }
.block-feature-group:last-child { padding-bottom: .2rem; border-bottom: 0; }
.block-badges-list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .45rem; margin-top: .65rem; }
.block-badge-button { display: grid; grid-template-rows: 56px auto; box-sizing: border-box; flex: 0 0 64px; width: 64px; min-width: 64px; max-width: 64px; gap: .28rem; justify-items: center; padding: .15rem; border: 0; background: transparent; }
.block-badge-button .wl-shield { box-sizing: border-box; width: 56px; min-width: 56px; max-width: 56px; height: 56px; min-height: 56px; max-height: 56px; aspect-ratio: 1 / 1; }
.block-badge-button span:last-child { max-width: 64px; overflow: hidden; color: #d9bc68; font-size: .62rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.wl-shield { position: relative; display: grid; aspect-ratio: 1 / 1; box-sizing: border-box; flex: 0 0 56px; width: 56px; min-width: 56px; max-width: 56px; height: 56px; min-height: 56px; max-height: 56px; place-items: center; overflow: hidden; border: 1px solid rgba(215,174,72,.48); border-radius: 5px; background: radial-gradient(circle at 50% 38%, #282315 0, #0d0f11 58%, #080a0c 100%); box-shadow: inset 0 0 0 1px rgba(255,220,126,.08), 0 5px 12px rgba(0,0,0,.34), 0 0 10px rgba(210,164,47,.08); }
.wl-shield svg { position: absolute; width: 66%; height: 76%; overflow: visible; filter: drop-shadow(0 0 3px rgba(241,198,78,.32)); }
.wl-shield .shield-rim { fill: #d3a83f; stroke: #ffe18a; stroke-width: 1.4; stroke-linejoin: round; }
.wl-shield .shield-face { fill: #17171c; stroke: #715b2c; stroke-width: 1; }
.wl-shield b { position: relative; z-index: 1; color: #f2c955; font-family: "Bebas Neue", sans-serif; font-size: 1.08rem; letter-spacing: .04em; text-shadow: 0 1px 0 #000; }
.wl-shield-large { flex-basis: 104px; width: 104px; min-width: 104px; max-width: 104px; height: 104px; min-height: 104px; max-height: 104px; border-radius: 5px; }
.wl-shield-large b { font-size: 2rem; }
.badge-modal-hero { display: flex; gap: 1rem; align-items: center; margin: 1rem 0; }
.badge-modal-hero p { color: var(--muted); line-height: 1.55; }
.block-powers-list { display: grid; gap: .55rem; margin-top: .8rem; }
.block-power-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .5rem; align-items: center; padding: .65rem; border: 1px solid rgba(123,173,214,.22); border-radius: 9px; background: rgba(8,24,40,.65); }
.block-power-copy { display: grid; min-width: 0; gap: .18rem; }
.block-power-copy strong { overflow-wrap: anywhere; }
.block-power-copy small { color: var(--muted-2); }
.block-power-vote { display: inline-flex; aspect-ratio: 1 / 1; box-sizing: border-box; flex: 0 0 44px; align-items: center; justify-content: center; gap: .25rem; width: 44px; min-width: 44px; max-width: 44px; height: 44px; min-height: 44px; max-height: 44px; padding: .3rem; border-radius: 5px; }
.block-power-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .75rem; }
.block-power-actions button { flex: 1 1 auto; }
.block-powers-modal-list { max-height: min(65vh, 620px); overflow-y: auto; }
.side-card-head { flex-direction: row; align-items: center; }
.side-card-head button { padding: .42rem .58rem; }
.block-blab-title { color: #4ea7f4; }
.chain-links-title { color: #4ea7f4; }
.profile-links-list { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.profile-link-icon.pill { display: inline-grid; box-sizing: border-box; flex: 0 0 42px; width: 42px; min-width: 42px; max-width: 42px; height: 42px; min-height: 42px; max-height: 42px; aspect-ratio: 1 / 1; place-items: center; overflow: hidden; padding: 0; border-radius: 6px; }
.profile-link-icon img { display: block; width: 24px; min-width: 24px; max-width: 24px; height: 24px; min-height: 24px; max-height: 24px; object-fit: contain; border-radius: 4px; }
.profile-links-toggle { width: 100%; margin-top: .6rem; padding: .42rem .6rem; }
.profile-main-column { min-width: 0; }
.profile-column-footer { display: flex; flex-wrap: wrap; gap: 0 .8rem; align-items: center; padding: .45rem .2rem 0; color: var(--muted); font-size: .72rem; line-height: 1.35; }
.profile-column-footer a { display: inline-flex; min-height: 40px; align-items: center; color: inherit; text-decoration: none; transition-property: color; transition-duration: 150ms; transition-timing-function: ease-out; }
.profile-column-footer a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.profile-column-footer a:focus-visible { border-radius: 4px; outline: 2px solid var(--accent); outline-offset: 2px; }
@media (min-width: 901px) {
  .profile-main-column > .feed-section { margin-top: 0; }
}
.profile-editor-priority { margin-top: .75rem; padding: .75rem; border: 1px solid rgba(129,192,246,.36); border-radius: 10px; background: rgba(20,76,123,.16); }
.profile-editor-priority .field { margin-top: .45rem; }
.profile-location { width: fit-content; margin: .55rem 0 0; color: var(--muted); font-size: .86rem; }
.profile-location::before { content: "Location: "; color: var(--accent); font-weight: 800; }
.profile-source-settings { display: grid; gap: .65rem; }
.profile-source-toggle { display: grid; grid-template-columns: 20px minmax(0, 1fr); min-width: 0; align-items: start; gap: .65rem; padding: .7rem; border: 1px solid var(--border); border-radius: 8px; background: rgba(9, 31, 50, .5); cursor: pointer; }
.profile-source-toggle input { width: 18px; height: 18px; margin: .12rem 0 0; accent-color: var(--accent); }
.profile-source-toggle:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.profile-source-toggle > span { display: grid; min-width: 0; gap: .2rem; }
.profile-source-toggle strong { color: var(--text); font-size: .88rem; }
.profile-source-toggle small, .profile-source-records { color: var(--muted); font-size: .76rem; line-height: 1.5; text-wrap: pretty; }
.profile-source-records { margin: 0; }
.profile-source-records code, .profile-theme-record-list code { color: var(--accent); }
.profile-theme-settings { display: grid; min-width: 0; gap: .8rem; margin-top: .75rem; padding: .85rem; border: 1px solid var(--border); border-radius: 10px; background: rgba(12, 48, 77, .2); }
.profile-theme-heading { display: grid; gap: .35rem; }
.profile-theme-heading > div { display: grid; gap: .15rem; }
.profile-theme-heading > p { margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.5; text-wrap: pretty; }
.profile-theme-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.profile-theme-field { display: grid; min-width: 0; align-content: start; gap: .38rem; color: var(--text); font-size: .82rem; font-weight: 700; }
.profile-theme-field > small { color: var(--muted); font-size: .72rem; font-weight: 500; line-height: 1.4; text-wrap: pretty; }
.profile-theme-color-control { display: grid; grid-template-columns: 46px minmax(0, 1fr); min-width: 0; gap: .5rem; align-items: center; }
.profile-theme-color-control input[type="color"] { width: 46px; height: 42px; padding: 3px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel-2); cursor: pointer; }
.profile-theme-color-control input[type="text"] { min-width: 0; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-transform: uppercase; }
.profile-theme-color-control input[aria-invalid="true"] { border-color: #e37b98; box-shadow: 0 0 0 2px rgba(227, 123, 152, .16); }
.profile-theme-color-control:has(input:disabled) { opacity: .52; }
.profile-theme-ens-toggle { background: rgba(20, 76, 123, .18); }
.profile-theme-ens-details { border: 1px solid var(--border); border-radius: 8px; padding: .7rem .75rem; background: rgba(7, 25, 41, .34); }
.profile-theme-ens-details summary { color: var(--text); font-size: .82rem; font-weight: 800; cursor: pointer; }
.profile-theme-ens-details > p { margin: .6rem 0; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.profile-theme-record-list { display: grid; gap: .4rem; margin: 0; }
.profile-theme-record-list > div { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(0, 1fr); gap: .6rem; align-items: center; padding: .45rem .55rem; border-radius: 6px; background: rgba(19, 56, 85, .36); }
.profile-theme-record-list dt, .profile-theme-record-list dd { min-width: 0; margin: 0; }
.profile-theme-record-list dd { overflow-wrap: anywhere; color: var(--muted); font-size: .76rem; }
.profile-theme-record-list dd.is-set { color: var(--text); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.profile-editor-links { display: grid; gap: .6rem; }
.profile-editor-link-list { display: flex; flex-wrap: wrap; gap: .45rem; }
.profile-link-rows { display: grid; gap: .55rem; }
.profile-link-row { display: grid; grid-template-columns: minmax(120px, .55fr) minmax(180px, 1fr) auto; gap: .5rem; align-items: center; }
.profile-link-row input { min-width: 0; }
.profile-link-row button { white-space: nowrap; }
.facebook-post { border-top-color: rgba(129,192,246,.5); }
.sponsor-advert-card { border-top-color: #4ea7f4; }
.sponsor-advert-link { display: block; color: inherit; text-decoration: none; }
.sponsor-advert-media { overflow: hidden; margin-top: .7rem; border: 1px solid rgba(123,173,214,.18); border-radius: 10px; background: rgba(8,24,40,.55); }
.sponsor-advert-media img { display: block; width: 100%; max-height: min(72vh, 620px); object-fit: cover; }
.sponsor-advert-copy { display: grid; gap: .4rem; margin-top: .75rem; }
.post-author-row { display: flex; align-items: center; gap: .7rem; margin-bottom: .75rem; }
.post-author-avatar { flex-basis: 44px; width: 44px; min-width: 44px; max-width: 44px; height: 44px; min-height: 44px; max-height: 44px; border-radius: 5px; }
.post-author-copy { display: grid; min-width: 0; }
.post-author-copy strong { overflow: hidden; color: #f5f9ff; text-overflow: ellipsis; white-space: nowrap; }
.post-author-copy span { color: var(--muted-2); font-size: .78rem; }
.bb-content a { color: #9bd1ff; text-decoration: underline; text-underline-offset: 2px; }
.media-preview-player { display: grid; min-height: 220px; place-items: center; background: linear-gradient(135deg, rgba(6,18,31,.98), rgba(14,47,74,.86)); }
.media-preview-player[style*="--media-preview-artwork"] { background: linear-gradient(180deg, rgba(3,12,22,.38), rgba(3,12,22,.88)), var(--media-preview-artwork) center/cover; }
.media-preview-resolving { display: grid; min-height: 180px; place-items: center; color: var(--muted); font-weight: 800; }
.media-play-button { width: auto; min-width: 150px; border-radius: 999px; padding: .8rem 1.1rem; background: linear-gradient(135deg, #1683ff, #0a57c9); box-shadow: 0 12px 28px rgba(0,0,0,.24); }
.media-play-button span::before { content: ">"; margin-right: .45rem; }
.themed-player { display: grid; gap: .8rem; }
.themed-player-video .themed-player-media { display: block; width: 100%; max-height: min(40vh, 360px); border-radius: 10px; object-fit: contain; background: rgba(3, 14, 24, .92); }
.themed-player-audio .themed-player-media { display: none; }
.themed-player-art { aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(120,191,247,.18); border-radius: 10px; background: linear-gradient(135deg, rgba(8,24,40,.98), rgba(14,47,74,.9)); color: #dff3ff; font-family: "Bebas Neue", sans-serif; font-size: 3rem; }
.themed-player-art img { width: 100%; height: 100%; object-fit: cover; }
.themed-player-controls { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; align-items: center; padding: .75rem; border: 1px solid rgba(120,191,247,.18); border-radius: 12px; background: rgba(4,16,28,.9); }
.themed-player-play { min-width: 86px; border-radius: 999px; background: linear-gradient(135deg, #1683ff, #0a57c9); }
.themed-player-timeline { display: grid; gap: .35rem; min-width: 0; }
.themed-player-range { width: 100%; accent-color: #4ea7f4; }
.themed-player-time { display: flex; justify-content: space-between; color: var(--muted); font-size: .74rem; }
#mediaPlayerModal.media-player-dock .media-player-card { border-top-color: #4ea7f4; }
#mediaPlayerModal.media-player-dock .media-player-head { border-radius: 12px; background: linear-gradient(135deg, rgba(8,24,40,.98), rgba(10,38,63,.96)); }
#mediaPlayerModal.media-player-dock .media-player-transport button { border-radius: 999px; }
#mediaPlayerModal.media-player-dock .media-player-video,
#mediaPlayerModal.media-player-dock .media-player-image,
#mediaPlayerModal.media-player-dock .media-player-frame { width: 100%; border-radius: 8px; }

@media (max-width: 900px) {
  .profile-content-grid { grid-template-columns: 1fr; }
  .profile-side-panel { position: static; max-height: none; overflow: visible; }
}


/* UBNet app parity update: make the template player persistent instead of modal-only. */
#mediaPlayerModal.media-player-dock {
  position: fixed;
  z-index: 20;
  inset: auto 1rem calc(1rem + env(safe-area-inset-bottom, 0px)) 1rem;
  display: block;
  pointer-events: none;
  padding: 0;
  overflow: visible;
}

#mediaPlayerModal.media-player-dock[hidden] {
  display: none !important;
}

#mediaPlayerModal.media-player-dock .modal-backdrop {
  display: none;
}

#mediaPlayerModal.media-player-dock .media-player-card {
  width: min(1120px, 100%);
  margin: 0 auto;
  max-height: calc(100dvh - 2rem);
  overflow: auto;
  pointer-events: auto;
  box-shadow: 0 18px 48px rgba(0,0,0,.46);
}

#mediaPlayerModal.media-player-dock .media-player-head {
  grid-template-columns: 72px minmax(0, 1fr);
  margin-top: .7rem;
  padding: .75rem;
}

#mediaPlayerModal.media-player-dock .media-player-artwork {
  width: 72px;
  max-width: 72px;
  border-radius: 12px;
}

#mediaPlayerModal.media-player-dock .media-player-video,
#mediaPlayerModal.media-player-dock .media-player-image {
  max-height: calc(100dvh - 15rem);
  object-fit: contain;
}

#mediaPlayerModal.media-player-dock .media-player-frame {
  min-height: min(72vh, 760px);
}

@media (max-width: 780px) {
  #mediaPlayerModal.media-player-dock {
    inset: auto .5rem calc(4.8rem + env(safe-area-inset-bottom, 0px)) .5rem;
  }

  #mediaPlayerModal.media-player-dock .media-player-card {
    max-height: calc(100dvh - 5.4rem);
  }

  #mediaPlayerModal.media-player-dock .media-player-head {
    grid-template-columns: 54px minmax(0, 1fr);
    gap: .65rem;
  }

  #mediaPlayerModal.media-player-dock .media-player-artwork {
    width: 54px;
    max-width: 54px;
  }
}

/* Slim persistent media player. */
body.media-player-active .app-shell { padding-bottom: 88px; }

#mediaPlayerModal.media-player-dock {
  z-index: 40;
  inset: auto 1rem calc(1rem + env(safe-area-inset-bottom, 0px)) 1rem;
}

#mediaPlayerModal.media-player-dock .media-player-card {
  box-sizing: border-box;
  display: grid;
  width: min(1180px, 100%);
  max-height: calc(100dvh - 2rem);
  margin: 0 auto;
  overflow: visible;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel);
  background: color-mix(in srgb, var(--panel) 94%, transparent);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .05);
  backdrop-filter: blur(18px);
}

.media-player-expanded {
  max-height: calc(100dvh - 7.5rem);
  overflow: auto;
  padding: .65rem;
  border-bottom: 1px solid var(--border);
  border-radius: 14px 14px 0 0;
  background: rgba(3, 14, 24, .94);
  overscroll-behavior: contain;
}

.media-player-expanded[hidden] { display: none; }
.media-player-viewport { position: relative; min-width: 0; }

.media-player-bar {
  display: grid;
  grid-template-columns: 48px minmax(150px, 1fr) auto minmax(180px, 1.25fr) auto auto 40px;
  gap: .55rem;
  align-items: center;
  min-height: 64px;
  padding: .45rem .55rem;
}

.media-player-artwork-button {
  box-sizing: border-box;
  width: 48px;
  min-width: 48px;
  height: 48px;
  min-height: 48px;
  padding: 0;
  overflow: hidden;
  border-radius: 9px;
}

#mediaPlayerModal.media-player-dock .media-player-artwork {
  display: grid;
  width: 100%;
  max-width: none;
  height: 100%;
  aspect-ratio: auto;
  place-items: center;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  font-size: 1rem;
}

.media-player-artwork img { outline: 1px solid rgba(255, 255, 255, .1); outline-offset: -1px; }
.media-player-track-copy { display: grid; gap: .2rem; min-width: 0; }
.media-player-track-copy strong,
.media-player-track-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-player-track-copy strong { color: var(--text); font-size: .9rem; }
.media-player-track-copy span { color: var(--muted); font-size: .74rem; }

#mediaPlayerModal.media-player-dock .media-player-transport {
  display: flex;
  flex-wrap: nowrap;
  gap: .3rem;
  margin: 0;
}

#mediaPlayerModal.media-player-dock .media-player-transport button,
.media-player-icon-button {
  box-sizing: border-box;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  padding: 0;
  line-height: 1;
}

#mediaPlayerModal.media-player-dock .media-player-play-button {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  border-radius: 999px;
  font-size: 1rem;
}

.media-player-progress { display: grid; gap: .15rem; min-width: 0; }
.media-player-progress input,
.media-player-volume input { width: 100%; margin: 0; accent-color: var(--accent); cursor: pointer; }
.media-player-time { display: flex; justify-content: space-between; color: var(--muted); font-size: .68rem; font-variant-numeric: tabular-nums; }
.media-player-volume { display: grid; grid-template-columns: 40px 72px; gap: .35rem; align-items: center; }
.media-player-volume .media-player-icon-button { font-size: .7rem; font-weight: 800; }
.media-player-source-link { color: var(--accent); font-size: .76rem; font-weight: 800; text-decoration: none; }
.media-player-source-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.media-player-close-button { font-size: 1.4rem; }

#mediaPlayerModal.media-player-dock .media-player-video,
#mediaPlayerModal.media-player-dock .media-player-image {
  display: block;
  width: 100%;
  max-height: calc(100dvh - 10rem);
  border-radius: 9px;
  object-fit: contain;
}

#mediaPlayerModal.media-player-dock .media-player-frame {
  min-height: min(70vh, 720px);
  border-radius: 9px;
}

.media-player-engine-audio {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 1000px) {
  .media-player-volume,
  .media-player-source-link { display: none; }
  .media-player-bar { grid-template-columns: 48px minmax(120px, 1fr) auto minmax(160px, 1fr) 40px; }
}

@media (max-width: 780px) {
  body.media-player-active .app-shell { padding-bottom: 150px; }

  #mediaPlayerModal.media-player-dock {
    inset: auto .4rem calc(4.7rem + env(safe-area-inset-bottom, 0px)) .4rem;
  }

  #mediaPlayerModal.media-player-dock .media-player-card {
    max-height: calc(100dvh - 5.5rem);
    border-radius: 12px;
  }

  .media-player-expanded { max-height: calc(100dvh - 11rem); padding: .45rem; }
  .media-player-bar {
    grid-template-columns: 40px minmax(0, 1fr) auto 40px;
    grid-template-areas:
      "art copy transport close"
      "progress progress progress progress";
    gap: .35rem .45rem;
    min-height: 88px;
    padding: .4rem;
  }

  .media-player-artwork-button { grid-area: art; width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
  .media-player-track-copy { grid-area: copy; }
  #mediaPlayerModal.media-player-dock .media-player-transport { grid-area: transport; }
  .media-player-progress { grid-area: progress; }
  .media-player-close-button { grid-area: close; }
  #mediaPlayerModal.media-player-dock .media-player-transport button { width: 36px; min-width: 36px; height: 36px; min-height: 36px; }
  #mediaPlayerModal.media-player-dock .media-player-play-button { width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
  .media-player-track-copy strong { font-size: .82rem; }
  .media-player-track-copy span { font-size: .68rem; }
}

.feed-load-more {
  border: 1px dashed rgba(129, 192, 246, .34);
  border-radius: 999px;
  margin: .9rem auto 0;
  padding: .7rem 1rem;
  color: var(--muted);
  text-align: center;
  max-width: 420px;
  background: rgba(12, 41, 66, .18);
}

.feed-load-more[data-has-more="true"] {
  cursor: pointer;
  color: var(--text);
  border-color: rgba(129, 192, 246, .58);
}

.feed-load-more[data-has-more="true"]:hover {
  background: rgba(129, 192, 246, .12);
}

@media (max-width: 780px) {
  body .page,
  body .page.app-profile {
    width: 100%;
    max-width: none;
    padding: .5rem 0 4.5rem;
  }

  .profile-content-grid,
  .profile-side-panel,
  .profile-main-column,
  .feed-section,
  .stack {
    width: 100%;
    gap: .5rem;
  }

  .card {
    width: 100%;
    margin: .5rem 0;
    padding: .5rem;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .side-card,
  .post-card,
  .list-card,
  .asset-card,
  .list-item,
  .empty-state,
  .status {
    padding: .5rem;
  }

  .feed-tabs-row,
  .section-head,
  .profile-stats,
  .action-row,
  .post-actions {
    gap: .45rem;
  }

  .media-preview-shell,
  .themed-player,
  .themed-player-art {
    width: calc(100% + 1rem);
    margin-right: -.5rem;
    margin-left: -.5rem;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .media-preview {
    min-height: 300px;
  }

  .profile-link-row {
    grid-template-columns: 1fr;
  }
}

/* Theme parity with my.eth-ub.net */
:root {
  --bg: #010409;
  --surface: #12161b;
  --surface-strong: #0b0d10;
  --panel: #12161b;
  --panel-2: #192029;
  --border: rgba(90, 169, 255, .34);
  --text: #f7fbff;
  --muted: rgba(230, 241, 252, .76);
  --muted-2: rgba(214, 229, 244, .56);
  --accent: #5aa9ff;
  --accent-strong: #18324f;
  --accent-soft: rgba(90, 169, 255, .14);
  --accent-contrast: #07111c;
  --shadow: 0 24px 60px rgba(3, 9, 20, .28);
}

body,
.app-shell {
  background: var(--bg);
}

.startup-loader {
  background: var(--bg);
}

.topbar,
.mobile-header,
.mobile-bottom-nav {
  border-color: var(--border);
  background: #0b0d10f0;
}

.card,
.side-card,
.post-card,
.list-card,
.profile-card,
.modal-card,
.feed-section,
.comment-row,
.list-item,
.asset-card,
.media-preview-shell,
.themed-player,
.profile-editor-priority {
  border-color: var(--border);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.card,
.post-card,
.list-card,
.profile-card,
.modal-card {
  border-top-color: var(--accent);
}

.feed-tabs,
.segmented,
.list-cover,
.asset-card-media,
.media-preview,
.media-player-frame,
.media-player-video,
.media-player-image,
.themed-player-media,
.themed-player-controls,
.message {
  background: var(--panel-2);
}

.modal-card > .section-head,
.modal-actions {
  background: #12161bf5;
  border-color: var(--border);
}

button,
.post-excerpt-toggle {
  background: var(--panel-2);
}

.primary,
.media-play-button,
.themed-player-play {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-contrast);
}

h1,
.eyebrow,
.block-blab-title,
.chain-links-title {
  color: var(--accent);
}

.pill,
.stat-pill,
.feed-tab.active,
.segmented button.active,
.mobile-bottom-nav a.active,
.mobile-bottom-nav button.active,
.status {
  border-color: var(--border);
  background: var(--accent-soft);
}

input,
textarea,
select {
  border-color: var(--border);
  background: #0d1116;
}

.empty-state {
  border-color: var(--border);
  background: var(--panel);
}

.mobile-wallet-options { display: grid; gap: .65rem; margin-top: 1rem; }
.mobile-wallet-options .pill { min-height: 46px; justify-content: center; }

/* iPhone and mobile Safari compatibility */
.modal-shell { -webkit-overflow-scrolling: touch; }
.modal-card { max-height: calc(100vh - 3.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); -webkit-overflow-scrolling: touch; }
.comments-modal-card { height: calc(100vh - 4rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }

@supports (height: 100dvh) {
  .modal-card { max-height: calc(100dvh - 3.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .comments-modal-card { height: calc(100dvh - 4rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
}

@media (max-width: 780px) {
  html { -webkit-text-size-adjust: 100%; }
  body { width: 100%; overflow-x: hidden; }
  .app-shell { width: 100%; min-height: 100vh; padding-bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px)); }
  body .page,
  body .page.app-profile { width: 100%; max-width: 100%; padding: .5rem 0 calc(5.5rem + env(safe-area-inset-bottom, 0px)); }
  .profile-content-grid,
  .profile-side-panel,
  .profile-main-column,
  .feed-section,
  .stack { width: 100%; min-width: 0; }
  .card { max-width: 100%; }
  input,
  textarea,
  select { min-width: 0; font-size: 16px; }
  button,
  .pill { min-height: 44px; touch-action: manipulation; }
  .profile-stats .stat-pill { min-height: 44px; }
  input[type="file"] { width: 100%; max-width: 100%; overflow: hidden; }
  .upload-row { width: 100%; grid-template-columns: minmax(0,1fr); }
  .upload-row button { width: 100%; white-space: normal; }
  .modal-shell { display: block; padding: calc(.5rem + env(safe-area-inset-top, 0px)) .35rem calc(5.25rem + env(safe-area-inset-bottom, 0px)); }
  .modal-card { width: 100%; max-width: 100%; max-height: calc(100vh - 6rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); margin: 0; overflow-y: auto; }
  .comments-modal-card { height: calc(100vh - 6rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .modal-card > .section-head { top: 0; }
  .mobile-bottom-nav { padding-bottom: calc(.45rem + env(safe-area-inset-bottom, 0px)); }
  .media-preview,
  .asset-card-media img { width: 100%; height: auto; min-height: 0; }
  .profile-link-row,
  .nft-details-layout,
  .split-fields,
  .profile-theme-grid { grid-template-columns: minmax(0,1fr); }
  .profile-theme-record-list > div { grid-template-columns: minmax(0,1fr); gap: .2rem; }
}

@media (max-width: 780px) and (orientation: landscape) {
  .modal-card { max-height: calc(100vh - 1rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .comments-modal-card { height: calc(100vh - 1rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
}