/* Arpeo light theme (Nov 3 2026). On when <html data-theme="light"> (index.html); remove the attribute to go
   back to the dark theme. White canvas aligned with the marketing landing (ink #111518, warm lines #e6e1d6);
   each companion keeps its identity as an ACCENT (user bubble, call button, tab highlight, header tint).
   --char-strong is a darker shade of the companion colour that passes WCAG AA on white (>= 4.5:1). */
html[data-theme="light"] {
  color-scheme: light;
  --char-strong: #0f766e;
  --base: #ffffff;
  --bg: #ffffff;
  --panel: #ffffff;
  --panel-2: #f6f4ef;
  --panel-3: #ece8df;
  --line: #e6e1d6; --line-strong: #cfc7b8;
  --text: #111518; --muted: #5b646c; --ink: #111518; --ink-text: #ffffff;
  --accent: var(--char-strong); --accent-text: var(--char-strong); --accent-soft: color-mix(in srgb, var(--char) 13%, #ffffff);
  --user-bubble: var(--char-strong); --user-ink: #ffffff;
  --bot-bubble: #f4f2ed;
  --danger: #b42318; --danger-soft: #fdecea; --warn: #8a4b00; --warn-soft: #fdf3e1; --ok: #18753c; --ok-soft: #e8f6ed;
  --badge: #d92d33; --focus: var(--char-strong);
  --shadow: 0 1px 2px rgba(17, 21, 24, .06), 0 6px 18px rgba(17, 21, 24, .06);
  --shadow-float: 0 2px 6px rgba(17, 21, 24, .08), 0 12px 30px rgba(17, 21, 24, .10);
  --call-bg: #ffffff;
}
html[data-theme="light"] body[data-character="scholar"], html[data-theme="light"] body:not([data-character]) { --char-strong: #0f766e; }
html[data-theme="light"] body[data-character="roble"] { --char-strong: #a3530f; }
html[data-theme="light"] body[data-character="pip"] { --char-strong: #2b7a36; }
html[data-theme="light"] body[data-character="lumina"] { --char-strong: #6447d6; }
html[data-theme="light"] body {
  --accent: var(--char-strong); --accent-text: var(--char-strong); --user-bubble: var(--char-strong); --focus: var(--char-strong);
  --accent-soft: color-mix(in srgb, var(--char) 13%, #ffffff);
  background:
    radial-gradient(120% 38% at 50% -8%, color-mix(in srgb, var(--char) 11%, transparent) 0%, transparent 70%),
    #ffffff;
  color: var(--text);
}
html[data-theme="light"] .topbar { background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,0)); }
html[data-theme="light"] a { text-decoration-color: color-mix(in srgb, var(--char-strong) 70%, var(--text)); }
html[data-theme="light"] .round-btn, html[data-theme="light"] .pill-btn { background: #ffffff; border-color: var(--line); box-shadow: var(--shadow); }
html[data-theme="light"] .pill-btn { color: var(--char-strong); }
html[data-theme="light"] .drawer-backdrop, html[data-theme="light"] .sheet-backdrop { background: rgba(17, 21, 24, .32); }
html[data-theme="light"] .drawer { background: linear-gradient(180deg, color-mix(in srgb, var(--char) 9%, #ffffff), #ffffff 40%); }
html[data-theme="light"] .tabbar { background: rgba(255, 255, 255, .94); }
html[data-theme="light"] .tabbar a { color: var(--muted); }
html[data-theme="light"] .tabbar a[aria-current="page"] { background: var(--accent-soft); color: var(--char-strong); }
html[data-theme="light"] .msg.bot { border: 1px solid var(--line); }
html[data-theme="light"] .msg.user .meta, html[data-theme="light"] .msg.user a { color: #ffffff; }
html[data-theme="light"] .msg .meta button.small { background: #ffffff; border: 1px solid var(--line); color: var(--text); }
html[data-theme="light"] .avatar-mini { background: color-mix(in srgb, var(--char) 14%, #ffffff); box-shadow: 0 0 0 1px var(--line); }
html[data-theme="light"] .companion img { filter: drop-shadow(0 6px 10px rgba(17, 21, 24, .14)); }
html[data-theme="light"] .composer { background: #ffffff; border-color: var(--line-strong); }
html[data-theme="light"] .composer:focus-within { border-color: var(--char-strong); }
html[data-theme="light"] .call-btn { background: #ece8df; color: #6c757d; }
html[data-theme="light"] .call-btn:hover:not(:disabled) { background: #ece8df; }
html[data-theme="light"] .call-btn.ready, html[data-theme="light"] .call-btn.ready:hover:not(:disabled) { background: var(--char-strong); color: #ffffff; }
html[data-theme="light"] .send-btn { background: var(--char-strong); color: #ffffff; }
html[data-theme="light"] button.primary { background: var(--char-strong); color: #ffffff; }
html[data-theme="light"] button.primary:hover:not(:disabled) { background: var(--char-strong); filter: brightness(.92); }
html[data-theme="light"] .switch { background: #d9d4c9; }
html[data-theme="light"] .switch:checked { background: var(--char-strong); }
html[data-theme="light"] .switch::after { background: #ffffff; box-shadow: 0 1px 3px rgba(17, 21, 24, .3); }
html[data-theme="light"] .toast { background: #111518; color: #ffffff; }
html[data-theme="light"] .toast[data-kind="error"] { background: #b42318; color: #ffffff; }
html[data-theme="light"] a.button.danger { background: #b42318; color: #ffffff; }
html[data-theme="light"] button.danger { background: var(--danger-soft); color: var(--danger); }
html[data-theme="light"] .conn-ico[data-tint="blue"] { background: #eaf1ff; color: #1d4ed8; }
html[data-theme="light"] .conn-ico[data-tint="red"] { background: #fdecea; color: #b42318; }
html[data-theme="light"] .conn-ico[data-tint="amber"] { background: #fdf3e1; color: #8a4b00; }
html[data-theme="light"] .conn-ico[data-tint="green"] { background: #e8f6ed; color: #18753c; }
html[data-theme="light"] .conn-ico[data-tint="violet"] { background: #f1edff; color: #5b3fd0; }
html[data-theme="light"] .file-ico[data-kind="pdf"] { color: #b42318; }
html[data-theme="light"] .file-ico[data-kind="sheet"] { color: #18753c; }
html[data-theme="light"] .file-ico[data-kind="slides"] { color: #8a4b00; }
html[data-theme="light"] .file-ico[data-kind="doc"] { color: #1d4ed8; }
html[data-theme="light"] .media-ph[data-kind="video"] { background: linear-gradient(145deg, #f1edff, var(--panel)); color: #5b3fd0; }
html[data-theme="light"] .attach-sheet { border-color: var(--line) !important; }
html[data-theme="light"] .attach-row:hover:not(:disabled) { background: var(--panel-2); }
html[data-theme="light"] body:has(.attach-sheet:not([hidden])) .sheet-backdrop { background: rgba(17, 21, 24, .18); }
/* Splash on white: same run, ink wordmark, companion-green letters that pass AA. */
html[data-theme="light"] .splash { background: radial-gradient(90% 50% at 50% 40%, #eef8f0 0%, transparent 70%), #ffffff; }
html[data-theme="light"] .splash-word { color: #9aa1a7; }
html[data-theme="light"] .splash-l.lit { color: #2b7a36; text-shadow: none; }
html[data-theme="light"] .splash-trail {
  background:
    repeating-linear-gradient(90deg, #b9b2a4 0 14px, transparent 14px 26px) 0 0 / 100% 2px no-repeat,
    radial-gradient(circle, #b9b2a4 1.5px, transparent 2px) 0 7px / 34px 6px repeat-x,
    radial-gradient(circle, #b9b2a4 1px, transparent 1.5px) 17px 9px / 47px 4px repeat-x;
}
/* Call mode: light canvas tinted by the companion; controls on soft panels. */
html[data-theme="light"] .call-view, html[data-theme="light"] #view-call {
  color: var(--text);
  background: radial-gradient(120% 70% at 50% 38%, color-mix(in srgb, var(--char) 18%, #ffffff) 0%, #ffffff 72%) !important;
}
html[data-theme="light"] .call-ring { border-color: var(--char-strong); }
html[data-theme="light"] .call-who { color: var(--char-strong); }
html[data-theme="light"] .call-status { color: var(--muted); }
html[data-theme="light"] .call-error { background: var(--panel-2); color: var(--text); }
html[data-theme="light"] .call-round { background: #ffffff; color: var(--text); border: 1px solid var(--line); box-shadow: var(--shadow); }
html[data-theme="light"] .call-round:hover:not(:disabled) { background: var(--panel-2); }
html[data-theme="light"] .call-round[aria-pressed="true"] { background: #111518; color: #ffffff; }
html[data-theme="light"] .call-hangup, html[data-theme="light"] .call-hangup:hover:not(:disabled) { background: #d92d33; color: #ffffff; border-color: #d92d33; }
html[data-theme="light"] .avatar-mini { background: transparent; box-shadow: none; }
html[data-theme="light"] .pick[data-id="lumina"] img, html[data-theme="light"] .pick img[src*="lumina"] {
  filter: drop-shadow(0 0 1px rgba(70, 60, 150, .6)) drop-shadow(0 3px 6px rgba(70, 60, 150, .3)); }
html[data-theme="light"] body[data-character="lumina"] .avatar-mini, html[data-theme="light"] body[data-character="lumina"] .avatar-round img,
html[data-theme="light"] body[data-character="lumina"] .companion img, html[data-theme="light"] body[data-character="lumina"] .call-avatar img {
  filter: saturate(1.35) contrast(1.12) drop-shadow(0 0 1px rgba(60, 45, 160, .75)) drop-shadow(0 3px 5px rgba(60, 45, 160, .3)); }

/* Call AR in the light theme. */
html[data-theme="light"] .call-type input { background: var(--panel-2, #f4f2ee); border-color: var(--line, #e3dfd6); color: var(--text); }
html[data-theme="light"] .call-send { background: var(--char-strong); color: #ffffff; }