:root {
    color-scheme: light;
    --bg-top: #f6fbff;
    --bg-bottom: #cddcff;
    --glass-fill: rgba(255, 255, 255, 0.18);
    --glass-fill-strong: rgba(255, 255, 255, 0.26);
    --glass-stroke: rgba(255, 255, 255, 0.5);
    --glass-shadow: rgba(24, 55, 117, 0.18);
    --text-strong: #0f1732;
    --text-soft: rgba(15, 23, 50, 0.7);
    --text-muted: rgba(15, 23, 50, 0.56);
    --accent: #125cff;
    --accent-2: #2ed3ff;
    --accent-3: #89f3ff;
    --warning: #ff5b79;
    --surface-dark: rgba(16, 27, 61, 0.1);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    font-family: "Manrope", sans-serif;
    color: var(--text-strong);
    overflow-x: hidden;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.98), transparent 30%),
        radial-gradient(circle at 80% 15%, rgba(46, 211, 255, 0.28), transparent 24%),
        radial-gradient(circle at 30% 110%, rgba(18, 92, 255, 0.18), transparent 30%),
        linear-gradient(180deg, var(--bg-top), var(--bg-bottom));
}

.auth-body,
.dashboard-body {
    position: relative;
}

.auth-body::before {
    content: "";
    position: fixed;
    top: 12%;
    right: 10%;
    width: min(58vw, 28rem);
    height: min(58vw, 28rem);
    border-radius: 999px;
    background: radial-gradient(circle, rgba(137, 243, 255, 0.24), transparent 68%);
    filter: blur(22px);
    pointer-events: none;
    animation: haloDrift 16s ease-in-out infinite alternate;
}

.aurora,
.grid-glow {
    position: fixed;
    inset: auto;
    pointer-events: none;
}

.aurora {
    width: 18rem;
    height: 18rem;
    border-radius: 999px;
    filter: blur(26px);
    opacity: 0.72;
    will-change: transform;
}

.aurora-one {
    top: -8rem;
    right: -8rem;
    background: radial-gradient(circle, rgba(46, 211, 255, 0.55), transparent 68%);
    animation: auroraFloatOne 28s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate;
}

.aurora-two {
    bottom: -8rem;
    left: -8rem;
    background: radial-gradient(circle, rgba(18, 92, 255, 0.38), transparent 72%);
    animation: auroraFloatTwo 32s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate;
}

.grid-glow {
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.14) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.14) 1px, transparent 1px);
    background-size: 26px 26px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.3), transparent 72%);
    animation: gridDrift 18s linear infinite;
}

.auth-shell,
.dashboard-shell {
    width: min(100%, 1240px);
    margin: 0 auto;
    min-height: 100vh;
    padding: 18px 16px 32px;
}

.glass-surface {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--glass-stroke);
    background: linear-gradient(180deg, var(--glass-fill-strong), var(--glass-fill));
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    box-shadow: 0 24px 60px var(--glass-shadow);
}

.glass-surface::before {
    content: "";
    position: absolute;
    inset: -28% auto auto 60%;
    width: 16rem;
    height: 16rem;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.4), transparent 70%);
    pointer-events: none;
}

.eyebrow {
    margin: 0 0 12px;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--text-muted);
}

h1,
h2,
p {
    margin: 0;
}

h1 {
    font-family: "Sora", sans-serif;
    font-size: clamp(2.65rem, 11vw, 5rem);
    line-height: 0.92;
    letter-spacing: -0.06em;
}

.lead {
    margin-top: 18px;
    font-size: 1rem;
    line-height: 1.6;
    color: var(--text-soft);
}

.auth-stage {
    min-height: calc(100vh - 50px);
    display: grid;
    place-items: center;
}

.login-panel,
.dashboard-hero,
.dashboard-card {
    border-radius: 32px;
}

.primary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 22px;
    padding: 15px 18px;
    width: fit-content;
    color: white;
    font-weight: 800;
    font-size: 0.98rem;
    cursor: pointer;
    text-decoration: none;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    box-shadow: 0 18px 34px rgba(18, 92, 255, 0.26);
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        filter 180ms ease;
}

.primary-action:hover {
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 22px 40px rgba(18, 92, 255, 0.34);
    filter: saturate(1.08) brightness(1.02);
}

.primary-action:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.14),
        0 22px 40px rgba(18, 92, 255, 0.34);
}

.primary-action-block {
    width: 100%;
    margin-top: 10px;
}

.ghost-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid rgba(18, 92, 255, 0.18);
    background: rgba(255, 255, 255, 0.34);
    color: var(--text-strong);
    padding: 12px 18px;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.preview-kicker {
    display: block;
    margin-bottom: 6px;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.preview-card strong {
    display: block;
    font-size: 0.98rem;
    line-height: 1.35;
}

.login-panel {
    isolation: isolate;
    width: min(100%, 460px);
    padding: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.18)),
        linear-gradient(135deg, rgba(18, 92, 255, 0.08), rgba(46, 211, 255, 0.1));
    animation:
        panelFloat 9s ease-in-out infinite,
        panelGlow 12s ease-in-out infinite;
}

.panel-orbit {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
    overflow: visible;
}

.panel-orbit-track,
.panel-orbit-glow {
    fill: none;
    shape-rendering: geometricPrecision;
}

.panel-orbit-track {
    stroke: rgba(255, 255, 255, 0.18);
    stroke-width: 1;
}

.panel-orbit-glow {
    stroke: #71ddff;
    stroke-opacity: 0.95;
    stroke-width: 1.55;
    stroke-linecap: round;
    filter: drop-shadow(0 0 6px rgba(46, 211, 255, 0.3));
}

.panel-topbar {
    display: grid;
    gap: 12px;
}

.panel-topline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.45);
    color: var(--text-muted);
    font-size: 0.88rem;
    font-weight: 800;
}

.language-switcher {
    display: block;
}

.language-toggle {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 6px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.24);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 14px 28px rgba(18, 92, 255, 0.08);
}

.language-thumb {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    width: calc((100% - 18px) / 2);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.2), rgba(46, 211, 255, 0.18));
    border: 1px solid rgba(18, 92, 255, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 10px 18px rgba(18, 92, 255, 0.14);
    transition: transform 220ms ease;
}

.language-toggle.is-en .language-thumb {
    transform: translateX(calc(100% + 6px));
}

.language-option {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 58px;
    border: 0;
    border-radius: 18px;
    background: transparent;
    color: var(--text-strong);
    padding: 10px 12px;
    font: inherit;
    cursor: pointer;
    transition:
        transform 160ms ease,
        color 160ms ease,
        opacity 160ms ease;
}

.language-option:hover {
    transform: translateY(-1px);
}

.language-option:not(.is-active) {
    opacity: 0.72;
}

.language-option.is-active {
    color: #0a1838;
}

.language-toggle-compact {
    width: 110px;
    min-width: 110px;
    gap: 4px;
    padding: 4px;
    border-radius: 999px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.34),
        0 10px 18px rgba(18, 92, 255, 0.07);
}

.language-toggle-compact .language-thumb {
    top: 4px;
    bottom: 4px;
    left: 4px;
    width: calc((100% - 12px) / 2);
    border-radius: 999px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.4),
        0 8px 16px rgba(18, 92, 255, 0.12);
}

.language-toggle-compact.is-en .language-thumb {
    transform: translateX(calc(100% + 4px));
}

.language-option-compact {
    min-height: 42px;
    justify-content: center;
    gap: 0;
    padding: 6px;
    border-radius: 999px;
}

.language-option-compact .flag-badge {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
}

.language-option-compact .flag-badge svg,
.language-option-compact .flag-badge img {
    width: 26px;
    height: 26px;
}

.flag-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.5);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 4px 10px rgba(18, 92, 255, 0.14);
}

.flag-badge svg {
    width: 28px;
    height: 28px;
    display: block;
}

.flag-badge img {
    width: 28px;
    height: 28px;
    display: block;
    object-fit: cover;
    border-radius: 999px;
}

.language-code {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--text-muted);
}

.language-copy {
    display: grid;
    justify-items: start;
    gap: 2px;
}

.language-label {
    font-size: 0.9rem;
    font-weight: 700;
}

.live-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, #1ee993, #9effdb);
    box-shadow: 0 0 0 6px rgba(30, 233, 147, 0.16);
}

.panel-header {
    margin-top: 22px;
}

.panel-header h2 {
    font-family: "Sora", sans-serif;
    font-size: clamp(1.7rem, 7vw, 2.4rem);
    letter-spacing: -0.04em;
}

.panel-header p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.55;
}

.login-form {
    display: grid;
    gap: 14px;
    margin-top: 20px;
}

.field-shell {
    display: grid;
    gap: 8px;
}

.input-shell {
    position: relative;
}

.input-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    color: rgba(18, 92, 255, 0.66);
    transform: translateY(-50%);
    pointer-events: none;
}

.input-icon svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.field-shell label {
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--text-soft);
}

.field-shell input {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.38);
    padding: 16px 16px 16px 46px;
    font: inherit;
    color: var(--text-strong);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.field-shell input::placeholder {
    color: rgba(15, 23, 50, 0.46);
}

.field-shell input:focus {
    outline: 0;
    border-color: rgba(18, 92, 255, 0.42);
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.form-alert,
.field-error {
    color: var(--warning);
}

.form-alert {
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid rgba(255, 91, 121, 0.18);
    background: rgba(255, 91, 121, 0.08);
    line-height: 1.45;
}

.field-error {
    font-size: 0.82rem;
}

.dashboard-app {
    width: 100%;
    margin: 0;
    min-height: 100vh;
    padding: 0 16px 32px;
    --dashboard-frame-gap: 16px;
    --dashboard-navbar-height: 88px;
}

.dashboard-navbar {
    isolation: isolate;
    display: grid;
    gap: 14px;
    padding: 12px 14px;
    border-radius: 0 0 30px 30px;
    position: sticky;
    top: 0;
    z-index: 8;
}

.dashboard-navbar-brand,
.dashboard-navbar-tools,
.dashboard-user-pill {
    display: flex;
    align-items: center;
}

.dashboard-navbar-brand {
    gap: 10px;
}

.dashboard-brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.18));
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.dashboard-brand-mark span {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: linear-gradient(135deg, #1ee993, #8bffe3);
    box-shadow: 0 0 0 9px rgba(30, 233, 147, 0.14);
}

.dashboard-navbar-brand strong,
.dashboard-user-pill strong {
    display: block;
    font-size: 0.95rem;
}

.dashboard-navbar-tools {
    margin-left: auto;
    display: none;
}

.dashboard-language-switcher {
    margin: 0;
    display: inline-block;
    flex: 0 0 auto;
    width: auto;
}

.dashboard-sidebar-mobile-tools {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    margin-bottom: 18px;
}

.dashboard-sidebar-mobile-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-sidebar-mobile-tools .dashboard-user-pill {
    width: 100%;
    justify-content: flex-start;
}
.dashboard-user-pill {
    min-height: 42px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 10px 18px rgba(18, 92, 255, 0.07);
}

.dashboard-user-pill {
    gap: 8px;
    padding: 6px 12px 6px 6px;
}

.dashboard-user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 11px;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.78), rgba(46, 211, 255, 0.92));
    color: white;
    font-weight: 800;
}

.dashboard-user-label {
    display: block;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.dashboard-logout-form {
    margin: 0;
    flex: 0 0 auto;
}

.dashboard-logout-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(255, 91, 121, 0.28);
    border-radius: 999px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.22)),
        linear-gradient(135deg, rgba(255, 91, 121, 0.12), rgba(255, 141, 109, 0.12));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        0 10px 20px rgba(255, 91, 121, 0.12);
    color: #f25573;
    cursor: pointer;
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease,
        color 180ms ease;
}

.dashboard-logout-button svg {
    width: 19px;
    height: 19px;
    fill: currentColor;
}

.dashboard-logout-button:hover {
    transform: translateY(-1px) scale(1.02);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.46),
        0 14px 26px rgba(255, 91, 121, 0.18);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.46), rgba(255, 255, 255, 0.24)),
        linear-gradient(135deg, rgba(255, 91, 121, 0.2), rgba(255, 141, 109, 0.2));
}

.dashboard-logout-button:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 4px rgba(242, 85, 115, 0.14),
        0 14px 26px rgba(255, 91, 121, 0.18);
}

.dashboard-frame {
    display: grid;
    gap: 16px;
    margin-top: var(--dashboard-frame-gap);
}

.dashboard-sidebar {
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    left: auto;
    bottom: 0;
    width: min(88vw, 360px);
    z-index: 14;
    overflow: auto;
    padding: calc(env(safe-area-inset-top, 0px) + 18px) 18px calc(env(safe-area-inset-bottom, 0px) + 24px);
    border-radius: 30px 0 0 30px;
    opacity: 0;
    transform: translate3d(100%, 0, 0);
    pointer-events: none;
    transition:
        opacity 260ms ease,
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.dashboard-sidebar-user {
    margin-top: auto;
    padding-top: 18px;
}

.dashboard-user-pill-mobile {
    position: relative;
    align-items: stretch;
    min-height: 82px;
    padding: 14px 16px 14px 14px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.12)),
        rgba(255, 255, 255, 0.32);
    border: 1px solid rgba(173, 206, 255, 0.42);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.46),
        0 18px 28px rgba(18, 92, 255, 0.12);
}

.dashboard-user-pill-mobile::before {
    content: "";
    position: absolute;
    inset: 8px;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.06));
    pointer-events: none;
}

.dashboard-user-pill-mobile .dashboard-user-avatar,
.dashboard-user-pill-mobile > div {
    position: relative;
    z-index: 1;
}

.dashboard-user-pill-mobile .dashboard-user-avatar {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    box-shadow:
        0 10px 18px rgba(18, 92, 255, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.dashboard-user-pill-mobile .dashboard-user-label {
    color: rgba(66, 83, 116, 0.88);
}

.dashboard-user-pill-mobile strong {
    font-size: 1rem;
}

.dashboard-mobile-backdrop {
    position: fixed;
    inset: 0;
    z-index: 12;
    border: 0;
    padding: 0;
    background: rgba(15, 23, 50, 0.16);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.dashboard-mobile-fab,
.dashboard-sidebar-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    cursor: pointer;
}

.dashboard-mobile-fab {
    position: fixed;
    right: 18px;
    bottom: 20px;
    z-index: 30;
    width: 58px;
    height: 58px;
    border-radius: 999px;
    color: white;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    box-shadow:
        0 18px 34px rgba(18, 92, 255, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        filter 180ms ease;
}

.dashboard-mobile-fab svg,
.dashboard-sidebar-close svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

.dashboard-mobile-fab svg {
    transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
    transform-origin: center;
}

.dashboard-mobile-fab:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow:
        0 22px 40px rgba(18, 92, 255, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.32);
    filter: saturate(1.08) brightness(1.02);
}

.dashboard-mobile-fab:focus-visible,
.dashboard-sidebar-close:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.14),
        0 18px 34px rgba(18, 92, 255, 0.26);
}

.dashboard-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-sidebar-close {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 999px;
    color: var(--text-soft);
    background: rgba(255, 255, 255, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
}

.dashboard-body.dashboard-menu-open {
    overflow: hidden;
}

.dashboard-body.dashboard-menu-open .dashboard-mobile-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.dashboard-body.dashboard-menu-open .dashboard-sidebar {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
}

.dashboard-body.dashboard-menu-open .dashboard-mobile-fab {
    transform: translateY(-2px) scale(1.02);
    box-shadow:
        0 22px 40px rgba(18, 92, 255, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.32);
}

.dashboard-body.dashboard-menu-open .dashboard-mobile-fab svg {
    transform: rotate(90deg);
}

.dashboard-body.dashboard-users-overlay-open .dashboard-mobile-fab {
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px) scale(0.94);
}

.dashboard-navbar-orbit {
    inset: 0;
}

.dashboard-sidebar-head h2,
.dashboard-workspace-hero h1,
.dashboard-section-head h2,
.dashboard-rail-card h3 {
    font-family: "Sora", sans-serif;
    letter-spacing: -0.04em;
}

.dashboard-sidebar-head h2 {
    font-size: 1.45rem;
}

.dashboard-sidemenu {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.dashboard-sidemenu-link {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 58px;
    padding: 6px 12px 6px 8px;
    border-radius: 24px;
    color: var(--text-soft);
    text-decoration: none;
    font-weight: 800;
    background: rgba(255, 255, 255, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.45);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 10px 18px rgba(18, 92, 255, 0.07);
    transition:
        transform 180ms ease,
        box-shadow 180ms ease,
        border-color 180ms ease,
        color 180ms ease;
}

.dashboard-sidemenu-link::before {
    content: "";
    position: absolute;
    inset: 4px;
    z-index: 0;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08));
    transition:
        background 180ms ease,
        box-shadow 180ms ease,
        border 180ms ease;
}

.dashboard-sidemenu-link > span {
    position: relative;
    z-index: 1;
}

.dashboard-sidemenu-link:hover {
    transform: translateY(-1px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.38),
        0 14px 22px rgba(18, 92, 255, 0.09);
}

.dashboard-sidemenu-link.is-active {
    color: var(--text-strong);
    border-color: rgba(173, 206, 255, 0.7);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.42),
        0 16px 24px rgba(18, 92, 255, 0.12);
}

.dashboard-sidemenu-link.is-active::before {
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.2), rgba(46, 211, 255, 0.18));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 8px 16px rgba(18, 92, 255, 0.12);
}

.dashboard-sidemenu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
    color: rgba(18, 92, 255, 0.76);
}

.dashboard-sidemenu-icon svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.dashboard-sidemenu-link.section-home .dashboard-sidemenu-icon {
    color: #4f81ff;
    background: linear-gradient(135deg, rgba(79, 129, 255, 0.18), rgba(123, 197, 255, 0.16));
}

.dashboard-sidemenu-link.section-operations .dashboard-sidemenu-icon {
    color: #5f7cf6;
    background: linear-gradient(135deg, rgba(95, 124, 246, 0.18), rgba(137, 160, 255, 0.16));
}

.dashboard-sidemenu-link.section-clients .dashboard-sidemenu-icon {
    color: #5b6dff;
    background: linear-gradient(135deg, rgba(91, 109, 255, 0.18), rgba(151, 168, 255, 0.16));
}

.dashboard-sidemenu-link.section-audit .dashboard-sidemenu-icon {
    color: #4f7bff;
    background: linear-gradient(135deg, rgba(79, 123, 255, 0.18), rgba(104, 214, 255, 0.16));
}

.dashboard-sidemenu-link.section-reports .dashboard-sidemenu-icon {
    color: #5788ff;
    background: linear-gradient(135deg, rgba(87, 136, 255, 0.18), rgba(135, 229, 255, 0.16));
}

.dashboard-sidemenu-link.section-settings .dashboard-sidemenu-icon {
    color: #5977ff;
    background: linear-gradient(135deg, rgba(89, 119, 255, 0.18), rgba(145, 170, 255, 0.16));
}

.dashboard-sidebar-card {
    margin-top: 18px;
    padding: 18px;
    border-radius: 24px;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.16), rgba(137, 243, 255, 0.16));
    border: 1px solid rgba(255, 255, 255, 0.34);
}

.dashboard-sidebar-card h3 {
    margin-top: 4px;
    font-size: 1.05rem;
}

.dashboard-sidebar-card p,
.dashboard-kpi-card p,
.dashboard-canvas p,
.dashboard-rail-card p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.55;
}

.dashboard-workspace {
    display: grid;
    gap: 16px;
    min-width: 0;
    overflow-x: clip;
}

.dashboard-workspace-hero,
.dashboard-kpi-card,
.dashboard-canvas,
.dashboard-rail-card {
    border-radius: 30px;
    padding: 20px;
}

.dashboard-workspace-hero {
    display: grid;
    gap: 18px;
}

.dashboard-workspace-hero h1 {
    font-size: clamp(2.4rem, 9vw, 4.6rem);
    line-height: 0.94;
}

.dashboard-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dashboard-secondary-action {
    text-decoration: none;
}

.dashboard-kpi-grid,
.dashboard-workspace-grid,
.dashboard-canvas-grid,
.dashboard-rail {
    display: grid;
    gap: 14px;
}

.dashboard-kpi-card strong {
    display: block;
    margin-top: 8px;
    font-family: "Sora", sans-serif;
    font-size: clamp(2rem, 8vw, 3rem);
    letter-spacing: -0.05em;
}

.dashboard-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-section-head h2 {
    font-size: 1.45rem;
}

.dashboard-tag {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    color: var(--text-soft);
    font-size: 0.82rem;
    font-weight: 800;
    background: rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.36);
}

.dashboard-canvas-grid {
    margin-top: 18px;
}

.dashboard-canvas-card {
    min-height: 108px;
    padding: 18px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.36);
    color: var(--text-soft);
    font-weight: 800;
}

.dashboard-canvas-card-wide {
    min-height: 160px;
}

.dashboard-home-hero {
    align-items: start;
}

.dashboard-home-hero-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dashboard-home-grid {
    display: grid;
    gap: 16px;
}

.dashboard-home-card {
    display: grid;
    gap: 16px;
    padding: 20px;
    border-radius: 30px;
}

.dashboard-home-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.dashboard-home-card-head h2 {
    font-size: 1.34rem;
    font-family: "Sora", sans-serif;
    letter-spacing: -0.04em;
}

.dashboard-home-stat-pill {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    color: #1854c4;
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.16), rgba(46, 211, 255, 0.14));
    border: 1px solid rgba(173, 206, 255, 0.42);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.dashboard-home-stat-pill.is-warning {
    color: #a24a5a;
    background: linear-gradient(135deg, rgba(255, 91, 121, 0.14), rgba(255, 184, 199, 0.18));
    border-color: rgba(255, 91, 121, 0.2);
}

.dashboard-home-number {
    display: block;
    font-family: "Sora", sans-serif;
    font-size: clamp(2.1rem, 7vw, 3.4rem);
    letter-spacing: -0.07em;
    line-height: 0.95;
}

.dashboard-home-metric-row,
.dashboard-home-split {
    display: grid;
    gap: 16px;
}

.dashboard-home-mini-chart {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-items: end;
    gap: 8px;
    min-height: 118px;
    padding: 12px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.08));
    border: 1px solid rgba(255, 255, 255, 0.36);
}

.dashboard-home-mini-chart span {
    display: block;
    min-height: 18px;
    border-radius: 999px 999px 14px 14px;
    background: linear-gradient(180deg, rgba(46, 211, 255, 0.9), rgba(18, 92, 255, 0.78));
    box-shadow:
        0 10px 18px rgba(18, 92, 255, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
}

.dashboard-home-trendline {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.dashboard-home-trendline div {
    display: grid;
    gap: 4px;
    justify-items: center;
    padding: 10px 6px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.34);
}

.dashboard-home-trendline strong {
    font-size: 0.98rem;
    font-weight: 800;
}

.dashboard-home-trendline span {
    color: var(--text-muted);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.dashboard-home-ring {
    --ring-progress: 0;
    width: 124px;
    height: 124px;
    margin: 0 auto;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at center, rgba(235, 244, 255, 0.94) 0 46%, transparent 47%),
        conic-gradient(from -90deg, rgba(46, 211, 255, 0.95) 0 calc(var(--ring-progress) * 1%), rgba(18, 92, 255, 0.86) calc(var(--ring-progress) * 1%), rgba(255, 255, 255, 0.22) 0);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.5),
        0 18px 28px rgba(18, 92, 255, 0.12);
}

.dashboard-home-ring span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.54);
    font-family: "Sora", sans-serif;
    font-size: 1.02rem;
    font-weight: 800;
}

.dashboard-home-progress {
    height: 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.34);
    overflow: hidden;
}

.dashboard-home-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(18, 92, 255, 0.9), rgba(46, 211, 255, 0.88));
}

.dashboard-home-list,
.dashboard-home-actions-list {
    display: grid;
    gap: 12px;
}

.dashboard-home-list-row,
.dashboard-home-actions-row {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.34);
}

.dashboard-home-list-copy {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-home-list-copy strong,
.dashboard-home-chip strong,
.dashboard-home-actions-row strong {
    font-size: 0.94rem;
    font-weight: 800;
}

.dashboard-home-list-copy span,
.dashboard-home-actions-row span,
.dashboard-home-empty {
    color: var(--text-soft);
}

.dashboard-home-list-bar {
    height: 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    overflow: hidden;
}

.dashboard-home-list-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(46, 211, 255, 0.92), rgba(18, 92, 255, 0.84));
}

.dashboard-home-chip-block {
    display: grid;
    gap: 10px;
}

.dashboard-home-chip-block h3 {
    font-size: 0.95rem;
    font-weight: 800;
}

.dashboard-home-chiplist {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.dashboard-home-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.38);
}

.dashboard-home-chip small {
    color: #1854c4;
    font-size: 0.76rem;
    font-weight: 800;
}

.dashboard-home-chip.is-accent {
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.14), rgba(46, 211, 255, 0.14));
    border-color: rgba(173, 206, 255, 0.38);
}

.dashboard-home-chip.is-empty {
    color: var(--text-soft);
}

.dashboard-home-access-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-home-access-stat {
    display: grid;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.34);
}

.dashboard-home-access-stat strong {
    font-family: "Sora", sans-serif;
    font-size: 1.4rem;
    letter-spacing: -0.05em;
}

.dashboard-home-access-stat span {
    color: var(--text-muted);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.dashboard-home-trendline-access {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.dashboard-home-actions-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.dashboard-quicklist {
    margin: 12px 0 0;
    padding-left: 18px;
    color: var(--text-soft);
}

.dashboard-quicklist li + li {
    margin-top: 8px;
}

.dashboard-flash-stack {
    display: grid;
    gap: 10px;
}

.dashboard-flash {
    padding: 14px 16px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.32);
    color: var(--text-strong);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.34),
        0 12px 20px rgba(18, 92, 255, 0.06);
}

.dashboard-flash-success {
    border-color: rgba(30, 233, 147, 0.26);
    background: rgba(30, 233, 147, 0.08);
}

.dashboard-flash-error {
    border-color: rgba(255, 91, 121, 0.26);
    background: rgba(255, 91, 121, 0.08);
}

.dashboard-sidemenu-link.section-users .dashboard-sidemenu-icon {
    color: #4b7dff;
    background: linear-gradient(135deg, rgba(75, 125, 255, 0.18), rgba(122, 221, 255, 0.16));
}

.dashboard-sidemenu-link.section-teams .dashboard-sidemenu-icon {
    color: #3d86d8;
    background: linear-gradient(135deg, rgba(61, 134, 216, 0.18), rgba(90, 226, 255, 0.16));
}

.dashboard-sidemenu-link.section-incidents .dashboard-sidemenu-icon {
    color: #2f78db;
    background: linear-gradient(135deg, rgba(47, 120, 219, 0.2), rgba(101, 225, 255, 0.17));
}

.users-hero,
.users-summary-card,
.users-table-shell,
.users-edit-card,
.users-edit-meta {
    border-radius: 30px;
    padding: 20px;
}

.users-hero {
    display: grid;
    gap: 16px;
}

.users-summary-grid,
.users-edit-layout {
    display: grid;
    gap: 16px;
}

.users-summary-accordion {
    border-radius: 30px;
    padding: 12px;
}

.users-summary-toggle {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 8px;
    cursor: pointer;
}

.users-summary-toggle::-webkit-details-marker {
    display: none;
}

.users-summary-toggle-copy {
    min-width: 0;
}

.users-summary-toggle-copy strong {
    display: block;
    margin-top: 4px;
    font-family: "Sora", sans-serif;
    font-size: 1.2rem;
    letter-spacing: -0.04em;
}

.users-summary-toggle-copy p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.5;
}

.users-summary-toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 16px;
    border: 1px solid rgba(173, 206, 255, 0.56);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.18));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 10px 18px rgba(18, 92, 255, 0.1);
    color: #1854c4;
}

.users-summary-toggle-icon svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-summary-accordion[open] .users-summary-toggle-icon svg {
    transform: rotate(180deg);
}

.users-summary-accordion-content {
    display: none;
    padding-top: 10px;
}

.users-summary-accordion[open] .users-summary-accordion-content {
    display: block;
}

.users-summary-card strong {
    display: block;
    margin-top: 8px;
    font-family: "Sora", sans-serif;
    font-size: clamp(2rem, 7vw, 2.8rem);
    letter-spacing: -0.05em;
}

.users-summary-card p,
.users-offcanvas-copy,
.users-row p,
.users-empty p,
.users-edit-meta p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.55;
}

.users-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.users-section-head h2 {
    font-size: 1.4rem;
    font-family: "Sora", sans-serif;
    letter-spacing: -0.04em;
}

.users-section-head > div,
.users-row-main > div {
    min-width: 0;
}

.users-table {
    margin-top: 18px;
    display: grid;
    gap: 12px;
    overflow: visible;
}

.users-table-shell {
    overflow-x: clip;
    overflow-y: visible;
}

.users-table-head {
    display: none;
}

.users-table-head-cell {
    display: block;
}

.users-row {
    display: grid;
    gap: 14px;
    padding: 18px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.38);
    position: relative;
    z-index: 1;
}

.users-row strong {
    display: block;
}

.users-row-identity,
.users-mobile-meta {
    display: grid;
    gap: 10px;
}

.users-mobile-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.users-mobile-field {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.users-mobile-inline-field {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.users-mobile-inline-field .users-mobile-label,
.users-mobile-inline-field strong,
.users-mobile-inline-field p {
    margin: 0;
}

.users-mobile-inline-field .users-mobile-label {
    flex: 0 0 auto;
}

.users-mobile-inline-field strong,
.users-mobile-inline-field p {
    min-width: 0;
}

.users-mobile-label {
    color: var(--text-muted);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.users-row p + p {
    margin-top: 2px;
}

.users-row-main,
.users-actions {
    display: flex;
    gap: 12px;
}

.users-row-main {
    align-items: center;
    min-width: 0;
}

.users-actions {
    width: 100%;
    justify-content: flex-end;
}

.users-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.78), rgba(46, 211, 255, 0.92));
    color: white;
    font-weight: 800;
    flex: 0 0 42px;
}

.users-role-badge,
.users-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 0.84rem;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.users-role-badge.is-admin {
    color: #1846a2;
    background: rgba(18, 92, 255, 0.12);
}

.users-role-badge.is-user {
    color: #28697d;
    background: rgba(46, 211, 255, 0.12);
}

.users-status-badge.is-active {
    color: #1b7e5a;
    background: rgba(30, 233, 147, 0.12);
}

.users-status-badge.is-inactive {
    color: #b35464;
    background: rgba(255, 91, 121, 0.12);
}

.users-inline-action {
    min-height: 38px;
    padding: 10px 14px;
}

.users-actions-menu {
    position: relative;
    display: inline-grid;
    justify-items: end;
    isolation: isolate;
    width: 52px;
    margin-left: auto;
    overflow: visible;
}

.users-actions-menu[open] {
    z-index: 8;
}

.users-actions-menu summary {
    list-style: none;
}

.users-actions-menu summary::-webkit-details-marker {
    display: none;
}

.users-actions-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    min-height: 52px;
    padding: 10px 12px;
    position: relative;
    z-index: 3;
    border-color: rgba(18, 92, 255, 0.18);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.2), rgba(46, 211, 255, 0.18));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 10px 18px rgba(18, 92, 255, 0.14);
    transition:
        transform 220ms ease,
        background-color 220ms ease,
        box-shadow 220ms ease,
        border-radius 220ms ease,
        border-color 220ms ease;
}

.users-actions-trigger svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
    transition: transform 220ms ease;
}

.users-actions-menu[open] .users-actions-trigger {
    transform: translateY(-1px) scale(1.01);
    border-radius: 18px;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.users-actions-menu[open] .users-actions-trigger svg {
    transform: scale(0.9);
}

.users-actions-dropdown {
    position: absolute;
    top: auto;
    bottom: -6px;
    right: 0;
    width: min(196px, calc(100vw - 88px));
    padding: 10px 10px 58px;
    border-radius: 26px;
    display: grid;
    gap: 8px;
    z-index: 2;
    border: 1px solid rgba(18, 92, 255, 0.18);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.2), rgba(46, 211, 255, 0.18));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 18px 32px rgba(18, 92, 255, 0.14);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform-origin: bottom right;
    transform: translateY(10px) scale(0.3);
    transition:
        opacity 220ms ease,
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0ms linear 220ms;
}

.users-row strong,
.users-row p,
.users-dropdown-action {
    overflow-wrap: anywhere;
}

.users-actions-menu[open] .users-actions-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition:
        opacity 220ms ease,
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0ms linear 0ms;
}

.users-dropdown-action {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, 0.44);
    border-radius: 16px;
    background: rgb(238 245 255);
    color: var(--text-strong);
    font: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform 180ms ease,
        border-color 180ms ease,
        background-color 180ms ease;
}

.users-dropdown-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.54), rgba(255, 255, 255, 0.34));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 8px 14px rgba(16, 35, 79, 0.08);
}

.users-dropdown-action-icon svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

.users-dropdown-action-icon.is-edit {
    color: #1854c4;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.16));
    border-color: rgba(18, 92, 255, 0.18);
}

.users-dropdown-action-icon.is-detail {
    color: #28697d;
    background: linear-gradient(135deg, rgba(46, 211, 255, 0.18), rgba(137, 243, 255, 0.18));
    border-color: rgba(46, 211, 255, 0.2);
}

.users-dropdown-action-icon.is-warning {
    color: #bf4762;
    background: linear-gradient(135deg, rgba(255, 91, 121, 0.16), rgba(255, 184, 199, 0.2));
    border-color: rgba(255, 91, 121, 0.2);
}

.users-dropdown-action-icon.is-success {
    color: #1b8a63;
    background: linear-gradient(135deg, rgba(30, 233, 147, 0.16), rgba(110, 244, 198, 0.2));
    border-color: rgba(30, 233, 147, 0.22);
}

.users-dropdown-action:hover {
    transform: translateY(-1px);
    border-color: rgba(18, 92, 255, 0.28);
    background: rgb(232 241 255);
}

@media (max-width: 767px) {
    .users-dropdown-action {
        background: rgb(238 245 255);
    }

    .users-dropdown-action:hover {
        background: rgb(232 241 255);
    }
}

.users-dropdown-action.is-warning {
    color: #bf4762;
    border-color: rgba(255, 91, 121, 0.22);
    background: rgb(255 242 245);
}

.users-dropdown-action.is-success {
    color: #1b8a63;
    border-color: rgba(30, 233, 147, 0.22);
    background: rgb(239 252 246);
}

.users-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 24;
    background: rgba(15, 23, 50, 0.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.users-modal {
    position: fixed;
    top: 16px;
    bottom: 16px;
    left: 50%;
    z-index: 25;
    width: min(1040px, calc(100vw - 32px));
    padding: 18px;
    border-radius: 30px;
    opacity: 0;
    transform: translateX(-50%) translateY(16px) scale(0.98);
    pointer-events: none;
    overflow: hidden;
    transition:
        opacity 220ms ease,
        transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-modal-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    min-height: 0;
}

.users-modal-loading,
.users-detail-empty,
.users-detail-controls,
.users-detail-entry {
    border-radius: 24px;
    padding: 16px;
}

.users-detail-entry {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    min-height: max-content;
}

.users-detail-modal-head {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.users-detail-modal-head h2 {
    font-family: "Sora", sans-serif;
    font-size: 1.65rem;
    letter-spacing: -0.05em;
}

.users-detail-modal-copy {
    margin-top: 10px;
    color: var(--text-soft);
    line-height: 1.55;
}

.users-modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.34);
    color: var(--text-soft);
    cursor: pointer;
}

.users-modal-close svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.users-detail-tabs {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 8px;
    padding: 6px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(255, 255, 255, 0.24);
    width: fit-content;
}

.users-detail-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 14px;
    border-radius: 18px;
    color: var(--text-soft);
    text-decoration: none;
    font-weight: 800;
}

.users-detail-tab span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    min-height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.34);
    font-size: 0.82rem;
}

.users-detail-tab.is-active {
    color: #0a1838;
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.2), rgba(46, 211, 255, 0.18));
    border: 1px solid rgba(18, 92, 255, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 10px 18px rgba(18, 92, 255, 0.14);
}

.users-detail-filters-accordion {
    flex: 0 0 auto;
    position: relative;
    z-index: 3;
    border-radius: 28px;
    padding: 12px;
    overflow: visible;
}

.users-detail-filters-toggle {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    cursor: pointer;
}

.users-detail-filters-toggle::-webkit-details-marker {
    display: none;
}

.users-detail-filters-copy {
    min-width: 0;
}

.users-detail-filters-copy strong {
    display: block;
    margin-top: 4px;
    font-family: "Sora", sans-serif;
    font-size: 1.06rem;
    letter-spacing: -0.04em;
}

.users-detail-filters-copy p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.45;
}

.users-detail-filters-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 16px;
    border: 1px solid rgba(173, 206, 255, 0.56);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.18));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 10px 18px rgba(18, 92, 255, 0.1);
    color: #1854c4;
}

.users-detail-filters-icon svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-detail-filters-accordion[open] .users-detail-filters-icon svg {
    transform: rotate(180deg);
}

.users-detail-filters-content {
    display: none;
    padding-top: 10px;
    overflow: visible;
}

.users-detail-filters-accordion[open] .users-detail-filters-content {
    display: block;
}

.users-detail-controls {
    display: grid;
    gap: 12px;
    align-items: stretch;
    min-height: max-content;
    overflow: visible;
}

.users-detail-control {
    position: relative;
    display: grid;
    gap: 6px;
    align-content: start;
    overflow: visible;
}

.users-detail-control span {
    font-size: 0.85rem;
    font-weight: 800;
    color: var(--text-soft);
    line-height: 1.15;
}

.users-detail-apply {
    min-height: 52px;
    align-self: end;
}

.users-detail-controls .users-input,
.users-detail-controls .users-select {
    min-height: 56px;
}

.users-detail-results {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 4px;
}

.users-detail-entry-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.users-detail-entry-head strong {
    display: block;
    font-size: 1rem;
}

.users-detail-entry-head p {
    margin-top: 6px;
    color: var(--text-soft);
}

.users-detail-badge {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.users-detail-badge.is-action,
.users-detail-badge.is-login {
    color: #1854c4;
    background: rgba(18, 92, 255, 0.12);
}

.users-detail-badge.is-danger {
    color: #bf4762;
    background: rgba(255, 91, 121, 0.12);
}

.users-detail-badge.is-neutral {
    color: var(--text-soft);
    background: rgba(255, 255, 255, 0.24);
}

.users-detail-meta {
    display: grid;
    gap: 12px;
    margin: 14px 0 0;
    align-items: start;
}

.users-detail-meta > div {
    display: grid;
    gap: 4px;
    align-content: start;
}

.users-detail-meta dt {
    margin: 0 0 4px;
    color: var(--text-muted);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.users-detail-meta dd {
    margin: 0;
    color: var(--text-strong);
    line-height: 1.5;
}

.users-detail-entry-login {
    gap: 10px;
    padding: 14px 14px 12px;
}

.users-detail-entry-login .users-detail-entry-head {
    align-items: center;
    gap: 10px;
}

.users-detail-entry-login .users-detail-entry-head p {
    margin-top: 2px;
    font-size: 0.96rem;
    line-height: 1.35;
}

.users-detail-entry-login .users-detail-badge {
    min-height: 30px;
    padding: 0 10px;
    font-size: 0.78rem;
}

.users-detail-entry-login .users-detail-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    margin-top: 0;
}

.users-detail-entry-login .users-detail-meta > div {
    gap: 2px;
}

.users-detail-entry-login .users-detail-meta dt {
    margin-bottom: 1px;
    font-size: 0.68rem;
}

.users-detail-entry-login .users-detail-meta dd {
    font-size: 0.98rem;
    line-height: 1.28;
}

.users-detail-entry-login .users-detail-meta-useragent {
    grid-column: 1 / -1;
}

.users-detail-entry-login .users-detail-meta-useragent dd {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
}

.users-detail-pagination {
    display: flex;
    flex: 0 0 auto;
    justify-content: center;
    padding-top: 6px;
}

.users-detail-pagination-shell {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-width: min(100%, 420px);
    padding: 10px 12px;
    border-radius: 28px;
    background:
        linear-gradient(140deg, rgba(255, 255, 255, 0.46), rgba(173, 215, 255, 0.34)),
        radial-gradient(circle at 50% 120%, rgba(42, 151, 255, 0.18), transparent 52%);
}

.users-detail-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    border: 1px solid rgba(148, 186, 255, 0.46);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.17), rgba(46, 211, 255, 0.16));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.48),
        0 12px 24px rgba(34, 88, 200, 0.12);
    color: var(--text-strong);
    text-decoration: none;
    font-weight: 800;
    transition:
        transform 180ms ease,
        border-color 180ms ease,
        background 180ms ease,
        box-shadow 180ms ease,
        opacity 180ms ease;
}

.users-detail-page svg {
    width: 22px;
    height: 22px;
    fill: currentColor;
}

.users-detail-page:hover {
    transform: translateY(-1px);
    border-color: rgba(78, 153, 255, 0.56);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.24), rgba(46, 211, 255, 0.22));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.54),
        0 14px 28px rgba(34, 88, 200, 0.18);
}

.users-detail-page.is-disabled {
    opacity: 0.38;
    pointer-events: none;
    box-shadow: none;
}

.users-detail-page.is-next {
    justify-self: end;
}

.users-detail-page-status {
    display: grid;
    justify-items: center;
    gap: 8px;
    min-width: 0;
    padding: 10px 18px;
    border-radius: 22px;
    border: 1px solid rgba(148, 186, 255, 0.42);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.14), rgba(46, 211, 255, 0.16));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.44),
        0 14px 28px rgba(18, 92, 255, 0.1);
}

.users-detail-page-kicker {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.users-detail-page-count {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    min-width: 0;
}

.users-detail-page-status strong {
    font-family: "Sora", sans-serif;
    font-size: 1.55rem;
    letter-spacing: -0.07em;
    line-height: 1;
}

.users-detail-page-status small {
    color: var(--text-soft);
    font-size: 0.88rem;
    font-weight: 800;
    white-space: nowrap;
}

.users-inline-action.is-warning {
    border-color: rgba(255, 91, 121, 0.24);
    color: #bf4762;
}

.users-inline-action.is-success {
    border-color: rgba(30, 233, 147, 0.24);
    color: #1b8a63;
}

.users-empty {
    padding: 22px;
    border-radius: 24px;
    border: 1px dashed rgba(255, 255, 255, 0.46);
    background: rgba(255, 255, 255, 0.18);
}

.users-offcanvas-backdrop {
    position: fixed;
    inset: 0;
    z-index: 18;
    background: rgba(15, 23, 50, 0.16);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
}

.users-offcanvas {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 19;
    width: min(100vw, 460px);
    padding: calc(env(safe-area-inset-top, 0px) + 22px) 20px calc(env(safe-area-inset-bottom, 0px) + 24px);
    border-radius: 32px 0 0 32px;
    overflow: auto;
    opacity: 0;
    transform: translate3d(100%, 0, 0);
    pointer-events: none;
    transition:
        opacity 240ms ease,
        transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-offcanvas-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.users-offcanvas-head h2 {
    font-size: 1.45rem;
    font-family: "Sora", sans-serif;
    letter-spacing: -0.04em;
}

.users-offcanvas-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.34);
    color: var(--text-soft);
    cursor: pointer;
}

.users-offcanvas-close svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.users-form {
    margin-top: 16px;
}

.users-form-grid {
    display: grid;
    gap: 14px;
}

.users-field {
    display: grid;
    gap: 8px;
}

.users-field label {
    font-size: 0.92rem;
    font-weight: 800;
    color: var(--text-soft);
}

.users-input,
.users-select {
    width: 100%;
    min-height: 54px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.38);
    padding: 0 16px;
    font: inherit;
    color: var(--text-strong);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.users-textarea {
    width: 100%;
    min-height: 140px;
    resize: vertical;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.38);
    padding: 14px 16px;
    font: inherit;
    color: var(--text-strong);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.users-select {
    appearance: none;
}

.users-custom-select {
    position: relative;
    overflow: visible;
}

.users-custom-select .users-select {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

.users-custom-select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 54px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.38);
    padding: 0 16px;
    font: inherit;
    color: var(--text-strong);
    text-align: left;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        background 180ms ease,
        transform 180ms ease;
}

.users-custom-select-label {
    min-width: 0;
    font-weight: 700;
}

.users-custom-select-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 14px;
    border: 1px solid rgba(173, 206, 255, 0.5);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.16), rgba(46, 211, 255, 0.16));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42);
    color: #1854c4;
}

.users-custom-select-icon svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-custom-select-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 32;
    display: grid;
    gap: 8px;
    padding: 10px;
    border-radius: 24px;
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
    transform-origin: top center;
    pointer-events: none;
    background: linear-gradient(180deg, #eef5ff, #e7f1ff);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.72),
        0 18px 40px rgba(28, 74, 170, 0.14);
    transition:
        opacity 180ms ease,
        transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.users-custom-select-option {
    display: grid;
    gap: 2px;
    width: 100%;
    min-height: 54px;
    padding: 10px 14px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 18px;
    background: rgba(244, 248, 255, 0.94);
    color: var(--text-strong);
    text-align: left;
    cursor: pointer;
    transition:
        border-color 180ms ease,
        background 180ms ease,
        transform 180ms ease,
        box-shadow 180ms ease;
}

.users-custom-select-option-title {
    font-weight: 800;
}

.users-custom-select-option-copy {
    color: var(--text-soft);
    line-height: 1.35;
}

.users-custom-select-option:hover,
.users-custom-select-option.is-selected {
    border-color: rgba(18, 92, 255, 0.24);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.14), rgba(46, 211, 255, 0.12));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.52),
        0 12px 24px rgba(18, 92, 255, 0.08);
}

.users-custom-select-option:hover {
    transform: translateY(-1px);
}

.users-custom-select.is-open .users-custom-select-trigger {
    border-color: rgba(18, 92, 255, 0.42);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.14), rgba(46, 211, 255, 0.12));
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.users-custom-select.is-open .users-custom-select-icon svg {
    transform: rotate(180deg);
}

.users-custom-select.is-open .users-custom-select-dropdown {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.users-custom-select.is-open {
    z-index: 24;
}

.users-custom-select.is-disabled .users-custom-select-trigger {
    opacity: 0.62;
    cursor: not-allowed;
}

.users-custom-select.is-disabled .users-custom-select-icon {
    color: rgba(24, 84, 196, 0.55);
}

.users-input:focus,
.users-select:focus,
.users-textarea:focus {
    outline: 0;
    border-color: rgba(18, 92, 255, 0.42);
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.teams-register-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.18), rgba(46, 211, 255, 0.16));
    color: #1846a2;
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.teams-part-number-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(18, 92, 255, 0.12);
    color: #1846a2;
    font-size: 1rem;
    font-weight: 800;
    white-space: nowrap;
}

.teams-avatar {
    background: linear-gradient(135deg, rgba(61, 134, 216, 0.82), rgba(90, 226, 255, 0.9));
}

.teams-desktop-name {
    display: none;
    min-width: 0;
}

.teams-desktop-name strong {
    margin: 0;
}

.teams-uppercase-input,
.teams-business-data {
    text-transform: uppercase;
}

.teams-mobile-identity {
    min-width: 0;
}

.teams-mobile-meta {
    grid-template-columns: 1fr;
}

.teams-components-mobile-field {
    grid-column: 1 / -1;
}

.teams-registration-cell,
.teams-part-number-cell {
    display: none;
}

.teams-description-desktop-cell,
.teams-created-desktop-cell,
.teams-created-mobile-field {
    min-width: 0;
}

.teams-description-desktop-cell,
.teams-created-desktop-cell {
    display: none;
}

.teams-description-desktop-cell p,
.teams-created-desktop-cell span,
.teams-created-mobile-field p {
    margin: 0;
}

.teams-description-cell p {
    margin: 0;
}

.teams-inline-components {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.teams-components-summary {
    margin-top: 18px;
    padding: 18px;
    border-radius: 24px;
}

.teams-components-summary h3 {
    margin-top: 6px;
    font-family: "Sora", sans-serif;
    font-size: 1.28rem;
    letter-spacing: -0.04em;
}

.teams-overview-layout {
    display: grid;
    gap: 16px;
}

.teams-components-summary p {
    margin-top: 8px;
    color: var(--text-soft);
    line-height: 1.55;
}

.teams-summary-accordion,
.teams-filters-accordion {
    margin-top: 0;
}

.teams-filter-controls {
    padding: 14px;
}

.teams-filter-control-search {
    grid-column: 1 / -1;
}

.teams-filter-clear {
    min-height: 52px;
    justify-content: center;
    text-decoration: none;
}

.teams-components-existing {
    margin-top: 16px;
    display: grid;
    gap: 10px;
}

.teams-components-existing-label {
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.teams-components-pill-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.teams-components-pill {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.44);
    background: rgba(18, 92, 255, 0.12);
    color: #1846a2;
    font-size: 0.84rem;
    font-weight: 800;
}

.teams-components-pill.is-empty {
    background: rgba(255, 255, 255, 0.44);
    color: var(--text-soft);
}

.incidents-uppercase-input,
.incidents-business-data {
    text-transform: uppercase;
}

.incidents-filter-controls {
    padding: 14px;
}

.incidents-filter-control-search {
    grid-column: 1 / -1;
}

.incidents-components-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px;
}

.incidents-components-picker.is-empty::after {
    content: "Selecciona un equipo para habilitar sus partes.";
    color: var(--text-muted);
    font-size: 0.86rem;
}

.incidents-component-option {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.incidents-component-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.incidents-component-option .teams-components-pill {
    transition:
        border-color 180ms ease,
        background 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.incidents-component-option input:checked + .teams-components-pill {
    border-color: rgba(18, 92, 255, 0.5);
    background: linear-gradient(135deg, rgba(18, 92, 255, 0.28), rgba(46, 211, 255, 0.24));
    color: #0f3fb2;
    box-shadow:
        0 0 0 4px rgba(18, 92, 255, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.62),
        0 14px 28px rgba(18, 92, 255, 0.14);
    transform: translateY(-1px) scale(1.01);
}

.incidents-team-cell strong,
.incidents-failure-cell strong,
.incidents-date-cell strong {
    margin: 0;
}

.incidents-team-cell,
.incidents-failure-cell,
.incidents-components-cell,
.incidents-replacements-cell,
.incidents-date-cell {
    min-width: 0;
}

.incidents-team-meta,
.incidents-date-cell span {
    display: block;
    margin-top: 6px;
    color: var(--text-soft);
}

.incidents-failure-cell p {
    margin: 8px 0 0;
}

.incidents-mobile-meta {
    grid-template-columns: 1fr;
}

.incidents-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.incidents-card-identity {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.incidents-card-title {
    min-width: 0;
}

.incidents-card-title strong {
    margin-top: 4px;
    font-size: 1.2rem;
    letter-spacing: -0.04em;
}

.incidents-card-grid {
    grid-template-columns: 1fr;
}

.incidents-card-desktop {
    display: none;
}

.incidents-card-field {
    display: grid;
    gap: 8px;
    min-width: 0;
    padding: 14px 16px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.38);
    background: rgba(255, 255, 255, 0.18);
}

.incidents-card-label {
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.incidents-card-field p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.55;
}

.incidents-card-chips {
    margin-top: 0;
}

.incidents-registration-cell,
.incidents-team-cell,
.incidents-failure-cell,
.incidents-components-cell,
.incidents-replacements-cell,
.incidents-date-cell {
    display: none;
}

.users-help {
    color: var(--text-muted);
    font-size: 0.8rem;
    line-height: 1.4;
}

.users-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.users-edit-side {
    display: grid;
    gap: 16px;
}

.users-meta-list {
    display: grid;
    gap: 14px;
    margin: 14px 0 0;
}

.users-meta-list dt {
    margin: 0 0 4px;
    color: var(--text-muted);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.users-meta-list dd {
    margin: 0;
    color: var(--text-strong);
    font-weight: 700;
}

.dashboard-body.dashboard-user-panel-open {
    overflow: hidden;
}

.dashboard-body.dashboard-user-panel-open .users-offcanvas-backdrop:not(.teams-components-backdrop) {
    opacity: 1;
    pointer-events: auto;
}

.dashboard-body.dashboard-user-panel-open .users-offcanvas:not(.teams-components-offcanvas) {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
}

.dashboard-body.dashboard-team-components-open {
    overflow: hidden;
}

.dashboard-body.dashboard-team-components-open .teams-components-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.dashboard-body.dashboard-team-components-open .teams-components-offcanvas {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
}

.dashboard-body.dashboard-user-details-open {
    overflow: hidden;
}

.dashboard-body.dashboard-user-details-open .users-modal-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.dashboard-body.dashboard-user-details-open .users-modal {
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
    pointer-events: auto;
}

@media (min-width: 768px) {
    .auth-shell,
    .dashboard-shell,
    .dashboard-app {
        padding: 28px;
    }

    .auth-stage {
        min-height: calc(100vh - 56px);
    }

    .login-panel {
        width: min(100%, 500px);
        padding: 24px;
    }

    .panel-topbar {
        grid-template-columns: auto 1fr;
        align-items: center;
    }

    .language-switcher {
        justify-self: end;
        width: min(100%, 320px);
    }

    .dashboard-app {
        padding-top: 0;
    }

    .dashboard-navbar {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        gap: 12px;
        padding: 10px 18px 12px;
    }

    .dashboard-navbar-tools {
        display: flex;
        align-items: center;
        gap: 12px;
        justify-content: flex-end;
        flex-wrap: nowrap;
    }

    .dashboard-language-switcher {
        justify-self: auto;
        width: auto;
    }

    .dashboard-sidebar-mobile-tools {
        display: none;
    }

    .dashboard-sidebar-user {
        display: none;
    }

    .dashboard-frame {
        grid-template-columns: 292px minmax(0, 1fr);
        align-items: start;
        gap: 18px;
    }

    .dashboard-sidebar {
        position: sticky;
        top: calc(var(--dashboard-navbar-height) + var(--dashboard-frame-gap));
        right: auto;
        left: auto;
        bottom: auto;
        width: auto;
        max-width: 100%;
        z-index: auto;
        overflow: visible;
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }

    .dashboard-mobile-fab,
    .dashboard-mobile-backdrop,
    .dashboard-sidebar-close {
        display: none;
    }

    .dashboard-workspace-hero {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
        padding: 28px;
    }

    .dashboard-home-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
        align-items: stretch;
    }

    .dashboard-home-card {
        min-height: 100%;
    }

    .dashboard-home-card:last-child {
        grid-column: 1 / -1;
    }

    .dashboard-home-metric-row,
    .dashboard-home-split {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }

    .dashboard-home-card:last-child .dashboard-home-access-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 18px;
    }

    .dashboard-workspace-grid {
        grid-template-columns: minmax(0, 1.45fr) 320px;
        gap: 18px;
    }

    .dashboard-canvas-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

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

    .users-hero {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
    }

    .users-summary-accordion {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        overflow: visible;
    }

    .users-summary-toggle {
        display: none;
    }

    .users-summary-accordion-content {
        display: block;
        padding-top: 0;
    }

    .users-summary-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .teams-filters-accordion {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        overflow: visible;
    }

    .teams-filters-accordion .users-detail-filters-toggle {
        display: none;
    }

    .teams-filters-accordion .users-detail-filters-content {
        display: block;
        padding-top: 0;
    }

    .teams-filter-controls {
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: end;
        padding: 8px 16px 12px;
    }

    .teams-filter-control-search {
        grid-column: auto;
    }

    .teams-filter-clear,
    .teams-filter-controls .users-detail-apply {
        min-width: 180px;
    }

    .teams-overview-layout {
        grid-template-columns: minmax(0, 1.42fr) minmax(320px, 0.9fr);
        gap: 18px;
        align-items: start;
    }

    .teams-overview-layout .teams-summary-accordion,
    .teams-overview-layout .teams-filters-accordion {
        padding: 12px;
        border: 1px solid var(--glass-stroke);
        background: linear-gradient(180deg, var(--glass-fill-strong), var(--glass-fill));
        box-shadow: 0 24px 60px var(--glass-shadow);
        backdrop-filter: blur(28px) saturate(180%);
        -webkit-backdrop-filter: blur(28px) saturate(180%);
        overflow: hidden;
    }

    .teams-overview-layout .users-summary-toggle,
    .teams-overview-layout .users-detail-filters-toggle {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 14px;
        padding: 8px;
        cursor: pointer;
        pointer-events: auto;
    }

    .teams-overview-layout .users-summary-toggle-icon,
    .teams-overview-layout .users-detail-filters-icon {
        display: inline-flex;
    }

    .teams-overview-layout .users-summary-accordion-content,
    .teams-overview-layout .users-detail-filters-content {
        display: none;
        padding-top: 10px;
    }

    .teams-overview-layout .users-summary-accordion[open] .users-summary-accordion-content,
    .teams-overview-layout .users-detail-filters-accordion[open] .users-detail-filters-content {
        display: block;
    }

    .teams-overview-layout .users-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .teams-overview-layout .teams-filter-controls {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        align-items: stretch;
        min-height: auto;
        padding: 16px;
    }

    .teams-overview-layout .teams-filter-control-search {
        grid-column: 1;
    }

    .teams-overview-layout .teams-filter-controls .users-detail-apply,
    .teams-overview-layout .teams-filter-clear {
        width: 100%;
        min-width: 0;
    }

    .teams-overview-layout .incidents-filter-controls {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        align-items: stretch;
        min-height: auto;
        padding: 16px;
    }

    .teams-overview-layout .incidents-filter-control-search {
        grid-column: 1;
    }

    .teams-overview-layout .incidents-filter-controls .users-detail-apply,
    .teams-overview-layout .incidents-filter-controls .teams-filter-clear {
        width: 100%;
        min-width: 0;
    }

    .users-modal {
        top: 56px;
        bottom: 28px;
        width: min(1040px, calc(100vw - 56px));
    }

    .users-detail-filters-accordion {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        overflow: visible;
    }

    .users-detail-filters-toggle {
        display: none;
    }

    .users-detail-filters-content {
        display: block;
        padding-top: 0;
    }

    .users-detail-controls {
        grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
        align-items: end;
        min-height: 108px;
    }

    .users-detail-controls {
        padding: 8px 16px 12px;
    }

    .users-detail-apply {
        min-width: 220px;
    }

    .users-detail-meta {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .users-detail-meta .is-full {
        grid-column: 1 / -1;
    }

    .users-detail-entry-login {
        gap: 14px;
        padding: 16px;
    }

    .users-detail-entry-login .users-detail-entry-head {
        align-items: flex-start;
        gap: 12px;
    }

    .users-detail-entry-login .users-detail-entry-head p {
        margin-top: 6px;
        font-size: 1rem;
        line-height: 1.5;
    }

    .users-detail-entry-login .users-detail-badge {
        min-height: 34px;
        padding: 0 12px;
        font-size: 0.82rem;
    }

    .users-detail-entry-login .users-detail-meta {
        gap: 12px;
        margin-top: 14px;
    }

    .users-detail-entry-login .users-detail-meta > div {
        gap: 4px;
    }

    .users-detail-entry-login .users-detail-meta dt {
        margin-bottom: 4px;
        font-size: 0.76rem;
    }

    .users-detail-entry-login .users-detail-meta dd {
        font-size: 1rem;
        line-height: 1.5;
    }

    .users-detail-entry-login .users-detail-meta-useragent dd {
        display: block;
        -webkit-line-clamp: unset;
        overflow: visible;
        word-break: normal;
    }

    .teams-table-head,
    .teams-row {
        display: grid;
        grid-template-columns: 34px minmax(116px, 0.48fr) minmax(150px, 0.82fr) minmax(240px, 1.62fr) minmax(104px, 0.5fr) 64px;
        align-items: center;
        gap: 12px;
    }

    .teams-table-head {
        padding: 0 18px;
        color: var(--text-muted);
        font-size: 0.8rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .teams-col-registration,
    .teams-registration-cell {
        display: block;
        justify-self: center;
        text-align: center;
    }

    .teams-col-part-number,
    .teams-part-number-cell {
        display: block;
        justify-self: center;
        text-align: center;
    }

    .teams-col-name,
    .teams-name-cell {
        justify-self: stretch;
        text-align: left;
    }

    .teams-col-description,
    .teams-description-desktop-cell {
        justify-self: stretch;
        text-align: left;
    }

    .teams-col-created,
    .teams-created-desktop-cell {
        justify-self: center;
        text-align: center;
    }

    .teams-col-actions,
    .teams-actions-cell {
        justify-self: end;
        text-align: right;
    }

    .teams-desktop-name {
        display: block;
    }

    .teams-row .teams-avatar {
        display: none;
    }

    .teams-description-desktop-cell,
    .teams-created-desktop-cell {
        display: block;
    }

    .teams-row .teams-mobile-meta {
        display: none;
    }

    .teams-description-desktop-cell {
        display: grid;
        gap: 10px;
        align-content: center;
    }

    .teams-description-desktop-cell .teams-inline-components {
        margin-top: 0;
    }

    .teams-row .teams-mobile-identity {
        display: none;
    }

    .teams-row .users-mobile-label {
        display: none;
    }

    .teams-created-desktop-cell,
    .teams-registration-cell,
    .teams-part-number-cell {
        white-space: nowrap;
    }

    .teams-register-pill {
        min-height: 30px;
        padding: 0 8px;
        font-size: 0.74rem;
    }

    .teams-actions-cell {
        width: auto;
    }

    .incidents-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
        align-items: stretch;
    }

    .incidents-row {
        gap: 14px;
        padding: 18px;
        align-content: start;
        height: 100%;
    }

    .incidents-card-desktop {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .incidents-card-field.is-wide {
        grid-column: 1 / -1;
    }

    .incidents-row .incidents-mobile-meta {
        display: none;
    }

    .incidents-actions-cell {
        width: auto;
    }

    .incidents-card-top {
        gap: 10px;
    }

    .incidents-card-identity {
        gap: 10px;
    }

    .incidents-card-title strong {
        margin-top: 2px;
        font-size: 1.08rem;
        line-height: 1.05;
    }

    .incidents-card-field {
        gap: 5px;
        padding: 12px 14px;
        border-radius: 18px;
    }

    .incidents-card-field p {
        font-size: 0.94rem;
        line-height: 1.42;
    }

    .incidents-card-chips {
        gap: 8px;
    }

    .users-table-head:not(.teams-table-head):not(.incidents-table-head),
    .users-row:not(.teams-row):not(.incidents-row) {
        display: grid;
        grid-template-columns: minmax(210px, 0.92fr) minmax(130px, 0.68fr) minmax(120px, 0.62fr) minmax(135px, 0.72fr) minmax(150px, 0.78fr) 72px;
        align-items: center;
        gap: 16px;
    }

    .users-table-head {
        padding: 0 18px;
        color: var(--text-muted);
        font-size: 0.8rem;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    .users-col-user,
    .users-row-main {
        justify-self: stretch;
        text-align: left;
    }

    .users-row-identity,
    .users-mobile-meta,
    .users-mobile-field {
        display: contents;
    }

    .users-mobile-label {
        display: none;
    }

    .users-col-role,
    .users-col-status,
    .users-col-ip,
    .users-col-access {
        justify-self: stretch;
        text-align: center;
    }

    .users-role-cell,
    .users-status-cell,
    .users-ip-cell,
    .users-access-cell {
        justify-self: stretch;
        width: 100%;
        text-align: center;
    }

    .users-role-cell,
    .users-status-cell {
        display: flex;
        justify-content: center;
    }

    .users-ip-cell,
    .users-access-cell {
        display: grid;
        justify-items: center;
    }

    .users-col-actions,
    .users-actions {
        justify-self: stretch;
        text-align: right;
    }

    .users-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .users-edit-layout {
        grid-template-columns: minmax(0, 1.4fr) 320px;
        align-items: start;
    }

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

    .users-field.is-full {
        grid-column: 1 / -1;
    }

    .users-offcanvas {
        width: min(100vw, 500px);
    }
}

@keyframes auroraFloatOne {
    0% {
        transform: translate3d(0, 0, 0) scale(0.96);
    }
    20% {
        transform: translate3d(-18vw, 24vh, 0) scale(1.18);
    }
    45% {
        transform: translate3d(-42vw, 52vh, 0) scale(0.9);
    }
    70% {
        transform: translate3d(-12vw, 6vh, 0) scale(1.24);
    }
    100% {
        transform: translate3d(-52vw, 70vh, 0) scale(1.02);
    }
}

@keyframes auroraFloatTwo {
    0% {
        transform: translate3d(0, 0, 0) scale(1.02);
    }
    18% {
        transform: translate3d(20vw, -20vh, 0) scale(0.92);
    }
    42% {
        transform: translate3d(46vw, -52vh, 0) scale(1.2);
    }
    68% {
        transform: translate3d(16vw, -10vh, 0) scale(0.88);
    }
    100% {
        transform: translate3d(56vw, -72vh, 0) scale(1.14);
    }
}

@keyframes haloDrift {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
        opacity: 0.58;
    }
    100% {
        transform: translate3d(-34px, 24px, 0) scale(1.12);
        opacity: 0.82;
    }
}

@keyframes gridDrift {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(0, 26px, 0);
    }
}

@keyframes panelFloat {
    0% {
        transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(0, -8px, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}

@keyframes panelGlow {
    0% {
        box-shadow: 0 24px 60px rgba(24, 55, 117, 0.18);
    }
    50% {
        box-shadow:
            0 30px 75px rgba(24, 55, 117, 0.22),
            0 0 0 1px rgba(137, 243, 255, 0.16);
    }
    100% {
        box-shadow: 0 24px 60px rgba(24, 55, 117, 0.18);
    }
}

@media (prefers-reduced-motion: reduce) {
    .auth-body::before,
    .aurora-one,
    .aurora-two,
    .grid-glow,
    .login-panel,
    .panel-orbit-glow {
        animation: none;
    }
}