/*
 * Preservia Pierre — shared portal theme
 * Loaded after every feature stylesheet so the complete Anima Portal follows
 * the public site's navy, cobalt and pale-stone visual system.
 */

:root {
  color-scheme: light;
  --pp-navy: #061a32;
  --pp-navy-deep: #031326;
  --pp-navy-soft: #0d2948;
  --pp-blue: #2457e6;
  --pp-blue-dark: #173fb8;
  --pp-blue-pale: #c9d8ff;
  --pp-blue-mist: #eaf0ff;
  --pp-ice: #f5f7fc;
  --pp-stone: #f4f1ec;
  --pp-white: #fff;
  --pp-ink: #071a31;
  --pp-muted: #637083;
  --pp-line: #d8e0eb;
  --pp-line-strong: #bdc9d9;
  --pp-success: #197257;
  --pp-warning: #9a5a18;
  --pp-danger: #a53b36;
  --pp-sans: "Bahnschrift", "Segoe UI", Arial, sans-serif;
  --pp-serif: Georgia, "Times New Roman", serif;

  --studio-bg: var(--pp-ice);
  --studio-panel: var(--pp-white);
  --studio-line: var(--pp-line);
  --studio-text: var(--pp-ink);
  --studio-muted: var(--pp-muted);
  --studio-cyan: var(--pp-blue);
  --studio-orange: var(--pp-blue-dark);
  --forest: var(--pp-blue);
  --forest-deep: var(--pp-blue-dark);
  --lime: var(--pp-blue-pale);
  --green: var(--pp-blue);
  --accent: var(--pp-blue);
  --ink: var(--pp-ink);
  --paper: var(--pp-white);
}

/* Shared studio shell ----------------------------------------------------- */

body.studio-body {
  min-width: 0;
  color: var(--pp-ink);
  background:
    radial-gradient(circle at 92% 3%, rgba(201, 216, 255, .72), transparent 31rem),
    linear-gradient(180deg, #fff 0, var(--pp-ice) 19rem, #eef3fa 100%);
  font-family: var(--pp-sans);
}

.studio-body a { color: var(--pp-blue-dark); }
.studio-body a:hover { color: var(--pp-blue); }
.studio-body :focus-visible {
  outline: 3px solid var(--pp-blue);
  outline-offset: 3px;
}

.studio-header {
  min-height: 100px;
  color: #fff;
  background: linear-gradient(112deg, var(--pp-navy-deep), var(--pp-navy) 56%, var(--pp-navy-soft));
  border-bottom: 4px solid var(--pp-blue);
  box-shadow: 0 14px 40px rgba(3, 19, 38, .16);
}

.studio-header .studio-brand,
.studio-header .studio-site-link { color: #fff; }
.studio-header .studio-brand:hover,
.studio-header .studio-site-link:hover { color: var(--pp-blue-pale); }
.studio-header .studio-brand small,
.studio-header .studio-session { color: #cbd7e8; }
.studio-header .studio-session i {
  background: var(--pp-blue-pale);
  box-shadow: 0 0 0 5px rgba(201, 216, 255, .12), 0 0 16px var(--pp-blue-pale);
}

.studio-brand img {
  border: 1px solid rgba(255, 255, 255, .4);
  border-radius: 15px;
  background: #fff;
  object-fit: contain;
}

.studio-brand span {
  color: inherit;
  font-family: var(--pp-sans);
  font-weight: 700;
  letter-spacing: .08em;
}

.studio-layout { background: rgba(255, 255, 255, .38); }
.studio-nav {
  background: rgba(255, 255, 255, .92);
  border-color: var(--pp-line);
  box-shadow: 18px 0 42px rgba(7, 26, 49, .035);
}
.studio-nav > .studio-eyebrow { color: #74839a; }
.studio-nav > a {
  color: #526279;
  border-color: #e4eaf2;
  border-radius: 7px;
  transition: color .18s ease, background .18s ease, transform .18s ease;
}
.studio-nav > a:hover {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  text-decoration: none;
  transform: translateX(2px);
}
.studio-nav > a[aria-current],
.studio-nav > a[aria-current="page"] {
  color: #fff;
  background: linear-gradient(115deg, var(--pp-blue-dark), var(--pp-blue));
  border-left-color: var(--pp-blue-pale);
  box-shadow: 0 12px 26px rgba(36, 87, 230, .2);
}
.studio-nav > a[aria-current] b { opacity: .9; }
.studio-logout { color: var(--pp-danger); }

.studio-main { color: var(--pp-ink); }
.studio-page-heading h1,
.login-panel h1,
.docs-heading h1,
.docs-section-heading h2,
.docs-editor-heading h2,
.ads-heading h1,
.ads-section-heading h2 {
  color: var(--pp-navy);
  font-family: var(--pp-serif);
  font-weight: 400;
  letter-spacing: -.055em;
}
.studio-page-heading h1 em,
.login-panel h1 em,
.docs-heading h1 em,
.ads-heading h1 em,
.studio-eyebrow,
.studio-text-link { color: var(--pp-blue); }
.studio-lead,
.studio-footnote { color: var(--pp-muted); }

.studio-modules {
  gap: 18px;
  background: transparent;
  border: 0;
}
.studio-module {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--pp-line);
  border-radius: 16px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 16px 45px rgba(7, 26, 49, .07);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.studio-module::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  content: "";
  background: linear-gradient(var(--pp-blue), var(--pp-blue-pale));
}
.studio-module:hover {
  border-color: #b5c6e5;
  box-shadow: 0 22px 54px rgba(7, 26, 49, .11);
  transform: translateY(-2px);
}
.studio-module h2 { color: var(--pp-navy); }
.studio-module p { color: var(--pp-muted); }
.module-index { color: var(--pp-blue); }

.studio-button {
  color: #fff;
  background: linear-gradient(110deg, var(--pp-blue-dark), var(--pp-blue));
  border-color: var(--pp-blue);
  border-radius: 6px;
  box-shadow: 0 9px 22px rgba(36, 87, 230, .16);
}
.studio-button:hover {
  color: #fff;
  background: linear-gradient(110deg, #123595, var(--pp-blue-dark));
  filter: none;
}
.studio-button.secondary {
  color: var(--pp-blue-dark);
  background: #fff;
  border-color: #9eb2d5;
  box-shadow: none;
}
.studio-button.secondary:hover { color: var(--pp-navy); background: var(--pp-blue-mist); }
.studio-button.danger {
  color: var(--pp-danger);
  background: #fff7f6;
  border-color: #d9aaa6;
  box-shadow: none;
}

.studio-body input,
.studio-body textarea,
.studio-body select {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
  border-radius: 6px;
}
.studio-body input::placeholder,
.studio-body textarea::placeholder { color: #8995a6; opacity: 1; }
.studio-body input:focus,
.studio-body textarea:focus,
.studio-body select:focus {
  border-color: var(--pp-blue);
  box-shadow: 0 0 0 4px rgba(36, 87, 230, .11);
}

.studio-alert {
  color: #7a3a27;
  background: #fff7ef;
  border-left-color: #c87835;
}
.studio-success {
  color: #145a45;
  background: #eef9f5;
  border-left-color: var(--pp-success);
}
.studio-empty {
  color: var(--pp-muted);
  background: rgba(255, 255, 255, .86);
  border-color: var(--pp-line);
  border-radius: 12px;
}
.studio-empty h2 { color: var(--pp-navy); }
.studio-skip { color: #fff; background: var(--pp-blue-dark); }
.studio-menu-toggle {
  color: #fff;
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .35);
  border-radius: 8px;
}
.studio-footer {
  color: #cbd7e8;
  background: var(--pp-navy-deep);
  border-color: rgba(255, 255, 255, .08);
}

/* Login ------------------------------------------------------------------ */

.studio-login {
  background:
    linear-gradient(90deg, rgba(3, 19, 38, .97) 0 31%, transparent 31%),
    radial-gradient(circle at 82% 10%, rgba(201, 216, 255, .72), transparent 35rem),
    var(--pp-ice);
}
.studio-login .login-home { color: #dce5f5; }
.login-panel {
  overflow: hidden;
  max-width: 520px;
  border: 1px solid var(--pp-line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 30px 90px rgba(3, 19, 38, .2);
}
.login-panel::before {
  display: block !important;
  position: absolute;
  inset: 0 0 auto;
  width: auto;
  height: 6px;
  content: "";
  border: 0;
  background: linear-gradient(90deg, var(--pp-blue), var(--pp-blue-pale));
}
.login-panel .studio-brand { color: var(--pp-navy); }
.login-panel .studio-lead,
.login-note,
.login-coordinate { color: var(--pp-muted); }

/* Current plan ----------------------------------------------------------- */

.studio-current-plan {
  border-color: #b8c9e7;
  background: linear-gradient(120deg, #fff, var(--pp-blue-mist));
  box-shadow: 0 16px 42px rgba(7, 26, 49, .08);
}
.studio-plan-symbol {
  color: var(--pp-blue);
  background: #fff;
  border-color: #a9bde2;
}
.studio-plan-name h2 { color: var(--pp-navy); }
.studio-plan-name h2 span,
.studio-plan-name p,
.studio-plan-boost strong { color: var(--pp-muted); }
.studio-plan-boost { border-color: #c1cde0; }
.studio-plan-boost span { color: var(--pp-blue-dark); }

/* Client and request surfaces ------------------------------------------- */

:root {
  --cp-red: var(--pp-blue);
  --cp-ink: var(--pp-ink);
  --cp-muted: var(--pp-muted);
  --cp-line: var(--pp-line);
  --cp-bg: var(--pp-ice);
}
body:not(.studio-body) .cp-header {
  color: #fff;
  background: linear-gradient(110deg, var(--pp-navy-deep), var(--pp-navy));
  border: 0;
  box-shadow: 0 12px 36px rgba(3, 19, 38, .13);
}
.cp-brand,
.cp-header nav a { color: #fff; }
.cp-header nav a[aria-current] { color: var(--pp-blue-pale); }
.cp-main h1,
.cp-main h2,
.cp-main h3 { color: var(--pp-navy); }
.cp-main h1 { font-family: var(--pp-serif); font-weight: 400; }
.cp-button {
  color: #fff;
  background: var(--pp-blue);
  border-color: var(--pp-blue);
}
.cp-button:hover { color: #fff; background: var(--pp-blue-dark); }
.cp-button.secondary { color: var(--pp-blue-dark); background: #fff; border-color: #9eb2d5; }
.cp-button.secondary:hover { color: var(--pp-navy); background: var(--pp-blue-mist); }
.cp-note { border-left-color: var(--pp-blue); }
.cp-status { color: var(--pp-blue-dark); background: var(--pp-blue-mist); }
.cp-message.is-team { background: #f7f9ff; border-left-color: var(--pp-blue); }
.cp-proposal { background: #fff; border-color: var(--pp-line); box-shadow: 0 12px 30px rgba(7, 26, 49, .05); }
.cp-footer { color: #cbd7e8; background: var(--pp-navy-deep); border: 0; }
.cp-footer a { color: #fff; }
.cp-check input { accent-color: var(--pp-blue); }

/* Documents -------------------------------------------------------------- */

.docs-page,
.docs-dialog {
  --docs-line: var(--pp-line);
  --docs-lime: var(--pp-blue);
  --docs-muted: var(--pp-muted);
  --docs-panel: #fff;
  color: var(--pp-ink);
  color-scheme: light;
}
.docs-heading h1 em { color: var(--pp-blue); }
.docs-page .studio-button:not(.secondary) {
  color: #fff;
  background: linear-gradient(110deg, var(--pp-blue-dark), var(--pp-blue));
  border-color: var(--pp-blue);
}
.docs-page .studio-button:not(.secondary):hover {
  color: #fff;
  background: linear-gradient(110deg, #123595, var(--pp-blue-dark));
}
.docs-heading > div > p,
.docs-help,
.docs-row-meta,
.docs-editor-heading p,
.docs-empty p,
.docs-library-note { color: var(--pp-muted); }
.docs-page .docs-library-note { color: var(--pp-muted); }
.docs-page .docs-overview > div,
.docs-page .docs-profile,
.docs-page .docs-list,
.docs-page .docs-form,
.docs-page .docs-drafts {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line);
  box-shadow: 0 12px 34px rgba(7, 26, 49, .055);
}
.docs-page .docs-overview > div { background: linear-gradient(140deg, #fff, #f4f7ff); }
.docs-page .docs-overview strong,
.docs-page .docs-row-total,
.docs-page .docs-row-info h3,
.docs-page .docs-profile summary strong,
.docs-page .docs-empty h3,
.docs-page .docs-form-section-heading h3 { color: var(--pp-navy); }
.docs-page .docs-overview-icon,
.docs-page .docs-search > span,
.docs-page .docs-profile-symbol,
.docs-page .docs-row-icon,
.docs-page .docs-empty > span,
.docs-page .docs-form-section-heading > span {
  color: var(--pp-blue);
}
.docs-page .docs-profile-symbol,
.docs-page .docs-row-icon,
.docs-page .docs-empty > span,
.docs-page .docs-form-section-heading > span {
  background: var(--pp-blue-mist);
  border-color: #b7c8e8;
}
.docs-page .docs-profile-state,
.docs-page .docs-badge {
  color: #54657e;
  background: #f1f4f8;
  border-color: #ccd5e2;
}
.docs-page .docs-profile-state.is-complete,
.docs-page .docs-badge.issued {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b5c6e5;
}
.docs-page .docs-badge.archived,
.docs-page .docs-paper-top .docs-badge {
  color: #54657e;
  background: #f1f4f8;
  border-color: #ccd5e2;
}
.docs-page .docs-paper-top .docs-badge.issued {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b5c6e5;
}
.docs-page .docs-row-open,
.docs-page .docs-add-line,
.docs-page .docs-text-button,
.docs-page .docs-final-actions > button,
.docs-page .docs-mailto,
.docs-page .docs-invoicing-note a {
  color: var(--pp-blue-dark);
  border-color: #abc0e6;
}
.docs-page .docs-row-open,
.docs-page .docs-add-line { background: #fff; }
.docs-page .docs-row-open:hover,
.docs-page .docs-add-line:hover { background: var(--pp-blue-mist); }
.docs-page .docs-field label,
.docs-page .docs-line label { color: var(--pp-ink); }
.docs-page .docs-field label > span[aria-hidden] { color: var(--pp-blue); }
.docs-page .docs-field label > span:not([aria-hidden]) { color: #748197; }
.docs-page .docs-field input,
.docs-page .docs-field select,
.docs-page .docs-field textarea,
.docs-page .docs-toolbar input,
.docs-page .docs-toolbar select,
.docs-page .docs-line input,
.docs-page .docs-line select,
.docs-page .docs-line textarea,
.docs-page .docs-catalog-picker select,
.docs-page .docs-paid-controls input {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
}
.docs-page .docs-field input::placeholder,
.docs-page .docs-field textarea::placeholder,
.docs-page .docs-toolbar input::placeholder,
.docs-page .docs-line input::placeholder,
.docs-page .docs-line textarea::placeholder { color: #8995a6; opacity: 1; }
.docs-summary-help,
.docs-page .docs-lines-labels,
.docs-page .docs-line-item-total,
.docs-page .docs-invoicing-note,
.docs-preview-number,
.docs-page .docs-preview-title,
.docs-page .docs-totals > div,
.docs-page .docs-summary-tax-note { color: var(--pp-muted); }
.docs-page .docs-field input[readonly],
.docs-page .docs-field input:disabled,
.docs-page .docs-field select:disabled,
.docs-page .docs-field textarea:disabled,
.docs-page .docs-line input:disabled,
.docs-page .docs-line select:disabled,
.docs-page .docs-line textarea:disabled {
  color: #6b7788;
  background: #f1f4f8;
}
.docs-page .docs-status,
.docs-page .docs-lock-note {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b6c8e8;
}
.docs-page .docs-status[data-error="true"],
.docs-page .docs-inline-status[data-error="true"] { color: var(--pp-danger); border-color: #d8aaa7; }
.docs-page .docs-paper {
  color: var(--pp-ink);
  background: linear-gradient(150deg, #fff, #f7f4ef);
  border-color: #d7d0c7;
  box-shadow: 0 18px 45px rgba(7, 26, 49, .1);
}
.docs-page .docs-paper h3,
.docs-page .docs-preview-client,
.docs-page .docs-totals strong,
.docs-page .docs-total-final,
.docs-page .docs-total-final strong { color: var(--pp-navy); }
.docs-page .docs-preview-number,
.docs-page .docs-totals,
.docs-page .docs-total-final { border-color: #d8d1c8; }
.docs-dialog {
  color: var(--pp-ink);
  background: #fff;
  border-color: #b7c7df;
  box-shadow: 0 28px 100px rgba(3, 19, 38, .32);
}
.docs-dialog::backdrop { background: rgba(3, 19, 38, .72); }
.docs-dialog h2 { color: var(--pp-navy); }
.docs-dialog p { color: var(--pp-muted); }
.docs-dialog-symbol { color: var(--pp-blue); background: var(--pp-blue-mist); border-color: #b5c6e5; }

/* Journal --------------------------------------------------------------- */

.journal-admin { --journal-paper: #fff; }
.journal-admin .journal-row,
.journal-admin .journal-editor fieldset,
.journal-admin .studio-card {
  color: var(--pp-ink);
  background: linear-gradient(135deg, #fff, #f7f9ff);
  border-color: var(--pp-line);
  box-shadow: 0 13px 34px rgba(7, 26, 49, .055);
}
.journal-admin .journal-row h2 { color: var(--pp-navy); }
.journal-admin .journal-editor input,
.journal-admin .journal-editor textarea,
.journal-admin .journal-editor select {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
}
.journal-admin .journal-format button {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b9c9e5;
}
.journal-admin .journal-format button:hover { background: #dae5ff; }
.journal-admin .journal-editor input[readonly] { color: #6b7788; background: #f1f4f8; }
.journal-admin input[type="file"]::file-selector-button {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b9c9e5;
}
.journal-admin .journal-status {
  color: var(--pp-warning);
  background: #fff7ed;
  border-color: #e1bf91;
}
.journal-admin .journal-status.published {
  color: var(--pp-success);
  background: #eef8f5;
  border-color: #a8d2c5;
}

/* Advertising workspace ------------------------------------------------- */

.ads-page {
  --ads-lime: var(--pp-blue);
  --ads-soft: var(--pp-muted);
  --ads-border: var(--pp-line);
  --ads-panel: #fff;
  color: var(--pp-ink);
}
.ads-heading-copy > p,
.ads-section-note,
.ads-platform > p,
.ads-form-intro p,
.ads-draft-meta,
.ads-empty p { color: var(--pp-muted); }
.ads-jump { color: var(--pp-blue-dark); border-color: #abc0e6; }
.ads-plan {
  color: #fff;
  background: linear-gradient(132deg, var(--pp-navy-deep), var(--pp-navy-soft));
  border-color: rgba(201, 216, 255, .34);
  box-shadow: 0 20px 52px rgba(3, 19, 38, .2);
}
.ads-plan-label,
.ads-plan h2 span,
.ads-plan > p { color: #c8d5e7; }
.ads-plan-mark,
.ads-plan-bottom strong { color: var(--pp-blue-pale); }
.ads-plan-bottom { border-color: rgba(201, 216, 255, .22); }
.ads-plan-bottom > span { color: #e7edfa; border-color: rgba(201, 216, 255, .28); }
.ads-plan::after { border-color: rgba(201, 216, 255, .16); }
.ads-publishing-note {
  color: #53637a;
  background: #f7f9ff;
  border-color: var(--pp-line);
}
.ads-publishing-note > span { color: var(--pp-blue); }
.ads-platform,
.ads-form,
.ads-drafts,
.ads-saved-section > .ads-empty {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line);
  box-shadow: 0 12px 34px rgba(7, 26, 49, .055);
}
.ads-platform:hover { background: #f7f9ff; border-color: #aebfe0; }
.ads-platform-icon {
  color: var(--pp-blue-dark) !important;
  background: var(--pp-blue-mist);
  border-color: #bfd0ed;
}
.ads-platform-category,
.ads-platform > small,
.ads-external { color: #6d7b90; }
.ads-platform-actions { border-color: #e1e7f0; }
.ads-prepare { color: var(--pp-blue-dark); }
.ads-step-dot,
.ads-empty-icon {
  color: var(--pp-blue);
  background: var(--pp-blue-mist);
  border-color: #b5c6e5;
}
.ads-field label { color: var(--pp-ink); }
.ads-field label > span[aria-hidden] { color: var(--pp-blue); }
.ads-optional,
.ads-field small,
.ads-char-count,
.ads-money > span { color: #748197; }
.ads-field input,
.ads-field select,
.ads-field textarea {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
}
.ads-field input::placeholder,
.ads-field textarea::placeholder { color: #8995a6; opacity: 1; }
.ads-template-button,
.ads-export-actions button,
.ads-draft-actions button,
.ads-saved-toolbar button {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b4c6e7;
}
.ads-export-actions button span,
.ads-saved-toolbar button span { color: var(--pp-blue-dark); }
.ads-template-button:hover,
.ads-export-actions button:hover,
.ads-draft-actions button:hover,
.ads-saved-toolbar button:hover { background: #dae5ff; }
.ads-preview {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line);
  box-shadow: 0 16px 38px rgba(7, 26, 49, .09);
}
.ads-preview-art {
  color: #eaf0ff;
  background: linear-gradient(135deg, var(--pp-navy), #315fad);
}
.ads-preview-brand div > span,
.ads-preview-content p,
.ads-preview-url { color: var(--pp-muted); }
.ads-preview-ellipsis,
.ads-preview-note,
.ads-transfer-note { color: #748197; }
.ads-preview-url { border-top-color: var(--pp-line); }
.ads-draft-badge {
  color: var(--pp-blue-dark);
  background: var(--pp-blue-mist);
  border-color: #b7c8e8;
}
.ads-status { color: var(--pp-blue-dark); }
.ads-status.is-error,
.ads-status.error,
.ads-status[data-error="true"] { color: var(--pp-danger); }
.ads-draft-actions button[data-action="delete"],
.ads-draft-actions button[data-ads-action="delete"],
.ads-draft-actions .danger {
  color: var(--pp-danger);
  background: #fff7f6;
  border-color: #dcaaa6;
}

/* Chat ------------------------------------------------------------------- */

.ux-chat {
  color: var(--pp-ink);
  font-family: var(--pp-sans);
}
.ux-chat-conversation,
.ux-chat button.ux-chat-room {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line);
  box-shadow: 0 12px 32px rgba(7, 26, 49, .05);
}
.ux-chat-heading { border-color: var(--pp-line); }
.ux-chat-heading span,
.ux-chat-empty,
.ux-chat-bubble time,
.ux-chat-status,
.ux-chat-voice span,
.ux-chat-rooms > p,
.ux-chat-room span,
.ux-chat-room small { color: var(--pp-muted); }
.ux-chat-log { scrollbar-color: var(--pp-blue) transparent; }
.ux-chat-bubble {
  color: var(--pp-ink);
  background: #f0f3f8;
  border-color: #d7dfeb;
}
.ux-chat-bubble.is-own {
  color: #fff;
  background: linear-gradient(135deg, var(--pp-blue-dark), var(--pp-blue));
}
.ux-chat-sender { color: var(--pp-blue); }
.ux-chat-bubble.is-own .ux-chat-sender,
.ux-chat-bubble.is-own time { color: #dce6ff; }
.ux-chat-form { border-color: var(--pp-line); }
.ux-chat-form textarea {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
}
.ux-chat button {
  color: #fff;
  background: var(--pp-blue);
  border-color: var(--pp-blue-dark);
}
.ux-chat button:hover { background: var(--pp-blue-dark); }
.ux-chat button.ux-chat-room:hover { color: var(--pp-blue-dark); background: var(--pp-blue-mist); }
.ux-chat-room[aria-pressed="true"] {
  color: #fff !important;
  background: var(--pp-blue) !important;
  border-color: var(--pp-blue-dark) !important;
}
.ux-chat-room[aria-pressed="true"] span,
.ux-chat-room[aria-pressed="true"] small { color: #dce6ff; }
.ux-chat button.ux-chat-delete {
  color: var(--pp-danger);
  background: #fff7f6;
  border-color: #dcaaa6;
}
.ux-chat-status[data-error="true"] { color: #7d3d27; background: #fff5eb; }

/* Audio and video -------------------------------------------------------- */

body[data-channel] {
  color: #fff;
  background:
    radial-gradient(circle at 85% 8%, rgba(36, 87, 230, .34), transparent 30rem),
    linear-gradient(145deg, var(--pp-navy-deep), var(--pp-navy) 58%, #0b315b);
  font-family: var(--pp-sans);
  color-scheme: dark;
}
.comm-shell,
.comm-audio-component,
.comm-video-component {
  --line: rgba(201, 216, 255, .2);
  --accent: var(--pp-blue-pale);
  --muted: #bdcadd;
  color: #f7f9ff;
  font-family: var(--pp-sans);
}
.comm-brand b,
.comm-tag,
.comm-kicker,
.comm-back { color: var(--pp-blue-pale); }
.comm-intro h1,
.comm-intro h2 { font-family: var(--pp-serif); font-weight: 400; }
.comm-status {
  color: #e5ebf7;
  background: rgba(13, 41, 72, .75);
  border-color: var(--pp-blue-pale);
}
.comm-status[data-error="true"] { color: #ffe8df; background: rgba(112, 47, 31, .72); border-color: #e7a07b; }
.comm-shell button,
.comm-audio-component button,
.comm-video-component button {
  color: #fff;
  background: rgba(255, 255, 255, .08);
  border-color: rgba(201, 216, 255, .32);
}
.comm-shell button:hover,
.comm-audio-component button:hover,
.comm-video-component button:hover { background: rgba(201, 216, 255, .16); }
.comm-shell .comm-primary,
.comm-audio-component .comm-primary,
.comm-video-component .comm-primary {
  color: #fff;
  background: var(--pp-blue);
  border-color: #6f91f4;
}
.comm-shell .comm-primary:hover,
.comm-audio-component .comm-primary:hover,
.comm-video-component .comm-primary:hover { background: var(--pp-blue-dark); }
.comm-shell button:focus-visible,
.comm-shell a:focus-visible,
.comm-audio-component button:focus-visible,
.comm-video-component button:focus-visible {
  outline-color: var(--pp-blue-pale);
}
.comm-stop:not(:disabled) { border-color: #9fb5dc !important; }
.comm-video { background: #020b16; border-color: rgba(201, 216, 255, .25); }
.comm-video > video:last-child { background: #071a31; border-color: #718bb5; }
.comm-orbit { border-color: #7ca0f4; box-shadow: 0 0 0 12px rgba(36, 87, 230, .12); }
.comm-audio { background: rgba(3, 19, 38, .7); border-color: rgba(201, 216, 255, .2); }
.comm-audio span { background: linear-gradient(var(--pp-blue-pale), var(--pp-blue)); }

/* Public contact panel --------------------------------------------------- */

.portal-contact-trigger {
  color: #fff;
  background: linear-gradient(110deg, var(--pp-navy-soft), var(--pp-blue-dark));
  border-color: #7091cf;
  box-shadow: 0 12px 30px rgba(3, 19, 38, .28);
  font-family: var(--pp-sans);
}
.portal-contact-trigger:hover { background: linear-gradient(110deg, var(--pp-navy), var(--pp-blue)); }
.portal-contact {
  color: var(--pp-ink);
  background: #fff;
  border-color: var(--pp-line-strong);
  box-shadow: 0 28px 90px rgba(3, 19, 38, .34);
  font-family: var(--pp-sans);
}
.portal-contact::backdrop { background: rgba(3, 19, 38, .68); }
.portal-contact-heading { background: var(--pp-ice); border-color: var(--pp-line); }
.portal-contact-heading p { color: var(--pp-blue-dark); }
.portal-contact-heading h2 { color: var(--pp-navy); font-family: var(--pp-serif); font-weight: 400; }
.portal-contact-intro,
.portal-contact-footnote,
.portal-loading { color: var(--pp-muted); }
.portal-contact-close {
  color: var(--pp-navy);
  background: #fff;
  border-color: var(--pp-line-strong);
}
.portal-contact button:focus-visible,
.portal-contact a:focus-visible,
.portal-contact-trigger:focus-visible { outline-color: var(--pp-blue); }
.portal-channels button,
.portal-channels a,
.portal-service-error button {
  color: var(--pp-navy);
  background: #fff;
  border-color: var(--pp-line-strong);
  font-family: var(--pp-sans);
}
.portal-channels button[aria-pressed="true"] {
  color: #fff;
  background: var(--pp-blue);
  border-color: var(--pp-blue-dark);
}
.portal-channels a:hover,
.portal-channels button:hover { border-color: var(--pp-blue); }
.portal-contact-footnote a { color: var(--pp-blue-dark); }
.portal-contact .ux-chat { color: var(--pp-ink); }
.portal-contact .ux-chat-conversation { background: #fff; border-color: var(--pp-line); }
.portal-contact .ux-chat-heading { background: var(--pp-ice); border-color: var(--pp-line); }
.portal-contact .ux-chat-heading span,
.portal-contact .ux-chat-empty,
.portal-contact .ux-chat-voice span,
.portal-contact .ux-chat-status { color: var(--pp-muted); }
.portal-contact .ux-chat-bubble { background: #f0f3f8; border-color: #d7dfeb; }
.portal-contact .ux-chat-bubble.is-own { color: #fff; background: linear-gradient(135deg, var(--pp-blue-dark), var(--pp-blue)); }
.portal-contact .ux-chat-bubble.is-own .ux-chat-sender,
.portal-contact .ux-chat-bubble.is-own time { color: #dce6ff; }
.portal-contact .ux-chat-form { border-color: var(--pp-line); }
.portal-contact .ux-chat-form textarea { color: var(--pp-ink); background: #fff; border-color: var(--pp-line-strong); }
.portal-contact .ux-chat button { color: #fff; background: var(--pp-blue); border-color: var(--pp-blue-dark); }
.portal-contact .ux-chat button:focus-visible,
.portal-contact .ux-chat textarea:focus-visible,
.portal-contact .ux-chat-log:focus-visible { outline-color: var(--pp-blue); }
.portal-contact .comm-audio-component {
  color: var(--pp-ink);
  background: var(--pp-ice);
  border-color: var(--pp-line);
}
.portal-contact .comm-status,
.portal-contact .comm-note { color: var(--pp-muted); }
.portal-contact .comm-controls .comm-primary { color: #fff; background: var(--pp-blue); }
.portal-contact .comm-audio span { background: linear-gradient(var(--pp-blue-pale), var(--pp-blue)); }

/* Public journal --------------------------------------------------------- */

.journal-page {
  --journal-navy: var(--pp-navy);
  --journal-coral: var(--pp-blue);
  --journal-mint: var(--pp-blue-pale);
  --journal-cream: var(--pp-stone);
  color: var(--pp-ink);
  font-family: var(--pp-sans);
}
.journal-page a:focus-visible,
.journal-page button:focus-visible { outline-color: var(--pp-blue); }
.journal-page .journal-header { border-color: var(--pp-line); }
.journal-page .journal-brand { color: var(--pp-navy); }
.journal-page .journal-header nav > a:hover,
.journal-page .eyebrow,
.journal-page .journal-category,
.journal-page .journal-read-more,
.journal-page .journal-text-link,
.journal-page .article-copy a { color: var(--pp-blue) !important; }
.journal-page .journal-heading h1,
.journal-page .journal-card h2,
.journal-page .journal-contact h2,
.journal-page .article-copy h2,
.journal-page .article-copy h3 {
  color: var(--pp-navy);
  font-family: var(--pp-serif);
  font-weight: 400;
}
.journal-page .btn { border-color: var(--pp-blue); }
.journal-page .btn.primary { color: #fff; background: var(--pp-blue); }
.journal-page .btn.primary:hover { background: var(--pp-blue-dark); }
.journal-page .btn.ghost { color: var(--pp-navy); border-color: var(--pp-navy); }
.journal-page .journal-card { border-color: var(--pp-line); }
.journal-page .journal-card-cover { background: var(--pp-ice); }
.journal-page .journal-empty { background: var(--pp-stone); border-left-color: var(--pp-blue); }
.journal-page .journal-empty-mark { color: var(--pp-blue); }
.journal-page .journal-contact { border-color: var(--pp-line); }
.journal-page .journal-footer { background: var(--pp-navy-deep); }
.journal-page .article-copy blockquote { border-left-color: var(--pp-blue); }

@media (max-width: 760px) {
  .studio-login {
    background:
      linear-gradient(180deg, var(--pp-navy-deep) 0 132px, transparent 132px),
      radial-gradient(circle at 90% 4%, rgba(201, 216, 255, .65), transparent 20rem),
      var(--pp-ice);
  }
  .studio-login .login-home { color: #fff; }
}

@media (max-width: 640px) {
  .studio-header { align-items: center; }
  .studio-nav { background: #fff; }
  .studio-brand span { max-width: 188px; white-space: normal; line-height: 1.14; }
  .studio-page-heading h1,
  .docs-heading h1,
  .ads-heading h1 { font-size: clamp(2.5rem, 12vw, 3.35rem); overflow-wrap: anywhere; }
  .studio-module { border-radius: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .studio-module,
  .studio-nav > a { transition: none; }
}
