/* Shared art direction: application, landing page and collector guides. */
:root {
  --font-ui: "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
  --paper: #f5f9fb;
  --surface: #fff;
  --ink: #1b3646;
  --muted: #536d7d;
  --line: #dfeaf0;
  --azure: #007ac2;
  --azure-hover: #0068a6;
  --azure-deep: #005b91;
  --deep: var(--azure-deep);
  --azure-soft: #edf8ff;
  --wash: var(--azure-soft);
  --yellow: #facc45;
}
body.journal { font-family: var(--font-ui); }
/* A small yellow signature; primary controls retain the azure theme. */
.landing .brand-period { color: #d99b00; }
.landing .hero-copy > .eyebrow {
  border-left: 3px solid var(--yellow);
  padding-left: 10px;
}
.landing .brand-mark, .sidebar .brand-mark, .journal-brand .brand-mark {
  width: 32px;
  height: 36px;
  flex-shrink: 0;
  transform: none;
  background: url('/brand/generated-v1/trouvaille-symbol-trimmed.webp') center / contain no-repeat;
}
.landing .brand-mark > span, .sidebar .brand-mark > span,
.journal-brand .brand-mark > span { display: none; }
/* Fit the full wordmark inside the 224px navigation rail. */
.sidebar .sidebar-brand-row { margin-inline: 0; gap: 8px; min-width: 0; }
.sidebar .sidebar-brand-row > .brand {
  min-width: 0;
  max-width: 100%;
  gap: 7px;
  font-size: 20px;
  letter-spacing: -.7px;
  line-height: 1.3;
  white-space: nowrap;
}
.sidebar .sidebar-brand-row .brand-mark { width: 24px; height: 28px; }
.sidebar .sidebar-close { flex-shrink: 0; }
/* Account settings use a quiet, continuous surface inside the application shell. */
.workspace:has(.settings) .content { background: var(--paper); }
.workspace:has(.settings) .topbar { position: sticky; top: 0; z-index: 30; }
.settings { width: 100%; max-width: 1120px; gap: 28px; margin-inline: auto; }
.settings-head { padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.settings-head > div { min-width: 0; }
.settings-head h1 { font-size: 30px; line-height: 1.25; }
.settings-head p { font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.settings-layout { grid-template-columns: 180px minmax(0, 1fr); gap: 28px; }
.settings-nav { top: 92px; gap: 22px; }
.settings-group { min-width: 0; }
.settings-group > span { font-size: 11px; text-transform: uppercase; letter-spacing: .7px; }
.settings-group button { min-height: 46px; line-height: 1.4; padding: 10px; }
.settings-group button > span { min-width: 0; overflow-wrap: break-word; }
.settings-main { gap: 20px; }
.settings-title { font-size: 23px; line-height: 1.35; }
.settings-section-heading p { color: var(--muted); font-size: 14px; line-height: 1.6; margin: 6px 0 0; }
.settings-card { box-shadow: 0 3px 16px rgba(27,54,70,.025); }
.settings-card > header { padding: 18px 22px; background: #fff; }
.settings-card > header h2 { font-size: 16px; }
.setting-row { padding: 20px 22px; grid-template-columns: minmax(0,1fr) minmax(100px, auto); gap: 20px; }
.setting-label, .setting-control, .cell-card > span { min-width: 0; }
.setting-label span { max-width: 520px; line-height: 1.65; }
.setting-control { flex-wrap: wrap; max-width: 100%; }
.setting-control input:not([type=checkbox]) { min-width: 0; width: 100%; max-width: 320px; min-height: 46px; font-size: 16px; padding: 10px 12px; border: 1px solid #b8cdd9; border-radius: 8px; background: #fff; color: var(--ink); }
.setting-control .password-field { width: 100%; max-width: 320px; }
.setting-control .password-field input { padding-right: 84px; }
.settings .setting-value { text-align: right; overflow-wrap: anywhere; }
.settings .button { white-space: normal; line-height: 1.4; min-height: 44px; }
.settings .plan-summary { padding: 24px; background: #fff; border-color: var(--line); gap: 20px; }
.settings .plan-name { font-size: 21px; }
.settings .plan-summary p { max-width: 500px; line-height: 1.7; }
.settings .plan-summary > .button { flex-shrink: 0; }
.settings .settings-tr { padding: 16px 22px; }
.settings .cell-card strong, .settings .cell-card small { overflow-wrap: anywhere; }
.settings .pack-option { gap: 6px; padding: 24px 18px 18px; }
.settings .pack-option .button { margin-top: auto; }
.settings .account-acquisition { border-color: #b5d7eb; }
.settings .account-acquisition > header { padding: 24px 22px 20px; }
.settings .account-acquisition > header h2 { font-size: 26px; margin-top: 8px; }
.settings .account-acquisition > header p { max-width: 580px; font-size: 14px; line-height: 1.7; }
.settings .account-pilot-note { padding: 10px 12px; border-radius: 8px; background: var(--azure-soft); color: var(--azure-deep); margin-top: 14px; }
.settings .pack-option { display: flex; flex-direction: column; }
.settings .pack-price { color: var(--ink); font-size: 32px; letter-spacing: -1px; }
.settings .account-next-step { margin: 0; padding: 0 22px 22px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.settings-footer { padding: 16px 22px; flex-wrap: wrap; }
.settings-inline-form { width: 100%; max-width: 480px; }
.settings-inline-form label { display: block; margin-top: 16px; font-weight: 600; font-size: 14px; }
.settings-inline-form input { width: 100%; min-width: 0; min-height: 46px; margin-top: 8px; padding: 10px 12px; border: 1px solid #b8cdd9; border-radius: 8px; background: #fff; color: var(--ink); font-size: 16px; }
.settings-inline-form .password-field input { padding-right: 84px; }
.settings-inline-form .settings-fields { width: 100%; }
@media (max-width: 1100px) {
  .settings-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .settings .settings-nav { display: grid; position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .settings .settings-group { display: grid; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
  .settings .settings-group > span { padding: 10px 14px 6px; background: #fff; border: 0; }
  .settings .settings-group button { padding: 12px 14px; border-radius: 0; border: 0; }
  .settings .settings-group button.active { color: var(--azure-deep); background: var(--azure-soft); font-weight: 600; }
  .settings .settings-group button + button { border-top: 1px solid var(--line); }
  .settings .settings-group button > .icon:last-child { display: none; }
  .settings.no-tab .settings-main, .settings.has-tab .settings-nav { display: grid; }
  .settings.has-tab .settings-head { display: flex; }
  .settings .settings-back { display: none; }
  .settings .setting-row { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .settings .setting-control { justify-content: flex-start; }
  .settings .setting-value { text-align: left; }
  .settings .plan-summary { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 480px) {
  .settings { gap: 22px; }
  .settings-head { gap: 12px; padding-bottom: 18px; }
  .settings-head .large-avatar { width: 44px; height: 44px; font-size: 18px; flex-shrink: 0; }
  .settings-head h1 { font-size: 26px; }
  .settings-head p { font-size: 13px; }
  .settings .settings-nav { gap: 10px; }
  .settings .settings-group > span { font-size: 10px; padding-inline: 10px; }
  .settings .settings-group button { padding-inline: 10px; gap: 7px; font-size: 13px; min-height: 46px; }
  .settings .settings-card > header, .settings .setting-row { padding: 16px; }
  .settings .setting-control, .settings .setting-control input:not([type=checkbox]), .settings .setting-control .password-field { width: 100%; max-width: none; }
  .settings .settings-table .settings-tr { grid-template-columns: minmax(0,1fr); gap: 10px; padding: 16px; }
  .settings .plan-summary { padding: 18px; }
  .settings .plan-summary > .button { width: 100%; }
  .settings .settings-footer { padding: 16px; }
  .settings .settings-footer > .button { width: 100%; }
  .settings .settings-inline-form { padding: 0 16px 18px; }
  .settings .pack-options { padding: 20px 16px 16px; }
}
.landing-hero::before {
  background-image: url('/brand/generated-v1/landing-collection-1536.webp');
  background-position: right center;
}
.landing-hero::after {
  background: linear-gradient(90deg, #f5f9fb 0%, rgba(245,249,251,.97) 30%, rgba(245,249,251,.68) 55%, rgba(245,249,251,.12) 100%);
}
.landing-hero { border-bottom: 1px solid var(--line); }
.landing-hero .hero-copy { position: relative; z-index: 1; }
.landing-hero .hero-preview { background: rgba(255,255,255,.94); }
.home-last-action {
  background: linear-gradient(90deg, #f5f9fb 0%, rgba(245,249,251,.96) 55%, rgba(245,249,251,.35)), url('/brand/generated-v1/pages-sleeves-1536.webp') right center / cover no-repeat;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: clamp(24px, 4vw, 48px);
}
.content {
  background: url('/brand/generated-v1/pages-sleeves-1536.webp') right top / min(900px, 100%) auto no-repeat;
}
.journal-header { font-family: var(--font-ui); }
.journal-header > *, .journal-header nav > *, .journal-grid > *,
.journal-product-brand > * { min-width: 0; }
.journal-header nav { flex-wrap: wrap; }
.journal-header nav > a { min-height: 44px; display: inline-flex; align-items: center; }
.journal-header nav > a[aria-current="page"] { color: var(--azure-deep); text-decoration: underline; text-underline-offset: 6px; }
.journal-brand { letter-spacing: -1px; }
.journal-button { border-radius: 10px; }
.journal-hub .journal-hero {
  max-width: none;
  padding: clamp(28px, 5vw, 64px);
  margin: 6px 0 36px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(90deg, rgba(245,249,251,.99) 0%, rgba(245,249,251,.96) 48%, rgba(245,249,251,.15) 100%), url('/brand/generated-v1/landing-collection-1536.webp') right center / cover no-repeat;
}
.journal-hub .journal-hero h1 { max-width: 680px; }
.journal-hub .journal-hero > p { max-width: 570px; }
.journal-article-header {
  max-width: none;
  padding: 28px 0 40px;
  background: linear-gradient(90deg, var(--paper) 0%, rgba(245,249,251,.95) 65%, rgba(245,249,251,.3)), url('/brand/generated-v1/pages-sleeves-1536.webp') right center / cover no-repeat;
}
.journal-article-header h1 { max-width: 850px; }
.journal-grid { gap: 28px; }
.journal-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  box-shadow: 0 6px 24px rgba(27,54,70,.035);
}
.journal-card-media { border-radius: 8px; }
.journal-card h2 { font-size: 23px; }
.journal-card h2 a:hover { color: var(--azure-deep); }
.journal-product {
  border: 1px solid var(--line);
  border-top: 3px solid var(--azure);
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(237,248,255,.99) 0%, rgba(237,248,255,.96) 65%, rgba(237,248,255,.82)), url('/brand/generated-v1/pages-sleeves-1536.webp') right bottom / cover no-repeat;
}
@media (max-width: 760px) {
  /* Two deliberate rows: brand first, then three comfortably sized destinations. */
  .journal-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    min-height: 0;
    padding-block: 18px 14px;
  }
  .journal-header .journal-brand {
    justify-self: start;
    gap: 8px;
    font-size: clamp(23px, 6vw, 27px);
    line-height: 1.2;
    white-space: nowrap;
  }
  .journal-header .brand-mark { width: 28px; height: 32px; }
  .journal-header nav {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, .7fr) minmax(0, 1.2fr);
    width: 100%;
    gap: 8px;
    align-items: stretch;
  }
  .journal-header nav > a,
  .journal-header nav > a[href="/aide"] {
    display: inline-flex;
    justify-content: center;
    min-height: 46px;
    padding: 10px 6px;
    font-size: 14px;
    line-height: 1.3;
    text-align: center;
    border-radius: 8px;
  }
  .journal-header nav > a:not(.journal-button) { background: #fff; border: 1px solid var(--line); }
  .journal-header nav > a[aria-current="page"] {
    background: var(--azure-soft);
    border-color: #c5e4f5;
    text-decoration: none;
  }
  .journal-header nav > a.journal-button { padding-inline: 8px; }
  .journal-breadcrumb { overflow-wrap: anywhere; }
  .journal-hub, .journal-article, .journal-prose { min-width: 0; }
  .journal h1, .journal h2, .journal h3 { overflow-wrap: break-word; }
  .journal-product-brand { flex-wrap: wrap; gap: 10px; }
  .journal-footer .journal-brand { font-size: clamp(23px, 6vw, 27px); gap: 8px; }
  .landing-hero::before {
    background-image: url('/brand/generated-v1/landing-collection-768.webp');
    background-position: right bottom;
  }
  .landing-hero::after {
    background: linear-gradient(180deg, #f5f9fb 0%, rgba(245,249,251,.98) 46%, rgba(245,249,251,.45) 100%);
  }
  .content { background-image: url('/brand/generated-v1/pages-sleeves-768.webp'); }
  .home-last-action { padding: 24px 20px; border-radius: 12px; }
  .journal-hub .journal-hero {
    padding: 26px 22px 145px;
    border-radius: 14px;
    background-image: linear-gradient(180deg, #f5f9fb 0%, rgba(245,249,251,.98) 61%, rgba(245,249,251,.12) 100%), url('/brand/generated-v1/landing-collection-768.webp');
    background-position: right bottom;
  }
  .journal-hub .journal-hero h1 { font-size: clamp(32px, 8vw, 44px); }
  .journal-article-header { background-image: none; padding: 12px 0 26px; }
  .journal-grid { gap: 20px; }
  .journal-card { padding: 16px; }
  .journal-card h2 { font-size: 23px; }
  .home-last-action, .journal-product {
    background-image: linear-gradient(90deg, rgba(245,249,251,.97), rgba(245,249,251,.88)), url('/brand/generated-v1/pages-sleeves-768.webp');
  }
}
@media print {
  .journal-hub .journal-hero, .journal-article-header, .journal-product { background: none; box-shadow: none; }
  .journal-card { box-shadow: none; }
}
