@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700&family=Sora:wght@500;600;700;800&display=swap");

:root {
    --aura-bg: #08111f;
    --aura-bg-2: #0c1728;
    --aura-surface: rgba(20, 34, 53, 0.82);
    --aura-surface-strong: #142238;
    --aura-line: rgba(138, 178, 207, 0.18);
    --aura-text: #f4f8ff;
    --aura-muted: #9cb0c7;
    --aura-cyan: #35e8df;
    --aura-cyan-strong: #13c9c4;
    --aura-indigo: #7b78ff;
    --aura-gold: #f3ca7b;
    --aura-danger: #ff6f87;
    --aura-shadow: 0 22px 70px rgba(0, 0, 0, 0.28);
}

* {
    box-sizing: border-box;
    letter-spacing: 0;
}

html {
    color-scheme: dark;
    background: var(--aura-bg);
}

body {
    font-family: "Hanken Grotesk", sans-serif !important;
    color: var(--aura-text) !important;
    background:
        radial-gradient(circle at 78% 12%, rgba(53, 232, 223, 0.12), transparent 28rem),
        radial-gradient(circle at 12% 78%, rgba(123, 120, 255, 0.1), transparent 32rem),
        linear-gradient(145deg, var(--aura-bg), var(--aura-bg-2) 60%, #091525) !important;
    background-attachment: fixed !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.34;
    background-image:
        linear-gradient(rgba(77, 224, 217, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(77, 224, 217, 0.04) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(to bottom, transparent, #000 20%, #000 80%, transparent);
}

h1, h2, h3, h4, h5, h6,
.brand-name, .page-title, .cover-title, .load-brand, .section-title {
    font-family: "Sora", sans-serif !important;
    color: var(--aura-text);
}

a { color: var(--aura-cyan); }

button, input, select, textarea {
    font: inherit;
}

button, .btn, .start-btn, .btn-start, .end-btn {
    border-radius: 7px !important;
    font-weight: 700 !important;
}

.btn-primary, .start-btn, .btn-start {
    color: #031214 !important;
    border: 1px solid rgba(118, 255, 247, 0.72) !important;
    background: linear-gradient(135deg, #55f4e7, #23d1d4) !important;
    box-shadow: 0 0 0 1px rgba(52, 232, 223, 0.12), 0 12px 30px rgba(35, 209, 212, 0.2) !important;
}

.btn-primary:hover, .start-btn:hover, .btn-start:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.btn-secondary, .btn-ghost, .theme-btn, .ctrl-btn, .re-upload {
    color: var(--aura-text) !important;
    border: 1px solid var(--aura-line) !important;
    background: rgba(24, 42, 64, 0.72) !important;
}

input, select, textarea, .input-field, .job-description-input {
    color: var(--aura-text) !important;
    border: 1px solid var(--aura-line) !important;
    border-radius: 7px !important;
    background: rgba(5, 16, 30, 0.72) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}

input:focus, select:focus, textarea:focus {
    outline: none !important;
    border-color: var(--aura-cyan) !important;
    box-shadow: 0 0 0 3px rgba(53, 232, 223, 0.12) !important;
}

::placeholder { color: #7890a9 !important; }

.topbar {
    border-bottom: 1px solid var(--aura-line) !important;
    background: rgba(8, 17, 31, 0.84) !important;
    backdrop-filter: blur(18px);
}

.brand-logo {
    color: var(--aura-gold) !important;
    border: 1px solid rgba(243, 202, 123, 0.35) !important;
    background: radial-gradient(circle, rgba(243, 202, 123, 0.26), rgba(123, 120, 255, 0.12)) !important;
    box-shadow: 0 0 22px rgba(243, 202, 123, 0.18);
}

.brand-name span, .page-title span { color: var(--aura-cyan) !important; }

.card, .panel, .setup-card, .question-card, .transcript-panel,
.panel-ai, .panel-candidate, .summary-panel, .actions-bar, .cover {
    border: 1px solid var(--aura-line) !important;
    border-radius: 8px !important;
    background: linear-gradient(145deg, rgba(24, 41, 62, 0.88), rgba(11, 25, 42, 0.86)) !important;
    box-shadow: var(--aura-shadow) !important;
    backdrop-filter: blur(18px);
}

.card-header, .panel-label, .panel-ai-header, .card-footer {
    border-color: var(--aura-line) !important;
    background: rgba(7, 18, 32, 0.58) !important;
}

.type-card, .difficulty-btn, .difficulty-pill {
    color: var(--aura-muted) !important;
    border-color: var(--aura-line) !important;
    border-radius: 7px !important;
    background: rgba(17, 31, 49, 0.76) !important;
}

.type-card.selected, .difficulty-btn.selected, .difficulty-pill.selected {
    color: var(--aura-text) !important;
    border-color: rgba(53, 232, 223, 0.72) !important;
    background: rgba(23, 120, 126, 0.23) !important;
    box-shadow: inset 0 0 0 1px rgba(53, 232, 223, 0.12), 0 8px 24px rgba(0,0,0,.16) !important;
}

.upload-zone {
    border-color: rgba(53, 232, 223, 0.34) !important;
    border-radius: 8px !important;
    background: rgba(15, 36, 54, 0.7) !important;
}

.upload-zone:hover {
    border-color: var(--aura-cyan) !important;
    background: rgba(22, 78, 86, 0.25) !important;
}

.page-subtitle, .section-subtitle, .step-subtitle, .description, .cover-sub,
.footer-meta, .meta-cell label, .q-subtitle {
    color: var(--aura-muted) !important;
}

.badge, .session-badge, .header-badge, .q-badge, .rec-badge, .verdict-chip {
    color: var(--aura-cyan) !important;
    border-color: rgba(53, 232, 223, 0.26) !important;
    background: rgba(53, 232, 223, 0.09) !important;
}

.panels {
    gap: 12px !important;
    padding: 12px !important;
    background: transparent !important;
}

.panel-ai, .panel-candidate { overflow: hidden; }

.candidate-video-wrap, .ai-avatar-wrap {
    background: #06101d !important;
}

.orb-core {
    background: radial-gradient(circle at 35% 30%, #fff7cf, var(--aura-gold) 16%, #6de8e4 42%, #282a72 75%, transparent) !important;
    box-shadow: 0 0 55px rgba(53, 232, 223, 0.34) !important;
}

.ring { border-color: rgba(53, 232, 223, 0.35) !important; }

.score-band, .summary-grid, .bar-list, .question-block {
    border-color: var(--aura-line) !important;
}

.ring-fill { stroke: var(--aura-cyan) !important; }
.bar-fill { background: linear-gradient(90deg, var(--aura-indigo), var(--aura-cyan)) !important; }

/* Landing */
.aura-landing {
    display: block !important;
    min-height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden;
}

.aura-landing .container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.aura-landing .container > h1,
.aura-landing .container > .subtitle,
.aura-landing .container > .mode-selection {
    display: none !important;
}

.aura-nav {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 68px;
    padding: 0 5vw;
    border-bottom: 1px solid var(--aura-line);
    background: rgba(8, 17, 31, 0.82);
    backdrop-filter: blur(18px);
}

.aura-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--aura-text);
    text-decoration: none;
    font-family: "Sora", sans-serif;
    font-weight: 700;
}

.aura-mark {
    display: grid;
    place-items: center;
    width: 38px;
    aspect-ratio: 1;
    border: 1px solid rgba(243, 202, 123, 0.38);
    border-radius: 50%;
    color: var(--aura-gold);
    background: radial-gradient(circle, rgba(243, 202, 123, 0.25), rgba(123, 120, 255, 0.14));
    box-shadow: 0 0 24px rgba(243, 202, 123, 0.18);
}

.aura-nav-links { display: flex; align-items: center; gap: 28px; }
.aura-nav-links a { color: var(--aura-muted); text-decoration: none; font-weight: 600; }
.aura-nav-links a:hover { color: var(--aura-text); }

.aura-nav-cta, .aura-primary, .aura-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    border-radius: 7px;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.aura-nav-cta, .aura-secondary {
    color: var(--aura-text);
    border: 1px solid rgba(53, 232, 223, 0.42);
    background: rgba(53, 232, 223, 0.08);
}

.aura-primary {
    color: #031214;
    border: 1px solid rgba(118, 255, 247, 0.72);
    background: linear-gradient(135deg, #55f4e7, #23d1d4);
    box-shadow: 0 12px 30px rgba(35, 209, 212, 0.2);
}

.aura-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(480px, 1.15fr);
    align-items: center;
    gap: 5vw;
    min-height: calc(100vh - 68px);
    max-width: 1440px;
    margin: 0 auto;
    padding: 7vh 5vw 5vh;
}

.aura-kicker {
    color: var(--aura-cyan);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.aura-hero h1 {
    max-width: 720px;
    margin: 16px 0 20px;
    font-size: clamp(2.8rem, 5vw, 5.8rem);
    line-height: 1.02;
}

.aura-hero h1 span { color: var(--aura-cyan); }
.aura-hero p { max-width: 610px; color: var(--aura-muted); font-size: 1.16rem; line-height: 1.7; }
.aura-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.aura-product {
    position: relative;
    border: 1px solid rgba(53, 232, 223, 0.24);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 30px 90px rgba(0,0,0,.45), 0 0 70px rgba(53, 232, 223, 0.12);
}

.aura-product img { display: block; width: 100%; height: auto; }

.aura-proof {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 36px;
}

.aura-proof div {
    padding: 15px;
    border-left: 2px solid var(--aura-cyan);
    background: rgba(17, 32, 50, 0.5);
}

.aura-proof strong { display: block; font-family: "Sora", sans-serif; }
.aura-proof span { color: var(--aura-muted); font-size: 0.86rem; }

.aura-flow {
    max-width: 1440px;
    margin: 0 auto;
    padding: 24px 5vw 90px;
}

.aura-flow-head { max-width: 680px; margin-bottom: 28px; }
.aura-flow h2 { margin: 8px 0; font-size: clamp(2rem, 4vw, 3.7rem); }
.aura-flow-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.aura-flow-card {
    position: relative;
    min-height: 260px;
    padding: 22px;
    border: 1px solid var(--aura-line);
    border-radius: 8px;
    overflow: hidden;
    background: var(--aura-surface);
}
.aura-flow-card img { width: 100%; border-radius: 6px; margin-bottom: 18px; }
.aura-flow-card p { color: var(--aura-muted); }

/* Candidate portal */
.aura-auth-page {
    min-height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
}

.auth-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(420px, .72fr);
    gap: clamp(38px, 6vw, 96px);
    width: min(1280px, calc(100% - 64px));
    min-height: 100vh;
    margin: 0 auto;
    padding: 7vh 0 5vh;
    align-items: center;
}

.auth-story {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.auth-wordmark {
    align-self: flex-start;
    margin-bottom: clamp(42px, 7vh, 84px);
    color: #d7dcff;
    font-family: "Sora", sans-serif;
    font-size: 1.55rem;
    font-weight: 800;
    text-decoration: none;
}

.auth-story-copy { max-width: 680px; }
.auth-story-copy h1 {
    margin: 18px 0 24px;
    font-size: clamp(3rem, 4.6vw, 5rem);
    line-height: 1.03;
}
.auth-story-copy h1 span { display: block; color: var(--aura-cyan); }
.auth-story-copy p {
    max-width: 650px;
    color: #b6bfd2;
    font-size: 1.17rem;
    line-height: 1.75;
}

.auth-visual {
    --tilt-x: 0;
    --tilt-y: 0;
    --pointer-x: 50%;
    --pointer-y: 50%;
    position: relative;
    isolation: isolate;
    width: min(680px, 100%);
    aspect-ratio: 16 / 8.8;
    margin-top: 32px;
    overflow: visible;
    transform: perspective(1000px) rotateX(calc(var(--tilt-y) * -1deg)) rotateY(calc(var(--tilt-x) * 1.2deg));
    transition: transform .24s ease-out;
    animation: auth-card-float 6s ease-in-out infinite;
}
.auth-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    border: 1px solid rgba(130, 148, 185, .28);
    border-radius: 8px;
    background:
        radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(53, 232, 223, .16), transparent 32%),
        linear-gradient(120deg, rgba(5, 14, 28, .04), rgba(5, 14, 28, .42));
    pointer-events: none;
}
.auth-visual img {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
    transform: none;
    filter: saturate(1.14) contrast(1.08);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34), 0 0 40px rgba(53, 232, 223, .1);
    clip-path: inset(0 round 8px);
}

.auth-visual-glow {
    position: absolute;
    z-index: -2;
    inset: 22% 8% -32%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(53, 232, 223, .2), rgba(53, 232, 223, .04) 42%, transparent 72%);
    filter: blur(24px);
    animation: auth-glow-breathe 4.8s ease-in-out infinite;
}

.auth-orbit {
    position: absolute;
    z-index: -1;
    left: 50%;
    bottom: -42%;
    border: 1px solid rgba(53, 232, 223, .55);
    border-radius: 50%;
    transform: translateX(-50%) scale(.94);
    opacity: .55;
    animation: auth-orbit-pulse 4.2s ease-in-out infinite;
}
.auth-orbit-one { width: 52%; aspect-ratio: 1; }
.auth-orbit-two {
    width: 64%;
    aspect-ratio: 1;
    border-color: rgba(123, 120, 255, .32);
    animation-delay: -1.4s;
}
.auth-orbit-three {
    width: 76%;
    aspect-ratio: 1;
    border-color: rgba(53, 232, 223, .12);
    animation-delay: -2.8s;
}

.auth-pointer-glow {
    position: fixed;
    z-index: -1;
    top: -280px;
    left: -280px;
    width: 560px;
    height: 560px;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle, rgba(53, 232, 223, .08), transparent 68%);
    transition: transform .18s ease-out;
}

@keyframes auth-card-float {
    0%, 100% { translate: 0 0; }
    50% { translate: 0 -10px; }
}

@keyframes auth-orbit-pulse {
    0%, 100% { transform: translateX(-50%) scale(.92); opacity: .35; }
    50% { transform: translateX(-50%) scale(1.04); opacity: .7; }
}

@keyframes auth-glow-breathe {
    0%, 100% { opacity: .55; transform: scale(.92); }
    50% { opacity: 1; transform: scale(1.08); }
}

.auth-panel {
    width: 100%;
    padding: clamp(30px, 4vw, 50px);
    border: 1px solid rgba(130, 148, 185, .25);
    border-radius: 8px;
    background: rgba(24, 38, 59, .91);
    box-shadow: 0 30px 90px rgba(0,0,0,.28);
}

.auth-heading { text-align: center; margin-bottom: 28px; }
.auth-heading .section-title { margin: 0 0 8px; font-size: 1.8rem; }
.auth-heading .section-subtitle { margin: 0; font-size: 1.02rem; }

.auth-socials { display: grid; gap: 12px; }
.auth-socials button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    min-height: 56px;
    color: #dce3fa;
    border: 1px solid rgba(130, 148, 185, .25);
    border-radius: 7px;
    background: rgba(40, 54, 76, .72);
    font-weight: 700;
    cursor: default;
}
.social-mark {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    font-size: .75rem;
    font-weight: 800;
}
.google-mark { color: #dce3fa; background: #09101c; }
.linkedin-mark { color: #06101d; background: var(--aura-cyan); border-radius: 2px; }

.auth-divider {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 26px 0;
    color: #aab4cb;
    font-size: .76rem;
    font-weight: 700;
    text-transform: uppercase;
}
.auth-divider::before, .auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: rgba(130, 148, 185, .22);
}

.auth-form { display: grid; gap: 18px !important; }
.auth-form label { display: block; margin-bottom: 8px; color: #c7d0e8; font-weight: 700; }
.auth-form input { width: 100%; min-height: 58px; padding: 0 16px !important; }
.auth-label-row { display: flex; align-items: center; justify-content: space-between; }
.auth-label-row label { margin: 0; }
.auth-label-row span { color: var(--aura-cyan); font-size: .78rem; font-weight: 600; }
.auth-submit-row { display: block !important; margin-top: 8px; }
.auth-submit-row #submitBtn { width: 100%; min-height: 56px; color: #10144e !important; background: #b8b8ff !important; border-color: #ceceff !important; }
.auth-submit-row #resetBtn { display: none !important; }

.auth-switch {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 26px;
    color: #c4ccdf;
}
.auth-switch .tabs {
    display: inline-flex !important;
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
.auth-switch .tab {
    padding: 0 !important;
    color: var(--aura-cyan) !important;
    background: transparent !important;
}
.auth-switch .tab.active { display: none !important; }

.token-access {
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid rgba(130, 148, 185, .18);
    color: var(--aura-muted);
}
.token-access summary { color: #cdd5e8; cursor: pointer; text-align: center; }
.token-access p { font-size: .86rem; line-height: 1.5; }
.token-access > div { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.token-access input { min-width: 0; }

.auth-panel .dashboard.visible { display: grid !important; gap: 18px; }
.dashboard-intro h2 { margin: 8px 0 4px; }
.dashboard-intro p { color: var(--aura-muted); }

.aura-auth-page.portal-active {
    overflow: hidden;
}

html.session-restoring body::after {
    content: "Restoring your workspace...";
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    color: var(--aura-muted);
    background: #091326;
    font-family: "Hanken Grotesk", sans-serif;
    font-weight: 700;
}

html.session-restoring .auth-shell,
html.session-restoring .auth-pointer-glow {
    visibility: hidden;
}

.portal-active .auth-shell {
    display: block;
    width: 100%;
    min-height: 100vh;
    padding: 0;
}

.portal-active .auth-story,
.portal-active .auth-panel > #authArea {
    display: none !important;
}

.portal-active .auth-panel {
    width: 100%;
    min-height: 100vh;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #091326;
    box-shadow: none;
}

.portal-active .auth-panel .dashboard.visible {
    display: grid !important;
    grid-template-columns: 224px minmax(0, 1fr);
    gap: 0;
    width: 100%;
    height: 100vh;
    min-height: 100vh;
    margin: 0;
    overflow: hidden;
}

.portal-sidebar {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100vh;
    padding: 22px 14px 16px;
    border-right: 1px solid rgba(130, 148, 185, .15);
    background: #111b31;
    overflow: hidden;
}
.portal-brand { color: #d6d7ff; font-family: "Sora", sans-serif; font-size: 1.25rem; font-weight: 800; }
.portal-sidebar > div:first-child > span { display: block; margin-top: 3px; color: #8f9ab4; font-size: .78rem; }
.portal-nav, .portal-sidebar-bottom { display: grid; gap: 8px; }
.portal-nav { margin-top: 34px; }
.portal-sidebar-bottom { margin-top: auto; }
.portal-nav button, .portal-sidebar-bottom button {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 46px;
    padding: 0 14px;
    color: #aeb9cf;
    border: 0;
    border-radius: 6px;
    background: transparent;
    text-align: left;
    font-weight: 700;
}
.portal-nav button.active {
    color: var(--aura-cyan);
    border-right: 3px solid var(--aura-cyan);
    background: rgba(53, 232, 223, .1);
}
.portal-sidebar-bottom .portal-new {
    justify-content: center;
    margin-bottom: 16px;
    color: #171a65;
    background: #b8b8ff;
}

.portal-workspace {
    min-width: 0;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
}
.portal-topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 62px;
    padding: 0 28px;
    border-bottom: 1px solid rgba(130, 148, 185, .14);
    background: rgba(9, 19, 38, .94);
}
.portal-topbar strong { color: #bfc7db; font-size: .82rem; }
.portal-profile { display: flex; align-items: center; gap: 12px; color: #93a1bb; font-size: .8rem; }
.portal-profile[role="button"] { cursor: pointer; }
.portal-profile[role="button"]:hover { color: var(--aura-text); }
.portal-avatar {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(53, 232, 223, .35);
    border-radius: 50%;
    color: var(--aura-cyan);
    background: rgba(53, 232, 223, .1);
    font-weight: 800;
}

.portal-content {
    width: min(1120px, calc(100% - 36px));
    max-width: 100%;
    margin: 0 auto;
    padding: 26px 0 34px;
    overflow-x: hidden;
}
.portal-view { display: none; }
.portal-view.active { display: block; }
.portal-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}
.portal-heading h2 { margin: 0 0 8px; font-size: clamp(1.7rem, 3vw, 2.4rem); }
.portal-heading p { margin: 0; color: #b0bad0; line-height: 1.55; }
.portal-status {
    flex: 0 0 auto;
    padding: 7px 10px;
    border: 1px solid rgba(53, 232, 223, .22);
    border-radius: 999px;
    color: var(--aura-cyan);
    background: rgba(53, 232, 223, .08);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.portal-grid { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 18px; align-items: start; }
.session-config, .ai-ready-card, .quick-tips {
    border: 1px solid rgba(130, 148, 185, .17);
    border-radius: 8px;
    background: #18243a;
    box-shadow: 0 20px 50px rgba(0,0,0,.16);
}
.session-config { min-width: 0; padding: 22px; }
.session-title { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.session-title span { color: var(--aura-cyan); }
.session-title h3 { margin: 0; font-size: 1.25rem; }
.session-field { min-width: 0; margin-top: 17px; }
.session-field label {
    margin-bottom: 12px;
    color: #9ca8c0;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}
.role-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.interview-type-options { grid-template-columns: repeat(4, 1fr); }
.config-option {
    display: grid;
    place-items: center;
    gap: 9px;
    min-height: 92px;
    padding: 12px;
    color: #c4cde0;
    border: 1px solid rgba(130, 148, 185, .17);
    border-radius: 7px;
    background: #1c2940;
    font-weight: 700;
}
.config-option span { font-size: 1.2rem; color: #b9b9ff; }
.config-option small { display: block; color: #8f9ab4; font-size: .66rem; font-weight: 500; }
.config-option.selected {
    color: #fff;
    border-color: #b8b8ff;
    background: linear-gradient(145deg, rgba(184,184,255,.16), #1d2b43);
    box-shadow: inset 0 0 0 1px rgba(184,184,255,.18);
}
.session-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.segment-options, .focus-options { display: flex; flex-wrap: wrap; gap: 8px; }
.segment-options button, .focus-options button {
    min-height: 36px;
    padding: 0 17px;
    color: #aeb8cd;
    border: 1px solid transparent;
    border-radius: 7px;
    background: #0d1729;
    font-weight: 700;
}
.segment-options button.selected, .focus-options button.selected {
    color: var(--aura-cyan);
    border-color: rgba(53, 232, 223, .45);
    background: rgba(53, 232, 223, .09);
}
.portal-start {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 50px;
    margin-top: 22px;
    color: #171a65;
    border: 1px solid #d0d0ff;
    border-radius: 7px;
    background: #b8b8ff;
    box-shadow: 0 12px 25px rgba(123,120,255,.2);
    font-weight: 800;
}
.portal-start:disabled { opacity: .45; cursor: not-allowed; }
.inline-setup { display: grid; grid-template-columns: 1.35fr .65fr; gap: 14px; margin-top: 4px; }
.inline-setup input, .inline-setup select { width: 100%; min-height: 46px; }
#portalResumeStatus { margin: 8px 0 0; color: #9ca8c0; font-size: .8rem; }
#portalResumeStatus.ready { color: var(--aura-cyan); }
#portalResumeInsights { max-height: 100px; margin-top: 8px; overflow: auto; }
#portalResumeInsights p { margin: 5px 0; color: #9ca8c0; font-size: .72rem; line-height: 1.4; }
.question-label-row { display: flex; align-items: center; justify-content: space-between; }
.question-label-row strong { color: var(--aura-cyan); }
.portal-range { width: 100%; padding: 0 !important; accent-color: var(--aura-cyan); }
.jd-generator-row { display: grid; grid-template-columns: minmax(0, 1fr) 82px auto; gap: 8px; }
.jd-generator-row input, .jd-generator-row button { min-height: 40px; }
.jd-generator-row button {
    padding: 0 14px;
    color: #06151a;
    border: 0;
    border-radius: 6px;
    background: var(--aura-cyan);
    font-weight: 800;
}
.jd-generator-row button:disabled { opacity: .55; }
.jd-upload-row { display: flex; align-items: center; gap: 10px; margin-top: 8px; }
.jd-upload-row input { width: auto; max-width: 260px; min-height: 36px; }
.jd-upload-row span { color: #8f9ab4; font-size: .72rem; }
.jd-builder textarea { width: 100%; min-height: 86px; margin-top: 8px; resize: vertical; }
#portalJdStatus { min-height: 18px; margin: 5px 0 0; color: var(--aura-cyan); font-size: .72rem; }
.portal-assist { display: grid; gap: 18px; }
.ai-ready-card { padding: 22px 18px; text-align: center; border-color: rgba(53, 232, 223, .65); }
.ai-ready-icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin: 0 auto 16px;
    border-radius: 50%;
    color: var(--aura-cyan);
    background: rgba(53, 232, 223, .16);
    font-size: 1.5rem;
}
.ai-ready-card p, .quick-tips p { color: #aeb8cd; font-size: .88rem; line-height: 1.55; }
.quick-tips { padding: 18px; }
.quick-tips h3 { margin: 0 0 16px; }
.quick-tips p { margin: 12px 0; }

.dashboard-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 20px; }
.dashboard-start-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
    padding: 24px 26px;
    border: 1px solid rgba(53,232,223,.42);
    border-radius: 8px;
    background: linear-gradient(110deg, rgba(53,232,223,.14), rgba(123,120,255,.12) 62%, #18243a);
}
.dashboard-start-panel span { color: var(--aura-cyan); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.dashboard-start-panel h3 { margin: 8px 0 5px; font-size: 1.35rem; }
.dashboard-start-panel p { max-width: 700px; margin: 0; color: #aeb8cd; line-height: 1.5; }
.dashboard-start-panel button { flex: 0 0 auto; min-height: 52px; padding: 0 22px; color: #06151a; border: 0; border-radius: 7px; background: var(--aura-cyan); font-weight: 900; }
.dashboard-start-panel button span { margin-right: 6px; color: #06151a; font-size: 1.1rem; }
.dashboard-coaching { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.dashboard-insight { padding: 20px; border: 1px solid rgba(130,148,185,.17); border-radius: 8px; background: #18243a; }
.dashboard-insight.strengths { border-top-color: rgba(72,229,154,.75); }
.dashboard-insight.weaknesses { border-top-color: rgba(243,202,123,.75); }
.dashboard-insight-head { display: grid; gap: 5px; margin-bottom: 14px; }
.dashboard-insight-head span { color: var(--aura-cyan); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.dashboard-insight-head strong { font-size: 1rem; }
.dashboard-insight ul { display: grid; gap: 9px; margin: 0; padding-left: 18px; color: #b9c7d9; line-height: 1.45; }
.dashboard-metrics article, .portal-section, .written-test-card, .test-categories, .plan-grid article {
    border: 1px solid rgba(130, 148, 185, .17);
    border-radius: 8px;
    background: #18243a;
}
.dashboard-metrics article { padding: 20px; }
.dashboard-metrics span, .dashboard-metrics small { display: block; color: #9ca8c0; }
.dashboard-metrics strong { display: block; margin: 10px 0 4px; font-family: "Sora", sans-serif; font-size: 2rem; }
.portal-section { padding: 22px; margin-bottom: 20px; }
.portal-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.portal-section-head h3 { margin: 0; }
.portal-section-head button, .portal-section-head span, .portal-action-link { color: var(--aura-cyan); border: 0; background: transparent; font-weight: 700; }
.history-list { display: grid; gap: 8px; }
.history-row { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px; color: var(--aura-text); border: 1px solid rgba(130,148,185,.12); border-radius: 6px; background: #111c30; text-align: left; }
.history-row:not(:disabled) { cursor: pointer; }
.history-row:not(:disabled):hover { border-color: rgba(53,232,223,.42); background: #14243a; }
.history-row:disabled { cursor: default; opacity: .7; }
.history-row div { display: grid; gap: 4px; }
.history-row div:last-child { text-align: right; }
.history-row span, .portal-empty { color: #9ca8c0; font-size: .82rem; }
.history-record { display: flex; align-items: stretch; gap: 8px; }
.history-record .history-row { flex: 1; }
.history-delete { width: 72px; border: 1px solid rgba(255,113,128,.35); border-radius: 6px; background: #2a1826; color: #ff9eaa; font-weight: 700; cursor: pointer; }
.history-delete:hover { background: #482034; color: #fff; }
@media (max-width: 640px) { .history-delete { width: auto; padding: 0 12px; } }
.analysis-preview[hidden] { display: none; }
.analysis-preview-score { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.analysis-preview-score strong { color: var(--aura-cyan); font-size: 2rem; }
.analysis-preview-score span { color: #aeb8cd; }
.analysis-preview pre { max-height: 420px; overflow: auto; padding: 18px; color: #d9e6f6; border: 1px solid rgba(130,148,185,.16); border-radius: 6px; background: #0c1728; white-space: pre-wrap; font: inherit; line-height: 1.65; }
.analysis-preview-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.analysis-preview-actions button { min-height: 40px; padding: 0 16px; color: #06151a; border: 0; border-radius: 6px; background: var(--aura-cyan); font-weight: 800; }
.profile-form { max-width: 980px; }
.profile-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.profile-form label { display: grid; gap: 7px; color: #b9c7d9; font-weight: 700; }
.profile-form input, .profile-form textarea { width: 100%; min-height: 44px; padding: 10px 12px; }
.profile-form textarea { resize: vertical; }
.profile-form-actions { display: flex; align-items: center; gap: 16px; margin-top: 18px; }
.profile-form-actions .portal-start { width: auto; min-width: 160px; margin: 0; }
#profileStatus { color: var(--aura-cyan); }
.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.article-grid article { padding: 18px; border: 1px solid rgba(130,148,185,.14); border-radius: 7px; background: #111c30; }
.article-grid span { color: var(--aura-cyan); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.article-grid h4 { margin: 12px 0 8px; font-size: .96rem; line-height: 1.4; }
.article-grid p { color: #9ca8c0; font-size: .82rem; line-height: 1.5; }
.article-grid button { padding: 0; color: #b8b8ff; border: 0; background: transparent; font-weight: 700; }

.test-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 18px; }
.test-categories { display: grid; gap: 8px; padding: 12px; align-content: start; }
.test-categories button, #testOptions button { padding: 13px; color: #aeb8cd; border: 1px solid transparent; border-radius: 6px; background: #111c30; text-align: left; }
.test-categories button.selected, #testOptions button.selected { color: var(--aura-cyan); border-color: rgba(53,232,223,.4); background: rgba(53,232,223,.08); }
.written-test-card { padding: 28px; }
.written-test-card > span { color: var(--aura-cyan); font-size: .74rem; font-weight: 800; text-transform: uppercase; }
.written-test-card h3 { margin: 16px 0 22px; line-height: 1.45; }
#testOptions { display: grid; gap: 9px; }
#testFeedback { min-height: 24px; color: #b8b8ff; }

.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.plan-grid article { padding: 24px; }
.plan-grid article.featured { border-color: rgba(53,232,223,.55); }
.plan-grid span { color: var(--aura-cyan); font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.plan-grid h3 { margin: 14px 0 8px; font-size: 1.65rem; }
.plan-grid p, .plan-grid li { color: #9ca8c0; line-height: 1.55; }
.plan-grid ul { min-height: 130px; padding-left: 18px; }
.plan-grid button { width: 100%; min-height: 42px; color: #171a65; border: 0; border-radius: 6px; background: #b8b8ff; font-weight: 800; }

@media (max-width: 1050px) {
    .portal-active .auth-panel .dashboard.visible { grid-template-columns: 84px minmax(0, 1fr); }
    .portal-brand, .portal-sidebar > div:first-child > span, .portal-nav button, .portal-sidebar-bottom button { font-size: 0; }
    .portal-nav button, .portal-sidebar-bottom button { justify-content: center; padding: 0; }
    .portal-nav button span, .portal-sidebar-bottom button span { font-size: 1rem; }
    .portal-sidebar-bottom .portal-new { font-size: 0; }
    .portal-sidebar-bottom .portal-new::after { content: "+"; font-size: 1.25rem; }
}

@media (max-height: 950px) and (min-width: 821px) {
    .portal-topbar { min-height: 52px; }
    .portal-content { padding-top: 18px; padding-bottom: 24px; }
    .portal-heading { margin-bottom: 14px; }
    .portal-heading h2 { margin-bottom: 4px; font-size: 1.75rem; }
    .portal-heading p { font-size: .88rem; }
    .session-config { padding: 18px; }
    .session-title { margin-bottom: 12px; }
    .session-title h3 { font-size: 1.08rem; }
    .session-field { margin-top: 12px; }
    .session-field label { margin-bottom: 8px; font-size: .65rem; }
    .config-option { min-height: 72px; gap: 5px; padding: 8px; font-size: .82rem; }
    .config-option span { font-size: 1rem; }
    .segment-options button, .focus-options button { min-height: 31px; padding: 0 13px; font-size: .78rem; }
    .inline-setup input, .inline-setup select { min-height: 38px; font-size: .82rem; }
    .jd-generator-row input, .jd-generator-row button { min-height: 34px; font-size: .76rem; }
    .jd-builder textarea { min-height: 62px; }
    .jd-upload-row input { min-height: 30px; font-size: .7rem; }
    #portalResumeStatus { margin-top: 4px; font-size: .7rem; }
    .portal-start { min-height: 42px; margin-top: 14px; font-size: .82rem; }
    .ai-ready-card { padding: 16px; }
    .ai-ready-icon { width: 42px; height: 42px; margin-bottom: 10px; }
    .ai-ready-card h3, .quick-tips h3 { font-size: .98rem; }
    .ai-ready-card p, .quick-tips p { font-size: .75rem; line-height: 1.4; }
    .quick-tips { padding: 15px; }
    .quick-tips p { margin: 8px 0; }
}

@media (max-width: 820px) {
    .aura-auth-page.portal-active { overflow: auto; }
    .portal-active .auth-panel .dashboard.visible { grid-template-columns: 1fr; }
    .portal-sidebar { display: none; }
    .portal-grid { grid-template-columns: 1fr; }
    .portal-content { width: min(100% - 28px, 680px); padding-top: 24px; }
    .portal-topbar { padding: 0 16px; }
    .dashboard-metrics, .dashboard-coaching, .article-grid, .plan-grid { grid-template-columns: 1fr; }
    .dashboard-start-panel { align-items: stretch; flex-direction: column; }
    .dashboard-start-panel button { width: 100%; }
    .test-layout { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .role-options, .session-split, .interview-type-options { grid-template-columns: 1fr; }
    .config-option { min-height: 76px; grid-template-columns: auto 1fr; justify-items: start; }
    .session-config { padding: 20px; }
    .inline-setup { grid-template-columns: 1fr; }
    .jd-generator-row { grid-template-columns: 1fr; }
    .jd-upload-row { display: grid; }
    .portal-heading { display: block; }
    .portal-status { display: inline-block; margin-top: 14px; }
}

.shell {
    display: grid !important;
    grid-template-columns: minmax(0, 1.1fr) minmax(390px, 0.72fr) !important;
    gap: 18px !important;
    width: min(1240px, calc(100% - 36px)) !important;
    min-height: calc(100vh - 36px) !important;
    margin: 18px auto !important;
    padding: 0 !important;
}

.shell > .hero {
    position: relative;
    display: flex !important;
    align-items: flex-end;
    min-height: 680px;
    padding: 42px !important;
    border: 1px solid var(--aura-line);
    border-radius: 8px !important;
    overflow: hidden;
    background:
        linear-gradient(to top, rgba(5, 13, 25, .98), rgba(5, 13, 25, .2) 68%),
        url("assets/aura/live-interview.png") center/cover no-repeat !important;
    box-shadow: var(--aura-shadow);
}

.shell > .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(8,17,31,.35), transparent 62%);
    pointer-events: none;
}

.shell > .hero > * { position: relative; z-index: 1; }
.hero h1 { font-size: clamp(2.5rem, 5vw, 5rem) !important; line-height: 1.02 !important; }
.hero .eyebrow { color: var(--aura-cyan) !important; }
.feature-grid { grid-template-columns: repeat(2, 1fr) !important; }
.feature {
    border: 1px solid var(--aura-line) !important;
    border-radius: 7px !important;
    background: rgba(8, 20, 35, .76) !important;
    backdrop-filter: blur(12px);
}

.shell > .panel {
    align-self: stretch;
    padding: 28px !important;
    border-radius: 8px !important;
}

.tabs {
    gap: 4px !important;
    padding: 4px !important;
    border: 1px solid var(--aura-line);
    border-radius: 7px !important;
    background: rgba(5, 16, 30, .7) !important;
}

.tab { border-radius: 5px !important; color: var(--aura-muted) !important; }
.tab.active { color: var(--aura-text) !important; background: rgba(53, 232, 223, .12) !important; }
.dashboard-list li { border-color: var(--aura-line) !important; color: var(--aura-muted) !important; }
.status { border-radius: 7px !important; }

/* Setup workspace */
.page {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 18px !important;
}

.page-header {
    padding: 42px 4px 24px !important;
}

.page-title { font-size: clamp(2.1rem, 4vw, 4rem) !important; }
.grid-2 { gap: 14px !important; }
.card { padding: 22px !important; }
.card-label-icon { border-radius: 6px !important; background: rgba(53, 232, 223, .1) !important; }
.slider { accent-color: var(--aura-cyan); }

/* Reports */
.report-workspace-bar {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 50;
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    border-bottom: 1px solid var(--aura-line);
    background: rgba(8, 17, 31, .94);
    backdrop-filter: blur(16px);
}
.report-workspace-bar strong { min-width: 0; margin-right: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-icon-btn, .report-rename-btn {
    min-height: 38px;
    padding: 0 13px;
    color: var(--aura-text);
    border: 1px solid var(--aura-line);
    background: #15243a;
}
.report-icon-btn { width: 40px; padding: 0; font-size: 1.15rem; }
.report-library {
    position: fixed;
    inset: 58px auto 0 0;
    z-index: 40;
    width: 280px;
    padding: 16px 12px;
    overflow: auto;
    border-right: 1px solid var(--aura-line);
    background: rgba(10, 22, 38, .97);
    transition: transform .22s ease;
}
.report-library-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px 14px; }
.report-library-head span { color: var(--aura-cyan); }
.report-library-list { display: grid; gap: 7px; }
.report-library-list > span { padding: 10px; color: var(--aura-muted); }
.report-library-item { display: grid; gap: 5px; width: 100%; padding: 12px; color: var(--aura-text); border: 1px solid var(--aura-line); border-radius: 6px; background: #111d31; text-align: left; }
.report-library-item span { color: var(--aura-muted); font-size: .76rem; }
.report-library-item:hover, .report-library-item.active { border-color: rgba(53, 232, 223, .55); background: rgba(53, 232, 223, .09); }
.report-context-menu {
    position: fixed;
    z-index: 80;
    min-width: 170px;
    padding: 5px;
    border: 1px solid var(--aura-line);
    border-radius: 6px;
    background: #15243a;
    box-shadow: 0 18px 45px rgba(0,0,0,.4);
}
.report-context-menu[hidden] { display: none; }
.report-context-menu button { width: 100%; min-height: 36px; padding: 0 11px; color: var(--aura-text); border: 0; background: transparent; text-align: left; }
.report-context-menu button:hover { color: var(--aura-cyan); background: rgba(53,232,223,.09); }
body:has(.report-library) .page { margin-left: max(300px, calc((100vw - 1320px) / 2 + 280px)) !important; margin-top: 70px !important; }
body.report-library-collapsed .report-library { transform: translateX(-100%); }
body.report-library-collapsed .page { margin-left: auto !important; margin-right: auto !important; }
.page {
    --surface: #15243a;
    --surface2: #101d30;
    --border: rgba(151, 181, 211, .22);
    --text: #f4f8ff;
    --text2: #c3d1e2;
    --text3: #9fb0c5;
    --brand: #35e8df;
    --green: #48e59a;
    --green-bg: rgba(32, 165, 105, .1);
    --green-border: rgba(72, 229, 154, .28);
    --red: #ff788d;
    --red-bg: rgba(255, 111, 135, .1);
    --red-border: rgba(255, 120, 141, .28);
    --amber: #f3ca7b;
    --amber-bg: rgba(243, 202, 123, .1);
    --amber-border: rgba(243, 202, 123, .28);
}
.page .card-body, .page .score-info p, .page .summary-panel li, .page .bar-label, .page .question-text, .page .answer-text, .page .feedback-text { color: var(--text2) !important; }
.page .card-title, .page .score-info h3, .page .ring-number, .page .question-title { color: var(--text) !important; }
.page .summary-panel { background: rgba(14, 29, 47, .82) !important; }
.cover {
    min-height: auto !important;
    background:
        linear-gradient(135deg, rgba(18, 36, 56, .96), rgba(8, 21, 37, .95)),
        url("assets/aura/analysis.png") center/cover !important;
}

.cover-badge, .card-eyebrow { color: var(--aura-cyan) !important; }
.cover-title span { color: var(--aura-cyan) !important; }
.footer-brand { color: var(--aura-cyan) !important; }

@media (max-width: 920px) {
    .report-library { width: min(86vw, 300px); box-shadow: 20px 0 50px rgba(0,0,0,.35); }
    body:has(.report-library) .page { margin-left: auto !important; margin-top: 68px !important; }
    body:not(.report-library-collapsed):has(.report-library)::after { content: ""; position: fixed; inset: 58px 0 0; z-index: 35; background: rgba(1,7,15,.62); }
    .profile-form-grid { grid-template-columns: 1fr; }
    .auth-shell { grid-template-columns: 1fr; width: min(680px, calc(100% - 32px)); gap: 26px; padding: 28px 0; }
    .auth-wordmark { margin-bottom: 44px; }
    .auth-story-copy h1 { font-size: clamp(2.7rem, 12vw, 4.5rem); }
    .auth-panel { padding: 28px 22px; }
    .shell { grid-template-columns: 1fr !important; }
    .shell > .hero { min-height: 520px; }
    .grid-2 { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
    .auth-visual, .auth-orbit, .auth-visual-glow {
        animation: none !important;
        transform: none !important;
        translate: none !important;
    }
    .auth-pointer-glow { display: none; }
}

@media (max-width: 1050px) {
    .aura-hero { grid-template-columns: 1fr; padding-top: 70px; }
    .aura-product { max-width: 900px; }
    .aura-flow-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .aura-nav-links a:not(.aura-nav-cta) { display: none; }
    .aura-nav { padding: 0 18px; }
    .aura-hero { min-height: auto; padding: 54px 18px 36px; }
    .aura-hero h1 { font-size: 2.65rem; }
    .aura-proof { grid-template-columns: 1fr; }
    .aura-flow { padding-inline: 18px; }
    .aura-actions > * { width: 100%; }
}

/* Candidate analysis record actions. Kept at the end to override legacy portal button styles. */
.analysis-history .history-record { display: flex !important; align-items: stretch; gap: 8px; min-width: 0; }
.analysis-history .history-record .history-row { flex: 1 1 auto; min-width: 0; }
.analysis-history .history-delete { position: relative; flex: 0 0 42px; width: 42px; min-height: 42px; padding: 0; border: 1px solid rgba(255,113,128,.38); border-radius: 6px; background: #2a1826; color: #ff9eaa; font-size: 18px; line-height: 1; cursor: pointer; }
.analysis-history .history-delete:hover, .analysis-history .history-delete:focus-visible { background: #482034; border-color: #ff8393; color: #fff; outline: none; }
.analysis-history .history-delete::after { content: attr(data-tooltip); position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 20; width: max-content; max-width: 180px; padding: 7px 9px; border: 1px solid #3a506f; border-radius: 5px; background: #071325; color: #f3f6fb; font-size: 12px; font-weight: 700; line-height: 1.2; opacity: 0; pointer-events: none; transform: translateY(3px); transition: opacity .15s ease, transform .15s ease; }
.analysis-history .history-delete:hover::after, .analysis-history .history-delete:focus-visible::after { opacity: 1; transform: translateY(0); }
@media (max-width: 640px) { .analysis-history .history-delete { flex-basis: 38px; width: 38px; } }

.dashboard-insight-head { position: relative; padding-right: 34px; }
.dashboard-insight-head .insight-reset { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid rgba(53,232,223,.32); border-radius: 5px; background: #10263a; color: #35e8df; font-size: 16px; cursor: pointer; }
.dashboard-insight-head .insight-reset:hover, .dashboard-insight-head .insight-reset:focus-visible { border-color: #35e8df; background: #174454; outline: none; }

.history-type { color: #35e8df !important; font-size: .7rem !important; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.history-rename { position: relative; flex: 0 0 42px; width: 42px; min-height: 42px; padding: 0; border: 1px solid rgba(181,177,255,.4); border-radius: 6px; background: #1d1d43; color: #c6c3ff; font-size: 17px; line-height: 1; cursor: pointer; }
.history-rename:hover, .history-rename:focus-visible { border-color: #b5b1ff; background: #302b68; color: #fff; outline: none; }
.history-rename::after { content: attr(data-tooltip); position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 20; width: max-content; padding: 7px 9px; border: 1px solid #3a506f; border-radius: 5px; background: #071325; color: #f3f6fb; font-size: 12px; font-weight: 700; line-height: 1.2; opacity: 0; pointer-events: none; transform: translateY(3px); transition: opacity .15s ease, transform .15s ease; }
.history-rename:hover::after, .history-rename:focus-visible::after { opacity: 1; transform: translateY(0); }

.portal-modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; background: rgba(2,9,20,.72); }
.portal-modal-backdrop[hidden], .portal-toast[hidden] { display: none; }
.portal-modal { position: relative; width: min(460px, 100%); padding: 28px; border: 1px solid #344c6c; border-radius: 8px; background: #14233a; box-shadow: 0 24px 70px rgba(0,0,0,.45); }
.portal-modal h2 { margin: 0 36px 10px 0; color: #f5f8ff; font-size: 1.3rem; }
.portal-modal p { margin: 0; color: #b7c8df; line-height: 1.55; }
.portal-modal input { width: 100%; margin-top: 20px; border: 1px solid #3a5274; border-radius: 6px; background: #09172a; color: #fff; padding: 12px; }
.portal-modal-close { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; border: 0; border-radius: 5px; background: transparent; color: #abc1df; font-size: 24px; line-height: 1; cursor: pointer; }
.portal-modal-close:hover, .portal-modal-close:focus-visible { background: #243955; color: #fff; outline: none; }
.portal-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.portal-modal-actions button { min-width: 104px; border-radius: 6px; padding: 10px 14px; font-weight: 800; cursor: pointer; }
.portal-modal-cancel { border: 1px solid #3a506f; background: transparent; color: #d7e3f4; }
.portal-modal-confirm { border: 1px solid #b5b1ff; background: #b5b1ff; color: #08152a; }
.portal-modal-confirm.danger { border-color: #ef6878; background: #c64050; color: #fff; }
.portal-toast { position: fixed; right: 24px; bottom: 24px; z-index: 110; max-width: min(380px, calc(100vw - 48px)); padding: 14px 18px; border: 1px solid #2e8b98; border-radius: 6px; background: #12303d; color: #e9fbff; box-shadow: 0 14px 38px rgba(0,0,0,.35); font-weight: 700; }
.portal-toast[data-tone="error"] { border-color: #d95568; background: #3a1c2a; color: #ffdce1; }
@media (max-width: 640px) { .portal-modal { padding: 22px; } .portal-toast { right: 16px; bottom: 16px; max-width: calc(100vw - 32px); } }
