/* The Diplomacy pages share the same surfaces, type and accents as MyTurnYet. */
.dip-site {
  --dip-ink: var(--lbn-text-main);
  --dip-paper: var(--lbn-bg-main);
  --dip-red: var(--lbn-accent-red);
  --dip-gold: var(--lbn-accent-warm);
  --dip-surface: var(--lbn-bg-panel);
  --dip-surface-alt: var(--lbn-bg-panel-alt);
  --dip-muted: var(--lbn-text-muted);
  --dip-border: var(--lbn-border-soft);
  --dip-on-accent: #fff;
  background: var(--dip-paper);
  color: var(--dip-ink);
  font-family: var(--lbn-font-display);
}

html[data-theme="dark"] .dip-site { --dip-on-accent: #101820; }

.dip-site h1, .dip-site h2, .dip-site h3,
.dip-brand-main, .dip-footer strong { font-family: var(--lbn-font-display); }
.dip-site button, .dip-site input, .dip-site select,
.dip-site textarea, .dip-site .dip-button { font-family: var(--lbn-font-ui); }

.dip-header {
  background: var(--dip-surface);
  border-bottom-color: var(--dip-border);
  box-shadow: 0 1px 0 var(--dip-border);
}
.dip-brand-sub, .dip-hero-copy > p:not(.dip-eyebrow),
.dip-section-heading > p:last-child, .dip-feature-grid p,
.dip-paths p, .dip-organizer p, .dip-inner .dip-lede,
.dip-host-grid p, .dip-variant-grid p, .dip-note,
.dip-command-head p, .dip-command-note span,
.dip-community-toolkit > div > p, .dip-community-toolkit li span,
.dip-rule-orders article p, .dip-table-card dt,
.dip-variant-copy dt, .dip-dossier dt,
.dip-hero-facts dt, .dip-filter-row span,
.dip-no-tables p, .dip-table-loading p,
.dip-table-tags span, .dip-campaign-briefs dt,
.dip-power-status li small, .dip-map-caption small {
  color: var(--dip-muted);
}

.dip-nav a:hover, .dip-nav a.dip-nav-active { color: var(--dip-red); }
.dip-sign-in, .dip-account button, .dip-menu-button, .dip-theme-toggle {
  border: 1px solid var(--dip-border);
  border-radius: var(--lbn-radius-sm, 6px);
  background: var(--dip-surface-alt);
  color: var(--dip-ink);
  cursor: pointer;
}
.dip-theme-toggle { padding: 9px 12px; white-space: nowrap; font: 650 .78rem var(--lbn-font-ui); }
.dip-sign-in:hover, .dip-account button:hover, .dip-menu-button:hover,
.dip-theme-toggle:hover { border-color: var(--dip-red); }
.dip-site :is(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--dip-red);
  outline-offset: 3px;
}

.dip-welcome {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(240px, 1fr);
  gap: clamp(24px, 5vw, 72px);
  align-items: center;
  background: var(--dip-surface-alt);
}
.dip-welcome h2 { margin: 0 0 14px; }
.dip-welcome p { color: var(--dip-muted); }
.dip-welcome .dip-actions { align-items: center; flex-wrap: wrap; }
.dip-welcome aside {
  padding: 24px;
  border: 1px solid var(--dip-border);
  border-radius: var(--lbn-radius-sm, 6px);
  background: var(--dip-surface);
}
.dip-welcome aside strong { display: block; margin-bottom: 8px; }
.dip-welcome aside a { color: var(--dip-red); }
@media (max-width: 720px) {
  .dip-welcome { grid-template-columns: 1fr; }
}

.dip-hero { background: var(--dip-paper); }
.dip-hero-map::after { background: linear-gradient(90deg, var(--dip-paper), transparent 20%), linear-gradient(0deg, rgba(0,0,0,.35), transparent 35%); }
.dip-section { border-top-color: var(--dip-border); }
.dip-feature-grid, .dip-hero-facts, .dip-command-head,
.dip-dossier-head { border-color: var(--dip-border); }
.dip-feature-grid article, .dip-hero-facts div + div,
.dip-organizer li, .dip-lessons li, .dip-variant-copy dl div,
.dip-campaign-briefs dl div, .dip-rule-orders article,
.dip-community-toolkit li { border-color: var(--dip-border); }

.dip-button { border-radius: var(--lbn-radius-sm, 6px); border-color: var(--dip-red); }
.dip-button-primary, .dip-filter-row .dip-filter-active,
.dip-filter-row button.dip-filter-active,
.dip-match-stage-tabs button.dip-filter-active {
  background: var(--dip-red);
  border-color: var(--dip-red);
  color: var(--dip-on-accent);
}
.dip-button-primary:hover { background: var(--lbn-accent-red-dark); color: #fff; }
.dip-button-secondary { background: var(--dip-surface); color: var(--dip-ink); }
.dip-button-secondary:hover { background: var(--dip-surface-alt); }
.dip-text-link { border-color: var(--dip-border); }

.dip-turn, .dip-practice, .dip-lesson-panel,
.dip-public-match-card, .dip-phase-cycle,
.dip-report-preview, .dip-dossier, .dip-matchbook {
  background: var(--dip-surface-alt);
  color: var(--dip-ink);
  border-color: var(--dip-border);
  box-shadow: none;
}
.dip-turn .dip-eyebrow, .dip-matchbook-detail .dip-status,
.dip-phase-cycle .dip-status, .dip-report-head > span,
.dip-dossier-head span, .dip-order-ledger b,
.dip-lesson-goal strong, .dip-bounce-demo span,
.dip-bounce-demo i, .dip-resolution-mark,
.dip-turn-steps b, .dip-turn-steps .dip-turn-active,
.dip-phase-cycle li::before { color: var(--dip-gold); }
.dip-turn .dip-section-heading > p:last-child,
.dip-resolution small, .dip-matchbook-detail > p,
.dip-lesson-panel > p, .dip-overview-lesson li span,
.dip-lesson-rule span, .dip-bounce-demo small,
.dip-public-detail > p, .dip-order-ledger small,
.dip-phase-cycle li span, .dip-report-head small,
.dip-report-preview > p, .dip-dossier > p {
  color: var(--dip-muted);
}
.dip-turn-steps, .dip-resolution, .dip-order,
.dip-lesson-goal, .dip-bounce-demo > div,
.dip-phase-cycle li, .dip-dossier dl div,
.dip-answer-buttons button, .dip-rule-orders,
.dip-phase-cycle { border-color: var(--dip-border); }
.dip-turn-steps li { color: var(--dip-muted); }
.dip-turn-steps button:hover { color: var(--dip-ink); }
.dip-record-lines span, .dip-readiness-bar { background: var(--dip-border); }
.dip-resolution-compact, .dip-feedback { background: var(--dip-surface); }
.dip-feedback span, .dip-practice p { color: var(--dip-muted); }
.dip-practice .dip-text-link, .dip-answer-buttons button { color: var(--dip-ink); }
.dip-answer-buttons button:hover, .dip-answer-buttons .dip-answer-selected {
  background: var(--lbn-accent-warm-muted);
  border-color: var(--dip-gold);
}
.dip-overview-lesson ol, .dip-order-ledger { background: var(--dip-border); }
.dip-overview-lesson li, .dip-lesson-rule,
.dip-order-ledger div { background: var(--dip-surface); }

.dip-paths article + article, .dip-organizer,
.dip-table-card, .dip-variant-grid article,
.dip-join-notice, .dip-no-tables,
.dip-table-loading, .dip-command-card,
.dip-match-stage-tabs button, .dip-rule-orders,
.dip-community-toolkit > div {
  background: var(--dip-surface);
  color: var(--dip-ink);
  border-color: var(--dip-border);
}
.dip-host-grid { background: var(--dip-border); }
.dip-host-grid article, .dip-campaign-briefs article,
.dip-power-status li, .dip-command-note,
.dip-table-tags span { background: var(--dip-surface); border-color: var(--dip-border); }
.dip-filter-row button, .dip-filter-row span {
  border-color: var(--dip-border);
  color: var(--dip-muted);
}
.dip-filter-row button:hover { color: var(--dip-ink); border-color: var(--dip-red); }
.dip-map-caption, .dip-hero-map span, .dip-matchbook-stamp,
.dip-variant-art span, .dip-public-map span,
.dip-command-map > span {
  background: var(--dip-surface);
  color: var(--dip-ink);
}
.dip-matchbook-stamp, .dip-variant-art span,
.dip-public-map span { border: 1px solid var(--dip-border); }
.dip-power-status li b { background: var(--lbn-accent-blue); }
.dip-power-status li.dip-power-waiting { background: var(--lbn-accent-warm-muted); }
.dip-command-note, .dip-note, .dip-lesson-rule { border-left-color: var(--dip-gold); }

.dip-footer {
  background: var(--lbn-bg-dark);
  color: var(--lbn-text-inverse);
  border-top: 1px solid var(--dip-border);
}
.dip-footer p, .dip-footer nav a { color: var(--lbn-sidebar-text); }
.dip-footer nav a:hover { color: var(--lbn-text-inverse); }

.dip-variant-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dip-variant-grid h2 { font-size: clamp(2rem, 2.7vw, 3rem); }
.dip-variant-copy a + a { display: block; margin-top: 12px; }
.dip-variant-intimate .dip-variant-art img { filter: saturate(.85); }
.dip-intimate-teaser { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 76px); align-items: center; background: var(--dip-surface-alt); }
.dip-intimate-teaser__art { min-height: 370px; height: 100%; overflow: hidden; border: 1px solid var(--dip-border); }
.dip-intimate-teaser__art img, .dip-intimate-detail__hero > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dip-intimate-teaser h2 { margin: 10px 0 22px; font-size: clamp(2rem, 4vw, 4rem); line-height: 1.06; }
.dip-intimate-teaser p:not(.dip-eyebrow), .dip-intimate-detail__hero p, .dip-intimate-detail__access p { color: var(--dip-muted); font: 400 1rem/1.7 var(--lbn-font-ui); }
.dip-private-note { padding-left: 16px; border-left: 3px solid var(--dip-gold); }
.dip-host-private-note { margin-top: 28px; color: var(--dip-muted); font: 400 .95rem/1.6 var(--lbn-font-ui); }
.dip-host-private-note a { color: var(--dip-ink); font-weight: 700; }
.dip-intimate-detail__hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); align-items: center; gap: clamp(24px, 5vw, 68px); margin: 42px 0 58px; background: var(--dip-surface); border: 1px solid var(--dip-border); }
.dip-intimate-detail__hero > img { max-height: 480px; min-height: 340px; }
.dip-intimate-detail__hero > div { padding: 30px; }
.dip-intimate-detail__hero h2 { font-size: clamp(2rem, 3.3vw, 3.5rem); line-height: 1.08; margin: 16px 0; }
.dip-intimate-detail__features { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dip-intimate-detail__access { margin-top: 48px; padding: 28px 32px; background: var(--dip-surface-alt); border: 1px solid var(--dip-border); }
.dip-intimate-detail__access strong { display: block; font: 700 1.2rem var(--lbn-font-ui); }
.dip-intimate-detail__access .dip-actions { margin-top: 18px; }
.dip-preset-grid { margin-top: 22px; }
.dip-preset-grid article { display: flex; flex-direction: column; gap: 14px; }
.dip-preset-grid article.dip-preset-preferred { outline: 2px solid var(--dip-red); outline-offset: -2px; }
.dip-preset-grid h3 { margin: 0; font-size: 1.5rem; }
.dip-preset-grid p { margin: 0 0 12px; flex: 1; }
.dip-preset-grid .dip-button { align-self: flex-start; }
.dip-live-proof { margin-top: 38px; padding: 28px; background: var(--dip-surface); border: 1px solid var(--dip-border); }
.dip-live-proof h2 { margin: 8px 0 18px; font-size: clamp(1.5rem, 3vw, 2.5rem); }
.dip-live-proof > div { display: flex; flex-wrap: wrap; gap: 12px; }
.dip-live-proof a { color: var(--dip-ink); border: 1px solid var(--dip-border); padding: 12px 16px; font: 700 .85rem var(--lbn-font-ui); }
.dip-live-proof a:hover { border-color: var(--dip-red); color: var(--dip-red); }
.dip-table-alert { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 24px 0; padding: 20px 24px; text-align: left; background: var(--dip-surface-alt); border: 1px solid var(--dip-border); }
.dip-table-alert strong { display: block; color: var(--dip-ink); font: 700 1.1rem var(--lbn-font-ui); }
.dip-table-alert p { margin: 6px 0 0; color: var(--dip-muted); }
.dip-table-alert .dip-button { flex: none; }

@media (max-width: 1100px) {
  .dip-intimate-detail__features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1000px) {
  .dip-theme-toggle { margin-left: auto; }
  .dip-menu-button { margin-left: 0; }
}
@media (max-width: 640px) {
  .dip-variant-grid { grid-template-columns: 1fr; }
  .dip-intimate-teaser, .dip-intimate-detail__hero { grid-template-columns: 1fr; }
  .dip-intimate-teaser__art { min-height: 240px; }
  .dip-intimate-detail__hero > img { min-height: 230px; max-height: 320px; }
  .dip-intimate-detail__features { grid-template-columns: 1fr; }
  .dip-table-alert { flex-direction: column; align-items: stretch; }
  .dip-theme-toggle { order: 2; padding: 8px; }
  .dip-menu-button { order: 1; margin-left: auto; }
  .dip-nav { order: 5; }
  .dip-sign-in, .dip-account { order: 3; }
}