* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    background: #06080c;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
}

.hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px;
    padding: 70px 30px 40px;
}

.network-visual {
    position: relative;
    width: 520px;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand {
    position: relative;
    z-index: 2;
    text-align: center;
}

.brand h1 {
    margin: 0;
    font-size: 3.5rem;
    letter-spacing: 4px;
}

.brand p {
    margin-top: 12px;
    color: #aeb6c2;
    letter-spacing: 1px;
}

.orbit {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
}

.orbit-one {
    width: 500px;
    height: 210px;
    animation: orbitSpin 18s linear infinite;
}

.orbit-two {
    width: 430px;
    height: 270px;
    animation: orbitSpin 24s linear infinite reverse;
}

.orbit-three {
    width: 350px;
    height: 310px;
    animation: orbitSpin 30s linear infinite;
}

.search-area {
    display: flex;
    width: min(620px, 100%);
}

.search-area input {
    flex: 1;
    padding: 16px 18px;
    border: 1px solid #303744;
    border-radius: 0;
    background: #10141b;
    color: white;
    font-size: 1rem;
    outline: none;
}

.search-area input:focus {
    border-color: #8aa8ff;
}

.search-area button {
    padding: 16px 28px;
    border: none;
    border-radius: 0 10px 10px 0;
    background: white;
    color: #06080c;
    font-size: 1rem;
    cursor: pointer;
}

.search-area button:hover {
    opacity: 0.85;
}
@keyframes orbitSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
@media (max-width: 500px) {
    .network-visual {
        width: 320px;
        height: 280px;
    }

    .brand h1 {
        font-size: 2.4rem;
    }

    .orbit-one {
        width: 310px;
        height: 150px;
    }

    .orbit-two {
        width: 275px;
        height: 210px;
    }

    .orbit-three {
        width: 230px;
        height: 250px;
    }
}
.search-area {
    display: flex;
    flex-direction: row;
    width: min(620px, 100%);
}

.search-area select {
    padding: 16px 14px;
    border: 1px solid #303744;
    border-right: none;
    border-radius: 10px 0 0 10px;
    background: #10141b;
    color: white;
    font-size: 1rem;
    outline: none;
    cursor: pointer;
}
.search-area input {
    flex: 1;
    padding: 16px 18px;
    border: 1px solid #303744;
    border-radius: 0;
    background: #10141b;
    color: white;
    font-size: 1rem;
    outline: none;
}
.search-area button {
    padding: 16px 28px;
    border: none;
    border-radius: 0 10px 10px 0;
    background: white;
    color: #06080c;
    font-size: 1rem;
    cursor: pointer;
}
.detail-row {
    grid-template-columns: 1fr;
    gap: 8px;
}
.details-page {
    width: min(900px, 100%);
    margin: 0 auto;
    padding: 40px 24px;
}

.details-page a {
    color: #aeb6c2;
    text-decoration: none;
}

.details-page a:hover {
    color: white;
}

.details-page h1 {
    margin: 40px 0 24px;
    font-size: 2.5rem;
}

.details-card {
    background: #10141b;
    border: 1px solid #303744;
    border-radius: 14px;
    overflow: hidden;
}

.detail-row {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 24px;
    padding: 20px 24px;
    border-bottom: 1px solid #242a35;
}

.detail-row:last-child {
    border-bottom: none;
}

.detail-label {
    color: #aeb6c2;
}

.status-badge {
    width: fit-content;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(77, 214, 127, 0.15);
    color: #7ee2a2;
    font-weight: bold;
}

.anchor-verification {
    font-weight: 700;
}

.anchor-verification-verified {
    color: #7ee2a2;
}

.anchor-verification-unsigned,
.anchor-verification-unknown {
    color: #aeb6c2;
}

.anchor-verification-invalid {
    color: #ff7b7b;
}

.anchor-verification-encrypted {
    color: #e7b45a;
}

.anchor-verification-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 8px;
    color: #8e99a8;
    font-size: 0.75rem;
}

.anchor-verification-counts b {
    color: inherit;
}



/* ==========================
   Network Overview
========================== */

.network-overview {
    max-width: 1200px;
    margin: 60px auto;
    padding: 0 20px;

    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.stat-card {
    background: #10141b;
    border: 1px solid #252d3a;
    border-radius: 14px;
    padding: 25px;
    transition: 0.3s;
}

.stat-card:hover {
    border-color: #3fa9ff;
    transform: translateY(-4px);
}

.stat-label {
    display: block;
    color: #8f98a8;
    font-size: .9rem;
    margin-bottom: 12px;
}

.stat-value {
    font-size: 1.8rem;
    color: white;
}



/* ==========================
   Activity Section
========================== */

.activity-section {
    max-width: 1200px;
    margin: 50px auto 80px;
    padding: 0 20px;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.activity-panel {
    background: #10141b;
    border: 1px solid #252d3a;
    border-radius: 14px;
    overflow: hidden;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 18px 24px;

    border-bottom: 1px solid #252d3a;
}

.panel-header h2 {
    font-size: 1.1rem;
    color: white;
}

.panel-header a {
    color: #3fa9ff;
    text-decoration: none;
    font-size: .9rem;
}

.activity-row {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 18px 24px;

    border-bottom: 1px solid #242a35;
}

.activity-row:last-child {
    border-bottom: none;
}

.activity-row strong {
    display: block;
    color: white;
    margin-bottom: 4px;
}

.activity-row span {
    color: #8f98a8;
    font-size: .9rem;
}
.block-page {
    display: flex;
    justify-content: center;
    padding: 60px 20px;
}

.block-card {
    width: 100%;
    max-width: 900px;

   background: var(--surface-background);
   border: 1px solid var(--border-color);
   color: var(--primary-text);

    border-radius: 16px;
    padding: 32px;
}

.block-card h1 {
    margin-bottom: 30px;
    color: var(--primary-text);
}
.details-grid {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 18px 24px;
    margin-top: 30px;
}
.detail-label {
    color: var(--secondary-text);
    font-weight: 600;
}

.detail-value {
    color: var(--primary-text);
    word-break: break-all;
}
.back-link {
    display: inline-block;
    margin-bottom: 24px;

    color: var(--secondary-text);

    text-decoration: none;

    transition: color 0.2s ease;
}

.back-link:hover {
    color: white;
}
.section-title {
    margin-top: 40px;
    margin-bottom: 20px;

    font-size: 1.4rem;
}

.operation-card {
    background: #161c28;

    border: 1px solid #242d3d;

    border-radius: 12px;

    padding: 20px;

    margin-bottom: 18px;
}

.operation-card h3 {
    margin-top: 0;
    margin-bottom: 18px;
}
.address-link {

    color: #5da8ff;

    text-decoration: none;

    word-break: break-all;
}

.address-link:hover {

    text-decoration: underline;
}
.detail-row span:last-child {
    overflow-wrap: anywhere;
    word-break: break-word;
    text-align: right;
}
.transactions-section {
    margin-top: 32px;
}

#transactionsList {
    display: flex;
    flex-direction: column;
}

.transaction-row {
    padding: 16px 20px;
    border-bottom: 1px solid #26303d;
    cursor: pointer;
}

.transaction-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.transaction-row div {
    overflow-wrap: anywhere;
}

.transaction-row div:nth-child(2) {
    margin: 6px 0;
    color: #9aa8bd;
    font-size: 0.9rem;
}
.latest-activity-panel {
    max-width: 1200px;
    margin: 48px auto;
    border: 1px solid #26303d;
    border-radius: 14px;
    overflow: hidden;
    background: #111720;
}

.activity-table-header,
.activity-row {
    display: grid;
    grid-template-columns:
        1.1fr
        0.8fr
        1fr
        1.4fr
        1.4fr
        1fr;
    gap: 20px;
    align-items: center;
}

.activity-table-header {
    padding: 16px 20px;
    border-top: 1px solid #26303d;
    border-bottom: 1px solid #26303d;
    color: #8fa0b8;
    font-size: 0.85rem;
}

#latestActivityList .activity-row {
    padding: 18px 20px;
    border-bottom: 1px solid #26303d;
    cursor: pointer;
}

#latestActivityList .activity-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.activity-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.activity-table-header span:last-child,
.activity-row span:last-child {
    text-align: right;
}
.main-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 28px;
    padding: 18px 24px;
    border-bottom: 1px solid #26303d;
    background: #0d121a;
}

.main-nav a {
    color: #9aa8bd;
    text-decoration: none;
    font-size: 0.9rem;
    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.main-nav a:hover {
    color: #ffffff;
    transform: translateY(-1px);
}

.main-nav a.active {
    color: #ffffff;
    font-weight: 600;
}
.pagination-controls {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    border-top: 1px solid #3a4658;
}

.pagination-controls button {
    padding: 9px 14px;
    border: 1px solid #3a4658;
    border-radius: 8px;
    background: #182131;
    color: #ffffff;
    cursor: pointer;
    font: inherit;
}

.pagination-controls button:hover:not(:disabled) {
    background: #223049;
}

.pagination-controls button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

#pageNumber {
    color: #a9b6c9;
    font-size: 0.9rem;
}
.blocks-table-header,
#blocksPageList .activity-row {
    display: grid;
    grid-template-columns:
        1.1fr
        0.8fr
        0.9fr
        1.5fr
        0.8fr;
    gap: 20px;
    align-items: center;
}

.blocks-table-header {
    padding: 16px 20px;
    border-top: 1px solid #3a4658;
    border-bottom: 1px solid #3a4658;
    color: #9aa8bd;
    font-size: 0.85rem;
}

#blocksPageList .activity-row {
    padding: 18px 20px;
    border-bottom: 1px solid #3a4658;
}

#blocksPageList .activity-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

#blocksPageList .activity-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.addresses-table-header,
#addressesPageList .address-row {
    display: grid;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(140px, 0.8fr)
        minmax(100px, 0.5fr);
    gap: 20px;
    align-items: center;
}

.addresses-table-header {
    padding: 16px 20px;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    color: var(--secondary-text);
    font-size: 0.85rem;
}

#addressesPageList .address-row {
    padding: 18px 20px;
    border-bottom: 1px solid var(--border-color);
    cursor: pointer;
}

#addressesPageList .address-row:hover {
    background: var(--row-hover);
}

#addressesPageList .address-row span {
    min-width: 0;
    overflow-wrap: anywhere;
}
.analytics-list {
    display: flex;
    flex-direction: column;
}

.analytics-row {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 14px 18px;

    border-bottom: 1px solid rgba(255,255,255,.05);
}

.analytics-row:last-child {
    border-bottom: none;
}

.analytics-row a {
    color: #6ca9ff;
    text-decoration: none;
}

.analytics-row a:hover {
    color: white;
}

.analytics-row span:last-child {
    color: #9ea8b5;
}
.operation-analytics-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) 3fr auto;
    gap: 16px;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.operation-bar-track {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
}

.operation-bar-fill {
    height: 100%;
    border-radius: inherit;
    background: #5aa9ff;
}
.growth-chart {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    min-height: 260px;
    padding: 24px;
    overflow-x: auto;
}

.growth-column {
    display: grid;
    grid-template-rows: 24px 180px auto;
    gap: 8px;
    min-width: 56px;
    text-align: center;
}

.growth-bar-area {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 180px;
}

.growth-bar {
    width: 24px;
    min-height: 3px;
    border-radius: 5px 5px 0 0;
    background: #5aa9ff;
}

.growth-value,
.growth-label {
    color: #9ea8b5;
    font-size: 0.8rem;
}
.largest-transfer-row {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    cursor: pointer;
}

.largest-transfer-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.largest-transfer-row > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.largest-transfer-row > div:last-child {
    align-items: flex-end;
    color: #9ea8b5;
}

.largest-transfer-row span {
    color: #9ea8b5;
    font-size: 0.85rem;
}
.growth-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.growth-card {
    background: #141922;
    border: 1px solid #273246;
    border-radius: 12px;
    padding: 20px;
}

.growth-label {
    display: block;
    color: #94a3b8;
    font-size: 14px;
    margin-bottom: 10px;
}

.growth-card strong {
    display: block;
    color: white;
    font-size: 28px;
    font-weight: 700;
}
#whaleList {
    display: flex;
    flex-direction: column;
}

.whale-row {
    display: grid;
   grid-template-columns:
    60px
    minmax(220px, 1fr)
    40px
    minmax(220px, 1fr)
    auto;
    gap: 18px;
    align-items: center;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.whale-row:last-child {
    border-bottom: none;
}

.whale-row:hover {
    background: rgba(255, 255, 255, 0.03);
}

.whale-rank {
    color: #9ea8b5;
    font-weight: 700;
}

.whale-row a {
    color: #6ca9ff;
    text-decoration: none;
}

.whale-row strong {
    color: #ffffff;
}
#richList .whale-row {
    color: var(--primary-text);
}

#richList .whale-rank {
    color: var(--primary-text);
}

#richList strong {
    color: var(--primary-text);
}

#richList a {
    color: var(--link-color);
}
/* Analytics light/dark theme text */

.analytics-card,
.analytics-card strong,
.analytics-card span,
.analytics-card p {
    color: var(--primary-text);
}

.analytics-section,
.analytics-section strong,
.analytics-section span,
.analytics-section p {
    color: var(--primary-text);
}

.recipient-row,
.recipient-row strong,
.recipient-row span {
    color: var(--primary-text);
}

.operation-row,
.operation-row strong,
.operation-row span {
    color: var(--primary-text);
}

.whale-row,
.whale-row strong,
.whale-row span {
    color: var(--primary-text);
}

.analytics-card a,
.analytics-section a,
.recipient-row a,
.operation-row a,
.whale-row a {
    color: var(--link-color);
}
:root {
    color-scheme: dark;

    --page-background: #000000;
    --surface-background: #080808;
    --surface-secondary: #111111;
    --border-color: #2a2a2a;

    --primary-text: #ffffff;
    --secondary-text: #b8b8b8;
    --link-color: #5aa9ff;

    --row-hover: rgba(255, 255, 255, 0.06);
}

html[data-theme="light"] {
    color-scheme: light;

    --page-background: #000000;
    --surface-background: #f8fafc;
    --surface-secondary: #e4ebf5;
    --border-color: #c9d3e2;

    --primary-text: #172033;
    --secondary-text: #5b6980;
    --link-color: #2d78c8;

    --row-hover: rgba(45,120,200,.08);
}


html[data-theme="light"] {
    color-scheme: light;

    --page-background: #f4f7fb;
    --surface-background: #ffffff;
    --surface-secondary: #eef3f9;
    --border-color: #ccd6e3;

    --primary-text: #172033;
    --secondary-text: #586a84;
    --link-color: #1769c2;

    --row-hover: rgba(23, 105, 194, 0.07);
}

body {
    background: var(--page-background);
    color: var(--primary-text);
}

.main-nav,
.block-card,
.latest-activity-panel,
.analytics-panel,
.stat-card,
.growth-card,
.operation-card,
.transaction-card,
.address-card {
   background: var(--surface-background);
    border-color: var(--border-color);
    color: var(--primary-text);
}
.activity-table,
.activity-table-header,
.activity-row {
    background: var(--surface-secondary);
    border-color: var(--border-color);
    color: var(--primary-text);
}
.main-nav a,
.detail-value,
.analytics-row,
.transaction-row,
.activity-row,
.whale-row {
    color: var(--primary-text);
}

.stat-label,
.growth-label,
.detail-label,
.main-nav a:not(.active) {
    color: var(--secondary-text);
}

a {
    color: var(--link-color);
}

.analytics-row:hover,
.transaction-row:hover,
.activity-row:hover,
.whale-row:hover,
.largest-transfer-row:hover {
    background: var(--row-hover);
}

.theme-toggle {
    position: absolute;
    top: 10px;
    right: 25px;

    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 7px 12px;

    background: var(--surface-secondary);
    color: var(--primary-text);

    font: inherit;
    cursor: pointer;
}

.theme-toggle:hover {
    background: var(--row-hover);
}
.main-nav {
    position: relative;
}

.theme-toggle {
    position: absolute;
    top: 10px;
    right: 25px;
}
.main-nav a.active {
    color: var(--primary-text);
    font-weight: 400;
}
.detail-value a {
    color: #66c2ff;
    text-decoration: none;
    word-break: break-all;
}

.detail-value a:hover {
    text-decoration: underline;
}
.home-dashboard {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.home-dashboard > .stat-card {
    min-width: 0;
}

.home-dashboard > .latest-activity-panel {
    grid-column: 1 / -1;
    margin-top: 28px;
}
html[data-theme="light"] .analytics-panel,
html[data-theme="light"] .analytics-panel *,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .stat-card *,
html[data-theme="light"] .growth-card,
html[data-theme="light"] .growth-card *,
html[data-theme="light"] .analytics-list,
html[data-theme="light"] .analytics-list * {
    color: #172033 !important;
}

html[data-theme="light"] .analytics-panel a,
html[data-theme="light"] .analytics-list a,
html[data-theme="light"] .whale-row a,
html[data-theme="light"] #richList a {
    color: #1769c2 !important;
}
.recent-kta-trade-row {
    display: grid;
    grid-template-columns:
    60px
    150px
    minmax(180px, 1fr)
    minmax(180px, 1fr)
    140px
    100px;
    gap: 16px;
    align-items: center;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.recent-kta-trade-row:last-child {
    border-bottom: none;
}

.recent-kta-trade-row a {
    color: var(--link-color);
    text-decoration: none;
}

.recent-kta-trade-row a:hover {
    text-decoration: underline;
}

.trade-rank {
    font-weight: 700;
    color: var(--primary-text);
}
.asset-list-header,
.asset-list-row {
    display: grid;
   grid-template-columns: 120px 180px minmax(260px, 1fr) minmax(220px, 320px);
    gap: 24px;
    align-items: center;
    padding: 14px 18px;
}

.asset-list-header {
    font-weight: 700;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.asset-list-row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.asset-symbol {
    font-weight: 700;
}

.asset-address {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.asset-supply {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
}
.asset-detail-page {
    padding: 32px;
}

.asset-detail-header {
    margin-bottom: 24px;
}

.asset-detail-header h1 {
    margin-bottom: 8px;
}

.asset-detail-header p {
    opacity: 0.75;
}

.asset-detail-row {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 24px;
    padding: 18px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    align-items: center;
}

.asset-detail-row span {
    font-weight: 600;
}

.asset-detail-row strong {
    overflow-wrap: anywhere;
}
.asset-transfers {
    margin-top: 28px;
}

.asset-transfers h2 {
    margin-bottom: 18px;
}

.asset-transfer-header,
.asset-transfer-row {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 1fr 140px;
    gap: 20px;
    align-items: center;
    padding: 14px 18px;
}

.asset-transfer-header {
    font-weight: 600;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.asset-transfer-row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.asset-transfer-row a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================
   Homepage Redesign
========================== */

.home-page {
    background: #f3f5f7;
    color: #172033;
}

.home-header {
    display: grid;
    grid-template-columns: auto minmax(320px, 1fr) auto;
    gap: 20px;
    align-items: center;
    padding: 18px max(24px, calc((100vw - 1320px) / 2));
    background: #ffffff;
    border-bottom: 1px solid #dfe4ea;
}

.home-brand {
    display: inline-flex;
    align-items: center;
    gap: 0;
    color: #172033;
    font-size: 1.45rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.home-brand-mark {
    display: block;
    width: 2rem;
    height: 1.5rem;
    flex: 0 0 auto;
    margin-right: 0.55rem;
    overflow: visible;
}

.home-brand-mark .brand-eye-outline,
.home-brand-mark .brand-eye-k {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.home-brand-mark .brand-eye-outline {
    stroke-width: 3;
}

.home-brand-mark .brand-eye-k {
    stroke-width: 2.5;
}

.home-brand-mark .brand-eye-pupil {
    fill: #268cf0;
}

.home-brand span {
    color: #1769c2;
}

.home-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
}

.home-search select,
.home-search input,
.home-search button,
.header-control {
    min-height: 44px;
    border: 1px solid #cbd4df;
    background: #ffffff;
    color: #172033;
    font: inherit;
}

.home-search select {
    padding: 0 12px;
    border-radius: 10px 0 0 10px;
}

.home-search input {
    min-width: 0;
    padding: 0 15px;
    border-left: 0;
}

.home-search button {
    padding: 0 22px;
    border-left: 0;
    border-radius: 0 10px 10px 0;
    background: #1769c2;
    border-color: #1769c2;
    color: #ffffff;
    cursor: pointer;
}

.home-header-actions {
    display: flex;
    gap: 8px;
}

.header-control,
.home-page .theme-toggle {
    position: static;
    display: grid;
    place-items: center;
    min-width: 44px;
    padding: 0 12px;
    border-radius: 9px;
    cursor: pointer;
}

.home-navigation {
    display: flex;
    justify-content: center;
    gap: 28px;
    padding: 12px 20px;
    background: #ffffff;
    border-bottom: 1px solid #dfe4ea;
}

.home-navigation a {
    color: #586a80;
    text-decoration: none;
}

.home-navigation a:hover,
.home-navigation a.active {
    color: #1769c2;
}

.home-shell {
    width: min(1320px, calc(100% - 40px));
    margin: 0 auto;
    padding: 24px 0 50px;
}

.home-top-grid,
.home-activity-grid {
    display: grid;
    gap: 20px;
}

.home-top-grid {
    grid-template-columns: minmax(0, 1.75fr) minmax(290px, 1fr);
}

.home-activity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 20px;
}

.home-panel {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #dfe4ea;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(28, 44, 68, 0.05);
}

.home-panel-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 18px 20px;
    border-bottom: 1px solid #e6eaf0;
}

.home-panel-header h1,
.home-panel-header h2,
.home-panel-header p {
    margin: 0;
}

.home-panel-header h1,
.home-panel-header h2 {
    color: #172033;
    font-size: 1.15rem;
}

.home-eyebrow {
    margin-bottom: 5px !important;
    color: #6b788a;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.chart-ranges {
    display: flex;
    gap: 5px;
    color: #728096;
    font-size: 0.78rem;
}

.chart-ranges button {
    padding: 5px 7px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
}

.chart-ranges button:hover {
    color: var(--link-color, #1769c2);
}

.chart-ranges button:focus-visible {
    outline: 2px solid var(--link-color, #1769c2);
    outline-offset: 2px;
}

.chart-ranges button.active {
    background: #e7f1fc;
    color: #1769c2;
}

.market-placeholder {
    padding: 20px 20px 10px;
}

.market-placeholder strong {
    display: block;
    margin-bottom: 5px;
    color: #172033;
}

.market-placeholder p {
    margin: 0;
    color: #68778a;
    font-size: 0.9rem;
}

.market-placeholder svg {
    display: block;
    width: 100%;
    height: 210px;
    margin-top: 8px;
}

.market-placeholder line {
    stroke: #e6ebf1;
    stroke-width: 1;
}

.market-placeholder path {
    fill: none;
    stroke: #7aaee6;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.market-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid #e6eaf0;
}

.market-facts div {
    padding: 14px 18px;
    border-right: 1px solid #e6eaf0;
}

.market-facts div:last-child {
    border-right: 0;
}

.market-facts span,
.snapshot-list span {
    display: block;
    margin-bottom: 6px;
    color: #6b788a;
    font-size: 0.78rem;
}

.market-facts strong,
.snapshot-list strong {
    color: #172033;
    font-size: 1.05rem;
}

.snapshot-list {
    padding: 5px 20px;
}

.snapshot-list div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    padding: 16px 0;
    border-bottom: 1px solid #e8ecf1;
}

.snapshot-list div:last-child {
    border-bottom: 0;
}

.snapshot-list span {
    margin: 0;
}

.snapshot-note {
    margin: 0;
    padding: 10px 20px 18px;
    color: #6b788a;
    font-size: 0.82rem;
    line-height: 1.5;
}

.home-panel-link {
    display: block;
    padding: 14px 18px;
    background: #fafbfd;
    border-top: 1px solid #e6eaf0;
    color: #1769c2;
    text-align: center;
    text-decoration: none;
}

.home-preview-list {
    min-height: 390px;
}

.home-preview-row {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 65px;
    padding: 11px 18px;
    border-bottom: 1px solid #e9edf2;
    color: #172033;
    text-decoration: none;
}

.home-preview-row:hover {
    background: #f7fafe;
}

.preview-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: #eef4fa;
    color: #1769c2;
    font-size: 1.2rem;
}

.preview-main {
    min-width: 0;
}

.preview-main strong,
.preview-main small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.preview-main strong {
    color: #1769c2;
    font-weight: 600;
}

.preview-main small {
    margin-top: 4px;
    color: #718096;
}

.preview-value {
    color: #34445a;
    text-align: right;
    white-space: nowrap;
}

.home-loading,
.home-error {
    margin: 0;
    padding: 22px;
    color: #6b788a;
}

html[data-theme="dark"] .home-page {
    background: #111827;
    color: #edf3fb;
}

html[data-theme="dark"] .home-header,
html[data-theme="dark"] .home-navigation,
html[data-theme="dark"] .home-panel,
html[data-theme="dark"] .home-search select,
html[data-theme="dark"] .home-search input,
html[data-theme="dark"] .header-control {
    background: #192538;
    border-color: #34445b;
    color: #edf3fb;
}

html[data-theme="dark"] .home-brand,
html[data-theme="dark"] .home-panel-header h1,
html[data-theme="dark"] .home-panel-header h2,
html[data-theme="dark"] .market-placeholder strong,
html[data-theme="dark"] .market-facts strong,
html[data-theme="dark"] .snapshot-list strong,
html[data-theme="dark"] .home-preview-row {
    color: #edf3fb;
}

html[data-theme="dark"] .home-navigation,
html[data-theme="dark"] .home-panel-header,
html[data-theme="dark"] .market-facts,
html[data-theme="dark"] .market-facts div,
html[data-theme="dark"] .snapshot-list div,
html[data-theme="dark"] .home-preview-row,
html[data-theme="dark"] .home-panel-link {
    border-color: #304158;
}

html[data-theme="dark"] .home-panel-link {
    background: #152033;
}

html[data-theme="dark"] .home-preview-row:hover {
    background: #20304a;
}

html[data-theme="dark"] .preview-icon,
html[data-theme="dark"] .chart-ranges button.active {
    background: #243a58;
}

html[data-theme="dark"] .preview-value {
    color: #c6d3e4;
}

@media (max-width: 900px) {
    .home-header {
        grid-template-columns: 1fr auto;
    }

    .home-search {
        grid-column: 1 / -1;
        grid-row: 2;
        max-width: none;
    }

    .home-top-grid,
    .home-activity-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .home-navigation {
        justify-content: flex-start;
        gap: 18px;
        overflow-x: auto;
    }

    .home-shell {
        width: min(100% - 24px, 1320px);
        padding-top: 12px;
    }

    .home-search {
        grid-template-columns: 1fr auto;
    }

    .home-search select {
        grid-column: 1 / -1;
        border-right: 1px solid #cbd4df;
        border-radius: 9px 9px 0 0;
    }

    .home-search input {
        border-left: 1px solid #cbd4df;
        border-radius: 0 0 0 9px;
    }

    .home-search button {
        border-radius: 0 0 9px 0;
    }

    .market-facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .market-facts div:nth-child(2) {
        border-right: 0;
    }

    .market-facts div:nth-child(-n + 2) {
        border-bottom: 1px solid #e6eaf0;
    }

    .home-preview-row {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .preview-value {
        grid-column: 2;
        text-align: left;
    }
}


/* ==========================
   KeetaView Theme System
========================== */

:root,
html[data-theme="light"] {
    color-scheme: light;

    --page-background: #edf1f5;
    --surface-background: #ffffff;
    --surface-secondary: #f6f8fb;
    --border-color: #cbd4df;

    --primary-text: #172033;
    --secondary-text: #53647a;
    --link-color: #1769c2;

    --row-hover: #eef5fc;
    --positive-color: #078a71;
    --negative-color: #c94b5f;
    --warning-color: #a46800;

    --panel-shadow: 0 8px 24px rgba(28, 44, 68, 0.07);
}

html[data-theme="clean"] {
    color-scheme: light;

    --page-background: #ffffff;
    --surface-background: #ffffff;
    --surface-secondary: #ffffff;
    --border-color: #d7dde5;

    --primary-text: #111827;
    --secondary-text: #4f5f73;
    --link-color: #0b67c2;

    --row-hover: #f5f8fb;
    --positive-color: #087b67;
    --negative-color: #bf3f54;
    --warning-color: #925d00;

    --panel-shadow: none;
}

html[data-theme="dim"] {
    color-scheme: dark;

    --page-background: #2d323a;
    --surface-background: #383f49;
    --surface-secondary: #424a56;
    --border-color: #596371;

    --primary-text: #f0f3f7;
    --secondary-text: #c3cbd5;
    --link-color: #82bdf5;

    --row-hover: #47515f;
    --positive-color: #48d6b5;
    --negative-color: #ff7b8f;
    --warning-color: #f0c36f;

    --panel-shadow: 0 10px 26px rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] {
    color-scheme: dark;

    --page-background: #101827;
    --surface-background: #182438;
    --surface-secondary: #202e44;
    --border-color: #3b4b62;

    --primary-text: #edf3fb;
    --secondary-text: #b4c2d4;
    --link-color: #73b8ff;

    --row-hover: #24354f;
    --positive-color: #35d5b1;
    --negative-color: #ff7186;
    --warning-color: #f1bd61;

    --panel-shadow: 0 10px 28px rgba(0, 0, 0, 0.22);
}

body,
.home-page {
    background: var(--page-background);
    color: var(--primary-text);
}

.main-nav,
.home-header,
.home-navigation,
.home-panel,
.block-card,
.details-card,
.latest-activity-panel,
.analytics-panel,
.stat-card,
.growth-card,
.operation-card,
.transaction-card,
.address-card,
.asset-detail-card,
.asset-transfers {
    background: var(--surface-background);
    border-color: var(--border-color);
    color: var(--primary-text);
    box-shadow: var(--panel-shadow);
}

.activity-table,
.activity-table-header,
.blocks-table,
.blocks-table-header,
.transactions-table,
.transactions-table-header,
.asset-list-header,
.asset-list-row,
.asset-transfer-header,
.asset-transfer-row,
.analytics-list,
.pagination-controls {
    background: var(--surface-background);
    border-color: var(--border-color);
    color: var(--primary-text);
}

.activity-row,
.transaction-row,
.analytics-row,
.whale-row,
.largest-transfer-row,
.recent-kta-trade-row,
.home-preview-row {
    border-color: var(--border-color);
    color: var(--primary-text);
}

.activity-row:hover,
.transaction-row:hover,
.analytics-row:hover,
.whale-row:hover,
.largest-transfer-row:hover,
.recent-kta-trade-row:hover,
.home-preview-row:hover {
    background: var(--row-hover);
}

h1,
h2,
h3,
strong,
.detail-value,
.stat-value,
.preview-value,
.home-panel-header h1,
.home-panel-header h2,
.market-placeholder strong,
.market-facts strong,
.snapshot-list strong,
.home-preview-row {
    color: var(--primary-text);
}

p,
small,
.stat-label,
.detail-label,
.growth-label,
.home-eyebrow,
.market-placeholder p,
.market-facts span,
.snapshot-list span,
.snapshot-note,
.preview-main small,
.main-nav a:not(.active),
.home-navigation a:not(.active) {
    color: var(--secondary-text);
}

a,
.main-nav a.active,
.home-navigation a.active,
.home-navigation a:hover,
.preview-main strong,
.home-panel-link {
    color: var(--link-color);
}

input,
select,
button,
.home-search select,
.home-search input,
.header-control,
.theme-toggle,
.pagination-controls button {
    background: var(--surface-background);
    border-color: var(--border-color);
    color: var(--primary-text);
}

.home-search button {
    background: var(--link-color);
    border-color: var(--link-color);
    color: #ffffff;
}

.home-panel,
.home-header,
.home-navigation,
.home-panel-header,
.home-panel-link,
.home-preview-row,
.market-facts,
.market-facts div,
.snapshot-list div {
    border-color: var(--border-color);
}

.home-panel-link {
    background: var(--surface-secondary);
}

.preview-icon,
.chart-ranges button.active {
    background: var(--surface-secondary);
    color: var(--link-color);
}

.market-placeholder line {
    stroke: var(--border-color);
}

.market-placeholder path {
    stroke: var(--link-color);
}

html[data-theme="clean"] .home-panel {
    box-shadow: none;
}

html[data-theme="dim"] .home-search button {
    color: #172033;
    background: #82bdf5;
    border-color: #82bdf5;
}

html[data-theme="dark"] .home-search button {
    color: #101827;
    background: #73b8ff;
    border-color: #73b8ff;
}

html[data-theme="dark"] .home-search input::placeholder {
    color: #8798ae;
}

.status-badge {
    color: var(--positive-color);
}

.home-error,
.text-error {
    color: var(--negative-color);
}

@media (max-width: 640px) {
    .home-search select,
    .home-search input {
        border-color: var(--border-color);
    }
}


/* ==========================
   Final Keeta Appearance
========================== */

:root,
html[data-theme="keeta"] {
    color-scheme: light;

    --page-background: #ffffff;
    --surface-background: #ffffff;
    --surface-secondary: #f8f7f6;
    --border-color: #d8d3cf;

    --primary-text: #282529;
    --secondary-text: #655f64;
    --link-color: #2787df;

    --row-hover: #f5f4f3;
    --positive-color: #16846f;
    --negative-color: #bc4f60;
    --warning-color: #9a6413;

    --panel-shadow: 0 8px 22px rgba(55, 49, 52, 0.08);

    --keeta-graphite: #555152;
    --keeta-graphite-soft: #656061;
    --keeta-cream: #ffd5a6;
}

html[data-theme="clean"] {
    --page-background: #ffffff;
    --surface-background: #ffffff;
    --surface-secondary: #ffffff;
    --border-color: #dedede;

    --primary-text: #171717;
    --secondary-text: #555f6d;
    --link-color: #1676cf;

    --row-hover: #f7f7f7;
    --panel-shadow: none;
}

html[data-theme="keeta"] .home-header,
html[data-theme="keeta"] .home-navigation,
html[data-theme="keeta"] .main-nav {
    background: var(--keeta-graphite);
    border-color: #716c6d;
    box-shadow: none;
}

html[data-theme="keeta"] .home-brand,
html[data-theme="keeta"] .home-navigation a,
html[data-theme="keeta"] .main-nav a,
html[data-theme="keeta"] .main-nav a:not(.active) {
    color: #ffffff;
}

html[data-theme="keeta"] .home-brand span,
html[data-theme="keeta"] .home-navigation a.active,
html[data-theme="keeta"] .home-navigation a:hover,
html[data-theme="keeta"] .main-nav a.active {
    color: var(--keeta-cream);
}

html[data-theme="keeta"] .home-search select,
html[data-theme="keeta"] .home-search input,
html[data-theme="keeta"] .header-control,
html[data-theme="keeta"] .theme-toggle,
html[data-theme="keeta"] .main-nav .theme-toggle {
    background: var(--keeta-graphite-soft);
    border-color: #7b7577;
    color: #ffffff;
}

html[data-theme="keeta"] .home-search input::placeholder {
    color: #e1dcdd;
}

html[data-theme="keeta"] .home-search button {
    background: var(--keeta-cream);
    border-color: var(--keeta-cream);
    color: #513424;
}

html[data-theme="keeta"] .market-panel {
    background: var(--keeta-graphite);
    border-color: #716c6d;
}

html[data-theme="keeta"] .market-panel .home-panel-header,
html[data-theme="keeta"] .market-panel .market-facts,
html[data-theme="keeta"] .market-panel .market-facts div {
    border-color: #716c6d;
}

html[data-theme="keeta"] .market-panel h1,
html[data-theme="keeta"] .market-panel h2,
html[data-theme="keeta"] .market-panel strong {
    color: #ffffff;
}

html[data-theme="keeta"] .market-panel p,
html[data-theme="keeta"] .market-panel span,
html[data-theme="keeta"] .market-panel .home-eyebrow {
    color: #ded9da;
}

html[data-theme="keeta"] .market-panel .chart-ranges button.active {
    background: var(--keeta-cream);
    color: #513424;
}

html[data-theme="keeta"] .market-panel .market-placeholder line {
    stroke: #756f71;
}

html[data-theme="keeta"] .market-panel .market-placeholder path {
    stroke: var(--keeta-cream);
}

html[data-theme="clean"] .home-header,
html[data-theme="clean"] .home-navigation,
html[data-theme="clean"] .main-nav,
html[data-theme="clean"] .market-panel {
    background: #ffffff;
    border-color: var(--border-color);
    box-shadow: none;
}

html[data-theme="clean"] .home-brand,
html[data-theme="clean"] .home-navigation a,
html[data-theme="clean"] .main-nav a,
html[data-theme="clean"] .market-panel h1,
html[data-theme="clean"] .market-panel h2,
html[data-theme="clean"] .market-panel strong {
    color: var(--primary-text);
}

html[data-theme="clean"] .home-brand span,
html[data-theme="clean"] .home-navigation a.active,
html[data-theme="clean"] .home-navigation a:hover,
html[data-theme="clean"] .main-nav a.active {
    color: var(--link-color);
}

html[data-theme="clean"] .market-panel p,
html[data-theme="clean"] .market-panel span,
html[data-theme="clean"] .market-panel .home-eyebrow {
    color: var(--secondary-text);
}

html[data-theme="clean"] .market-panel .market-placeholder line {
    stroke: var(--border-color);
}

html[data-theme="clean"] .market-panel .market-placeholder path {
    stroke: var(--link-color);
}

html[data-theme="clean"] .home-panel {
    box-shadow: none;
}


/* ==========================
   Final Dark Mode Appearance
========================== */

:root,
html[data-theme="soft"] {
    color-scheme: light;

    --page-background: #eceff2;
    --surface-background: #ffffff;
    --surface-secondary: #f8f9fb;
    --border-color: #d4d9df;

    --primary-text: #1b2433;
    --secondary-text: #58687d;
    --link-color: #1676cf;

    --row-hover: #f3f7fb;
    --positive-color: #12836e;
    --negative-color: #bf4a5e;
    --warning-color: #986313;

    --panel-shadow: 0 7px 22px rgba(35, 49, 68, 0.07);
}

html[data-theme="soft"] .home-page,
html[data-theme="soft"] body {
    background: var(--page-background);
}

html[data-theme="soft"] .home-header,
html[data-theme="soft"] .home-navigation,
html[data-theme="soft"] .main-nav,
html[data-theme="soft"] .home-panel,
html[data-theme="soft"] .market-panel {
    background: #ffffff;
    border-color: var(--border-color);
    color: var(--primary-text);
}

html[data-theme="soft"] .home-brand,
html[data-theme="soft"] .home-navigation a,
html[data-theme="soft"] .main-nav a,
html[data-theme="soft"] .main-nav a:not(.active),
html[data-theme="soft"] .market-panel h1,
html[data-theme="soft"] .market-panel h2,
html[data-theme="soft"] .market-panel strong {
    color: var(--primary-text);
}

html[data-theme="soft"] .home-brand span,
html[data-theme="soft"] .home-navigation a.active,
html[data-theme="soft"] .home-navigation a:hover,
html[data-theme="soft"] .main-nav a.active {
    color: var(--link-color);
}

html[data-theme="soft"] .home-search select,
html[data-theme="soft"] .home-search input,
html[data-theme="soft"] .header-control,
html[data-theme="soft"] .theme-toggle,
html[data-theme="soft"] .main-nav .theme-toggle {
    background: #ffffff;
    border-color: var(--border-color);
    color: var(--primary-text);
}

html[data-theme="soft"] .home-search input::placeholder {
    color: #7b8798;
}

html[data-theme="soft"] .home-search button {
    background: var(--link-color);
    border-color: var(--link-color);
    color: #ffffff;
}

html[data-theme="soft"] .market-panel .home-panel-header,
html[data-theme="soft"] .market-panel .market-facts,
html[data-theme="soft"] .market-panel .market-facts div {
    border-color: var(--border-color);
}

html[data-theme="soft"] .market-panel p,
html[data-theme="soft"] .market-panel span,
html[data-theme="soft"] .market-panel .home-eyebrow {
    color: var(--secondary-text);
}

html[data-theme="soft"] .market-panel .chart-ranges button.active {
    background: #e8f2fc;
    color: var(--link-color);
}

html[data-theme="soft"] .market-panel .market-placeholder line {
    stroke: var(--border-color);
}

html[data-theme="soft"] .market-panel .market-placeholder path {
    stroke: var(--link-color);
}

html[data-theme="soft"] .home-panel {
    box-shadow: var(--panel-shadow);
}

html[data-theme="clean"] .home-page,
html[data-theme="clean"] body {
    background: #ffffff;
}


/* Monochrome homepage controls */

html[data-theme="soft"] .home-brand span,
html[data-theme="clean"] .home-brand span {
    color: var(--primary-text);
}

html[data-theme="soft"] .home-navigation a.active,
html[data-theme="soft"] .home-navigation a:hover,
html[data-theme="clean"] .home-navigation a.active,
html[data-theme="clean"] .home-navigation a:hover {
    color: var(--primary-text);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
}

html[data-theme="soft"] .home-search button,
html[data-theme="clean"] .home-search button {
    background: #1b2433;
    border-color: #1b2433;
    color: #ffffff;
}

html[data-theme="soft"] .home-search button:hover,
html[data-theme="clean"] .home-search button:hover {
    background: #000000;
    border-color: #000000;
}


/* ==========================
   KeetaView Detail Header
========================== */

.detail-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.detail-shell.block-page {
    display: block;
    width: min(100% - 40px, 1120px);
    margin: 0 auto;
    padding: 28px 0 64px;
}

.detail-back-link {
    display: inline-block;
    margin: 0 0 18px;
    color: var(--secondary-text);
    text-decoration: none;
}

.detail-back-link:hover {
    color: var(--primary-text);
}

.detail-shell .block-card {
    max-width: none;
    padding: 38px;
    border: 1px solid var(--border-color);
    box-shadow: var(--panel-shadow);
}

.detail-shell .block-card h1 {
    margin: 0 0 30px;
}

.detail-shell .details-grid {
    margin-top: 0;
}

.detail-shell .operation-card {
    background: var(--surface-secondary);
    border-color: var(--border-color);
    box-shadow: none;
    transition:
        background 0.2s ease,
        border-color 0.2s ease;
}

.detail-shell .operation-card:hover {
    background: var(--row-hover);
    border-color: #aeb7c2;
}

.detail-shell .address-link {
    color: var(--link-color);
}

@media (max-width: 700px) {
    .detail-shell.block-page {
        width: min(100% - 24px, 1120px);
        padding-top: 18px;
    }

    .detail-shell .block-card {
        padding: 24px 20px;
    }

    .detail-shell .details-grid {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .detail-shell .detail-value {
        margin-bottom: 12px;
    }
}


/* Block detail contrast refinement */

html[data-theme="soft"] .detail-page-body {
    background: #e1e5e9;
}

.detail-shell.block-page {
    width: min(100% - 40px, 1000px);
}

.detail-shell .block-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(32, 45, 62, 0.10);
}

.detail-shell .operation-card {
    background: #f8fafc;
    border: 1px solid #d2d8e0;
    border-radius: 12px;
    padding: 22px;
}

html[data-theme="clean"] .detail-shell .block-card {
    border-color: #d5d9de;
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.06);
}

html[data-theme="clean"] .detail-shell .operation-card {
    background: #ffffff;
}

html[data-theme="clean"] .detail-back-link {
    color: var(--link-color);
}

html[data-theme="clean"] .detail-back-link:hover {
    color: var(--primary-text);
}

/* Final Dark Mode canvas selection */

html[data-theme="soft"] {
    --page-background: #5a5a5a;
}

html[data-theme="soft"] body,
html[data-theme="soft"] .home-page,
html[data-theme="soft"] .detail-page-body {
    background: #5a5a5a;
}

html[data-theme="soft"] .detail-back-link {
    color: #f3f4f6;
}

html[data-theme="soft"] .detail-back-link:hover {
    color: #ffffff;
}


/* Dark Mode top navigation */

html[data-theme="soft"] .home-header,
html[data-theme="soft"] .home-navigation {
    background: #6a6a6a;
    border-color: #7a7a7a;
    box-shadow: none;
}

html[data-theme="soft"] .home-brand,
html[data-theme="soft"] .home-brand span,
html[data-theme="soft"] .home-navigation a,
html[data-theme="soft"] .home-navigation a:not(.active),
html[data-theme="soft"] .home-navigation a.active,
html[data-theme="soft"] .home-navigation a:hover {
    color: #ffffff;
}

html[data-theme="soft"] .home-search select,
html[data-theme="soft"] .home-search input,
html[data-theme="soft"] .header-control {
    background: #747474;
    border-color: #858585;
    color: #ffffff;
}

html[data-theme="soft"] .home-search input::placeholder {
    color: #e2e2e2;
}

html[data-theme="soft"] .home-search button {
    background: #1b2433;
    border-color: #1b2433;
    color: #ffffff;
}


/* Unified graphite top area */

html[data-theme="soft"] .home-header,
html[data-theme="soft"] .home-navigation,
html[data-theme="soft"] .home-search select,
html[data-theme="soft"] .home-search input,
html[data-theme="soft"] .home-search button,
html[data-theme="soft"] .header-control {
    background: #5a5a5a;
    border-color: #737373;
    color: #ffffff;
}

html[data-theme="soft"] .home-search button:hover {
    background: #4b4b4b;
    border-color: #4b4b4b;
}


/* Remove soft header divider lines */

html[data-theme="soft"] .home-header,
html[data-theme="soft"] .home-navigation {
    border-top: 0;
    border-bottom: 0;
}


/* Clean White top controls */

html[data-theme="clean"] .home-header,
html[data-theme="clean"] .home-navigation {
    border-top: 0;
    border-bottom: 0;
}

html[data-theme="clean"] .home-search select,
html[data-theme="clean"] .home-search input,
html[data-theme="clean"] .home-search button,
html[data-theme="clean"] .header-control {
    background: #ffffff;
    border-color: #d5d9de;
    color: #171717;
}

html[data-theme="clean"] .home-search input::placeholder {
    color: #7a8491;
}

html[data-theme="clean"] .home-search button:hover {
    background: #f2f3f5;
    border-color: #c8cdd3;
}


/* KeetaView transaction details */

.transaction-detail-shell.details-page {
    width: min(100% - 40px, 1000px);
    margin: 0 auto;
    padding: 28px 0 64px;
}

.transaction-detail-shell h1 {
    margin: 34px 0 24px;
    color: var(--primary-text);
}

.transaction-detail-shell .transaction-card {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(32, 45, 62, 0.10);
}

.transaction-detail-shell .detail-row {
    border-color: var(--border-color);
}

.transaction-detail-shell .detail-row > span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

.transaction-detail-shell a:not(.detail-back-link) {
    color: var(--link-color);
}

.anchor-detail-card {
    margin-top: 24px;
    overflow: hidden;
    background: var(--surface-background);
    border: 1px solid var(--border-color);
    border-radius: 16px;
}

.anchor-detail-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 24px;
    border-bottom: 1px solid var(--border-color);
}

.anchor-detail-heading h2 {
    margin: 4px 0 0;
    color: var(--primary-text);
}

.anchor-detail-eyebrow {
    color: var(--secondary-text);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.anchor-detail-card .anchor-verification {
    padding: 7px 11px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.82rem;
    white-space: nowrap;
}

.anchor-verification-summary,
.anchor-proof-note {
    margin: 0;
    padding: 18px 24px;
    color: var(--secondary-text);
    line-height: 1.6;
}

.anchor-verification-summary {
    border-bottom: 1px solid var(--border-color);
}

.anchor-proof-note {
    border-top: 1px solid var(--border-color);
    font-size: 0.82rem;
}

.anchor-detail-grid .detail-row,
.anchor-detail-card > [id^="anchor"] .detail-row {
    margin: 0;
}

.anchor-detail-card .detail-row > :last-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

html[data-theme="clean"] .transaction-detail-shell .transaction-card {
    border-color: #d5d9de;
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.06);
}

@media (max-width: 700px) {
    .transaction-detail-shell.details-page {
        width: min(100% - 24px, 1000px);
        padding-top: 18px;
    }

    .transaction-detail-shell .detail-row {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 18px 20px;
    }

    .transaction-detail-shell .detail-row > span:last-child {
        text-align: left;
    }

    .anchor-detail-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* KeetaView address details */

.address-detail-shell.address-page {
    display: block;
    width: min(100% - 40px, 1180px);
    margin: 0 auto;
    padding: 28px 0 64px;
}

.address-detail-shell .address-card {
    width: 100%;
    max-width: none;
    padding: 38px;
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(32, 45, 62, 0.10);
}

.address-detail-shell .address-card h1 {
    margin: 0 0 30px;
}

.address-detail-shell #balancesList {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}

.address-detail-shell #balancesList .operation-card {
    margin: 0;
    background: #f8fafc;
    border: 1px solid #d2d8e0;
    box-shadow: none;
}

.address-activity-scroll {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: 12px;
}

.address-detail-shell .activity-table {
    min-width: 900px;
    background: #ffffff;
}

.address-detail-shell .activity-table-header,
.address-detail-shell #addressActivityList .activity-row {
    border-color: var(--border-color);
}

.address-detail-shell #addressActivityList .activity-row:hover {
    background: var(--row-hover);
}

html[data-theme="clean"] .address-detail-shell .address-card {
    border-color: #d5d9de;
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.06);
}

html[data-theme="clean"] .address-detail-shell #balancesList .operation-card {
    background: #ffffff;
}

.address-detail-shell #addressAnchors {
    margin-top: 34px;
}

.address-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.address-section-heading .section-title,
.address-section-heading .home-eyebrow {
    margin: 0;
}

.address-anchor-list {
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 12px;
}

.address-anchor-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(130px, auto);
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border-color);
    color: inherit;
    text-decoration: none;
}

.address-anchor-row:last-child {
    border-bottom: 0;
}

.address-anchor-identity {
    min-width: 0;
}

.address-anchor-identity strong,
.address-anchor-identity small {
    display: block;
}

.address-anchor-identity strong {
    overflow: hidden;
    color: var(--link-color);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.address-anchor-identity small,
.address-anchor-relationships {
    color: var(--muted-text, #718096);
}

@media (max-width: 700px) {
    .address-anchor-row {
        grid-template-columns: 1fr auto;
    }

    .address-anchor-relationships {
        grid-column: 1 / -1;
    }
}

@media (max-width: 700px) {
    .address-detail-shell.address-page {
        width: min(100% - 24px, 1180px);
        padding-top: 18px;
    }

    .address-detail-shell .address-card {
        padding: 24px 20px;
    }

    .address-detail-shell .details-grid {
        grid-template-columns: 1fr;
        gap: 7px;
    }

    .address-detail-shell .detail-value {
        margin-bottom: 12px;
    }
}


/* Address detail readability refinement */

.address-detail-shell #balancesList {
    display: flex;
    flex-wrap: wrap;
}

.address-detail-shell #balancesList .operation-card {
    width: min(100%, 360px);
    padding: 22px;
    background: #f4f6f8;
    border: 1px solid #cbd2da;
}

.address-detail-shell .activity-table-header span {
    color: var(--secondary-text);
    font-weight: 600;
}

.address-detail-shell #addressActivityList .activity-row span {
    color: var(--primary-text);
}

.address-detail-shell #addressActivityList .activity-row span:nth-child(2) {
    color: var(--secondary-text);
}

.address-detail-shell #addressActivityList .activity-row a {
    color: #1676cf;
    font-weight: 600;
}

html[data-theme="clean"] .address-detail-shell #balancesList .operation-card {
    background: #ffffff;
    border-color: #d5d9de;
}


/* KeetaView asset details */

.asset-page-shell.asset-detail-page {
    width: min(100% - 40px, 1180px);
    margin: 0 auto;
    padding: 28px 0 64px;
}

.asset-page-shell .asset-detail-card {
    padding: 38px;
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(32, 45, 62, 0.10);
}

.asset-page-shell .asset-detail-header {
    margin-bottom: 24px;
}

.asset-page-shell .asset-detail-header h1 {
    margin: 6px 0 8px;
    color: var(--primary-text);
}

.asset-page-shell .asset-detail-header > p:last-child {
    margin: 0;
    color: var(--secondary-text);
}

.asset-page-shell .asset-overview-card {
    overflow: hidden;
    background: #f8fafc;
    border: 1px solid #d2d8e0;
    border-radius: 12px;
    box-shadow: none;
}

.asset-page-shell .asset-detail-row {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 24px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border-color);
}

.asset-page-shell .asset-detail-row:last-child {
    border-bottom: 0;
}

.asset-page-shell .asset-detail-row span {
    color: var(--secondary-text);
    font-weight: 600;
}

.asset-page-shell .asset-detail-row strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--primary-text);
    text-align: right;
}

.asset-page-shell .asset-transfers {
    margin-top: 34px;
    overflow: visible;
    border: 0;
    box-shadow: none;
}

.asset-page-shell .asset-transfers h2 {
    margin: 0 0 18px;
}

.asset-transfer-scroll {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: 12px;
}

.asset-transfer-table {
    min-width: 820px;
}

.asset-page-shell .asset-transfer-header,
.asset-page-shell .asset-transfer-row {
    border-color: var(--border-color);
}

.asset-page-shell .asset-transfer-header span {
    color: var(--secondary-text);
    font-weight: 600;
}

.asset-page-shell .asset-transfer-row a {
    color: var(--link-color);
}

.asset-page-shell .asset-transfer-row span {
    color: var(--secondary-text);
}

.asset-page-shell .asset-transfer-row:hover {
    background: var(--row-hover);
}

html[data-theme="clean"] .asset-page-shell .asset-detail-card {
    border-color: #d5d9de;
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.06);
}

html[data-theme="clean"] .asset-page-shell .asset-overview-card {
    background: #ffffff;
}

@media (max-width: 700px) {
    .asset-page-shell.asset-detail-page {
        width: min(100% - 24px, 1180px);
        padding-top: 18px;
    }

    .asset-page-shell .asset-detail-card {
        padding: 24px 20px;
    }

    .asset-page-shell .asset-detail-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .asset-page-shell .asset-detail-row strong {
        text-align: left;
    }

    .asset-page-shell .asset-transfer-scroll {
        overflow: visible;
    }

    .asset-page-shell .asset-transfer-table {
        min-width: 0;
    }

    .asset-page-shell .asset-transfer-header {
        display: none;
    }

    .asset-page-shell .asset-transfer-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 18px 20px;
        padding: 20px 4px;
        align-items: start;
    }

    .asset-page-shell .asset-transfer-row > * {
        min-width: 0;
        overflow: visible;
        white-space: normal;
        overflow-wrap: anywhere;
        text-overflow: clip;
    }

    .asset-page-shell .asset-transfer-row > *::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 6px;
        color: var(--secondary-text);
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .asset-page-shell .asset-transfer-row > [data-label="From"],
    .asset-page-shell .asset-transfer-row > [data-label="To"] {
        grid-column: 1 / -1;
    }
}


/* ==========================
   KeetaView Analytics
========================== */

.analytics-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.analytics-dashboard {
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.analytics-title-row {
    display: flex;
    justify-content: space-between;
    gap: 28px;
    align-items: flex-end;
    margin-bottom: 24px;
    padding: 26px 28px;
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.analytics-title-row h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.analytics-title-row > div > p:last-child {
    max-width: 720px;
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.analytics-tabs {
    display: inline-flex;
    padding: 4px;
    background: #eef1f4;
    border-radius: 10px;
}

.analytics-tabs button {
    padding: 10px 16px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #53647a;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
}

.analytics-tabs button.active {
    background: #1b2433;
    color: #ffffff;
}

.analytics-view[hidden] {
    display: none !important;
}

.analytics-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.analytics-metric-card,
.analytics-dashboard-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.08);
}

.analytics-metric-card {
    min-width: 0;
    padding: 22px;
}

.analytics-metric-card > span {
    display: block;
    color: #58687d;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.analytics-metric-card > strong {
    display: block;
    margin: 12px 0 8px;
    color: #1b2433;
    font-size: clamp(1.75rem, 3vw, 2.35rem);
}

.analytics-metric-card > small {
    color: #718096;
}

.analytics-primary-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 0.8fr);
    gap: 16px;
    margin-bottom: 16px;
}

.analytics-two-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.analytics-dashboard-card {
    min-width: 0;
    overflow: hidden;
}


.analytics-card-header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    padding: 20px 22px;
    border-bottom: 1px solid #d9dee4;
}

.analytics-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.2rem;
}

.analytics-range-label {
    color: #718096;
    font-size: 0.78rem;
    white-space: nowrap;
}

.analytics-bar-chart {
    display: grid;
    grid-template-columns: repeat(14, minmax(42px, 1fr));
    align-items: end;
    gap: 10px;
    min-height: 310px;
    padding: 28px 22px 20px;
    overflow-x: auto;
}

.analytics-chart-column {
    display: grid;
    grid-template-rows: 24px 210px 30px;
    gap: 8px;
    min-width: 42px;
    text-align: center;
}

.analytics-chart-column > strong {
    color: #53647a;
    font-size: 0.75rem;
}

.analytics-chart-column > span {
    color: #718096;
    font-size: 0.72rem;
    white-space: nowrap;
}

.analytics-bar-track {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 210px;
    border-bottom: 1px solid #d9dee4;
}

.analytics-bar {
    width: min(30px, 68%);
    min-height: 4px;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(
        180deg,
        #2392e7,
        #1676cf
    );
    box-shadow: 0 0 0 rgba(22, 118, 207, 0);
    transition:
        filter 0.18s ease,
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.analytics-bar-tooltip {
    position: absolute;
    z-index: 5;
    left: 50%;
    bottom: calc(var(--bar-height) + 9px);
    display: grid;
    gap: 3px;
    min-width: 126px;
    padding: 9px 11px;
    border: 1px solid #d7dee8;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 8px 24px rgba(32, 45, 62, 0.16);
    color: #26364b;
    font-size: 0.72rem;
    line-height: 1.35;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 5px);
    transition:
        opacity 0.16s ease,
        transform 0.16s ease;
}

.analytics-bar-tooltip strong,
.analytics-bar-tooltip span {
    color: inherit;
    font-size: inherit;
    white-space: nowrap;
}

.analytics-chart-column:hover .analytics-bar,
.analytics-chart-column:focus .analytics-bar {
    filter: brightness(1.08);
    transform: scaleX(1.08);
    box-shadow: 0 0 12px rgba(22, 118, 207, 0.38);
}

.analytics-chart-column:hover .analytics-bar-tooltip,
.analytics-chart-column:focus .analytics-bar-tooltip {
    opacity: 1;
    transform: translate(-50%, 0);
}

.analytics-chart-column:focus {
    outline: none;
}

.coverage-list {
    margin: 0;
    padding: 4px 22px;
}

.coverage-list > div {
    padding: 18px 0;
    border-bottom: 1px solid #e2e6eb;
}

.coverage-list > div:last-child {
    border-bottom: 0;
}

.coverage-list dt {
    margin-bottom: 7px;
    color: #66768a;
    font-size: 0.8rem;
}

.coverage-list dd {
    margin: 0;
    color: #1b2433;
    font-weight: 700;
}

.analytics-disclosure {
    margin: 6px 22px 22px;
    padding: 14px;
    border-radius: 10px;
    background: #f3f5f7;
    color: #5f6e80;
    font-size: 0.8rem;
    line-height: 1.5;
}

.analytics-ranked-list,
.analytics-transfer-list {
    min-height: 300px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scrollbar-color: #c3cbd5 transparent;
    scrollbar-width: thin;
}

.analytics-ranked-list {
    height: 520px;
}

.analytics-ranked-list--tall {
    height: 520px;
}

.analytics-transfer-list {
    height: 520px;
}

.analytics-scroll-shell {
    position: relative;
    height: 520px;
}

.analytics-scroll-shell > .analytics-ranked-list,
.analytics-scroll-shell > .analytics-transfer-list {
    height: 100%;
    scrollbar-width: none;
}

.analytics-scroll-shell > .analytics-ranked-list::-webkit-scrollbar,
.analytics-scroll-shell > .analytics-transfer-list::-webkit-scrollbar {
    display: none;
}

.analytics-scroll-track {
    position: absolute;
    top: 5px;
    right: 3px;
    bottom: 5px;
    width: 6px;
    pointer-events: none;
}

.analytics-scroll-thumb {
    width: 6px;
    height: 48px;
    border: 1px solid rgba(0, 0, 0, 0.18);
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.28);
    transition: transform 0.06s linear;
}

.analytics-ranked-list::-webkit-scrollbar,
.analytics-transfer-list::-webkit-scrollbar {
    width: 10px;
}

.analytics-ranked-list::-webkit-scrollbar-track,
.analytics-transfer-list::-webkit-scrollbar-track {
    background: transparent;
}

.analytics-ranked-list::-webkit-scrollbar-thumb,
.analytics-transfer-list::-webkit-scrollbar-thumb {
    background: #c3cbd5;
    border: 3px solid #ffffff;
    border-radius: 999px;
    min-height: 48px;
}

.analytics-ranked-row {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 52px;
    padding: 11px 20px;
    border-bottom: 1px solid #e2e6eb;
}

.analytics-ranked-row:last-child {
    border-bottom: 0;
}

.analytics-ranked-row:hover {
    background: #f5f7f9;
}

.analytics-rank {
    color: #7a8797;
    font-size: 0.78rem;
    font-weight: 700;
}

.analytics-ranked-row a {
    min-width: 0;
    overflow: hidden;
    color: #1676cf;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}

.analytics-ranked-row a:hover {
    text-decoration: underline;
}

.analytics-ranked-row strong {
    color: #34445a;
    font-size: 0.82rem;
    white-space: nowrap;
}

.analytics-ranked-row .analytics-asset-total {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 2px;
}

.analytics-asset-total small {
    color: #7a8797;
    font-size: 0.72rem;
    font-weight: 600;
}

.analytics-transfer-row {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 65px;
    padding: 10px 20px;
    border-bottom: 1px solid #e2e6eb;
    color: #1b2433;
    text-decoration: none;
}

.analytics-transfer-row:last-child {
    border-bottom: 0;
}

.analytics-transfer-row:hover {
    background: #f5f7f9;
}

.analytics-transfer-icon {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: #eef1f4;
    color: #5a5a5a;
}

.analytics-transfer-route {
    min-width: 0;
}

.analytics-transfer-route strong,
.analytics-transfer-route small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.analytics-transfer-route strong {
    color: #1676cf;
}

.analytics-transfer-route small {
    margin-top: 4px;
    color: #718096;
}

.analytics-transfer-amount {
    color: #34445a;
    font-size: 0.86rem;
    text-align: right;
    white-space: nowrap;
}

.analytics-empty {
    margin: 0;
    padding: 24px;
    color: #66768a;
}

.market-source-card {
    padding: 34px;
}

.market-source-card h2 {
    margin: 7px 0 10px;
}

.market-source-card > p:not(.home-eyebrow) {
    max-width: 760px;
    color: #66768a;
    line-height: 1.6;
}

.analytics-market-chart {
    margin-top: 24px;
    border: 1px solid #d9dee4;
    border-radius: 14px;
    background: #fbfcfd;
    overflow: hidden;
}

.analytics-market-chart-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 18px;
    border-bottom: 1px solid #e2e6eb;
    color: #53647a;
    font-size: 0.82rem;
    font-weight: 700;
}

.analytics-market-chart-stage {
    position: relative;
    padding: 8px 14px 2px;
}

#analyticsMarketChartSvg {
    display: block;
    width: 100%;
    height: 340px;
    cursor: default;
    touch-action: none;
}

#analyticsMarketGrid line {
    stroke: #e3e8ee;
    stroke-width: 1;
}

#analyticsMarketAxis text {
    fill: #718096;
    font-size: 11px;
}

#analyticsMarketLine {
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#analyticsMarketVolumeBars {
    opacity: 0.28;
    pointer-events: none;
}

.analytics-market-hover-line {
    stroke: #64748b;
    stroke-width: 1;
    stroke-dasharray: 5 5;
    pointer-events: none;
}

.analytics-market-hover-point {
    stroke: #ffffff;
    stroke-width: 3;
    pointer-events: none;
}

.analytics-market-tooltip {
    position: absolute;
    z-index: 8;
    display: grid;
    gap: 6px;
    min-width: 190px;
    padding: 12px 14px;
    border: 1px solid #d9dee4;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 12px 30px rgba(32, 45, 62, 0.18);
    color: #26364b;
    font-size: 0.8rem;
    pointer-events: none;
}

.analytics-market-tooltip[hidden],
.analytics-market-hover-line[hidden],
.analytics-market-hover-point[hidden] {
    display: none;
}

.analytics-market-tooltip strong {
    padding-bottom: 5px;
    border-bottom: 1px solid #e2e6eb;
}

.analytics-market-tooltip span {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: #66768a;
}

.analytics-market-tooltip b {
    color: #26364b;
}

.market-coming-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 28px;
}

.market-coming-grid > div {
    padding: 20px;
    border: 1px solid #d9dee4;
    border-radius: 12px;
    background: #f8f9fb;
}

.market-coming-grid span,
.market-coming-grid strong {
    display: block;
}

.market-coming-grid span {
    margin-bottom: 10px;
    color: #66768a;
    font-size: 0.8rem;
}

.market-coming-grid strong {
    color: #1b2433;
    font-size: 1.5rem;
}

.analytics-error-card {
    padding: 30px;
}

.analytics-error-card code {
    padding: 2px 6px;
    border-radius: 5px;
    background: #eef1f4;
}

html[data-theme="clean"] .analytics-title-row,
html[data-theme="clean"] .analytics-metric-card,
html[data-theme="clean"] .analytics-dashboard-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 980px) {
    .analytics-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .analytics-primary-grid,
    .analytics-two-column {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .analytics-dashboard {
        width: min(100% - 24px, 1320px);
        padding-top: 18px;
    }

    .analytics-title-row {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .analytics-tabs {
        width: 100%;
    }

    .analytics-tabs button {
        flex: 1;
    }

    .analytics-summary-grid,
    .market-coming-grid {
        grid-template-columns: 1fr;
    }

    .analytics-ranked-row {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .analytics-ranked-row strong {
        grid-column: 2;
    }

    .analytics-ranked-row .analytics-asset-total {
        align-items: flex-start;
    }

    .analytics-transfer-row {
        grid-template-columns: 32px minmax(0, 1fr);
    }

    .analytics-transfer-amount {
        grid-column: 2;
        text-align: left;
    }
}



/* ==========================
   KeetaView Asset Directory
========================== */

.assets-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.assets-dashboard {
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.assets-title-card,
.assets-list-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.assets-title-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
    padding: 28px;
}

.assets-title-card h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.assets-title-card > div > p:last-child {
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.asset-filter {
    display: grid;
    gap: 8px;
    width: min(100%, 360px);
    color: #53647a;
    font-size: 0.8rem;
    font-weight: 700;
}

.asset-filter input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #c8d0d9;
    border-radius: 10px;
    background: #f8f9fb;
    color: #1b2433;
    font: inherit;
    font-size: 0.95rem;
    outline: none;
}

.asset-filter input:focus {
    border-color: #5a5a5a;
    box-shadow: 0 0 0 3px rgba(90, 90, 90, 0.12);
}

.asset-filter input::placeholder {
    color: #8994a3;
}

.assets-list-card {
    overflow: hidden;
}

.assets-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    border-bottom: 1px solid #d9dee4;
}

.assets-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.asset-result-count {
    color: #66768a;
    font-size: 0.85rem;
    white-space: nowrap;
}

.asset-table-scroll {
    overflow-x: auto;
}

.asset-directory-table {
    min-width: 820px;
}

.asset-directory-header,
.asset-directory-row {
    display: grid;
    grid-template-columns:
        minmax(100px, 0.7fr)
        minmax(150px, 1fr)
        minmax(260px, 1.7fr)
        minmax(190px, 1.2fr);
    gap: 20px;
    align-items: center;
}

.asset-directory-header {
    padding: 14px 24px;
    background: #f5f7f9;
    border-bottom: 1px solid #d9dee4;
    color: #66768a;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.asset-directory-row {
    min-height: 66px;
    padding: 13px 24px;
    border-bottom: 1px solid #e2e6eb;
    color: #26364b;
    text-decoration: none;
    transition: background 0.18s ease;
}

.asset-directory-row:last-child {
    border-bottom: 0;
}

.asset-directory-row:hover,
.asset-directory-row:focus-visible {
    background: #f3f6f9;
}

.asset-directory-row:focus-visible {
    outline: 2px solid #5a5a5a;
    outline-offset: -2px;
}

.asset-directory-row > span {
    min-width: 0;
}

.asset-directory-symbol {
    color: #1b2433;
    font-weight: 800;
}

.asset-directory-name,
.asset-directory-address {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.asset-directory-name {
    color: #53647a;
}

.asset-directory-address {
    color: #1676cf;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.86rem;
}

.asset-directory-supply {
    color: #34445a;
    text-align: right;
    overflow-wrap: anywhere;
}

.assets-empty {
    margin: 0;
    padding: 32px 24px;
    color: #66768a;
}

.asset-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 16px 22px;
    border-top: 1px solid #d9dee4;
    background: #f8f9fb;
}

.asset-pagination[hidden] {
    display: none;
}

.asset-pagination button {
    padding: 9px 13px;
    border: 1px solid #c8d0d9;
    border-radius: 8px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
}

.asset-pagination button:hover:not(:disabled) {
    background: #eef1f4;
}

.asset-pagination button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.asset-pagination span {
    color: #66768a;
    font-size: 0.84rem;
}

html[data-theme="clean"] .assets-title-card,
html[data-theme="clean"] .assets-list-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 700px) {
    .assets-dashboard {
        width: min(100% - 24px, 1320px);
        padding-top: 18px;
    }

    .assets-title-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .asset-filter {
        width: 100%;
    }

    .assets-card-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }

    .asset-pagination {
        justify-content: space-between;
    }
}



/* ==========================
   KeetaView Block Directory
========================== */

.blocks-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.blocks-dashboard {
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.blocks-title-card,
.blocks-list-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.blocks-title-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
    padding: 28px;
}

.blocks-title-card h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.blocks-title-card > div > p:last-child {
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.block-filter {
    display: grid;
    gap: 8px;
    width: min(100%, 360px);
    color: #53647a;
    font-size: 0.8rem;
    font-weight: 700;
}

.block-filter input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #c8d0d9;
    border-radius: 10px;
    background: #f8f9fb;
    color: #1b2433;
    font: inherit;
    font-size: 0.95rem;
    outline: none;
}

.block-filter input:focus {
    border-color: #5a5a5a;
    box-shadow: 0 0 0 3px rgba(90, 90, 90, 0.12);
}

.block-filter input::placeholder {
    color: #8994a3;
}

.blocks-list-card {
    overflow: hidden;
}

.blocks-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    border-bottom: 1px solid #d9dee4;
}

.blocks-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.block-result-count {
    color: #66768a;
    font-size: 0.85rem;
    white-space: nowrap;
}

.block-table-scroll {
    overflow-x: auto;
}

.block-directory-table {
    min-width: 760px;
}

.block-directory-header,
.block-directory-row {
    display: grid;
    grid-template-columns:
        minmax(240px, 1.5fr)
        minmax(130px, 0.8fr)
        minmax(160px, 0.9fr)
        minmax(100px, 0.6fr);
    gap: 20px;
    align-items: center;
}

.block-directory-header {
    padding: 14px 24px;
    background: #f5f7f9;
    border-bottom: 1px solid #d9dee4;
    color: #66768a;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.block-directory-row {
    min-height: 66px;
    padding: 13px 24px;
    border-bottom: 1px solid #e2e6eb;
    color: #26364b;
    text-decoration: none;
    transition: background 0.18s ease;
}

.block-directory-row:last-child {
    border-bottom: 0;
}

.block-directory-row:hover,
.block-directory-row:focus-visible {
    background: #f3f6f9;
}

.block-directory-row:focus-visible {
    outline: 2px solid #5a5a5a;
    outline-offset: -2px;
}

.block-directory-row > span {
    min-width: 0;
}

.block-directory-hash {
    overflow: hidden;
    color: #1676cf;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.block-directory-age {
    color: #66768a;
}

.block-directory-operations {
    color: #34445a;
    font-weight: 600;
}

.block-directory-network {
    color: #53647a;
}

.blocks-empty {
    margin: 0;
    padding: 32px 24px;
    color: #66768a;
}

.block-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 16px 22px;
    border-top: 1px solid #d9dee4;
    background: #f8f9fb;
}

.block-pagination button {
    padding: 9px 13px;
    border: 1px solid #c8d0d9;
    border-radius: 8px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
}

.block-pagination button:hover:not(:disabled) {
    background: #eef1f4;
}

.block-pagination button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.block-pagination span {
    color: #66768a;
    font-size: 0.84rem;
}

html[data-theme="clean"] .blocks-title-card,
html[data-theme="clean"] .blocks-list-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 700px) {
    .blocks-dashboard {
        width: min(100% - 24px, 1320px);
        padding-top: 18px;
    }

    .blocks-title-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .block-filter {
        width: 100%;
    }

    .blocks-card-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }

    .block-pagination {
        justify-content: space-between;
    }
}



/* ==========================
   KeetaView Transaction Directory
========================== */

.transactions-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.transactions-dashboard {
    width: min(100% - 40px, 1420px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.transactions-title-card,
.transactions-list-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.transactions-title-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
    padding: 28px;
}

.transactions-title-card h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.transactions-title-card > div > p:last-child {
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.transaction-filter-controls {
    display: grid;
    grid-template-columns: minmax(170px, 0.7fr) minmax(280px, 1.3fr);
    gap: 12px;
    width: min(100%, 620px);
}

#anchorStatusFilter:not([hidden]) ~ .transaction-filter--search {
    grid-column: 1 / -1;
}

.transaction-filter {
    display: grid;
    gap: 8px;
    color: #53647a;
    font-size: 0.8rem;
    font-weight: 700;
}

.transaction-filter[hidden] {
    display: none;
}

.transaction-filter input,
.transaction-filter select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #c8d0d9;
    border-radius: 10px;
    background: #f8f9fb;
    color: #1b2433;
    font: inherit;
    font-size: 0.95rem;
    outline: none;
}

.transaction-filter input:focus,
.transaction-filter select:focus {
    border-color: #5a5a5a;
    box-shadow: 0 0 0 3px rgba(90, 90, 90, 0.12);
}

.transaction-filter input::placeholder {
    color: #8994a3;
}

.transaction-search-control {
    position: relative;
    display: block;
}

.transaction-search-control input {
    padding-right: 44px;
}

.transaction-search-clear {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #66768a;
    font: inherit;
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    transform: translateY(-50%);
}

.transaction-search-clear:hover,
.transaction-search-clear:focus-visible {
    background: rgba(90, 90, 90, 0.12);
    color: #1b2433;
    outline: none;
}

.transaction-search-clear[hidden] {
    display: none;
}

.transaction-search-clear:disabled {
    cursor: wait;
    opacity: 0.45;
}

.transactions-list-card {
    overflow: hidden;
}

.transactions-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    border-bottom: 1px solid #d9dee4;
}

.transactions-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.transaction-result-count {
    color: #66768a;
    font-size: 0.85rem;
    white-space: nowrap;
}

.transaction-table-scroll {
    overflow-x: auto;
}

.transaction-directory-table {
    min-width: 1050px;
}

.transaction-directory-header,
.transaction-directory-row {
    display: grid;
    grid-template-columns:
        minmax(210px, 1.2fr)
        minmax(110px, 0.65fr)
        minmax(210px, 1.2fr)
        minmax(210px, 1.2fr)
        minmax(180px, 1fr);
    gap: 18px;
    align-items: center;
}

.transaction-directory-header {
    padding: 14px 24px;
    background: #f5f7f9;
    border-bottom: 1px solid #d9dee4;
    color: #66768a;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.transaction-directory-row {
    min-height: 70px;
    padding: 14px 24px;
    border-bottom: 1px solid #e2e6eb;
    color: #26364b;
    cursor: pointer;
    transition: background 0.18s ease;
}

.transaction-directory-row:last-child {
    border-bottom: 0;
}

.transaction-directory-row:hover,
.transaction-directory-row:focus-visible {
    background: #f3f6f9;
}

.transaction-directory-row:focus-visible {
    outline: 2px solid #5a5a5a;
    outline-offset: -2px;
}

.transaction-directory-row > * {
    min-width: 0;
}

.transaction-directory-block,
.transaction-directory-address a {
    overflow: hidden;
    color: #1676cf;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}

.transaction-directory-block {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-weight: 700;
}

.transaction-directory-address {
    overflow: hidden;
}

.transaction-directory-type {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    overflow: hidden;
}

.transaction-anchor-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border: 1px solid rgba(22, 118, 207, 0.45);
    border-radius: 999px;
    background: rgba(22, 118, 207, 0.14);
    color: #1688e8;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.transaction-anchor-badge--verified {
    border-color: rgba(35, 181, 112, 0.55);
    background: rgba(35, 181, 112, 0.15);
    color: #20a96b;
}

.transaction-anchor-badge--unsigned {
    border-color: rgba(134, 148, 166, 0.5);
    background: rgba(134, 148, 166, 0.14);
    color: #7f8fa3;
}

.transaction-anchor-badge--invalid {
    border-color: rgba(224, 74, 74, 0.55);
    background: rgba(224, 74, 74, 0.14);
    color: #dc4c4c;
}

.transaction-anchor-badge--encrypted {
    border-color: rgba(151, 91, 216, 0.55);
    background: rgba(151, 91, 216, 0.14);
    color: #9c69dc;
}

.transaction-directory-address a:hover,
.transaction-directory-block:hover {
    text-decoration: underline;
}

.transaction-directory-age {
    color: #66768a;
}

.transaction-directory-amount {
    color: #34445a;
    font-weight: 600;
    text-align: right;
    overflow-wrap: anywhere;
}

.transactions-empty {
    margin: 0;
    padding: 32px 24px;
    color: #66768a;
}

.transaction-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 16px 22px;
    border-top: 1px solid #d9dee4;
    background: #f8f9fb;
}

.transaction-pagination button {
    padding: 9px 13px;
    border: 1px solid #c8d0d9;
    border-radius: 8px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
}

.transaction-pagination button:hover:not(:disabled) {
    background: #eef1f4;
}

.transaction-pagination button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.transaction-pagination span {
    color: #66768a;
    font-size: 0.84rem;
}

html[data-theme="clean"] .transactions-title-card,
html[data-theme="clean"] .transactions-list-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 1100px) {
    .transactions-title-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .transaction-filter-controls {
        width: 100%;
    }
}

@media (max-width: 700px) {
    .transactions-dashboard {
        width: min(100% - 24px, 1420px);
        padding-top: 18px;
    }

    .transactions-title-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .transaction-filter-controls {
        grid-template-columns: 1fr;
        width: 100%;
    }

    #anchorStatusFilter:not([hidden]) ~ .transaction-filter--search {
        grid-column: auto;
    }

    .transaction-filter {
        width: 100%;
    }

    .transactions-card-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }

    .transaction-pagination {
        justify-content: space-between;
    }
}



/* ==========================
   KeetaView Address Directory
========================== */

.addresses-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.addresses-dashboard {
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.addresses-title-card,
.addresses-list-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.addresses-title-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
    padding: 28px;
}

.addresses-title-card h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.addresses-title-card > div > p:last-child {
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.address-filter {
    display: grid;
    gap: 8px;
    width: min(100%, 380px);
    color: #53647a;
    font-size: 0.8rem;
    font-weight: 700;
}

.address-filter input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #c8d0d9;
    border-radius: 10px;
    background: #f8f9fb;
    color: #1b2433;
    font: inherit;
    font-size: 0.95rem;
    outline: none;
}

.address-filter input:focus {
    border-color: #5a5a5a;
    box-shadow: 0 0 0 3px rgba(90, 90, 90, 0.12);
}

.address-filter input::placeholder {
    color: #8994a3;
}

.addresses-list-card {
    overflow: hidden;
}

.addresses-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    border-bottom: 1px solid #d9dee4;
}

.addresses-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.address-result-count {
    color: #66768a;
    font-size: 0.85rem;
    white-space: nowrap;
}

.address-table-scroll {
    overflow-x: auto;
}

.address-directory-table {
    min-width: 760px;
}

.address-directory-header,
.address-directory-row {
    display: grid;
    grid-template-columns:
        minmax(360px, 2fr)
        minmax(180px, 0.9fr)
        minmax(120px, 0.6fr);
    gap: 20px;
    align-items: center;
}

.address-directory-header {
    padding: 14px 24px;
    background: #f5f7f9;
    border-bottom: 1px solid #d9dee4;
    color: #66768a;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.address-directory-row {
    min-height: 66px;
    padding: 13px 24px;
    border-bottom: 1px solid #e2e6eb;
    color: #26364b;
    text-decoration: none;
    transition: background 0.18s ease;
}

.address-directory-row:last-child {
    border-bottom: 0;
}

.address-directory-row:hover,
.address-directory-row:focus-visible {
    background: #f3f6f9;
}

.address-directory-row:focus-visible {
    outline: 2px solid #5a5a5a;
    outline-offset: -2px;
}

.address-directory-row > span {
    min-width: 0;
}

.address-directory-value {
    overflow: hidden;
    color: #1676cf;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.address-directory-age {
    color: #66768a;
}

.address-directory-network {
    color: #53647a;
}

.addresses-empty {
    margin: 0;
    padding: 32px 24px;
    color: #66768a;
}

.address-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 16px 22px;
    border-top: 1px solid #d9dee4;
    background: #f8f9fb;
}

.address-pagination button {
    padding: 9px 13px;
    border: 1px solid #c8d0d9;
    border-radius: 8px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
}

.address-pagination button:hover:not(:disabled) {
    background: #eef1f4;
}

.address-pagination button:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.address-pagination span {
    color: #66768a;
    font-size: 0.84rem;
}

html[data-theme="clean"] .addresses-title-card,
html[data-theme="clean"] .addresses-list-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 700px) {
    .addresses-dashboard {
        width: min(100% - 24px, 1320px);
        padding-top: 18px;
    }

    .addresses-title-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .address-filter {
        width: 100%;
    }

    .addresses-card-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }

    .address-pagination {
        justify-content: space-between;
    }
}



/* ==========================
   KeetaView Status Dashboard
========================== */

.status-page-body {
    min-height: 100vh;
    background: var(--page-background);
    color: var(--primary-text);
}

.status-dashboard {
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 34px 0 72px;
}

.status-title-card,
.status-metric-card,
.status-dashboard-card,
.status-message-card {
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.09);
}

.status-title-card {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 16px;
    padding: 28px;
}

.status-title-card h1 {
    margin: 4px 0 8px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.status-title-card > div:first-child > p:last-child {
    margin: 0;
    color: var(--secondary-text);
    line-height: 1.55;
}

.status-title-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.system-status {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 10px 13px;
    border-radius: 999px;
    background: #f1f3f5;
    color: #53647a;
    font-size: 0.84rem;
}

.system-status > span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #9aa4b0;
}

.system-status[data-state="online"] {
    background: #e7f7ee;
    color: #137a49;
}

.system-status[data-state="online"] > span {
    background: #20a867;
    box-shadow: 0 0 0 4px rgba(32, 168, 103, 0.12);
}

.system-status[data-state="offline"] {
    background: #fdeceb;
    color: #a43a32;
}

.system-status[data-state="offline"] > span {
    background: #cf4b42;
}

#refreshStatus {
    padding: 10px 15px;
    border: 1px solid #c8d0d9;
    border-radius: 9px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    font-weight: 600;
}

#refreshStatus:hover:not(:disabled) {
    background: #eef1f4;
}

#refreshStatus:disabled {
    cursor: wait;
    opacity: 0.6;
}

.status-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.status-metric-card {
    min-width: 0;
    padding: 22px;
    border-radius: 14px;
}

.status-metric-card > span {
    display: block;
    color: #58687d;
    font-size: 0.82rem;
    font-weight: 700;
}

.status-metric-card > strong {
    display: block;
    margin: 12px 0 8px;
    color: #1b2433;
    font-size: clamp(1.75rem, 3vw, 2.35rem);
}

.status-metric-card > small {
    color: #718096;
}

.status-two-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}

.status-dashboard-card {
    overflow: hidden;
}

.status-card-header {
    padding: 20px 22px;
    border-bottom: 1px solid #d9dee4;
}

.status-card-header h2 {
    margin: 3px 0 0;
    font-size: 1.2rem;
}

.service-health-list > div {
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 76px;
    padding: 14px 22px;
    border-bottom: 1px solid #e2e6eb;
}

.service-health-list > div:last-child {
    border-bottom: 0;
}

.service-health-list strong,
.service-health-list small {
    display: block;
}

.service-health-list strong {
    color: #26364b;
}

.service-health-list small {
    margin-top: 4px;
    color: #718096;
}

.service-health-list > div > span:last-child {
    color: #53647a;
    font-size: 0.84rem;
    font-weight: 700;
}

.service-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #9aa4b0;
}

.service-indicator.online {
    background: #20a867;
    box-shadow: 0 0 0 4px rgba(32, 168, 103, 0.12);
}

.service-indicator.offline {
    background: #cf4b42;
    box-shadow: 0 0 0 4px rgba(207, 75, 66, 0.11);
}

.service-indicator.pending {
    background: #c29635;
    box-shadow: 0 0 0 4px rgba(194, 150, 53, 0.11);
}

.status-history-coverage {
    padding: 18px 22px;
    border-bottom: 1px solid #e2e6eb;
}

.status-history-coverage-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.status-history-coverage-heading strong,
.status-history-coverage-heading small {
    display: block;
}

.status-history-coverage-heading > div > strong {
    color: #26364b;
}

.status-history-coverage-heading small,
.status-history-coverage-note {
    color: #718096;
}

.status-backfill-card {
    margin-top: 16px;
}

.status-backfill-state {
    padding: 7px 11px;
    border: 1px solid #d8dee6;
    border-radius: 999px;
    color: #5f6f82;
    font-size: 0.82rem;
    font-weight: 700;
}

.status-backfill-state[data-state="running"],
.status-backfill-state[data-state="complete"] {
    border-color: rgba(26, 169, 104, 0.35);
    color: #168957;
    background: rgba(26, 169, 104, 0.09);
}

.status-backfill-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
}

.status-backfill-grid > div {
    min-width: 0;
    padding: 18px 22px;
    border-right: 1px solid #e2e6eb;
    border-bottom: 1px solid #e2e6eb;
}

.status-backfill-grid > div:nth-child(4n) {
    border-right: 0;
}

.status-backfill-grid dt {
    margin-bottom: 7px;
    color: #718096;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.status-backfill-grid dd {
    margin: 0;
    color: #26364b;
    font-weight: 700;
}

.status-backfill-error {
    margin: 0;
    padding: 14px 22px;
    color: #b42318;
    background: rgba(180, 35, 24, 0.08);
}

@media (max-width: 900px) {
    .status-backfill-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .status-backfill-grid > div:nth-child(4n) {
        border-right: 1px solid #e2e6eb;
    }

    .status-backfill-grid > div:nth-child(2n) {
        border-right: 0;
    }
}

@media (max-width: 560px) {
    .status-backfill-grid {
        grid-template-columns: 1fr;
    }

    .status-backfill-grid > div {
        border-right: 0 !important;
    }
}

.status-history-coverage-heading small {
    margin-top: 4px;
}

#statusCoveragePercent {
    color: #26364b;
    font-size: 1.1rem;
}

.status-coverage-progress {
    height: 9px;
    margin: 14px 0 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #e6ebf0;
}

.status-coverage-progress > span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2589e8, #47b6ff);
    transition: width 500ms ease;
}

.status-history-coverage-note {
    display: block;
    line-height: 1.45;
}

.status-coverage-list {
    margin: 0;
    padding: 4px 22px;
}

.status-coverage-list > div {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 0;
    border-bottom: 1px solid #e2e6eb;
}

.status-coverage-list > div:last-child {
    border-bottom: 0;
}

.status-coverage-list dt {
    color: #66768a;
}

.status-coverage-list dd {
    margin: 0;
    color: #26364b;
    font-weight: 700;
    text-align: right;
}

.status-message-card {
    padding: 20px 22px;
    border-radius: 14px;
}

.status-message-card strong {
    color: #26364b;
}

.status-message-card p {
    margin: 8px 0 0;
    color: #66768a;
    line-height: 1.55;
}

.status-message-card.error {
    border-color: #e2aaa5;
    background: #fff7f6;
}

.status-message-card code {
    padding: 2px 6px;
    border-radius: 5px;
    background: #eef1f4;
}

html[data-theme="clean"] .status-title-card,
html[data-theme="clean"] .status-metric-card,
html[data-theme="clean"] .status-dashboard-card,
html[data-theme="clean"] .status-message-card {
    border-color: #d5d9de;
    box-shadow: 0 7px 20px rgba(32, 45, 62, 0.05);
}

@media (max-width: 980px) {
    .status-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .status-two-column {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .status-dashboard {
        width: min(100% - 24px, 1320px);
        padding-top: 18px;
    }

    .status-title-card {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .status-title-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .system-status,
    #refreshStatus {
        justify-content: center;
        width: 100%;
    }

    .status-summary-grid {
        grid-template-columns: 1fr;
    }

    .status-coverage-list > div {
        align-items: flex-start;
        flex-direction: column;
        gap: 7px;
    }

    .status-coverage-list dd {
        text-align: left;
    }
}



/* ==========================
   KeetaView Settings
========================== */

.header-control.appearance-symbol {
    display: grid;
    place-items: center;
    width: 46px;
    min-width: 46px;
    padding: 0;
    font-size: 1.35rem;
    line-height: 1;
}

body.settings-open {
    overflow: hidden;
}

body.settings-open::after {
    position: fixed;
    z-index: 90;
    inset: 0;
    background: rgba(16, 23, 34, 0.30);
    content: "";
}

.settings-panel {
    position: fixed;
    z-index: 100;
    top: 82px;
    right: 24px;
    width: min(390px, calc(100vw - 32px));
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #c8d0d9;
    border-radius: 16px;
    box-shadow: 0 22px 60px rgba(22, 31, 44, 0.24);
    color: #1b2433;
}

.settings-panel[hidden] {
    display: none;
}

.settings-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    border-bottom: 1px solid #d9dee4;
}

.settings-panel-header h2 {
    margin: 3px 0 0;
    font-size: 1.35rem;
}

.settings-panel-header button {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #d2d8e0;
    border-radius: 9px;
    background: #ffffff;
    color: #53647a;
    cursor: pointer;
    font: inherit;
    font-size: 1.4rem;
}

.settings-panel-header button:hover {
    background: #f1f3f5;
    color: #1b2433;
}

.settings-section {
    padding: 22px;
}

.settings-section-heading strong,
.settings-section-heading span {
    display: block;
}

.settings-section-heading strong {
    color: #26364b;
}

.settings-section-heading span {
    margin-top: 5px;
    color: #718096;
    font-size: 0.82rem;
    line-height: 1.45;
}

.appearance-options {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.appearance-option {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 20px;
    gap: 13px;
    align-items: center;
    width: 100%;
    padding: 13px;
    border: 1px solid #d5dbe2;
    border-radius: 11px;
    background: #ffffff;
    color: #26364b;
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition:
        border-color 0.18s ease,
        background 0.18s ease;
}

.appearance-option:hover {
    background: #f6f8fa;
}

.appearance-option.selected {
    border-color: #5a5a5a;
    background: #f2f4f6;
}

.appearance-option > span:nth-child(2) strong,
.appearance-option > span:nth-child(2) small {
    display: block;
}

.appearance-option > span:nth-child(2) small {
    margin-top: 4px;
    color: #718096;
    font-size: 0.76rem;
    line-height: 1.35;
}

.appearance-option > b {
    color: #1b2433;
    opacity: 0;
}

.appearance-option.selected > b {
    opacity: 1;
}

.appearance-preview {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 4px;
    width: 54px;
    height: 38px;
    padding: 5px;
    border: 1px solid #cbd2da;
    border-radius: 7px;
}

.appearance-preview i {
    display: block;
    border-radius: 3px;
}

.soft-preview {
    background: #5a5a5a;
}

.soft-preview i {
    background: #ffffff;
}

.clean-preview {
    background: #ffffff;
}

.clean-preview i:first-child {
    background: #e5e9ed;
}

.clean-preview i:last-child {
    border: 1px solid #d5dbe2;
    background: #ffffff;
}

.settings-panel-footer {
    padding: 14px 22px;
    border-top: 1px solid #d9dee4;
    background: #f6f8fa;
    color: #718096;
    font-size: 0.78rem;
}

html[data-theme="soft"] .settings-panel {
    border-color: #777777;
}

@media (max-width: 700px) {
    .settings-panel {
        top: 16px;
        right: 16px;
        max-height: calc(100vh - 32px);
        overflow-y: auto;
    }
}

/* Expanded saved preferences */
.settings-panel {
    max-height: calc(100vh - 96px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.settings-preferences {
    border-top: 1px solid var(--border-color, rgba(148, 163, 184, 0.28));
}

.settings-preference-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(180px, 240px);
    gap: 24px;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid var(--border-color, rgba(148, 163, 184, 0.28));
}

.settings-preference-copy {
    display: grid;
    gap: 5px;
}

.settings-preference-copy strong {
    color: inherit;
    font-size: 0.95rem;
}

.settings-preference-copy small {
    color: var(--muted-text, #718096);
    line-height: 1.45;
}

.settings-preference-row select {
    width: 100%;
    min-height: 42px;
    padding: 9px 36px 9px 12px;
    border: 1px solid var(--border-color, #cbd5e1);
    border-radius: 10px;
    background: var(--card-bg, #fff);
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.settings-save-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding-top: 20px;
}

.settings-save-status {
    min-height: 1.2em;
    color: var(--muted-text, #718096);
    font-size: 0.88rem;
}

.settings-save-button {
    min-height: 42px;
    padding: 10px 16px;
    border: 0;
    border-radius: 10px;
    background: #0b78b8;
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.settings-save-button:hover {
    background: #09699f;
}

.settings-save-button:focus-visible,
.settings-preference-row select:focus-visible {
    outline: 3px solid rgba(14, 165, 233, 0.28);
    outline-offset: 2px;
}

@media (max-width: 640px) {
    .settings-panel {
        width: calc(100vw - 24px);
        right: 12px;
        top: 76px;
        max-height: calc(100vh - 88px);
    }

    .settings-preference-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .settings-save-row {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-save-button {
        width: 100%;
    }
}

/* Roomier settings layout */
.settings-panel {
    width: min(620px, calc(100vw - 32px));
}

.settings-preferences {
    padding: 0 26px;
}

.settings-preference-row {
    grid-template-columns: minmax(180px, 1fr) minmax(250px, 290px);
    gap: 32px;
    padding: 20px 0;
}

.settings-preference-row > span {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.settings-preference-row > span strong,
.settings-preference-row > span small {
    display: block;
}

.settings-preference-row > span strong {
    font-size: 1rem;
    line-height: 1.25;
}

.settings-preference-row > span small {
    color: var(--muted-text, #718096);
    font-size: 0.84rem;
    line-height: 1.4;
}

.settings-save-row {
    padding: 18px 26px 22px;
}

#saveSettings {
    flex: 0 0 auto;
    min-height: 42px;
    padding: 10px 18px;
    border: 0;
    border-radius: 10px;
    background: #0b78b8;
    color: #ffffff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

@media (max-width: 640px) {
    .settings-preferences {
        padding: 0 20px;
    }

    .settings-preference-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .settings-save-row {
        padding: 18px 20px 22px;
    }
}



/* Copy controls for hashes and addresses */
.copy-value-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    margin-left: 10px;
    padding: 5px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 700;
    vertical-align: middle;
    cursor: pointer;
}

.copy-value-button:hover {
    background: rgba(148, 163, 184, 0.14);
}

.copy-value-button:focus-visible {
    outline: 3px solid rgba(14, 165, 233, 0.28);
    outline-offset: 2px;
}


/* Interactive KTA market chart */
.market-placeholder {
    position: relative;
}

.market-placeholder svg {
    cursor: default;
    touch-action: none;
}

.market-hover-line {
    stroke: #64748b;
    stroke-width: 1;
    stroke-dasharray: 4 4;
    pointer-events: none;
}

.market-hover-point {
    fill: #ffffff;
    stroke: currentColor;
    stroke-width: 3;
    pointer-events: none;
}

.market-tooltip {
    position: absolute;
    z-index: 4;
    display: grid;
    gap: 6px;
    min-width: 190px;
    padding: 12px 14px;
    border: 1px solid #d9dee4;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 10px 28px rgba(32, 45, 62, 0.16);
    color: #26364b;
    font-size: 0.82rem;
    pointer-events: none;
}

.market-tooltip[hidden],
.market-hover-line[hidden],
.market-hover-point[hidden] {
    display: none;
}

.market-tooltip strong {
    padding-bottom: 5px;
    border-bottom: 1px solid #e2e6eb;
}

.market-tooltip span {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: #66768a;
}

.market-tooltip b {
    color: #26364b;
}


/* KTA chart scale and current value */
.market-placeholder .market-area-path {
    fill: url("#marketAreaGradient");
    stroke: none;
}

.market-volume-bars {
    opacity: 0.34;
    pointer-events: none;
}

.market-volume-bars rect {
    shape-rendering: crispEdges;
}

.market-placeholder svg > text {
    fill: #718096;
    font-size: 11px;
    text-anchor: end;
}

.market-placeholder .market-hover-line {
    stroke: #64748b;
    stroke-width: 1;
    stroke-dasharray: 4 4;
}

.market-placeholder svg > .market-time-label {
    fill: #718096;
    font-size: 10px;
    text-anchor: middle;
}

#marketTimeStart {
    text-anchor: start;
}

#marketTimeEnd {
    text-anchor: end;
}

#marketCurrentBadge rect {
    stroke: none;
}

#marketCurrentBadge text {
    fill: #ffffff;
    font-size: 10px;
    font-weight: 700;
}

html[data-theme="soft"] .market-placeholder svg > text {
    fill: #718096;
}


/* KeetaView animated network background — homepage trial */
html[data-theme="soft"] {
    --kv-bg-a: #111111;
    --kv-bg-b: #191919;
    --kv-bg-c: #0f0f0f;
    --kv-bg-d: #161616;
    --kv-particle-fill: rgba(230, 235, 255, 0.85);
    --kv-particle-glow: rgba(180, 200, 255, 0.55);
    --kv-node-fill: rgba(220, 225, 245, 0.80);
    --kv-node-glow: rgba(170, 190, 255, 0.45);
    --kv-line-color: rgba(180, 190, 220, 0.16);
    --kv-edge-color: rgba(190, 195, 230, 0.20);
    --kv-stream-color: rgba(255, 255, 255, 0.14);
    --kv-stream-core: rgba(255, 255, 255, 0.42);
    --kv-logo-brightness: 1;
    --kv-logo-opacity: 0.32;
    --kv-logo-invert: 1;
    --kv-grid-color: rgba(255, 255, 255, 0.012);
}

html[data-theme="clean"] {
    --kv-bg-a: #f2f2f2;
    --kv-bg-b: #eaeaea;
    --kv-bg-c: #f6f6f6;
    --kv-bg-d: #efefef;
    --kv-particle-fill: rgba(55, 65, 90, 0.50);
    --kv-particle-glow: rgba(40, 55, 100, 0.30);
    --kv-node-fill: rgba(45, 60, 95, 0.50);
    --kv-node-glow: rgba(35, 50, 95, 0.28);
    --kv-line-color: rgba(60, 70, 100, 0.16);
    --kv-edge-color: rgba(55, 65, 100, 0.18);
    --kv-stream-color: rgba(50, 60, 90, 0.12);
    --kv-stream-core: rgba(40, 50, 85, 0.32);
    --kv-logo-brightness: 1;
    --kv-logo-opacity: 0.18;
    --kv-logo-invert: 0;
    --kv-grid-color: rgba(0, 0, 0, 0.018);
}

body.home-page {
    position: relative;
    isolation: isolate;
    background: transparent;
}

#keeta-bg {
    position: fixed;
    z-index: -1;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    background: linear-gradient(
        145deg,
        var(--kv-bg-a) 0%,
        var(--kv-bg-b) 30%,
        var(--kv-bg-c) 55%,
        var(--kv-bg-a) 80%,
        var(--kv-bg-d) 100%
    );
    transition: background 0.6s ease;
}

#keeta-bg::before {
    position: absolute;
    inset: 0;
    content: "";
    background:
        linear-gradient(
            var(--kv-grid-color) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            var(--kv-grid-color) 1px,
            transparent 1px
        );
    background-size: 60px 60px;
}

#keeta-bg canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.kv-stream {
    position: absolute;
    bottom: -10%;
    width: 1.5px;
    opacity: 1;
    background: linear-gradient(
        to top,
        transparent 0%,
        var(--kv-stream-color) 30%,
        var(--kv-stream-core) 50%,
        var(--kv-stream-color) 70%,
        transparent 100%
    );
    animation:
        kv-stream-rise
        var(--kv-dur)
        linear
        var(--kv-delay)
        infinite;
}

.kv-stream.kv-down {
    top: -10%;
    bottom: auto;
    animation-name: kv-stream-fall;
}

@keyframes kv-stream-rise {
    0% {
        opacity: 0;
        transform: translateY(0);
    }

    10%,
    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translateY(-120vh);
    }
}

@keyframes kv-stream-fall {
    0% {
        opacity: 0;
        transform: translateY(0);
    }

    10%,
    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translateY(120vh);
    }
}

.kv-logo {
    position: absolute;
    opacity: var(--kv-logo-opacity);
    filter:
        brightness(var(--kv-logo-brightness))
        invert(var(--kv-logo-invert));
    will-change: transform;
    transition:
        opacity 0.6s ease,
        filter 0.6s ease;
}

@media (max-width: 700px) {
    .kv-logo:nth-child(n + 4),
    .kv-stream:nth-child(n + 8) {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    #keeta-bg canvas,
    .kv-logo,
    .kv-stream {
        display: none;
    }
}


html[data-theme="clean"] .home-panel {
    border-color: rgba(110, 125, 150, 0.20);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 10px 28px rgba(38, 52, 75, 0.07);
}


/* Continue the animated homepage background through the top area */
html[data-theme="soft"] body.home-page .home-header,
html[data-theme="soft"] body.home-page .home-navigation {
    background: rgba(17, 17, 17, 0.22);
    border-color: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(2px);
}

html[data-theme="clean"] body.home-page .home-header,
html[data-theme="clean"] body.home-page .home-navigation {
    background: rgba(242, 242, 242, 0.22);
    border-color: rgba(20, 30, 50, 0.10);
    backdrop-filter: blur(2px);
}


/* Shared animated background across KeetaView directory pages */
body.blocks-page-body,
body.transactions-page-body,
body.addresses-page-body,
body.assets-page-body,
body.analytics-page-body,
body.status-page-body {
    position: relative;
    isolation: isolate;
    background: transparent;
}

html[data-theme="soft"] body.blocks-page-body .home-header,
html[data-theme="soft"] body.blocks-page-body .home-navigation,
html[data-theme="soft"] body.transactions-page-body .home-header,
html[data-theme="soft"] body.transactions-page-body .home-navigation,
html[data-theme="soft"] body.addresses-page-body .home-header,
html[data-theme="soft"] body.addresses-page-body .home-navigation,
html[data-theme="soft"] body.assets-page-body .home-header,
html[data-theme="soft"] body.assets-page-body .home-navigation,
html[data-theme="soft"] body.analytics-page-body .home-header,
html[data-theme="soft"] body.analytics-page-body .home-navigation,
html[data-theme="soft"] body.status-page-body .home-header,
html[data-theme="soft"] body.status-page-body .home-navigation {
    background: rgba(17, 17, 17, 0.22);
    border-color: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(2px);
}

html[data-theme="clean"] body.blocks-page-body .home-header,
html[data-theme="clean"] body.blocks-page-body .home-navigation,
html[data-theme="clean"] body.transactions-page-body .home-header,
html[data-theme="clean"] body.transactions-page-body .home-navigation,
html[data-theme="clean"] body.addresses-page-body .home-header,
html[data-theme="clean"] body.addresses-page-body .home-navigation,
html[data-theme="clean"] body.assets-page-body .home-header,
html[data-theme="clean"] body.assets-page-body .home-navigation,
html[data-theme="clean"] body.analytics-page-body .home-header,
html[data-theme="clean"] body.analytics-page-body .home-navigation,
html[data-theme="clean"] body.status-page-body .home-header,
html[data-theme="clean"] body.status-page-body .home-navigation {
    background: rgba(242, 242, 242, 0.22);
    border-color: rgba(20, 30, 50, 0.10);
    backdrop-filter: blur(2px);
}


/* Animated background on block, transaction, address, and asset details */
body.detail-page-body {
    position: relative;
    isolation: isolate;
    background: transparent;
}

html[data-theme="soft"] body.detail-page-body .home-header,
html[data-theme="soft"] body.detail-page-body .home-navigation {
    background: rgba(17, 17, 17, 0.22);
    border-color: rgba(255, 255, 255, 0.10);
    backdrop-filter: blur(2px);
}

html[data-theme="clean"] body.detail-page-body .home-header,
html[data-theme="clean"] body.detail-page-body .home-navigation {
    background: rgba(242, 242, 242, 0.22);
    border-color: rgba(20, 30, 50, 0.10);
    backdrop-filter: blur(2px);
}


/* Keep the transaction detail title readable over the dark animation */
html[data-theme="soft"] body.detail-page-body .transaction-detail-shell h1 {
    color: #ffffff;
}


/* White header controls over the dark animated background */
html[data-theme="soft"] .home-search select,
html[data-theme="soft"] .home-search input,
html[data-theme="soft"] .home-search button,
html[data-theme="soft"] .header-control {
    background: #ffffff;
    border-color: #d5d9de;
    color: #171717;
}

html[data-theme="soft"] .home-search input::placeholder {
    color: #6f7885;
}

html[data-theme="soft"] .home-search button:hover,
html[data-theme="soft"] .header-control:hover {
    background: #f2f3f5;
    border-color: #c8cdd3;
}


/* Mobile navigation: keep every destination visible without sideways scrolling */
@media (max-width: 640px) {
    .home-navigation {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 18px;
        overflow-x: visible;
        padding: 12px 14px;
    }

    .home-navigation a {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}


/* Mobile transaction rows: preserve all useful fields as stacked cards */
@media (max-width: 700px) {
    .transaction-table-scroll {
        overflow-x: visible;
    }

    .transaction-directory-table {
        min-width: 0;
    }

    .transaction-directory-header {
        display: none;
    }

    .transaction-directory-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 16px 18px;
        min-height: 0;
        padding: 20px;
    }

    .transaction-directory-row > * {
        display: grid;
        gap: 5px;
        text-align: left;
    }

    .transaction-directory-row > :nth-child(3),
    .transaction-directory-row > :nth-child(4),
    .transaction-directory-row > :nth-child(5) {
        grid-column: 1 / -1;
    }

    .transaction-directory-row > :nth-child(1)::before {
        content: "Block";
    }

    .transaction-directory-row > :nth-child(2)::before {
        content: "Age";
    }

    .transaction-directory-row > :nth-child(3)::before {
        content: "Type";
    }

    .transaction-directory-row > :nth-child(4)::before {
        content: "From";
    }

    .transaction-directory-row > :nth-child(5)::before {
        content: "Details";
    }

    .transaction-directory-row > .transaction-directory-type {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 5px 8px;
    }

    .transaction-directory-row > .transaction-directory-type::before {
        flex-basis: 100%;
    }

    .transaction-directory-row > *::before {
        color: var(--secondary-text);
        font-family: inherit;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .transaction-directory-block,
    .transaction-directory-address a {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .transaction-directory-amount {
        text-align: left;
    }
}


/* Finish mobile transaction-card spacing */
@media (max-width: 700px) {
    .transaction-directory-block {
        display: grid;
        gap: 5px;
    }

    .transaction-directory-row {
        border-bottom: 1px solid var(--border-color);
    }
}


/* Mobile block rows: preserve operations and network as compact cards */
@media (max-width: 700px) {
    .block-table-scroll {
        overflow-x: visible;
    }

    .block-directory-table {
        min-width: 0;
    }

    .block-directory-header {
        display: none;
    }

    .block-directory-row {
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
        gap: 16px 18px;
        min-height: 0;
        padding: 20px;
        border-bottom: 1px solid var(--border-color);
    }

    .block-directory-row > span {
        display: grid;
        gap: 5px;
        text-align: left;
    }

    .block-directory-row > :nth-child(1)::before {
        content: "Block";
    }

    .block-directory-row > :nth-child(2)::before {
        content: "Age";
    }

    .block-directory-row > :nth-child(3)::before {
        content: "Operations";
    }

    .block-directory-row > :nth-child(4)::before {
        content: "Network";
    }

    .block-directory-row > span::before {
        color: var(--secondary-text);
        font-family: inherit;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }
}


/* Mobile address rows: preserve first-observed and network fields */
@media (max-width: 700px) {
    .address-table-scroll {
        overflow-x: visible;
    }

    .address-directory-table {
        min-width: 0;
    }

    .address-directory-header {
        display: none;
    }

    .address-directory-row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 16px 18px;
        min-height: 0;
        padding: 20px;
        border-bottom: 1px solid var(--border-color);
    }

    .address-directory-row > span {
        display: grid;
        gap: 5px;
    }

    .address-directory-value {
        grid-column: 1 / -1;
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 10px;
        white-space: normal;
    }

    .address-directory-value::before {
        flex-basis: 100%;
        content: "Address";
    }

    .address-directory-age::before {
        content: "First Observed";
    }

    .address-directory-network::before {
        content: "Network";
    }

    .address-directory-row > span::before {
        color: var(--secondary-text);
        font-family: inherit;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .address-directory-value a {
        min-width: 0;
        flex: 1 1 auto;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}


/* Mobile asset rows: prevent clipping and preserve every field */
@media (max-width: 700px) {
    .asset-table-scroll {
        overflow-x: visible;
    }

    .asset-directory-table {
        min-width: 0;
    }

    .asset-directory-header {
        display: none;
    }

    .asset-directory-row {
        grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
        gap: 16px 18px;
        min-height: 0;
        padding: 20px;
        border-bottom: 1px solid var(--border-color);
    }

    .asset-directory-row > span {
        display: grid;
        gap: 5px;
        text-align: left;
    }

    .asset-directory-address,
    .asset-directory-supply {
        grid-column: 1 / -1;
    }

    .asset-directory-symbol::before {
        content: "Asset";
    }

    .asset-directory-name::before {
        content: "Name";
    }

    .asset-directory-address::before {
        content: "Address";
    }

    .asset-directory-supply::before {
        content: "Supply";
    }

    .asset-directory-row > span::before {
        color: var(--secondary-text);
        font-family: inherit;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .asset-directory-name,
    .asset-directory-address {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .asset-directory-supply {
        text-align: left;
    }
}


/* Let long mobile asset names wrap instead of clipping */
@media (max-width: 700px) {
    .asset-directory-name {
        overflow: visible;
        overflow-wrap: anywhere;
        white-space: normal;
    }
}


/* Mobile analytics market: give heading, status, and controls full width */
@media (max-width: 700px) {
    .market-source-card {
        padding: 22px;
    }

    .market-source-card > .analytics-card-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .market-source-card > .analytics-card-header h2 {
        margin-bottom: 0;
    }

    #analyticsMarketStatus {
        width: 100%;
        line-height: 1.45;
        text-align: left;
        white-space: normal;
    }

    .analytics-market-chart-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .analytics-market-chart-toolbar .chart-ranges {
        justify-content: space-between;
        width: 100%;
    }

    .analytics-market-tooltip {
        max-width: calc(100% - 24px);
        min-width: min(190px, calc(100% - 24px));
    }
}


/* Shared keyboard accessibility */
.skip-link {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 20000;
    padding: 10px 14px;
    border: 2px solid #1676cf;
    border-radius: 9px;
    background: #ffffff;
    color: #0b5cab;
    font-weight: 800;
    text-decoration: none;
    transform: translateY(-160%);
    transition: transform 0.16s ease;
}

.skip-link:focus {
    transform: translateY(0);
}

:where(
    a,
    button,
    input,
    select,
    textarea,
    [role="button"],
    [tabindex]
):focus-visible {
    outline: 3px solid #1687e0;
    outline-offset: 3px;
}

html[data-theme="soft"] :where(
    a,
    button,
    input,
    select,
    textarea,
    [role="button"],
    [tabindex]
):focus-visible {
    outline-color: #7cc4ff;
}
/* True black Clean appearance */
html[data-theme="soft"] {
    --page-background: #000000;
    --surface-background: #000000;
    --surface-secondary: #0a0a0a;
    --border-color: #2a2a2a;
    --primary-text: #ffffff;
    --secondary-text: #b8b8b8;
    --link-color: #5aa9ff;

        --kv-bg-a: #000000;
    --kv-bg-b: #000000;
    --kv-bg-c: #000000;
}

html[data-theme="soft"] .home-header,
html[data-theme="soft"] .home-navigation,
html[data-theme="soft"] .main-nav,
html[data-theme="soft"] .home-panel,
html[data-theme="soft"] .market-panel,
html[data-theme="soft"] .home-panel-header,
html[data-theme="soft"] .home-panel-footer,
html[data-theme="soft"] .home-list-row {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff;

        --row-hover: rgba(255, 255, 255, 0.07);
}

html[data-theme="soft"] .home-panel h1,
html[data-theme="soft"] .home-panel h2,
html[data-theme="soft"] .home-panel strong {
    color: #ffffff;
}

html[data-theme="soft"] .home-panel p,
html[data-theme="soft"] .home-panel span {
    color: #b8b8b8;
}
/* Match the full Dark Mode canvas */
html[data-theme="soft"],
html[data-theme="soft"] body,
html[data-theme="soft"] .home-page,
html[data-theme="soft"] .detail-page-body {
    background-color: #000000 !important;
    background: #000000 !important;
}
/* Blocks and detail pages in Dark Mode */
html[data-theme="soft"] .listing-hero,
html[data-theme="soft"] .listing-panel,
html[data-theme="soft"] .detail-shell,
html[data-theme="soft"] .details-card,
html[data-theme="soft"] .block-card,
html[data-theme="soft"] .operation-card {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .listing-panel-header,
html[data-theme="soft"] .listing-table-header,
html[data-theme="soft"] .listing-row,
html[data-theme="soft"] .detail-row {
    background: #000000 !important;
    border-color: #2a2a2a !important;
}

html[data-theme="soft"] .listing-hero h1,
html[data-theme="soft"] .listing-panel h1,
html[data-theme="soft"] .listing-panel h2,
html[data-theme="soft"] .detail-shell h1,
html[data-theme="soft"] .detail-shell h2,
html[data-theme="soft"] .detail-shell h3,
html[data-theme="soft"] .detail-value,
html[data-theme="soft"] .operation-card strong {
    color: #ffffff !important;
}

html[data-theme="soft"] .listing-hero p,
html[data-theme="soft"] .detail-label,
html[data-theme="soft"] .operation-card span,
html[data-theme="soft"] .operation-card p {
    color: #b8b8b8 !important;
}
/* Blocks directory Dark Mode */
html[data-theme="soft"] .blocks-title-card,
html[data-theme="soft"] .blocks-list-card,
html[data-theme="soft"] .blocks-card-header,
html[data-theme="soft"] .block-directory-table,
html[data-theme="soft"] .block-directory-header,
html[data-theme="soft"] .block-directory-row {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .blocks-title-card h1,
html[data-theme="soft"] .blocks-title-card p,
html[data-theme="soft"] .blocks-card-header h2,
html[data-theme="soft"] .blocks-card-header p,
html[data-theme="soft"] .block-directory-header span,
html[data-theme="soft"] .block-directory-row span,
html[data-theme="soft"] .block-result-count {
    color: #ffffff !important;
}

html[data-theme="soft"] .blocks-title-card .home-eyebrow {
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .block-filter span {
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .block-filter input {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .block-filter input::placeholder {
    color: #777777 !important;
}
/* Clickable block links in Dark Mode */
html[data-theme="soft"] .block-directory-row span:first-child,
html[data-theme="soft"] .block-directory-row a {
    color: #5aa9ff !important;
}

/* Blocks pagination in Dark Mode */
html[data-theme="soft"] .pagination-controls,
html[data-theme="soft"] .blocks-pagination,
html[data-theme="soft"] .blocks-card-footer {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .pagination-controls button,
html[data-theme="soft"] .blocks-pagination button,
html[data-theme="soft"] .blocks-card-footer button {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .pagination-controls button:disabled,
html[data-theme="soft"] .blocks-pagination button:disabled,
html[data-theme="soft"] .blocks-card-footer button:disabled {
    color: #666666 !important;
}
/* Exact Blocks pagination Dark Mode */
html[data-theme="soft"] .block-pagination {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .block-pagination button {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .block-pagination button:disabled {
    color: #666666 !important;
}
/* Transactions directory Dark Mode */
html[data-theme="soft"] .transactions-title-card,
html[data-theme="soft"] .transactions-list-card,
html[data-theme="soft"] .transactions-card-header,
html[data-theme="soft"] .transaction-directory-table,
html[data-theme="soft"] .transaction-directory-header,
html[data-theme="soft"] .transaction-directory-row,
html[data-theme="soft"] .transaction-pagination {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .transactions-title-card h1,
html[data-theme="soft"] .transactions-title-card p,
html[data-theme="soft"] .transactions-card-header h2,
html[data-theme="soft"] .transactions-card-header p,
html[data-theme="soft"] .transaction-directory-header span,
html[data-theme="soft"] .transaction-directory-row span {
    color: #ffffff !important;
}

/* Keep clickable transaction data blue */
html[data-theme="soft"] .transaction-directory-row a {
    color: #5aa9ff !important;
}

html[data-theme="soft"] .transaction-filter span {
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .transaction-filter input,
html[data-theme="soft"] .transaction-filter select {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .transaction-filter input::placeholder {
    color: #777777 !important;
}

html[data-theme="soft"] .transaction-pagination button {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .transaction-pagination button:disabled {
    color: #666666 !important;
}
/* Addresses directory Dark Mode */
html[data-theme="soft"] .addresses-title-card,
html[data-theme="soft"] .addresses-list-card,
html[data-theme="soft"] .addresses-card-header,
html[data-theme="soft"] .address-directory-table,
html[data-theme="soft"] .address-directory-header,
html[data-theme="soft"] .address-directory-row,
html[data-theme="soft"] .address-pagination {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .addresses-title-card h1,
html[data-theme="soft"] .addresses-card-header h2,
html[data-theme="soft"] .address-directory-header span,
html[data-theme="soft"] .address-directory-row span {
    color: #ffffff !important;
}

html[data-theme="soft"] .addresses-title-card > div > p:not(.home-eyebrow),
html[data-theme="soft"] .addresses-title-card .home-eyebrow,
html[data-theme="soft"] .address-result-count,
html[data-theme="soft"] .address-filter span {
    color: #b8b8b8 !important;
}

/* Clickable addresses */
html[data-theme="soft"] .address-directory-row a {
    color: #5aa9ff !important;
}

/* Address filter */
html[data-theme="soft"] .address-filter input {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .address-filter input::placeholder {
    color: #777777 !important;
}

/* Copy and pagination buttons */
html[data-theme="soft"] .address-directory-row button,
html[data-theme="soft"] .address-pagination button {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

/* Address-detail activity table */
html[data-theme="soft"] .activity-table,
html[data-theme="soft"] .activity-table-header,
html[data-theme="soft"] #addressActivityList,
html[data-theme="soft"] #addressActivityList > * {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}
/* Assets directory Dark Mode */
html[data-theme="soft"] .assets-title-card,
html[data-theme="soft"] .assets-list-card,
html[data-theme="soft"] .assets-card-header,
html[data-theme="soft"] .asset-directory-table,
html[data-theme="soft"] .asset-directory-header,
html[data-theme="soft"] .asset-directory-row {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .assets-title-card h1,
html[data-theme="soft"] .assets-card-header h2,
html[data-theme="soft"] .asset-directory-header span,
html[data-theme="soft"] .asset-directory-row span {
    color: #ffffff !important;
}

html[data-theme="soft"] .assets-title-card > div > p:not(.home-eyebrow),
html[data-theme="soft"] .assets-title-card .home-eyebrow,
html[data-theme="soft"] .assets-card-header .home-eyebrow,
html[data-theme="soft"] .asset-result-count,
html[data-theme="soft"] .asset-filter span {
    color: #b8b8b8 !important;
}

/* Clickable asset addresses and names */
html[data-theme="soft"] .asset-directory-row a {
    color: #5aa9ff !important;
}

/* Asset filter */
html[data-theme="soft"] .asset-filter input {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .asset-filter input::placeholder {
    color: #777777 !important;
}

/* Asset detail Dark Mode */
html[data-theme="soft"] .asset-detail-card,
html[data-theme="soft"] .asset-detail-header,
html[data-theme="soft"] .asset-overview-card,
html[data-theme="soft"] .asset-transfers,
html[data-theme="soft"] .asset-transfer-table,
html[data-theme="soft"] .asset-transfer-header,
html[data-theme="soft"] #assetTransfersList,
html[data-theme="soft"] #assetTransfersList > * {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}
/* Clickable asset symbol */
html[data-theme="soft"] .asset-directory-row span:first-child {
    color: #5aa9ff !important;
}

/* Asset pagination Dark Mode */
html[data-theme="soft"] .asset-pagination {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .asset-pagination button {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .asset-pagination button:disabled {
    color: #666666 !important;
}
html[data-theme="soft"] .asset-detail-header h1,
html[data-theme="soft"] .asset-transfers h2,
html[data-theme="soft"] .asset-detail-row strong {
    color: #ffffff !important;
}

html[data-theme="soft"] .asset-detail-header .home-eyebrow,
html[data-theme="soft"] .asset-detail-header #assetDescription,
html[data-theme="soft"] .asset-detail-row span,
html[data-theme="soft"] .asset-transfer-header span {
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .asset-detail-card a,
html[data-theme="soft"] #assetTransfersList a {
    color: #5aa9ff !important;
}
/* Analytics Dark Mode */
html[data-theme="soft"] .analytics-title-row,
html[data-theme="soft"] .analytics-metric-card,
html[data-theme="soft"] .analytics-dashboard-card,
html[data-theme="soft"] .analytics-card-header,
html[data-theme="soft"] .analytics-market-chart,
html[data-theme="soft"] .analytics-market-chart-toolbar,
html[data-theme="soft"] .analytics-market-chart-stage,
html[data-theme="soft"] .analytics-ranked-list,
html[data-theme="soft"] .analytics-transfer-list,
html[data-theme="soft"] .coverage-list {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

/* Analytics title and headings */
html[data-theme="soft"] .analytics-title-row h1,
html[data-theme="soft"] .analytics-card-header h2,
html[data-theme="soft"] .analytics-metric-card strong,
html[data-theme="soft"] .analytics-dashboard-card h2 {
    color: #ffffff !important;
}

/* Secondary Analytics text */
html[data-theme="soft"] .analytics-title-row > div > p:not(.home-eyebrow),
html[data-theme="soft"] .analytics-title-row .home-eyebrow,
html[data-theme="soft"] .analytics-card-header .home-eyebrow,
html[data-theme="soft"] .analytics-range-label,
html[data-theme="soft"] .analytics-metric-card span,
html[data-theme="soft"] .analytics-metric-card small,
html[data-theme="soft"] .coverage-list dt,
html[data-theme="soft"] .analytics-market-chart-toolbar > span {
    color: #b8b8b8 !important;
}

/* Analytics metric values */
html[data-theme="soft"] .coverage-list dd {
    color: #ffffff !important;
}

/* Analytics disclosure box */
html[data-theme="soft"] .analytics-disclosure {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #b8b8b8 !important;
}

/* Network and Market tabs */
html[data-theme="soft"] .analytics-tabs {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
}

html[data-theme="soft"] .analytics-tabs button {
    background: transparent !important;
    color: #b8b8b8 !important;
}

html[data-theme="soft"] .analytics-tabs button.active {
    background: #1b2433 !important;
    color: #ffffff !important;
}

/* Ranked and recent-transfer rows */
html[data-theme="soft"] .analytics-ranked-list > *,
html[data-theme="soft"] .analytics-transfer-list > * {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .analytics-ranked-list a,
html[data-theme="soft"] .analytics-transfer-list a {
    color: #5aa9ff !important;
}

/* Market chart range controls */
html[data-theme="soft"] .chart-ranges button {
    background: transparent !important;
    color: #8fa0b8 !important;
}

html[data-theme="soft"] .chart-ranges button.active {
    background: #ffffff !important;
    color: #1676cf !important;
}

/* Market statistic cards */
html[data-theme="soft"] .market-stat-card,
html[data-theme="soft"] .analytics-market-stat,
html[data-theme="soft"] .market-metric-card {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

/* Market source/footer notice */
html[data-theme="soft"] .market-source,
html[data-theme="soft"] .analytics-market-source {
    background: #0a0a0a !important;
    color: #b8b8b8 !important;
}

/* Analytics chart canvas */
html[data-theme="soft"] .analytics-bar-chart,
html[data-theme="soft"] #analyticsMarketChartSvg {
    background: #000000 !important;
}

html[data-theme="soft"] #analyticsMarketChartSvg text {
    fill: #8fa0b8 !important;
}

html[data-theme="soft"] #analyticsMarketGrid line {
    stroke: #2a2a2a !important;
}
/* Analytics chart scrollbar Dark Mode */
html[data-theme="soft"] .analytics-bar-chart {
    scrollbar-color: #666666 #0a0a0a;
}

html[data-theme="soft"] .analytics-bar-chart::-webkit-scrollbar {
    height: 10px;
}

html[data-theme="soft"] .analytics-bar-chart::-webkit-scrollbar-track {
    background: #0a0a0a;
}

html[data-theme="soft"] .analytics-bar-chart::-webkit-scrollbar-thumb {
    background: #666666;
    border: 2px solid #0a0a0a;
    border-radius: 999px;
}

html[data-theme="soft"] .analytics-bar-chart::-webkit-scrollbar-corner {
    background: #0a0a0a;
}
/* Match Analytics transfer symbols to homepage */
html[data-theme="soft"] .analytics-transfer-row::before {
    background: #0a0a0a !important;
    color: #b8b8b8 !important;
    border-color: #1a1a1a !important;
}
/* Match Analytics transfer symbols to homepage */
html[data-theme="soft"] .analytics-transfer-icon {
    background: #0a0a0a !important;
    border: 1px solid #1a1a1a !important;
    color: #b8b8b8 !important;
}
/* KTA Market statistic cards Dark Mode */
html[data-theme="soft"] .market-coming-grid > div {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] .market-coming-grid > div span {
    color: #b8b8b8 !important;
}

html[data-theme="soft"]
    .market-coming-grid
    > div
    strong:not(#analyticsMarketChange) {
    color: #ffffff !important;
}
/* Status page Dark Mode */
html[data-theme="soft"] .status-title-card,
html[data-theme="soft"] .status-metric-card,
html[data-theme="soft"] .status-dashboard-card,
html[data-theme="soft"] .status-card-header,
html[data-theme="soft"] .status-message-card,
html[data-theme="soft"] .service-health-list,
html[data-theme="soft"] .status-history-coverage,
html[data-theme="soft"] .status-backfill-grid,
html[data-theme="soft"] .status-backfill-grid > div,
html[data-theme="soft"] .status-coverage-list {
    background: #000000 !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

/* Status headings and important values */
html[data-theme="soft"] .status-title-card h1,
html[data-theme="soft"] .status-metric-card strong,
html[data-theme="soft"] .status-card-header h2,
html[data-theme="soft"] .service-health-list strong,
html[data-theme="soft"] .status-history-coverage-heading strong,
html[data-theme="soft"] .status-backfill-grid dd,
html[data-theme="soft"] .status-coverage-list dd,
html[data-theme="soft"] .status-message-card strong {
    color: #ffffff !important;
}

/* Status secondary text */
html[data-theme="soft"] .status-title-card > div > p:not(.home-eyebrow),
html[data-theme="soft"] .status-title-card .home-eyebrow,
html[data-theme="soft"] .status-metric-card > span,
html[data-theme="soft"] .status-metric-card small,
html[data-theme="soft"] .status-card-header .home-eyebrow,
html[data-theme="soft"] .service-health-list small,
html[data-theme="soft"] .status-history-coverage-heading small,
html[data-theme="soft"] .status-history-coverage-note,
html[data-theme="soft"] .status-backfill-grid dt,
html[data-theme="soft"] .status-coverage-list dt,
html[data-theme="soft"] .status-message-card p {
    color: #b8b8b8 !important;
}

/* Service and database rows */
html[data-theme="soft"] .service-health-list > div,
html[data-theme="soft"] .status-history-coverage,
html[data-theme="soft"] .status-coverage-list > div {
    background: #000000 !important;
    border-color: #2a2a2a !important;
}

html[data-theme="soft"] .status-coverage-progress {
    background: #202020;
}

html[data-theme="soft"] .status-backfill-grid > div {
    border-color: #2a2a2a !important;
}

/* Service state text */
html[data-theme="soft"] .service-health-list > div > span:last-child {
    color: #b8b8b8 !important;
}

/* Refresh button */
html[data-theme="soft"] #refreshStatus {
    background: #0a0a0a !important;
    border-color: #2a2a2a !important;
    color: #ffffff !important;
}

html[data-theme="soft"] #refreshStatus:hover {
    background: rgba(255, 255, 255, 0.07) !important;
}

/* Keep the overall system-status pill readable */
html[data-theme="soft"] .system-status {
    border-color: #2a2a2a !important;
}

html[data-theme="soft"] .system-status strong {
    color: inherit !important;
}
#anchorActivityChart,
#recentAnchors {
    min-height: 325px;
    height: 325px;
}

#recentAnchors {
    overflow-y: hidden;
    scrollbar-gutter: auto;
}
.analytics-two-column:has(#anchorActivityChart) {
    align-items: start;
}

.analytics-two-column:has(#anchorActivityChart)
.analytics-dashboard-card {
    height: 405px;
}
#anchorActivityChart {
    overflow-y: hidden;
    box-sizing: border-box;
}

/* ==========================
   Private Traffic Dashboard
========================== */

.traffic-page-body {
    min-height: 100vh;
    margin: 0;
    background: #000000;
    color: #ffffff;
}

.traffic-header {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 24px 0 10px;
}

.traffic-page-body .home-brand { color: #ffffff; }
.traffic-page-body .home-brand span { color: #ffffff; }
.traffic-back-link { color: #42a5ff; text-decoration: none; }

.traffic-dashboard {
    position: relative;
    z-index: 1;
    width: min(100% - 40px, 1320px);
    margin: 0 auto;
    padding: 28px 0 72px;
}

.traffic-access-card,
.traffic-title-row,
.traffic-metric-card,
.traffic-card {
    background: rgba(0, 0, 0, 0.94);
    border: 1px solid #292929;
    border-radius: 16px;
}

.traffic-access-card {
    max-width: 620px;
    margin: 10vh auto 0;
    padding: 34px;
}

.traffic-access-card h1,
.traffic-title-row h1 {
    margin: 5px 0 10px;
    color: #ffffff !important;
    font-size: clamp(2rem, 5vw, 3.25rem);
}
.traffic-access-card > p:not(.home-eyebrow),
.traffic-title-row > div > p:last-child { color: #a8a8a8; }
.traffic-access-form { margin-top: 28px; }
.traffic-access-form label { display: block; margin-bottom: 8px; font-weight: 700; }
.traffic-access-form > div { display: grid; grid-template-columns: 1fr auto; }
.traffic-access-form input,
.traffic-access-form button,
.traffic-actions button {
    min-height: 46px;
    border: 1px solid #343434;
    background: #0a0a0a;
    color: #ffffff;
    font: inherit;
}
.traffic-access-form input { min-width: 0; padding: 0 14px; border-radius: 9px 0 0 9px; }
.traffic-access-form button { padding: 0 18px; border-radius: 0 9px 9px 0; cursor: pointer; }
.traffic-access-form button:hover,
.traffic-actions button:hover { border-color: #42a5ff; }
.traffic-privacy-note { margin-bottom: 0; font-size: 0.82rem; }
.traffic-error { margin-top: 16px; color: #ff8c8c !important; }
.traffic-panel-error { padding: 14px 18px; background: #260e0e; border: 1px solid #692525; border-radius: 10px; }

.traffic-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 16px;
    padding: 26px 28px;
}
.traffic-actions { display: flex; align-items: center; gap: 10px; }
.traffic-actions span { color: #8b98a8; font-size: 0.8rem; white-space: nowrap; }
.traffic-actions button { padding: 0 16px; border-radius: 9px; cursor: pointer; }
.traffic-actions button:disabled { cursor: wait; opacity: 0.55; }

.traffic-summary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.traffic-metric-card { padding: 22px; }
.traffic-metric-card > span { color: #a9a9a9; font-size: 0.82rem; font-weight: 700; }
.traffic-metric-card > strong {
    display: block;
    margin: 10px 0 8px;
    color: #ffffff !important;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
}
.traffic-metric-card > small { color: #a8a8a8; }
.traffic-live-card strong { color: #36d38b !important; }

.traffic-primary-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 16px; }
.traffic-card { min-width: 0; overflow: hidden; }
.traffic-card:first-child { grid-row: span 2; }
.traffic-card-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 22px; border-bottom: 1px solid #292929; }
.traffic-card-header h2 {
    margin: 4px 0 0;
    color: #ffffff !important;
}
.traffic-card-header > span { color: #a8a8a8; font-size: 0.78rem; }

.traffic-chart { display: grid; grid-template-columns: repeat(30, minmax(26px, 1fr)); align-items: end; gap: 7px; min-height: 330px; padding: 28px 20px 12px; overflow-x: auto; }
.traffic-chart {
    scrollbar-color: #555555 #141414;
    scrollbar-width: thin;
}
.traffic-chart::-webkit-scrollbar { height: 9px; }
.traffic-chart::-webkit-scrollbar-track { background: #141414; }
.traffic-chart::-webkit-scrollbar-thumb {
    background: #555555;
    border: 2px solid #141414;
    border-radius: 999px;
}
.traffic-chart-column { display: grid; grid-template-rows: 245px auto; gap: 9px; min-width: 26px; text-align: center; }
.traffic-chart-bars { display: flex; align-items: end; justify-content: center; gap: 3px; }
.traffic-chart-bars i { width: 8px; min-height: 2px; border-radius: 4px 4px 0 0; }
.traffic-chart-bars .visitors,
.traffic-chart-legend .visitors { background: #36d38b; }
.traffic-chart-bars .pageviews,
.traffic-chart-legend .pageviews { background: #268cf0; }
.traffic-chart-column > span { color: #7f8b9b; font-size: 0.65rem; white-space: nowrap; transform: rotate(-45deg); }
.traffic-chart-legend { display: flex; justify-content: center; gap: 20px; padding: 10px 20px 20px; color: #a8a8a8; font-size: 0.78rem; }
.traffic-chart-legend span { display: flex; align-items: center; gap: 7px; }
.traffic-chart-legend i { width: 10px; height: 10px; border-radius: 3px; }

.traffic-ranked-list { margin: 0; padding: 0; list-style: none; }
.traffic-ranked-list li { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 15px 20px; border-bottom: 1px solid #242424; }
.traffic-ranked-list li:last-child { border-bottom: 0; }
.traffic-ranked-list li > span { color: #71839a; font-size: 0.8rem; }
.traffic-ranked-list li > strong {
    overflow: hidden;
    color: #ffffff !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.traffic-ranked-list li > span:last-child { color: #42a5ff; white-space: nowrap; }
.traffic-ranked-list .traffic-empty { display: block; color: #818181; }

@media (max-width: 850px) {
    .traffic-summary-grid { grid-template-columns: repeat(2, 1fr); }
    .traffic-primary-grid { grid-template-columns: 1fr; }
    .traffic-card:first-child { grid-row: auto; }
}

@media (max-width: 600px) {
    .traffic-header,
    .traffic-dashboard { width: min(100% - 24px, 1320px); }
    .traffic-title-row { align-items: flex-start; flex-direction: column; padding: 22px; }
    .traffic-actions { flex-wrap: wrap; }
    .traffic-summary-grid { grid-template-columns: 1fr; }
    .traffic-access-card { padding: 24px; }
    .traffic-access-form > div { grid-template-columns: 1fr; gap: 8px; }
    .traffic-access-form input,
    .traffic-access-form button { border-radius: 9px; }
    .traffic-ranked-list li { grid-template-columns: 34px minmax(0, 1fr); }
    .traffic-ranked-list li > span:last-child { grid-column: 2; }
}
/* Mobile detail polish */
@media (max-width: 700px) {
    .detail-card .copy-value,
    .address-summary .copy-value,
    .transaction-summary .copy-value,
    .asset-detail-summary .copy-value {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 8px;
        min-width: 0;
    }

    .detail-card .copy-value > :first-child,
    .address-summary .copy-value > :first-child,
    .transaction-summary .copy-value > :first-child,
    .asset-detail-summary .copy-value > :first-child {
        min-width: 0;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .detail-card .copy-value-button,
    .address-summary .copy-value-button,
    .transaction-summary .copy-value-button,
    .asset-detail-summary .copy-value-button {
        justify-self: start;
        margin-left: 0;
    }

    .analytics-bar-chart {
        scroll-padding-inline: 14px;
        scroll-snap-type: x proximity;
        overscroll-behavior-inline: contain;
    }

    .analytics-bar-column {
        scroll-snap-align: start;
    }
}

@media (max-width: 480px) {
    .asset-transfer-row {
        grid-template-columns: minmax(0, 1fr);
    }
}
.operation-filter-menu { grid-column: 1 / -1; position: relative; color: var(--text-color, #eee); }
.operation-filter-menu summary { cursor: pointer; border: 1px solid var(--border-color, #333); border-radius: 10px; padding: 12px 16px; width: fit-content; font-weight: 600; }
.operation-filter-menu[open] { padding: 12px; border: 1px solid var(--border-color, #333); border-radius: 12px; }
.operation-filter-menu label { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.operation-filter-menu input { width: 18px; height: 18px; accent-color: #29a4ff; }
.operation-filter-menu p { color: var(--secondary-text); font-size: .8rem; line-height: 1.5; }