/* ============================================
   Shared primitives — one class per vocation.
   Variants (secondary, error, current…) change color only.
   Layout wrappers (account grid, article shell) stay in their files.
   ============================================ */

/* --- Public page title (H1) --- */
.me5rine-lab-page-title,
.me5rine-entry__title,
.me5rine-article__title,
.me5rine-profile__name,
.ml-game-content__title {
    margin: 0 0 var(--me5rine-lab-spacing-md, 15px);
    font-family: var(--me5rine-lab-font);
    font-size: clamp(1.75rem, 3.4vw, 2.5rem);
    font-weight: 600;
    line-height: 1.2;
    color: var(--me5rine-lab-text, #11161E);
}

.me5rine-lab-page-title a,
.me5rine-entry__title a {
    color: inherit;
    text-decoration: none;
}

.me5rine-article__title,
.ml-game-content__title {
    margin-bottom: 0;
}

/* --- Public section title (home rails, account cards, nested forms) --- */
.me5rine-lab-section-title,
.me5rine-home__title,
.me5rine-lab-title,
.me5rine-lab-title-medium,
.me5rine-lab-form-title {
    margin: 0 0 var(--me5rine-lab-spacing-md, 15px);
    font-family: var(--me5rine-lab-font);
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
    color: var(--me5rine-lab-text, #11161E);
}

.me5rine-lab-section-title,
.me5rine-home__title {
    margin-bottom: 0;
}

.me5rine-lab-title-large {
    margin: 0 0 var(--me5rine-lab-spacing-md, 15px);
    font-family: var(--me5rine-lab-font);
    font-size: var(--me5rine-lab-title-large-size, 2rem);
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
    color: var(--me5rine-lab-text, #11161E);
}

.me5rine-lab-title-small {
    margin: 0 0 var(--me5rine-lab-spacing-sm, 10px);
    font-family: var(--me5rine-lab-font);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: normal;
    text-transform: none;
    color: var(--me5rine-lab-text, #11161E);
}

/* Dashboard subtitle = public lead (sentence case). Kicker stays uppercase. */
.me5rine-lab-subtitle {
    margin: 0 0 var(--me5rine-lab-spacing-md, 15px);
    font-family: var(--me5rine-lab-font);
    font-size: 1.05rem;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: normal;
    text-transform: none;
    color: var(--me5rine-lab-text-light, #5D697D);
}

.me5rine-lab-form-label,
.me5rine-lab-form-view-label {
    display: block;
    font-family: var(--me5rine-lab-font);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
    color: var(--me5rine-lab-text, #11161E);
}

/* --- Kicker (small label above a heading) --- */
.me5rine-lab-kicker,
.me5rine-lab-form-subtitle {
    margin: 0 0 var(--me5rine-lab-spacing-xs, 5px);
    font-family: var(--me5rine-lab-font);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--me5rine-lab-secondary, #0485C8);
}

.me5rine-lab-form-subtitle {
    color: var(--me5rine-lab-primary, #2E576F);
    margin-bottom: var(--me5rine-lab-spacing-lg, 20px);
}

/* --- Lead (intro under a public title; dashboard uses .me5rine-lab-subtitle) --- */
.me5rine-lab-lead,
.me5rine-article__lead,
.me5rine-home-hero__lead,
.me5rine-home-cta__lead,
.me5rine-profile__bio,
.me5rine-author-archive__bio {
    margin: 0.5rem 0 0;
    max-width: 46rem;
    font-family: var(--me5rine-lab-font);
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--me5rine-lab-text-light, #5D697D);
}

.me5rine-article__lead {
    margin: 0;
    font-size: 1.125rem;
}

/* --- Back / text link --- */
.me5rine-lab-back-link,
.me5rine-author-archive__profile {
    display: inline-block;
    margin: var(--me5rine-lab-spacing-sm, 10px) 0 0;
    font-family: var(--me5rine-lab-font);
    font-weight: 600;
    color: var(--me5rine-lab-secondary, #0485C8);
    text-decoration: none;
}

.me5rine-lab-back-link:hover,
.me5rine-lab-back-link:focus-visible,
.me5rine-author-archive__profile:hover,
.me5rine-author-archive__profile:focus-visible {
    text-decoration: underline;
}

/* --- Settings nav (account, similar side lists) --- */
.me5rine-lab-nav-link {
    display: block;
    padding: var(--me5rine-lab-spacing-sm, 10px) var(--me5rine-lab-spacing-md, 15px);
    border-radius: var(--me5rine-lab-control-radius, var(--me5rine-lab-radius-sm, 6px));
    font-family: var(--me5rine-lab-font);
    font-weight: 600;
    color: var(--me5rine-lab-text, #11161E);
    text-decoration: none;
}

.me5rine-lab-nav-link:hover,
.me5rine-lab-nav-link:focus-visible {
    background: var(--me5rine-lab-bg-secondary, #F9FAFB);
}

.me5rine-lab-nav-link.is-current {
    background: var(--me5rine-lab-bg-secondary, #F9FAFB);
    color: var(--me5rine-lab-nav-current, var(--me5rine-lab-secondary, #0485C8));
}

/* --- Underline tabs (public profile) --- */
.me5rine-lab-tab {
    display: inline-flex;
    align-items: center;
    padding: var(--me5rine-lab-spacing-md, 15px) var(--me5rine-lab-spacing-md, 15px);
    font-family: var(--me5rine-lab-font);
    font-weight: 600;
    color: var(--me5rine-lab-text-light, #5D697D);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    white-space: nowrap;
}

.me5rine-lab-tab:hover,
.me5rine-lab-tab:focus-visible {
    color: var(--me5rine-lab-text, #11161E);
}

.me5rine-lab-tab.is-current {
    color: var(--me5rine-lab-text, #11161E);
    border-bottom-color: var(--me5rine-lab-nav-current, var(--me5rine-lab-secondary, #0485C8));
}

/* --- Native checkbox + label --- */
.me5rine-lab-form-check {
    display: flex;
    align-items: flex-start;
    gap: var(--me5rine-lab-spacing-sm, 10px);
    font-family: var(--me5rine-lab-font);
    font-weight: 600;
    cursor: pointer;
}

/* --- Empty / state copy aliases onto notices --- */
.me5rine-lab-state-message,
.me5rine-profile-about__empty {
    border-radius: var(--me5rine-lab-control-radius, var(--me5rine-lab-radius-md, 8px));
    padding: var(--me5rine-lab-notice-padding-y, 18px) var(--me5rine-lab-notice-padding-x, 24px);
    margin: 0 0 var(--me5rine-lab-spacing-lg, 20px);
    font-family: var(--me5rine-lab-font);
    font-size: 15px;
    line-height: 1.5;
    background: var(--me5rine-lab-info-bg, rgba(33, 150, 243, 0.1));
    border: 1px solid var(--me5rine-lab-info-border, rgba(33, 150, 243, 0.2));
    border-left: 4px solid var(--me5rine-lab-info, #2196F3);
    color: var(--me5rine-lab-info, #2196F3);
}

/* --- Progress (achievement bars, quotas) --- */
.me5rine-lab-progress {
    display: block;
    width: 100%;
    height: 0.5rem;
    overflow: hidden;
    border-radius: var(--me5rine-lab-radius-sm, 5px);
    background: var(--me5rine-lab-control-border, rgba(17, 22, 30, 0.12));
}

.me5rine-lab-progress__bar {
    display: block;
    height: 100%;
    width: var(--me5rine-lab-progress, 0%);
    background: var(--me5rine-lab-nav-current, #3d7ea6);
    border-radius: inherit;
}
