/* ========================================================================
   ResumeMatch Pro design system

   Shared visual primitives for the authenticated UI redesign. Page-specific
   templates should consume these tokens and components instead of introducing
   new one-off colors, shadows, spacing, or button treatments.
   ======================================================================== */

:root {
    /* Brand */
    --rm-navy-950: #171a2d;
    --rm-navy-900: #1f2943;
    --rm-navy-800: #294b70;
    --rm-navy-50: #f2f5f8;
    --rm-blue-800: #20557f;
    --rm-blue-700: #286ca7;
    --rm-blue-600: #2e75b6;
    --rm-blue-500: #4a91c5;
    --rm-blue-300: #9fc8e5;
    --rm-blue-200: #c5deef;
    --rm-blue-100: #dcecf8;
    --rm-blue-50: #f1f7fc;
    --rm-amber-600: #d99200;
    --rm-amber-700: #a96f00;
    --rm-amber-500: #f0a500;
    --rm-amber-300: #f5cf77;
    --rm-amber-100: #fff0c9;
    --rm-amber-50: #fff9eb;

    /* Neutral surfaces */
    --rm-ink: #172437;
    --rm-text: #465466;
    --rm-muted: #67758a;
    --rm-subtle: #8995a7;
    --rm-canvas: #f2f5f9;
    --rm-surface: #ffffff;
    --rm-surface-raised: #ffffff;
    --rm-surface-soft: #f7f9fc;
    --rm-border: #d8e0e9;
    --rm-border-strong: #bdc9d6;

    /* Feedback */
    --rm-success: #237a57;
    --rm-success-soft: #e8f6ef;
    --rm-warning: #9a6500;
    --rm-warning-soft: #fff4d8;
    --rm-danger: #b23a3a;
    --rm-danger-soft: #fdecec;
    --rm-info: var(--rm-blue-700);
    --rm-info-soft: var(--rm-blue-50);

    /* Typography */
    --rm-font-sans: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI",
        sans-serif;
    --rm-font-display: "DM Serif Display", Georgia, serif;
    --rm-text-xs: 0.75rem;
    --rm-text-sm: 0.875rem;
    --rm-text-base: 1rem;
    --rm-text-lg: 1.125rem;
    --rm-text-xl: 1.375rem;
    --rm-text-2xl: clamp(1.75rem, 3vw, 2.35rem);
    --rm-page-title-size: clamp(1.5rem, 2vw, 1.9rem);
    --rm-page-subtitle-size: 0.82rem;
    --rm-section-title-size: 1.05rem;
    --rm-card-body-size: 0.84rem;
    --rm-metric-size: 1.25rem;
    --rm-leading-tight: 1.2;
    --rm-leading-normal: 1.55;

    /* Spacing */
    --rm-space-1: 0.25rem;
    --rm-space-2: 0.5rem;
    --rm-space-3: 0.75rem;
    --rm-space-4: 1rem;
    --rm-space-5: 1.25rem;
    --rm-space-6: 1.5rem;
    --rm-space-8: 2rem;
    --rm-space-10: 2.5rem;
    --rm-space-12: 3rem;

    /* Shape and elevation */
    --rm-radius-sm: 0.5rem;
    --rm-radius-md: 0.75rem;
    --rm-radius-lg: 1rem;
    --rm-radius-xl: 1.375rem;
    --rm-radius-pill: 999px;
    --rm-shadow-sm: 0 1px 2px rgba(16, 35, 63, 0.05);
    --rm-shadow-md: 0 10px 30px rgba(16, 35, 63, 0.08);
    --rm-shadow-lg: 0 20px 55px rgba(16, 35, 63, 0.12);
    --rm-focus-ring: 0 0 0 3px rgba(51, 126, 184, 0.24);

    /* Layout */
    --rm-sidebar-width: 248px;
    --rm-content-max: 1180px;
    --rm-page-gutter: clamp(1rem, 3vw, 2.5rem);
    --rm-control-height: 44px;
    --rm-transition: 160ms ease;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body.has-sidebar {
    color: var(--rm-text);
    background: var(--rm-canvas);
    font-family: var(--rm-font-sans);
    line-height: var(--rm-leading-normal);
}

/* ------------------------------------------------------------------------
   Authenticated application shell
   ------------------------------------------------------------------------ */

.has-sidebar .app-sidebar {
    width: var(--rm-sidebar-width);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    background:
        radial-gradient(circle at 22% 0, rgba(46, 117, 182, 0.22), transparent 250px),
        var(--rm-navy-950);
    color: #ffffff;
    box-shadow: 8px 0 30px rgba(23, 26, 45, 0.12);
}

.has-sidebar .app-main {
    margin-left: var(--rm-sidebar-width);
}

/* ---- Collapsible sidebar (desktop): icon-only strip ----
   Higher specificity than `body.has-sidebar { --rm-sidebar-width: 276px }`
   defined later, so the collapsed width actually wins. */
body.has-sidebar.sidebar-collapsed {
    --rm-sidebar-width: 72px;
}

.sidebar-collapse-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--rm-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--rm-navy-800);
    cursor: pointer;
}

.sidebar-collapse-toggle:hover {
    background: var(--rm-navy-50);
}

body.sidebar-collapsed .sidebar-collapse-toggle i {
    transform: rotate(180deg);
}

/* When collapsed, hide the text and keep the icons, centered. */
body.sidebar-collapsed .sb-logo-text,
body.sidebar-collapsed .sb-brand-copy,
body.sidebar-collapsed .sb-section,
body.sidebar-collapsed .sb-user-info,
body.sidebar-collapsed .sb-notif {
    display: none;
}

body.sidebar-collapsed .sb-logo,
body.sidebar-collapsed .sb-user {
    justify-content: center;
    gap: 0;
}

body.sidebar-collapsed .sb-item {
    justify-content: center;
    gap: 0;
    padding-left: 0;
    padding-right: 0;
    font-size: 0;
}

body.sidebar-collapsed .sb-item i {
    font-size: 1.15rem;
}

@media (max-width: 768px) {
    /* The mobile drawer uses the hamburger, not the collapse toggle. */
    .sidebar-collapse-toggle {
        display: none;
    }
}

.has-sidebar .sb-logo {
    min-height: 92px;
    display: flex;
    align-items: center;
    gap: var(--rm-space-3);
    padding: var(--rm-space-5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: #ffffff;
    text-decoration: none;
}

.has-sidebar .sb-brand-mark {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50% 50% 46% 54%;
    border: 1px solid rgba(240, 165, 0, 0.55);
    background: rgba(240, 165, 0, 0.14);
    color: var(--rm-amber-500);
    font-size: 0.9rem;
    transform: rotate(-4deg);
}

.has-sidebar.region-us .sb-brand-mark {
    border-radius: var(--rm-radius-sm);
    background: var(--rm-blue-700);
    color: #ffffff;
    transform: rotate(0);
}

.has-sidebar .sb-brand-copy {
    min-width: 0;
}

.has-sidebar .sb-logo-text {
    color: #ffffff;
    font-size: 1.02rem;
    line-height: 1.1;
}

.has-sidebar .sb-logo-text span {
    color: var(--rm-amber-600);
}

.has-sidebar.region-us .sb-logo-text span {
    color: #8fc5e8;
}

.has-sidebar .sb-region-label {
    display: block;
    margin-top: var(--rm-space-1);
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.has-sidebar .sb-credit-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-3);
    margin: var(--rm-space-4) var(--rm-space-4) 0;
    padding: var(--rm-space-3);
    border: 1px solid rgba(240, 165, 0, 0.42);
    border-radius: var(--rm-radius-md);
    background: rgba(240, 165, 0, 0.1);
    color: #ffffff;
    text-decoration: none;
    transition:
        border-color var(--rm-transition),
        transform var(--rm-transition);
}

.has-sidebar .sb-credit-card:hover {
    border-color: var(--rm-amber-500);
    color: #ffffff;
    transform: translateY(-1px);
}

.has-sidebar .sb-credit-card > span {
    display: grid;
    gap: 1px;
}

.has-sidebar .sb-credit-card strong {
    color: var(--rm-amber-500);
    font-family: var(--rm-font-display);
    font-size: 1.2rem;
    font-weight: 400;
}

.has-sidebar .sb-credit-label {
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.has-sidebar .sb-credit-card i {
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
}

.has-sidebar .sb-nav {
    padding: var(--rm-space-3);
}

.has-sidebar .sb-section {
    padding: var(--rm-space-5) var(--rm-space-3) var(--rm-space-2);
    color: rgba(255, 255, 255, 0.38);
    font-size: 0.62rem;
    letter-spacing: 0.12em;
}

.has-sidebar .sb-item {
    position: relative;
    gap: var(--rm-space-3);
    margin-bottom: 2px;
    padding: 0.65rem var(--rm-space-3);
    border: 0;
    border-radius: var(--rm-radius-md);
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.82rem;
    font-weight: 600;
}

.has-sidebar .sb-item:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.has-sidebar .sb-item.active {
    border: 0;
    background: rgba(240, 165, 0, 0.16);
    color: #ffffff;
}

.has-sidebar.region-us .sb-item.active {
    background: rgba(46, 117, 182, 0.28);
    color: #ffffff;
}

.has-sidebar .sb-item.active::before {
    position: absolute;
    inset: 9px auto 9px 0;
    width: 3px;
    border-radius: var(--rm-radius-pill);
    background: var(--rm-amber-600);
    content: "";
}

.has-sidebar .sb-item.active i {
    color: var(--rm-amber-500);
}

.has-sidebar.region-us .sb-item.active::before {
    background: var(--rm-blue-700);
}

.has-sidebar .sb-item i {
    color: #8fc5e8;
    font-size: 1.05rem;
}

.has-sidebar .sb-item-count {
    min-width: 20px;
    margin-left: auto;
    padding: 1px 5px;
    border-radius: var(--rm-radius-pill);
    background: var(--rm-danger);
    color: #ffffff;
    font-size: 0.65rem;
    text-align: center;
}

.has-sidebar .sb-item--admin {
    color: var(--rm-warning);
}

.has-sidebar .sb-bottom {
    padding: var(--rm-space-4);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(0, 0, 0, 0.08);
}

.has-sidebar .sb-avatar {
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
}

.has-sidebar .sb-user-name {
    color: #ffffff;
}

.has-sidebar .sb-user-plan,
.has-sidebar .sb-notif {
    color: rgba(255, 255, 255, 0.55);
}

.has-sidebar .sb-notif:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.has-sidebar .sb-notif-dot {
    background: var(--rm-amber-500);
    border-color: var(--rm-navy-950);
}

.has-sidebar .app-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
    margin-top: auto;
    padding: var(--rm-space-5) var(--rm-page-gutter);
    border-top: 1px solid var(--rm-border);
    background: var(--rm-surface-soft);
    flex-wrap: wrap;
}

.has-sidebar .app-footer-brand {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-sm);
}

.has-sidebar .app-footer-brand span {
    color: var(--rm-amber-600);
}

.has-sidebar .app-footer-links {
    display: flex;
    gap: var(--rm-space-5);
    flex-wrap: wrap;
}

.has-sidebar .app-footer a,
.has-sidebar .app-footer-copy {
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
    text-decoration: none;
}

.has-sidebar .app-footer a:hover {
    color: var(--rm-blue-700);
}

/* ------------------------------------------------------------------------
   Dashboard — light regional workspace
   ------------------------------------------------------------------------ */

.has-sidebar .page-wrap {
    width: min(100%, var(--rm-content-max));
    max-width: var(--rm-content-max);
    margin-inline: auto;
    padding: var(--rm-space-8) var(--rm-page-gutter) var(--rm-space-12);
}

.dash-regional-hero {
    position: relative;
    min-height: 250px;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(260px, 0.7fr);
    align-items: stretch;
    margin-bottom: var(--rm-space-5);
    overflow: hidden;
    border: 1px solid #c2d9ea;
    border-radius: var(--rm-radius-xl);
    background:
        radial-gradient(circle at 83% 14%, rgba(255, 255, 255, 0.82), transparent 26%),
        linear-gradient(122deg, #ffffff 0%, #f5f9fc 50%, #dbeefa 100%);
    box-shadow: 0 14px 38px rgba(23, 26, 45, 0.1);
}

.region-us .dash-regional-hero {
    background:
        radial-gradient(circle at 84% 18%, rgba(51, 126, 184, 0.2), transparent 28%),
        linear-gradient(125deg, #fffdf8 0%, #f2f5f8 58%, #e5eff8 100%);
}

.dash-regional-copy {
    position: relative;
    z-index: 2;
    padding: clamp(1.5rem, 4vw, 2.75rem);
}

.dash-regional-copy h1 {
    max-width: 620px;
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 400;
    line-height: 1.03;
    letter-spacing: -0.025em;
}

.dash-regional-copy > p:not(.ui-page-kicker) {
    max-width: 590px;
    margin: var(--rm-space-3) 0 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
}

.dash-regional-actions {
    display: flex;
    gap: var(--rm-space-3);
    margin-top: var(--rm-space-6);
    flex-wrap: wrap;
}

.dash-regional-art {
    position: relative;
    min-height: 250px;
}

.regional-skyline {
    position: absolute;
    right: -8px;
    bottom: -2px;
    width: min(540px, 118%);
    height: auto;
    opacity: 0.94;
    filter: drop-shadow(0 12px 18px rgba(46, 117, 182, 0.1));
}

.regional-sun {
    position: absolute;
    top: 34px;
    right: 42px;
    width: 82px;
    height: 82px;
    border-radius: 50%;
    background: rgba(237, 169, 31, 0.24);
}

.region-us .regional-sun {
    background: rgba(51, 126, 184, 0.18);
}

.regional-ground {
    position: absolute;
    right: -20px;
    bottom: 0;
    left: 0;
    height: 35px;
    border-radius: 70% 0 0;
    background: rgba(33, 71, 111, 0.12);
}

.regional-building {
    position: absolute;
    bottom: 25px;
    width: 38px;
    border: 2px solid rgba(33, 71, 111, 0.26);
    border-bottom: 0;
    background: rgba(255, 255, 255, 0.25);
}

.regional-building::after {
    position: absolute;
    inset: 9px 7px;
    background: repeating-linear-gradient(
        180deg,
        rgba(40, 105, 159, 0.18) 0 2px,
        transparent 2px 9px
    );
    content: "";
}

.regional-building--one {
    right: 25px;
    height: 112px;
}

.regional-building--two {
    right: 72px;
    width: 48px;
    height: 82px;
}

.regional-building--three {
    right: 130px;
    width: 34px;
    height: 64px;
}

.regional-landmark {
    position: absolute;
    right: 175px;
    bottom: 25px;
    width: 7px;
    height: 166px;
    border-radius: 5px 5px 0 0;
    background: var(--rm-navy-800);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.regional-landmark::before {
    position: absolute;
    top: 38px;
    left: 50%;
    width: 38px;
    height: 14px;
    border-radius: 50%;
    background: var(--rm-amber-500);
    box-shadow: 0 5px 0 -1px var(--rm-navy-800);
    content: "";
    transform: translateX(-50%);
}

.regional-landmark::after {
    position: absolute;
    top: -25px;
    left: 3px;
    width: 1px;
    height: 28px;
    background: var(--rm-navy-800);
    content: "";
}

.region-us .regional-landmark {
    width: 26px;
    height: 118px;
    border-radius: 10px 10px 0 0;
    background: var(--rm-blue-700);
}

.region-us .regional-landmark::before {
    top: -22px;
    width: 18px;
    height: 28px;
    border-radius: 50% 50% 20% 20%;
    background: var(--rm-blue-700);
    box-shadow: none;
}

.region-us .regional-landmark::after {
    top: -43px;
    left: 20px;
    width: 3px;
    height: 30px;
    border-radius: 2px;
    background: var(--rm-amber-500);
    transform: rotate(28deg);
    transform-origin: bottom;
}

.has-sidebar .dash-announcement {
    border: 1px solid var(--rm-amber-300);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-amber-50);
    box-shadow: none;
}

.has-sidebar .dash-slide-headline {
    color: var(--rm-navy-950);
}

.has-sidebar .dash-slide-sub {
    color: var(--rm-muted);
}

.has-sidebar .dash-hl,
.has-sidebar .dash-slide-link {
    color: var(--rm-amber-600);
}

.has-sidebar .dash-step,
.has-sidebar .dash-docs-card,
.has-sidebar .dash-stat-card,
.has-sidebar .dash-li-card {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-sm);
}

.has-sidebar .dash-step:hover {
    border-color: var(--rm-blue-100);
    box-shadow: var(--rm-shadow-md);
}

.has-sidebar .dash-step.step-done {
    border-color: var(--rm-blue-100);
    background: var(--rm-blue-50);
}

.has-sidebar .dash-step.step-active {
    border-color: var(--rm-amber-300);
    background: var(--rm-amber-50);
}

.has-sidebar .dash-score-card {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-xl);
    background:
        radial-gradient(circle at 5% 10%, rgba(51, 126, 184, 0.1), transparent 30%),
        var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-md);
}

.has-sidebar .dash-score-num,
.has-sidebar .dash-score-title {
    color: var(--rm-navy-950);
}

.has-sidebar .dash-score-q {
    color: var(--rm-border-strong);
}

.has-sidebar .dash-score-eyebrow {
    color: var(--rm-blue-700);
    font-weight: 700;
}

.has-sidebar .dash-score-no-title {
    color: var(--rm-muted);
}

.has-sidebar .dash-score-hint {
    color: var(--rm-muted);
}

.has-sidebar .dash-score-cta {
    color: var(--rm-blue-700);
    font-weight: 700;
}

/* ------------------------------------------------------------------------
   Resume upload and library
   ------------------------------------------------------------------------ */

.upload-library {
    margin-bottom: var(--rm-space-5);
}

.upload-resume-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--rm-space-4);
    padding: var(--rm-space-4) 0;
    border-bottom: 1px solid var(--rm-border);
}

.upload-resume-row:last-of-type {
    border-bottom: 0;
}

.upload-resume-icon,
.enrich-resume-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
    font-size: 1.25rem;
}

.upload-resume-info {
    min-width: 0;
}

.upload-resume-info h3 {
    overflow: hidden;
    margin: 0 0 var(--rm-space-2);
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.upload-resume-meta {
    display: flex;
    align-items: center;
    gap: var(--rm-space-2);
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
    flex-wrap: wrap;
}

.upload-resume-status {
    display: inline-flex;
    align-items: center;
    gap: var(--rm-space-1);
    font-weight: 700;
}

.upload-resume-status--complete {
    color: var(--rm-success);
}

.upload-resume-status--draft {
    color: var(--rm-warning);
}

.resume-delete-form {
    flex: 0 0 auto;
    margin: 0;
}

.upload-delete-button {
    border-color: #edc4c4;
    background: var(--rm-surface-raised);
    color: var(--rm-danger);
}

.upload-delete-button:hover {
    border-color: var(--rm-danger);
    background: var(--rm-danger-soft);
    color: var(--rm-danger);
}

.upload-limit-alert,
.upload-intro-alert {
    margin-top: var(--rm-space-4);
}

.upload-limit-alert p,
.upload-intro-alert p,
.enrich-context-note p {
    margin: 0;
}

.upload-form-card {
    margin-top: var(--rm-space-5);
}

.upload-form-step {
    display: flex;
    align-items: center;
    gap: var(--rm-space-3);
    margin: var(--rm-space-2) 0 var(--rm-space-4);
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.upload-form-step > span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-navy-900);
    color: #ffffff;
    font-size: var(--rm-text-xs);
}

.upload-role-field {
    margin-top: var(--rm-space-5);
}

.upload-file-step {
    margin-top: var(--rm-space-8);
    padding-top: var(--rm-space-6);
    border-top: 1px solid var(--rm-border);
}

.upload-resume-page .upload-area {
    min-height: 210px;
    display: grid;
    place-items: center;
    align-content: center;
    padding: var(--rm-space-8);
    border: 2px dashed var(--rm-blue-100);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-blue-50);
    text-align: center;
    transition:
        border-color var(--rm-transition),
        background var(--rm-transition),
        transform var(--rm-transition);
}

.upload-resume-page .upload-area:hover,
.upload-resume-page .upload-area.dragover {
    border-color: var(--rm-blue-600);
    background: #e9f3fb;
    transform: translateY(-1px);
}

.upload-resume-page .upload-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    margin-bottom: var(--rm-space-3);
    border-radius: 50%;
    background: var(--rm-surface-raised);
    color: var(--rm-blue-700);
    font-size: 1.5rem;
    box-shadow: var(--rm-shadow-sm);
}

.upload-resume-page .upload-text {
    margin: 0;
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.upload-resume-page .upload-hint {
    margin: var(--rm-space-1) 0 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
}

.upload-resume-page .selected-file {
    margin-top: var(--rm-space-3);
    color: var(--rm-success);
    font-size: var(--rm-text-xs);
    font-weight: 700;
}

.upload-resume-page .upload-btn {
    width: auto;
    min-width: 190px;
    margin: var(--rm-space-5) auto 0;
}

/* ------------------------------------------------------------------------
   Resume enrichment questionnaire
   ------------------------------------------------------------------------ */

.enrich-page-header {
    margin-bottom: var(--rm-space-5);
}

.enrich-wrap .enrich-grid {
    display: block;
}

.enrich-resume-summary {
    display: flex;
    align-items: center;
    gap: var(--rm-space-4);
    margin-bottom: var(--rm-space-4);
}

.enrich-resume-summary > div:nth-child(2) {
    min-width: 0;
    display: grid;
    gap: 2px;
    flex: 1;
}

.enrich-resume-summary strong {
    overflow: hidden;
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.enrich-context-note {
    margin-bottom: var(--rm-space-5);
}

.enrich-progress-card {
    margin-bottom: var(--rm-space-4);
    padding: var(--rm-space-3) var(--rm-space-4);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-soft);
}

.enrich-wrap .progress-label {
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
    font-weight: 700;
}

.enrich-wrap .progress-wrap {
    height: 7px;
    margin-top: var(--rm-space-2);
    overflow: hidden;
    border-radius: var(--rm-radius-pill);
    background: var(--rm-border);
}

.enrich-wrap .progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        var(--rm-blue-700),
        var(--rm-amber-500)
    );
    transition: width 220ms ease;
}

.enrich-wrap .question-card {
    overflow: hidden;
    margin-bottom: var(--rm-space-3);
    border: 1px solid var(--rm-border);
    border-left: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-sm);
}

.enrich-wrap .question-card.answered {
    border-color: #bce3cf;
}

.enrich-wrap .question-card.error {
    border-color: #f0bcbc;
}

.enrich-wrap .question-card.is-open {
    border-color: var(--rm-blue-100);
    box-shadow: var(--rm-shadow-md);
}

.enrich-wrap .question-toggle {
    min-height: 88px;
    padding: var(--rm-space-4) var(--rm-space-5);
    background: transparent;
}

.enrich-wrap .question-toggle:hover {
    background: var(--rm-blue-50);
}

.enrich-wrap .q-number {
    color: var(--rm-blue-700);
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.enrich-wrap .q-text {
    margin-top: var(--rm-space-1);
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    line-height: 1.45;
}

.enrich-wrap .question-chevron {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-surface-soft);
    color: var(--rm-blue-700);
    font-size: 1rem;
}

.enrich-wrap .question-content {
    padding: 0 var(--rm-space-5) var(--rm-space-5);
    border-top: 1px solid var(--rm-border);
}

.enrich-wrap .q-textarea {
    min-height: 130px;
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-raised);
    color: var(--rm-text);
    font: inherit;
}

.enrich-wrap .q-textarea:focus {
    border-color: var(--rm-blue-600);
    outline: none;
    box-shadow: var(--rm-focus-ring);
}

.enrich-wrap .choice-grid {
    gap: var(--rm-space-3);
}

.enrich-wrap .choice-option {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-soft);
    color: var(--rm-text);
}

.enrich-wrap .choice-option:hover {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
}

.enrich-wrap .choice-option.selected {
    border-color: var(--rm-blue-700);
    background: var(--rm-blue-100);
    color: var(--rm-navy-950);
}

.enrich-wrap .action-bar {
    position: static;
    display: flex;
    justify-content: center;
    gap: var(--rm-space-3);
    margin-top: var(--rm-space-6);
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-soft);
}

.enrich-wrap .action-bar .ui-button {
    width: auto;
    min-width: 150px;
    margin: 0;
}

.enrich-wrap .action-bar .btn-skip {
    border: 1px solid var(--rm-border-strong);
    background: var(--rm-surface-raised);
    color: var(--rm-navy-800);
}

.enrich-wrap .action-bar .btn-draft {
    border: 1px solid var(--rm-blue-700);
    background: var(--rm-blue-700);
    color: #ffffff;
}

.enrich-wrap .action-bar .btn-submit {
    border: 1px solid var(--rm-amber-500);
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
}

/* ------------------------------------------------------------------------
   Job search
   ------------------------------------------------------------------------ */

.search-page {
    max-width: 1040px;
}

.search-page .session-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
    margin-bottom: var(--rm-space-5);
    padding: var(--rm-space-4) var(--rm-space-5);
    border-color: var(--rm-blue-100);
    background: var(--rm-blue-50);
    color: var(--rm-text);
    box-shadow: none;
}

.search-page .session-bar-label {
    color: var(--rm-blue-700);
    font-weight: 700;
}

.search-page .session-bar-query {
    color: var(--rm-ink);
}

.search-page .session-bar-link {
    color: var(--rm-navy-800);
}

.search-form-card {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.search-tip {
    margin-bottom: var(--rm-space-6);
}

.search-section-heading {
    display: flex;
    align-items: flex-start;
    gap: var(--rm-space-3);
    margin: var(--rm-space-2) 0 var(--rm-space-5);
}

.search-section-heading > span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--rm-navy-900);
    color: #ffffff;
    font-size: var(--rm-text-xs);
    font-weight: 700;
}

.search-section-heading h2,
.search-optional-heading h2 {
    margin: 0;
    color: var(--rm-ink);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-lg);
    font-weight: 400;
}

.search-section-heading p,
.search-optional-heading p {
    margin: 2px 0 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
}

.search-page .row {
    gap: var(--rm-space-5);
}

.search-page .form-group {
    gap: var(--rm-space-2);
}

.search-page .form-group label {
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.search-page :where(
    input[type="text"],
    input[type="time"],
    select
) {
    min-height: var(--rm-control-height);
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-raised);
    color: var(--rm-text);
    font-family: var(--rm-font-sans);
}

.search-page :where(
    input[type="text"],
    input[type="time"],
    select
):focus {
    border-color: var(--rm-blue-600);
    outline: 0;
    box-shadow: var(--rm-focus-ring);
}

.search-page .divider {
    margin: var(--rm-space-8) 0;
    border-color: var(--rm-border);
}

.search-preference-grid > div {
    min-width: 0;
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-soft);
}

.search-page .radio-group label,
.search-page .checkbox-group label,
.search-page .board-item {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: var(--rm-space-2);
    padding: var(--rm-space-2) var(--rm-space-3);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-sm);
    background: var(--rm-surface-raised);
    color: var(--rm-text);
    font-size: var(--rm-text-sm);
    font-weight: 500;
}

.search-page :where(
    input[type="radio"],
    input[type="checkbox"]
) {
    accent-color: var(--rm-blue-700);
}

.search-page .board-badge {
    border-radius: var(--rm-radius-pill);
    background: var(--rm-amber-100);
    color: var(--rm-warning);
}

.search-optional-heading {
    align-items: center;
}

.search-page #autorun-config {
    margin-top: var(--rm-space-4) !important;
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-blue-100);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
}

.search-submit-row {
    margin-top: var(--rm-space-2);
}

.search-submit-row .search-btn {
    width: auto;
    min-width: 190px;
    margin: 0;
}

#search-validation-errors {
    border: 1px solid var(--rm-amber-300) !important;
    border-radius: var(--rm-radius-md) !important;
    background: var(--rm-warning-soft) !important;
    color: var(--rm-warning) !important;
}

/* ------------------------------------------------------------------------
   Job results and score-choice dialog
   ------------------------------------------------------------------------ */

.results-page {
    max-width: 1080px;
}

.results-page-header {
    margin-bottom: var(--rm-space-5);
}

.results-page .resume-required-notice {
    align-items: center;
    margin-bottom: var(--rm-space-5);
    border-color: var(--rm-amber-300);
    background: var(--rm-amber-50);
}

.results-page .resume-required-notice > div {
    flex: 1;
}

.results-page .resume-required-notice strong {
    color: var(--rm-navy-950);
}

.results-page .cache-notice {
    margin-bottom: var(--rm-space-4);
    border: 1px solid var(--rm-blue-100);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
    color: var(--rm-muted);
}

.results-page .selection-bar {
    position: sticky;
    top: var(--rm-space-3);
    z-index: 20;
    padding: var(--rm-space-4);
    border-color: var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: rgba(255, 254, 250, 0.96);
    box-shadow: var(--rm-shadow-md);
    backdrop-filter: blur(12px);
}

.results-page .selection-bar .counter {
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
}

.results-page .selection-bar .counter span {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-xl);
}

.results-page .job-card {
    position: relative;
    gap: var(--rm-space-4);
    margin-bottom: var(--rm-space-3);
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    box-shadow: var(--rm-shadow-sm);
    cursor: pointer;
}

.results-page .job-card:has(.job-checkbox:checked) {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
    box-shadow: var(--rm-focus-ring);
}

.results-page .job-checkbox {
    width: 20px;
    height: 20px;
    margin-top: 2px;
    accent-color: var(--rm-blue-700);
}

.results-page .job-title {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-lg);
    font-weight: 400;
}

.results-page .job-company {
    color: var(--rm-blue-700);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.results-page .job-meta {
    gap: var(--rm-space-2);
}

.results-page .job-meta > span {
    padding: 0.25rem 0.55rem;
    border-radius: var(--rm-radius-pill);
    background: var(--rm-surface-soft);
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
}

.results-page .job-description {
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
    line-height: var(--rm-leading-normal);
}

.results-page .job-url a {
    display: inline-flex;
    align-items: center;
    gap: var(--rm-space-1);
    color: var(--rm-blue-700);
    font-size: var(--rm-text-xs);
    font-weight: 700;
}

.results-page .job-url {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
}

.track-application-button {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    width: auto;
    padding: 0.4rem 0.7rem;
    border: 1px solid var(--rm-blue-300);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
    color: var(--rm-blue-700);
    font: inherit;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.track-application-button:hover:not(:disabled) {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
}

.track-application-button.is-tracked {
    border-color: #b8dfc4;
    background: #edf9f1;
    color: #287a43;
    cursor: default;
    opacity: 1;
}

.track-application-button .ti-loader-2 {
    animation: rm-tracker-spin 0.8s linear infinite;
}

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

.results-page .pagination {
    margin-top: var(--rm-space-6);
}

.results-page .pagination :where(a, span) {
    border-radius: var(--rm-radius-sm);
}

.results-page .no-results,
.results-page .paste-only-prompt,
.results-page .no-results-wrap {
    margin-top: var(--rm-space-6);
}

.results-page .search-tips-list {
    max-width: 520px;
    margin: var(--rm-space-4) auto var(--rm-space-5);
    color: var(--rm-muted);
    text-align: left;
}

.results-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: var(--rm-space-4);
    background: rgba(16, 35, 63, 0.48);
    backdrop-filter: blur(5px);
}

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

body.dialog-open {
    overflow: hidden;
}

.results-reuse-dialog h2 {
    margin: var(--rm-space-3) 0 var(--rm-space-2);
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-xl);
    font-weight: 400;
}

.results-reuse-dialog .ui-dialog__header p {
    margin: 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
}

.reuse-choice-card {
    margin-bottom: var(--rm-space-4);
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-soft);
}

.reuse-choice-card:last-child {
    margin-bottom: 0;
}

.reuse-choice-title {
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.reuse-choice-meta {
    margin: var(--rm-space-1) 0 var(--rm-space-3);
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
}

.reuse-choice-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-2);
}

.reuse-option {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 2px var(--rm-space-2);
    align-items: center;
    padding: var(--rm-space-3);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-sm);
    background: var(--rm-surface-raised);
    color: var(--rm-text);
    cursor: pointer;
}

.reuse-option:has(input:checked) {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
}

.reuse-option input {
    grid-row: 1 / 3;
    accent-color: var(--rm-blue-700);
}

.reuse-option strong {
    color: var(--rm-ink);
    font-size: var(--rm-text-xs);
}

.reuse-option span {
    color: var(--rm-muted);
    font-size: 0.68rem;
}

.reuse-option--single {
    width: 100%;
}

/* Accessible shared focus treatment */
.has-sidebar :where(
    a,
    button,
    input,
    select,
    textarea,
    summary,
    [tabindex]
):focus-visible {
    outline: 2px solid var(--rm-blue-600);
    outline-offset: 2px;
    box-shadow: var(--rm-focus-ring);
}

/* ------------------------------------------------------------------------
   Page structure
   ------------------------------------------------------------------------ */

.ui-page {
    width: min(100%, var(--rm-content-max));
    margin-inline: auto;
    padding: var(--rm-space-8) var(--rm-page-gutter) var(--rm-space-12);
}

.ui-page--narrow {
    max-width: 860px;
}

.ui-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--rm-space-6);
    margin-bottom: var(--rm-space-8);
}

.ui-page-heading {
    margin: 0;
    color: var(--rm-ink);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-2xl);
    font-weight: 400;
    line-height: var(--rm-leading-tight);
    letter-spacing: -0.02em;
}

.ui-page-kicker {
    margin: 0 0 var(--rm-space-2);
    color: var(--rm-amber-600);
    font-size: var(--rm-text-xs);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.ui-page-description {
    max-width: 680px;
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
}

.ui-section {
    margin-top: var(--rm-space-8);
}

.ui-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
    margin-bottom: var(--rm-space-4);
}

.ui-section-title {
    margin: 0;
    color: var(--rm-ink);
    font-family: var(--rm-font-display);
    font-size: var(--rm-text-xl);
    font-weight: 400;
}

.ui-grid {
    display: grid;
    gap: var(--rm-space-5);
}

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

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

/* ------------------------------------------------------------------------
   Cards and contained surfaces
   ------------------------------------------------------------------------ */

.ui-card {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-sm);
}

.ui-card--padded {
    padding: clamp(1rem, 2.5vw, 1.5rem);
}

.ui-card--soft {
    background: var(--rm-surface-soft);
    box-shadow: none;
}

.ui-card--accent {
    border-color: var(--rm-amber-300);
    background: var(--rm-amber-50);
}

.ui-card--interactive {
    transition:
        transform var(--rm-transition),
        border-color var(--rm-transition),
        box-shadow var(--rm-transition);
}

.ui-card--interactive:hover {
    border-color: var(--rm-blue-100);
    box-shadow: var(--rm-shadow-md);
    transform: translateY(-2px);
}

/* ------------------------------------------------------------------------
   Buttons and action rows
   ------------------------------------------------------------------------ */

.ui-button {
    min-height: var(--rm-control-height);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--rm-space-2);
    padding: 0.7rem 1.15rem;
    border: 1px solid transparent;
    border-radius: var(--rm-radius-md);
    font-family: var(--rm-font-sans);
    font-size: var(--rm-text-sm);
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition:
        background var(--rm-transition),
        border-color var(--rm-transition),
        color var(--rm-transition),
        transform var(--rm-transition),
        box-shadow var(--rm-transition);
}

.ui-button:hover {
    transform: translateY(-1px);
}

.ui-button:active {
    transform: translateY(0);
}

.ui-button:disabled,
.ui-button[aria-disabled="true"] {
    opacity: 0.52;
    pointer-events: none;
}

.ui-button--primary {
    border-color: var(--rm-amber-500);
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
    box-shadow: 0 6px 16px rgba(216, 143, 0, 0.16);
}

.ui-button--primary:hover {
    border-color: var(--rm-amber-600);
    background: var(--rm-amber-600);
    color: #ffffff;
}

.ui-button--secondary {
    border-color: var(--rm-blue-700);
    background: var(--rm-blue-700);
    color: #ffffff;
}

.ui-button--secondary:hover {
    border-color: var(--rm-navy-800);
    background: var(--rm-navy-800);
    color: #ffffff;
}

.ui-button--outline {
    border-color: var(--rm-border-strong);
    background: var(--rm-surface-raised);
    color: var(--rm-navy-800);
}

.ui-button--outline:hover {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
}

.ui-button--quiet {
    background: transparent;
    color: var(--rm-blue-700);
}

.ui-button--quiet:hover {
    background: var(--rm-blue-50);
}

.ui-button--danger {
    border-color: var(--rm-danger);
    background: var(--rm-danger);
    color: #ffffff;
}

.ui-button--sm {
    min-height: 36px;
    padding: 0.5rem 0.85rem;
    font-size: var(--rm-text-xs);
}

.ui-button--lg {
    min-height: 50px;
    padding-inline: 1.5rem;
}

.ui-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--rm-space-3);
    flex-wrap: wrap;
}

.ui-actions--start {
    justify-content: flex-start;
}

.ui-actions--end {
    justify-content: flex-end;
}

/* ------------------------------------------------------------------------
   Forms
   ------------------------------------------------------------------------ */

.ui-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-5);
}

.ui-field {
    display: grid;
    gap: var(--rm-space-2);
}

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

.ui-label {
    color: var(--rm-ink);
    font-size: var(--rm-text-sm);
    font-weight: 700;
}

.ui-help {
    margin: 0;
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
}

.ui-input,
.ui-select,
.ui-textarea {
    width: 100%;
    min-height: var(--rm-control-height);
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-raised);
    color: var(--rm-text);
    font: inherit;
    transition:
        border-color var(--rm-transition),
        box-shadow var(--rm-transition);
}

.ui-input,
.ui-select {
    padding: 0.65rem 0.8rem;
}

.ui-textarea {
    min-height: 120px;
    padding: 0.8rem;
    resize: vertical;
}

.ui-input:hover,
.ui-select:hover,
.ui-textarea:hover {
    border-color: var(--rm-blue-600);
}

.ui-input:focus,
.ui-select:focus,
.ui-textarea:focus {
    border-color: var(--rm-blue-600);
    outline: none;
    box-shadow: var(--rm-focus-ring);
}

/* ------------------------------------------------------------------------
   Badges, alerts, empty states, and progress
   ------------------------------------------------------------------------ */

.ui-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--rm-space-1);
    width: fit-content;
    padding: 0.32rem 0.65rem;
    border-radius: var(--rm-radius-pill);
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
    font-size: var(--rm-text-xs);
    font-weight: 700;
}

.ui-badge--amber {
    background: var(--rm-amber-100);
    color: var(--rm-warning);
}

.ui-alert {
    display: flex;
    align-items: flex-start;
    gap: var(--rm-space-3);
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-blue-100);
    border-radius: var(--rm-radius-md);
    background: var(--rm-info-soft);
    color: var(--rm-text);
    font-size: var(--rm-text-sm);
}

.ui-alert--success {
    border-color: #bce3cf;
    background: var(--rm-success-soft);
}

.ui-alert--warning {
    border-color: var(--rm-amber-300);
    background: var(--rm-warning-soft);
}

.ui-alert--danger {
    border-color: #f0bcbc;
    background: var(--rm-danger-soft);
}

.ui-empty-state {
    display: grid;
    place-items: center;
    min-height: 240px;
    padding: var(--rm-space-10) var(--rm-space-6);
    border: 1px dashed var(--rm-border-strong);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-soft);
    text-align: center;
}

.ui-empty-state__icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    margin-bottom: var(--rm-space-4);
    border-radius: 50%;
    background: var(--rm-amber-100);
    color: var(--rm-warning);
    font-size: 1.4rem;
}

.ui-empty-state h2,
.ui-empty-state h3 {
    margin: 0;
    color: var(--rm-ink);
    font-family: var(--rm-font-display);
    font-weight: 400;
}

.ui-empty-state p {
    max-width: 520px;
    margin: var(--rm-space-2) 0 var(--rm-space-5);
    color: var(--rm-muted);
    font-size: var(--rm-text-sm);
}

.ui-skeleton {
    overflow: hidden;
    border-radius: var(--rm-radius-sm);
    background: linear-gradient(
        90deg,
        #ebe9e2 25%,
        #f7f6f1 50%,
        #ebe9e2 75%
    );
    background-size: 200% 100%;
    animation: ui-skeleton-loading 1.4s infinite;
}

@keyframes ui-skeleton-loading {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

/* ------------------------------------------------------------------------
   Tables and dialogs
   ------------------------------------------------------------------------ */

.ui-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-raised);
    -webkit-overflow-scrolling: touch;
}

.ui-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
    color: var(--rm-text);
    font-size: var(--rm-text-sm);
}

.ui-table th,
.ui-table td {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--rm-border);
    text-align: left;
    vertical-align: middle;
}

.ui-table th {
    background: var(--rm-surface-soft);
    color: var(--rm-muted);
    font-size: var(--rm-text-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ui-table tbody tr:hover {
    background: var(--rm-blue-50);
}

.ui-dialog {
    width: min(92vw, 560px);
    max-height: min(86vh, 760px);
    overflow-y: auto;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-xl);
    background: var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-lg);
}

.ui-dialog__header,
.ui-dialog__body,
.ui-dialog__footer {
    padding: var(--rm-space-5) var(--rm-space-6);
}

.ui-dialog__header {
    border-bottom: 1px solid var(--rm-border);
}

.ui-dialog__footer {
    display: flex;
    justify-content: flex-end;
    gap: var(--rm-space-3);
    border-top: 1px solid var(--rm-border);
}

/* ------------------------------------------------------------------------
   Responsive behavior
   ------------------------------------------------------------------------ */

@media (max-width: 860px) {
    .ui-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dash-regional-hero {
        grid-template-columns: minmax(0, 1fr) 220px;
    }

    .regional-landmark {
        right: 125px;
    }

    .regional-building--three {
        right: 92px;
    }
}

@media (max-width: 680px) {
    :root {
        --rm-page-gutter: 1rem;
    }

    .ui-page {
        padding-top: var(--rm-space-6);
    }

    .ui-page-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .ui-grid--2,
    .ui-grid--3,
    .ui-form-grid {
        grid-template-columns: 1fr;
    }

    .ui-field--full {
        grid-column: auto;
    }

    .ui-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .ui-actions .ui-button {
        width: 100%;
    }

    .ui-dialog__header,
    .ui-dialog__body,
    .ui-dialog__footer {
        padding: var(--rm-space-4);
    }

    .ui-dialog__footer {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .dash-regional-hero {
        grid-template-columns: 1fr;
    }

    .dash-regional-copy {
        padding-bottom: var(--rm-space-5);
    }

    .dash-regional-art {
        min-height: 145px;
    }

    .regional-landmark {
        right: 45%;
        height: 128px;
    }

    .region-us .regional-landmark {
        height: 96px;
    }

    .regional-building--one {
        right: 8%;
        height: 90px;
    }

    .regional-building--two {
        right: 22%;
        height: 68px;
    }

    .regional-building--three {
        right: 34%;
        height: 54px;
    }

    .dash-regional-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .dash-regional-actions .ui-button {
        width: 100%;
    }

    .upload-resume-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .upload-resume-row .resume-delete-form {
        grid-column: 2;
        justify-self: start;
    }

    .upload-resume-page .upload-area {
        min-height: 180px;
        padding: var(--rm-space-6) var(--rm-space-4);
    }

    .upload-resume-page .upload-btn {
        width: 100%;
    }

    .enrich-resume-summary {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .enrich-resume-summary .ui-badge {
        margin-left: 60px;
    }

    .enrich-wrap .question-toggle,
    .enrich-wrap .question-content {
        padding-right: var(--rm-space-4);
        padding-left: var(--rm-space-4);
    }

    .enrich-wrap .action-bar {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .enrich-wrap .action-bar .ui-button {
        width: 100%;
    }

    .search-page .session-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .search-page .session-bar-link {
        width: 100%;
    }

    .search-preference-grid > div {
        padding: var(--rm-space-3);
    }

    .search-submit-row .search-btn {
        width: 100%;
    }

    .results-page .selection-bar {
        position: static;
        align-items: stretch;
        flex-direction: column;
    }

    .results-page .selection-bar > div:last-child,
    .results-page .selection-bar .ui-button {
        width: 100%;
    }

    .results-page .selection-bar > div:last-child {
        align-items: stretch !important;
        flex-direction: column;
    }

    .results-page .job-card {
        padding: var(--rm-space-4);
    }

    .results-page .resume-required-notice {
        align-items: stretch;
    }

    .reuse-choice-options {
        grid-template-columns: 1fr;
    }
}

/* ========================================================================
   Approved authenticated mock — shell and dashboard fidelity pass
   ======================================================================== */

body.has-sidebar {
    --rm-sidebar-width: 276px;
    background: #f8fafc;
    color: #111b3f;
}

.has-sidebar .app-sidebar {
    width: var(--rm-sidebar-width);
    border-right: 1px solid #e3e8ef;
    background: #ffffff;
    color: #58647f;
    box-shadow: none;
}

.has-sidebar .sb-logo {
    height: 92px;
    min-height: 92px;
    gap: 12px;
    padding: 20px 24px;
    border-bottom: 1px solid #edf0f4;
    color: #101a42;
}

.has-sidebar .sb-brand-mark {
    width: 43px;
    height: 43px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #ee9e00;
    font-size: 37px;
}

.has-sidebar .sb-brand-mark::before,
.has-sidebar .sb-brand-mark::after {
    display: none;
}

.has-sidebar .sb-logo-text {
    color: #111a40;
    font-family: var(--rm-font-display);
    font-size: 22px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

.has-sidebar .sb-logo-text span {
    color: #ee9e00;
}

.has-sidebar .sb-credit-card {
    position: fixed;
    z-index: 10;
    top: 23px;
    right: 196px;
    width: auto;
    min-height: 46px;
    margin: 0;
    padding: 0 16px;
    gap: 8px;
    border: 1px solid #e5e9ef;
    border-radius: 12px;
    background: #ffffff;
    color: #47526d;
    box-shadow: 0 2px 8px rgba(17, 26, 64, 0.03);
}

.has-sidebar .sb-credit-card > span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.has-sidebar .sb-credit-card > span::before {
    content: "★";
    color: #ee9e00;
    font-size: 20px;
}

.has-sidebar .sb-credit-label {
    display: none;
}

.has-sidebar .sb-credit-card strong {
    color: #47526d;
    font-size: 15px;
    font-weight: 500;
}

.has-sidebar .sb-credit-card strong::after {
    content: " credits available";
    font-weight: 400;
}

.has-sidebar .sb-credit-card > i {
    display: none;
}

.has-sidebar .sb-nav {
    padding: 11px 14px 112px;
}

.has-sidebar .sb-section {
    display: none;
}

.has-sidebar .sb-item {
    min-height: 42px;
    margin: 1px 0;
    padding: 0 16px;
    gap: 12px;
    border-radius: 8px;
    color: #58647f;
    font-size: 14px;
    font-weight: 500;
}

.has-sidebar .sb-item i {
    width: 22px;
    color: #66728d;
    font-size: 21px;
}

.has-sidebar .sb-item:hover {
    background: #f1f6fb;
    color: #176bb8;
}

.has-sidebar .sb-item.active {
    border-left: 0;
    background: linear-gradient(135deg, #0874d1, #1767b4);
    color: #ffffff;
    box-shadow: 0 6px 14px rgba(19, 105, 185, 0.16);
}

.has-sidebar .sb-item.active i {
    color: #ffffff;
}

.has-sidebar .sb-bottom {
    border-top: 0;
    background: #ffffff;
}

.has-sidebar .sb-user {
    padding: 14px 22px;
    border-top: 1px solid #edf0f4;
    color: #58647f;
}

.has-sidebar .sb-avatar {
    border: 0;
    background: #edf5fc;
    color: #176bb8;
}

.has-sidebar .sb-user-name {
    color: #28334f;
}

.has-sidebar .sb-notif,
.has-sidebar .sb-user-plan {
    color: #7d879c;
}

.has-sidebar .app-main {
    margin-left: var(--rm-sidebar-width);
}

.app-topbar {
    position: relative;
    z-index: 5;
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 30px;
    border-bottom: 1px solid #e4e9ef;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 2px 8px rgba(17, 26, 64, 0.04);
}

.app-topbar-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.app-topbar-credits {
    display: none;
}

.mock-dashboard {
    width: min(1184px, calc(100% - 64px));
    margin: 0 auto;
    padding: 30px 0 52px;
}

.mock-dashboard-heading {
    position: relative;
    min-height: 150px;
    display: flex;
    align-items: flex-start;
    overflow: hidden;
}

.mock-dashboard-heading h1 {
    position: relative;
    z-index: 2;
    margin: 0;
    color: #0d1539;
    font-family: var(--rm-font-display);
    font-size: clamp(32px, 3.4vw, 42px);
    font-weight: 400;
    letter-spacing: -0.025em;
    line-height: 1.08;
}

.mock-dashboard-heading p {
    position: relative;
    z-index: 2;
    margin: 10px 0 0;
    color: #66718b;
    font-size: 14px;
}

.mock-dashboard-landscape {
    position: absolute;
    inset: -4px 0 0 34%;
    overflow: hidden;
    pointer-events: none;
}

.mock-dashboard-landscape::before {
    display: none;
}

.mock-dashboard-landscape img {
    position: absolute;
    right: 0;
    bottom: -91px;
    width: 760px;
    height: 280px;
    object-fit: contain;
    object-position: bottom right;
    opacity: 1;
    filter: saturate(1.12) contrast(1.08);
}

.mock-canada-flag,
.mock-us-flag {
    position: absolute;
    right: 18px;
    bottom: 34px;
    font-size: 31px;
}

.mock-journey {
    min-height: 116px;
    display: grid;
    grid-template-columns: 1fr 90px 1fr 90px 1fr;
    align-items: center;
    margin-top: 2px;
    padding: 16px 28px;
    border: 1px solid #e0e5ec;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(17, 31, 68, 0.07);
}

.mock-journey-step {
    position: relative;
    display: grid;
    grid-template-columns: 58px 1fr;
    align-items: center;
    gap: 12px;
    color: #111a40;
    text-decoration: none;
}

.mock-step-number {
    position: absolute;
    z-index: 2;
    top: -10px;
    left: 2px;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    background: #ee9e00;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
}

.mock-step-number--muted {
    background: #78839b;
}

.mock-step-icon {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border: 2px solid #e1e6ed;
    border-radius: 50%;
    color: #0874d1;
    font-size: 28px;
}

.mock-step-icon--amber {
    border-color: #f5d9a1;
    color: #ee9e00;
}

.mock-step-copy {
    display: grid;
    gap: 4px;
}

.mock-step-copy strong,
.mock-dashboard h2 {
    color: #10183c;
    font-family: var(--rm-font-display);
    font-weight: 400;
}

.mock-step-copy strong {
    font-size: 17px;
}

.mock-step-copy small {
    color: #69748d;
    font-size: 11px;
    line-height: 1.4;
}

.mock-step-line {
    height: 1px;
    border-top: 2px dashed #d8dee7;
}

.mock-announcement {
    margin: 18px 0 0;
    border-color: #e0e5ec;
    border-radius: 12px;
    background: #ffffff;
}

.mock-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.85fr);
    gap: 16px;
    margin-top: 18px;
}

.mock-score-action,
.mock-latest-score,
.mock-activity,
.mock-tip-card {
    border: 1px solid #e1e6ec;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(17, 31, 68, 0.055);
}

.mock-score-action {
    min-height: 292px;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    overflow: hidden;
    padding: 34px 28px;
}

.mock-score-action h2,
.mock-latest-score h2,
.mock-section-header h2,
.mock-tip-card h2 {
    margin: 0;
    font-size: 21px;
}

.mock-score-action p {
    max-width: 325px;
    margin: 16px 0 28px;
    color: #66718b;
    font-size: 16px;
    line-height: 1.55;
}

.mock-primary-button {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 0 20px;
    border-radius: 7px;
    background: linear-gradient(135deg, #f2a400, #e99500);
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 5px 14px rgba(238, 158, 0, 0.18);
}

.mock-target-art {
    position: relative;
    min-height: 220px;
}

.mock-resume-sheet {
    position: absolute;
    right: 58px;
    bottom: 28px;
    width: 118px;
    height: 166px;
    padding: 24px 18px;
    border: 3px solid #d9dfe8;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 12px 20px rgba(17, 31, 68, 0.08);
}

.mock-resume-sheet .ti {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 50%;
    background: #0874d1;
    color: #ffffff;
}

.mock-resume-sheet b {
    display: block;
    width: 70px;
    height: 5px;
    margin-top: 12px;
    border-radius: 4px;
    background: #e2e6ed;
}

.mock-resume-sheet b:nth-of-type(2) {
    width: 52px;
}

.mock-target-rings {
    position: absolute;
    right: 5px;
    bottom: 9px;
    width: 104px;
    height: 104px;
    border: 13px solid #0874d1;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: inset 0 0 0 12px #dcecf8, inset 0 0 0 24px #0874d1;
}

.mock-target-rings i {
    position: absolute;
    inset: 37px;
    border-radius: 50%;
    background: #f0a000;
}

.mock-arrow {
    position: absolute;
    z-index: 3;
    right: 0;
    bottom: 83px;
    color: #ee9e00;
    font-size: 65px;
    line-height: 1;
    transform: rotate(-43deg);
}

.mock-spark {
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 1px;
    background: #5da9e2;
    transform: rotate(45deg);
}

.mock-spark--one {
    top: 65px;
    left: 12px;
}

.mock-spark--two {
    top: 108px;
    right: 4px;
    background: #ee9e00;
}

.mock-latest-score {
    min-height: 292px;
    padding: 24px 26px;
}

.mock-score-ring {
    --score-color: #1373c6;
    position: relative;
    width: 182px;
    height: 182px;
    display: grid;
    place-items: center;
    margin: 5px auto 4px;
    border-radius: 50%;
    background: conic-gradient(var(--score-color) calc(var(--score) * 1%), #e6e9ef 0);
}

.mock-score-ring::before {
    content: "";
    position: absolute;
    inset: 15px;
    border-radius: 50%;
    background: #ffffff;
}

.mock-score-ring > div {
    position: relative;
    z-index: 1;
    display: grid;
    text-align: center;
}

.mock-score-ring strong {
    color: #0e163f;
    font-family: var(--rm-font-display);
    font-size: 54px;
    font-weight: 400;
    line-height: 1;
}

.mock-score-ring span {
    margin-top: 4px;
    color: #68738d;
    font-size: 13px;
}

.mock-score-change {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #0874d1;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.mock-activity {
    overflow: hidden;
}

.mock-section-header {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 26px;
    border-bottom: 1px solid #e5e9ef;
}

.mock-section-header h2,
.mock-tip-card h2 {
    font-size: 20px;
}

.mock-section-header a,
.mock-tip-card a {
    color: #0874d1;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

.mock-activity-row {
    min-height: 58px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto 76px;
    align-items: center;
    gap: 10px;
    padding: 0 26px;
    border-bottom: 1px solid #edf0f3;
    color: #59657e;
    text-decoration: none;
}

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

.mock-activity-icon {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 6px;
    background: #e8f2fb;
    color: #0874d1;
}

.mock-activity-copy {
    min-width: 0;
    display: grid;
}

.mock-activity-copy strong {
    overflow: hidden;
    color: #4d5872;
    font-size: 13px;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mock-activity-copy small,
.mock-activity-row time {
    color: #8993a7;
    font-size: 11px;
}

.mock-activity-score {
    padding: 2px 7px;
    border: 1px solid #8cc3eb;
    border-radius: 5px;
    color: #0874d1;
    font-size: 12px;
    font-weight: 700;
}

.mock-activity-empty {
    padding: 28px;
    color: #78839a;
    font-size: 13px;
}

.mock-tip-card {
    min-height: 190px;
    display: grid;
    grid-template-columns: 94px 1fr;
    align-items: center;
    gap: 18px;
    padding: 26px;
}

.mock-tip-icon {
    display: grid;
    width: 90px;
    height: 90px;
    place-items: center;
    border-radius: 50%;
    background: #fff3dd;
    color: #ee9e00;
    font-size: 48px;
}

.mock-tip-card p {
    margin: 12px 0 18px;
    color: #66718b;
    font-size: 14px;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .mock-journey {
        grid-template-columns: 1fr 30px 1fr 30px 1fr;
        padding-inline: 20px;
    }

    .mock-journey-step {
        grid-template-columns: 64px 1fr;
        gap: 12px;
    }

    .mock-step-icon {
        width: 64px;
        height: 64px;
        font-size: 30px;
    }

    .mock-step-copy small {
        font-size: 11px;
    }
}

@media (max-width: 900px) {
    body.has-sidebar {
        --rm-sidebar-width: 0px;
    }

    .has-sidebar .app-sidebar {
        width: 276px;
    }

    .has-sidebar .sb-credit-card,
    .app-topbar {
        display: none;
    }

    .mock-dashboard {
        width: min(100% - 32px, 720px);
        padding-top: 24px;
    }

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

    .mock-latest-score {
        grid-row: auto;
    }
}

@media (max-width: 680px) {
    .mock-dashboard-heading {
        min-height: 150px;
    }

    .mock-dashboard-heading h1 {
        max-width: 280px;
        font-size: 36px;
    }

    .mock-dashboard-landscape {
        inset: 38px -60px 0 30%;
        opacity: 0.62;
    }

    .mock-journey {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 22px;
    }

    .mock-step-line {
        display: none;
    }

    .mock-score-action {
        grid-template-columns: 1fr;
        padding: 26px 22px;
    }

    .mock-target-art {
        min-height: 190px;
    }

    .mock-tip-card {
        grid-template-columns: 68px 1fr;
        padding: 22px;
    }

    .mock-tip-icon {
        width: 66px;
        height: 66px;
        font-size: 34px;
    }

    .mock-activity-row {
        grid-template-columns: 30px minmax(0, 1fr) auto;
        padding: 10px 18px;
    }

    .mock-activity-row time {
        display: none;
    }
}

@media (max-width: 700px) {
    .has-sidebar .mobile-header {
        height: 60px;
        border-bottom: 1px solid var(--rm-border);
        background: rgba(255, 254, 250, 0.96);
        box-shadow: var(--rm-shadow-sm);
        color: var(--rm-ink);
        backdrop-filter: blur(12px);
    }

    .has-sidebar .mobile-header-logo {
        display: flex;
        align-items: center;
        gap: var(--rm-space-2);
        color: var(--rm-navy-950);
        font-family: var(--rm-font-display);
    }

    .has-sidebar .mobile-header-logo > span:last-child {
        color: var(--rm-navy-950);
    }

    .has-sidebar .mobile-header-logo strong {
        color: var(--rm-amber-600);
        font-weight: 400;
    }

    .has-sidebar .mobile-header .sb-brand-mark {
        width: 30px;
        height: 30px;
        color: var(--rm-navy-950);
        font-family: var(--rm-font-sans);
        font-size: 0.7rem;
    }

    .has-sidebar.region-us .mobile-header .sb-brand-mark {
        color: #ffffff;
    }

    .has-sidebar .mobile-credits {
        color: var(--rm-muted);
    }

    .has-sidebar .mobile-credits strong {
        color: var(--rm-amber-600);
    }

    .has-sidebar .mobile-hamburger {
        display: grid;
        width: 38px;
        height: 38px;
        place-items: center;
        border-radius: var(--rm-radius-sm);
        color: var(--rm-navy-950);
    }

    .has-sidebar .mobile-hamburger:hover {
        background: var(--rm-blue-50);
    }

    .has-sidebar .app-sidebar {
        /* Mobile drawer width — must NOT reuse --rm-sidebar-width, which is set
           to 0px at <=900px for the layout margin. Reusing it collapsed the
           open drawer to 0px wide (visible overlay, invisible menu). */
        width: min(86vw, 300px);
        transform: translateX(-100%);
        box-shadow: var(--rm-shadow-lg);
    }

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

    .has-sidebar .app-main {
        margin-left: 0;
        padding-top: 60px;
    }

    .has-sidebar .sidebar-overlay {
        background: rgba(16, 35, 63, 0.42);
        backdrop-filter: blur(2px);
    }

    body.sidebar-open {
        overflow: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Analysis and resume improvement */
.scoring-page,
.enhancer-wrap {
    display: grid;
    gap: var(--rm-space-6);
}

.scoring-page-header,
.enhancer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rm-space-6);
}

.scoring-page-title,
.enhancer-header h1 {
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1.02;
}

.scoring-page-subtitle,
.enhancer-header > p:last-child {
    max-width: 680px;
    margin: var(--rm-space-3) 0 0;
    color: var(--rm-muted);
    font-size: 1rem;
    line-height: 1.65;
}

.scoring-panel {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.score-summary-panel,
.resume-editor-panel,
.resume-side-panel {
    padding: clamp(1.1rem, 2.5vw, 1.75rem);
}

.score-summary-header,
.scoring-panel-header,
.resume-editor-header {
    margin-bottom: var(--rm-space-5);
}

.score-summary-heading,
.scoring-panel-heading,
.resume-editor-title,
.improvement-card h2 {
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-weight: 500;
    letter-spacing: -0.025em;
}

.resume-editor-title,
.improvement-card h2 {
    font-size: 1.08rem;
    line-height: 1.25;
}

.score-summary-description,
.scoring-panel-description,
.resume-editor-subtitle {
    max-width: 760px;
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
    line-height: 1.6;
}

.score-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.score-summary-card {
    min-width: 0;
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: linear-gradient(150deg, #ffffff 0%, var(--rm-blue-50) 100%);
}

.score-summary-section {
    min-width: 0;
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: linear-gradient(150deg, #ffffff 0%, var(--rm-blue-50) 100%);
    text-align: center;
}

.score-summary-label {
    margin: 0 0 var(--rm-space-3);
    color: var(--rm-blue-700);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.score-ring,
.score-ring-inner {
    display: grid;
    place-items: center;
    border-radius: 50%;
}

.readiness-ring {
    display: grid;
    width: 100px;
    height: 100px;
    margin: 0 auto var(--rm-space-3);
    place-items: center;
    border-radius: 50%;
    background:
        radial-gradient(closest-side, #ffffff 76%, transparent 77% 99%, #ffffff 100%),
        conic-gradient(
            var(--score-color, var(--rm-blue-600))
            calc(var(--score-value, 0) * 1%),
            var(--rm-blue-100) 0
        );
}

.readiness-ring-value {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.45rem;
}

.readiness-status {
    margin: 0;
    color: var(--rm-navy-800);
    font-weight: 800;
}

.readiness-caption,
.score-summary-message {
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.score-tier-pill {
    display: inline-flex;
    margin-top: var(--rm-space-3);
    padding: 0.32rem 0.65rem;
    border-radius: 999px;
    background: var(--rm-amber-100);
    color: var(--rm-amber-700);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.dimension-heading-title {
    margin: 0 0 var(--rm-space-4);
    color: var(--rm-navy-950);
    font-weight: 800;
    text-align: left;
}

.score-ring {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    background: conic-gradient(var(--rm-blue-600) var(--score-deg, 0deg), var(--rm-blue-100) 0);
}

.score-ring-inner {
    width: 74px;
    height: 74px;
    background: #ffffff;
    color: var(--rm-navy-950);
}

.score-ring-value {
    font-family: var(--rm-font-display);
    font-size: 1.55rem;
    line-height: 1;
}

.score-ring-caption {
    color: var(--rm-muted);
    font-size: 0.74rem;
}

.dimension-list {
    display: grid;
    gap: 0.8rem;
}

.dimension-row {
    display: grid;
    gap: 0.35rem;
}

.dimension-label-row,
.dimension-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: var(--rm-navy-800);
    font-size: 0.82rem;
}

.dimension-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.dimension-track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--rm-blue-100);
}

.dimension-fill {
    height: 100%;
    border-radius: inherit;
    background: var(--rm-blue-600);
}

.score-improvements-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-5);
}

.improvement-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--rm-space-4);
    padding: var(--rm-space-4);
}

.improvement-card-icon {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 14px;
    background: var(--rm-blue-100);
    color: var(--rm-blue-700);
    font-size: 1.3rem;
}

.improvement-card-icon--amber {
    background: var(--rm-amber-100);
    color: var(--rm-amber-700);
}

.improvement-card-intro {
    margin: var(--rm-space-2) 0 var(--rm-space-3);
    color: var(--rm-muted);
    line-height: 1.55;
}

.improvement-card ul {
    display: grid;
    gap: var(--rm-space-2);
    margin: 0;
    padding-left: 1.1rem;
    color: var(--rm-navy-800);
    line-height: 1.5;
}

.ai-resume-assistant {
    padding: var(--rm-space-5);
    border-left: 4px solid var(--rm-amber-500);
    box-shadow: none;
}

.ai-assistant-workspace,
.skill-suggestion-box {
    display: grid;
    gap: var(--rm-space-3);
}

.skill-suggestion-box:empty {
    display: none;
}

.skill-suggestion-label {
    color: var(--rm-navy-950);
}

.draggable-sentence {
    padding: var(--rm-space-4);
    border: 1px dashed var(--rm-blue-300);
    border-radius: var(--rm-radius-sm);
    background: var(--rm-blue-50);
    color: var(--rm-navy-800);
    line-height: 1.55;
    cursor: grab;
}

.drag-hint {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    color: var(--rm-muted);
    font-size: 0.86rem;
}

.text-link-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--rm-blue-700);
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
}

.resume-workspace {
    display: grid;
    /* Same 3-column grid as block 1 (editor spans the first two) so the right
       column lines up exactly with the dimension breakdown. */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: var(--rm-space-4);
}

/* Editor spans the first two columns; it scrolls its own content within a
   bounded height so it never pushes the page down. Columns are natural
   height (align-items:start) so nothing can overflow onto the buttons. */
.resume-editor-panel {
    grid-column: span 2;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.resume-format-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem;
    border: 1px solid var(--rm-border);
    border-bottom: 0;
    border-radius: var(--rm-radius-sm) var(--rm-radius-sm) 0 0;
    background: var(--rm-navy-50);
}

.resume-format-select,
.resume-format-button {
    min-height: 36px;
    border: 1px solid var(--rm-border-strong);
    border-radius: 8px;
    background: #ffffff;
    color: var(--rm-navy-800);
}

.resume-format-select {
    padding: 0 0.65rem;
}

.resume-format-button {
    min-width: 36px;
    padding: 0.35rem 0.55rem;
    cursor: pointer;
}

.resume-format-button:hover,
.resume-format-button:focus-visible {
    border-color: var(--rm-blue-500);
    background: var(--rm-blue-50);
}

.resume-toolbar-divider {
    width: 1px;
    height: 24px;
    margin: 0 0.15rem;
    background: var(--rm-border);
}

.resume-editor {
    min-height: 620px;
    max-height: min(72vh, 780px);
    padding: clamp(1.25rem, 3vw, 2.6rem);
    overflow-y: auto;
    overflow-wrap: anywhere;
    border: 1px solid var(--rm-border);
    border-radius: 0 0 var(--rm-radius-sm) var(--rm-radius-sm);
    outline: none;
    background: #ffffff;
    color: #1f2937;
    font-family: Arial, sans-serif;
    font-size: 0.9rem;
    line-height: 1.6;
    box-shadow: inset 0 1px 2px rgba(16, 35, 63, 0.04);
}

.resume-editor h1 {
    font-size: 1.35rem;
    line-height: 1.25;
}

.resume-editor h2 {
    font-size: 1.15rem;
    line-height: 1.3;
}

.resume-editor h3 {
    font-size: 1rem;
    line-height: 1.35;
}

.resume-editor p,
.resume-editor div,
.resume-editor li {
    font-size: inherit;
}

.resume-editor:focus {
    border-color: var(--rm-blue-500);
    box-shadow: 0 0 0 3px rgba(44, 105, 199, 0.12);
}

.resume-editor:empty::before {
    color: var(--rm-muted);
    content: attr(data-placeholder);
}

.resume-editor ul,
.resume-editor ol {
    margin: 0.5rem 0;
    padding-left: 1.6rem;
}

.resume-editor li {
    margin: 0.2rem 0;
}

.resume-side-panel {
    position: sticky;
    top: 24px;
    max-height: min(72vh, 780px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.resume-side-panel > .scoring-panel {
    border: 0;
    box-shadow: none;
}

.skill-tier {
    margin-top: var(--rm-space-5);
}

.skill-tier-title {
    color: var(--rm-navy-950);
    font-size: 0.84rem;
}

.skill-pill-list,
.skill-list,
.suggested-skills-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: var(--rm-space-3);
}

.skill-pill,
.suggested-skill {
    padding: 0.45rem 0.7rem;
    border: 1px solid var(--rm-blue-200);
    border-radius: 999px;
    background: var(--rm-blue-50);
    color: var(--rm-blue-800);
    font-size: 0.78rem;
    font-weight: 700;
}

/* Space each tier away from the pills of the tier above it. */
.skill-tier-group + .skill-tier-group {
    margin-top: var(--rm-space-6);
}

/* Per-tier chip colors. Preferred keeps the default blue above. */
.skill-tier-group--required .skill-pill {
    border-color: var(--rm-danger);
    background: var(--rm-danger-soft);
    color: var(--rm-danger);
}

.skill-tier-group--important .skill-pill {
    border-color: var(--rm-amber-600);
    background: var(--rm-amber-50);
    color: var(--rm-amber-700);
}

/* A keyword already found in the resume turns green, regardless of tier.
   Higher specificity than the tier rules above so green always wins. */
.skill-tier-group .skill-pill.is-found {
    border-color: var(--rm-success);
    background: var(--rm-success-soft);
    color: var(--rm-success);
}

/* =========================================================================
   Improve page — three-block redesign
   ========================================================================= */

/* Collapsible section blocks */
.rm-block {
    margin-bottom: var(--rm-space-5);
}

.rm-block-head {
    display: flex;
    align-items: center;
    gap: var(--rm-space-3);
    padding: var(--rm-space-2) var(--rm-space-2) var(--rm-space-3);
    list-style: none;
}

.rm-block-head::-webkit-details-marker {
    display: none;
}

.rm-block-title {
    color: var(--rm-blue-700);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.rm-block-peek {
    color: var(--rm-muted);
    font-size: 0.8rem;
}

.rm-block-chev {
    margin-left: auto;
    color: var(--rm-muted);
    font-size: 0.78rem;
    transition: transform 0.2s ease;
}

.rm-block[open] .rm-block-chev {
    transform: rotate(180deg);
}

/* Block 1 — score hero: match (big) + ATS (small) + dimensions */
.score-hero {
    display: grid;
    /* Three equal columns; block 2 uses the same grid so the missing-skills
       column lines up exactly with the dimension breakdown. */
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--rm-space-4);
    align-items: stretch;
}

/* Unified section/card headings — same look as the "ATS Readiness" label:
   blue, small, uppercase, letter-spaced, sans (not the serif display). */
.score-hero-dims .dimension-heading-title,
.skills-panel .scoring-panel-heading,
.resume-editor-panel .resume-editor-title,
.suggest-panel .scoring-panel-heading,
.recruiter-improve-card h3 {
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    line-height: 1.35;
    text-transform: uppercase;
    color: var(--rm-blue-700);
}

.score-hero-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: clamp(0.85rem, 1.8vw, 1.2rem);
}

.score-hero-match,
.score-hero-ats {
    align-items: center;
    text-align: center;
}

.score-hero-match .score-summary-dial {
    margin: var(--rm-space-1) auto;
}

/* Scale the xlarge match dial (200px viewBox) down ~25% without touching
   the macro — the JS dial math stays in viewBox units, so it's unaffected. */
.score-hero-match .match-dial svg {
    width: 150px;
    height: 150px;
}

.score-hero-match .score-tier-pill {
    margin-top: var(--rm-space-2);
}

.score-hero-match .score-summary-message {
    font-size: 0.78rem;
}

.score-hero-dims {
    gap: 0.55rem;
    justify-content: center;
}

.score-hero-dims .dimension-heading-title {
    margin-bottom: var(--rm-space-3);
    /* Centre the heading to line up with Match Score / ATS Readiness; the
       bars below stay left-aligned. */
    text-align: center;
}

.readiness-ring--sm {
    width: 62px;
    height: 62px;
    margin: var(--rm-space-1) auto;
}

.readiness-ring--sm .readiness-ring-value {
    font-size: 0.95rem;
}

.score-hero-ats .readiness-caption {
    font-size: 0.76rem;
}

/* Block 2 — editor + skills, equal height, suggestion pinned to bottom */
.resume-side-panel {
    display: flex;
    flex-direction: column;
    gap: var(--rm-space-4);
    position: static;
    overflow: visible;
    /* Natural height (single Missing Skills card now). */
    padding: 0;
}

.resume-side-panel > .scoring-panel {
    border: 1px solid var(--rm-border);
    box-shadow: var(--rm-shadow-sm);
}

.skills-panel {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    padding: clamp(1rem, 2.2vw, 1.35rem);
}

/* The suggested line now lives inside the Missing Skills card. It takes no
   space until a skill is tapped, then appears below the legend with a divider. */
.skills-panel .skill-suggestion-box.is-visible {
    margin-top: var(--rm-space-3);
    padding-top: var(--rm-space-3);
    border-top: 1px solid var(--rm-border);
}

/* Suggested sentence pins to the bottom of the fixed-height column so its
   bottom lines up with the editor. Safe now: the skills list is natural height
   (its pills scroll via max-height), so this auto margin has nothing to fight. */
/* Suggested Sentence is its own block between the score block and the editor;
   its header uses the shared .rm-block-title style like the other blocks. */
.suggest-panel {
    padding: clamp(1rem, 2.2vw, 1.35rem);
}

.suggest-panel-heading {
    font-size: 1rem;
}

/* Impact-coded skill pills, scrollable cloud */
.skill-pill-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-content: flex-start;
    /* Plain max-height (not nested flex) so the pills reliably scroll inside
       the card instead of overflowing. */
    max-height: clamp(220px, 34vh, 380px);
    overflow-y: auto;
    margin-top: var(--rm-space-3);
    padding-right: 4px;
}

.skill-pill {
    cursor: pointer;
    transition: transform 0.06s ease, box-shadow 0.12s ease;
}

.skill-pill:hover {
    transform: translateY(-1px);
}

.skill-pill--high {
    border-color: var(--rm-danger);
    background: var(--rm-danger-soft);
    color: var(--rm-danger);
}

.skill-pill--medium {
    border-color: var(--rm-amber-600);
    background: var(--rm-amber-50);
    color: var(--rm-amber-700);
}

.skill-pill--low {
    border-color: var(--rm-blue-300);
    background: var(--rm-blue-50);
    color: var(--rm-blue-800);
}

/* Selected pill and found pill states win over the impact colors. */
.skill-pill.is-active {
    box-shadow: 0 0 0 2px var(--rm-blue-500);
}

.skill-pill.is-found {
    border-color: var(--rm-success);
    background: var(--rm-success-soft);
    color: var(--rm-success);
}

.skill-impact-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin-top: var(--rm-space-3);
    padding-top: var(--rm-space-3);
    border-top: 1px solid var(--rm-border);
    color: var(--rm-muted);
    font-size: 0.74rem;
}

.skill-impact-legend span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.skill-impact-legend .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.skill-impact-legend .dot--high { background: var(--rm-danger); }
.skill-impact-legend .dot--medium { background: var(--rm-amber-600); }
.skill-impact-legend .dot--low { background: var(--rm-blue-500); }
.skill-impact-legend .dot--found { background: var(--rm-success); }

/* Suggested sentence — empty state, then draggable grip object */
.skill-suggestion-box .suggest-empty {
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
    font-size: 0.85rem;
    line-height: 1.5;
}

.skill-suggestion-box.is-visible .suggest-empty {
    display: none;
}

.skill-suggestion-box .skill-suggestion-label {
    display: none;
}

.skill-suggestion-box.is-visible .skill-suggestion-label {
    display: block;
}

.draggable-sentence {
    display: none;
    align-items: flex-start;
    gap: 0.6rem;
}

.skill-suggestion-box.is-visible .draggable-sentence {
    display: flex;
}

.drag-grip {
    display: grid;
    grid-template-columns: repeat(2, 5px);
    grid-auto-rows: 5px;
    gap: 4px;
    flex: none;
    margin-top: 4px;
}

.drag-grip i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--rm-blue-300);
}

/* Block 3 — recruiter improvement cards */
.recruiter-improve-sub {
    margin: 0 0 var(--rm-space-4);
    color: var(--rm-muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.recruiter-improve-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

/* Heading sits next to the icon; the description runs edge-to-edge below.
   Light-blue fill with a dark-blue outline (design-system blues). */
.recruiter-improve-card {
    padding: 0.6rem 0.7rem;
    background: var(--rm-blue-50);
    border: 1px solid var(--rm-blue-600);
}

.recruiter-improve-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}

.recruiter-improve-icon {
    flex: none;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-blue-100);
    color: var(--rm-blue-700);
    font-size: 0.82rem;
}

.recruiter-improve-card h3 {
    margin: 0;
}

.recruiter-improve-desc {
    margin: 0;
    color: var(--rm-muted);
    font-size: 0.72rem;
    line-height: 1.4;
}

@media (max-width: 900px) {
    .recruiter-improve-grid {
        grid-template-columns: 1fr 1fr;
    }
}

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

@media (max-width: 900px) {
    .score-hero,
    .resume-workspace {
        grid-template-columns: 1fr;
    }
    .resume-editor-panel {
        grid-column: auto;
        height: auto;
    }
    .resume-side-panel {
        height: auto;
    }
    .scoring-page .resume-editor {
        min-height: 300px;
        max-height: 60vh;
    }
    .skills-panel {
        flex: 0 0 auto;
    }
    .skill-pill-cloud {
        flex: 0 0 auto;
        max-height: 220px;
    }
}

.preview-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--rm-space-3);
}

/* Equal-width, centered action buttons. */
.preview-actions .ui-button {
    flex: 0 1 220px;
    min-width: 0;
}

/* One shared colour (amber) for all three. Selector is deliberately more
   specific than the global `.has-sidebar .app-content :where(.ui-button--*)`
   action-button system (0,3,0 vs 0,2,0) so it wins even with !important. */
.has-sidebar .app-content .preview-actions .ui-button {
    background: var(--rm-amber-500) !important;
    border-color: var(--rm-amber-500) !important;
    color: #ffffff !important;
}

.has-sidebar .app-content .preview-actions .ui-button:hover:not(:disabled) {
    background: var(--rm-amber-600) !important;
    border-color: var(--rm-amber-600) !important;
}

.preview-actions .ui-button:disabled {
    opacity: 0.55;
}

.scoring-track-action {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 0.55rem 0.85rem;
}

.btn-score-primary,
.btn-score-secondary {
    width: auto;
    min-width: 190px;
}

.enhancer-header {
    display: block;
}

.enhancer-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-5);
}

.enhancer-panel {
    overflow: hidden;
    padding: 0;
}

.enhancer-panel .panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-3);
    padding: var(--rm-space-4) var(--rm-space-5);
    border-bottom: 1px solid var(--rm-border);
    background: var(--rm-navy-50);
}

.panel-title {
    margin: 0;
    color: var(--rm-navy-950);
    font-weight: 800;
}

.panel-step {
    color: var(--rm-blue-700);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.enhancer-panel .panel-body {
    padding: var(--rm-space-5);
}

.resume-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.3rem;
    border-radius: var(--rm-radius-sm);
    background: var(--rm-navy-50);
}

.resume-tab {
    padding: 0.7rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--rm-muted);
    font-weight: 700;
    cursor: pointer;
}

.resume-tab.active {
    background: #ffffff;
    color: var(--rm-blue-700);
    box-shadow: var(--rm-shadow-sm);
}

.saved-resumes {
    display: grid;
    gap: var(--rm-space-3);
    margin-top: var(--rm-space-4);
}

.resume-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: var(--rm-space-3);
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-sm);
    cursor: pointer;
}

.resume-card:hover,
.resume-card.selected {
    border-color: var(--rm-blue-500);
    background: var(--rm-blue-50);
}

.resume-card-name,
.resume-card-meta {
    margin: 0;
}

.resume-card-name {
    color: var(--rm-navy-950);
    font-weight: 800;
}

.resume-card-meta,
.jd-hint,
.char-count,
.upload-zone-hint,
.enhance-hint {
    color: var(--rm-muted);
    font-size: 0.82rem;
}

.resume-card-check {
    color: var(--rm-blue-600);
    opacity: 0;
}

.resume-card.selected .resume-card-check {
    opacity: 1;
}

.upload-zone {
    margin-top: var(--rm-space-4);
    padding: var(--rm-space-8) var(--rm-space-4);
    border: 2px dashed var(--rm-blue-200);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
    text-align: center;
    cursor: pointer;
}

.upload-zone:hover {
    border-color: var(--rm-blue-500);
}

.upload-zone-text {
    color: var(--rm-navy-950);
    font-weight: 800;
}

.jd-textarea {
    width: 100%;
    min-height: 310px;
    padding: var(--rm-space-4);
    resize: vertical;
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
    color: var(--rm-navy-950);
    font: inherit;
    line-height: 1.55;
}

.jd-textarea:focus {
    border-color: var(--rm-blue-500);
    outline: 0;
    box-shadow: 0 0 0 3px rgba(44, 105, 199, 0.12);
}

.char-count {
    text-align: right;
}

.enhancer-bottom {
    display: flex;
    justify-content: center;
}

.btn-enhance-now {
    width: auto;
    min-width: 190px;
}

@media (max-width: 1080px) {
    .score-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Note: the resume editor + Missing Skills panel intentionally stay
       two-column down to 900px (see the max-width:900px block below). An
       older redesign collapsed .resume-workspace here at 1080px, which forced
       the skills panel under the resume on any laptop window narrower than
       1080px — removed so the panel stays on the right until true mobile. */
    .resume-side-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }
}

@media (max-width: 720px) {
    .scoring-page-header {
        display: grid;
    }

    .score-summary-grid,
    .score-improvements-grid,
    .enhancer-grid {
        grid-template-columns: 1fr;
    }

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

    .resume-format-toolbar {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .resume-format-select,
    .resume-format-button {
        flex: 0 0 auto;
    }

    .resume-editor {
        min-height: 480px;
        max-height: 68vh;
        padding: 1rem;
    }

    .preview-actions > * {
        width: 100%;
    }
}

/* Generated documents and career tools */
.career-page {
    display: grid;
    gap: var(--rm-space-5);
}

.career-page .page-header,
.career-page .ip-header-row,
.career-page .ip-results-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rm-space-5);
    margin: 0;
}

.career-page .page-header h1,
.career-page .page-title,
.career-page .ip-header-row h1,
.career-page .ip-results-header h2 {
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: clamp(1.85rem, 3.5vw, 2.65rem);
    font-weight: 500;
    letter-spacing: -0.035em;
}

.career-page .page-header p:last-child,
.career-page .ip-header-row p {
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
}

.career-page .stats-bar {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--rm-space-4);
    margin: 0;
}

.history-page .stats-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.career-page .stat-card,
.career-page .ip-credits-badge {
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface);
    text-align: left;
    box-shadow: var(--rm-shadow-sm);
}

.career-page .stat-card .val,
.career-page .ip-credits-badge .val {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.8rem;
    font-weight: 500;
}

.career-page .stat-card .lbl,
.career-page .ip-credits-badge .lbl {
    color: var(--rm-muted);
    font-size: 0.75rem;
}

.career-page .stat-card.blue {
    border-top: 3px solid var(--rm-blue-600);
}

.career-page .stat-card.amber {
    border-top: 3px solid var(--rm-amber-500);
}

.career-page .stat-card.green {
    border-top: 3px solid var(--rm-success);
}

.career-page .doc-table-card {
    overflow: hidden;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.career-page .table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.career-page table {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
}

.career-page thead {
    background: var(--rm-navy-50);
}

.career-page th {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--rm-border);
    color: var(--rm-muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.career-page td {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--rm-border);
    color: var(--rm-text);
    vertical-align: middle;
}

.career-page tbody tr:last-child td {
    border-bottom: 0;
}

.career-page tbody tr:hover {
    background: var(--rm-blue-50);
    transform: none;
}

.career-page .filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rm-space-2);
    margin: 0;
}

.career-page .filter-btn {
    padding: 0.48rem 0.85rem;
    border: 1px solid var(--rm-border);
    border-radius: 999px;
    background: var(--rm-surface);
    color: var(--rm-muted);
    font-weight: 700;
    cursor: pointer;
}

.career-page .filter-btn:hover,
.career-page .filter-btn.active {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
}

.career-page .status-select,
.career-page .notes-input,
.career-page .date-input,
.career-page .ip-input,
.career-page .ip-select,
.career-page .ip-textarea-jd,
.career-page .ip-textarea {
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
    color: var(--rm-text);
    font: inherit;
}

.career-page .status-select,
.career-page .notes-input,
.career-page .date-input,
.career-page .ip-input,
.career-page .ip-select {
    min-height: 40px;
    padding: 0.55rem 0.7rem;
}

.career-page .notes-input {
    min-width: 180px;
}

.career-page .status-select:focus,
.career-page .notes-input:focus,
.career-page .date-input:focus,
.career-page .ip-input:focus,
.career-page .ip-select:focus,
.career-page .ip-textarea-jd:focus,
.career-page .ip-textarea:focus {
    border-color: var(--rm-blue-500);
    outline: 0;
    box-shadow: var(--rm-focus-ring);
}

.career-page .empty-state {
    padding: var(--rm-space-8);
    color: var(--rm-muted);
    text-align: center;
}

.career-page .empty-state h3 {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.35rem;
    font-weight: 500;
}

.career-page .pagination,
.career-page .recruiter-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--rm-space-2);
    margin-top: var(--rm-space-4);
}

.career-page .pagination a,
.career-page .pagination span,
.career-page .recruiter-pagination a,
.career-page .recruiter-pagination span {
    display: grid;
    min-width: 36px;
    min-height: 36px;
    place-items: center;
    padding: 0.35rem 0.6rem;
    border: 1px solid var(--rm-border);
    border-radius: 8px;
    background: var(--rm-surface);
    color: var(--rm-blue-700);
    text-decoration: none;
}

.career-page .pagination .active,
.career-page .recruiter-pagination .current {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-600);
    color: #ffffff;
}

.recruiters-wrap,
.recruiter-list {
    display: grid;
    gap: var(--rm-space-4);
}

.recruiter-filters,
.summary-bar {
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
}

.recruiter-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: var(--rm-space-4);
}

.filter-group {
    display: grid;
    min-width: 150px;
    gap: 0.35rem;
}

.filter-group label {
    color: var(--rm-navy-800);
    font-size: 0.76rem;
    font-weight: 800;
}

.filter-group input,
.filter-group select {
    min-height: 40px;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
}

.recruiter-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--rm-space-4);
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.recruiter-avatar {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-amber-100);
    color: var(--rm-amber-700);
    font-weight: 800;
}

.recruiter-name {
    color: var(--rm-navy-950);
    font-weight: 800;
}

.recruiter-title,
.recruiter-company,
.recruiter-location,
.contact-row {
    color: var(--rm-muted);
    font-size: 0.86rem;
}

.why-matched,
.contact-row,
.recruiter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rm-space-2);
    margin-top: var(--rm-space-2);
}

.why-tag,
.score-badge,
.contacted-badge {
    padding: 0.3rem 0.55rem;
    border-radius: 999px;
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
    font-size: 0.72rem;
    font-weight: 700;
}

.btn-contact,
.btn-mark,
.btn-filter-apply,
.btn-filter-clear {
    min-height: 38px;
    padding: 0.5rem 0.8rem;
    border: 1px solid var(--rm-blue-600);
    border-radius: var(--rm-radius-sm);
    background: var(--rm-blue-600);
    color: #ffffff;
    font-weight: 700;
    cursor: pointer;
}

.btn-mark,
.btn-filter-clear {
    background: #ffffff;
    color: var(--rm-blue-700);
}

.career-page .ip-job-card,
.career-page .ip-resume-display,
.career-page .ip-credits-summary,
.career-page .ip-answer-area,
.career-page .ip-question-card,
.career-page .ip-q-card,
.career-page .ip-continue-banner {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.career-page .ip-job-card,
.career-page .ip-resume-display,
.career-page .ip-credits-summary,
.career-page .ip-answer-area,
.career-page .ip-question-card,
.career-page .ip-continue-banner {
    padding: var(--rm-space-5);
}

.career-page .ip-job-card,
.career-page .ip-resume-display,
.career-page .ip-continue-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
}

.career-page .ip-job-title,
.career-page .ip-job-context h2,
.career-page .ip-question-text {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.35rem;
}

.career-page .ip-job-company,
.career-page .ip-job-context p {
    color: var(--rm-muted);
}

.career-page .ip-field {
    display: grid;
    gap: 0.4rem;
    margin-bottom: var(--rm-space-4);
}

.career-page .ip-field label,
.career-page .ip-section-label,
.career-page .ip-answer-label {
    color: var(--rm-navy-800);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.career-page .ip-textarea-jd,
.career-page .ip-textarea {
    width: 100%;
    min-height: 180px;
    padding: var(--rm-space-4);
    resize: vertical;
}

.career-page .ip-credits-math {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.75rem, 4vw, 2rem);
}

.career-page .ip-credits-item {
    text-align: center;
}

.career-page .ip-credits-item .val {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.7rem;
}

.career-page .ip-credits-item .lbl,
.career-page .ip-credit-note {
    color: var(--rm-muted);
    font-size: 0.75rem;
}

.career-page .ip-credits-summary-label {
    margin-bottom: var(--rm-space-4);
    color: var(--rm-success);
    font-weight: 800;
    text-align: center;
}

.career-page .ip-cta-grid,
.career-page .ip-start-action,
.career-page .ip-nav,
.career-page .ip-actions,
.career-page .ip-results-topbar,
.career-page .ip-topbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--rm-space-3);
}

.career-page .ip-topbar,
.career-page .ip-results-topbar {
    justify-content: space-between;
}

.career-page .ip-progress-section {
    padding: var(--rm-space-4);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
}

.career-page .ip-progress-row {
    display: flex;
    justify-content: space-between;
    color: var(--rm-blue-700);
    font-size: 0.8rem;
    font-weight: 800;
}

.career-page .ip-progress-track {
    height: 8px;
    margin-top: var(--rm-space-2);
    overflow: hidden;
    border-radius: 999px;
    background: var(--rm-blue-100);
}

.career-page .ip-progress-fill {
    height: 100%;
    border-radius: inherit;
    background: var(--rm-blue-600);
}

.career-page .ip-type-badge,
.career-page .ip-q-badge {
    display: inline-flex;
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    background: var(--rm-amber-100);
    color: var(--rm-amber-700);
    font-size: 0.72rem;
    font-weight: 800;
}

.career-page .ip-answer-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.career-page .ip-answer-col {
    padding: var(--rm-space-4);
    border-radius: var(--rm-radius-md);
    background: var(--rm-navy-50);
}

.career-page .ip-coached-col {
    background: var(--rm-blue-50);
}

.career-page .ip-q-header {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: var(--rm-space-4);
    padding: var(--rm-space-4) var(--rm-space-5);
    cursor: pointer;
}

.career-page .ip-q-body {
    display: none;
    padding: 0 var(--rm-space-5) var(--rm-space-5);
}

.career-page .ip-q-card.open .ip-q-body {
    display: block;
}

.career-page .ip-coaching-notes {
    margin-top: var(--rm-space-4);
    padding: var(--rm-space-4);
    border-radius: var(--rm-radius-md);
    background: var(--rm-amber-50);
}

.career-page .ip-notes-grid {
    display: grid;
    gap: var(--rm-space-2);
    margin-top: var(--rm-space-2);
}

.career-page .ip-note-check {
    color: var(--rm-success);
}

@media (max-width: 760px) {
    .career-page .stats-bar,
    .history-page .stats-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .recruiter-card,
    .career-page .ip-answer-cols {
        grid-template-columns: 1fr;
    }

    .recruiter-avatar {
        display: none;
    }

    .career-page .ip-job-card,
    .career-page .ip-resume-display,
    .career-page .ip-continue-banner {
        align-items: flex-start;
        flex-direction: column;
    }

    .career-page .ip-credits-math {
        align-items: stretch;
        flex-direction: column;
    }

    .career-page .ip-credits-operator {
        display: none;
    }
}

/* Corrections based on the rendered workflow screenshot. */
.search-page .checkbox-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem 1.1rem;
    overflow: visible;
}

.search-page .search-choice-group + .search-choice-group {
    border-left: 0;
}

.search-page :where(.section-label, .search-optional-heading) {
    padding-bottom: 0;
    border-bottom: 0;
}

.search-page .checkbox-group label {
    width: auto !important;
    height: 28px;
    min-width: 0 !important;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto !important;
    gap: 0.4rem;
    margin: 0;
    padding: 0 !important;
    overflow: visible;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0.72rem;
    line-height: 1;
    white-space: nowrap;
}

.search-page .checkbox-group label input[type="checkbox"] {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px;
    max-width: 15px;
    flex: 0 0 15px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.history-page.career-page th:nth-child(3),
.history-page.career-page td:nth-child(3) {
    position: relative;
    left: -22px;
}

.history-page.career-page th:nth-child(4),
.history-page.career-page td:nth-child(4) {
    position: relative;
    left: 10px;
}

.interview-page .ip-application-intro {
    margin-right: 0;
    margin-left: 0;
}

.interview-page .ip-application-form {
    width: min(92%, 960px);
    max-width: 960px;
    min-width: 680px;
    grid-template-columns: minmax(0, 1fr) 190px;
    align-items: center;
    margin-right: 0;
    margin-left: 0;
}

.interview-page .ip-application-field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.55rem;
}

.interview-page .ip-application-field label {
    margin: 0;
    white-space: nowrap;
}

.interview-page .ip-application-field .ip-select,
.interview-page .ip-application-form .ip-start-action,
.interview-page .ip-application-form .ip-start-action .btn {
    height: 38px;
    min-height: 38px;
    margin: 0;
}

@media (max-width: 760px) {
    .history-page.career-page th:nth-child(3),
    .history-page.career-page td:nth-child(3),
    .history-page.career-page th:nth-child(4),
    .history-page.career-page td:nth-child(4) {
        left: 0;
    }

    .interview-page .ip-application-form {
        width: 100%;
        min-width: 0;
        grid-template-columns: 1fr;
    }

    .interview-page .ip-application-field {
        grid-template-columns: 1fr;
    }
}

/* Precision alignment pass for the reviewed workflow pages. */
.search-page .divider {
    display: none;
}

.search-page .search-section-heading {
    margin-top: 0.75rem;
}

.search-page .search-choice-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.search-page .radio-group {
    display: grid;
    grid-template-columns: repeat(3, minmax(105px, 1fr));
    gap: 0.35rem;
}

.search-page .board-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
}

.search-page :where(
    .radio-group label,
    .board-item,
    .checkbox-group label
) {
    height: 32px;
    min-height: 32px;
    margin: 0;
    padding: 0 0.55rem;
    font-size: 0.72rem;
    line-height: 1;
}

.search-page :where(
    .radio-group input,
    .board-item input,
    .checkbox-group input
) {
    width: 14px;
    height: 14px;
    margin: 0;
    flex: 0 0 auto;
}

.search-page .search-optional-heading {
    justify-content: flex-start;
    gap: 1rem;
    margin-top: 0.8rem;
}

.search-page .search-optional-heading > div:last-child {
    flex: 0 0 auto;
}

.search-page .checkbox-group {
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.history-page.career-page th {
    text-align: center;
}

.history-page.career-page th:first-child,
.history-page.career-page th:nth-child(2) {
    text-align: left;
}

.history-page.career-page td:nth-child(3) {
    text-align: center;
}

.history-page.career-page td:nth-child(4) {
    padding-left: 0.9rem;
    text-align: left;
}

.history-page.career-page th:last-child {
    padding-right: 34px;
    text-align: center;
}

.tracker-page.career-page table {
    border-collapse: separate;
    border-spacing: 0;
}

.tracker-page.career-page th {
    text-align: center;
}

.tracker-page.career-page tbody tr[data-id] > td {
    border-top: 0 !important;
    border-bottom: 0 !important;
}

.tracker-page.career-page tbody tr[data-id] + tr[data-id] > td {
    padding-top: 0.7rem;
}

.tracker-page .tracker-progress-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 0.15rem;
    color: var(--rm-subtle);
    font-size: 0.6rem;
    font-weight: 600;
    text-align: center;
    text-transform: none;
}

.tracker-page .tracker-progress-cell {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 0.5rem;
}

.tracker-page .row-actions > .btn-history,
.tracker-page .row-actions > .btn-interview-prep {
    font-size: 0.7rem;
}

.interview-page .ip-application-intro {
    width: min(88%, 900px);
    max-width: 900px;
    margin-inline: auto;
}

.interview-page .ip-application-form {
    width: min(88%, 900px);
    max-width: 900px;
    min-width: 620px;
    grid-template-columns: minmax(0, 1fr) 190px;
    align-items: end;
    margin-inline: auto;
}

.interview-page .ip-application-form .ip-select,
.interview-page .ip-application-form .ip-start-action .btn {
    height: 38px;
    min-height: 38px;
}

.interview-page .ip-application-form .ip-start-action {
    height: 38px;
    display: flex;
    align-items: stretch;
}

.interview-page .ip-application-form .ip-start-action .btn {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 760px) {
    .search-page .search-choice-panel,
    .search-page .radio-group,
    .search-page .board-list {
        grid-template-columns: 1fr;
    }

    .search-page .search-optional-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.4rem;
    }

    .interview-page .ip-application-intro,
    .interview-page .ip-application-form {
        width: 100%;
        min-width: 0;
    }

    .interview-page .ip-application-form {
        grid-template-columns: 1fr;
    }
}

/* Final control consistency and alignment pass. */
.search-page .search-choice-panel {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 1rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface-soft);
}

.search-page .search-choice-group {
    min-width: 0;
}

.search-page .search-choice-group + .search-choice-group {
    padding-left: 1rem;
    border-left: 1px solid var(--rm-border);
}

.search-page :where(.radio-group, .board-list, .checkbox-group) {
    display: flex;
    flex-flow: row wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.search-page :where(
    .radio-group label,
    .board-item,
    .checkbox-group label
) {
    width: auto;
    min-width: 0;
    min-height: 32px;
    flex: 0 0 auto;
    gap: 0.35rem;
    padding: 0.3rem 0.55rem;
    border-radius: 7px;
    font-size: 0.72rem;
    line-height: 1;
    white-space: nowrap;
}

.search-page .board-badge,
.search-page .board-soon {
    font-size: 0.62rem;
}

.search-page .ui-badge {
    min-height: 30px;
    padding: 0.3rem 0.55rem;
    font-size: 0.7rem;
}

.upload-resume-page .ui-page-header {
    margin-bottom: 1rem;
}

.upload-resume-page .upload-library,
.upload-resume-page .upload-intro-alert {
    margin-bottom: 0.9rem;
}

.upload-resume-page .upload-role-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.history-page.career-page th,
.history-page.career-page td {
    padding: 0.52rem 0.55rem;
    vertical-align: middle;
}

.history-page.career-page th:nth-child(3),
.history-page.career-page td:nth-child(3),
.history-page.career-page th:last-child,
.history-page.career-page td:last-child {
    text-align: center;
}

.history-page .history-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px;
    align-items: start;
    gap: 0.3rem;
}

.history-page .history-action-links {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.25rem;
}

.history-page .history-action-links :where(a, button, .ui-button, .btn-outline) {
    width: 100%;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.35rem !important;
    font-size: 0.67rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

.history-page .history-delete-form {
    margin: 0;
}

.history-page .history-delete-button {
    width: 28px;
    min-width: 28px;
    min-height: 28px;
    display: grid;
    margin: 0;
    padding: 0;
    place-items: center;
    border: 1px solid var(--rm-border);
    border-radius: 6px;
    background: var(--rm-surface);
    color: var(--rm-subtle);
    cursor: pointer;
}

.history-page .history-delete-button:hover {
    border-color: var(--rm-danger);
    background: var(--rm-danger-soft);
    color: var(--rm-danger);
}

.tracker-page.career-page th,
.tracker-page.career-page td {
    padding: 0.55rem;
    vertical-align: middle;
}

.tracker-page.career-page th:nth-child(2),
.tracker-page.career-page td:nth-child(2),
.tracker-page.career-page th:last-child,
.tracker-page.career-page td:last-child {
    text-align: center;
}

.tracker-page .tracker-progress-cell {
    gap: 0.5rem;
}

.tracker-page .row-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    gap: 0.25rem;
}

.tracker-page .row-actions > .btn-history {
    width: 100%;
    min-height: 30px;
    margin: 0;
    padding: 0.3rem 0.4rem;
    font-size: 0.7rem;
}

.tracker-page .row-actions > .btn-remove {
    grid-column: 2;
    grid-row: 1;
}

.tracker-page .row-actions > .btn-interview-prep {
    grid-column: 1;
    grid-row: 2;
}

.interview-page .ip-application-intro {
    max-width: 760px;
    flex-wrap: nowrap;
}

.interview-page .ip-application-form {
    width: min(76%, 760px);
    min-width: 560px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.65rem;
}

.interview-page .ip-application-field {
    min-width: 0;
    margin: 0;
}

.interview-page .ip-application-form .ip-start-action {
    margin: 0;
}

.interview-page .ip-application-form .ip-start-action .btn {
    min-height: 36px;
    margin: 0;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .search-page .search-choice-panel {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }

    .search-page .search-choice-group + .search-choice-group {
        padding-top: 0.65rem;
        padding-left: 0;
        border-top: 1px solid var(--rm-border);
        border-left: 0;
    }

    .upload-resume-page .upload-role-grid {
        grid-template-columns: 1fr;
    }

    .interview-page .ip-application-form {
        width: 100%;
        min-width: 0;
        grid-template-columns: 1fr;
    }
}

/* ========================================================================
   Compact workflow corrections
   Keep these rules last so older page-specific polish cannot re-expand the
   user workflows or reintroduce nested/horizontal scrolling.
   ======================================================================== */

.search-page .search-location-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.search-page .checkbox-group {
    flex-wrap: wrap;
    overflow-x: visible;
    scrollbar-width: auto;
}

.search-page .checkbox-group label {
    flex: 0 1 auto;
}

.history-page.career-page .stats-bar {
    gap: 0;
}

.history-page.career-page .stat-card {
    min-height: 46px;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
}

.history-page.career-page .stat-card .val {
    font-size: 1.15rem;
}

.profile-page .profile-stat {
    min-height: 44px;
    padding: 0.45rem 0.7rem;
}

.notifications-page .notif-list {
    gap: 0.4rem;
}

.notifications-page .notif-card {
    padding: 0.55rem 0.75rem;
}

.notifications-page .notif-header {
    min-height: 0;
    padding: 0;
}

/* Application Tracker never requires a horizontal table scroll. */
.tracker-page.career-page .table-scroll {
    overflow-x: visible;
}

.tracker-page.career-page table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

@media (max-width: 900px) {
    .tracker-page.career-page table {
        min-width: 0;
        table-layout: fixed;
    }

    .search-page .search-location-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .search-page .search-location-grid {
        grid-template-columns: 1fr;
    }

    .tracker-page.career-page table,
    .tracker-page.career-page tbody {
        display: block;
    }

    .tracker-page.career-page thead {
        display: none;
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.5rem;
        margin-bottom: 0.65rem;
        padding: 0.7rem;
        border: 1px solid var(--rm-border);
        border-radius: var(--rm-radius-md);
        background: var(--rm-surface);
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] > td {
        display: block;
        padding: 0;
        border: 0;
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] > td:nth-child(n + 3) {
        grid-column: 1 / -1;
    }

    .tracker-page .tracker-progress-cell {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .tracker-page.career-page .status-select,
    .tracker-page.career-page .date-input {
        width: 100%;
        max-width: none;
    }

    .tracker-page .row-actions {
        justify-content: flex-start;
    }

    .tracker-page.career-page .history-row {
        display: block;
        margin: -0.4rem 0 0.65rem;
    }

    .tracker-page.career-page .history-row > td {
        display: block;
        padding: 0;
        border: 0;
    }
}

/* ========================================================================
   Compact authenticated workspace

   User-facing workflows prioritize information density and a single page
   scroll. Admin surfaces are intentionally excluded.
   ======================================================================== */

.has-sidebar .ui-page:not(.admin-page) {
    padding-top: 1rem;
    padding-bottom: 1.5rem;
}

.has-sidebar :where(
    .career-page,
    .account-page,
    .scoring-page,
    .enrich-wrap
) {
    gap: 0.85rem;
}

.has-sidebar :where(
    .ui-page-header,
    .career-page .page-header,
    .career-page .ip-header-row,
    .account-page .page-header,
    .scoring-page-header
) {
    margin-bottom: 0.75rem;
}

.has-sidebar .ui-page-kicker {
    margin-bottom: 0.2rem;
}

.has-sidebar :where(
    .ui-page-description,
    .career-page .page-header p:last-child,
    .career-page .ip-header-row p,
    .account-page .page-header p:last-child,
    .scoring-page-subtitle
) {
    margin-top: 0.25rem;
}

.has-sidebar .ui-card--padded {
    padding: 0.9rem 1rem;
}

/* Analysis: bounded, self-scrolling editor. (Height cap set further below.) */
.scoring-page .resume-editor {
    min-height: 260px;
    overflow-y: auto;
    padding: 1.2rem 1.4rem;
}

/* One font style throughout the resume: every element (headings, and any
   inline font tags baked into a saved resume) inherits the editor's single
   font. Sizes may differ; the style never switches to the serif face. */
.resume-editor h1,
.resume-editor h2,
.resume-editor h3 {
    font-family: inherit;
}

.resume-editor * {
    font-family: inherit !important;
}

/* Keep the Font and Font size selects compact so the whole toolbar
   (both dropdowns plus every button) fits on a single row. */
.scoring-page .resume-format-toolbar {
    gap: 0.35rem;
}

.scoring-page .resume-format-select {
    max-width: 104px;
}

.scoring-page .resume-format-select,
.scoring-page .resume-format-button {
    min-height: 32px;
}

.scoring-page .resume-side-panel {
    position: static;
    max-height: none;
    overflow-y: visible;
}

.scoring-page .score-summary-grid {
    gap: 0.65rem;
}

.scoring-page .score-summary-section {
    padding: 0.75rem;
}

.scoring-page .score-improvements-grid,
.scoring-page .resume-workspace {
    gap: 0.8rem;
}

.scoring-page .improvement-card,
.scoring-page .resume-editor-panel {
    padding: 0.85rem;
}

/* Upload Resume */
.upload-resume-page.ui-page--narrow {
    max-width: 900px;
}

.upload-resume-page .ui-page-header,
.upload-resume-page .upload-library {
    margin-bottom: 0.75rem;
}

.upload-resume-page .upload-resume-row {
    gap: 0.75rem;
    padding: 0.55rem 0;
}

.upload-resume-page .upload-resume-icon {
    width: 36px;
    height: 36px;
    font-size: 1rem;
}

.upload-resume-page .upload-resume-info h3 {
    margin-bottom: 0.15rem;
}

.upload-resume-page .upload-form-card {
    margin-top: 0.75rem;
}

.upload-resume-page .ui-section-header {
    margin-bottom: 0.5rem;
}

.upload-resume-page .upload-form-step {
    margin: 0.4rem 0 0.6rem;
}

.upload-resume-page .upload-role-field {
    margin-top: 0.65rem;
}

.upload-resume-page .upload-file-step {
    margin-top: 0.85rem;
    padding-top: 0.75rem;
}

.upload-resume-page .upload-area {
    min-height: 118px;
    padding: 0.8rem;
}

.upload-resume-page .upload-icon {
    width: 38px;
    height: 38px;
    margin-bottom: 0.35rem;
    font-size: 1.05rem;
}

.upload-resume-page .upload-btn {
    margin-top: 0.75rem;
}

/* Job Search */
.search-page {
    max-width: 1080px;
}

.search-page .search-form-card {
    padding: 0.9rem 1rem;
}

.search-page .session-bar,
.search-page .search-tip {
    margin-bottom: 0.65rem;
    padding: 0.65rem 0.8rem;
}

.search-page .search-section-heading {
    margin: 0.25rem 0 0.65rem;
}

.search-page .search-section-heading > span {
    width: 24px;
    height: 24px;
}

.search-page .row {
    gap: 0.75rem;
}

.search-page .form-group {
    gap: 0.3rem;
    margin-bottom: 0.5rem;
}

.search-page :where(input[type="text"], input[type="time"], select) {
    min-height: 38px;
}

.search-page .divider {
    margin: 0.8rem 0;
}

.search-page .search-preference-grid > div {
    padding: 0.65rem;
}

.search-page .radio-group label,
.search-page .checkbox-group label,
.search-page .board-item {
    min-height: 34px;
    padding: 0.35rem 0.55rem;
    font-size: 0.8rem;
}

.search-page #autorun-config {
    margin-top: 0.55rem !important;
    padding: 0.65rem;
}

/* Document History */
.history-page .stats-bar {
    display: flex;
    max-width: 760px;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface);
}

.history-page.career-page .stat-card {
    min-height: 46px;
    flex: 1;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
    border: 0;
    border-right: 1px solid var(--rm-border);
    border-radius: 0;
    box-shadow: none;
}

.history-page.career-page .stat-card:last-child {
    border-right: 0;
}

.history-page.career-page .stat-card .val {
    font-size: 1.15rem;
}

.history-page .doc-table-card table {
    min-width: 720px;
}

.history-page.career-page th,
.history-page.career-page td {
    padding: 0.5rem 0.65rem;
}

.history-role-link {
    display: -webkit-box;
    overflow: hidden;
    color: var(--rm-navy-950);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.25;
    text-decoration: none;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.history-company {
    overflow: hidden;
    margin-top: 0.1rem;
    color: var(--rm-muted);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history-actions {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    flex-wrap: nowrap;
}

.history-actions :where(.ui-button, .btn-outline) {
    min-height: 30px;
    padding: 0.3rem 0.45rem !important;
    font-size: 0.7rem !important;
    white-space: nowrap;
}

/* Application Tracker */
.tracker-page.ui-page {
    max-width: var(--rm-content-max);
    padding-top: 1rem;
}

.tracker-page.career-page table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.tracker-page.career-page th,
.tracker-page.career-page td {
    padding: 0.5rem 0.55rem;
    font-size: 0.76rem;
}

.tracker-page .role-title {
    display: -webkit-box;
    overflow: hidden;
    font-size: 0.78rem;
    line-height: 1.25;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.tracker-page .role-sub {
    overflow: hidden;
    font-size: 0.7rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tracker-page .tracker-progress-cell {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.tracker-page.career-page .status-select,
.tracker-page.career-page .date-input {
    width: min(100%, 132px);
    min-width: 0;
    min-height: 32px;
    padding: 0.3rem 0.45rem;
    font-size: 0.7rem;
}

.tracker-page .notes-input {
    min-width: 0;
    max-width: none;
    min-height: 32px;
}

.tracker-page .row-actions {
    gap: 0.3rem;
    flex-wrap: wrap;
}

.tracker-page .btn-history,
.tracker-page .btn-remove {
    min-height: 30px;
    padding: 0.3rem 0.45rem;
    font-size: 0.68rem;
    text-decoration: none;
}

.tracker-page .history-panel {
    padding: 0.75rem 0.9rem;
}

.tracker-page .history-layout {
    grid-template-columns: minmax(220px, 0.8fr) minmax(320px, 1.2fr);
    gap: 1rem;
}

.tracker-page .timeline-item {
    padding-bottom: 0.55rem;
}

.tracker-page .activity-form {
    grid-template-columns: minmax(150px, 1fr) 130px minmax(180px, 1.2fr) auto;
    gap: 0.45rem;
}

.tracker-page .activity-note,
.tracker-page .activity-submit,
.tracker-page .activity-message {
    grid-column: auto;
}

.tracker-page .activity-submit {
    align-self: end;
    white-space: nowrap;
}

/* Find Recruiters */
.recruiters-wrap,
.recruiter-list {
    gap: 0.65rem;
}

.recruiters-page .summary-bar,
.recruiters-page .recruiter-filters {
    padding: 0.65rem 0.8rem;
}

.recruiters-page .recruiter-filters {
    gap: 0.65rem;
}

.recruiters-page .filter-group input,
.recruiters-page .filter-group select {
    min-height: 34px;
}

.recruiters-page .recruiter-card {
    gap: 0.75rem;
    padding: 0.65rem 0.8rem;
}

.recruiters-page .recruiter-avatar {
    width: 38px;
    height: 38px;
    font-size: 0.78rem;
}

.recruiters-page .recruiter-info {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.15rem 0.7rem;
}

.recruiters-page .recruiter-name {
    flex-basis: 100%;
    font-size: 0.85rem;
}

.recruiters-page :where(
    .recruiter-title,
    .recruiter-company,
    .recruiter-location,
    .contact-row
) {
    margin: 0;
    font-size: 0.74rem;
}

.recruiters-page .why-matched {
    margin-top: 0.15rem;
}

.recruiters-page .why-tag,
.recruiters-page .score-badge {
    padding: 0.2rem 0.4rem;
    font-size: 0.65rem;
}

.recruiters-page .btn-contact {
    min-height: 32px;
    padding: 0.35rem 0.65rem;
}

/* Interview Prep */
.interview-page .ip-job-card,
.interview-page .ip-continue-banner {
    padding: 0.7rem 0.85rem;
}

.interview-page .ip-job-title {
    font-size: 1rem;
}

.interview-page .ip-job-card-right {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
}

.interview-page .ip-job-stat-val {
    font-size: 1.15rem;
}

.interview-page .ip-job-stat-sub {
    font-size: 0.7rem;
}

.interview-page .ip-field {
    margin-bottom: 0.65rem;
}

.interview-page .ip-select {
    min-height: 36px;
}

.interview-page .ip-credit-note {
    margin-top: 0.35rem;
    text-align: center;
}

/* Profile */
.profile-page.account-page {
    gap: 0.7rem;
}

.profile-page .profile-grid {
    gap: 0.7rem;
}

.profile-page .profile-card,
.profile-page .profile-security {
    padding: 0.7rem 0.85rem;
}

.profile-page .profile-activity {
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
}

.profile-page .profile-stat {
    min-height: 44px;
    padding: 0.45rem 0.7rem;
    border: 0;
    border-right: 1px solid var(--rm-border);
    border-radius: 0;
    box-shadow: none;
}

.profile-page .profile-stat:last-child {
    border-right: 0;
}

/* Notifications */
.notifications-page .notif-list {
    gap: 0.4rem;
}

.notifications-page .notif-card {
    padding: 0.55rem 0.75rem;
}

.notifications-page .notif-header {
    align-items: center;
}

.notifications-page .notif-body {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
}

.notifications-page .notif-title {
    font-size: 0.8rem;
    white-space: nowrap;
}

.notifications-page .notif-message,
.notifications-page .notif-time {
    margin: 0;
    font-size: 0.74rem;
}

.notifications-page .notif-time {
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .tracker-page.career-page table {
        table-layout: auto;
    }

    .tracker-page.career-page .table-scroll {
        overflow-x: auto;
    }

    .tracker-page.career-page table {
        min-width: 760px;
    }

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

    .tracker-page .activity-note,
    .tracker-page .activity-message {
        grid-column: 1 / -1;
    }

    .tracker-page .activity-submit {
        grid-column: auto;
    }
}

@media (max-width: 760px) {
    .has-sidebar .ui-page:not(.admin-page) {
        padding-top: 0.75rem;
    }

    .history-page .stats-bar {
        width: 100%;
    }

    .history-page.career-page .stat-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .tracker-page .history-layout,
    .tracker-page .activity-form {
        grid-template-columns: 1fr;
    }

    .tracker-page .activity-note,
    .tracker-page .activity-submit,
    .tracker-page .activity-message {
        grid-column: 1;
    }

    .notifications-page .notif-body {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }

    .notifications-page .notif-time {
        text-align: left;
    }
}

/* ------------------------------------------------------------------------
   UI quality follow-up — remove redundant summaries and tighten data cards
   ------------------------------------------------------------------------ */

/* Give the skyline its own visual breathing room above the journey card. */
.mock-journey {
    margin-top: 50px;
}

/* Show the complete regional artwork. The previous negative bottom offset
   deliberately pushed 91px below the header and cut the skyline at its base. */
.mock-dashboard-heading {
    min-height: 280px;
}

.mock-dashboard-landscape {
    inset: 0 0 0 38%;
}

.mock-dashboard-landscape img {
    right: 0;
    bottom: 0;
    width: 760px;
    height: 280px;
    object-position: bottom right;
}

.mock-journey {
    position: relative;
    z-index: 2;
    margin-top: -24px;
}

.mock-dashboard-intro {
    position: relative;
    z-index: 2;
    width: min(62%, 680px);
}

.has-sidebar .mock-hero-announcement {
    min-width: 0;
    min-height: 140px;
    display: flex;
    align-items: center;
    margin: 18px 0 0;
    padding: 18px 22px;
    border: 1px solid #26335f;
    border-radius: 12px;
    background: #111a40;
    box-shadow: 0 8px 22px rgba(17, 26, 64, 0.2);
}

.has-sidebar .mock-hero-announcement .dash-slide {
    width: 100%;
}

.has-sidebar .mock-hero-announcement .dash-slide-headline {
    margin: 0;
    color: #ffffff;
    font-size: 0.92rem;
    line-height: 1.5;
}

.has-sidebar .mock-hero-announcement .dash-hl {
    color: #f0a500;
}

.has-sidebar .mock-hero-announcement .dash-slide-link {
    display: inline-block;
    margin-top: 4px;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 700;
    text-underline-offset: 2px;
}

/* Profile activity cards: one compact horizontal metric per card. */
.profile-stat {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.65rem 0.9rem;
}

.profile-stat strong {
    font-size: 1.35rem;
    line-height: 1;
}

.profile-stat span {
    line-height: 1.2;
}

/* Document History metrics match the compact Tracker metric treatment. */
.history-page.career-page .stats-bar {
    gap: 0.75rem;
}

.history-page.career-page .stat-card {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.65rem 0.9rem;
    text-align: center;
}

.history-page.career-page .stat-card .val {
    font-size: 1.4rem;
    line-height: 1;
}

.history-page.career-page .stat-card .lbl {
    margin: 0;
    line-height: 1.2;
}

/* Legacy notification styles padded the header inside an already padded card. */
.notifications-page .notif-list {
    gap: 0.45rem;
}

.notifications-page .notif-card {
    padding: 0.55rem 0.8rem;
}

.notifications-page .notif-header {
    min-height: 0;
    align-items: center;
    gap: 0.45rem;
    padding: 0;
}

.notifications-page .notif-title {
    margin-bottom: 0.1rem;
    font-size: 0.82rem;
    line-height: 1.2;
}

.notifications-page .notif-message {
    margin: 0;
    font-size: 0.76rem;
    line-height: 1.3;
}

.notifications-page .notif-time {
    margin-top: 0.15rem;
    font-size: 0.68rem;
    line-height: 1.2;
}

.notifications-page .notif-icon:empty {
    display: none;
}

@media (max-width: 680px) {
    .mock-dashboard-heading {
        min-height: 290px;
    }

    .mock-dashboard-landscape {
        inset: 112px -24px 0 26%;
    }

    .mock-dashboard-landscape img {
        width: 410px;
        height: 178px;
    }

    .mock-journey {
        margin-top: 0;
    }

    .mock-dashboard-intro {
        width: 100%;
    }

    .has-sidebar .mock-hero-announcement {
        margin-top: 18px;
    }

    .profile-stat,
    .history-page.career-page .stat-card {
        justify-content: flex-start;
    }
}

/* Public account support and result pages */
.public-form-page,
.auth-wrap {
    display: grid;
    min-height: calc(100vh - 150px);
    padding: var(--rm-page-gutter);
    place-items: center;
}

.public-form-card,
.auth-card,
.account-result-card {
    width: min(100%, 520px);
    margin: clamp(2rem, 8vh, 5rem) auto;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-xl);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-md);
    text-align: left;
}

.public-form-card h1,
.public-form-card h2,
.auth-card h1,
.account-result-card h2 {
    margin: 0 0 var(--rm-space-2);
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-weight: 500;
    letter-spacing: -0.025em;
}

.public-form-card > p,
.auth-card > p,
.account-result-card > p {
    color: var(--rm-muted);
    line-height: 1.6;
}

.public-form-card .form-group,
.auth-card .form-group {
    display: grid;
    gap: 0.4rem;
    margin: var(--rm-space-4) 0;
}

.public-form-card label,
.auth-card label {
    color: var(--rm-navy-800);
    font-size: 0.8rem;
    font-weight: 800;
}

.public-form-card input,
.auth-card input {
    width: 100%;
    min-height: 46px;
    padding: 0.65rem 0.8rem;
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
    font: inherit;
}

.public-form-card input:focus,
.auth-card input:focus {
    border-color: var(--rm-blue-500);
    outline: 0;
    box-shadow: var(--rm-focus-ring);
}

.public-form-card .btn-submit,
.auth-card .btn-verify {
    width: 100%;
    min-height: 46px;
    border: 0;
    border-radius: var(--rm-radius-sm);
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
    font-weight: 800;
    cursor: pointer;
}

.public-form-card .back-link,
.auth-card .resend-form {
    margin-top: var(--rm-space-4);
    text-align: center;
}

.verify-container.public-form-card,
.account-result-card {
    text-align: center;
}

.account-result-card .action-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--rm-space-3);
    margin-top: var(--rm-space-5);
}

.account-result-card .credits-awarded {
    margin: var(--rm-space-5) 0;
    padding: var(--rm-space-5);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
}

.account-result-card .credits-awarded .amount {
    color: var(--rm-blue-700);
    font-family: var(--rm-font-display);
    font-size: 2.5rem;
}

.error-page {
    min-height: 60vh;
    place-content: center;
    text-align: center;
}

/* Administration */
.admin-page {
    display: grid;
    gap: var(--rm-space-5);
}

.admin-page .admin-nav {
    display: flex;
    max-width: 100%;
    gap: var(--rm-space-2);
    padding: 0.35rem;
    overflow-x: auto;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: var(--rm-surface);
}

.admin-page .admin-nav a {
    flex: 0 0 auto;
    padding: 0.6rem 0.85rem;
    border-radius: 9px;
    color: var(--rm-muted);
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
}

.admin-page .admin-nav a:hover,
.admin-page .admin-nav a.active {
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
}

.admin-page .page-header,
.admin-page .admin-header,
.admin-page .ff-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rm-space-4);
    margin: 0;
}

.admin-page .page-header h2,
.admin-page .admin-header h2,
.admin-page .ff-header h1 {
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: clamp(1.8rem, 3vw, 2.5rem);
    font-weight: 500;
    letter-spacing: -0.03em;
}

.admin-page .stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.admin-page .stat-card,
.admin-page .chart-card,
.admin-page .recent-card,
.admin-page .users-card,
.admin-page .create-card,
.admin-page .codes-card,
.admin-page .ff-card {
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.admin-page .stat-card {
    padding: var(--rm-space-5);
}

.admin-page .stat-value {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.8rem;
}

.admin-page .stat-label {
    color: var(--rm-muted);
    font-size: 0.75rem;
}

.admin-page .chart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.admin-page .chart-card,
.admin-page .recent-card,
.admin-page .create-card,
.admin-page .ff-card {
    padding: var(--rm-space-5);
}

.admin-page .users-table-scroll,
.admin-page .codes-card {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.admin-page table {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

.admin-page thead {
    background: var(--rm-navy-50);
}

.admin-page th,
.admin-page td {
    padding: 0.8rem;
    border-bottom: 1px solid var(--rm-border);
    text-align: left;
}

.admin-page th {
    color: var(--rm-muted);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.admin-page .form-row,
.admin-page .form-row-2 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.admin-page .form-row-2 {
    grid-template-columns: 2fr 1fr;
}

.admin-page .form-group {
    display: grid;
    gap: 0.35rem;
}

.admin-page input,
.admin-page select,
.admin-page textarea {
    min-height: 40px;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--rm-border-strong);
    border-radius: var(--rm-radius-sm);
    background: #ffffff;
    color: var(--rm-text);
    font: inherit;
}

.admin-page input:focus,
.admin-page select:focus,
.admin-page textarea:focus {
    border-color: var(--rm-blue-500);
    outline: 0;
    box-shadow: var(--rm-focus-ring);
}

.admin-page .ff-list {
    display: grid;
    gap: var(--rm-space-4);
}

.admin-page .ff-state-btn,
.admin-page .action-btn,
.admin-page .btn-add,
.admin-page .btn-remove {
    min-height: 36px;
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--rm-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--rm-navy-800);
    font-weight: 700;
    cursor: pointer;
}

.admin-page .ff-state-btn.active,
.admin-page .btn-add {
    border-color: var(--rm-blue-600);
    background: var(--rm-blue-600);
    color: #ffffff;
}

@media (max-width: 900px) {
    .admin-page .stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-page .form-row,
    .admin-page .form-row-2 {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .admin-page .chart-grid,
    .admin-page .stat-grid {
        grid-template-columns: 1fr;
    }
}

.admin-page .admin-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.admin-page .announcement-form-row {
    display: grid;
    gap: var(--rm-space-3);
    margin-bottom: var(--rm-space-4);
}

.admin-page .announcement-form-row--primary {
    grid-template-columns: 80px minmax(0, 1fr) minmax(0, 1fr);
}

.admin-page .announcement-form-row--secondary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 90px 90px;
}

.admin-page .announcement-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rm-space-4);
}

.admin-page .announcement-card-copy {
    min-width: 0;
    flex: 1;
    overflow-wrap: anywhere;
}

.admin-page .announcement-card-actions {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: var(--rm-space-2);
}

@media (max-width: 900px) {
    .admin-page .announcement-form-row--primary,
    .admin-page .announcement-form-row--secondary {
        grid-template-columns: 1fr 1fr;
    }

    .admin-page .announcement-form-row--primary > :first-child {
        grid-column: 1 / -1;
        max-width: 110px;
    }
}

@media (max-width: 560px) {
    .admin-page .announcement-form-row--primary,
    .admin-page .announcement-form-row--secondary {
        grid-template-columns: 1fr;
    }

    .admin-page .announcement-form-row--primary > :first-child {
        grid-column: auto;
    }

    .admin-page .announcement-card-header {
        flex-direction: column;
    }

    .admin-page .announcement-card-actions,
    .admin-page .announcement-card-actions form,
    .admin-page .announcement-card-actions button {
        width: 100%;
    }
}

/* Site-wide responsive safety net. Page-specific layouts still control their
   own breakpoints, while these rules prevent intrinsic content from forcing
   the application wider than the viewport. */
img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

.app-main,
.ui-page,
.page-wrap,
.career-page,
.account-page,
.admin-page,
.public-page {
    min-width: 0;
}

.ui-card,
.card,
.form-group,
.field-group {
    min-width: 0;
}

p,
li,
td,
th,
a,
button,
label {
    overflow-wrap: break-word;
}

@media (max-width: 820px) {
    .career-page .stats-bar,
    .history-page .stats-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .career-page .page-header,
    .career-page .ip-header-row,
    .career-page .ip-results-header,
    .account-page .page-header,
    .admin-page .page-header,
    .admin-page .admin-header,
    .admin-page .ff-header {
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    :root {
        --rm-page-gutter: 0.75rem;
    }

    .career-page .stats-bar,
    .history-page .stats-bar {
        grid-template-columns: 1fr;
    }

    .career-page .stat-card,
    .career-page .ip-credits-badge,
    .admin-page .stat-card,
    .admin-page .chart-card,
    .admin-page .recent-card,
    .admin-page .create-card,
    .admin-page .ff-card {
        padding: var(--rm-space-4);
    }

    .ui-button,
    .btn,
    .btn-outline {
        white-space: normal;
    }
}

/* Profile, credits, and notifications */
.account-page {
    display: grid;
    gap: var(--rm-space-6);
}

.account-page .page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rm-space-5);
}

.account-page .page-header h1 {
    margin: 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 500;
    letter-spacing: -0.04em;
}

.account-page .page-header p:last-child {
    margin: var(--rm-space-2) 0 0;
    color: var(--rm-muted);
}

.credits-page .balance-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.credits-page .balance-card,
.credits-page .history-card {
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.credits-page .balance-card--total {
    border-color: var(--rm-blue-300);
    background: var(--rm-blue-50);
}

.credits-page .balance-card .label {
    color: var(--rm-muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.credits-page .balance-card .value {
    margin: var(--rm-space-2) 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 2.3rem;
}

.credits-page .balance-card .value.low {
    color: var(--rm-danger);
}

.credits-page .balance-card .sub {
    color: var(--rm-muted);
    font-size: 0.8rem;
}

.credits-page .subscription-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-5);
    padding: var(--rm-space-6);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-navy-950);
    color: #ffffff;
}

.credits-page .subscription-banner h3,
.credits-page .subscription-banner p {
    margin: 0;
}

.credits-page .subscription-banner p {
    margin-top: var(--rm-space-2);
    color: rgba(255, 255, 255, 0.72);
}

.credits-page .btn-subscribe {
    min-height: 42px;
    padding: 0.6rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: var(--rm-radius-sm);
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.72);
}

.credits-page .section-title {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.5rem;
}

.credits-page .tip-box {
    display: flex;
    gap: var(--rm-space-3);
    padding: var(--rm-space-4);
    border: 1px solid var(--rm-blue-200);
    border-radius: var(--rm-radius-md);
    background: var(--rm-blue-50);
    color: var(--rm-blue-800);
}

.credits-page .packs-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: var(--rm-space-5);
}

.credits-page .pack-card {
    position: relative;
    display: flex;
    min-width: 0;
    padding: var(--rm-space-6);
    flex-direction: column;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-xl);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.credits-page .pack-card.popular {
    border: 2px solid var(--rm-amber-500);
    background: linear-gradient(180deg, var(--rm-amber-50), #ffffff 35%);
}

.credits-page .popular-badge {
    position: absolute;
    top: -13px;
    left: 50%;
    padding: 0.35rem 0.75rem;
    transform: translateX(-50%);
    border-radius: 999px;
    background: var(--rm-amber-500);
    color: var(--rm-navy-950);
    font-size: 0.7rem;
    font-weight: 800;
    white-space: nowrap;
}

.credits-page .pack-credits {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 2.6rem;
    line-height: 1;
}

.credits-page .pack-credits-label,
.credits-page .pack-per-credit {
    color: var(--rm-muted);
    font-size: 0.78rem;
}

.credits-page .pack-price {
    margin-top: var(--rm-space-4);
    color: var(--rm-blue-700);
    font-weight: 800;
}

.credits-page .pack-features {
    display: grid;
    gap: var(--rm-space-2);
    margin: var(--rm-space-5) 0;
    padding-left: 1.2rem;
    color: var(--rm-text);
}

.credits-page .btn-buy {
    width: 100%;
    margin-top: auto;
}

.credits-page .stripe-badge {
    color: var(--rm-muted);
    font-size: 0.8rem;
    text-align: center;
}

.credits-page .history-card h3 {
    margin: 0 0 var(--rm-space-4);
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-weight: 500;
}

.credits-page .tx-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
    padding: var(--rm-space-4) 0;
    border-top: 1px solid var(--rm-border);
}

.credits-page .tx-desc {
    color: var(--rm-navy-950);
    font-weight: 700;
}

.credits-page .tx-date {
    color: var(--rm-muted);
    font-size: 0.78rem;
}

.credits-page .tx-amount {
    font-weight: 800;
    white-space: nowrap;
}

.credits-page .tx-amount.positive {
    color: var(--rm-success);
}

.credits-page .tx-amount.negative {
    color: var(--rm-danger);
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rm-space-5);
}

.profile-card {
    display: flex;
    align-items: center;
    gap: var(--rm-space-4);
    padding: var(--rm-space-4);
}

.profile-avatar {
    display: grid;
    width: 52px;
    height: 52px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    background: var(--rm-amber-100);
    color: var(--rm-amber-700);
    font-family: var(--rm-font-display);
    font-size: 1.35rem;
}

.profile-region-card > i {
    color: var(--rm-blue-600);
    font-size: 1.35rem;
}

.profile-label {
    margin: 0;
    color: var(--rm-blue-700);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.profile-card h2,
.profile-security h2 {
    margin: var(--rm-space-1) 0;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-section-title-size);
    font-weight: 500;
    line-height: 1.25;
}

.profile-card p:last-child {
    margin: 0;
    color: var(--rm-muted);
    font-size: var(--rm-card-body-size);
    line-height: 1.5;
}

.profile-activity {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--rm-space-4);
}

.profile-stat {
    display: grid;
    gap: var(--rm-space-1);
    padding: var(--rm-space-5);
}

.profile-stat strong {
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: var(--rm-metric-size);
    font-weight: 500;
}

.profile-stat span {
    color: var(--rm-muted);
    font-size: 0.8rem;
}

.profile-security {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-5);
    padding: var(--rm-space-4);
}

.profile-verification {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rm-space-2);
}

.notifications-page .notif-list {
    display: grid;
    gap: var(--rm-space-4);
}

.notifications-page .notif-card {
    padding: var(--rm-space-5);
    border: 1px solid var(--rm-border);
    border-left: 4px solid var(--rm-blue-600);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface);
    box-shadow: var(--rm-shadow-sm);
}

.notifications-page .notif-card.low_credits {
    border-left-color: var(--rm-amber-500);
}

.notifications-page .notif-header {
    display: flex;
    gap: var(--rm-space-3);
}

.notifications-page .notif-title {
    color: var(--rm-navy-950);
    font-weight: 800;
}

.notifications-page .notif-message,
.notifications-page .notif-time {
    margin-top: var(--rm-space-1);
    color: var(--rm-muted);
}

.notifications-page .notif-time {
    font-size: 0.75rem;
}

.notifications-page .notif-jobs {
    display: grid;
    gap: var(--rm-space-2);
    margin-top: var(--rm-space-4);
    padding: var(--rm-space-4);
    border-radius: var(--rm-radius-md);
    background: var(--rm-navy-50);
}

.notifications-page .job-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rm-space-4);
    padding: var(--rm-space-3) 0;
    border-top: 1px solid var(--rm-border);
}

@media (max-width: 760px) {
    .credits-page .balance-row,
    .credits-page .packs-grid,
    .profile-grid,
    .profile-activity {
        grid-template-columns: 1fr;
    }

    .credits-page .subscription-banner,
    .profile-security,
    .account-page .page-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .credits-page .tx-row,
    .notifications-page .job-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Final typography override must follow all page-family styles. */
.has-sidebar .ui-page-header h1,
.has-sidebar .page-header h1,
.has-sidebar .page-header h2,
.has-sidebar .page-title,
.has-sidebar .scoring-page-title,
.has-sidebar .enhancer-header h1,
.has-sidebar .ip-header-row h1,
.has-sidebar .ip-results-header h2,
.has-sidebar .admin-header h2,
.has-sidebar .ff-header h1 {
    font-size: clamp(1.75rem, 2.6vw, 2.25rem);
    line-height: 1.08;
    letter-spacing: -0.025em;
}

.has-sidebar .ui-page-header p,
.has-sidebar .page-header p,
.has-sidebar .scoring-page-subtitle,
.has-sidebar .enhancer-header > p:last-child,
.has-sidebar .ip-header-row p {
    font-size: 0.9rem;
    line-height: 1.5;
}

/* ------------------------------------------------------------------------
   UI quality pass — compact, aligned controls and content
   ------------------------------------------------------------------------ */

/* The credits control belongs to the sticky application header, not the
   sidebar. This keeps it aligned with content and prevents scroll overlap. */
.has-sidebar .app-topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    height: 92px;
    gap: 18px;
    padding-inline: 32px;
}

.has-sidebar .app-topbar-spacer {
    flex: 1;
}

.has-sidebar .app-topbar-credits {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.55rem 0.85rem;
    border: 1px solid var(--rm-border);
    border-radius: 10px;
    background: #ffffff;
    color: var(--rm-navy-800);
    font-size: 0.82rem;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: var(--rm-shadow-sm);
}

.has-sidebar .app-topbar-credits i {
    color: var(--rm-amber-500);
    font-size: 1rem;
}

.has-sidebar .app-topbar-credits strong {
    color: var(--rm-blue-700);
    font-size: 1rem;
}

/* Compact global page hierarchy. */
.has-sidebar .ui-page-header h1,
.has-sidebar .page-header h1,
.has-sidebar .page-header h2,
.has-sidebar .page-title,
.has-sidebar .scoring-page-title,
.has-sidebar .enhancer-header h1,
.has-sidebar .ip-header-row h1,
.has-sidebar .ip-results-header h2,
.has-sidebar .admin-header h2,
.has-sidebar .ff-header h1 {
    font-size: var(--rm-page-title-size);
    line-height: 1.12;
}

.has-sidebar .ui-page-header p,
.has-sidebar .page-header p,
.has-sidebar .scoring-page-subtitle,
.has-sidebar .enhancer-header > p:last-child,
.has-sidebar .ip-header-row p {
    font-size: var(--rm-page-subtitle-size);
    line-height: 1.45;
}

.ui-badge {
    min-height: 30px;
    justify-content: center;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
}

/* Search filter choices need enough horizontal room for one-line labels. */
.search-page .checkbox-group {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.55rem;
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 0.15rem;
    scrollbar-width: thin;
}

.search-page .checkbox-group label {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 0.45rem 0.7rem;
    line-height: 1.2;
    white-space: nowrap;
}

/* Application Tracker */
.tracker-page.career-page .stats-bar {
    gap: 0.75rem;
}

.tracker-page.career-page .stat-card {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.7rem 0.9rem;
    text-align: center;
}

.tracker-page.career-page .stat-card .val {
    font-size: 1.4rem;
    line-height: 1;
}

.tracker-page.career-page .stat-card .lbl {
    margin: 0;
    font-size: 0.72rem;
    line-height: 1.2;
}

.tracker-page.career-page .status-select {
    width: 138px;
    min-width: 138px;
    padding-right: 1.8rem;
    white-space: nowrap;
}

/* Interview credit summary */
.career-page .ip-credits-badge {
    min-width: 158px;
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.65rem 0.9rem;
    text-align: center;
}

.career-page .ip-credits-badge .val {
    font-size: 1.4rem;
    line-height: 1;
}

.career-page .ip-credits-badge .lbl {
    order: 2;
    white-space: nowrap;
}

/* Recruiter match pills use a clean label with no decorative dot/crescent. */
.score-badge {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.score-dot {
    display: none !important;
}

/* Buy Credits — mirrors the approved compact three-card mock. */
.credits-page {
    gap: 0.75rem;
}

.credits-page .page-header {
    margin-bottom: 0.1rem;
}

.credits-page .balance-row {
    display: flex;
    align-items: stretch;
    gap: 0;
    max-width: 710px;
    overflow: hidden;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-md);
    background: #ffffff;
    box-shadow: var(--rm-shadow-sm);
}

.credits-page .balance-card {
    min-width: 0;
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.8rem 1rem;
    border: 0;
    border-right: 1px solid var(--rm-border);
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
}

.credits-page .balance-card:last-child {
    border-right: 0;
}

.credits-page .balance-card--total {
    background: #ffffff;
}

.credits-page .balance-card .label {
    order: 2;
    font-size: 0.72rem;
    white-space: nowrap;
}

.credits-page .balance-card .value {
    margin: 0;
    font-size: 1.65rem;
    line-height: 1;
}

.credits-page .tip-box {
    width: fit-content;
    padding: 0.25rem 0;
    border: 0;
    background: transparent;
    font-size: 0.76rem;
}

.credits-page .tip-box > i {
    color: var(--rm-blue-600);
    font-size: 1rem;
}

.credits-page .packs-grid {
    gap: 1rem;
}

.credits-page .pack-card {
    padding: 1.25rem 1.35rem 1rem;
    border-radius: var(--rm-radius-lg);
}

.credits-page .pack-card:hover,
.credits-page .pack-card.popular:hover {
    transform: translateY(-2px);
}

.credits-page .pack-card h2 {
    margin: 0 0 0.25rem;
    color: var(--rm-navy-950);
    font-family: var(--rm-font-display);
    font-size: 1.2rem;
    font-weight: 500;
    text-align: center;
}

.credits-page .pack-credit-line {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.45rem;
}

.credits-page .pack-credits {
    font-size: 2rem;
}

.credits-page .pack-credits-label {
    color: var(--rm-navy-800);
    font-size: 0.9rem;
}

.credits-page .pack-price {
    margin-top: 0.2rem;
    color: var(--rm-navy-900);
    font-size: 1.15rem;
    text-align: center;
}

.credits-page .pack-per-credit {
    color: var(--rm-blue-700);
    text-align: center;
}

.credits-page .pack-features {
    gap: 0.35rem;
    margin: 0.75rem 0;
    padding-top: 0.65rem;
    border-top: 1px solid var(--rm-border);
    font-size: 0.76rem;
}

.credits-page .stripe-badge {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    border: 1px solid var(--rm-blue-200);
    border-radius: var(--rm-radius-sm);
    background: var(--rm-blue-50);
    text-align: left;
}

.credits-page .subscription-banner {
    justify-content: flex-start;
    gap: 0.8rem;
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--rm-border);
    background: #ffffff;
    color: var(--rm-navy-950);
    box-shadow: var(--rm-shadow-sm);
}

.credits-page .subscription-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 8px;
    background: var(--rm-blue-50);
    color: var(--rm-blue-700);
}

.credits-page .subscription-banner h3 {
    font-family: var(--rm-font-display);
    font-size: 1rem;
    font-weight: 500;
}

.credits-page .subscription-banner p {
    margin-top: 0.15rem;
    color: var(--rm-muted);
    font-size: 0.75rem;
}

.credits-page .subscription-banner p strong {
    color: var(--rm-blue-700);
}

.credits-page .btn-subscribe {
    min-height: 34px;
    margin-left: auto;
    padding: 0.4rem 0.9rem;
    border-color: var(--rm-border);
    background: var(--rm-surface-soft);
    color: var(--rm-muted);
}

.credits-page .history-card {
    padding: 0.8rem 1rem;
}

.credits-page .history-card h3 {
    margin-bottom: 0.35rem;
    font-size: 1rem;
}

.credits-page .tx-row {
    padding: 0.55rem 0;
}

/* Notifications should fit their information instead of reading as panels. */
.notifications-page .notif-list {
    gap: 0.65rem;
}

.notifications-page .notif-card {
    padding: 0.8rem 1rem;
    border-radius: var(--rm-radius-md);
}

.notifications-page .notif-header {
    gap: 0.6rem;
}

.notifications-page .notif-jobs {
    margin-top: 0.65rem;
    padding: 0.65rem 0.85rem;
}

.notifications-page .job-row {
    padding: 0.55rem 0;
}

@media (max-width: 760px) {
    .has-sidebar .app-topbar {
        height: 66px;
        padding-inline: 16px;
    }

    .credits-page .balance-row {
        width: 100%;
        display: grid;
    }

    .credits-page .balance-card {
        border-right: 0;
        border-bottom: 1px solid var(--rm-border);
    }

    .credits-page .balance-card:last-child {
        border-bottom: 0;
    }
}

/* Final compactness guard: legacy rules above must not re-expand workflows. */
.search-page .search-location-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.search-page .checkbox-group {
    flex-wrap: wrap;
    overflow-x: visible;
}

.history-page.career-page .stats-bar {
    gap: 0;
}

.history-page.career-page .stat-card {
    min-height: 46px;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
}

.history-page.career-page .stat-card .val {
    font-size: 1.15rem;
}

.profile-page .profile-stat {
    min-height: 44px;
    padding: 0.45rem 0.7rem;
}

.notifications-page .notif-list {
    gap: 0.4rem;
}

.notifications-page .notif-card {
    padding: 0.55rem 0.75rem;
}

.notifications-page .notif-header {
    min-height: 0;
    padding: 0;
}

.tracker-page.career-page .table-scroll {
    overflow-x: visible;
}

.tracker-page.career-page table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

@media (max-width: 900px) {
    .tracker-page.career-page table {
        min-width: 0;
        table-layout: fixed;
    }
}

@media (max-width: 760px) {
    .search-page .search-location-grid {
        grid-template-columns: 1fr;
    }

    .tracker-page.career-page table,
    .tracker-page.career-page tbody {
        display: block;
    }

    .tracker-page.career-page thead {
        display: none;
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.5rem;
        margin-bottom: 0.65rem;
        padding: 0.7rem;
        border: 1px solid var(--rm-border);
        border-radius: var(--rm-radius-md);
        background: var(--rm-surface);
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] > td {
        display: block;
        padding: 0;
        border: 0;
    }

    .tracker-page.career-page #tracker-tbody > tr[data-id] > td:nth-child(n + 3) {
        grid-column: 1 / -1;
    }

    .tracker-page .tracker-progress-cell {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .tracker-page.career-page .status-select,
    .tracker-page.career-page .date-input {
        width: 100%;
        max-width: none;
    }

    .tracker-page.career-page .history-row,
    .tracker-page.career-page .history-row > td {
        display: block;
    }
}

/* ========================================================================
   Information-density pass
   The authenticated product is a working dashboard, not a marketing page.
   Keep its hierarchy clear while fitting the primary workflow in view.
   ======================================================================== */

:root {
    --rm-page-title-size: clamp(1.28rem, 1.6vw, 1.55rem);
    --rm-page-subtitle-size: 0.76rem;
    --rm-section-title-size: 0.92rem;
    --rm-card-body-size: 0.78rem;
    --rm-control-height: 38px;
    --rm-page-gutter: clamp(0.75rem, 1.8vw, 1.5rem);
}

body.has-sidebar {
    font-size: 0.82rem;
    line-height: 1.42;
}

.has-sidebar .app-topbar {
    height: 68px;
    padding-inline: 24px;
}

.has-sidebar .app-topbar-credits {
    min-height: 36px;
    padding: 0.42rem 0.7rem;
    font-size: 0.75rem;
}

.has-sidebar .sb-logo {
    min-height: 72px;
    padding: 0.85rem 1rem;
}

.has-sidebar .sb-nav {
    padding: 0.55rem 0.75rem;
}

.has-sidebar .sb-section {
    padding: 0.75rem 0.65rem 0.3rem;
}

.has-sidebar .sb-item {
    min-height: 34px;
    gap: 0.55rem;
    padding: 0.42rem 0.65rem;
    font-size: 0.76rem;
}

.has-sidebar .ui-page:not(.admin-page) {
    gap: 0.65rem;
    padding-top: 0.7rem;
    padding-bottom: 1rem;
}

.has-sidebar .ui-page:not(.admin-page) :where(h1, .ui-page-heading, .scoring-page-title) {
    margin-bottom: 0.15rem;
    font-size: var(--rm-page-title-size) !important;
    line-height: 1.12 !important;
}

.has-sidebar .ui-page:not(.admin-page) h2 {
    font-size: var(--rm-section-title-size) !important;
    line-height: 1.2 !important;
}

.has-sidebar .ui-page:not(.admin-page) h3 {
    font-size: 0.86rem !important;
    line-height: 1.25 !important;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    p,
    li,
    label,
    td,
    th,
    input,
    select,
    textarea,
    button,
    .ui-button
) {
    font-size: 0.76rem;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea
) {
    min-height: 36px;
    padding: 0.4rem 0.6rem;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-button,
    button:not(.toolbar-btn):not(.keyword-pill)
) {
    min-height: 32px;
    padding: 0.35rem 0.65rem;
    line-height: 1.15;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-card,
    .scoring-panel,
    .doc-table-card,
    .search-form-card,
    .profile-card,
    .profile-security,
    .ip-card
) {
    border-radius: 10px;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-page-header,
    .page-header,
    .scoring-page-header,
    .ip-header-row
) {
    margin-bottom: 0.45rem;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-page-description,
    .scoring-page-subtitle,
    .page-header p,
    .ip-header-row p
) {
    font-size: var(--rm-page-subtitle-size) !important;
    line-height: 1.35;
}

.has-sidebar .ui-page:not(.admin-page) .ui-page-kicker {
    margin-bottom: 0.1rem;
    font-size: 0.65rem;
}

/* Analysis: compact typography and one page-level scroll. */
.scoring-page {
    gap: 0.6rem;
}

.scoring-page .score-summary-section {
    min-height: 0;
    padding: 0.55rem 0.65rem;
}

.scoring-page :where(.score-summary-label, .improvement-card-intro) {
    font-size: 0.72rem;
}

.scoring-page .improvement-list {
    gap: 0.3rem;
}

.scoring-page .improvement-list li {
    padding: 0.3rem 0;
    font-size: 0.72rem;
    line-height: 1.35;
}

/* Authoritative editor sizing: a bounded box that scrolls its own content so
   a long resume never pushes the page down. */
.scoring-page .resume-editor {
    min-height: 260px;
    max-height: 440px;
    overflow-y: auto;
    padding: 0.85rem 1rem;
    font-size: 0.78rem;
    line-height: 1.42;
}

/* Resume heading hierarchy: the name (h1) is the largest and a soft dark
   grey (not black); section headings sit clearly below it. */
.scoring-page .resume-editor h1 {
    margin: 0.4rem 0 0.35rem;
    font-size: 1.35rem !important;
    color: #3f4b5e;
}

.scoring-page .resume-editor h2 {
    margin: 0.7rem 0 0.25rem;
    font-size: 0.85rem !important;
}

.scoring-page .resume-editor h3 {
    margin: 0.55rem 0 0.25rem;
    font-size: 0.8rem !important;
}

.scoring-page .resume-side-panel {
    position: static;
    overflow: visible;
}

/* Forms and cards use their contents rather than empty vertical padding. */
.search-page .search-form-card,
.upload-resume-page .upload-form-card,
.profile-page .profile-card,
.profile-page .profile-security,
.interview-page .ip-card {
    padding: 0.7rem 0.8rem;
}

.search-page .search-section-heading {
    margin: 0.15rem 0 0.45rem;
}

.search-page .divider {
    margin: 0.55rem 0;
}

.search-page .form-group {
    margin-bottom: 0.35rem;
}

.upload-resume-page .upload-area {
    min-height: 92px;
    padding: 0.6rem;
}

/* History actions are a compact, consistent vertical stack. */
.history-page .doc-table-card table {
    min-width: 0;
    table-layout: fixed;
}

.history-page.career-page th,
.history-page.career-page td {
    padding: 0.4rem 0.5rem;
    font-size: 0.72rem;
}

.history-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0.25rem;
}

.history-actions :where(a, button, .ui-button, .btn-outline) {
    width: 100%;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.35rem !important;
    font-size: 0.67rem !important;
    line-height: 1 !important;
    text-align: center;
    white-space: nowrap !important;
}

.history-role-link {
    font-size: 0.74rem;
}

.history-company {
    font-size: 0.67rem;
}

/* Dense records and notification rows. */
.tracker-page.career-page th,
.tracker-page.career-page td {
    padding: 0.4rem 0.45rem;
}

.tracker-page .history-panel,
.recruiters-page .recruiter-card,
.notifications-page .notif-card {
    padding: 0.5rem 0.65rem;
}

.recruiters-page .recruiter-card {
    min-height: 0;
}

.notifications-page .notif-title,
.notifications-page .notif-message,
.notifications-page .notif-time {
    font-size: 0.7rem;
}

@media (max-width: 760px) {
    :root {
        --rm-page-title-size: 1.2rem;
        --rm-page-gutter: 0.7rem;
    }

    .has-sidebar .app-topbar {
        height: 58px;
        padding-inline: 12px;
    }
}

/* Workflow layout corrections after visual review. */
.history-page .doc-table-card table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.history-page .history-generated {
    color: var(--rm-muted);
    font-size: 0.68rem;
    line-height: 1.3;
    white-space: normal;
}

.history-page .history-generated span {
    display: block;
}

.history-page .history-role-link {
    max-width: 100%;
    -webkit-line-clamp: 2;
}

.tracker-page .row-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.25rem;
}

.tracker-page .row-actions-primary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    gap: 0.25rem;
}

.tracker-page .row-actions :where(.btn-history, .btn-remove) {
    min-height: 30px;
    margin: 0;
    padding: 0.3rem 0.45rem;
    font-size: 0.7rem;
    line-height: 1;
}

.tracker-page .row-actions .btn-history {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.tracker-page .btn-interview-prep {
    width: 100%;
}

.interview-page .ip-application-intro {
    max-width: 600px;
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    color: var(--rm-text);
    font-size: 0.76rem;
}

.interview-page .ip-application-intro strong {
    flex: 0 0 auto;
    color: var(--rm-navy-950);
}

.interview-page .ip-application-intro span {
    color: var(--rm-muted);
}

.interview-page .ip-application-form {
    width: min(52%, 600px);
    min-width: 420px;
}

.interview-page .ip-application-form .ip-field {
    margin-bottom: 0.55rem;
}

.profile-page .profile-security {
    width: fit-content;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem 0.7rem;
}

.profile-page .profile-security > div:first-child {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
}

.profile-page .profile-security :where(.profile-label, h2) {
    margin: 0;
    white-space: nowrap;
}

.profile-page .profile-verification {
    gap: 0.35rem;
}

.profile-page .profile-verification .ui-badge {
    min-height: 26px;
    padding: 0.25rem 0.5rem;
    font-size: 0.68rem;
}

@media (max-width: 760px) {
    .interview-page .ip-application-intro {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }

    .interview-page .ip-application-form {
        width: 100%;
        min-width: 0;
    }

    .profile-page .profile-security,
    .profile-page .profile-security > div:first-child {
        width: 100%;
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ========================================================================
   Verified final layout contracts
   These rules intentionally live last so legacy styles cannot override them.
   ======================================================================== */

/* Shared authenticated shell: the footer is anchored by one global rule. */
.has-sidebar .app-main {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Promo Codes: a natural description/action row and standard action width. */
.admin-page .promo-create-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.75rem;
}

.admin-page .promo-create-action {
    display: flex;
    align-items: flex-end;
}

.admin-page .promo-create-button {
    width: auto;
    min-width: 150px;
    min-height: 40px;
    margin: 0;
    padding: 0.55rem 1rem;
    white-space: nowrap;
}

/* Interview Prep: exactly one left-aligned row on desktop. */
.interview-page .ip-application-intro {
    width: 100%;
    max-width: none;
    display: flex;
    justify-content: flex-start;
    gap: 0.5rem;
    margin: 0;
    white-space: nowrap;
}

.interview-page .ip-application-form {
    width: min(100%, 900px);
    max-width: 900px;
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(360px, 1fr) auto;
    align-items: center;
    justify-content: start;
    gap: 0.65rem;
    margin: 0;
}

.interview-page .ip-application-field {
    display: contents;
}

.interview-page .ip-application-field label {
    align-self: center;
    margin: 0;
    white-space: nowrap;
}

.interview-page .ip-application-field .ip-select,
.interview-page .ip-application-form .ip-start-action,
.interview-page .ip-application-form .ip-start-action .btn {
    height: 38px;
    min-height: 38px;
    margin: 0;
}

.interview-page .ip-application-form .ip-start-action {
    display: flex;
    align-items: stretch;
}

/* Tracker: compact filters, equal controls, spaced rows without drawn lines. */
.tracker-page .filter-bar {
    gap: 0.35rem;
}

.tracker-page .filter-btn {
    min-height: 32px;
    padding: 0.35rem 0.65rem;
    font-size: 0.7rem;
}

.tracker-page.career-page table {
    border-collapse: separate;
    border-spacing: 0 6px;
}

.tracker-page.career-page thead th {
    border-bottom: 0;
}

.tracker-page.career-page tbody tr[data-id] > td {
    height: 50px;
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
    vertical-align: bottom;
    border: 0 !important;
    background: var(--rm-surface);
}

.tracker-page .tracker-progress-cell {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(145px, 0.85fr);
    align-items: end;
    gap: 0.45rem;
}

.tracker-page.career-page :where(
    .status-select,
    .date-input,
    .notes-input,
    .btn-history,
    .btn-remove
) {
    height: 38px;
    min-height: 38px;
    margin: 0;
}

.tracker-page.career-page .status-select,
.tracker-page.career-page .date-input {
    width: 100%;
    max-width: none;
}

.tracker-page .row-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 38px;
    align-items: end;
    gap: 0.3rem;
}

.tracker-page .row-actions > .btn-history {
    width: 100%;
}

.tracker-page .row-actions > .btn-remove {
    width: 38px;
    min-width: 38px;
    grid-column: 2;
    grid-row: 1;
    padding: 0;
}

/* History: use real column widths; never create gaps with visual offsets. */
.history-page.career-page th:nth-child(3),
.history-page.career-page td:nth-child(3),
.history-page.career-page th:nth-child(4),
.history-page.career-page td:nth-child(4) {
    position: static;
    left: auto;
    transform: none;
}

.history-page.career-page th:nth-child(3),
.history-page.career-page td:nth-child(3) {
    text-align: center;
}

.history-page.career-page th:nth-child(4),
.history-page.career-page td:nth-child(4) {
    padding-left: 0.55rem;
    text-align: center;
}

/* Recruiters: wider equal-height filters and compact equal-height cards. */
.recruiters-page .recruiter-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) max-content;
    align-items: end;
    gap: 0.65rem;
}

.recruiters-page .filter-group {
    min-width: 0;
}

.recruiters-page .filter-group :where(input, select),
.recruiters-page .filter-actions,
.recruiters-page .btn-filter-apply,
.recruiters-page .btn-filter-clear {
    height: 42px;
    min-height: 42px;
}

.recruiters-page .filter-group :where(input, select) {
    width: 100%;
    min-width: 0;
}

.recruiters-page .filter-actions {
    display: flex;
    align-items: stretch;
    max-width: 100%;
    gap: 0.35rem;
}

.recruiters-page .btn-filter-apply,
.recruiters-page .btn-filter-clear {
    min-width: 78px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 0.8rem;
    white-space: nowrap;
}

.recruiters-page .score-badge {
    border-left: 0 !important;
}

.recruiters-page .score-badge::before,
.recruiters-page .score-badge::after,
.recruiters-page .score-dot {
    display: none !important;
    content: none !important;
}

.recruiters-page .recruiter-list {
    gap: 0.5rem;
}

.recruiters-page .recruiter-card {
    height: 92px;
    min-height: 92px;
    align-items: center;
    gap: 0.65rem;
    padding: 0.55rem 0.7rem;
}

.recruiters-page .recruiter-info {
    align-content: center;
}

.recruiters-page :where(.why-matched, .contact-row, .recruiter-actions) {
    margin-top: 0;
}

@media (max-width: 980px) {
    .recruiters-page .recruiter-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .recruiters-page .filter-actions {
        grid-column: 1 / -1;
    }

    .recruiters-page .recruiter-card {
        height: auto;
        min-height: 92px;
    }
}

@media (max-width: 760px) {
    .admin-page .promo-create-row,
    .interview-page .ip-application-form,
    .recruiters-page .recruiter-filters {
        grid-template-columns: 1fr;
    }

    .admin-page .promo-create-button {
        width: auto;
    }

    .interview-page .ip-application-intro {
        flex-direction: column;
        white-space: normal;
    }

    .interview-page .ip-application-field {
        display: grid;
    }

    .tracker-page .tracker-progress-cell {
        grid-template-columns: 1fr;
    }
}

/* Overflow and Tracker recovery — content determines option width. */
.search-page :where(.radio-group label, .board-item) {
    width: max-content !important;
    max-width: 100%;
    height: auto !important;
    min-width: max-content !important;
    min-height: 32px;
    display: inline-flex !important;
    align-items: center;
    flex: 0 0 auto !important;
    gap: 0.4rem;
    padding: 0.35rem 0.6rem !important;
    overflow: visible;
    font-size: 0.72rem;
    line-height: 1.15;
    white-space: nowrap;
}

.search-page :where(.radio-group label, .board-item) > input {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px;
    max-width: 15px;
    flex: 0 0 15px !important;
    margin: 0 !important;
}

.search-page .radio-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.4rem;
}

.search-page .board-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.tracker-page .filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.tracker-page .filter-btn {
    width: auto !important;
    max-width: none;
    height: auto;
    min-width: max-content;
    min-height: 32px;
    flex: 0 0 auto;
    padding: 0.4rem 0.7rem;
    overflow: visible;
    font-size: 0.7rem;
    line-height: 1;
    white-space: nowrap;
}

.tracker-page.career-page table {
    border-collapse: collapse;
    border-spacing: 0;
}

.tracker-page.career-page tbody tr[data-id] > td {
    height: auto;
    min-height: 0;
    padding-top: 0.55rem;
    padding-bottom: 0.55rem;
    vertical-align: middle;
    border: 0 !important;
    background: var(--rm-surface);
}

.tracker-page.career-page tbody tr[data-id]:nth-of-type(4n + 1) > td {
    background: #fafcff;
}

.tracker-page .tracker-progress-controls {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(155px, 0.9fr);
    align-items: center;
    gap: 0.5rem;
}

.tracker-page.career-page :where(
    .status-select,
    .date-input,
    .notes-input,
    .btn-history,
    .btn-remove
) {
    height: 36px;
    min-height: 36px;
}

.tracker-page .row-actions {
    display: flex;
    align-items: center;
}

/* Final Tracker row alignment and relaxed Job Search spacing. */
.tracker-page .tracker-progress-controls {
    width: 100%;
}

.tracker-page .row-actions .btn-history {
    width: 100%;
    min-width: 82px;
    padding-inline: 0.75rem;
    overflow: hidden;
    white-space: nowrap;
}

.search-page .search-form {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.search-page .search-choice-panel {
    gap: 1.4rem;
    padding: 0.9rem 1rem;
}

.search-page .search-choice-group + .search-choice-group {
    padding-left: 1.4rem;
}

.search-page :where(.radio-group, .board-list, .checkbox-group) {
    column-gap: 0.65rem;
    row-gap: 0.55rem;
    margin-top: 0.55rem;
}

.search-page .search-optional-heading {
    margin-bottom: 0.45rem;
}

@media (max-width: 760px) {
    .search-page .radio-group,
    .search-page .board-list {
        flex-wrap: wrap;
    }

    .tracker-page .tracker-progress-controls {
        grid-template-columns: 1fr;
    }
}

/* Authenticated shell header alignment — one height controls both columns. */
body.has-sidebar {
    --rm-shell-header-height: 72px;
}

.has-sidebar .sb-logo,
.has-sidebar .app-topbar {
    height: var(--rm-shell-header-height);
    min-height: var(--rm-shell-header-height);
    max-height: var(--rm-shell-header-height);
    border-bottom: 1px solid #e4e9ef;
}

/* Dashboard and Job Search polish — shared outer inset, content-led sizing. */
body.has-sidebar {
    --rm-workspace-gutter: clamp(1.25rem, 2.3vw, 2rem);
}

.has-sidebar .mock-dashboard,
.has-sidebar .ui-page:not(.admin-page) {
    width: min(100%, var(--rm-content-max));
    margin-inline: auto;
    padding-inline: var(--rm-workspace-gutter);
}

.has-sidebar .search-page {
    max-width: var(--rm-content-max);
}

.search-page .search-role-fields {
    width: 100%;
    align-self: flex-start;
}

.search-page .search-role-fields .form-group {
    min-width: 0;
}

.search-page .search-role-fields :where(select, input[type="text"]) {
    width: 100%;
}

@media (max-width: 760px) {
    body.has-sidebar {
        --rm-workspace-gutter: 1rem;
    }

    .search-page .search-role-fields {
        width: 100%;
    }
}

/* Job Search spacing pilot — semantic relationships, exact shared values. */
.search-page {
    --search-space-icon: var(--rm-gap-icon);
    --search-space-group: var(--rm-gap-group);
    --search-space-field: var(--rm-gap-field);
    --search-space-card: var(--rm-gap-card);
    --search-space-section: var(--rm-gap-section);
    --search-space-card-padding: var(--rm-card-padding);
    --search-space-page-gutter: var(--rm-page-gutter-standard);
    padding-inline: var(--search-space-page-gutter) !important;
}

.search-page .search-space-card {
    padding: var(--search-space-card-padding);
}

.search-page .search-form {
    gap: var(--search-space-section);
}

.search-page .search-major-section {
    display: grid;
    gap: var(--search-space-field);
}

.search-page .search-field-row {
    gap: var(--search-space-field);
}

.search-page .search-peer-card-row {
    gap: var(--search-space-card);
    padding: var(--search-space-card-padding);
}

.search-page .search-section-heading,
.search-page .search-inline-control {
    gap: var(--search-space-group);
}

.search-page :where(.radio-group, .board-list, .checkbox-group) {
    gap: var(--search-space-group);
    margin-top: var(--search-space-group);
}

.search-page .search-choice-group {
    display: grid;
    align-content: start;
    gap: var(--search-space-group);
}

.search-page .search-choice-group + .search-choice-group {
    padding-left: var(--search-space-card);
}

.search-page .search-inline-control {
    display: flex;
    align-items: center;
}

.search-page .search-tip {
    gap: var(--search-space-icon);
}

.search-page .search-optional-heading,
.search-page .search-submit-row {
    margin: 0;
}

@media (max-width: 760px) {
    .search-page {
        --search-space-page-gutter: 16px;
    }
}

/* Job Search typography pilot — optical hierarchy scoped to this page. */
.search-page {
    --search-type-level-1: var(--rm-type-level-1);
    --search-type-level-2: var(--rm-type-level-2);
    --search-type-level-3: var(--rm-type-level-3);
    --search-type-working: var(--rm-type-working);
    --search-type-option: var(--rm-type-option);
    --search-type-supporting: var(--rm-type-supporting);
}

.has-sidebar .ui-page.search-page .ui-page-heading {
    font-family: var(--rm-font-display);
    font-size: var(--search-type-level-1) !important;
    font-weight: 600;
}

.has-sidebar .ui-page.search-page .search-section-heading h2,
.has-sidebar .ui-page.search-page .search-optional-heading h2 {
    font-family: var(--rm-font-display);
    font-size: var(--search-type-level-2) !important;
    font-weight: 600;
}

.has-sidebar .ui-page.search-page .form-group > label,
.has-sidebar .ui-page.search-page .section-label {
    font-family: var(--rm-font-sans);
    font-size: var(--search-type-level-3) !important;
    font-weight: 600;
}

.has-sidebar .ui-page.search-page input,
.has-sidebar .ui-page.search-page select,
.has-sidebar .ui-page.search-page button,
.has-sidebar .ui-page.search-page .radio-group label,
.has-sidebar .ui-page.search-page .board-item,
.has-sidebar .ui-page.search-page .checkbox-group label {
    font-family: var(--rm-font-sans);
    font-size: var(--search-type-working) !important;
}

.has-sidebar .ui-page.search-page .ui-page-description,
.has-sidebar .ui-page.search-page .search-section-heading p,
.has-sidebar .ui-page.search-page .search-optional-heading p,
.has-sidebar .ui-page.search-page .board-soon {
    font-family: var(--rm-font-sans);
    font-size: var(--search-type-supporting) !important;
    font-weight: 400;
}

.search-page .search-choice-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.search-page .search-choice-group + .search-choice-group {
    padding-left: 0;
    border-left: 0;
}

.has-sidebar .ui-page.search-page .radio-group,
.has-sidebar .ui-page.search-page .board-list {
    display: grid !important;
    grid-template-columns: 1fr;
    justify-items: start;
}

.has-sidebar .ui-page.search-page .search-optional-heading {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.has-sidebar .ui-page.search-page .search-inline-control {
    margin-left: auto;
    font-size: var(--search-type-working);
}

.has-sidebar .ui-page.search-page .checkbox-group label {
    font-size: var(--search-type-option) !important;
    font-weight: 400;
}

.has-sidebar .ui-page.search-page .checkbox-group {
    display: grid !important;
    grid-template-columns: 1fr;
    justify-items: start;
}

.has-sidebar .ui-page.search-page select,
.has-sidebar .ui-page.search-page .radio-group label,
.has-sidebar .ui-page.search-page .board-item {
    font-size: var(--search-type-option) !important;
    font-weight: 400;
}

.has-sidebar .ui-page.search-page :where(
    h1,
    h2,
    h3,
    label,
    button,
    select,
    option,
    .section-label,
    .auto-label
) {
    text-transform: none !important;
    letter-spacing: normal;
}

.has-sidebar .ui-page.search-page .search-role-fields {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: start;
    align-self: start;
    margin-right: auto;
}

@media (max-width: 760px) {
    .has-sidebar .ui-page.search-page .search-role-fields {
        width: 100%;
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .search-page .search-choice-panel {
        grid-template-columns: 1fr;
    }
}

/* Shared authenticated design tokens and semantic role assignments. */
body.has-sidebar {
    --rm-type-level-1: 28px;
    --rm-type-level-2: 22px;
    --rm-type-level-3: 15px;
    --rm-type-working: 14px;
    --rm-type-option: 13px;
    --rm-type-supporting: 13px;
    --rm-gap-icon: 6px;
    --rm-gap-group: 8px;
    --rm-gap-field: 12px;
    --rm-gap-card: 16px;
    --rm-gap-section: 20px;
    --rm-header-content-gap: 24px;
    --rm-card-padding: 16px;
    --rm-page-gutter-standard: 32px;
    --rm-auth-page-max: 1090px;
    --rm-auth-page-right-inset: 42px;
    --rm-control-height-sm: 32px;
    --rm-control-radius: 8px;
    --rm-action-primary-bg: var(--rm-amber-500);
    --rm-action-primary-border: var(--rm-amber-500);
    --rm-action-primary-text: var(--rm-navy-950);
    --rm-action-secondary-bg: var(--rm-blue-700);
    --rm-action-secondary-border: var(--rm-blue-700);
    --rm-action-secondary-text: #ffffff;
    --rm-action-outline-bg: var(--rm-surface-raised);
    --rm-action-outline-border: var(--rm-blue-600);
    --rm-action-outline-text: var(--rm-blue-700);
    --rm-action-danger-bg: var(--rm-danger);
    --rm-action-danger-border: var(--rm-danger);
    --rm-action-danger-text: #ffffff;
}

.has-sidebar .app-content {
    width: 100%;
    padding-left: var(--rm-page-gutter-standard);
}

.has-sidebar .app-content > :where(
    .ui-page,
    .page-wrap,
    .mock-dashboard
) {
    margin-left: 0;
    margin-right: auto;
    padding-left: 0 !important;
}

.has-sidebar .ui-page:not(.admin-page) {
    padding-inline: var(--rm-page-gutter-standard) !important;
}

.has-sidebar .app-main .app-content > :is(
    .ui-page,
    .page-wrap,
    .mock-dashboard
) {
    margin-left: 0;
    padding-left: 0 !important;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-page-heading,
    .page-header h1,
    .ip-header-row h1,
    .page-title
) {
    color: var(--rm-ink);
    font-family: var(--rm-font-display);
    font-size: var(--rm-type-level-1) !important;
    font-weight: 600;
}

.has-sidebar .ui-page:not(.admin-page) h2 {
    color: var(--rm-text);
    font-family: var(--rm-font-display);
    font-size: var(--rm-type-level-2) !important;
    font-weight: 600;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    h3,
    .ui-section-title,
    .ui-field > .ui-label,
    .form-group > label,
    .field-group > label,
    .section-label
) {
    color: var(--rm-text);
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-level-3) !important;
    font-weight: 600;
    text-transform: none !important;
    letter-spacing: normal;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    input,
    select,
    textarea
) {
    color: var(--rm-text);
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-working) !important;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    button,
    .ui-button
) {
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-option) !important;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .radio-group label,
    .checkbox-group label,
    .board-item
) {
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-option) !important;
    font-weight: 400;
    text-transform: none !important;
    letter-spacing: normal;
}

.has-sidebar .ui-page:not(.admin-page) :where(
    .ui-page-description,
    .page-header p:not(.ui-page-kicker),
    .help-text,
    .supporting-text
) {
    color: var(--rm-muted);
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-supporting) !important;
    font-weight: 400;
}

.has-sidebar .ui-page:not(.admin-page) .ui-page-kicker {
    color: var(--rm-amber-600);
    font-family: var(--rm-font-sans);
    font-size: var(--rm-type-working) !important;
    font-weight: 600;
    text-transform: none !important;
    letter-spacing: normal;
}

.has-sidebar .ui-page:not(.admin-page) .ui-card--padded {
    padding: var(--rm-card-padding);
}

.has-sidebar .app-content :where(
    .ui-page-header,
    .page-header,
    .ip-header-row,
    .enhancer-header,
    .scoring-page-header
) {
    margin-bottom: var(--rm-header-content-gap) !important;
}

.has-sidebar .ui-page:not(.admin-page) .row {
    gap: var(--rm-gap-field);
}

.has-sidebar .ui-page:not(.admin-page) .form-group {
    gap: var(--rm-gap-group);
}

@media (max-width: 760px) {
    body.has-sidebar {
        --rm-page-gutter-standard: 16px;
    }
}

/* Reviewed Dashboard and Upload Resume page arrangements.
   Typography comes from the shared roles above; only page layout stays local. */
.has-sidebar .mock-dashboard :where(
    .mock-step-copy strong,
    .mock-score-action h2
) {
    font-family: var(--rm-font-display);
    font-size: var(--rm-type-level-2);
    font-weight: 600;
}

.has-sidebar .upload-resume-page .upload-resume-row {
    padding-block: var(--rm-gap-field);
}

.has-sidebar .upload-resume-page .upload-resume-info h3 {
    margin-bottom: var(--rm-gap-icon);
}

.has-sidebar .upload-resume-page .upload-btn {
    display: flex;
    width: fit-content;
    margin-inline: auto;
}

.has-sidebar .enrich-wrap .q-text {
    color: var(--rm-text);
    font-size: var(--rm-type-working) !important;
    font-weight: 400 !important;
}

/* All content below the page-title tier shares the same softer dark neutral.
   Page titles alone retain --rm-ink; individual pages must not redefine it. */
.has-sidebar .ui-page:not(.admin-page) :where(
    .enrich-resume-summary .ui-help,
    .enrich-resume-summary strong,
    .upload-resume-info h3,
    .upload-form-step,
    .upload-text
) {
    color: var(--rm-text);
}

/* Document History uses the shared working-text level throughout each record. */
.has-sidebar .history-page.career-page thead th {
    font-size: var(--rm-type-level-3);
    font-weight: 600;
}

.has-sidebar .history-page :where(
    .history-role-link,
    .history-company,
    .history-generated
) {
    font-size: var(--rm-type-option) !important;
}

.has-sidebar .history-page tbody td:nth-child(2) span {
    font-size: var(--rm-type-option) !important;
}

.has-sidebar .history-page .history-role-link {
    font-weight: 600;
}

.has-sidebar .history-page .history-company,
.has-sidebar .history-page .history-generated {
    font-weight: 400;
}

.has-sidebar .history-page .history-actions :where(
    a,
    button,
    .ui-button,
    .btn-outline
) {
    min-height: var(--rm-control-height-sm);
    font-size: var(--rm-type-option) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* Tracker controls use the shared compact button scale without stretching. */
.has-sidebar .tracker-page .role-title,
.has-sidebar .tracker-page .role-sub {
    font-size: var(--rm-type-option);
}

.has-sidebar .tracker-page.career-page .status-select {
    width: min(100%, 150px);
    min-width: 0;
    height: var(--rm-control-height-sm);
    min-height: var(--rm-control-height-sm);
    justify-self: start;
    font-size: var(--rm-type-option) !important;
}

.has-sidebar .tracker-page .row-actions .btn-history {
    height: var(--rm-control-height-sm);
    min-height: var(--rm-control-height-sm);
    font-size: var(--rm-type-option) !important;
    font-weight: 400;
}

.has-sidebar .tracker-page .tracker-progress-controls {
    grid-template-columns: minmax(180px, 1fr) 130px;
}

.has-sidebar .tracker-page.career-page .status-select {
    width: 100%;
    max-width: none;
}

.has-sidebar .tracker-page.career-page .date-input {
    width: 130px;
    min-width: 130px;
    padding-inline: 0.45rem;
}

.has-sidebar .tracker-page .tracker-note-trigger {
    width: auto;
    min-width: 78px;
    min-height: var(--rm-control-height-sm);
    padding: 0.35rem 0.65rem;
    border: 1px solid var(--rm-action-outline-border);
    background: var(--rm-action-outline-bg);
    color: var(--rm-action-outline-text);
    white-space: nowrap;
}

.has-sidebar .tracker-note-overlay {
    position: fixed;
    z-index: 100;
    inset: 0;
    display: grid;
    padding: 24px;
    place-items: center;
    background: rgba(23, 26, 45, 0.42);
}

.has-sidebar .tracker-note-overlay[hidden] {
    display: none;
}

.has-sidebar .tracker-note-dialog {
    width: min(100%, 560px);
    padding: 20px;
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-radius-lg);
    background: var(--rm-surface-raised);
    box-shadow: var(--rm-shadow-lg);
}

.has-sidebar .tracker-note-dialog h2 {
    margin: 0 0 6px;
}

.has-sidebar .tracker-note-dialog p {
    margin: 0 0 12px;
    color: var(--rm-muted);
}

.has-sidebar .tracker-note-dialog textarea {
    width: 100%;
    min-height: 180px;
    resize: vertical;
    padding: 12px;
    border: 1px solid var(--rm-border-strong);
}

.has-sidebar .tracker-note-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--rm-gap-group);
    margin-top: 12px;
}

.has-sidebar .tracker-note-message {
    min-height: 18px;
    margin-top: 6px;
    color: var(--rm-danger);
    font-size: var(--rm-type-supporting);
}

/* Tracker workflow columns share one grid and one gap value. */
.has-sidebar .tracker-page {
    --tracker-workflow-gap: var(--rm-gap-field);
    /* Actions column wide enough for the "Hide History" label (the button
       toggles History <-> Hide History; the longer text was clipping). */
    --tracker-workflow-columns:
        160px 125px minmax(72px, 1fr) 110px;
}

.has-sidebar .tracker-page .tracker-workflow-head,
.has-sidebar .tracker-page .tracker-workflow-grid {
    display: grid;
    grid-template-columns: var(--tracker-workflow-columns);
    align-items: center;
    gap: var(--tracker-workflow-gap);
}

.has-sidebar .tracker-page .tracker-workflow-head {
    color: #ffffff;
    font-size: var(--rm-type-level-3);
    font-weight: 600;
    text-align: left;
}

.has-sidebar .tracker-page .tracker-workflow-grid > * {
    min-width: 0;
}

.has-sidebar .tracker-page .tracker-workflow-grid .row-actions,
.has-sidebar .tracker-page .tracker-workflow-grid .btn-history {
    width: 100%;
    min-width: 98px;
}

.has-sidebar .tracker-page .tracker-workflow-grid .row-actions {
    justify-self: start;
}

.has-sidebar .tracker-page .tracker-example-action {
    color: var(--rm-subtle);
    text-align: center;
}

@media (max-width: 980px) {
    .has-sidebar .tracker-page {
        --tracker-workflow-columns:
            150px 120px minmax(72px, 1fr) 104px;
    }
}

/* Legal pages use the same page hierarchy and neutral content palette. */
.has-sidebar .legal-page {
    width: min(100%, 900px);
    max-width: 900px;
    margin-left: 0;
    margin-right: auto;
}

.legal-page .legal-card-header {
    padding-bottom: var(--rm-gap-card);
    border-bottom: 1px solid var(--rm-border);
}

.legal-page .legal-card-header h2 {
    margin: 0 0 var(--rm-gap-icon);
}

.legal-page .legal-card-header p {
    margin: 0;
    color: var(--rm-muted);
}

.legal-page .legal-body {
    padding-top: var(--rm-gap-card);
}

.legal-page .legal-body h3 {
    margin: var(--rm-gap-section) 0 var(--rm-gap-group);
    color: var(--rm-text);
    text-transform: none;
    letter-spacing: normal;
}

.legal-page .legal-body h3:first-child {
    margin-top: 0;
}

.legal-page .legal-body :where(p, ul) {
    color: var(--rm-text);
    font-size: var(--rm-type-working);
    line-height: 1.65;
}

.legal-page .legal-note {
    margin-top: var(--rm-gap-section);
    padding: var(--rm-card-padding);
    border: 1px solid var(--rm-border);
    border-radius: var(--rm-control-radius);
    background: var(--rm-blue-50);
    color: var(--rm-muted);
}

/* Central authenticated control system.
   Pages may choose control width and height; typography, shape, and semantic
   color roles come only from this shared contract. */
.has-sidebar .app-content :where(
    button,
    .btn,
    .ui-button,
    .btn-outline,
    .btn-history,
    .btn-contact,
    .btn-filter-apply,
    .btn-filter-clear,
    .activity-submit
) {
    border-radius: var(--rm-control-radius) !important;
    font-family: var(--rm-font-sans) !important;
    font-size: var(--rm-type-option) !important;
    font-weight: 500 !important;
    line-height: 1.2;
}

.has-sidebar .app-content :where(
    input,
    select,
    textarea
) {
    border-radius: var(--rm-control-radius) !important;
    font-family: var(--rm-font-sans) !important;
    font-size: var(--rm-type-working) !important;
}

.has-sidebar .app-content :where(
    .ui-button--primary,
    .search-btn,
    .upload-btn,
    .btn-submit,
    .activity-submit,
    .btn:not(.btn-outline):not(.btn-history):not(.btn-contact):not(.btn-filter-apply):not(.btn-filter-clear)
) {
    border-color: var(--rm-action-primary-border) !important;
    background: var(--rm-action-primary-bg) !important;
    color: var(--rm-action-primary-text) !important;
}

.has-sidebar .app-content :where(
    .ui-button--secondary,
    .btn-filter-apply,
    .btn-contact:not(.done),
    .btn-draft
) {
    border-color: var(--rm-action-secondary-border) !important;
    background: var(--rm-action-secondary-bg) !important;
    color: var(--rm-action-secondary-text) !important;
}

.has-sidebar .app-content :where(
    .ui-button--outline,
    .ui-button--quiet,
    .btn-outline,
    .btn-history,
    .btn-filter-clear,
    .btn-skip
) {
    border-color: var(--rm-action-outline-border) !important;
    background: var(--rm-action-outline-bg) !important;
    color: var(--rm-action-outline-text) !important;
}

.has-sidebar .app-content :where(
    .ui-button--danger,
    .btn-remove,
    .history-delete-button,
    .upload-delete-button
) {
    border-color: var(--rm-action-danger-border) !important;
    background: var(--rm-action-danger-bg) !important;
    color: var(--rm-action-danger-text) !important;
}

.has-sidebar .app-content .btn-contact.done {
    border-color: var(--rm-success) !important;
    background: var(--rm-success-soft) !important;
    color: var(--rm-success) !important;
}

.has-sidebar .app-content :where(
    .ui-button--primary,
    .search-btn,
    .upload-btn,
    .btn-submit,
    .activity-submit,
    .btn:not(.btn-outline):not(.btn-history):not(.btn-contact):not(.btn-filter-apply):not(.btn-filter-clear)
):hover {
    border-color: var(--rm-amber-600) !important;
    background: var(--rm-amber-600) !important;
    color: #ffffff !important;
}

.has-sidebar .app-content :where(
    .ui-button--secondary,
    .btn-filter-apply,
    .btn-contact:not(.done),
    .btn-draft
):hover {
    border-color: var(--rm-navy-800) !important;
    background: var(--rm-navy-800) !important;
    color: #ffffff !important;
}

.has-sidebar .app-content :where(
    .ui-button--outline,
    .ui-button--quiet,
    .btn-outline,
    .btn-history,
    .btn-filter-clear,
    .btn-skip
):hover {
    border-color: var(--rm-blue-700) !important;
    background: var(--rm-blue-50) !important;
    color: var(--rm-blue-700) !important;
}

/* One icon-only delete control across authenticated user workflows. */
.has-sidebar .app-content .ui-delete-icon-button {
    width: var(--rm-control-height-sm);
    min-width: var(--rm-control-height-sm);
    height: var(--rm-control-height-sm);
    min-height: var(--rm-control-height-sm);
    display: inline-grid;
    padding: 0 !important;
    place-items: center;
    border: 1px solid var(--rm-danger) !important;
    border-radius: var(--rm-control-radius) !important;
    background: var(--rm-surface-raised) !important;
    color: var(--rm-danger) !important;
}

.has-sidebar .app-content .ui-delete-icon-button:hover {
    background: var(--rm-danger-soft) !important;
}

.has-sidebar .history-page .history-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--rm-control-height-sm);
    align-items: start;
    gap: var(--rm-gap-field);
}

@media (max-width: 680px) {
    .has-sidebar .upload-resume-page .upload-btn {
        width: 100%;
    }
}

/* One authenticated page boundary. Every regular-user page consumes these
   two tokens so its visible content ends on the same right-hand line. */
.has-sidebar .app-content > :is(
    .ui-page,
    .page-wrap,
    .mock-dashboard
):not(.admin-page) {
    width: min(
        calc(100% - var(--rm-auth-page-right-inset)),
        var(--rm-auth-page-max)
    ) !important;
    max-width: var(--rm-auth-page-max) !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    padding-right: var(--rm-page-gutter-standard) !important;
}

/* Find Recruiters consumes the shared page boundary all the way through its
   inner filter and result containers; long recruiter details wrap internally. */
.has-sidebar .recruiters-page :where(
    .recruiters-wrap,
    .summary-bar,
    .recruiter-filters,
    .recruiter-list,
    .recruiter-card
) {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.has-sidebar .recruiters-page :where(
    .contact-row,
    .contact-item
) {
    min-width: 0;
    overflow-wrap: anywhere;
}