html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #17364f;
    background: #eef7ff;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.nav-pills .nav-link {
    color: #1b6fae;
    border-radius: 6px;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
}

.nav-pills .nav-link:not(.active):hover,
.nav-pills .nav-link:not(.active):focus {
    color: #0f4f83;
    background-color: #e4f3ff;
}

.manage-account-title {
    font-size: 1rem;
}

.content {
    padding-top: 1.1rem;
}

.account-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    max-width: 240px;
    padding: 0.45rem 0.8rem;
    border: 1px solid #8dbde1;
    border-radius: 8px;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-button-primary {
    background: #1b6fae;
    border-color: #1b6fae;
    color: #fff;
}

.account-button-secondary {
    background: #ffffff;
    color: #155984;
}

.account-button-primary:hover,
.account-button-primary:focus {
    background: #155984;
    border-color: #155984;
    color: #fff;
}

.account-button-secondary:hover,
.account-button-secondary:focus {
    background: #e8f5ff;
    color: #0f3d63;
}

.hero-band,
.panel,
.order-card,
.service-card {
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(39, 104, 154, 0.08);
}

.hero-band {
    padding: 2rem;
    background: linear-gradient(135deg, #f8fcff 0%, #dff1ff 100%);
}

.hero-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    align-items: center;
    gap: 1.5rem;
}

.hero-copy {
    min-width: 0;
}

.hero-band h1 {
    color: #0f3d63;
    font-size: clamp(2rem, 4vw, 4rem);
    line-height: 1;
    margin-bottom: 1rem;
}

.hero-band p {
    color: #48687f;
    font-size: 1.1rem;
    max-width: 780px;
}

.hero-register-cta {
    display: grid;
    gap: 0.75rem;
    justify-items: start;
    padding: 1.15rem;
    border: 1px solid #b9d8f1;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 12px 28px rgba(39, 104, 154, 0.12);
}

.hero-register-cta h2 {
    margin: 0;
    color: #0f3d63;
    font-size: 1.1rem;
    line-height: 1.25;
}

.hero-register-cta p {
    margin: 0;
    color: #48687f;
    font-size: 0.92rem;
    line-height: 1.45;
}

.section-title {
    color: #0f3d63;
    font-size: 1.45rem;
    margin: 1.75rem 0 1rem;
}

.service-grid,
.metric-grid,
.order-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.service-card,
.order-card,
.panel {
    padding: 1rem;
}

.service-card {
    display: flex;
    flex-direction: column;
}

.service-card .pill {
    margin-bottom: 25px;
    align-self: flex-start;
}

.service-card h2,
.order-card h2,
.panel h2 {
    font-size: 1.05rem;
    color: #0f3d63;
}

.service-card .muted {
    min-height: 4.5em;
    line-height: 1.5;
}

.service-card .button,
.service-card .button-secondary,
.service-card > a:last-child {
    margin-top: auto;
    align-self: flex-start;
}

.compact-section-title {
    margin-top: 1rem;
    margin-bottom: 0.65rem;
}

.home-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.home-portfolio-card {
    padding: 0.8rem;
}

.home-portfolio-card .pill {
    margin-bottom: 0.55rem;
}

.home-portfolio-card h2 {
    margin-bottom: 0.35rem;
}

.home-portfolio-card .muted {
    min-height: 0;
    margin-bottom: 0.55rem;
}

.home-dashboard-hero {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.home-dashboard-hero h1 {
    margin: 0.25rem 0;
    color: #0f3d63;
}

.home-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

@media (max-width: 1280px) {
    .home-dashboard-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.home-stat-card {
    display: grid;
    gap: 0.65rem;
    align-content: start;
}

.home-stat-card .pill {
    justify-self: start;
}

.home-stat-card h2,
.home-devices-panel h2 {
    margin: 0;
}

.home-stat-card strong {
    font-size: 1.45rem;
    color: #12344f;
}

.home-progress {
    width: 100%;
    height: 0.55rem;
    overflow: hidden;
    border-radius: 999px;
    background: #d8e8f5;
}

.home-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #1d7fb8, #23a26d);
}

.home-server-card {
    grid-column: span 1;
}

.home-server-metrics {
    display: grid;
    gap: 0.65rem;
}

.home-metric-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.45rem 0.75rem;
    align-items: center;
}

.home-metric-row span {
    color: #60798f;
    font-weight: 700;
}

.home-metric-row strong {
    justify-self: end;
    font-size: 0.92rem;
}

.home-metric-row-net {
    grid-template-columns: auto max-content;
}

.home-metric-row-net span {
    font-size: 0.7rem;
}

.home-metric-row-net strong {
    font-size: 0.64rem;
    white-space: nowrap;
}

.home-metric-row .home-progress {
    grid-column: 1 / -1;
}

.home-section-heading {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.home-section-heading h2 {
    margin-top: 0.35rem;
}

.home-device-list {
    display: grid;
    gap: 0.65rem;
}

.home-device-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.8rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f8fcff;
}

.status-dot {
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 999px;
    background: #c0392b;
    box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.12);
}

.status-dot.online {
    background: #1f9d55;
    box-shadow: 0 0 0 3px rgba(31, 157, 85, 0.14);
}

.status-dot.offline {
    background: #c0392b;
}

.home-device-row div,
.home-device-meta {
    display: grid;
    gap: 0.2rem;
}

.home-device-meta {
    text-align: right;
}

.muted {
    color: #60798f;
}

.pill {
    display: inline-block;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    background: #e4f3ff;
    color: #1a5e93;
    font-weight: 700;
    font-size: 0.78rem;
}

.danger-pill {
    background: #fff0ef;
    color: #b42318;
}

.form-stack {
    display: grid;
    gap: 1rem;
    max-width: 920px;
}

.admin-accounting-panel form > button[type="submit"] {
    margin-top: 0.85rem;
}

.admin-user-profile-grid {
    margin-bottom: 0.85rem;
}

.qr-code-panel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 264px;
    height: 264px;
    padding: 0.75rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
}

.qr-code-panel svg {
    display: block;
    width: 240px;
    height: 240px;
}

.personal-data-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.personal-data-actions form {
    margin: 0;
}

.top-row-avatar,
.profile-picture-preview {
    border-radius: 999px;
    object-fit: cover;
    border: 2px solid #c7def2;
    background: #ffffff;
}

.top-row-avatar {
    width: 36px;
    height: 36px;
}

.profile-picture-settings {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.25rem;
    padding: 1rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
}

.profile-picture-preview {
    width: 100px;
    height: 100px;
    flex: 0 0 auto;
}

.profile-picture-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #1b6ec2;
    font-weight: 800;
    font-size: 2rem;
}

.profile-avatar-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    background: #1b6ec2;
    font-weight: 800;
    font-size: 0.9rem;
}

.profile-picture-form {
    display: grid;
    gap: 0.5rem;
}

.profile-picture-form label {
    font-weight: 700;
    color: #274e6b;
}

.profile-picture-note {
    color: #526b80;
    font-size: 0.9rem;
}

.profile-account-summary {
    display: grid;
    gap: 0.55rem;
    min-width: min(100%, 320px);
    margin: 0 0 0 auto;
    padding: 0.85rem 1rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
}

.profile-account-summary div {
    min-width: 0;
}

.profile-account-summary dt {
    color: #63798a;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.profile-account-summary dd {
    margin: 0;
    overflow-wrap: anywhere;
    color: #274e6b;
    font-weight: 600;
}

.profile-account-summary a {
    color: #1b6ec2;
}

.profile-public-link {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    max-width: 100%;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
}

.profile-public-link span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.profile-public-link svg {
    width: 0.95rem;
    height: 0.95rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.profile-manage-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.profile-manage-form {
    min-width: 0;
    width: 100%;
}

.public-profile-settings {
    display: grid;
    gap: 1rem;
    margin: 1.25rem 0;
    padding: 1rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
}

.public-profile-heading-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.public-profile-heading-row h4,
.public-profile-theme-picker h5,
.public-profile-list-editor h5 {
    margin: 0;
    color: #274e6b;
}

.public-profile-theme-picker {
    display: grid;
    gap: 0.75rem;
}

.public-profile-theme-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.8rem;
}

.public-profile-theme-card {
    position: relative;
    display: grid;
    gap: 0.65rem;
    min-width: 0;
    padding: 0.75rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.public-profile-theme-card:hover,
.public-profile-theme-card:focus-within {
    border-color: #6ba9da;
    box-shadow: 0 10px 28px rgba(23, 90, 143, 0.12);
    transform: translateY(-1px);
}

.public-profile-theme-card input {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 1rem;
    height: 1rem;
    accent-color: #1d78bd;
}

.public-profile-theme-card:has(input:checked) {
    border-color: #1d78bd;
    box-shadow: 0 0 0 3px rgba(29, 120, 189, 0.16);
}

.public-profile-theme-preview {
    display: flex;
    gap: 0.6rem;
    min-height: 7.4rem;
    padding: 0.75rem;
    border: 1px solid var(--theme-preview-border);
    border-radius: 8px;
    background: var(--theme-preview-bg);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 8px 22px var(--theme-preview-shadow);
    color: var(--theme-preview-text);
    font-family: var(--theme-preview-font);
    overflow: hidden;
}

.theme-preview-avatar {
    flex: 0 0 2.2rem;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    background: var(--theme-preview-accent);
    box-shadow: 0 0 0 4px var(--theme-preview-card);
}

.theme-preview-content {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
    width: 100%;
}

.theme-preview-title,
.theme-preview-line,
.theme-preview-panels span {
    display: block;
    border-radius: 999px;
}

.theme-preview-title {
    width: 58%;
    height: 0.75rem;
    background: var(--theme-preview-text);
}

.theme-preview-line {
    width: 82%;
    height: 0.45rem;
    background: var(--theme-preview-muted);
}

.theme-preview-panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.4rem;
    margin-top: 0.2rem;
}

.theme-preview-panels span {
    height: 2.5rem;
    border: 1px solid var(--theme-preview-border);
    border-radius: 7px;
    background: var(--theme-preview-panel);
}

.public-profile-theme-copy {
    display: grid;
    gap: 0.15rem;
    padding-right: 1.3rem;
}

.public-profile-theme-copy strong {
    color: #274e6b;
    line-height: 1.2;
}

.public-profile-theme-copy small {
    color: #60798f;
    line-height: 1.35;
}

.public-bio-input {
    min-height: 7rem;
}

.public-profile-toggles {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.public-profile-toggle-card {
    display: grid;
    gap: 0.65rem;
    min-height: 100%;
    padding: 0.7rem 0.85rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #ffffff;
}

.public-profile-toggle-card .form-check {
    padding-left: 2rem;
}

.public-profile-placement-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.public-profile-placement-grid label {
    display: grid;
    gap: 0.35rem;
    color: #274e6b;
    font-weight: 700;
}

.public-profile-list-editor {
    display: grid;
    gap: 0.65rem;
}

.public-profile-list-row {
    display: grid;
    grid-template-columns: minmax(6rem, 0.25fr) minmax(8rem, 0.35fr) minmax(8rem, 0.45fr) minmax(12rem, 1fr);
    gap: 0.6rem;
}

.public-profile-link-row {
    grid-template-columns: minmax(6rem, 0.25fr) minmax(10rem, 0.4fr) minmax(16rem, 1fr);
}

.profile-install-panel {
    position: sticky;
    top: 1rem;
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
}

.profile-install-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.profile-copy-message {
    margin: 0;
    padding: 0.65rem 0.75rem;
    border: 1px solid #b8d8f0;
    border-radius: 6px;
    background: #f2f8fd;
    color: #274e6b;
    font-size: 0.92rem;
}

.profile-install-code {
    min-width: 0;
}

.profile-install-code .key-script {
    max-height: 560px;
    overflow: auto;
    margin: 0;
    padding: 1rem;
    border-radius: 8px;
    background: #0f2233;
    color: #e9f6ff;
    font-size: 0.78rem;
    line-height: 1.35;
    white-space: pre;
}

.devices-manage-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.device-enrollment-panel,
.device-list-panel {
    padding: 1rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
}

.device-list-panel {
    min-width: 0;
}

.device-card-list {
    display: grid;
    gap: 0.85rem;
}

.device-card {
    display: grid;
    gap: 0.85rem;
    padding: 0.9rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
}

.device-card-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.device-card-header .muted {
    display: block;
    overflow-wrap: anywhere;
    font-size: 0.82rem;
}

.device-card-details {
    display: grid;
    gap: 0.45rem;
    margin: 0;
}

.device-card-details div {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: 0.75rem;
}

.device-card-details dt {
    color: #63798a;
    font-size: 0.82rem;
    font-weight: 700;
}

.device-card-details dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.device-install-panel {
    margin-top: 1.5rem;
}

.device-services {
    border: 1px solid #c7def2;
    border-radius: 8px;
    padding: 0.85rem 1rem 1rem;
    background: #f7fbff;
}

.device-services legend {
    float: none;
    width: auto;
    margin-bottom: 0.65rem;
    padding: 0 0.25rem;
    color: #446982;
    font-size: 0.85rem;
    font-weight: 700;
}

.device-service-option {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    margin-bottom: 0.75rem;
    cursor: pointer;
}

.device-service-option:last-child {
    margin-bottom: 0;
}

.device-service-option small {
    display: block;
    color: #63798a;
    line-height: 1.35;
}

.device-route-summary {
    display: grid;
    gap: 0.2rem;
    margin-bottom: 1rem;
    padding: 0.75rem;
    border: 1px solid #c7def2;
    border-radius: 6px;
    background: #f7fbff;
    color: #274e6b;
    font-size: 0.9rem;
}

.devices-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(320px, 1.15fr);
    gap: 1.25rem;
    align-items: start;
}

.device-enrollment-card,
.enrolled-devices-card,
.vpn-profile-result {
    background: #ffffff;
}

.device-list {
    display: grid;
    gap: 0.85rem;
}

.device-list-item {
    display: grid;
    gap: 0.7rem;
    padding: 0.85rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
}

.device-list-item > div:first-child {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    justify-content: space-between;
}

.device-list-item dl {
    display: grid;
    gap: 0.45rem;
    margin: 0;
}

.device-list-item dl div {
    display: grid;
    grid-template-columns: 5.5rem minmax(0, 1fr);
    gap: 0.75rem;
}

.device-list-item dt {
    color: #63798a;
    font-size: 0.82rem;
    font-weight: 700;
}

.device-list-item dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.device-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.vpn-profile-result {
    margin-top: 1.5rem;
}

.vpn-script-panel {
    display: grid;
    gap: 0.75rem;
    padding: 0.9rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
}

.vpn-script-panel-header {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
}

.vpn-script-panel-header h5 {
    margin: 0;
    color: #274e6b;
}

.vpn-script-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.android-setup-mode {
    padding: 0.85rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #f7fbff;
}

.android-setup-mode h5 {
    margin-bottom: 0.35rem;
    color: #274e6b;
}

.android-setup-mode p {
    margin-bottom: 0;
}

.android-setup-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.35rem;
}

.android-install-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.35rem;
}

.android-install-card {
    display: grid;
    gap: 1rem;
    align-content: center;
    justify-items: center;
    min-height: min(42rem, 82vh);
    padding: 1.25rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #ffffff;
    text-align: center;
}

.android-install-card h5 {
    margin-bottom: 0.25rem;
    color: #274e6b;
}

.android-install-card p {
    margin-bottom: 0;
}

.android-setup-card {
    display: grid;
    gap: 0.85rem;
    align-content: center;
    justify-items: center;
    min-height: min(42rem, 82vh);
    padding: 1.25rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #f7fbff;
    text-align: center;
}

.android-setup-card > .vpn-script-actions {
    align-self: end;
    margin-top: auto;
}

.android-setup-card h5 {
    margin-bottom: 0.25rem;
    color: #274e6b;
}

.android-setup-card p {
    margin-bottom: 0;
}

.android-flow-step {
    scroll-margin-top: 1rem;
}

.android-flow-kicker {
    margin-bottom: 0.35rem;
    color: #4d708a;
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.android-flow-next {
    max-width: 38rem;
    margin-top: 0.25rem;
    color: #63798a;
    font-size: 0.92rem;
    font-weight: 700;
}

.qr-code-frame {
    --hdcs-setup-qr-size: 27.2rem;
    display: grid;
    place-items: center;
    width: min(100%, var(--hdcs-setup-qr-size));
    margin-inline: auto;
    padding: 0.75rem;
    border: 1px solid #d9e8f5;
    border-radius: 8px;
    background: #ffffff;
}

.qr-code-frame svg {
    display: block;
    width: 100%;
    height: auto;
}

.android-install-qr {
    width: min(100%, var(--hdcs-setup-qr-size));
    padding: 0.75rem;
}

.pocketshell-qr-sequence {
    display: grid;
    gap: 0.85rem;
}

.pocketshell-qr-item {
    display: grid;
    gap: 0.45rem;
    justify-items: center;
}

.pocketshell-alt-qr {
    display: grid;
    gap: 0.75rem;
}

.pocketshell-alt-qr summary {
    cursor: pointer;
    color: #275d86;
    font-weight: 700;
}

.pocketshell-status {
    display: grid;
    gap: 0.55rem;
}

.pocketshell-log {
    overflow: auto;
    min-height: 12rem;
    max-height: 28rem;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 0.55em;
    line-height: 1;
    white-space: pre;
}

.set-password-panel {
    width: 100%;
}

.set-password-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.email-settings-hero {
    display: grid;
    gap: 1rem;
}

.email-settings-hero .actions,
.email-settings-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.email-settings-summary h2 {
    margin-bottom: 0.25rem;
}

.email-settings-summary {
    margin-bottom: 1rem;
}

.email-app-passwords {
    margin-bottom: 1rem;
    max-width: none;
}

.email-app-password-once {
    display: grid;
    gap: 0.5rem;
    padding: 1rem;
    border: 1px solid rgba(34, 197, 94, 0.35);
    border-radius: 8px;
    background: rgba(34, 197, 94, 0.08);
}

.email-app-password-copy,
.email-app-password-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: end;
}

.email-app-password-copy input {
    width: 100%;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

.email-app-password-list {
    display: grid;
    gap: 0.5rem;
}

.email-app-password-list h3 {
    margin: 0;
    font-size: 1rem;
}

.email-app-password-list ul {
    display: grid;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.email-app-password-list li {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    justify-content: space-between;
    padding: 0.75rem;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.email-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: stretch;
}

.email-settings-column {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.email-settings-column-fill {
    grid-template-rows: auto minmax(0, 1fr);
}

.email-settings-auto-reply {
    min-height: 100%;
}

.email-settings-grid .form-stack {
    max-width: none;
}

.email-settings-date-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.email-settings-save {
    width: 100%;
    margin-top: 1rem;
    justify-content: center;
}

@media (max-width: 1100px) {
    .profile-manage-grid,
    .devices-manage-grid,
    .devices-layout {
        grid-template-columns: 1fr;
    }

    .profile-install-panel {
        position: static;
    }
}

@media (max-width: 720px) {
    .set-password-fields {
        grid-template-columns: 1fr;
    }

    .email-settings-grid,
    .email-settings-date-grid,
    .email-app-password-copy,
    .email-app-password-form {
        grid-template-columns: 1fr;
    }

    .public-profile-heading-row,
    .public-profile-theme-grid,
    .public-profile-placement-grid,
    .public-profile-toggles,
    .public-profile-list-row,
    .public-profile-link-row,
    .android-setup-grid,
    .vpn-script-panel-header {
        grid-template-columns: 1fr;
    }

    .vpn-script-panel-header {
        display: grid;
    }

    .vpn-script-actions {
        justify-content: stretch;
    }

    .vpn-script-actions .button,
    .vpn-script-actions .button-secondary {
        flex: 1 1 12rem;
    }

    .public-profile-heading-row {
        display: grid;
    }

    .profile-picture-settings {
        align-items: flex-start;
    }

    .profile-account-summary {
        flex-basis: 100%;
        margin-left: 0;
    }
}

.field {
    display: grid;
    gap: 0.35rem;
}

.script-output {
    max-height: 420px;
    overflow: auto;
    padding: 1rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #0f2233;
    color: #e9f6ff;
    font-size: 0.82rem;
    line-height: 1.35;
    white-space: pre-wrap;
}

.field label {
    font-weight: 700;
    color: #274e6b;
}

.field input,
.field textarea,
.field select {
    border: 1px solid #a9cce8;
    border-radius: 6px;
    padding: 0.65rem 0.75rem;
    background: #fbfdff;
}

.field textarea {
    min-height: 110px;
}

.admin-table input,
.admin-table select {
    max-width: 100%;
    border: 1px solid #a9cce8;
    border-radius: 6px;
    padding: 0.45rem 0.55rem;
    background: #fbfdff;
}

.admin-table-compact-input {
    width: 5.5rem;
    margin-left: 0.4rem;
    text-transform: uppercase;
}

.inline-checkbox {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    font-weight: 700;
    color: #274e6b;
}

.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.5rem;
}

.inline-login-form,
.inline-action-form {
    display: inline-flex;
    margin: 0;
}

.quote-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.button,
.button-secondary,
.button-danger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border-radius: 6px;
    padding: 0.55rem 0.9rem;
    text-decoration: none;
    border: 1px solid #1b6fae;
    font-weight: 700;
}

.button {
    background: #1b6fae;
    color: #fff;
}

.button-secondary {
    background: #fff;
    color: #1b6fae;
}

.button-danger {
    border-color: #b42318;
    background: #b42318;
    color: #fff;
}

.danger-panel {
    border-color: #f0b8b4;
    background: #fff8f7;
}

.web-app-landing {
    display: grid;
    gap: 1.75rem;
}

.landing-hero {
    padding: 2.35rem;
}

.landing-hero h1 {
    max-width: 940px;
}

.landing-copy {
    max-width: 860px;
    color: #48687f;
    font-size: 1.02rem;
    line-height: 1.6;
}

.landing-card-grid,
.process-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.compact-grid {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.landing-small-card {
    min-height: 100%;
}

.landing-small-card h3 {
    color: #0f3d63;
    font-size: 1rem;
    line-height: 1.35;
    margin: 0;
}

.documentation-page {
    width: 100%;
}

.documentation-hero .actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
}

.documentation-overview {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
    gap: 1.25rem;
    align-items: start;
}

.documentation-toc {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}

.documentation-toc a {
    display: block;
    border: 1px solid #d8e9f7;
    border-radius: 8px;
    padding: .65rem .75rem;
    color: #0f3d63;
    background: #f7fbff;
    font-weight: 700;
    text-decoration: none;
}

.documentation-toc a:hover {
    border-color: #1b6fae;
    background: #fff;
}

.documentation-visual-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.documentation-wide-card {
    grid-column: 1 / -1;
}

.documentation-diagram-card {
    min-height: 100%;
}

.documentation-diagram-card h3,
.documentation-reference-card h3,
.documentation-security-item h3,
.documentation-glossary h2 {
    color: #0f3d63;
    margin: .45rem 0 .55rem;
}

.documentation-diagram-card p,
.documentation-security-item p {
    color: #48687f;
    line-height: 1.55;
}

.documentation-flow-diagram {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr) 42px minmax(0, 1fr);
    align-items: center;
    gap: .55rem;
    margin-top: 1rem;
}

.doc-node {
    display: grid;
    align-content: center;
    gap: .3rem;
    min-height: 92px;
    border: 1px solid #c9def0;
    border-radius: 8px;
    padding: .8rem;
    background: #f8fbff;
}

.doc-node-strong {
    border-color: #8dbde1;
    background: #e8f5ff;
}

.doc-node strong {
    color: #0f3d63;
}

.doc-node span {
    color: #48687f;
    font-size: .86rem;
}

.doc-arrow {
    position: relative;
    height: 2px;
    background: #8dbde1;
}

.doc-arrow::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 8px;
    height: 8px;
    border-top: 2px solid #8dbde1;
    border-right: 2px solid #8dbde1;
    transform: translateY(-50%) rotate(45deg);
}

.documentation-path {
    display: grid;
    gap: .75rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.documentation-path li {
    display: grid;
    grid-template-columns: 2.1rem minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
}

.documentation-path > li > span {
    display: inline-grid;
    place-items: center;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 999px;
    background: #1b6fae;
    color: #fff;
    font-weight: 800;
}

.documentation-path p {
    margin: .2rem 0 0;
}

.documentation-screen-map {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr) 190px;
    gap: .8rem;
    margin-top: 1rem;
    border: 1px solid #c9def0;
    border-radius: 10px;
    padding: .8rem;
    background: #eef7ff;
}

.doc-screen-sidebar,
.doc-screen-content,
.doc-screen-help {
    border: 1px solid #d8e9f7;
    border-radius: 8px;
    padding: .75rem;
    background: #fff;
}

.doc-screen-sidebar {
    display: grid;
    gap: .45rem;
}

.doc-screen-sidebar span {
    border-radius: 6px;
    padding: .38rem .5rem;
    background: #e8f5ff;
    color: #0f3d63;
    font-weight: 700;
}

.doc-screen-content {
    display: grid;
    gap: .75rem;
}

.doc-screen-topbar {
    border-bottom: 1px solid #d8e9f7;
    padding-bottom: .55rem;
    color: #0f3d63;
    font-weight: 800;
}

.doc-screen-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.doc-screen-grid span {
    display: grid;
    place-items: center;
    min-height: 52px;
    border: 1px solid #d8e9f7;
    border-radius: 8px;
    background: #f8fbff;
    color: #193247;
    font-weight: 700;
    text-align: center;
}

.doc-screen-help {
    display: grid;
    align-content: center;
    gap: .35rem;
    color: #48687f;
}

.doc-screen-help strong {
    color: #0f3d63;
}

.documentation-manual {
    display: grid;
    gap: 1rem;
}

.documentation-section {
    scroll-margin-top: 5.5rem;
}

.documentation-section h3,
.documentation-workflows h3,
.documentation-note h2 {
    color: #0f3d63;
}

.documentation-section h3 {
    margin: .45rem 0 .55rem;
}

.documentation-section p {
    color: #48687f;
    line-height: 1.58;
}

.documentation-section ul {
    margin: .85rem 0 0;
    padding-left: 1.2rem;
    color: #22384b;
}

.documentation-section li + li {
    margin-top: .45rem;
}

.documentation-workflows .process-card {
    min-height: 100%;
}

.documentation-note {
    border-color: #c9def0;
    background: #f8fbff;
}

.documentation-reference-grid,
.documentation-security-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
}

.documentation-reference-card dl {
    display: grid;
    gap: .45rem;
    margin: 0;
}

.documentation-reference-card dt {
    color: #0f3d63;
    font-weight: 800;
}

.documentation-reference-card dd {
    margin: 0 0 .45rem;
    color: #48687f;
    line-height: 1.5;
}

.documentation-glossary > div {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: .8rem;
    margin-top: 1rem;
}

.documentation-glossary dl {
    margin: 0;
    border-top: 1px solid #d8e9f7;
    padding-top: .75rem;
}

.documentation-glossary dt {
    color: #0f3d63;
    font-weight: 800;
}

.documentation-glossary dd {
    margin: .3rem 0 0;
    color: #48687f;
    line-height: 1.5;
}

.roadmap-card h3 {
    color: #0f3d63;
    font-size: 1.06rem;
    margin: 0 0 0.55rem;
}

.roadmap-card .muted {
    min-height: 0;
}

.outcome-table {
    display: grid;
    gap: 0;
    padding: 0;
    overflow: hidden;
}

.outcome-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1.2fr;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid #d8e9f7;
}

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

.roadmap-model-row {
    grid-template-columns: 0.75fr 1.35fr 1.1fr;
}

.outcome-header {
    color: #0f3d63;
    background: #e8f5ff;
}

.landing-trust p {
    max-width: 920px;
    color: #48687f;
    line-height: 1.6;
}

.roadmap-highlight {
    display: grid;
    gap: 1rem;
}

.capability-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

.capability-list span {
    padding: 0.35rem 0.6rem;
    border: 1px solid #b9d8f1;
    border-radius: 999px;
    background: #f4fbff;
    color: #1a5e93;
    font-size: 0.86rem;
    font-weight: 700;
}

.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
}

.portfolio-card {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.portfolio-card h3 {
    margin: 0.75rem 0 0.45rem;
    color: #0f3d63;
    font-size: 1.08rem;
}

.portfolio-card h4 {
    margin: 0 0 0.35rem;
    color: #0f3d63;
    font-size: 0.92rem;
}

.portfolio-card p {
    margin: 0;
    color: #48687f;
    line-height: 1.55;
}

.portfolio-card .button-secondary {
    margin-top: auto;
    align-self: flex-start;
}

.roadmap-bundle-card {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.roadmap-bundle-card h3 {
    margin: 0;
    color: #0f3d63;
    font-size: 1.1rem;
}

.roadmap-bundle-card p {
    margin: 0;
    color: #48687f;
    line-height: 1.55;
}

.roadmap-bundle-card ul {
    margin: 0.25rem 0 0;
    padding-left: 1.1rem;
    color: #48687f;
}

.roadmap-platinum {
    display: grid;
    gap: 1rem;
    border-color: #9fc9ea;
    background: linear-gradient(135deg, #ffffff 0%, #eaf7ff 100%);
}

.roadmap-platinum-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.roadmap-platinum-heading h2 {
    margin: 0.55rem 0 0;
    color: #0f3d63;
}

.roadmap-platinum-heading strong {
    display: inline-flex;
    align-items: center;
    min-height: 2.1rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid #9fc9ea;
    border-radius: 999px;
    background: #ffffff;
    color: #0f5b96;
    font-size: 0.95rem;
}

.roadmap-platinum p {
    margin: 0;
    color: #48687f;
    line-height: 1.6;
}

.roadmap-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 0.55rem;
}

.roadmap-feature-grid span {
    padding: 0.55rem 0.7rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.78);
    color: #274e6b;
    font-size: 0.9rem;
    font-weight: 700;
}

.roadmap-domain-note {
    padding-top: 0.25rem;
}

.forum-intro,
.forum-topic-heading,
.forum-post-header,
.forum-admin-category-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.forum-intro h2,
.forum-compose-panel h2,
.forum-admin-category-card h3 {
    margin: 0 0 0.35rem;
    color: #0f3d63;
    font-size: 1.1rem;
}

.forum-search-panel {
    padding: 0.75rem;
}

.forum-search-row {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.forum-search-row input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.55rem 0.7rem;
    border: 1px solid #b9d8f1;
    border-radius: 6px;
}

.forum-category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1rem;
}

.forum-category-card h2 a,
.forum-topic-card h3 a,
.forum-topic-heading a {
    color: #0f5b96;
}

.forum-card-meta {
    display: grid;
    gap: 0.25rem;
    margin: 0.5rem 0 0.9rem;
    color: #60798f;
    font-size: 0.88rem;
}

.forum-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1rem;
    align-items: start;
}

.forum-topic-list,
.forum-post-list,
.forum-admin-category-list {
    display: grid;
    gap: 0.8rem;
}

.forum-topic-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.forum-topic-card h3,
.forum-topic-heading h1 {
    margin: 0 0 0.35rem;
}

.forum-compose-panel {
    display: grid;
    gap: 0.75rem;
}

.forum-form-stack {
    max-width: none;
}

.forum-post-card p,
.forum-topic-body p {
    white-space: pre-wrap;
}

.forum-hidden-item {
    border-color: #e8c27d;
    background: #fffaf0;
}

.forum-moderation-actions {
    justify-content: flex-end;
}

.process-card {
    position: relative;
    padding-top: 2.4rem;
}

.process-number {
    position: absolute;
    top: 0.9rem;
    left: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 999px;
    background: #1b6fae;
    color: #fff;
    font-weight: 800;
    font-size: 0.8rem;
}

.process-card p {
    margin: 0;
    color: #48687f;
}

.landing-note {
    margin-top: 0.7rem;
}

.landing-form-section {
    display: grid;
    grid-template-columns: minmax(220px, 0.75fr) minmax(280px, 1.25fr);
    gap: 1.25rem;
    align-items: start;
}

.landing-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.landing-consent {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    margin-top: 1rem;
    color: #48687f;
}

.landing-consent input {
    margin-top: 0.25rem;
}

.landing-honeypot {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.auth-gate {
    max-width: 680px;
}

.table-actions {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.admin-toolbar,
.contact-message-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    max-width: 100%;
    min-width: 0;
    flex-wrap: wrap;
}

.admin-toolbar .actions {
    margin-top: 0;
}

.admin-toolbar > * {
    min-width: 0;
}

.admin-search-input {
    box-sizing: border-box;
    width: min(18rem, 100%);
    max-width: 100%;
    padding: 0.55rem 0.7rem;
    border: 1px solid #b9d4e8;
    border-radius: 8px;
    background: #ffffff;
    color: #17364f;
}

.contact-message-list {
    display: grid;
    gap: 1rem;
}

.contact-message-card-unread {
    border-color: #6fb3e6;
    box-shadow: 0 10px 24px rgba(27, 111, 174, 0.14);
}

.keo-document-card {
    padding: 0;
    overflow: hidden;
}

.keo-document-card[open] {
    padding-bottom: 1rem;
}

.keo-document-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    cursor: pointer;
    list-style: none;
}

.keo-document-summary::-webkit-details-marker {
    display: none;
}

.keo-document-summary::before {
    content: "+";
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 1.45rem;
    height: 1.45rem;
    border: 1px solid #b9d8f1;
    border-radius: 999px;
    color: #1b6fae;
    font-weight: 900;
}

.keo-document-card[open] > .keo-document-summary::before {
    content: "-";
}

.keo-document-summary-main {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.keo-document-summary-main strong,
.keo-document-summary-main .muted {
    overflow-wrap: anywhere;
}

.keo-document-summary-meta {
    display: inline-flex;
    flex: 0 0 auto;
}

.keo-document-expanded-header,
.keo-document-card .answer-list,
.keo-document-card .table-actions {
    margin-inline: 1rem;
}

.legal-panel {
    margin-bottom: 1rem;
    padding: 1rem;
}

.legal-panel h4 {
    margin: 0 0 0.7rem;
}

.legal-panel p:last-child {
    margin-bottom: 0;
}

.legal-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.8rem;
}

.keo-upload-form {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.keo-upload-grid,
.keo-document-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.keo-upload-grid label {
    display: grid;
    gap: 0.45rem;
    color: #17364f;
    font-weight: 700;
}

.keo-upload-grid input {
    width: 100%;
    padding: 0.6rem;
    border: 1px solid #b9d4e8;
    border-radius: 8px;
    background: #ffffff;
    font-weight: 400;
}

.keo-document-card {
    display: grid;
    gap: 0.75rem;
    min-width: 0;
}

.keo-document-meta {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.keo-document-preview,
.keo-provider-document-preview,
.keo-document-placeholder {
    width: 100%;
    aspect-ratio: 16 / 10;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #eef7ff;
}

.keo-document-preview {
    object-fit: cover;
    filter: blur(10px);
    transform: scale(0.98);
}

.keo-provider-document-preview {
    object-fit: contain;
    background: #ffffff;
}

.keo-document-placeholder {
    display: grid;
    place-items: center;
    color: #48687f;
    font-weight: 700;
}

.keo-document-private-preview {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.keo-document-private-preview::before {
    content: "";
    position: absolute;
    inset: -24px;
    background:
        linear-gradient(135deg, rgba(11, 51, 83, 0.22), rgba(37, 116, 169, 0.14)),
        repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.7) 0 14px, rgba(173, 211, 237, 0.85) 14px 30px),
        repeating-linear-gradient(0deg, rgba(20, 71, 108, 0.14) 0 10px, transparent 10px 22px);
    filter: blur(10px);
    transform: scale(1.08);
    z-index: -1;
}

.keo-document-private-preview span {
    padding: 0.4rem 0.65rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.82);
}

.contact-message-header h2 {
    margin: 0 0 0.2rem;
}

.contact-message-meta {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.contact-message-body {
    white-space: pre-wrap;
    color: #274e6b;
    line-height: 1.5;
}

.table-list {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.table-list th,
.table-list td {
    border-bottom: 1px solid #d8e8f5;
    padding: 0.8rem;
    text-align: left;
    vertical-align: top;
}

.answer-list {
    display: grid;
    gap: 0.65rem;
}

.answer-list dt {
    font-weight: 700;
    color: #274e6b;
}

.lead-detail-grid {
    grid-template-columns: minmax(150px, 0.35fr) minmax(0, 1fr);
    gap: 0.45rem 0.9rem;
}

.lead-detail-grid dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.lead-section-heading {
    margin: 1rem 0 0.35rem;
    color: #0f3d63;
    font-size: 0.95rem;
}

.lead-details {
    margin-top: 1rem;
    color: #274e6b;
}

.lead-details summary {
    cursor: pointer;
    font-weight: 700;
    color: #1b6fae;
}

.lead-details .answer-list {
    margin-top: 0.75rem;
}

.cookie-consent {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1050;
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    padding: 1rem;
    border: 1px solid #9fc7e8;
    border-radius: 8px;
    background: #f8fcff;
    box-shadow: 0 18px 42px rgba(24, 82, 126, 0.22);
}

.cookie-consent[hidden] {
    display: none;
}

.cookie-consent h2 {
    margin: 0 0 0.25rem;
    font-size: 1rem;
    color: #0f3d63;
}

.cookie-consent p {
    max-width: 860px;
    margin: 0;
    color: #526b80;
}

.cookie-consent a {
    color: #1b6fae;
    font-weight: 700;
}

.cookie-consent__options,
.cookie-consent__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.cookie-consent__options {
    margin-top: 0.75rem;
}

.cookie-consent__options label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #274e6b;
    font-weight: 700;
}

.cookie-consent__actions {
    justify-content: flex-end;
}

.cookie-settings-link {
    display: inline-flex;
    margin-top: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #1b6fae;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

.cookie-settings-link:focus-visible,
.cookie-modal button:focus-visible,
.cookie-consent button:focus-visible,
.cookie-category-toggle input:focus-visible {
    outline: 3px solid #80c6ff;
    outline-offset: 2px;
}

.cookie-modal {
    position: fixed;
    inset: 0;
    z-index: 1060;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(15, 61, 99, 0.32);
}

.cookie-modal[hidden] {
    display: none;
}

.cookie-modal__panel {
    width: min(620px, 100%);
    max-height: min(720px, calc(100vh - 2rem));
    overflow: auto;
    padding: 1rem;
    border: 1px solid #9fc7e8;
    border-radius: 8px;
    background: #f8fcff;
    box-shadow: 0 24px 60px rgba(24, 82, 126, 0.28);
}

.cookie-modal__header,
.cookie-modal__actions,
.cookie-category {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.cookie-modal__header {
    margin-bottom: 0.85rem;
}

.cookie-modal__header h2,
.cookie-category h3 {
    margin: 0;
    color: #0f3d63;
}

.cookie-modal__header h2 {
    font-size: 1.2rem;
}

.cookie-modal__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid #b9d8f1;
    border-radius: 999px;
    background: #fff;
    color: #0f3d63;
    font-size: 1.25rem;
    line-height: 1;
}

.cookie-category {
    margin-top: 0.75rem;
    padding: 0.85rem;
    border: 1px solid #d8e8f5;
    border-radius: 8px;
    background: #fff;
}

.cookie-category p {
    margin: 0.25rem 0 0;
    color: #526b80;
    line-height: 1.45;
}

.cookie-category-toggle {
    cursor: pointer;
}

.cookie-category-toggle input {
    width: 1.35rem;
    height: 1.35rem;
    flex: 0 0 auto;
}

.cookie-modal__actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 1rem;
}

.h-disk-summary,
.h-disk-toolbar,
.h-disk-row,
.h-disk-share-card {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.h-disk-summary {
    margin-bottom: 1.5rem;
}

.h-disk-summary h2,
.h-disk-toolbar h2,
.h-disk-actions-panel h2,
.h-disk-shares h2 {
    margin: 0;
    color: #0f3d63;
}

.h-disk-usage {
    min-width: 10rem;
    padding: 0.85rem 1rem;
    border: 1px solid #d8e8f5;
    border-radius: 8px;
    background: #f8fcff;
    text-align: right;
}

.h-disk-usage span,
.h-disk-usage small {
    display: block;
}

.h-disk-usage span {
    color: #0f3d63;
    font-size: 1.35rem;
    font-weight: 800;
}

.h-disk-usage small,
.h-disk-path {
    color: #526b80;
}

.h-disk-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1.5rem;
    align-items: start;
}

.h-disk-browser,
.h-disk-side,
.h-disk-actions-panel,
.h-disk-shares {
    display: grid;
    gap: 1rem;
}

.h-disk-toolbar {
    align-items: flex-start;
}

.h-disk-inline-tools,
.h-disk-inline-tools form,
.h-disk-upload-tool,
.h-disk-actions,
.h-disk-action-grid form {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    flex-wrap: wrap;
}

.h-disk-inline-tools {
    padding: 0.85rem;
    border: 1px solid #d8e8f5;
    border-radius: 8px;
    background: #f8fcff;
}

.h-disk-inline-tools input[type="text"],
.h-disk-actions-panel input {
    min-width: 0;
    padding: 0.55rem 0.7rem;
    border: 1px solid #b9d8f1;
    border-radius: 6px;
}

.h-disk-table {
    border: 1px solid #d8e8f5;
    border-radius: 8px;
    overflow: hidden;
}

.h-disk-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(80px, 0.35fr) minmax(130px, 0.45fr) minmax(180px, auto);
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid #e8f1f8;
}

.h-disk-row:last-child {
    border-bottom: 0;
}

.h-disk-head {
    background: #f0f7fc;
    color: #0f3d63;
    font-weight: 800;
}

.h-disk-name,
.h-disk-entry-link {
    min-width: 0;
}

.h-disk-entry-link {
    display: inline-flex;
    gap: 0.5rem;
    align-items: center;
    border: 0;
    background: transparent;
    color: #1b6fae;
    font: inherit;
    font-weight: 800;
    text-align: left;
    cursor: pointer;
}

.h-disk-entry-icon {
    color: #0f8a83;
    font-weight: 900;
}

.h-disk-actions {
    justify-content: flex-end;
}

.button-compact {
    padding: 0.35rem 0.55rem;
    font-size: 0.86rem;
}

.credit-buy-panel {
    max-width: none;
}

.credits-section {
    box-sizing: border-box;
    width: 100%;
    max-width: none;
}

.credit-balance-value {
    margin: 0;
    color: #0f3d63;
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.1;
}

.credit-package-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    column-gap: 1rem;
    row-gap: 1rem;
    align-items: stretch;
    width: 100%;
}

.credit-package-card {
    display: flex;
    min-height: 205px;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #c7def2;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 10px 24px rgba(39, 104, 154, 0.08);
}

.credit-package-card h3 {
    margin: 0 0 0.5rem;
    color: #0f3d63;
    font-size: 1rem;
    line-height: 1.25;
}

.credit-package-credits {
    margin: 0;
    color: #48687f;
    font-size: 0.9rem;
}

.credit-package-price {
    margin: 0.55rem 0 0;
    color: #143d59;
    font-size: 1.2rem;
    font-weight: 800;
}

.credit-package-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(92px, max-content));
    column-gap: 0.9rem;
    row-gap: 0.65rem;
    align-items: end;
    margin-top: auto;
    padding-top: 0.75rem;
    border-top: 1px solid #e4f0fa;
}

.credit-package-actions .button {
    min-height: 34px;
    padding-inline: 0.7rem;
    white-space: nowrap;
}

.table-pagination-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.page-size-control {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 100%;
    min-width: 0;
    color: #274e6b;
    font-size: 0.92rem;
    font-weight: 800;
}

.page-size-control select {
    min-width: 4.5rem;
    border: 1px solid #a9cce8;
    border-radius: 6px;
    background: #fbfdff;
    color: #143d59;
    font: inherit;
    font-weight: 700;
    padding: 0.35rem 0.5rem;
}

.pagination-summary {
    margin: 0;
    color: #60798f;
    font-size: 0.9rem;
}

.pagination-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.35rem;
    margin-top: 0.85rem;
}

.pagination-button {
    min-width: 2.05rem;
    min-height: 2.05rem;
    border: 1px solid #b9d8f1;
    border-radius: 6px;
    background: #ffffff;
    color: #1b6fae;
    font: inherit;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
}

.pagination-button:not(:disabled):hover,
.pagination-button:not(:disabled):focus-visible {
    border-color: #1b6fae;
    background: #eef7ff;
}

.pagination-button.active {
    border-color: #1b6fae;
    background: #1b6fae;
    color: #ffffff;
}

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

.pagination-ellipsis {
    color: #60798f;
    font-weight: 800;
    padding: 0 0.15rem;
}

.danger-button {
    border-color: #9f1d1d;
    background: #9f1d1d;
}

.h-disk-empty {
    padding: 2rem;
    border: 1px dashed #b9d8f1;
    border-radius: 8px;
    text-align: center;
}

.h-disk-action-grid {
    display: grid;
    gap: 0.75rem;
}

.h-disk-actions-panel input {
    width: 100%;
}

.h-disk-share-card {
    align-items: flex-start;
    padding: 0.75rem;
    border: 1px solid #d8e8f5;
    border-radius: 8px;
    background: #fff;
}

.h-disk-share-card strong,
.h-disk-share-card span,
.h-disk-share-card a {
    overflow-wrap: anywhere;
}

.shell-layout {
    width: 100vw;
    height: 100vh;
    background: #0b1117;
    overflow: hidden;
}

@media (max-width: 760px) {
    .landing-hero {
        padding: 1.25rem;
    }

    .outcome-row,
    .landing-form-section,
    .landing-form-grid,
    .hero-content,
    .forum-layout,
    .lead-detail-grid,
    .home-portfolio-grid,
    .h-disk-layout,
    .h-disk-row,
    .home-device-row,
    .keo-upload-grid,
    .keo-document-grid {
        grid-template-columns: 1fr;
    }

    .h-disk-summary,
    .h-disk-toolbar,
    .home-dashboard-hero,
    .home-section-heading,
    .h-disk-share-card {
        flex-direction: column;
        align-items: stretch;
    }

    .home-device-meta {
        text-align: left;
    }

    .home-dashboard-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.65rem;
    }

    .home-dashboard-grid .home-stat-card {
        padding: 0.65rem;
    }

    .outcome-header {
        display: none;
    }

    .outcome-row {
        gap: 0.4rem;
    }

    .roadmap-model-row {
        grid-template-columns: 1fr;
    }

    .forum-intro,
    .forum-topic-heading,
    .forum-post-header,
    .forum-admin-category-card,
    .forum-topic-card,
    .forum-search-row {
        flex-direction: column;
        align-items: stretch;
    }

    .cookie-consent {
        flex-direction: column;
        align-items: stretch;
    }

    .cookie-modal__header,
    .cookie-category {
        align-items: flex-start;
    }

    .cookie-consent__actions .button,
    .cookie-consent__actions .button-secondary,
    .cookie-modal__actions .button,
    .cookie-modal__actions .button-secondary {
        flex: 1 1 100%;
    }
}

.h-dchat-key-panel {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.25rem;
}

.h-dchat-key-panel h2,
.h-dchat-sidebar h2,
.h-dchat-main h2,
.h-dchat-group-tools h3 {
    margin-top: 0;
}

.h-dchat-key-actions,
.h-dchat-sidebar section,
.h-dchat-compose {
    display: grid;
    gap: .75rem;
}

.h-dchat-layout {
    display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.h-dchat-call-panel {
    grid-column: 1 / -1;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    border-color: #b8d7ef;
    background: #eef7ff;
}

.h-dchat-call-panel h2 {
    margin: .35rem 0;
}

.h-dchat-call-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    justify-content: flex-end;
}

.h-dchat-sidebar {
    display: grid;
    gap: 1.25rem;
}

.h-dchat-sidebar input,
.h-dchat-sidebar textarea,
.h-dchat-compose textarea,
.h-dchat-edit-box textarea,
.h-dchat-header-actions input,
.h-dchat-inline input {
    width: 100%;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    padding: .65rem .75rem;
    color: #193247;
    background: #fff;
}

.h-dchat-sidebar textarea,
.h-dchat-compose textarea,
.h-dchat-edit-box textarea {
    min-height: 7rem;
    resize: vertical;
}

.h-dchat-inline {
    display: flex;
    gap: .5rem;
}

.h-dchat-search-results,
.h-dchat-conversation-list,
.h-dchat-messages,
.h-dchat-member-list {
    display: grid;
    gap: .65rem;
}

.h-dchat-result,
.h-dchat-conversation {
    display: grid;
    gap: .15rem;
    width: 100%;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    padding: .7rem .8rem;
    color: #193247;
    background: #fff;
    text-align: left;
}

.h-dchat-result:hover,
.h-dchat-conversation:hover,
.h-dchat-conversation-active {
    border-color: #1b6fae;
    background: #eef7ff;
}

.h-dchat-result span,
.h-dchat-conversation span,
.h-dchat-conversation small {
    color: #5d7183;
}

.h-dchat-main {
    min-height: 640px;
    display: grid;
    grid-template-rows: auto auto minmax(260px, 1fr) auto;
    gap: 1rem;
}

.h-dchat-empty {
    align-self: center;
    justify-self: center;
    text-align: center;
}

.h-dchat-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #e1e8f0;
    padding-bottom: 1rem;
}

.h-dchat-header-actions {
    display: grid;
    gap: .5rem;
    min-width: min(100%, 18rem);
}

.h-dchat-messages {
    align-content: end;
    overflow-y: auto;
    max-height: 52vh;
    padding-right: .25rem;
}

.h-dchat-message {
    max-width: 78%;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    padding: .75rem .85rem;
    background: #fff;
}

.h-dchat-message-mine {
    justify-self: end;
    border-color: #b8d7ef;
    background: #eef7ff;
}

.h-dchat-message header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .35rem;
    color: #5d7183;
    font-size: .88rem;
}

.h-dchat-message-meta {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    white-space: nowrap;
}

.h-dchat-message p {
    margin: 0;
    white-space: pre-wrap;
}

.h-dchat-message-deleted {
    border-style: dashed;
    opacity: .78;
}

.h-dchat-attachments {
    display: grid;
    gap: .4rem;
    margin-top: .65rem;
}

.h-dchat-attachment {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    padding: .5rem .6rem;
    color: #193247;
    background: rgba(255, 255, 255, .72);
    text-decoration: none;
}

.h-dchat-attachment:hover {
    border-color: #1b6fae;
    background: #fff;
}

.h-dchat-attachment span,
.h-dchat-read-receipts {
    color: #5d7183;
    font-size: .82rem;
}

.h-dchat-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: .65rem;
}

.h-dchat-edit-box {
    display: grid;
    gap: .6rem;
}

.h-dchat-danger-link {
    color: #a92727;
}

.h-dchat-read-receipts {
    margin-top: .55rem;
}

.h-dchat-group-tools {
    display: grid;
    gap: .75rem;
    border-bottom: 1px solid #e1e8f0;
    padding-bottom: 1rem;
}

.h-dchat-member {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    width: fit-content;
    border: 1px solid #d7e0ea;
    border-radius: 999px;
    padding: .25rem .6rem;
    color: #193247;
    background: #fff;
}

@media (max-width: 900px) {
    .documentation-overview,
    .documentation-toc,
    .documentation-visual-grid,
    .documentation-flow-diagram,
    .documentation-screen-map,
    .documentation-reference-grid,
    .documentation-security-grid {
        grid-template-columns: 1fr;
    }

    .documentation-wide-card {
        grid-column: auto;
    }

    .doc-arrow {
        justify-self: center;
        width: 2px;
        height: 28px;
    }

    .doc-arrow::after {
        top: auto;
        right: 50%;
        bottom: 0;
        transform: translateX(50%) rotate(135deg);
    }

    .doc-screen-grid {
        grid-template-columns: 1fr;
    }

    .h-dchat-key-panel,
    .h-dchat-header,
    .h-dchat-call-panel {
        display: grid;
    }

    .h-dchat-layout {
        grid-template-columns: 1fr;
    }

    .h-dchat-message {
        max-width: 100%;
    }
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    color: #dce8f3;
    background: #0b1118;
    color-scheme: dark;
}

html[data-theme="dark"] .app-shell {
    background: #0b1118;
    color: #dce8f3;
}

html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .helpbar {
    background: #101b26;
    border-color: #263d52;
}

html[data-theme="dark"] .top-row {
    background: rgba(13, 24, 35, 0.94);
    border-bottom-color: #263d52;
}

html[data-theme="dark"] .top-row-brand {
    color: #f0f7ff;
}

html[data-theme="dark"] .navbar-brand,
html[data-theme="dark"] .navbar-brand:visited,
html[data-theme="dark"] .nav-item .nav-link,
html[data-theme="dark"] .nav-item .nav-link:hover,
html[data-theme="dark"] .nav-item .nav-link:focus,
html[data-theme="dark"] .nav-item a.active {
    color: #ffffff;
}

html[data-theme="dark"] .nav-icon,
html[data-theme="dark"] .nav-external-icon,
html[data-theme="dark"] .nav-item .nav-link:hover .nav-icon,
html[data-theme="dark"] .nav-item .nav-link:hover .nav-external-icon,
html[data-theme="dark"] .nav-item a.active .nav-icon,
html[data-theme="dark"] .nav-item a.active .nav-external-icon {
    color: #ffffff;
}

html[data-theme="dark"] .nav-item .nav-link:hover,
html[data-theme="dark"] .nav-item a.active {
    background-color: #1b3146;
}

html[data-theme="dark"] .vpn-status,
html[data-theme="dark"] .vpn-status-text,
html[data-theme="dark"] .vpn-status-ip {
    color: #ffffff;
}

html[data-theme="dark"] .top-row-brand span {
    background: #182b3d;
    color: #9dbbd5;
}

html[data-theme="dark"] .language-selector,
html[data-theme="dark"] .theme-selector {
    border-color: rgba(95, 151, 196, 0.5);
    background: linear-gradient(180deg, rgba(20, 36, 51, 0.96) 0%, rgba(13, 26, 38, 0.94) 100%);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .language-selector-icon,
html[data-theme="dark"] .theme-selector-icon {
    background: #17334b;
    color: #8dccff;
}

html[data-theme="dark"] .language-selector-options,
html[data-theme="dark"] .theme-selector-options {
    background: rgba(74, 111, 140, 0.3);
}

html[data-theme="dark"] .language-selector-link,
html[data-theme="dark"] .theme-selector-button {
    color: #bed6ea;
}

html[data-theme="dark"] .language-selector-link:hover,
html[data-theme="dark"] .language-selector-link:focus-visible,
html[data-theme="dark"] .theme-selector-button:hover,
html[data-theme="dark"] .theme-selector-button:focus-visible {
    border-color: rgba(141, 204, 255, 0.5);
    background: rgba(24, 51, 73, 0.84);
    color: #f0f7ff;
}

html[data-theme="dark"] .language-selector-link.active,
html[data-theme="dark"] .theme-selector-button.active {
    border-color: #8dccff;
    background: #2b86c8;
    color: #ffffff;
    box-shadow: 0 7px 16px rgba(20, 132, 205, 0.25);
}

html[data-theme="dark"] a,
html[data-theme="dark"] .btn-link {
    color: #8dccff;
}

html[data-theme="dark"] a:hover,
html[data-theme="dark"] a:focus {
    color: #b8defd;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .button,
html[data-theme="dark"] .account-button-primary {
    background-color: #2b86c8;
    border-color: #2b86c8;
    color: #ffffff;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus,
html[data-theme="dark"] .button:hover,
html[data-theme="dark"] .button:focus {
    background-color: #4da5e5;
    border-color: #4da5e5;
    color: #07111a;
}

html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .account-button-secondary,
html[data-theme="dark"] .btn-secondary {
    border-color: #3f6380;
    background: #142434;
    color: #dce8f3;
}

html[data-theme="dark"] .button-secondary:hover,
html[data-theme="dark"] .button-secondary:focus,
html[data-theme="dark"] .account-button-secondary:hover,
html[data-theme="dark"] .account-button-secondary:focus {
    border-color: #6fb7ef;
    background: #1b3146;
    color: #ffffff;
}

html[data-theme="dark"] .button-danger {
    border-color: #a64d58;
    background: #4a1820;
    color: #ffd8dc;
}

html[data-theme="dark"] .nav-pills .nav-link {
    color: #a9d8ff;
}

html[data-theme="dark"] .nav-pills .nav-link.active,
html[data-theme="dark"] .nav-pills .show > .nav-link {
    background-color: #2b86c8;
    color: #ffffff;
}

html[data-theme="dark"] .nav-pills .nav-link:not(.active):hover,
html[data-theme="dark"] .nav-pills .nav-link:not(.active):focus {
    background-color: #17334b;
    color: #ffffff;
}

html[data-theme="dark"] :is(.hero-band, .panel, .order-card, .service-card, .home-portfolio-card, .public-profile-theme-card, .cookie-consent, .cookie-modal, .h-dchat-key-panel, .h-dchat-call-panel, .h-dchat-conversation-card, .h-dchat-member, .h-disk-actions-panel, .credit-package-card, .admin-toolbar, .table-list, .documentation-card, .documentation-wide-card, .documentation-screen, .documentation-reference-card, .documentation-security-card) {
    border-color: #27445d;
    background: #101b26;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
    color: #dce8f3;
}

html[data-theme="dark"] .hero-band {
    background: linear-gradient(135deg, #101b26 0%, #132d41 100%);
}

html[data-theme="dark"] .hero-register-cta,
html[data-theme="dark"] .landing-consent,
html[data-theme="dark"] .admin-alert,
html[data-theme="dark"] .callout,
html[data-theme="dark"] .status-panel,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .credit-balance-card,
html[data-theme="dark"] .accounting-summary-card {
    border-color: #27445d;
    background: rgba(20, 36, 52, 0.9);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
    color: #dce8f3;
}

html[data-theme="dark"] :is(h1, h2, h3, h4, h5, h6, .hero-band h1, .hero-register-cta h2, .section-title, .service-card h2, .order-card h2, .panel h2, .table-list th) {
    color: #f0f7ff;
}

html[data-theme="dark"] :is(p, .muted, .hero-band p, .hero-register-cta p, .table-list td, .h-dchat-read-receipts, .h-dchat-message header, .h-dchat-attachment span) {
    color: #a9bed0;
}

html[data-theme="dark"] .h-disk-shares .h-disk-share-card {
    border-color: #b9d0df;
    background: #ffffff;
    color: #000000 !important;
}

html[data-theme="dark"] .h-disk-shares .h-disk-share-card :is(strong, span, small, p, .muted, a:not(.button):not(.button-secondary)) {
    color: #000000 !important;
}

html[data-theme="dark"] .h-disk-shares .h-disk-share-card .button-secondary {
    border-color: #9fb8cc;
    background: #eef7ff;
    color: #000000 !important;
}

html[data-theme="dark"] :is(.home-stat-card strong, .home-server-card strong, .home-metric-row strong) {
    color: #ffffff;
}

html[data-theme="dark"] .home-metric-row span {
    color: #dce8f3;
}

html[data-theme="dark"] .home-device-row {
    border-color: #4f718a;
    background: #f8fcff;
}

html[data-theme="dark"] .home-device-row strong,
html[data-theme="dark"] .home-device-row .muted,
html[data-theme="dark"] .home-device-meta,
html[data-theme="dark"] .home-device-meta span,
html[data-theme="dark"] .home-device-meta .muted {
    color: #111111;
}

html[data-theme="dark"] .device-list-item {
    border-color: #b9d0df;
    background: #f7fbff;
    color: #111827;
}

html[data-theme="dark"] .device-list-item strong,
html[data-theme="dark"] .device-list-item dt,
html[data-theme="dark"] .device-list-item dd,
html[data-theme="dark"] .device-list-item .muted {
    color: #111827;
}

html[data-theme="dark"] .device-list-item dt {
    color: #24384a;
}

html[data-theme="dark"] :is(.device-enrollment-card, .enrolled-devices-card, .vpn-profile-result) {
    border-color: #b9d0df;
    background: #f7fbff;
    color: #111827;
}

html[data-theme="dark"] :is(.device-enrollment-card, .enrolled-devices-card, .vpn-profile-result) :is(h4, h5, p, label, .text-secondary) {
    color: #111827 !important;
}

html[data-theme="dark"] .enrolled-devices-card .device-list-item :is(.pill, .badge, .status-badge) {
    border-color: #9fb8cc;
    background: #e4f3ff;
    color: #123f63;
}

html[data-theme="dark"] .enrolled-devices-card .device-actions .btn-outline-primary {
    border-color: #1f6fa6;
    color: #174f78;
}

html[data-theme="dark"] :is(.helpbar h2, .helpbar dt, .account-help dt, .order-help dt, .contact-help label) {
    color: #8dccff;
}

html[data-theme="dark"] :is(.helpbar p, .helpbar dd, .account-help .help-intro, .order-help .help-intro, .account-help dd, .order-help dd) {
    color: #a9bed0;
}

html[data-theme="dark"] .pill,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .status-badge {
    border-color: #34556f;
    background: #18334b;
    color: #cbe5fb;
}

html[data-theme="dark"] .enrolled-devices-card .device-list-item,
html[data-theme="dark"] .enrolled-devices-card .device-list-item :is(div, dl, dt, dd, strong, span, p, .text-secondary, .muted, .pill, .badge, .status-badge) {
    color: #000000 !important;
}

html[data-theme="dark"] .enrolled-devices-card .device-list-item :is(.pill, .badge, .status-badge) {
    border-color: #9fb8cc !important;
    background: #e4f3ff !important;
}

html[data-theme="dark"] :is(input, textarea, select, .form-control, .form-select, .field input, .field textarea, .field select, .admin-table input, .admin-table select, .admin-search-input, .forum-search-row input, .email-app-password-copy input, .h-disk-inline-tools input[type="text"], .h-disk-actions-panel input, .h-dchat-sidebar input, .h-dchat-sidebar textarea, .h-dchat-compose textarea, .h-dchat-edit-box textarea, .h-dchat-header-actions input, .h-dchat-inline input, .public-bio-input) {
    border-color: #34556f;
    background-color: #0d1823;
    color: #dce8f3;
}

html[data-theme="dark"] :is(input, textarea, select, .form-control, .form-select)::placeholder {
    color: #8099ad;
}

html[data-theme="dark"] :is(input, textarea, select, .form-control, .form-select):focus {
    border-color: #6fb7ef;
    box-shadow: 0 0 0 0.18rem rgba(77, 165, 229, 0.24);
}

html[data-theme="dark"] :is(table, .admin-table, .h-disk-table, .outcome-table) {
    color: #dce8f3;
}

html[data-theme="dark"] :is(.table-list th, .table-list td, .admin-table th, .admin-table td, .h-disk-table th, .h-disk-table td, .outcome-table th, .outcome-table td) {
    border-color: #27445d;
}

html[data-theme="dark"] :is(.table-list th, .admin-table th, .h-disk-table th, .outcome-table th) {
    background: #132232;
}

html[data-theme="dark"] :is(.table-list tr:hover, .admin-table tr:hover, .h-disk-table tr:hover) {
    background: rgba(27, 49, 70, 0.76);
}

html[data-theme="dark"] :is(.h-dchat-message, .h-dchat-attachment, .h-dchat-sidebar-item, .h-dchat-compose, .h-dchat-group-tools) {
    border-color: #27445d;
    background: #111f2d;
    color: #dce8f3;
}

html[data-theme="dark"] .h-dchat-message-mine {
    border-color: #3b79a8;
    background: #14314a;
}

html[data-theme="dark"] .h-dchat-message-deleted {
    opacity: 0.72;
}

html[data-theme="dark"] .h-dchat-danger-link,
html[data-theme="dark"] .validation-message {
    color: #ff9ea8;
}

html[data-theme="dark"] .valid.modified:not([type=checkbox]) {
    outline-color: #51d889;
}

html[data-theme="dark"] .invalid {
    outline-color: #ff6f7d;
}

html[data-theme="dark"] .home-progress {
    background: #182b3d;
}

html[data-theme="dark"] .home-progress > span,
html[data-theme="dark"] .home-progress-fill {
    background: linear-gradient(90deg, #2b86c8, #5fc3ff);
}

html[data-theme="dark"] .page-link,
html[data-theme="dark"] .pagination .page-link {
    border-color: #34556f;
    background: #101b26;
    color: #dce8f3;
}

html[data-theme="dark"] .page-item.active .page-link,
html[data-theme="dark"] .pagination .active .page-link {
    border-color: #2b86c8;
    background: #2b86c8;
    color: #ffffff;
}

html[data-theme="dark"] .page-item.disabled .page-link,
html[data-theme="dark"] .pagination .disabled .page-link {
    border-color: #263d52;
    background: #0d1823;
    color: #6f879b;
}

html[data-theme="dark"] .cookie-consent__backdrop,
html[data-theme="dark"] .modal-backdrop {
    background: rgba(0, 0, 0, 0.7);
}

html[data-theme="dark"] pre,
html[data-theme="dark"] code,
html[data-theme="dark"] .script-output,
html[data-theme="dark"] .code-block {
    border-color: #27445d;
    background: #07111a;
    color: #d8f7ff;
}

html[data-theme="dark"] hr {
    border-color: #27445d;
}

html[data-theme="dark"] .blazor-error-boundary {
    background-color: #6d1f28;
    color: #ffffff;
}

html[data-theme="dark"] :is(.contact-info, .contact-help) {
    border-color: #2f4a62;
    background: linear-gradient(180deg, #142434 0%, #0e1a26 100%);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.22);
}

html[data-theme="dark"] .contact-info-item {
    border-color: #2f4a62;
    background: rgba(20, 36, 52, 0.84);
    color: #dce8f3;
}

html[data-theme="dark"] .contact-info-item:hover,
html[data-theme="dark"] .contact-info-item:focus-visible {
    border-color: #6fb7ef;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
    color: #ffffff;
}

html[data-theme="dark"] .contact-info-item svg {
    background: #18334b;
    color: #8dccff;
}

html[data-theme="dark"] .contact-info-item strong {
    color: #8dccff;
}

html[data-theme="dark"] .contact-info-item small,
html[data-theme="dark"] .contact-help input,
html[data-theme="dark"] .contact-help textarea {
    color: #c3d5e4;
}

html[data-theme="dark"] .contact-help input,
html[data-theme="dark"] .contact-help textarea {
    border-color: #2f4a62;
    background: #0d1823;
}

html[data-theme="dark"] .devices-layout,
html[data-theme="dark"] .devices-layout :is(section, article, div, dl, dt, dd, h4, h5, p, label, span, strong, small, .text-secondary, .form-text, .form-control-plaintext, .pill, .badge, .status-badge),
html[data-theme="dark"] .vpn-profile-result,
html[data-theme="dark"] .vpn-profile-result :is(section, article, div, dl, dt, dd, h4, h5, p, label, span, strong, small, .text-secondary, .form-text, .form-control-plaintext, .pill, .badge, .status-badge) {
    color: #000000 !important;
}

html[data-theme="dark"] .devices-layout :is(.pill, .badge, .status-badge),
html[data-theme="dark"] .vpn-profile-result :is(.pill, .badge, .status-badge) {
    border-color: #9fb8cc !important;
    background: #e4f3ff !important;
}