/* ============================================================================
 * AURA Journey, Personality Library styles (hub theme: blue / Inter)
 * ==========================================================================*/

.lib-back {
  display: inline-block; margin-bottom: var(--space-lg);
  font-size: var(--text-sm); font-weight: 600;
  color: var(--text-secondary); text-decoration: none;
}
.lib-back:hover { color: var(--accent-primary); }

.lib-hero { padding: var(--space-2xl) 0 var(--space-xl); }
.lib-hero__title { font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; letter-spacing: -.02em; color: var(--text-primary); margin: 0 0 .5rem; }
.lib-hero__subtitle { font-size: var(--text-lg); color: var(--accent-primary); font-weight: 600; margin: 0 0 1rem; }
.lib-spec { display: inline-block; font-size: var(--text-sm); color: var(--text-secondary); background: rgba(74,158,255,.08); border: 1px solid rgba(74,158,255,.15); border-radius: 999px; padding: .375rem 1rem; margin-bottom: 1.25rem; }
.lib-lead { font-size: 1.0625rem; line-height: 1.7; color: var(--text-secondary); max-width: 720px; }

.lib-section { padding: var(--space-2xl) 0; border-top: 1px solid rgba(255,255,255,.05); }
.lib-h2 { font-size: clamp(1.375rem, 3vw, 1.875rem); font-weight: 700; color: var(--text-primary); margin: 0 0 .5rem; }
.lib-note { font-size: var(--text-base); color: var(--text-secondary); max-width: 680px; line-height: 1.6; margin: 0 0 1.5rem; }
.lib-note strong { color: var(--text-primary); }

.lib-warning { margin-top: 1.5rem; padding: 1rem 1.25rem; border-radius: var(--radius-lg); background: rgba(255,193,7,.07); border: 1px solid rgba(255,193,7,.22); color: var(--text-secondary); line-height: 1.6; font-size: .9375rem; }
.lib-warning strong { color: #ffc107; }

.lib-spectrum p { font-size: 1.0625rem; line-height: 1.75; color: var(--text-secondary); max-width: 760px; }
.lib-spectrum em { color: var(--text-primary); font-style: italic; }

/* Generic prose block (universal engine) */
.lib-prose p { font-size: 1.0625rem; line-height: 1.75; color: var(--text-secondary); max-width: 760px; margin: 0 0 .75rem; }
.lib-prose em { color: var(--text-primary); font-style: italic; }
.lib-prose strong { color: var(--text-primary); }
.lib-info { margin-top: 1.5rem; padding: 1rem 1.25rem; border-radius: var(--radius-lg); background: rgba(74,158,255,.06); border: 1px solid rgba(74,158,255,.22); color: var(--text-secondary); line-height: 1.6; font-size: .9375rem; }
.lib-info strong { color: var(--accent-primary); }

/* Dichotomies */
.dich-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.dich-card { padding: 1.25rem; background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); }
.dich-pair { font-size: 1.25rem; font-weight: 800; color: var(--accent-primary); letter-spacing: .04em; }
.dich-poles { font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); margin: .25rem 0 .5rem; }
.dich-card p { font-size: .875rem; color: var(--text-secondary); line-height: 1.5; margin: 0; }

/* Cognitive functions */
.fn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.fn-card { padding: 1.25rem; background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); }
.fn-code { display: inline-block; font-size: 1.125rem; font-weight: 800; color: #fff; background: var(--accent-primary); border-radius: var(--radius-sm); padding: .1rem .55rem; letter-spacing: .03em; }
.fn-code--inline { font-size: .9375rem; }
.fn-name { font-size: .9375rem; font-weight: 700; color: var(--text-primary); margin: .625rem 0 .5rem; }
.fn-cara { font-size: .8125rem; color: var(--text-secondary); line-height: 1.5; margin: 0 0 .5rem; }
.fn-ciri { font-size: .8125rem; color: var(--accent-primary); line-height: 1.5; margin: 0; font-style: italic; }

/* MBTI letters */
.mbti-letter { font-weight: 900; }

/* Type groups + cards */
.type-group { margin-bottom: var(--space-xl); }
.type-group__label { font-size: var(--text-sm); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-secondary); margin: 0 0 1rem; padding-bottom: .5rem; border-bottom: 1px solid rgba(255,255,255,.06); }
.type-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.type-card { display: block; padding: 1.25rem; background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); text-decoration: none; transition: all var(--transition-fast); }
.type-card:hover { border-color: rgba(74,158,255,.3); background: rgba(74,158,255,.04); transform: translateY(-2px); }
.type-card__code { font-size: 1.5rem; font-weight: 900; letter-spacing: .06em; }
.type-card__nick { font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); margin: .25rem 0 .625rem; }
.type-card__essence { font-size: .8125rem; color: var(--text-secondary); line-height: 1.5; margin: 0 0 .75rem; }
.type-card__cta { font-size: .75rem; font-weight: 600; color: var(--accent-primary); }

/* Type detail hero */
.type-hero { text-align: left; }
.type-badge { display: inline-block; padding: .3rem .85rem; font-size: .75rem; font-weight: 600; color: var(--accent-secondary); background: rgba(108,92,231,.12); border: 1px solid rgba(108,92,231,.28); border-radius: 999px; margin-bottom: 1rem; }
.type-hero__code { font-size: clamp(2.5rem, 8vw, 4.5rem); font-weight: 900; letter-spacing: .08em; margin: 0; line-height: 1; }
.type-hero__nick { font-size: var(--text-xl); font-weight: 700; color: var(--text-primary); margin: .5rem 0 1rem; }
.type-hero__essence { font-size: 1.125rem; color: var(--text-primary); max-width: 720px; }

/* Function stack (detail) */
.stack-list { display: flex; flex-direction: column; gap: .75rem; }
.stack-row { display: grid; grid-template-columns: 130px 1fr; gap: 1rem; padding: 1.25rem; background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); }
.stack-pos { display: flex; flex-direction: column; gap: .375rem; }
.stack-num { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; background: rgba(74,158,255,.12); color: var(--accent-primary); font-weight: 800; font-size: .875rem; }
.stack-posname { font-size: .8125rem; font-weight: 700; color: var(--text-secondary); text-transform: uppercase; letter-spacing: .05em; }
.stack-fn__head { font-size: 1rem; color: var(--text-primary); margin-bottom: .375rem; }
.stack-fn__cara { font-size: .875rem; color: var(--text-secondary); line-height: 1.5; margin: 0 0 .375rem; }
.stack-fn__pos { font-size: .8125rem; color: var(--accent-primary); line-height: 1.5; margin: 0; font-style: italic; }

/* Growth + temperament grids */
.growth-grid, .temp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.growth-card, .temp-card { padding: 1.25rem; border-radius: var(--radius-lg); border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.02); }
.growth-card__label, .temp-card__label { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: .5rem; }
.growth-card--stress { border-color: rgba(253,121,168,.25); }
.growth-card--stress .growth-card__label { color: #fd79a8; }
.growth-card--grow { border-color: rgba(0,184,148,.25); }
.growth-card--grow .growth-card__label { color: #00b894; }
.temp-card__label { color: var(--accent-primary); }
.growth-card p, .temp-card p { font-size: .9375rem; color: var(--text-secondary); line-height: 1.6; margin: 0; }

.type-actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; }

/* Library index cards */
.libidx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; margin-top: var(--space-xl); }
.libidx-card { display: block; padding: 1.5rem; background: rgba(255,255,255,.02); border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); text-decoration: none; transition: all var(--transition-fast); }
.libidx-card--ready:hover { border-color: rgba(74,158,255,.3); background: rgba(74,158,255,.04); transform: translateY(-2px); }
.libidx-card--soon { opacity: .55; cursor: default; }
.libidx-card__badge { display: inline-block; font-size: .625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: .2rem .5rem; border-radius: 999px; margin-bottom: .75rem; }
.libidx-card--ready .libidx-card__badge { background: rgba(74,255,158,.1); color: #4aff9e; }
.libidx-card--soon .libidx-card__badge { background: rgba(255,255,255,.06); color: var(--text-secondary); }
.libidx-card__name { font-size: 1.0625rem; font-weight: 700; color: var(--text-primary); margin: 0 0 .375rem; }
.libidx-card__desc { font-size: .875rem; color: var(--text-secondary); line-height: 1.55; margin: 0 0 .75rem; }
.libidx-card__cta { font-size: .8125rem; font-weight: 600; color: var(--accent-primary); }

@media (max-width: 560px) {
  .stack-row { grid-template-columns: 1fr; gap: .5rem; }
  .stack-pos { flex-direction: row; align-items: center; }
}