﻿@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

:root {
    --arca-bg: #f2f7fb;
    --arca-bg-soft: #ffffff;
    --arca-bg-deep: #dbe9f7;
    --arca-ink: #0f172a;
    --arca-ink-soft: #3b4a63;
    --arca-muted: #617190;
    --arca-primary: #0a7da9;
    --arca-primary-strong: #005f83;
    --arca-accent: #1fb5d6;
    --arca-outline: #bfd3e6;
    --arca-outline-strong: #94b7d2;
    --arca-success: #0f9f73;
    --arca-warning: #b96f15;
    --arca-danger: #bf2f45;
    --arca-shadow-lg: 0 24px 70px rgba(8, 35, 64, 0.14);
    --arca-shadow-md: 0 14px 36px rgba(8, 35, 64, 0.1);
    --arca-shadow-sm: 0 8px 20px rgba(8, 35, 64, 0.08);
    --arca-radius-xl: 24px;
    --arca-radius-lg: 16px;
    --arca-radius-md: 12px;
    --arca-radius-sm: 10px;
}

* {
    box-sizing: border-box;
}

html {
    font-size: 16px;
    min-height: 100%;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--arca-ink);
    font-family: "Plus Jakarta Sans", "Segoe UI", Tahoma, sans-serif;
    background:
        radial-gradient(circle at 10% 12%, rgba(31, 181, 214, 0.18), transparent 42%),
        radial-gradient(circle at 88% 14%, rgba(10, 125, 169, 0.14), transparent 35%),
        radial-gradient(circle at 55% 82%, rgba(103, 152, 218, 0.2), transparent 36%),
        linear-gradient(160deg, #eff6fc 0%, #e8f1fb 42%, #f8fbff 100%);
    background-attachment: fixed;
    overflow-x: hidden;
}

body::before,
body::after {
    content: "";
    position: fixed;
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
}

body::before {
    width: 38rem;
    height: 38rem;
    top: -13rem;
    right: -14rem;
    background: radial-gradient(circle, rgba(31, 181, 214, 0.22) 0%, rgba(31, 181, 214, 0) 68%);
}

body::after {
    width: 28rem;
    height: 28rem;
    bottom: -10rem;
    left: -9rem;
    background: radial-gradient(circle, rgba(10, 125, 169, 0.18) 0%, rgba(10, 125, 169, 0) 66%);
}

.theme-transition-veil {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    pointer-events: all;
    opacity: 1;
    transition: opacity 320ms ease;
    will-change: opacity;
}

.theme-transition-veil.is-fading {
    opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
    .theme-transition-veil {
        transition: none;
    }
}

a {
    color: inherit;
    text-decoration: none;
}

.skip-link {
    position: absolute;
    left: 12px;
    top: -50px;
    padding: 10px 16px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.9rem;
    color: #fff;
    background: var(--arca-primary-strong);
    z-index: 2000;
    transition: top 0.2s ease;
}

.skip-link:focus {
    top: 12px;
}

.app-navbar {
    position: sticky;
    top: 0;
    z-index: 1035;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid rgba(148, 183, 210, 0.45);
    backdrop-filter: blur(14px);
    background: rgba(246, 251, 255, 0.76);
}

.app-navbar-inner {
    max-width: 1760px;
}

.app-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
}

.logo {
    width: 2.75rem;
    height: 2.75rem;
    object-fit: contain;
}

.app-navbar-toggler {
    border: 1px solid var(--arca-outline);
    border-radius: 10px;
    padding: 0.42rem 0.56rem;
}

.app-navbar-toggler:focus {
    box-shadow: 0 0 0 3px rgba(31, 181, 214, 0.25);
}

.app-user-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.38rem 0.72rem 0.38rem 0.42rem;
    border-radius: 999px;
    border: 1px solid var(--arca-outline);
    background: rgba(255, 255, 255, 0.88);
    color: var(--arca-ink-soft);
}

.app-user-fallback {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(135deg, #0a7da9, #1fb5d6);
    color: #fff;
}

.app-user-name {
    max-width: 220px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.9rem;
    font-weight: 600;
}

.app-signin-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    border-radius: 999px;
    border: 1px solid var(--arca-outline);
    background: rgba(255, 255, 255, 0.9);
    color: var(--arca-ink-soft);
    font-weight: 600;
    padding: 0.45rem 0.84rem;
}

.app-signin-btn {
    border-color: transparent;
    background: linear-gradient(130deg, var(--arca-primary), var(--arca-accent));
    color: #fff;
    box-shadow: var(--arca-shadow-sm);
}

.app-signin-btn:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(10, 125, 169, 0.25);
}

.app-signin-btn:focus {
    outline: none;
}

.app-signin-btn:focus-visible,
.k-button:focus-visible,
button:focus-visible,
a:focus-visible {
    box-shadow: 0 0 0 3px rgba(31, 181, 214, 0.3) !important;
    outline: none;
}

.app-dropdown-menu {
    border: 1px solid var(--arca-outline);
    border-radius: 12px;
    box-shadow: var(--arca-shadow-md);
    padding: 0.35rem;
}

.app-dropdown-menu .app-dropdown-item {
    display: block;
    border-radius: 8px;
    color: var(--arca-ink-soft);
    font-size: 0.92rem;
    padding: 0.55rem 0.8rem;
    text-decoration: none;
}

.app-dropdown-menu .app-dropdown-item:hover {
    background: #e9f6fb;
    color: var(--arca-primary-strong);
}

.app-login-partial {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.app-login-partial__item {
    display: inline-flex;
}

.app-login-partial__form {
    margin: 0;
}

.app-login-partial__link,
.app-login-partial__button {
    display: inline-flex;
    align-items: center;
    min-height: 2.35rem;
    padding: 0.45rem 0.75rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--arca-ink-soft);
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.app-login-partial__link:hover,
.app-login-partial__button:hover,
.app-login-partial__link:focus-visible,
.app-login-partial__button:focus-visible {
    border-color: var(--arca-outline);
    background: rgba(255, 255, 255, 0.82);
    color: var(--arca-primary-strong);
}

.app-content {
    min-height: calc(100vh - 76px);
}

.app-content-inner {
    max-width: 1920px;
    margin: 0 auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Space Grotesk", "Plus Jakarta Sans", sans-serif;
    color: var(--arca-ink);
    letter-spacing: 0.01em;
}

textarea {
    border: 1px solid var(--arca-outline);
    border-radius: var(--arca-radius-sm);
    min-height: 46px;
    background-color: rgba(255, 255, 255, 0.9);
    color: var(--arca-ink);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

textarea::placeholder {
    color: #7e91af;
}

textarea:focus {
    border-color: var(--arca-accent);
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(31, 181, 214, 0.2);
}

.k-grid,
.k-popup,
.k-animation-container,
.k-dialog,
.k-window {
    border-color: var(--arca-outline) !important;
    border-radius: 12px;
    box-shadow: var(--arca-shadow-md);
}

.k-grid-header,
.k-grid-toolbar,
.k-pager-wrap {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(239, 248, 255, 0.92) 100%) !important;
}

.k-grid td,
.k-grid th {
    border-color: #d7e3ef !important;
}

.k-grid tbody tr:hover {
    background: rgba(212, 238, 250, 0.36) !important;
}

.k-button.k-button-solid-primary,
.k-primary {
    background: linear-gradient(130deg, var(--arca-primary), var(--arca-accent)) !important;
    border-color: transparent !important;
    color: #fff !important;
}

.k-button.k-button-solid-base,
.k-button {
    border-color: var(--arca-outline-strong) !important;
}

.auth-shell {
    min-height: calc(100vh - 76px);
}

.auth-panel {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(20px, 2.2vw, 34px);
}

.auth-form-card {
    width: min(100%, 590px);
    padding: clamp(22px, 2.4vw, 34px);
    border-radius: var(--arca-radius-xl);
    border: 1px solid rgba(186, 210, 230, 0.9);
    background: linear-gradient(170deg, rgba(255, 255, 255, 0.95) 0%, rgba(243, 251, 255, 0.9) 100%);
    box-shadow: var(--arca-shadow-lg);
}

.auth-form-card {
    width: min(100%, 540px);
}

.auth-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, 0.78fr);
}

.arca-hero-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2.2rem;
    padding: clamp(32px, 4vw, 56px);
    overflow: hidden;
}

.arca-hero-panel::before {
    content: "";
    position: absolute;
    inset: 24px;
    border-radius: 30px;
    border: 1px solid rgba(186, 210, 230, 0.72);
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.82), rgba(232, 245, 255, 0.67));
    box-shadow: var(--arca-shadow-lg);
}

.arca-hero-content,
.arca-hero-orb-wrap {
    position: relative;
    z-index: 1;
}

.arca-hero-tag {
    margin: 0;
    color: var(--arca-primary-strong);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.76rem;
    font-weight: 700;
}

.arca-hero-title {
    margin: 0.55rem 0 0;
    font-size: clamp(2rem, 3.6vw, 3.6rem);
    line-height: 1.05;
}

.arca-hero-subtitle {
    margin: 1rem 0 0;
    max-width: 52ch;
    color: var(--arca-ink-soft);
    font-size: clamp(1rem, 1.3vw, 1.2rem);
}

.arca-hero-badges {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.arca-hero-badges span {
    border-radius: 999px;
    border: 1px solid rgba(10, 125, 169, 0.25);
    background: rgba(255, 255, 255, 0.86);
    color: var(--arca-primary-strong);
    padding: 0.4rem 0.72rem;
    font-size: 0.76rem;
    font-weight: 600;
}

.arca-hero-orb-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.3rem;
}

.arca-hero-logo {
    width: min(350px, 42vw);
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 50%;
    box-shadow:
        0 0 0 8px rgba(255, 255, 255, 0.76),
        0 24px 54px rgba(8, 35, 64, 0.2);
}

.arca-header-hero-panel {
    min-width: 0;
}

.arca-header-logo {
    width: clamp(76px, 13vw, 220px);
    height: auto;
    border-radius: 50%;
    box-shadow: var(--arca-shadow-md);
}

#backToMain,
.auth-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    border-radius: 14px;
    border: 1px solid var(--arca-outline);
    background: #fff;
    color: var(--arca-ink-soft);
    padding: 0.72rem 0.9rem;
}

.img-btn {
    width: clamp(36px, 4.2vw, 72px);
    height: auto;
}

.pill-icon,
.pill-icon-ms,
.pill-icon-g {
    width: clamp(34px, 3vw, 44px);
    height: clamp(34px, 3vw, 44px);
    object-fit: contain;
}

.auth-back-btn {
    width: fit-content;
    margin-bottom: 1.15rem;
}

.auth-heading {
    margin-bottom: 1rem;
}

.auth-heading h2 {
    margin: 0.25rem 0 0;
    font-size: clamp(1.55rem, 2.3vw, 2.15rem);
}

.auth-heading p {
    margin: 0.55rem 0 0;
    color: var(--arca-muted);
    font-size: 0.93rem;
}

.auth-eyebrow {
    margin: 0;
    color: var(--arca-primary-strong);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.login-form-field {
    display: grid;
    gap: 0.42rem;
    margin-bottom: 1rem;
}

.login-form-label {
    color: #2e416c;
    font-size: 0.76rem;
    font-weight: 700;
}

.login-form-control {
    display: block;
    width: 100%;
    min-height: 42px;
    height: 42px;
    border-radius: 11px;
    border: 1px solid #92a4cd;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 1px 4px rgba(107, 124, 164, 0.16);
    color: #1f2f56;
    font-size: 0.88rem;
    padding: 0.5rem 0.72rem;
}

.login-form-control::placeholder {
    color: #67779f;
}

.login-form-control:focus {
    outline: none;
    border-color: #4f68b8;
    box-shadow: 0 0 0 3px rgba(78, 101, 183, 0.24);
}

.login-form-control:disabled {
    background: #e8eef9;
    border-color: #aab8d5;
    color: #6e7e9f;
    box-shadow: none;
}

.login-input-invalid {
    border-color: #b72f4b !important;
    box-shadow: 0 0 0 3px rgba(183, 47, 75, 0.16) !important;
}

.login-validation-error {
    color: #a41f3c;
    font-size: 0.8rem;
    font-weight: 700;
}

.borde-renovation {
    border-width: 1px;
}

.login-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.35rem;
    min-height: 56px;
    border-radius: 14px;
    border: 1px solid transparent;
    color: #fff;
    background: linear-gradient(130deg, var(--arca-primary), var(--arca-accent));
    box-shadow: var(--arca-shadow-sm);
    padding: 0.65rem 1rem;
}

.login-btn:hover,
.login-btn:focus {
    color: #fff;
}

.login-btn:disabled {
    cursor: wait;
}

.login-provider-icons {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.login-provider-spinner {
    width: 1.25rem;
    height: 1.25rem;
    border: 0.16rem solid rgba(255, 255, 255, 0.42);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: loginSpinner 0.8s linear infinite;
}

@keyframes loginSpinner {
    to {
        transform: rotate(360deg);
    }
}

.auth-submit-copy {
    font-size: 1rem;
}

.nlp-page {
    min-height: calc(100vh - 76px);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: clamp(16px, 3vw, 34px);
}

.nlp-logo {
    position: absolute;
    top: 18px;
    right: 24px;
}

.nlp-logo.voice-waiting .arca-header-logo {
    animation: nlpLogoGlow 1.9s ease-in-out infinite;
}

@keyframes nlpLogoGlow {
    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 10px rgba(31, 181, 214, 0.45));
    }
    50% {
        transform: scale(1.03);
        filter: drop-shadow(0 0 22px rgba(31, 181, 214, 0.65));
    }
}

.nlp-search {
    width: min(980px, 96vw);
    border-radius: var(--arca-radius-xl);
    border: 1px solid rgba(186, 210, 230, 0.9);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: var(--arca-shadow-lg);
    padding: clamp(18px, 3vw, 34px);
    text-align: center;
}

.nlp-title {
    margin-bottom: 0.9rem;
    color: var(--arca-muted);
    font-size: clamp(0.92rem, 1.6vw, 1.12rem);
    font-weight: 600;
}

.nlp-input-wrap {
    position: relative;
}

.nlp-input {
    min-height: 58px;
    border-radius: 14px;
    padding-right: 60px;
    font-size: 1rem;
}

.nlp-search-btn {
    position: absolute;
    right: 7px;
    top: 7px;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid var(--arca-outline);
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nlp-search-btn img {
    width: 18px;
    height: 18px;
}

.nlp-mic-notice {
    margin: 0.95rem 0 0;
    border-radius: 999px;
    border: 1px solid rgba(10, 125, 169, 0.24);
    background: rgba(232, 248, 255, 0.62);
    color: #164362;
}

.nlp-search {
    position: relative;
    width: min(1120px, 96vw);
    overflow: hidden;
    text-align: left;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(239, 246, 255, 0.92)),
        repeating-linear-gradient(90deg, rgba(37, 99, 235, 0.045) 0 1px, transparent 1px 48px);
}

.nlp-search::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent, rgba(30, 117, 255, 0.08), transparent),
        linear-gradient(180deg, rgba(0, 194, 203, 0.06), transparent 42%);
    opacity: 0.78;
}

.nlp-search > * {
    position: relative;
    z-index: 1;
}

.nlp-shell-header,
.nlp-lower-grid,
.nlp-context-items,
.nlp-voice-card,
.nlp-command-meta {
    display: flex;
    align-items: center;
}

.nlp-shell-header {
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: clamp(16px, 2vw, 24px);
}

.nlp-kicker,
.nlp-mode-pill,
.nlp-card-label {
    color: #2460b8;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nlp-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.55rem;
    font-size: 0.78rem;
}

.nlp-shell-header h1 {
    margin: 0;
    color: #062a5f;
    font-size: clamp(2rem, 4vw, 4rem);
    line-height: 0.96;
    letter-spacing: 0;
}

.nlp-mode-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    padding: 0 1rem;
    border: 1px solid rgba(57, 123, 216, 0.32);
    border-radius: 999px;
    background: rgba(230, 240, 255, 0.86);
    color: #125dbe;
    box-shadow: 0 12px 28px rgba(30, 102, 204, 0.12);
}

.nlp-command-card,
.nlp-context-card,
.nlp-voice-card {
    border: 1px solid rgba(107, 154, 224, 0.42);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 18px 45px rgba(49, 93, 158, 0.12);
}

.nlp-command-card {
    padding: clamp(16px, 2.2vw, 24px);
}

.nlp-title {
    display: block;
    margin: 0 0 0.8rem;
    color: #49668f;
    font-size: 0.88rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.nlp-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-height: 68px;
    border: 1px solid rgba(55, 119, 216, 0.32);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 10px 26px rgba(49, 93, 158, 0.1);
    padding: 0.45rem;
}

.nlp-input-icon {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    color: #1f75ff;
    background: rgba(225, 238, 255, 0.9);
    font-size: 1.2rem;
}

.nlp-input {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 54px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #062a5f;
    font-size: clamp(1rem, 1.4vw, 1.16rem);
    box-shadow: none !important;
}

.nlp-input:focus {
    outline: 0;
    background: transparent;
    box-shadow: none !important;
}

.nlp-search-btn {
    position: static;
    flex: 0 0 auto;
    width: auto;
    min-width: 128px;
    height: 50px;
    gap: 0.5rem;
    padding: 0 1.1rem;
    border: 1px solid rgba(17, 102, 241, 0.38);
    border-radius: 14px;
    color: #ffffff;
    background: linear-gradient(135deg, #176df2, #1aa3ff);
    box-shadow: 0 12px 26px rgba(23, 109, 242, 0.28);
    font-weight: 900;
}

.nlp-search-btn:hover,
.nlp-search-btn:focus {
    color: #ffffff;
}

.nlp-search-btn:disabled {
    opacity: 0.72;
}

.nlp-command-meta {
    gap: 0.55rem;
    margin-top: 0.8rem;
    color: #5b7195;
    font-size: 0.86rem;
    font-weight: 700;
}

.nlp-dot-separator {
    width: 5px;
    height: 5px;
    border-radius: 999px;
    background: #19b6c9;
}

.nlp-voice-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 1px solid rgba(74, 132, 218, 0.34);
    border-radius: 999px;
    background: rgba(235, 244, 255, 0.9);
    color: #164d91;
    font-weight: 850;
}

.nlp-lower-grid {
    align-items: stretch;
    gap: 1rem;
    margin-top: 1rem;
}

.nlp-context-card,
.nlp-voice-card {
    flex: 1 1 0;
    min-height: 98px;
    padding: 1rem;
}

.nlp-context-card {
    display: grid;
    gap: 0.8rem;
}

.nlp-card-label {
    font-size: 0.72rem;
}

.nlp-context-items {
    gap: 0.65rem;
    flex-wrap: wrap;
}

.nlp-context-items span {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 36px;
    padding: 0 0.8rem;
    border-radius: 999px;
    color: #25466e;
    background: rgba(230, 240, 255, 0.88);
    font-weight: 800;
}

.nlp-voice-card {
    justify-content: space-between;
    gap: 1rem;
}

.nlp-voice-card p {
    margin: 0.25rem 0 0;
    color: #062a5f;
    font-size: 1.15rem;
    font-weight: 900;
}

.nlp-voice-btn {
    min-height: 48px;
    padding: 0 1.1rem;
}

.nlp-voice-btn.is-listening {
    border-color: rgba(25, 182, 201, 0.44);
    background: linear-gradient(135deg, #00a4b7, #247cff);
    color: #fff;
    box-shadow: 0 12px 24px rgba(22, 125, 220, 0.22);
}

.nlp-mic-notice__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.nlp-mic-enable-btn {
    min-height: 2.35rem;
    padding: 0.5rem 0.9rem;
    border: 1px solid rgba(17, 102, 241, 0.34);
    border-radius: 999px;
    background: linear-gradient(135deg, #176df2, #1aa3ff);
    color: #ffffff;
    font-weight: 850;
    cursor: pointer;
}

.nlp-mic-enable-btn:hover,
.nlp-mic-enable-btn:focus-visible {
    outline: 0;
    filter: brightness(1.04);
}

html[data-theme="dark"] body.page-home-nlp .nlp-search,
body[data-theme="dark"].page-home-nlp .nlp-search {
    border-color: rgba(84, 143, 224, 0.56);
    background:
        linear-gradient(135deg, rgba(8, 30, 57, 0.96), rgba(13, 50, 92, 0.9)),
        repeating-linear-gradient(90deg, rgba(107, 174, 255, 0.07) 0 1px, transparent 1px 48px) !important;
    color: #eaf2ff;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28) !important;
}

html[data-theme="dark"] body.page-home-nlp .nlp-shell-header h1,
body[data-theme="dark"].page-home-nlp .nlp-shell-header h1 {
    color: #f5f9ff;
}

html[data-theme="dark"] body.page-home-nlp .nlp-kicker,
html[data-theme="dark"] body.page-home-nlp .nlp-card-label,
body[data-theme="dark"].page-home-nlp .nlp-kicker,
body[data-theme="dark"].page-home-nlp .nlp-card-label {
    color: #9fc7ff !important;
}

html[data-theme="dark"] body.page-home-nlp .nlp-command-card,
html[data-theme="dark"] body.page-home-nlp .nlp-context-card,
html[data-theme="dark"] body.page-home-nlp .nlp-voice-card,
body[data-theme="dark"].page-home-nlp .nlp-command-card,
body[data-theme="dark"].page-home-nlp .nlp-context-card,
body[data-theme="dark"].page-home-nlp .nlp-voice-card {
    border-color: rgba(91, 142, 214, 0.56);
    background: rgba(8, 30, 57, 0.72);
    box-shadow: none;
}

html[data-theme="dark"] body.page-home-nlp .nlp-input-wrap,
body[data-theme="dark"].page-home-nlp .nlp-input-wrap {
    border-color: rgba(98, 151, 230, 0.62);
    background: rgba(4, 21, 42, 0.88);
    box-shadow: none;
}

html[data-theme="dark"] body.page-home-nlp .nlp-input,
body[data-theme="dark"].page-home-nlp .nlp-input {
    border: 0 !important;
    background: transparent !important;
    color: #f3f8ff !important;
}

html[data-theme="dark"] body.page-home-nlp .nlp-title,
html[data-theme="dark"] body.page-home-nlp .nlp-command-meta,
body[data-theme="dark"].page-home-nlp .nlp-title,
body[data-theme="dark"].page-home-nlp .nlp-command-meta {
    color: #b9d2fb !important;
}

html[data-theme="dark"] body.page-home-nlp .nlp-mode-pill,
html[data-theme="dark"] body.page-home-nlp .nlp-input-icon,
html[data-theme="dark"] body.page-home-nlp .nlp-context-items span,
html[data-theme="dark"] body.page-home-nlp .nlp-voice-btn,
body[data-theme="dark"].page-home-nlp .nlp-mode-pill,
body[data-theme="dark"].page-home-nlp .nlp-input-icon,
body[data-theme="dark"].page-home-nlp .nlp-context-items span,
body[data-theme="dark"].page-home-nlp .nlp-voice-btn {
    border-color: rgba(93, 145, 218, 0.52);
    background: rgba(18, 55, 98, 0.82);
    color: #dcecff;
}

html[data-theme="dark"] body.page-home-nlp .nlp-voice-card p,
body[data-theme="dark"].page-home-nlp .nlp-voice-card p {
    color: #ffffff;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

@media (max-width: 1199.98px) {
    .arca-header-hero-panel {
        display: none;
    }

    .auth-panel {
        padding: 20px;
    }

    .auth-form-card {
        width: min(100%, 760px);
    }
}

@media (max-width: 767.98px) {
    .app-user-name {
        max-width: 130px;
    }

    .nlp-logo {
        top: 10px;
        right: 10px;
    }

    .nlp-search {
        padding: 18px 14px;
    }

    .nlp-shell-header,
    .nlp-lower-grid,
    .nlp-voice-card {
        align-items: stretch;
        flex-direction: column;
    }

    .nlp-input-wrap {
        align-items: stretch;
        flex-direction: column;
        padding: 0.75rem;
    }

    .nlp-input-icon {
        display: none;
    }

    .nlp-input {
        width: 100%;
        min-height: 48px;
    }

    .nlp-search-btn,
    body.page-home-nlp .nlp-search-btn {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ===== Compact Neumorphism Theme (User Requested) ===== */
:root {
    --neu-bg: #e7ebf5;
    --neu-bg-alt: #dde3ef;
    --neu-surface: #edf1f9;
    --neu-surface-strong: #f3f6fc;
    --neu-ink: #404b79;
    --neu-ink-soft: #616c93;
    --neu-accent: #6d6fd4;
    --neu-shadow-out: 8px 8px 18px rgba(179, 188, 209, 0.58), -8px -8px 18px rgba(255, 255, 255, 0.95);
    --neu-shadow-in: inset 5px 5px 10px rgba(184, 193, 214, 0.55), inset -5px -5px 10px rgba(255, 255, 255, 0.94);
}

html {
    font-size: 14px;
}

body {
    color: var(--neu-ink);
    background: linear-gradient(140deg, var(--neu-bg-alt) 0%, var(--neu-bg) 58%, #edf1f8 100%);
}

body::before,
body::after {
    display: none;
}

.app-navbar {
    padding: 0.38rem 0.75rem;
    border-bottom: 1px solid rgba(205, 214, 232, 0.95);
    background: rgba(231, 236, 247, 0.92);
    backdrop-filter: blur(8px);
}

.app-brand {
    gap: 0.55rem;
}

.logo {
    width: 2.2rem;
    height: 2.2rem;
}

.app-user-chip,
.app-signin-btn,
.app-navbar-toggler {
    border: 0;
    background: var(--neu-surface);
    box-shadow: var(--neu-shadow-out);
    color: var(--neu-ink-soft);
}

.app-signin-btn {
    color: var(--neu-accent);
}

.app-signin-btn:hover {
    color: #585ac0;
    box-shadow: 10px 10px 18px rgba(176, 185, 205, 0.62), -8px -8px 18px rgba(255, 255, 255, 0.98);
}

.app-dropdown-menu {
    border: 0;
    background: var(--neu-surface-strong);
    box-shadow: 12px 12px 24px rgba(173, 183, 205, 0.62), -10px -10px 24px rgba(255, 255, 255, 0.97);
}

.app-dropdown-menu .app-dropdown-item:hover {
    background: #e8edfb;
    color: var(--neu-accent);
}

.app-content {
    min-height: calc(100vh - 62px);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--neu-ink);
}

textarea {
    min-height: 38px;
    padding-top: 0.42rem;
    padding-bottom: 0.42rem;
    border: 0;
    background: var(--neu-surface-strong);
    color: var(--neu-ink);
    box-shadow: var(--neu-shadow-in);
    border-radius: 12px;
}

textarea::placeholder {
    color: #8a94b7;
}

textarea:focus {
    box-shadow: var(--neu-shadow-in), 0 0 0 2px rgba(109, 111, 212, 0.24);
}

.k-button.k-button-solid-primary,
.k-primary {
    background: linear-gradient(145deg, #f3f5ff, #e9edfb) !important;
    color: var(--neu-accent) !important;
    box-shadow: var(--neu-shadow-out) !important;
}

.k-grid,
.k-popup,
.k-animation-container,
.k-dialog,
.k-window {
    border: 0 !important;
    background: var(--neu-surface-strong) !important;
    box-shadow: 12px 12px 24px rgba(176, 186, 208, 0.62), -10px -10px 24px rgba(255, 255, 255, 0.98) !important;
    border-radius: 16px !important;
}

.k-grid-header,
.k-grid-toolbar,
.k-pager-wrap {
    background: #edf1f9 !important;
    border: 0 !important;
}

.k-grid td,
.k-grid th {
    border-color: #d9dfed !important;
}

.k-grid tbody tr:hover {
    background: #e9edf8 !important;
}

.auth-shell,
.nlp-page {
    min-height: calc(100vh - 62px);
}

.auth-panel {
    padding: clamp(14px, 1.5vw, 24px);
}

.auth-form-card,
.nlp-search {
    border: 0;
    background: var(--neu-surface);
    box-shadow: 14px 14px 28px rgba(177, 186, 208, 0.62), -12px -12px 28px rgba(255, 255, 255, 0.96);
    border-radius: 20px;
    padding: clamp(14px, 1.5vw, 24px);
}

.arca-hero-panel::before {
    border: 0;
    background: var(--neu-surface);
    box-shadow: 14px 14px 30px rgba(177, 186, 208, 0.58), -12px -12px 30px rgba(255, 255, 255, 0.96);
}

.arca-hero-title {
    font-size: clamp(1.45rem, 2.6vw, 2.5rem);
}

.arca-hero-subtitle {
    font-size: clamp(0.88rem, 1.05vw, 1rem);
}

.arca-hero-badges span {
    font-size: 0.68rem;
    background: var(--neu-surface-strong);
    box-shadow: var(--neu-shadow-out);
    border: 0;
    color: var(--neu-ink-soft);
}

.arca-hero-logo,
.arca-header-logo {
    box-shadow: 12px 12px 24px rgba(173, 183, 205, 0.62), -10px -10px 24px rgba(255, 255, 255, 0.98);
}

#backToMain,
.auth-back-btn,
.login-btn {
    border: 0;
    background: var(--neu-surface-strong);
    color: var(--neu-ink-soft);
    box-shadow: var(--neu-shadow-out);
}

.auth-eyebrow {
    color: var(--neu-accent);
}

.auth-heading h2 {
    font-size: clamp(1.2rem, 1.7vw, 1.6rem);
}

.auth-heading p,
.nlp-title {
    font-size: 0.82rem;
}

.nlp-input {
    min-height: 42px;
    font-size: 0.86rem;
    padding-right: 50px;
}

.nlp-search-btn {
    width: 32px;
    height: 32px;
    top: 5px;
    right: 6px;
}

.nlp-mic-notice {
    font-size: 0.8rem;
}

.img-btn {
    width: clamp(24px, 2.8vw, 42px);
}

.pill-icon,
.pill-icon-ms,
.pill-icon-g {
    width: clamp(24px, 2vw, 34px);
    height: clamp(24px, 2vw, 34px);
}

@media (max-width: 767.98px) {
    html {
        font-size: 13px;
    }

    .auth-form-card,
    .nlp-search {
        border-radius: 16px;
    }
}

/* ===== Login Compact High-Contrast Patch ===== */
.login-page {
    position: relative;
    background: linear-gradient(152deg, #d2d9ea 0%, #dbe3f2 52%, #e5ebf8 100%);
}

.login-page::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 28%, rgba(86, 103, 171, 0.22), transparent 40%),
        radial-gradient(circle at 82% 72%, rgba(125, 150, 211, 0.16), transparent 36%);
    pointer-events: none;
}

.login-page .auth-grid {
    max-width: 1740px;
    margin: 0 auto;
}

.login-page .arca-hero-panel,
.login-page .login-auth-panel {
    position: relative;
    z-index: 1;
}

.login-page .arca-hero-panel {
    gap: 1.4rem;
    padding: clamp(24px, 2.4vw, 38px);
}

.login-page .arca-hero-panel::before {
    inset: 16px;
    border: 1px solid #b3bfd8;
    background: linear-gradient(165deg, #dde4f4 0%, #e8eef9 100%);
    box-shadow: 10px 10px 24px rgba(145, 159, 190, 0.7), -8px -8px 20px rgba(255, 255, 255, 0.97);
}

.login-page .arca-hero-tag {
    color: #214b88;
    font-size: 0.69rem;
}

.login-page .arca-hero-title {
    color: #1f2f56;
    font-size: clamp(1.7rem, 2.2vw, 2.45rem);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.84);
}

.login-page .arca-hero-subtitle {
    margin-top: 0.7rem;
    color: #30456f;
    font-size: clamp(0.86rem, 0.94vw, 0.98rem);
}

.login-page .arca-hero-badges {
    margin-top: 1rem;
    gap: 0.5rem;
}

.login-page .arca-hero-badges span {
    background: #f2f6ff;
    color: #31456f;
    border: 1px solid #bdcae4;
    box-shadow: 5px 5px 12px rgba(164, 177, 205, 0.62), -5px -5px 12px rgba(255, 255, 255, 0.98);
    padding: 0.34rem 0.6rem;
    font-size: 0.67rem;
}

.login-page .arca-hero-logo {
    width: min(298px, 34vw);
}

.login-page .login-auth-panel {
    padding: clamp(12px, 1.4vw, 18px);
}

.login-page .login-auth-card {
    border: 1px solid #b8c4dd;
    border-radius: 18px;
    background: linear-gradient(170deg, #eef3fc 0%, #ffffff 100%);
    box-shadow: 12px 12px 24px rgba(150, 164, 194, 0.7), -9px -9px 22px rgba(255, 255, 255, 0.99);
    padding: clamp(14px, 1.5vw, 22px);
}

.login-page .auth-eyebrow {
    color: #2c4f91;
}

.login-page .auth-heading {
    margin-bottom: 0.8rem;
}

.login-page .auth-heading h2 {
    color: #1f3260;
    font-size: clamp(1.24rem, 1.45vw, 1.5rem);
}

.login-page .auth-heading p {
    margin-top: 0.35rem;
    color: #42547f;
    font-size: 0.82rem;
}

.login-page .login-form-label {
    color: #2e416c;
    font-size: 0.76rem;
    font-weight: 700;
}

.login-page .login-form-control {
    min-height: 42px;
    height: 42px;
    border-radius: 11px;
    border: 1px solid #92a4cd;
    background: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 1px 4px rgba(107, 124, 164, 0.16);
    color: #1f2f56;
    font-size: 0.88rem;
    padding: 0.5rem 0.72rem;
}

.login-page .login-form-control::placeholder {
    color: #67779f;
}

.login-page .login-form-control:focus {
    border-color: #4f68b8;
    box-shadow: 0 0 0 3px rgba(78, 101, 183, 0.24);
}

.login-page .login-form-control:disabled {
    background: #e8eef9;
    border-color: #aab8d5;
    color: #6e7e9f;
    box-shadow: none;
}

.login-page .auth-back-btn {
    padding: 0.48rem 0.7rem;
    border: 1px solid #b8c5df;
    background: #edf2fd;
    color: #2f4472;
    box-shadow: 6px 6px 14px rgba(163, 175, 202, 0.62), -6px -6px 14px rgba(255, 255, 255, 0.99);
}

.login-page .auth-back-btn .img-btn {
    width: 20px;
    height: 20px;
    opacity: 1;
    object-fit: contain;
    filter: contrast(1.28) saturate(1.15) brightness(0.56);
}

.login-page .login-cta-btn {
    margin-top: 0.2rem;
    min-height: 47px;
    border-radius: 12px;
    border: 1px solid #4059b7;
    background: linear-gradient(140deg, #435fca 0%, #5572db 100%);
    color: #ffffff;
    box-shadow: 0 10px 18px rgba(62, 85, 167, 0.37);
}

.login-page .login-cta-btn:hover,
.login-page .login-cta-btn:focus {
    color: #ffffff;
    background: linear-gradient(140deg, #3d58c0 0%, #4d68d1 100%);
}

.login-page .auth-submit-copy {
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.login-page .pill-icon,
.login-page .pill-icon-ms,
.login-page .pill-icon-g {
    width: 26px;
    height: 26px;
}

.login-page .text-danger {
    color: #a41f3c;
    font-weight: 700;
}

.login-page .login-validation-error {
    color: #a41f3c;
    font-weight: 700;
}

body:has(.login-page) .app-navbar {
    border-bottom: 1px solid #a3b2d2;
    background: rgba(234, 241, 252, 0.9);
    box-shadow: 0 8px 20px rgba(118, 133, 170, 0.25);
}

body:has(.login-page) .app-signin-btn {
    border: 1px solid #4560bd;
    background: linear-gradient(138deg, #425fc6, #5573dd);
    box-shadow: 0 8px 18px rgba(67, 90, 171, 0.34);
}

@media (max-width: 1199.98px) {
    .login-page .arca-hero-panel::before {
        inset: 10px;
    }

    .login-page .login-auth-card {
        margin-inline: auto;
        width: min(100%, 520px);
    }
}

/* ===== Access Screens Ultra Contrast Boost ===== */
.login-page {
    color: #1f2e55;
}

.login-page .arca-hero-panel::before {
    border: 1px solid #99a9cb;
    background: linear-gradient(164deg, #dce4f4 0%, #e8effa 100%);
    box-shadow: 11px 11px 24px rgba(129, 145, 180, 0.72), -8px -8px 22px rgba(255, 255, 255, 0.98);
}

.login-page .arca-hero-tag {
    color: #114a8b;
    font-weight: 800;
}

.login-page .arca-hero-title {
    color: #1a2f5f;
}

.login-page .arca-hero-subtitle {
    color: #2f4678;
}

.login-page .arca-hero-badges span {
    border: 1px solid #a8b8da;
    background: #f3f7ff;
    color: #2d4477;
}

.login-page .login-auth-card {
    border: 1px solid #9fb0d4;
    background: linear-gradient(170deg, #eef3fd 0%, #f8fbff 100%);
    box-shadow: 12px 12px 26px rgba(135, 151, 186, 0.72), -9px -9px 24px rgba(255, 255, 255, 0.99);
}

.login-page .login-form-label {
    color: #243a6a;
    font-weight: 800;
}

.login-page .login-form-control {
    border: 1px solid #8ea1ca;
    background: #ffffff;
    color: #1d2f5a;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 1px 5px rgba(98, 114, 151, 0.2);
}

.login-page .login-form-control::placeholder {
    color: #5b6f9b;
}

.login-page .login-form-control:focus {
    border-color: #405fb9;
    box-shadow: 0 0 0 3px rgba(64, 95, 185, 0.26);
}

.login-page .auth-back-btn {
    border: 1px solid #a5b5d5;
    color: #294070;
}

body:has(.login-page) .app-navbar {
    border-bottom: 1px solid #95a7cd;
    background: rgba(227, 236, 250, 0.93);
    box-shadow: 0 8px 20px rgba(99, 116, 156, 0.28);
}

body:has(.login-page) .app-signin-btn {
    border: 1px solid #3e59b2;
    background: linear-gradient(140deg, #3e5bc2, #4d6bd3);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(60, 82, 160, 0.34);
}

body:has(.login-page) .app-signin-btn {
    min-height: 42px;
    padding: 0.52rem 1rem;
    font-size: 0.94rem;
    font-weight: 700;
}

body:has(.login-page) .app-signin-btn i {
    font-size: 0.95rem;
}

body:has(.login-page) .app-content-inner {
    max-width: 100%;
}

body.page-home-index #mainLogo,
body.page-login-index #mainLogo {
    width: 10rem;
    height: 6rem;
    padding: 0.18rem;
}

body:has(.login-page) {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

body:has(.login-page) .app-content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

body:has(.login-page) .app-content-inner {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

body:has(.login-page) .auth-shell {
    flex: 1 1 auto;
    min-height: 0;
}

body:has(.login-page) .auth-grid {
    min-height: 100%;
    flex: 1 1 auto;
}

.login-error-modal {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(7, 18, 37, 0.48);
    opacity: 0;
    transition: opacity 160ms ease;
}

.login-error-modal[hidden] {
    display: none;
}

.login-error-modal.is-open {
    opacity: 1;
}

.login-error-card {
    width: min(100%, 440px);
    border: 1px solid rgba(176, 58, 83, 0.34);
    border-radius: 16px;
    background: linear-gradient(160deg, #fff8f9, #ffffff);
    box-shadow: 0 22px 56px rgba(42, 15, 24, 0.28);
    overflow: hidden;
    transform: translateY(8px) scale(0.98);
    transition: transform 160ms ease;
}

.login-error-modal.is-open .login-error-card {
    transform: translateY(0) scale(1);
}

.login-error-header,
.login-error-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.1rem;
}

.login-error-header {
    border-bottom: 1px solid rgba(176, 58, 83, 0.18);
    background: linear-gradient(135deg, #b72f4b, #d64e68);
    color: #ffffff;
}

.login-error-kicker {
    margin: 0 0 0.2rem;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.86;
}

.login-error-header h2 {
    margin: 0;
    font-size: 1.1rem;
}

.login-error-close,
.login-error-action {
    border: 0;
    border-radius: 10px;
    cursor: pointer;
}

.login-error-close {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
}

.login-error-body {
    padding: 1rem 1.1rem;
    color: #6f2132;
    font-weight: 650;
}

.login-error-body p {
    margin: 0;
}

.login-error-footer {
    justify-content: flex-end;
    border-top: 1px solid rgba(176, 58, 83, 0.12);
}

.login-error-action {
    min-height: 40px;
    padding: 0 1rem;
    background: #b72f4b;
    color: #ffffff;
    font-weight: 800;
}

.error-shell {
    min-height: calc(100dvh - var(--x-nav-height, 76px));
    display: grid;
    place-items: center;
    padding: clamp(1rem, 4vw, 3rem);
    background:
        radial-gradient(circle at 15% 12%, rgba(176, 58, 83, 0.12), transparent 32%),
        linear-gradient(150deg, #dce5f4, #f5f8ff);
}

.error-card {
    width: min(100%, 820px);
    border: 1px solid rgba(176, 58, 83, 0.26);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: 0 24px 64px rgba(36, 55, 94, 0.18);
    padding: clamp(1rem, 2.4vw, 1.8rem);
}

.error-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.error-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #ffe8ec;
    color: #b72f4b;
    font-size: 1.45rem;
}

.error-kicker {
    margin: 0;
    color: #b72f4b;
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.error-card h1 {
    margin: 0.2rem 0 0;
    color: #1f3260;
    font-size: clamp(1.35rem, 2.6vw, 2rem);
    line-height: 1.1;
}

.error-message,
.error-description {
    color: #40547e;
    overflow-wrap: anywhere;
}

.error-message {
    margin: 0.75rem 0 0;
    font-weight: 700;
}

.error-description {
    margin: 0.45rem 0 0;
}

.error-trace {
    margin-top: 1.1rem;
    border-top: 1px solid rgba(147, 168, 207, 0.42);
    padding-top: 0.9rem;
    color: #40547e;
    font-size: 0.88rem;
}

.error-trace code {
    color: #243a6a;
    overflow-wrap: anywhere;
}

.error-details {
    margin-top: 1rem;
}

.error-details summary {
    width: fit-content;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(86, 112, 163, 0.35);
    border-radius: 10px;
    background: #f3f7ff;
    color: #294070;
    padding: 0 0.8rem;
    font-weight: 800;
    cursor: pointer;
}

.error-details pre {
    max-height: 360px;
    overflow: auto;
    margin: 0.8rem 0 0;
    border: 1px solid rgba(147, 168, 207, 0.46);
    border-radius: 12px;
    background: #f8fbff;
    color: #1f3260;
    padding: 1rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-size: 0.82rem;
}

.error-actions {
    margin-top: 1.25rem;
    display: flex;
    justify-content: center;
}

.error-back-link {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: linear-gradient(140deg, #3f5ec7 0%, #4f6fd8 100%);
    color: #ffffff;
    padding: 0 1rem;
    font-weight: 800;
    text-decoration: none;
}

/* ===== Global Text Scale Boost ===== */
html {
    font-size: 15.5px;
}

body {
    line-height: 1.45;
}

.k-grid,
.k-button,
.k-input,
.k-textbox,
.k-dropdownlist,
.k-picker {
    font-size: 0.93rem;
}

@media (max-width: 767.98px) {
    html {
        font-size: 14px;
    }
}
