:root {
    --bg: hsl(204 100% 98%);
    --surface: hsla(0 0% 100% / 0.96);
    --surface-strong: hsl(0 0% 100%);
    --text: hsl(218 42% 16%);
    --muted: hsl(215 18% 42%);
    --line: hsla(214 52% 24% / 0.08);
    --accent: hsl(210 92% 68%);
    --accent-strong: hsl(212 88% 60%);
    --accent-glow: hsl(196 95% 76%);
    --sidebar: hsl(220 53% 22%);
    --sidebar-line: hsla(0 0% 100% / 0.08);
    --sidebar-text: hsla(0 0% 100% / 0.72);
    --danger: hsl(0 72% 51%);
    --warning: hsl(38 92% 50%);
    --success: hsl(145 63% 42%);
    --brand: hsl(210 92% 68%);
    --brand-strong: hsl(212 88% 60%);
    --brand-soft: hsl(196 95% 76%);
    --gradient-primary: linear-gradient(135deg, hsl(210 92% 68%), hsl(196 95% 76%));
    --gradient-subtle: linear-gradient(180deg, hsla(210 92% 68% / 0.08), hsla(196 95% 76% / 0.05));
    --gradient-success: linear-gradient(135deg, hsl(145 63% 42%), hsl(160 64% 48%));
    --shadow-elegant: 0 24px 60px hsla(210 52% 34% / 0.12);
    --shadow-soft: 0 16px 40px hsla(210 40% 30% / 0.08);
    --shadow-card: 0 10px 30px hsla(210 38% 26% / 0.08);
    --transition-smooth: 220ms cubic-bezier(0.22, 1, 0.36, 1);
    --radius-lg: 1.5rem;
    --radius-md: 0.875rem;
    --shadow: var(--shadow-elegant);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at top left, hsla(196 95% 76% / 0.24), transparent 30%),
        radial-gradient(circle at top right, hsla(210 92% 68% / 0.12), transparent 24%),
        linear-gradient(180deg, hsl(204 100% 99%) 0%, hsl(202 78% 96%) 100%);
}

body.is-loading {
    overflow: hidden;
}

body {
    opacity: 1;
    transition: opacity 180ms ease, transform 220ms ease;
}

body.page-ready .app-main,
body.page-ready .auth-page {
    animation: page-rise-in 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

body.is-page-transitioning .app-main,
body.is-page-transitioning .auth-page,
body.is-page-transitioning .site-footer {
    opacity: 0.18;
    transform: translateY(8px) scale(0.995);
    pointer-events: none;
}

.app-body {
    min-height: 100vh;
}

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 290px minmax(0, 1fr);
    transition: grid-template-columns var(--transition-smooth);
}

.app-shell.is-collapsed {
    grid-template-columns: 96px minmax(0, 1fr);
}

.app-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 26px 18px;
    background:
        radial-gradient(circle at top, hsla(0 0% 100% / 0.24), transparent 30%),
        linear-gradient(180deg, hsl(212 66% 62%) 0%, hsl(209 67% 56%) 100%);
    color: white;
    border-right: 1px solid var(--sidebar-line);
    display: grid;
    align-content: start;
    gap: 22px;
    transition:
        width var(--transition-smooth),
        padding var(--transition-smooth),
        transform var(--transition-smooth);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.sidebar-brand-logo {
    display: inline-flex;
    align-items: center;
    min-height: 96px;
    text-decoration: none;
}

.sidebar-brand-image {
    display: block;
    width: auto;
    height: 84px;
}

.brand-mark {
    flex: 0 0 auto;
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: var(--gradient-primary);
    color: white;
    box-shadow: 0 16px 32px hsla(240 85% 62% / 0.35);
}

.brand-mark svg {
    width: 26px;
    height: 26px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.brand-copy {
    min-width: 0;
    transition: opacity var(--transition-smooth), transform var(--transition-smooth);
}

.sidebar-brand strong {
    display: block;
    font-size: 1rem;
}

.sidebar-brand p {
    margin: 4px 0 0;
    color: var(--sidebar-text);
    font-size: 0.83rem;
}

.sidebar-nav {
    display: grid;
    gap: 8px;
}

.sidebar-nav a {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 0 14px;
    border-radius: var(--radius-md);
    color: var(--sidebar-text);
    text-decoration: none;
    font-weight: 600;
    transition: background var(--transition-smooth), color var(--transition-smooth), transform var(--transition-smooth);
}

.sidebar-nav a:hover {
    transform: translateX(2px);
}

.sidebar-nav a:hover,
.sidebar-nav a.is-active {
    background: hsla(0 0% 100% / 0.09);
    color: white;
}

.nav-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 10px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.13), hsla(0 0% 100% / 0.06));
    border: 1px solid hsla(0 0% 100% / 0.12);
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.12),
        0 8px 18px hsla(216 68% 19% / 0.14);
    transition:
        transform var(--transition-smooth),
        background var(--transition-smooth),
        border-color var(--transition-smooth),
        box-shadow var(--transition-smooth);
}

.nav-icon svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.05;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.98;
}

.sidebar-nav a:hover .nav-icon,
.sidebar-nav a.is-active .nav-icon {
    transform: translateY(-1px);
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.22), hsla(0 0% 100% / 0.1));
    border-color: hsla(0 0% 100% / 0.22);
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.18),
        0 10px 24px hsla(218 70% 16% / 0.2);
}

.nav-label {
    min-width: 0;
    transition: opacity var(--transition-smooth), transform var(--transition-smooth);
}

.sidebar-panel {
    padding: 18px;
    border-radius: 22px;
    background: hsla(0 0% 100% / 0.14);
    border: 1px solid hsla(0 0% 100% / 0.18);
    transition: opacity var(--transition-smooth), transform var(--transition-smooth);
}

.sidebar-panel strong {
    display: block;
    margin-bottom: 8px;
}

.sidebar-panel p {
    margin: 0;
    color: var(--sidebar-text);
    line-height: 1.6;
    font-size: 0.86rem;
}

.app-main {
    min-width: 0;
    padding: 24px 28px 32px;
}

.page {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 0;
}

.narrow-page {
    width: min(760px, calc(100% - 32px));
}

.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}

.auth-card {
    position: relative;
    width: min(520px, 100%);
    border-radius: 28px;
    padding: 28px;
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
}

.auth-robot-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 8px;
}

.support-inline {
    margin: 16px 0 0;
    color: var(--muted);
    font-size: 0.92rem;
}

.support-inline a {
    color: var(--brand-strong);
    font-weight: 600;
    text-decoration: none;
}

.brand-logo {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    text-decoration: none;
}

.brand-logo-default {
    display: block;
    height: 84px;
    width: auto;
}

.auth-card .brand-logo-default {
    height: 96px;
}

.site-footer {
    padding: 18px 18px 28px;
}

.site-footer-inner {
    width: min(1320px, 100%);
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 20px;
    border-radius: 24px;
    border: 1px solid var(--line);
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.94), hsla(198 100% 98% / 0.92));
    box-shadow: var(--shadow-card);
    text-align: center;
}

.site-footer-graphic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.site-footer-image {
    display: block;
    height: 48px;
    width: auto;
}

.site-footer-inner p {
    margin: 0;
    font-weight: 700;
    font-size: 0.98rem;
    color: var(--text);
}

.hero,
.upload-card,
.summary-card,
.employee-card,
.empty-state,
.auth-card,
.message {
    background: var(--surface);
    backdrop-filter: blur(10px);
    border: 1px solid var(--line);
    box-shadow: var(--shadow-soft);
}

.topbar {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 20px;
    padding: 16px 18px;
    border-radius: 24px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.9), hsla(198 100% 98% / 0.86));
    border: 1px solid var(--line);
    backdrop-filter: blur(10px);
}

.content-bar {
    position: sticky;
    top: 12px;
    z-index: 20;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 20px;
    padding: 18px 20px;
    border-radius: 24px;
    background:
        linear-gradient(180deg, hsla(0 0% 100% / 0.56), hsla(198 100% 98% / 0.44));
    border: 1px solid hsla(0 0% 100% / 0.6);
    backdrop-filter: saturate(145%) blur(14px);
    -webkit-backdrop-filter: saturate(145%) blur(14px);
    box-shadow:
        0 12px 26px hsla(210 38% 26% / 0.06),
        inset 0 1px 0 hsla(0 0% 100% / 0.72);
}

.content-bar-compact {
    padding: 14px 16px;
    border-radius: 20px;
}

.content-bar-compact .page-title {
    font-size: clamp(1.9rem, 3.4vw, 2.9rem);
    max-width: 10ch;
}

.content-bar-compact .content-copy {
    margin-top: 8px;
    max-width: 42ch;
    font-size: 0.95rem;
}

.header-stack {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.header-stack-copy {
    min-width: 0;
}

.page-title {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 0.95;
    letter-spacing: -0.05em;
    max-width: 12ch;
}

.sidebar-toggle {
    display: inline-grid;
    grid-template-columns: 1fr;
    gap: 4px;
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
    padding: 0;
    border: 0;
    border-radius: 14px;
    background: hsla(222 47% 11% / 0.06);
    cursor: pointer;
}

.sidebar-toggle span {
    display: block;
    width: 18px;
    height: 2px;
    margin: 0 auto;
    border-radius: 999px;
    background: var(--text);
}

.content-copy {
    margin: 12px 0 0;
    color: var(--muted);
    line-height: 1.7;
    max-width: 54ch;
}

.user-chip {
    display: inline-flex;
    align-items: center;
    min-height: 46px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid hsla(196 60% 70% / 0.24);
    background: rgba(255, 255, 255, 0.72);
    font-weight: 600;
    white-space: nowrap;
}

.header-side {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid hsla(196 60% 70% / 0.24);
    background: hsla(0 0% 100% / 0.82);
    color: var(--text);
    cursor: pointer;
    font-weight: 700;
    box-shadow: var(--shadow-card);
}

.theme-toggle.is-auth {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 2;
}

.theme-toggle-icon {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, hsla(210 92% 68% / 0.18), hsla(196 95% 76% / 0.3));
    color: var(--brand-strong);
    flex: 0 0 auto;
}

.theme-toggle-icon::before {
    content: "☀";
    font-size: 0.88rem;
    line-height: 1;
}

.theme-toggle-label {
    font-size: 0.88rem;
    white-space: nowrap;
}

.assistant-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 0 12px 0 8px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.88);
    box-shadow: var(--shadow-card);
}

.assistant-chip-copy {
    display: grid;
    gap: 2px;
}

.assistant-chip-copy strong {
    font-size: 0.8rem;
    line-height: 1;
}

.assistant-chip-copy span {
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1.1;
}

.assistant-robot {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    background:
        radial-gradient(circle at 30% 25%, hsla(0 0% 100% / 0.4), transparent 30%),
        var(--gradient-primary);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 24px hsla(240 72% 58% / 0.24);
    flex: 0 0 auto;
    animation: micro-float 2.8s ease-in-out infinite;
}

.assistant-robot::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -7px;
    width: 2px;
    height: 7px;
    margin-left: -1px;
    border-radius: 999px;
    background: hsl(184 85% 66%);
    animation: antenna-pulse 1.6s ease-in-out infinite;
}

.assistant-robot::after {
    content: "";
    width: 14px;
    height: 8px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 24% 50%, white 0 2px, transparent 3px),
        radial-gradient(circle at 76% 50%, white 0 2px, transparent 3px),
        linear-gradient(180deg, hsla(255 100% 100% / 0.18), hsla(255 100% 100% / 0.08));
    box-shadow: inset 0 0 0 1px hsla(0 0% 100% / 0.14);
}

.floating-assistant {
    position: fixed;
    right: 18px;
    bottom: 22px;
    z-index: 70;
    display: flex;
    align-items: end;
    gap: 12px;
    pointer-events: none;
    transform: translateX(120%);
    opacity: 0;
    transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1), opacity 320ms ease;
    max-width: min(360px, calc(100vw - 24px));
}

.floating-assistant.is-visible {
    transform: translateX(0);
    opacity: 1;
}

.floating-assistant-bubble {
    max-width: 280px;
    padding: 14px 16px;
    border-radius: 20px 20px 6px 20px;
    background: hsla(0 0% 100% / 0.96);
    border: 1px solid hsla(222 47% 11% / 0.08);
    box-shadow: var(--shadow-elegant);
    color: hsl(222 47% 11%);
    line-height: 1.5;
    font-size: 0.9rem;
    pointer-events: auto;
    overflow-wrap: anywhere;
}

.floating-assistant-bubble strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.82rem;
    color: hsl(222 47% 11%);
}

.floating-assistant-bubble p {
    margin: 0;
    color: hsl(220 18% 28%);
}

.floating-assistant-bot {
    width: 72px;
    height: 78px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: 0 18px 34px hsla(240 72% 58% / 0.32);
    position: relative;
    pointer-events: auto;
    cursor: pointer;
    padding: 0;
    animation: mascot-bob 2.6s ease-in-out infinite;
}

.floating-assistant-bot::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 4px;
    width: 3px;
    height: 12px;
    margin-left: -1.5px;
    border-radius: 999px;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 18px hsla(184 85% 66% / 0.5);
}

.floating-assistant-bot::after {
    content: "";
    position: absolute;
    left: 18px;
    right: 18px;
    top: 30px;
    height: 18px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 28% 50%, white 0 3px, transparent 4px),
        radial-gradient(circle at 72% 50%, white 0 3px, transparent 4px),
        linear-gradient(180deg, hsla(255 100% 100% / 0.2), hsla(255 100% 100% / 0.08));
    box-shadow: inset 0 0 0 1px hsla(0 0% 100% / 0.14);
}

.floating-assistant-bot span {
    position: absolute;
    left: 50%;
    top: 0;
    width: 14px;
    height: 14px;
    margin-left: -7px;
    border-radius: 50%;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 18px hsla(184 85% 66% / 0.55);
    animation: antenna-pulse 1.6s ease-in-out infinite;
}

.floating-assistant-bot .bot-head-shape,
.floating-assistant-bot .bot-body-shape {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background:
        radial-gradient(circle at 30% 22%, hsla(0 0% 100% / 0.45), transparent 28%),
        var(--gradient-primary);
}

.floating-assistant-bot .bot-head-shape {
    top: 12px;
    width: 56px;
    height: 42px;
    border-radius: 18px 18px 14px 14px;
    box-shadow: 0 18px 36px hsla(240 72% 58% / 0.34);
}

.floating-assistant-bot .bot-body-shape {
    top: 54px;
    width: 40px;
    height: 20px;
    border-radius: 10px 10px 16px 16px;
    box-shadow: 0 10px 24px hsla(240 72% 58% / 0.2);
}

.floating-assistant-bot .bot-head-shape::before {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    top: 16px;
    height: 12px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 28% 50%, white 0 3px, transparent 4px),
        radial-gradient(circle at 72% 50%, white 0 3px, transparent 4px),
        linear-gradient(180deg, hsla(255 100% 100% / 0.2), hsla(255 100% 100% / 0.08));
    box-shadow: inset 0 0 0 1px hsla(0 0% 100% / 0.14);
}

.floating-assistant-bot .bot-body-shape::before,
.floating-assistant-bot .bot-body-shape::after {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    height: 3px;
    border-radius: 999px;
    background: hsla(0 0% 100% / 0.7);
}

.floating-assistant-bot .bot-body-shape::before {
    top: 6px;
}

.floating-assistant-bot .bot-body-shape::after {
    top: 12px;
}

.floating-assistant-bot.is-talking {
    animation: pulse-bot 1s ease-in-out infinite;
}

.topbar-nav {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.topbar-nav a {
    text-decoration: none;
    color: var(--muted);
    font-weight: 600;
}

.hero {
    border-radius: 34px;
    padding: 42px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: center;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 252, 0.88));
}

.workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.8fr);
    gap: 18px;
    margin-bottom: 18px;
}

.workspace-grid-single {
    grid-template-columns: 1fr;
}

.launch-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding: 18px 20px;
    border-radius: 24px;
    border: 1px solid var(--line);
    background: linear-gradient(135deg, hsla(0 0% 100% / 0.98), hsla(196 100% 95% / 0.95));
    box-shadow: var(--shadow-card);
}

.launch-strip strong {
    display: block;
    font-size: 1.02rem;
    color: var(--text);
}

.dashboard-hero {
    margin-bottom: 20px;
}

.executive-header-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding: 20px 22px;
    border-radius: 22px;
    border: 1px solid hsla(216 58% 92% / 0.12);
    background: linear-gradient(180deg, hsla(230 28% 18% / 0.98), hsla(228 24% 15% / 0.98));
    box-shadow: 0 18px 42px hsla(228 30% 10% / 0.2);
}

.dashboard-admin-hero {
    position: relative;
    top: 0;
    margin-bottom: 20px;
    padding: 22px 184px 34px 20px;
    min-height: 172px;
    grid-template-columns: 1fr;
}

.dashboard-admin-hero .hero-toolbar {
    margin-bottom: 6px;
}

.dashboard-admin-hero .header-side {
    width: 100%;
    justify-content: flex-end;
}

.dashboard-admin-hero .hero-title {
    max-width: 10ch;
}

.dashboard-admin-hero .hero-description {
    max-width: 54ch;
}

.dashboard-admin-hero .hero-robot {
    right: 26px;
    bottom: 18px;
}

.page-hero {
    padding-right: 184px;
    min-height: 172px;
}

.page-hero .hero-robot {
    right: 26px;
    bottom: 18px;
}

.dashboard-admin-hero .robot-shell-small,
.page-hero .robot-shell-small {
    width: 98px;
}

.dashboard-admin-hero .robot-head,
.page-hero .robot-head {
    width: 84px;
    height: 66px;
    border-radius: 20px;
    margin: 0 auto;
}

.dashboard-admin-hero .robot-face,
.page-hero .robot-face {
    inset: 18px 15px 14px;
    gap: 8px;
    border-radius: 14px;
}

.dashboard-admin-hero .robot-face span,
.page-hero .robot-face span {
    width: 7px;
    height: 7px;
}

.dashboard-admin-hero .robot-body,
.page-hero .robot-body {
    width: 62px;
    margin: 10px auto 0;
    padding: 11px 10px;
    border-radius: 18px;
    gap: 6px;
}

.dashboard-admin-hero .robot-body span,
.page-hero .robot-body span {
    height: 4px;
}

.dashboard-admin-hero .robot-antenna,
.dashboard-admin-hero .robot-antena,
.page-hero .robot-antenna,
.page-hero .robot-antena {
    top: -14px;
    height: 16px;
}

.dashboard-admin-hero .robot-antenna::before,
.dashboard-admin-hero .robot-antena::before,
.page-hero .robot-antenna::before,
.page-hero .robot-antena::before {
    width: 10px;
    height: 10px;
    margin-left: -5px;
}

.book-learning-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: 18px;
}

.book-learning-chat {
    display: grid;
    gap: 12px;
    max-height: 420px;
    overflow: auto;
    padding-right: 6px;
}

.book-chat-shell {
    display: grid;
    gap: 16px;
}

.book-learning-modal-shell {
    width: min(940px, calc(100vw - 20px));
    grid-template-columns: minmax(220px, 0.74fr) minmax(0, 1.26fr);
    max-height: calc(100vh - 20px);
}

.book-learning-modal-main {
    padding: 22px 24px 24px;
    overflow: auto;
}

.book-chat-thread {
    display: grid;
    gap: 12px;
    min-height: 420px;
    max-height: 54vh;
    overflow: auto;
    padding-right: 8px;
}

.book-chat-message {
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.82);
}

.book-chat-message strong {
    display: block;
    margin-bottom: 6px;
    font-size: 0.82rem;
}

.book-chat-message p {
    margin: 0;
    line-height: 1.6;
    color: var(--muted);
}

.book-chat-message small {
    display: block;
    margin-top: 8px;
    color: var(--muted);
    font-size: 0.75rem;
}

.book-chat-message.is-assistant {
    background: linear-gradient(180deg, hsla(210 92% 68% / 0.16), hsla(196 95% 76% / 0.1));
}

.book-chat-message.is-user {
    background: hsla(0 0% 100% / 0.94);
    margin-left: 42px;
}

.book-chat-message.is-system {
    background: hsla(42 96% 58% / 0.12);
}

.book-chat-form textarea {
    min-height: 136px;
}

.book-chat-bot .sector-modal-bubble {
    max-width: 25ch;
}

.book-insight-grid {
    margin-top: 14px;
}

.book-context-text {
    margin: 0;
    color: var(--muted);
    line-height: 1.8;
    white-space: pre-line;
}

.inline-link {
    color: var(--brand-strong);
    text-decoration: none;
    font-weight: 700;
}

.executive-header-card h1 {
    margin: 6px 0 8px;
    color: white;
    font-size: clamp(1.8rem, 2.4vw, 2.4rem);
    line-height: 0.96;
    letter-spacing: -0.05em;
}

.executive-header-card p:last-child {
    margin: 0;
    max-width: 56ch;
    color: hsla(0 0% 100% / 0.62);
    line-height: 1.6;
    font-size: 0.95rem;
}

.executive-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.dashboard-card-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.dashboard-metric-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 10px;
    min-height: 168px;
    padding: 20px;
    border-radius: 24px;
    color: white;
    text-decoration: none;
    box-shadow: var(--shadow-elegant);
    transition: transform var(--transition-smooth), box-shadow var(--transition-smooth);
}

.dashboard-metric-card::after {
    content: "";
    position: absolute;
    inset: auto -20% -40% auto;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: hsla(0 0% 100% / 0.18);
    filter: blur(4px);
}

.dashboard-metric-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 54px hsla(220 58% 28% / 0.18);
}

.dashboard-metric-card strong {
    position: relative;
    z-index: 1;
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 0.95;
    letter-spacing: -0.05em;
}

.dashboard-metric-card small,
.dashboard-metric-label {
    position: relative;
    z-index: 1;
}

.dashboard-metric-label {
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    opacity: 0.9;
}

.dashboard-metric-card small {
    font-size: 0.92rem;
    line-height: 1.5;
    color: hsla(0 0% 100% / 0.84);
}

.dashboard-metric-card-cyan {
    background: linear-gradient(135deg, hsl(198 85% 63%), hsl(210 84% 60%));
}

.dashboard-metric-card-amber {
    background: linear-gradient(135deg, hsl(32 94% 62%), hsl(15 88% 60%));
}

.dashboard-metric-card-green {
    background: linear-gradient(135deg, hsl(146 63% 47%), hsl(168 68% 42%));
}

.dashboard-metric-card-violet {
    background: linear-gradient(135deg, hsl(248 84% 67%), hsl(273 82% 68%));
}

.dashboard-metric-card-rose {
    background: linear-gradient(135deg, hsl(330 79% 67%), hsl(350 84% 66%));
}

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

.dashboard-chart-card {
    padding: 22px;
}

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

.dashboard-chart-row {
    display: grid;
    gap: 10px;
}

.dashboard-chart-copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.dashboard-chart-copy strong {
    font-size: 0.98rem;
}

.dashboard-chart-copy span {
    color: var(--muted);
    font-size: 0.88rem;
}

.dashboard-chart-bar {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: hsla(214 36% 26% / 0.08);
    overflow: hidden;
}

.dashboard-chart-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    transition: width 420ms ease;
}

.dashboard-chart-fill-cyan {
    background: linear-gradient(90deg, hsl(198 85% 63%), hsl(210 84% 60%));
}

.dashboard-chart-fill-violet {
    background: linear-gradient(90deg, hsl(248 84% 67%), hsl(273 82% 68%));
}

.dashboard-queue-card {
    border-left-color: hsla(38 92% 50% / 0.58);
}

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

.executive-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 12px;
    min-height: 124px;
    padding: 18px 20px;
    border-radius: 22px;
    border: 1px solid hsla(216 58% 92% / 0.12);
    background: linear-gradient(180deg, hsla(230 28% 18% / 0.98), hsla(228 24% 15% / 0.98));
    box-shadow: 0 18px 42px hsla(228 30% 10% / 0.22);
    color: hsl(0 0% 100%);
}

.executive-card::after {
    content: "";
    position: absolute;
    width: 120px;
    height: 120px;
    right: -24px;
    top: -28px;
    border-radius: 50%;
    background: hsla(0 0% 100% / 0.08);
}

.executive-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 24px 54px hsla(228 30% 8% / 0.24);
}

.executive-card strong {
    font-size: clamp(1.9rem, 2.7vw, 2.55rem);
    line-height: 1;
    letter-spacing: -0.05em;
    position: relative;
    z-index: 1;
}

.executive-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: relative;
    z-index: 1;
}

.executive-card-label {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 800;
    color: hsla(0 0% 100% / 0.72);
}

.executive-card-icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: transparent;
    box-shadow: none;
    position: relative;
}

.executive-card-icon::before {
    content: none;
}

.executive-card-trend {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
}

.executive-card-trend.is-success {
    background: hsla(148 68% 48% / 0.16);
    color: hsl(148 88% 68%);
}

.executive-card-trend.is-danger {
    background: hsla(0 84% 62% / 0.16);
    color: hsl(0 100% 78%);
}

.executive-card-trend.is-neutral {
    background: hsla(0 0% 100% / 0.1);
    color: hsla(0 0% 100% / 0.76);
}

.executive-card-danger .executive-card-icon {
    background: transparent;
    color: hsl(0 84% 68%);
}

.executive-card-primary .executive-card-icon {
    background: transparent;
    color: hsl(220 100% 72%);
}

.executive-card-success .executive-card-icon {
    background: transparent;
    color: hsl(148 88% 62%);
}

.executive-card-warning .executive-card-icon {
    background: transparent;
    color: hsl(42 100% 64%);
}

.executive-chart-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 16px;
    margin-bottom: 18px;
}

.executive-chart-card {
    padding: 22px;
    background: linear-gradient(180deg, hsla(228 28% 18% / 0.98), hsla(228 24% 15% / 0.98));
    border-color: hsla(216 58% 92% / 0.12);
    color: white;
}

.executive-chart-card .card-head {
    margin-bottom: 14px;
}

.executive-chart-card .card-head h2,
.executive-chart-card .card-head .eyebrow {
    color: white;
}

.executive-chart-card .card-head .eyebrow {
    opacity: 0.72;
}

.chart-subtitle {
    display: block;
    margin-top: 4px;
    color: hsla(0 0% 100% / 0.58);
    font-size: 0.8rem;
}

.executive-chart-card-wide {
    grid-column: 1;
}

.line-chart-shell {
    display: grid;
    gap: 12px;
}

.dashboard-canvas {
    display: block;
    width: 100%;
    height: auto;
}

.dashboard-canvas.is-interactive {
    cursor: crosshair;
}

.dashboard-canvas-line,
.dashboard-canvas-bar {
    min-height: 160px;
    border-radius: 16px;
}

.dashboard-canvas-donut {
    max-width: 240px;
    margin-inline: auto;
}

.line-chart-svg {
    width: 100%;
    height: auto;
    display: block;
}

.line-chart-line {
    fill: none;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.line-chart-line-primary {
    stroke: hsl(160 74% 45%);
}

.line-chart-line-secondary {
    stroke: hsl(220 100% 68%);
}

.line-chart-labels {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    color: hsla(0 0% 100% / 0.6);
    font-size: 0.8rem;
}

.line-chart-legend,
.donut-legend {
    display: grid;
    gap: 10px;
}

.line-chart-legend {
    grid-auto-flow: column;
    justify-content: end;
    color: hsla(0 0% 100% / 0.78);
    font-size: 0.84rem;
    margin-top: 6px;
}

.legend-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 6px;
}

.legend-dot.is-primary {
    background: hsl(160 74% 45%);
}

.legend-dot.is-secondary {
    background: hsl(220 100% 68%);
}

.legend-dot.is-warning {
    background: hsl(42 96% 58%);
}

.legend-dot.is-danger {
    background: hsl(0 84% 62%);
}

.donut-card {
    display: grid;
    gap: 20px;
    justify-items: center;
}

.donut-legend {
    width: 100%;
}

.donut-legend div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: hsla(0 0% 100% / 0.84);
}

.donut-legend strong {
    font-size: 0.92rem;
}

.sla-compare-list {
    display: grid;
    gap: 16px;
}

.executive-chart-grid > .workspace-card {
    min-height: 100%;
}

.executive-header-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
    padding: 22px 24px;
    border-radius: 24px;
    border: 1px solid hsla(224 18% 30% / 0.82);
    background:
        radial-gradient(circle at top right, hsla(220 100% 72% / 0.12), transparent 28%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.04),
        0 18px 42px hsla(228 30% 10% / 0.24);
}

.executive-header-card h1 {
    margin: 8px 0 10px;
    color: white;
    font-size: clamp(1.95rem, 2.7vw, 2.8rem);
    line-height: 0.94;
    letter-spacing: -0.05em;
}

.executive-header-card p:last-child {
    margin: 0;
    max-width: 52ch;
    color: hsla(0 0% 100% / 0.64);
    line-height: 1.65;
    font-size: 0.92rem;
}

.executive-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.executive-header-actions .user-chip {
    min-height: 42px;
    background: hsla(0 0% 100% / 0.08);
    border-color: hsla(0 0% 100% / 0.08);
    color: white;
}

.executive-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 20px;
}

.executive-card {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 14px;
    min-height: 132px;
    padding: 18px 20px 16px;
    border-radius: 22px;
    border: 1px solid hsla(224 18% 30% / 0.82);
    background:
        radial-gradient(circle at top right, hsla(255 100% 100% / 0.04), transparent 28%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
    color: white;
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.04),
        0 18px 44px hsla(228 30% 10% / 0.18);
}

.executive-card::after {
    display: none;
}

.executive-card-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.executive-card-label {
    color: hsla(0 0% 100% / 0.68);
    font-size: 0.69rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 800;
}

.executive-card strong {
    position: relative;
    z-index: 1;
    font-size: clamp(2.1rem, 2.9vw, 3rem);
    line-height: 0.94;
    letter-spacing: -0.05em;
}

.executive-card-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: hsla(0 0% 100% / 0.18);
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.3),
        0 6px 12px hsla(228 30% 10% / 0.08);
    position: relative;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
}

.executive-card-icon svg {
    width: 24px;
    height: 24px;
    display: block;
    filter: none;
    vector-effect: non-scaling-stroke;
    stroke: currentColor;
    stroke-width: 2.6;
}

.executive-card-trend {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 700;
}

.executive-card-danger .executive-card-icon {
    background: linear-gradient(180deg, hsla(0 100% 82% / 0.52), hsla(0 100% 82% / 0.34));
    color: hsl(0 0% 100%);
}

.executive-card-primary .executive-card-icon {
    background: linear-gradient(180deg, hsla(220 100% 82% / 0.52), hsla(220 100% 82% / 0.34));
    color: hsl(0 0% 100%);
}

.executive-card-success .executive-card-icon {
    background: linear-gradient(180deg, hsla(148 88% 80% / 0.5), hsla(148 88% 80% / 0.32));
    color: hsl(0 0% 100%);
}

.executive-card-warning .executive-card-icon {
    background: linear-gradient(180deg, hsla(42 100% 80% / 0.52), hsla(42 100% 80% / 0.34));
    color: hsl(0 0% 100%);
}

.executive-card-danger,
.executive-card-primary,
.executive-card-success,
.executive-card-warning {
    background:
        radial-gradient(circle at top right, hsla(255 100% 100% / 0.03), transparent 28%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
}

.executive-card-danger {
    background:
        radial-gradient(circle at 92% 12%, hsla(0 100% 72% / 0.045), transparent 18%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
}

.executive-card-primary {
    background:
        radial-gradient(circle at 92% 12%, hsla(220 100% 72% / 0.045), transparent 18%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
}

.executive-card-success {
    background:
        radial-gradient(circle at 92% 12%, hsla(148 88% 62% / 0.045), transparent 18%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
}

.executive-card-warning {
    background:
        radial-gradient(circle at 92% 12%, hsla(42 100% 66% / 0.045), transparent 18%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
}

.executive-chart-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.85fr);
    gap: 18px;
    margin-bottom: 22px;
}

.executive-chart-card {
    padding: 22px 22px 18px;
    background:
        radial-gradient(circle at top right, hsla(255 100% 100% / 0.04), transparent 30%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
    border-color: hsla(224 18% 30% / 0.82);
    color: white;
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.03),
        0 14px 36px hsla(228 30% 10% / 0.14);
}

.dashboard-queue-card,
.employee-list .employee-card {
    background:
        radial-gradient(circle at top right, hsla(255 100% 100% / 0.03), transparent 26%),
        linear-gradient(145deg, hsl(228 26% 18%), hsl(228 24% 15%));
    border: 1px solid hsla(224 18% 30% / 0.82);
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.03),
        0 14px 36px hsla(228 30% 10% / 0.14);
    color: white;
}

.dashboard-queue-card .employee-header p,
.employee-list .employee-card .employee-header p,
.dashboard-queue-card td,
.employee-list .employee-card td,
.dashboard-queue-card th,
.employee-list .employee-card th {
    color: hsla(0 0% 100% / 0.7);
}

.dashboard-queue-card .table-action-link,
.employee-list .employee-card .table-action-link,
.dashboard-queue-card .table-action-button,
.employee-list .employee-card .table-action-button {
    color: hsl(213 100% 72%);
}

.chart-tooltip {
    position: fixed;
    z-index: 120;
    pointer-events: none;
    min-width: 132px;
    max-width: 220px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid hsla(224 18% 30% / 0.92);
    background: linear-gradient(145deg, hsla(228 26% 16% / 0.98), hsla(228 24% 14% / 0.98));
    box-shadow: 0 14px 36px hsla(228 30% 10% / 0.24);
    color: white;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 140ms ease, transform 140ms ease;
}

.chart-tooltip.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.chart-tooltip strong {
    display: block;
    margin-bottom: 4px;
    font-size: 0.82rem;
}

.chart-tooltip span {
    display: block;
    color: hsla(0 0% 100% / 0.7);
    font-size: 0.78rem;
    line-height: 1.45;
}

.sla-compare-row {
    display: grid;
    gap: 10px;
}

.sla-compare-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.sla-compare-head strong {
    font-size: 0.96rem;
}

.sla-compare-head span {
    color: hsla(0 0% 100% / 0.66);
    font-size: 0.82rem;
}

.sla-compare-track {
    position: relative;
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: hsla(0 0% 100% / 0.08);
    overflow: hidden;
}

.sla-compare-target {
    position: absolute;
    top: -3px;
    width: 2px;
    height: 16px;
    border-radius: 999px;
    background: hsl(42 96% 58%);
    box-shadow: 0 0 0 2px hsla(42 96% 58% / 0.12);
}

.launch-strip .eyebrow {
    color: hsl(206 48% 52%);
}

.ai-hero {
    position: relative;
    top: 12px;
    z-index: 18;
    position: sticky;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    gap: 12px;
    margin-bottom: 18px;
    padding: 12px 14px 14px;
    border-radius: 20px;
    color: var(--text);
    background:
        radial-gradient(circle at top right, hsla(0 0% 100% / 0.54), transparent 34%),
        radial-gradient(circle at bottom left, hsla(201 90% 78% / 0.10), transparent 30%),
        linear-gradient(135deg, hsla(0 0% 100% / 0.62), hsla(201 100% 98% / 0.34));
    border: 1px solid hsla(0 0% 100% / 0.58);
    backdrop-filter: saturate(135%) blur(8px);
    -webkit-backdrop-filter: saturate(135%) blur(8px);
    box-shadow:
        0 10px 20px hsla(210 38% 26% / 0.06),
        inset 0 1px 0 hsla(0 0% 100% / 0.7);
}

.ai-hero-minimal {
    grid-template-columns: 1fr;
    padding: 12px 14px 14px;
}

.ai-hero-minimal .hero-title {
    max-width: 13ch;
}

.ai-hero-minimal .ai-hero-copy {
    padding-right: 126px;
}

.hero-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 16px;
    margin-bottom: 4px;
}

.hero-robot {
    position: absolute;
    right: 22px;
    bottom: -4px;
    pointer-events: none;
}

.robot-shell {
    position: relative;
    width: 118px;
    animation: float-bot 3.6s ease-in-out infinite;
}

.robot-shell-small {
    width: 92px;
}

.robot-head {
    position: relative;
    width: 112px;
    height: 90px;
    margin: 0 auto;
    border-radius: 30px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.94), hsla(0 0% 100% / 0.8));
    box-shadow: 0 18px 34px hsla(240 70% 20% / 0.18);
}

.robot-antena,
.robot-antenna {
    position: absolute;
    left: 50%;
    top: -18px;
    width: 4px;
    height: 20px;
    margin-left: -2px;
    border-radius: 999px;
    background: hsla(0 0% 100% / 0.88);
}

.robot-antena::before,
.robot-antenna::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -8px;
    width: 12px;
    height: 12px;
    margin-left: -6px;
    border-radius: 50%;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 20px hsla(184 85% 66% / 0.6);
}

.robot-face {
    position: absolute;
    inset: 26px 20px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    border-radius: 22px;
    background: linear-gradient(135deg, hsl(230 85% 60%), hsl(250 90% 70%));
}

.robot-face span,
.loading-robot .robot-eye {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 0 16px hsla(0 0% 100% / 0.65);
}

.robot-body {
    width: 94px;
    margin: 12px auto 0;
    padding: 18px 14px;
    border-radius: 26px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.92), hsla(0 0% 100% / 0.72));
    display: grid;
    gap: 8px;
}

.robot-body span {
    display: block;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(90deg, hsl(230 85% 60%), hsl(250 90% 70%));
    opacity: 0.88;
}

.ai-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    top: -80px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    filter: blur(6px);
}

.ai-hero-copy,
.hero-preview {
    position: relative;
    z-index: 1;
}

.eyebrow-light {
    color: hsl(207 48% 52%);
}

.hero-title {
    margin: 0;
    font-size: clamp(1.3rem, 2.2vw, 1.95rem);
    line-height: 0.94;
    letter-spacing: -0.06em;
    max-width: 13ch;
}

.hero-description {
    margin: 6px 0 0;
    color: var(--muted);
    line-height: 1.45;
    max-width: 46ch;
    font-size: 0.8rem;
}

.hero-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    border-radius: 16px;
    font-weight: 700;
    text-decoration: none;
}

.hero-button-primary {
    color: var(--text);
    background: hsla(0 0% 100% / 0.96);
    box-shadow: 0 10px 24px hsla(210 30% 30% / 0.12);
}

.hero-chip-soft {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 9px;
    border-radius: 999px;
    background: hsla(0 0% 100% / 0.5);
    border: 1px solid hsla(0 0% 100% / 0.54);
    color: var(--brand-strong);
    font-weight: 600;
    font-size: 0.75rem;
}

.hero-preview {
    display: grid;
    gap: 14px;
    align-content: center;
}

.preview-card {
    padding: 20px;
    border-radius: 24px;
    background: hsla(0 0% 100% / 0.62);
    border: 1px solid hsla(196 54% 62% / 0.18);
    backdrop-filter: blur(6px);
}

.preview-card-primary {
    background: hsla(0 0% 100% / 0.74);
}

.preview-label {
    display: block;
    margin-bottom: 8px;
    color: hsl(207 48% 52%);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.7rem;
    font-weight: 800;
}

.preview-card strong {
    display: block;
    font-size: 1.35rem;
    letter-spacing: -0.04em;
}

.preview-card p {
    margin: 10px 0 0;
    color: var(--muted);
    line-height: 1.65;
}

.workspace-card {
    border-radius: 30px;
    padding: 24px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.9);
    box-shadow: var(--shadow-card);
}

.workspace-card-primary {
    background:
        linear-gradient(180deg, hsla(0 0% 100% / 1), hsla(198 100% 98% / 0.96));
}

.workspace-card-secondary {
    background:
        linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 98% / 0.94));
    color: var(--text);
}

.workspace-card-secondary .eyebrow,
.workspace-card-secondary p,
.workspace-card-secondary li {
    color: var(--muted);
}

.workspace-card-secondary h2 {
    color: var(--text);
}

.card-head {
    margin-bottom: 16px;
}

.signal-list {
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.signal-list li {
    padding: 14px 16px;
    border-radius: 18px;
    background: hsla(198 64% 86% / 0.22);
    line-height: 1.6;
}

.stats-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.stats-row-rich {
    align-items: stretch;
}

.stats-row-compact {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stat-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: start;
    padding: 20px;
    border-radius: 24px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.92);
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
}

.stat-card-minimal {
    display: block;
    padding: 18px 20px;
}

.stat-card-minimal strong {
    margin-top: 8px;
}

.stat-card span {
    display: block;
    color: var(--muted);
}

.stat-card strong {
    display: block;
    margin-top: 10px;
    font-size: 1.7rem;
    letter-spacing: -0.04em;
}

.stat-card small {
    grid-column: 1 / -1;
    color: var(--muted);
    line-height: 1.5;
}

.stat-card-featured {
    background:
        radial-gradient(circle at top right, hsla(210 92% 68% / 0.12), transparent 28%),
        linear-gradient(180deg, hsla(0 0% 100% / 0.99), hsla(196 100% 97% / 0.95));
}

.stat-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(91, 97, 255, 0.14), rgba(127, 123, 255, 0.22));
    color: var(--brand-strong);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.insight-strip {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.insight-strip > div {
    padding: 12px 14px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.88);
}

.insight-strip strong,
.insight-strip span {
    display: block;
}

.insight-strip span {
    color: var(--muted);
    margin-top: 4px;
}

.eyebrow {
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 700;
    margin: 0 0 8px;
}

h1,
h2 {
    margin: 0;
}

h1 {
    font-size: clamp(2.4rem, 5vw, 4.8rem);
    line-height: 0.94;
    letter-spacing: -0.05em;
    max-width: 12ch;
}

.hero-copy,
.employee-header p,
.empty-state p {
    color: var(--muted);
    line-height: 1.6;
}

.manual-review-body {
    min-height: 100vh;
    padding: 20px;
}

.manual-review-page {
    width: min(1400px, 100%);
    margin: 0 auto;
}

.manual-review-layout {
    display: grid;
    grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
    gap: 18px;
    min-height: calc(100vh - 40px);
}

.manual-review-meta,
.manual-review-viewer {
    border-radius: 28px;
    border: 1px solid var(--line);
    background: var(--surface);
    box-shadow: var(--shadow-card);
}

.manual-review-meta {
    padding: 22px;
    display: grid;
    align-content: start;
    gap: 14px;
}

.manual-review-title {
    margin: 0;
    font-size: clamp(1.35rem, 2.4vw, 2rem);
    line-height: 1.06;
    letter-spacing: -0.05em;
    max-width: none;
    text-wrap: balance;
}

.manual-review-card {
    display: grid;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 20px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 98% / 0.94));
    border: 1px solid var(--line);
}

.manual-review-card strong {
    font-size: 0.95rem;
    line-height: 1.35;
}

.manual-review-card span {
    color: var(--muted);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.manual-review-actions {
    display: grid;
    gap: 10px;
}

.manual-replace-form {
    display: grid;
    gap: 12px;
    margin: 6px 0 10px;
    padding: 14px 16px;
    border-radius: 20px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.94), hsla(198 100% 98% / 0.88));
    border: 1px solid var(--line);
}

.manual-replace-form .field {
    margin: 0;
}

.manual-replace-form .field label {
    font-size: 0.82rem;
    color: var(--muted);
}

.manual-replace-form input[type="file"] {
    padding: 10px 0 0;
    font-size: 0.84rem;
    color: var(--muted);
}

.manual-replace-form input[type="file"]::file-selector-button {
    margin-right: 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: hsla(0 0% 100% / 0.92);
    color: var(--accent-strong);
    padding: 8px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
}

.manual-replace-form .submit-button {
    justify-self: stretch;
    max-width: none;
    min-height: 40px;
}

.manual-review-actions form {
    margin: 0;
}

.manual-review-actions .submit-button,
.manual-review-actions .submit-button-ghost {
    width: 100%;
    justify-content: center;
    max-width: none;
    min-height: 40px;
    padding: 10px 14px;
    font-size: 0.88rem;
}

.manual-review-meta .manual-review-card:last-of-type {
    max-height: 180px;
    overflow: auto;
}

.manual-review-viewer {
    position: relative;
    overflow: hidden;
}

.manual-review-robot-result {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    z-index: 3;
    display: flex;
    align-items: end;
    gap: 10px;
    pointer-events: none;
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 220ms ease, transform 220ms ease;
}

.manual-review-robot-result.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.manual-review-robot-result-bot {
    position: relative;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 14px;
    background:
        radial-gradient(circle at 30% 18%, hsla(0 0% 100% / 0.30), transparent 26%),
        var(--gradient-primary);
    box-shadow: 0 14px 28px hsla(240 72% 58% / 0.22);
}

.manual-review-robot-result-antenna {
    position: absolute;
    top: -9px;
    left: 50%;
    width: 3px;
    height: 12px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: hsl(184 85% 66%);
}

.manual-review-robot-result-antenna::after {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    width: 8px;
    height: 8px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 14px hsla(184 85% 66% / 0.5);
}

.manual-review-robot-result-face {
    position: absolute;
    left: 9px;
    right: 9px;
    top: 15px;
    height: 10px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 28% 50%, white 0 2px, transparent 3px),
        radial-gradient(circle at 72% 50%, white 0 2px, transparent 3px),
        linear-gradient(180deg, hsla(255 100% 100% / 0.18), hsla(255 100% 100% / 0.08));
}

.manual-review-robot-result-bubble {
    max-width: min(360px, 60%);
    padding: 12px 14px;
    border-radius: 18px 18px 18px 6px;
    background: hsla(0 0% 100% / 0.96);
    border: 1px solid hsla(222 47% 11% / 0.08);
    box-shadow: var(--shadow-elegant);
    color: hsl(222 47% 11%);
    font-size: 0.9rem;
    line-height: 1.45;
}

.manual-review-robot-result.is-success .manual-review-robot-result-bubble {
    background: rgba(236, 253, 245, 0.98);
    border-color: rgba(13, 148, 90, 0.22);
    color: rgb(6, 95, 70);
}

.manual-review-robot-result.is-warning .manual-review-robot-result-bubble {
    background: rgba(255, 247, 237, 0.98);
    border-color: rgba(217, 119, 6, 0.24);
    color: rgb(146, 64, 14);
}

.manual-review-robot-result.is-error .manual-review-robot-result-bubble {
    background: rgba(254, 242, 242, 0.98);
    border-color: rgba(220, 38, 38, 0.20);
    color: rgb(153, 27, 27);
}

.manual-review-frame {
    display: block;
    width: 100%;
    min-height: calc(100vh - 40px);
    height: min(74vh, 760px);
    border: 0;
    background: white;
}

.manual-review-modal {
    position: relative;
    z-index: 1;
    width: min(1200px, calc(100vw - 20px));
    min-height: min(860px, calc(100vh - 40px));
    max-height: calc(100vh - 24px);
    margin: 8px auto;
    display: grid;
    grid-template-columns: minmax(300px, 350px) minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
    border-radius: 30px;
    background: hsla(0 0% 100% / 0.92);
    box-shadow: var(--shadow-elegant);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding-top: 52px;
    overflow: hidden;
}

.manual-review-modal .manual-review-meta,
.manual-review-modal .manual-review-viewer {
    min-height: calc(min(860px, 100vh - 40px) - 36px);
    overflow: auto;
}

.manual-review-modal .manual-review-frame {
    min-height: calc(min(860px, 100vh - 40px) - 36px);
}

.admin-link {
    background: var(--accent);
    color: white;
    text-decoration: none;
    padding: 12px 18px;
    border-radius: 999px;
    white-space: nowrap;
}

.admin-link-secondary {
    background: rgba(17, 24, 39, 0.08);
    color: var(--accent-strong);
}

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

.hero-side {
    display: flex;
    align-items: center;
}

.hero-chip {
    display: inline-flex;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(17, 24, 39, 0.06);
    color: var(--accent-strong);
    font-weight: 600;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 20px;
}

.messages {
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
}

.message {
    border-radius: 18px;
    padding: 14px 18px;
}

.message.success {
    border-color: rgba(2, 122, 72, 0.18);
    color: var(--success);
}

.message.error {
    border-color: rgba(180, 35, 24, 0.18);
    color: var(--danger);
}

.loading-overlay {
    position: fixed;
    inset: 0;
    display: none;
    place-items: center;
    padding: 24px;
    background:
        radial-gradient(circle at top, hsla(206 100% 88% / 0.52), transparent 40%),
        linear-gradient(180deg, hsla(210 40% 12% / 0.20), hsla(220 44% 8% / 0.44));
    backdrop-filter: blur(12px) saturate(1.12);
    z-index: 9999;
}

.loading-overlay.is-visible {
    display: grid;
}

.loading-card {
    position: relative;
    overflow: hidden;
    width: min(460px, 100%);
    padding: 30px 26px 24px;
    border-radius: 28px;
    background:
        linear-gradient(180deg, hsla(0 0% 100% / 0.9), hsla(198 100% 98% / 0.82));
    border: 1px solid hsla(0 0% 100% / 0.58);
    box-shadow: 0 28px 56px hsla(227 56% 10% / 0.18);
    text-align: center;
    isolation: isolate;
}

.loading-card-glow {
    position: absolute;
    inset: -18% auto auto 50%;
    width: 220px;
    height: 220px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: radial-gradient(circle, hsla(225 96% 66% / 0.32), transparent 66%);
    filter: blur(12px);
    z-index: -1;
}

.loading-robot {
    width: 72px;
    height: 72px;
    margin: 0 auto 16px;
    border-radius: 22px;
    background:
        radial-gradient(circle at 35% 20%, hsla(0 0% 100% / 0.34), transparent 24%),
        var(--gradient-primary);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 18px 34px hsla(240 72% 58% / 0.28);
    animation: loading-bot-float 2.2s ease-in-out infinite;
}

.loading-robot .robot-antenna {
    position: absolute;
    top: -10px;
    left: 50%;
    width: 4px;
    height: 16px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 16px hsla(184 85% 66% / 0.5);
}

.loading-robot .robot-antenna::after {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    width: 10px;
    height: 10px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 18px hsla(184 85% 66% / 0.55);
    animation: antenna-pulse 1.6s ease-in-out infinite;
}

.loading-robot .robot-eye {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 0 0 8px hsla(0 0% 100% / 0.10);
}

.loading-scanline {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 0%, hsla(196 100% 78% / 0.22) 50%, transparent 100%);
    transform: translateY(-120%);
    animation: scan-sweep 2.8s ease-in-out infinite;
    pointer-events: none;
}

.loading-card strong {
    display: block;
    margin-bottom: 8px;
    font-size: 1.16rem;
    color: hsl(222 47% 11%);
}

.loading-card p {
    margin: 0 auto;
    max-width: 32ch;
    color: hsl(218 20% 42%);
    line-height: 1.6;
}

.loading-stage-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.loading-stage-pill {
    padding: 7px 10px;
    border-radius: 999px;
    font-size: 0.71rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: hsl(218 20% 42%);
    background: hsla(0 0% 100% / 0.56);
    border: 1px solid hsla(220 32% 68% / 0.22);
    transition: transform 180ms ease, background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.loading-stage-pill.is-active,
.loading-stage-pill.is-complete {
    color: hsl(230 60% 40%);
    background: hsla(211 100% 96% / 0.92);
    border-color: hsla(226 88% 66% / 0.24);
    transform: translateY(-1px);
}

.loading-progress-track {
    position: relative;
    width: min(300px, 100%);
    height: 8px;
    margin: 18px auto 0;
    border-radius: 999px;
    background: hsla(217 34% 78% / 0.28);
    overflow: hidden;
}

.loading-progress-fill {
    --loading-progress: 18%;
    position: absolute;
    inset: 0 auto 0 0;
    width: var(--loading-progress);
    border-radius: inherit;
    background:
        linear-gradient(90deg, hsl(211 92% 68%), hsl(244 88% 68%));
    box-shadow: 0 0 24px hsla(230 90% 66% / 0.34);
    transition: width 520ms cubic-bezier(0.22, 1, 0.36, 1);
}

.page-transition-layer {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    pointer-events: none;
    opacity: 0;
    z-index: 9998;
    background:
        radial-gradient(circle at center, hsla(215 100% 94% / 0.32), transparent 32%),
        linear-gradient(180deg, hsla(220 45% 12% / 0.08), hsla(220 45% 12% / 0.18));
    backdrop-filter: blur(8px);
    transition: opacity 180ms ease;
}

.page-transition-core {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: min(420px, calc(100vw - 36px));
    padding: 18px 22px;
    border-radius: 24px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.76), hsla(204 100% 97% / 0.68));
    border: 1px solid hsla(0 0% 100% / 0.6);
    box-shadow: 0 22px 48px hsla(222 40% 12% / 0.16);
    transform: translateY(10px) scale(0.98);
    transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.page-transition-copy {
    display: grid;
    gap: 3px;
}

.page-transition-copy strong {
    font-size: 0.95rem;
    color: hsl(222 47% 11%);
}

.page-transition-copy span {
    font-size: 0.84rem;
    color: hsl(218 20% 42%);
}

.page-transition-bot {
    position: relative;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    border-radius: 16px;
    background:
        radial-gradient(circle at 30% 20%, hsla(0 0% 100% / 0.32), transparent 24%),
        var(--gradient-primary);
    box-shadow: 0 16px 28px hsla(240 72% 58% / 0.24);
}

.page-transition-bot-antenna {
    position: absolute;
    top: -10px;
    left: 50%;
    width: 3px;
    height: 14px;
    transform: translateX(-50%);
    border-radius: 999px;
    background: hsl(184 85% 66%);
}

.page-transition-bot-antenna::after {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    width: 10px;
    height: 10px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: hsl(184 85% 66%);
    box-shadow: 0 0 16px hsla(184 85% 66% / 0.5);
    animation: antenna-pulse 1.4s ease-in-out infinite;
}

.page-transition-bot-face {
    position: absolute;
    left: 11px;
    right: 11px;
    top: 18px;
    height: 12px;
    border-radius: 999px;
    background:
        radial-gradient(circle at 28% 50%, white 0 2px, transparent 3px),
        radial-gradient(circle at 72% 50%, white 0 2px, transparent 3px),
        linear-gradient(180deg, hsla(255 100% 100% / 0.18), hsla(255 100% 100% / 0.08));
}

.page-transition-bot-body {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: -12px;
    height: 14px;
    border-radius: 10px 10px 14px 14px;
    background:
        linear-gradient(180deg, hsla(0 0% 100% / 0.28), hsla(0 0% 100% / 0.14)),
        var(--gradient-primary);
}

.page-transition-beam {
    position: absolute;
    inset: 0 auto 0 -35%;
    width: 32%;
    background: linear-gradient(90deg, transparent, hsla(0 0% 100% / 0.34), transparent);
    transform: skewX(-18deg);
    animation: tech-beam 1.15s linear infinite;
}

body.is-page-transitioning .page-transition-layer {
    opacity: 1;
}

body.is-page-transitioning .page-transition-core {
    transform: translateY(0) scale(1);
}

.modal-shell {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 120;
    overflow-y: auto;
    padding: 10px;
}

.modal-shell.is-open {
    display: block;
}

.modal-backdrop {
    position: absolute;
    inset: 0;
    background: hsla(228 39% 10% / 0.48);
    backdrop-filter: blur(2px);
}

.analysis-modal {
    position: relative;
    z-index: 1;
    width: min(940px, calc(100vw - 20px));
    margin: 10px auto;
    max-height: calc(100vh - 20px);
    border-radius: 32px;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1.28fr);
    background: hsla(0 0% 100% / 0.82);
    backdrop-filter: saturate(135%) blur(8px);
    -webkit-backdrop-filter: saturate(135%) blur(8px);
    box-shadow: 0 14px 28px hsla(210 30% 20% / 0.12);
}

.analysis-modal-side {
    position: relative;
    padding: 26px 24px 24px;
    color: white;
    background:
        radial-gradient(circle at top right, hsla(0 0% 100% / 0.28), transparent 34%),
        linear-gradient(180deg, hsl(223 84% 63%) 0%, hsl(243 88% 70%) 100%);
    border-right: 1px solid hsla(0 0% 100% / 0.18);
    display: grid;
    align-content: start;
    gap: 14px;
    overflow: auto;
}

.analysis-modal-side h2 {
    margin: 0;
    font-size: clamp(1.75rem, 3vw, 2.45rem);
    line-height: 1;
    letter-spacing: -0.05em;
    max-width: 8ch;
}

.analysis-modal-side p:last-of-type {
    margin: 0;
    line-height: 1.75;
    color: hsla(0 0% 100% / 0.82);
    max-width: 24ch;
    font-size: 0.96rem;
}

.analysis-modal-main {
    position: relative;
    padding: 24px 28px 28px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 99% / 0.96));
    color: hsl(222 47% 11%);
    overflow: auto;
}

.analysis-modal-main .eyebrow {
    color: hsl(230 22% 48%);
}

.analysis-modal-main .field label,
.analysis-modal-main .step-panel-head p:last-child {
    color: hsl(220 14% 42%);
}

.analysis-modal-main .step-panel-head h3 {
    color: hsl(222 47% 11%);
}

.analysis-modal-main .field {
    padding: 14px 16px;
    border-radius: 18px;
    background: linear-gradient(180deg, hsla(201 100% 99% / 0.98), hsla(196 100% 97% / 0.94));
    border: 1px solid hsla(196 54% 62% / 0.2);
    box-shadow: inset 0 1px 0 hsla(0 0% 100% / 0.72);
}

.modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 4;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: hsla(0 0% 100% / 0.7);
    color: var(--text);
    font-size: 1.1rem;
    cursor: pointer;
    box-shadow: 0 8px 18px hsla(210 30% 20% / 0.1);
}

.modal-robot {
    margin-top: 6px;
}

.analysis-modal-side .robot-head {
    width: 84px;
    height: 70px;
    border-radius: 24px;
}

.analysis-modal-side .robot-antena,
.analysis-modal-side .robot-antenna {
    top: -16px;
    height: 18px;
}

.analysis-modal-side .robot-antena::before,
.analysis-modal-side .robot-antenna::before {
    width: 10px;
    height: 10px;
    margin-left: -5px;
}

.analysis-modal-side .robot-face {
    inset: 20px 16px 14px;
    gap: 12px;
    border-radius: 18px;
}

.analysis-modal-side .robot-face span {
    width: 8px;
    height: 8px;
}

.analysis-modal-side .robot-body {
    width: 72px;
    margin-top: 10px;
    padding: 14px 12px;
    border-radius: 20px;
}

.analysis-modal-side .robot-body span {
    height: 8px;
}

.summary-card,
.upload-card,
.employee-card,
.empty-state {
    border-radius: 28px;
    padding: 22px;
}

.upload-card {
    margin: 22px 0 18px;
    display: grid;
    grid-template-columns: minmax(250px, 0.72fr) minmax(420px, 1.28fr);
    gap: 24px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.9)),
        var(--surface);
}

.single-column {
    grid-template-columns: 1fr;
}

.upload-copy p {
    color: var(--muted);
    line-height: 1.6;
    max-width: 32ch;
}

.upload-form {
    display: grid;
    gap: 18px;
}

.panel-card {
    display: grid;
    align-content: start;
    gap: 18px;
    padding: 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.52);
    border: 1px solid var(--line);
}

.panel-head {
    display: grid;
    gap: 6px;
}

.table-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.table-action-link,
.table-action-button {
    background: none;
    border: 0;
    color: var(--brand-strong);
    font-size: 0.84rem;
    font-weight: 600;
    padding: 0;
    text-decoration: none;
    cursor: pointer;
}

.table-action-link.is-disabled {
    color: var(--muted);
    cursor: default;
    pointer-events: none;
}

.manual-note {
    margin-top: 8px;
    color: var(--success);
    font-size: 0.78rem;
    font-weight: 600;
}

.inline-delete-form {
    margin: 0;
}

.inline-form {
    margin-top: 18px;
}

.inline-form .action-button-inline {
    width: fit-content !important;
    display: inline-flex !important;
    justify-self: start !important;
    align-self: start !important;
}

.field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.field-grid-single {
    grid-template-columns: 1fr;
}

.field {
    display: grid;
    gap: 8px;
    position: relative;
}

.field-file,
.field:last-child {
    grid-column: 1 / -1;
}

.field label {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--muted);
}

.field-help {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.select-shell {
    position: relative;
}

.select-shell::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid hsl(215 26% 42%);
    border-bottom: 2px solid hsl(215 26% 42%);
    transform: translateY(-50%) rotate(45deg);
    pointer-events: none;
    opacity: 0.9;
}

.field input:not([type="checkbox"]):not([type="file"]) {
    width: 100%;
    padding: 13px 15px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: var(--surface-strong);
    color: var(--text);
    transition: border-color var(--transition-smooth), box-shadow var(--transition-smooth), transform var(--transition-smooth);
}

.password-field-wrap {
    position: relative;
}

.password-field-wrap input {
    padding-right: 92px !important;
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    border: 0;
    background: hsla(230 85% 60% / 0.08);
    color: var(--brand-strong);
    border-radius: 999px;
    min-height: 32px;
    padding: 0 12px;
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
}

.field select {
    width: 100%;
    padding: 13px 15px;
    padding-right: 40px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: var(--surface-strong);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    color: var(--text);
    transition: border-color var(--transition-smooth), box-shadow var(--transition-smooth), transform var(--transition-smooth);
}

.field input:not([type="checkbox"]):not([type="file"]):focus,
.field select:focus {
    outline: none;
    border-color: hsla(230 85% 60% / 0.5);
    box-shadow: 0 0 0 4px hsla(230 85% 60% / 0.12);
}

html.theme-dark {
    color-scheme: dark;
    --bg: hsl(228 28% 8%);
    --surface: hsla(228 22% 14% / 0.9);
    --surface-strong: hsl(228 22% 16%);
    --text: hsl(210 40% 96%);
    --muted: hsl(217 16% 70%);
    --line: hsla(210 40% 96% / 0.08);
    --sidebar: hsl(220 48% 18%);
    --sidebar-line: hsla(210 40% 96% / 0.06);
    --sidebar-text: hsla(210 40% 96% / 0.72);
    --shadow-card: 0 14px 34px hsla(230 42% 4% / 0.34);
}

html.theme-dark body {
    background:
        radial-gradient(circle at top left, hsla(210 92% 68% / 0.12), transparent 24%),
        linear-gradient(180deg, hsl(223 30% 12%) 0%, hsl(223 32% 10%) 100%);
}

html.theme-dark .app-sidebar {
    background:
        radial-gradient(circle at top, hsla(228 90% 72% / 0.08), transparent 26%),
        linear-gradient(180deg, hsl(226 34% 16%) 0%, hsl(228 30% 12%) 100%);
}

html.theme-dark .sidebar-panel {
    background: hsla(0 0% 100% / 0.06);
    border-color: hsla(0 0% 100% / 0.08);
}

html.theme-dark .sidebar-nav a:hover,
html.theme-dark .sidebar-nav a.is-active {
    background: hsla(210 40% 96% / 0.08);
    color: white;
}

html.theme-dark .nav-icon {
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.08), hsla(0 0% 100% / 0.03));
    border-color: hsla(0 0% 100% / 0.08);
    box-shadow:
        inset 0 1px 0 hsla(0 0% 100% / 0.08),
        0 10px 24px hsla(230 42% 4% / 0.24);
}

html.theme-dark .sidebar-nav a:hover .nav-icon,
html.theme-dark .sidebar-nav a.is-active .nav-icon {
    background: linear-gradient(180deg, hsla(210 40% 96% / 0.16), hsla(210 40% 96% / 0.07));
    border-color: hsla(210 40% 96% / 0.14);
}

html.theme-dark .content-bar,
html.theme-dark .workspace-card,
html.theme-dark .stat-card,
html.theme-dark .journey-panel,
html.theme-dark .empty-state,
html.theme-dark .message,
html.theme-dark .auth-card,
html.theme-dark .panel-card,
html.theme-dark .mini-summary,
html.theme-dark .insight-strip > div,
html.theme-dark .result-tabs a,
html.theme-dark .user-chip,
html.theme-dark .topbar,
html.theme-dark .theme-toggle {
    background: hsla(228 22% 14% / 0.84);
    border-color: var(--line);
    color: var(--text);
}

html.theme-dark .loading-overlay {
    background:
        radial-gradient(circle at top, hsla(236 95% 68% / 0.18), transparent 38%),
        linear-gradient(180deg, hsla(228 38% 8% / 0.34), hsla(228 38% 6% / 0.6));
}

html.theme-dark .loading-card,
html.theme-dark .page-transition-core {
    background: linear-gradient(180deg, hsla(228 22% 14% / 0.92), hsla(228 24% 12% / 0.9));
    border-color: hsla(220 24% 30% / 0.54);
    box-shadow: 0 26px 54px hsla(228 44% 4% / 0.32);
}

html.theme-dark .loading-card strong,
html.theme-dark .page-transition-copy strong {
    color: hsl(210 40% 96%);
}

html.theme-dark .loading-card p,
html.theme-dark .page-transition-copy span,
html.theme-dark .loading-stage-pill {
    color: hsl(218 20% 74%);
}

html.theme-dark .loading-stage-pill {
    background: hsla(228 24% 18% / 0.92);
    border-color: hsla(220 24% 30% / 0.54);
}

html.theme-dark .loading-stage-pill.is-active,
html.theme-dark .loading-stage-pill.is-complete {
    color: hsl(212 100% 88%);
    background: hsla(230 72% 24% / 0.92);
    border-color: hsla(230 76% 66% / 0.34);
}

html.theme-dark .loading-progress-track {
    background: hsla(220 20% 100% / 0.08);
}

html.theme-dark .manual-replace-form {
    background: linear-gradient(180deg, hsla(228 22% 16% / 0.96), hsla(228 22% 14% / 0.92));
    border-color: var(--line);
}

html.theme-dark .manual-replace-form input[type="file"]::file-selector-button {
    background: hsla(228 22% 18% / 0.94);
    border-color: var(--line);
    color: hsl(210 40% 96%);
}

html.theme-dark .manual-review-robot-result-bubble {
    background: hsla(228 22% 14% / 0.96);
    border-color: hsla(220 24% 30% / 0.54);
    color: hsl(210 40% 96%);
}

html.theme-dark .manual-review-robot-result.is-success .manual-review-robot-result-bubble {
    background: rgba(6, 78, 59, 0.94);
    border-color: rgba(52, 211, 153, 0.20);
    color: rgb(167, 243, 208);
}

html.theme-dark .manual-review-robot-result.is-warning .manual-review-robot-result-bubble {
    background: rgba(120, 53, 15, 0.94);
    border-color: rgba(251, 191, 36, 0.22);
    color: rgb(253, 230, 138);
}

html.theme-dark .manual-review-robot-result.is-error .manual-review-robot-result-bubble {
    background: rgba(127, 29, 29, 0.94);
    border-color: rgba(252, 165, 165, 0.20);
    color: rgb(254, 202, 202);
}

html.theme-dark .theme-toggle-icon {
    background: linear-gradient(135deg, hsla(210 92% 68% / 0.22), hsla(250 90% 70% / 0.28));
}

html.theme-dark .theme-toggle-icon::before {
    content: "☾";
}

html.theme-dark .site-footer-inner {
    background: hsla(228 22% 14% / 0.84);
    border-color: var(--line);
}

html.theme-dark .content-bar {
    background: hsla(228 22% 14% / 0.58);
    border-color: hsla(210 40% 96% / 0.1);
    box-shadow:
        0 12px 24px hsla(230 42% 4% / 0.18),
        inset 0 1px 0 hsla(210 40% 96% / 0.06);
}

html.theme-dark .ai-hero {
    color: white;
    background:
        radial-gradient(circle at top right, hsla(210 40% 96% / 0.16), transparent 30%),
        radial-gradient(circle at bottom left, hsla(250 90% 70% / 0.18), transparent 26%),
        linear-gradient(135deg, hsla(232 76% 60% / 0.78), hsla(228 76% 66% / 0.72), hsla(221 74% 58% / 0.66));
    border-color: hsla(210 40% 96% / 0.08);
    backdrop-filter: saturate(140%) blur(8px);
    -webkit-backdrop-filter: saturate(140%) blur(8px);
    box-shadow:
        0 10px 22px hsla(230 42% 4% / 0.16),
        inset 0 1px 0 hsla(210 40% 96% / 0.06);
}

html.theme-dark .eyebrow-light,
html.theme-dark .hero-description,
html.theme-dark .preview-label,
html.theme-dark .preview-card p {
    color: rgba(255, 255, 255, 0.82);
}

html.theme-dark .hero-button-primary {
    color: #111827;
    background: white;
}

html.theme-dark .hero-chip-soft,
html.theme-dark .preview-card,
html.theme-dark .preview-card-primary {
    color: white;
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.16);
}

html.theme-dark .workspace-card-primary,
html.theme-dark .stat-card-featured,
html.theme-dark .journey-step,
html.theme-dark .workspace-card-secondary {
    background: linear-gradient(180deg, hsla(228 22% 16% / 0.96), hsla(228 22% 14% / 0.92));
    color: var(--text);
}

html.theme-dark .workspace-card-secondary .eyebrow,
html.theme-dark .workspace-card-secondary p,
html.theme-dark .workspace-card-secondary li {
    color: var(--muted);
}

html.theme-dark .signal-list li,
html.theme-dark .employee-meta span,
html.theme-dark .source-badge.is-logic {
    background: hsla(210 40% 96% / 0.06);
}

html.theme-dark .launch-strip {
    background: linear-gradient(135deg, hsla(228 22% 16% / 0.96), hsla(228 22% 14% / 0.92));
    border-color: var(--line);
}

html.theme-dark .launch-strip strong,
html.theme-dark .step-dot strong,
html.theme-dark .analysis-modal-main .step-panel-head h3 {
    color: var(--text);
}

html.theme-dark .launch-strip .eyebrow,
html.theme-dark .analysis-modal-main .field label,
html.theme-dark .analysis-modal-main .step-panel-head p:last-child,
html.theme-dark .analysis-modal-main .eyebrow {
    color: var(--muted);
}

html.theme-dark .analysis-modal-main {
    background: hsl(228 22% 14%);
    color: var(--text);
}

html.theme-dark .analysis-modal-main .field,
html.theme-dark .field input:not([type="checkbox"]):not([type="file"]),
html.theme-dark .field select,
html.theme-dark .checkbox-field-boxed,
html.theme-dark .step-dot {
    background: hsl(228 22% 16%);
    border-color: var(--line);
    color: var(--text);
}

html.theme-dark .select-shell::after {
    border-right-color: hsl(210 40% 92%);
    border-bottom-color: hsl(210 40% 92%);
}

html.theme-dark .modal-close,
html.theme-dark .submit-button-ghost {
    background: hsl(228 22% 18%);
    border-color: var(--line);
    color: var(--text);
}

html.theme-dark .result-tabs a.is-active {
    background: linear-gradient(180deg, #1f2937, #111827);
    color: white;
}

html.theme-dark .manual-note {
    color: hsl(145 63% 62%);
}

html.theme-dark .manual-review-meta,
html.theme-dark .manual-review-viewer,
html.theme-dark .manual-review-card {
    background: hsla(228 22% 14% / 0.9);
    border-color: var(--line);
}

html.theme-dark .manual-review-frame {
    background: hsl(228 22% 12%);
}

html.theme-dark .manual-review-modal {
    background: hsla(228 22% 12% / 0.94);
}

html.theme-dark .assignment-modal-main,
html.theme-dark .assignment-list-shell,
html.theme-dark .assignment-check-item {
    background: hsl(228 22% 14%);
    border-color: var(--line);
    color: var(--text);
}

html.theme-dark .assignment-check-copy,
html.theme-dark .assignment-list-head strong {
    color: var(--text);
}

html.theme-dark .assignment-list-head span,
html.theme-dark .empty-inline-note {
    color: var(--muted);
}

.field input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--accent);
    justify-self: start;
}

.field input[type="file"] {
    width: 100%;
    padding: 10px 0;
    border: 0;
    background: transparent;
}

.field ul {
    margin: 0;
    padding-left: 18px;
    color: var(--danger);
}

.submit-button {
    border: 0;
    border-radius: 999px;
    padding: 12px 18px;
    background: var(--gradient-primary);
    color: white;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    max-width: 220px;
    min-height: 42px;
    justify-self: start;
    align-self: start;
    white-space: nowrap;
    box-shadow: 0 14px 30px hsla(240 70% 60% / 0.24);
    transition: transform var(--transition-smooth), box-shadow var(--transition-smooth), opacity var(--transition-smooth);
}

.submit-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px hsla(240 70% 60% / 0.28);
}

.submit-button-ghost {
    background: hsl(220 33% 96%);
    color: var(--text);
    box-shadow: none;
    border: 1px solid hsla(222 47% 11% / 0.08);
}

.submit-button-ghost:hover {
    box-shadow: none;
}

.stepper-head {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 18px;
    align-items: stretch;
}

.stepper-head > * {
    min-width: 0;
}

.step-dot {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 58px;
    padding: 12px 14px;
    border: 1px solid hsla(222 47% 11% / 0.07);
    border-radius: 16px;
    background: hsla(0 0% 100% / 0.86);
    cursor: pointer;
    transition: transform var(--transition-smooth), border-color var(--transition-smooth), background var(--transition-smooth);
}

.step-dot > div {
    display: grid;
    align-items: center;
    min-height: 100%;
    min-width: 0;
}

.step-dot span {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: hsla(230 85% 60% / 0.1);
    color: var(--brand-strong);
    font-weight: 800;
}

.step-dot strong {
    font-size: 0.88rem;
    line-height: 1.1;
    color: hsl(222 47% 11%);
    display: block;
}

.step-dot.is-active {
    border-color: hsla(230 85% 60% / 0.28);
    background: linear-gradient(180deg, hsla(230 85% 60% / 0.08), hsla(196 95% 76% / 0.12));
    box-shadow: inset 0 0 0 1px hsla(230 85% 60% / 0.06);
}

.step-dot.is-active span {
    background: var(--gradient-primary);
    color: white;
}

.step-dot.is-complete span {
    background: var(--gradient-success);
    color: white;
}

.step-panel {
    display: none;
    gap: 18px;
}

.step-panel.is-active {
    display: grid;
    padding-top: 4px;
}

.step-panel-head {
    display: grid;
    gap: 6px;
    margin-bottom: 8px;
}

.step-panel-head h3 {
    margin: 0;
    font-size: 1.3rem;
    letter-spacing: -0.04em;
}

.step-panel-head p:last-child {
    margin: 0;
    color: var(--muted);
    line-height: 1.7;
    max-width: 48ch;
}

.wizard-actions {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.assignment-modal {
    position: relative;
    z-index: 1;
    width: min(920px, calc(100vw - 20px));
    margin: 10px auto;
    max-height: calc(100vh - 20px);
    border-radius: 32px;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(230px, 0.8fr) minmax(0, 1.2fr);
    border: 1px solid var(--line);
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 99% / 0.96));
    box-shadow: var(--shadow-elegant);
}

.assignment-modal-compact {
    width: min(1100px, calc(100vw - 20px));
    grid-template-columns: minmax(235px, 0.68fr) minmax(0, 1.32fr);
}

.sector-modal-shell {
    box-shadow:
        0 24px 60px hsla(210 52% 34% / 0.18),
        inset 0 1px 0 hsla(0 0% 100% / 0.62);
}

.sector-modal-side {
    background:
        radial-gradient(circle at top right, hsla(0 0% 100% / 0.32), transparent 34%),
        linear-gradient(180deg, hsl(214 82% 68%) 0%, hsl(202 84% 74%) 100%);
}

.sector-modal-bot {
    display: grid;
    justify-items: center;
    gap: 12px;
    margin-top: 10px;
}

.sector-modal-bot .robot-shell {
    display: grid;
    justify-items: center;
    width: 104px;
    margin: 0 auto;
}

.sector-modal-bot .robot-head {
    margin: 0 auto;
}

.sector-modal-bot .robot-body {
    margin: 12px auto 0;
}

.sector-modal-bot .robot-antena,
.sector-modal-bot .robot-antenna {
    left: 50%;
    transform: translateX(-50%);
}

.sector-modal-bubble {
    max-width: 24ch;
    padding: 12px 14px;
    border-radius: 18px 18px 18px 8px;
    background: hsla(0 0% 100% / 0.18);
    border: 1px solid hsla(0 0% 100% / 0.22);
    color: hsla(0 0% 100% / 0.92);
    line-height: 1.55;
    font-size: 0.9rem;
    box-shadow: inset 0 1px 0 hsla(0 0% 100% / 0.22);
    text-align: center;
}

.sector-users-meta {
    margin-top: 12px;
}

.sector-users-meta span {
    background: hsla(210 92% 68% / 0.12);
    color: var(--text);
    font-weight: 600;
}

.assignment-modal-side {
    padding: 26px 24px 24px;
    color: white;
    background:
        radial-gradient(circle at top right, hsla(0 0% 100% / 0.28), transparent 34%),
        linear-gradient(180deg, hsl(212 84% 66%) 0%, hsl(199 84% 72%) 100%);
    display: grid;
    align-content: start;
    gap: 12px;
    overflow: auto;
}

.assignment-modal-side h2 {
    margin: 0;
    font-size: clamp(1.65rem, 3vw, 2.2rem);
    line-height: 1;
    letter-spacing: -0.05em;
    max-width: 9ch;
}

.assignment-modal-side p:last-child {
    margin: 0;
    line-height: 1.75;
    color: hsla(0 0% 100% / 0.84);
    max-width: 28ch;
    font-size: 0.95rem;
}

.assignment-modal-main {
    padding: 24px 28px 28px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 99% / 0.96));
    overflow: auto;
}

.assignment-list-shell {
    display: grid;
    gap: 12px;
    padding: 16px;
    border-radius: 18px;
    background: linear-gradient(180deg, hsla(201 100% 99% / 0.98), hsla(196 100% 97% / 0.94));
    border: 1px solid hsla(196 54% 62% / 0.2);
    box-shadow: inset 0 1px 0 hsla(0 0% 100% / 0.72);
}

.e2doc-index-shell {
    margin-top: 16px;
}

.e2doc-index-list {
    display: grid;
    gap: 12px;
}

.e2doc-index-item {
    align-items: start;
}

.e2doc-index-item .field {
    margin-top: 10px;
}

.modal-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.assignment-modal-main,
.analysis-modal-main,
.book-learning-modal-main,
.manual-review-meta,
.manual-review-viewer,
.assignment-modal-side,
.analysis-modal-side {
    min-width: 0;
}

.e2doc-index-list {
    max-height: min(34vh, 320px);
    overflow: auto;
    padding-right: 4px;
}

.assignment-filter-field {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.assignment-list-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.assignment-list-head strong {
    font-size: 0.98rem;
}

.assignment-list-head span {
    color: var(--muted);
    font-size: 0.86rem;
}

.assignment-checklist {
    display: grid;
    gap: 10px;
    max-height: 340px;
    overflow: auto;
    padding-right: 4px;
}

.assignment-check-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.9);
    cursor: pointer;
}

.assignment-check-item[hidden] {
    display: none;
}

.assignment-check-item:hover {
    border-color: hsla(210 92% 68% / 0.28);
    box-shadow: var(--shadow-card);
}

.assignment-check-input {
    padding-top: 1px;
}

.assignment-check-copy {
    line-height: 1.55;
    font-size: 0.91rem;
}

.empty-inline-note {
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px dashed var(--line);
    color: var(--muted);
}

.submit-button-compact {
    padding: 8px 14px;
    font-size: 0.88rem;
    min-height: 34px;
    max-width: 170px;
}

.checkbox-field {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: start;
    align-items: center;
    column-gap: 10px;
}

.checkbox-field-boxed {
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: var(--surface-strong);
}

.checkbox-field label {
    margin: 0;
}

.checkbox-control {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
}

.checkbox-control input[type="checkbox"] {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    max-width: 14px !important;
    max-height: 14px !important;
    transform: none !important;
}

.action-button-inline {
    width: auto !important;
    min-width: 120px !important;
    max-width: 160px !important;
    padding: 8px 14px !important;
    min-height: 34px !important;
    border-radius: 14px !important;
    font-size: 0.88rem !important;
    line-height: 1 !important;
}

.summary-card small {
    display: block;
    margin-top: 8px;
    color: var(--muted);
}

.focus-banner {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin: 0 0 18px;
    padding: 14px 16px;
    border-radius: 22px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, 0.76);
}

.focus-banner strong {
    margin-right: 8px;
}

.result-tabs {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 18px;
}

.result-tabs a {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-width: 190px;
    padding: 13px 16px;
    border-radius: 20px;
    border: 1px solid var(--line);
    background: hsla(0 0% 100% / 0.9);
    color: var(--text);
    text-decoration: none;
}

.result-tabs a span {
    font-weight: 700;
}

.result-tabs a strong {
    color: var(--accent-strong);
    font-size: 1rem;
}

.result-tabs a.is-active {
    background: linear-gradient(135deg, hsl(210 92% 68%), hsl(196 95% 76%));
    color: white;
    border-color: transparent;
}

.result-tabs a.is-active strong {
    color: white;
}

.employee-card {
    border-left: 4px solid transparent;
    border-radius: 26px;
}

.employee-card:has(.is-danger) {
    border-left-color: rgba(180, 35, 24, 0.7);
}

.employee-card:has(.is-warning) {
    border-left-color: rgba(181, 71, 8, 0.7);
}

.summary-card span,
.mini-summary span {
    display: block;
    color: var(--muted);
}

.summary-card strong {
    display: block;
    margin-top: 8px;
    font-size: 1.9rem;
    letter-spacing: -0.04em;
}

.employee-list {
    display: grid;
    gap: 14px;
}

.dashboard-queue-card {
    margin-bottom: 12px;
}

.executive-chart-grid + .employee-list,
#manual-review-section + .employee-list {
    margin-top: 18px;
}

.employee-header,
.mini-summary {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.badge {
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
}

.source-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 74px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.source-badge.is-logic {
    background: rgba(31, 41, 51, 0.08);
    color: var(--text);
}

.source-badge.is-ai {
    background: rgba(15, 118, 110, 0.14);
    color: var(--accent-strong);
}

.table-status {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.table-status-present {
    background: rgba(34, 197, 94, 0.12);
    color: #15803d;
    border-color: rgba(34, 197, 94, 0.18);
}

.table-status-missing {
    background: rgba(239, 68, 68, 0.12);
    color: #b91c1c;
    border-color: rgba(239, 68, 68, 0.18);
}

.table-status-pending {
    background: rgba(245, 158, 11, 0.12);
    color: #b45309;
    border-color: rgba(245, 158, 11, 0.18);
}

.table-status-manual_review {
    background: rgba(249, 115, 22, 0.12);
    color: #c2410c;
    border-color: rgba(249, 115, 22, 0.18);
}

.table-status-not_applicable {
    background: rgba(148, 163, 184, 0.12);
    color: #475569;
    border-color: rgba(148, 163, 184, 0.18);
}

html.theme-dark .table-status-present {
    background: rgba(20, 83, 45, 0.3);
    color: #bbf7d0;
    border-color: rgba(74, 222, 128, 0.18);
}

html.theme-dark .table-status-missing {
    background: rgba(127, 29, 29, 0.3);
    color: #fecaca;
    border-color: rgba(248, 113, 113, 0.18);
}

html.theme-dark .table-status-pending {
    background: rgba(120, 53, 15, 0.3);
    color: #fde68a;
    border-color: rgba(251, 191, 36, 0.18);
}

html.theme-dark .table-status-manual_review {
    background: rgba(124, 45, 18, 0.3);
    color: #fdba74;
    border-color: rgba(251, 146, 60, 0.18);
}

html.theme-dark .table-status-not_applicable {
    background: rgba(51, 65, 85, 0.34);
    color: #cbd5e1;
    border-color: rgba(148, 163, 184, 0.18);
}

.is-success {
    background: rgba(2, 122, 72, 0.12);
    color: var(--success);
}

.is-warning {
    background: rgba(181, 71, 8, 0.12);
    color: var(--warning);
}

.is-danger {
    background: rgba(180, 35, 24, 0.12);
    color: var(--danger);
}

.mini-summary {
    margin: 16px 0 12px;
    padding: 12px 14px;
    background: linear-gradient(180deg, hsla(0 0% 100% / 0.98), hsla(198 100% 98% / 0.94));
    border-radius: 18px;
    flex-wrap: wrap;
}

.status-chip {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 0.82rem;
    font-weight: 700;
    border: 1px solid transparent;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.status-chip-missing {
    background: linear-gradient(180deg, rgba(254, 226, 226, 0.96), rgba(254, 202, 202, 0.9));
    color: #991b1b !important;
    border-color: rgba(239, 68, 68, 0.18);
}

.status-chip-pending {
    background: linear-gradient(180deg, rgba(254, 243, 199, 0.98), rgba(253, 230, 138, 0.92));
    color: #92400e !important;
    border-color: rgba(245, 158, 11, 0.2);
}

.status-chip-manual {
    background: linear-gradient(180deg, rgba(254, 237, 213, 0.98), rgba(253, 186, 116, 0.9));
    color: #9a3412 !important;
    border-color: rgba(249, 115, 22, 0.2);
}

.status-chip-present {
    background: linear-gradient(180deg, rgba(220, 252, 231, 0.98), rgba(187, 247, 208, 0.92));
    color: #166534 !important;
    border-color: rgba(34, 197, 94, 0.18);
}

html.theme-dark .status-chip {
    box-shadow: none;
}

html.theme-dark .status-chip-missing {
    background: linear-gradient(180deg, rgba(127, 29, 29, 0.32), rgba(153, 27, 27, 0.22));
    color: #fecaca !important;
    border-color: rgba(248, 113, 113, 0.22);
}

html.theme-dark .status-chip-pending {
    background: linear-gradient(180deg, rgba(120, 53, 15, 0.32), rgba(146, 64, 14, 0.22));
    color: #fde68a !important;
    border-color: rgba(251, 191, 36, 0.22);
}

html.theme-dark .status-chip-manual {
    background: linear-gradient(180deg, rgba(124, 45, 18, 0.34), rgba(154, 52, 18, 0.22));
    color: #fdba74 !important;
    border-color: rgba(251, 146, 60, 0.24);
}

html.theme-dark .status-chip-present {
    background: linear-gradient(180deg, rgba(20, 83, 45, 0.34), rgba(22, 101, 52, 0.22));
    color: #bbf7d0 !important;
    border-color: rgba(74, 222, 128, 0.22);
}

.employee-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.employee-meta span {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: hsla(198 64% 86% / 0.28);
    color: var(--muted);
    font-size: 0.8rem;
    font-weight: 500;
}

.inline-pill {
    background: rgba(2, 122, 72, 0.12) !important;
    color: var(--success) !important;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    text-align: left;
    padding: 13px 10px;
    border-bottom: 1px solid var(--line);
    vertical-align: top;
}

th {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.empty-state {
    margin-top: 24px;
}

.empty-state-modern {
    position: relative;
    overflow: hidden;
    text-align: center;
    padding: 42px 24px;
}

.empty-orb {
    width: 84px;
    height: 84px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.12)),
        linear-gradient(135deg, rgba(91, 97, 255, 0.9), rgba(127, 123, 255, 0.96));
    box-shadow: 0 20px 40px rgba(91, 97, 255, 0.22);
}

.app-shell.is-collapsed .app-sidebar {
    padding-inline: 14px;
}

.app-shell.is-collapsed .brand-copy,
.app-shell.is-collapsed .nav-label,
.app-shell.is-collapsed .sidebar-panel {
    opacity: 0;
    transform: translateX(-8px);
    pointer-events: none;
}

.app-shell.is-collapsed .sidebar-brand {
    justify-content: center;
}

.app-shell.is-collapsed .sidebar-brand-image {
    height: 56px;
}

.app-shell.is-collapsed .sidebar-nav a {
    justify-content: center;
    padding-inline: 0;
}

.app-shell.is-collapsed .nav-icon {
    width: 30px;
    height: 30px;
}

[data-reveal] {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity 0.55s ease,
        transform 0.55s ease;
}

[data-reveal].is-visible {
    opacity: 1;
    transform: translateY(0);
}

.narrow-card {
    max-width: 760px;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes float-bot {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-8px);
    }
}

@keyframes pulse-bot {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 18px 34px hsla(240 72% 58% / 0.32);
    }
    50% {
        transform: scale(1.04);
        box-shadow: 0 22px 40px hsla(240 72% 58% / 0.42);
    }
}

@keyframes micro-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-3px);
    }
}

@keyframes mascot-bob {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-7px);
    }
}

@keyframes antenna-pulse {
    0%, 100% {
        opacity: 0.7;
        filter: saturate(1);
    }
    50% {
        opacity: 1;
        filter: saturate(1.3);
    }
}

@keyframes loading-bot-float {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

@keyframes scan-sweep {
    0% {
        transform: translateY(-130%);
        opacity: 0;
    }
    18%, 76% {
        opacity: 1;
    }
    100% {
        transform: translateY(140%);
        opacity: 0;
    }
}

@keyframes tech-beam {
    from {
        transform: translateX(0) skewX(-18deg);
    }
    to {
        transform: translateX(470%) skewX(-18deg);
    }
}

@keyframes page-rise-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 860px) {
    .app-shell {
        grid-template-columns: 1fr;
    }

    .app-shell.is-collapsed {
        grid-template-columns: 1fr;
    }

    .app-sidebar {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 40;
        width: min(320px, 86vw);
        transform: translateX(-100%);
        transition: transform 0.28s ease;
    }

    .app-shell.sidebar-open .app-sidebar {
        transform: translateX(0);
    }

    .app-main {
        padding: 18px;
    }

    .content-bar {
        flex-direction: column;
    }

    .header-stack {
        width: 100%;
    }

    .header-side {
        width: 100%;
        justify-content: space-between;
    }

    .brand-logo-default {
        height: 64px;
    }

    .sidebar-brand-image {
        height: 68px;
    }

    .ai-hero,
    .workspace-grid,
    .book-learning-grid,
    .stats-row,
    .dashboard-chart-grid {
        grid-template-columns: 1fr;
    }

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

    .executive-card-grid,
    .executive-chart-grid {
        grid-template-columns: 1fr;
    }

    .executive-header-card {
        flex-direction: column;
    }

    .executive-header-actions {
        justify-content: flex-start;
    }

    .analysis-modal {
        grid-template-columns: 1fr;
        width: min(760px, calc(100vw - 16px));
        margin: 8px auto;
        max-height: calc(100vh - 20px);
    }

    .assignment-modal {
        grid-template-columns: 1fr;
        width: min(800px, calc(100vw - 16px));
        margin: 8px auto;
        max-height: calc(100vh - 20px);
    }

    .book-learning-modal-shell {
        grid-template-columns: 1fr;
        width: min(800px, calc(100vw - 16px));
        max-height: calc(100vh - 20px);
    }

    .book-chat-thread {
        min-height: 320px;
        max-height: 46vh;
    }

    .manual-review-modal {
        width: min(100vw - 16px, 880px);
        min-height: auto;
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 52px 12px 12px;
        margin: 8px auto;
        border-radius: 24px;
    }

    .manual-review-modal .manual-review-meta,
    .manual-review-modal .manual-review-viewer {
        min-height: auto;
    }

    .manual-review-meta {
        padding: 18px;
        gap: 12px;
    }

    .manual-review-title {
        font-size: clamp(1.35rem, 4vw, 1.9rem);
    }

    .manual-review-card {
        padding: 14px;
    }

    .manual-review-viewer {
        min-height: 52vh;
    }

    .manual-review-modal .manual-review-frame {
        min-height: 52vh;
    }

    .floating-assistant {
        right: 14px;
        bottom: 16px;
        max-width: min(280px, calc(100vw - 20px));
    }

    .floating-assistant-bubble {
        max-width: 220px;
        font-size: 0.86rem;
    }

    .hero-robot {
        position: static;
        margin-top: 12px;
    }

    .dashboard-admin-hero {
        padding-right: 20px;
    }

    .dashboard-admin-hero .hero-robot {
        position: static;
        margin-top: 10px;
    }

    .page-hero {
        padding-right: 20px;
    }

    .page-hero .hero-robot {
        position: static;
        margin-top: 10px;
    }

    .ai-hero-minimal .ai-hero-copy {
        padding-right: 0;
    }

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

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

    .hero {
        flex-direction: column;
    }

    .topbar {
        flex-direction: column;
        align-items: flex-start;
    }

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

    .wizard-actions {
        flex-wrap: wrap;
    }

    .wizard-actions > * {
        flex: 1 1 220px;
    }
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: hsl(204 100% 98%);
        --surface: hsla(0 0% 100% / 0.96);
        --surface-strong: hsl(0 0% 100%);
        --text: hsl(218 42% 16%);
        --muted: hsl(215 18% 42%);
        --line: hsla(214 52% 24% / 0.08);
        --sidebar: hsl(212 66% 62%);
        --sidebar-line: hsla(0 0% 100% / 0.18);
        --sidebar-text: hsla(0 0% 100% / 0.88);
        --shadow-card: 0 10px 30px hsla(210 38% 26% / 0.08);
    }

    body {
        background:
            radial-gradient(circle at top left, hsla(196 95% 76% / 0.24), transparent 30%),
            radial-gradient(circle at top right, hsla(210 92% 68% / 0.12), transparent 24%),
            linear-gradient(180deg, hsl(204 100% 99%) 0%, hsl(202 78% 96%) 100%);
    }

    .content-bar,
    .workspace-card,
    .stat-card,
    .journey-panel,
    .empty-state,
    .message,
    .auth-card,
    .panel-card,
    .mini-summary,
    .insight-strip > div,
    .result-tabs a,
    .user-chip,
    .topbar {
        background: linear-gradient(180deg, hsla(0 0% 100% / 0.56), hsla(198 100% 98% / 0.44));
        border-color: var(--line);
    }

    .site-footer-inner {
        background: linear-gradient(180deg, hsla(0 0% 100% / 0.94), hsla(198 100% 98% / 0.92));
        border-color: var(--line);
    }

    .site-footer-inner p {
        color: var(--text);
    }

    .analysis-modal-main {
        background: hsl(0 0% 100%);
        color: var(--text);
    }

    .analysis-modal-main .field {
        background: hsl(198 100% 98%);
        border-color: var(--line);
    }

    .analysis-modal-main .step-panel-head h3,
    .analysis-modal-main .step-dot strong {
        color: var(--text);
    }

    .analysis-modal-main .field label,
    .analysis-modal-main .step-panel-head p:last-child,
    .analysis-modal-main .eyebrow {
        color: var(--muted);
    }

    .step-dot {
        background: hsl(0 0% 100%);
        border-color: var(--line);
    }

    .submit-button-ghost {
        background: hsla(0 0% 100% / 0.94);
        border-color: var(--line);
    }

    .field input:not([type="checkbox"]):not([type="file"]),
    .field select,
    .checkbox-field-boxed {
        background: hsl(0 0% 100%);
        border-color: var(--line);
        color: var(--text);
    }

    .workspace-card-primary,
    .stat-card-featured,
    .journey-step {
        background: linear-gradient(180deg, hsla(0 0% 100% / 0.99), hsla(196 100% 97% / 0.95));
    }

    .source-badge.is-logic,
    .employee-meta span {
        background: hsla(198 64% 86% / 0.28);
    }
}

@media (max-width: 560px) {
    .summary-grid {
        grid-template-columns: 1fr;
    }

    .ai-hero {
        padding: 24px;
    }

    .hero-title {
        max-width: none;
    }

    .launch-strip {
        flex-direction: column;
        align-items: flex-start;
    }

    .stats-row-compact {
        grid-template-columns: 1fr;
    }

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

    .line-chart-labels {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .result-tabs a {
        width: 100%;
        min-width: 0;
    }

    .stepper-head {
        grid-template-columns: 1fr;
    }

    h1 {
        max-width: none;
    }

    .page-title {
        max-width: none;
    }

    .wizard-actions {
        flex-direction: column;
    }

    .wizard-actions > * {
        width: 100%;
        flex-basis: auto;
    }

    .analysis-modal,
    .assignment-modal,
    .book-learning-modal-shell {
        width: calc(100vw - 8px);
        margin: 4px auto;
        border-radius: 20px;
        max-height: calc(100vh - 8px);
    }

    .analysis-modal-main,
    .analysis-modal-side {
        padding: 14px;
    }

    .assignment-modal-main,
    .assignment-modal-side {
        padding: 14px;
    }

    .book-learning-modal-main {
        padding: 14px;
    }

    .auth-robot-wrap {
        flex-direction: column;
    }

    .floating-assistant {
        left: 12px;
        right: 12px;
        bottom: 12px;
        align-items: center;
    }

    .manual-review-modal {
        width: calc(100vw - 8px);
        padding: 50px 8px 8px;
        border-radius: 18px;
        gap: 10px;
    }

    .manual-review-meta {
        padding: 14px;
    }

    .manual-review-actions .submit-button,
    .manual-review-actions .submit-button-ghost {
        min-height: 40px;
        font-size: 0.86rem;
    }

    .modal-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .modal-actions .submit-button,
    .modal-actions .submit-button-ghost {
        width: 100%;
        max-width: none;
        justify-content: center;
    }

    .manual-review-viewer {
        min-height: 40vh;
    }

    .manual-review-modal .manual-review-frame {
        min-height: 40vh;
        height: 40vh;
    }

    .modal-close {
        top: 10px;
        right: 10px;
        width: 36px;
        height: 36px;
    }

    .floating-assistant-bubble {
        max-width: none;
        flex: 1;
    }

    .analysis-modal-side h2,
    .assignment-modal-side h2 {
        max-width: none;
        font-size: clamp(1.4rem, 7vw, 2rem);
    }

    .analysis-modal-side p:last-of-type,
    .assignment-modal-side p:last-child {
        max-width: none;
        line-height: 1.55;
        font-size: 0.9rem;
    }

    .site-footer {
        padding-inline: 12px;
    }

    .site-footer-inner {
        padding: 14px 16px;
    }
}