/* ════════════════════════════════════════════════════════════
   RANDOM-ASSISTANT · DESIGN RE-SKIN  (Phase A visual port)
   Central, reversible visual layer ported from the Claude Design
   redesign: tokens (Day/Midnight/Mono/Sage), type tuning, radii,
   shadows, brand bubble. Content and structure unchanged. Remove
   this whole block to revert to the previous look.
   ════════════════════════════════════════════════════════════ */
:root{
  /* softer, larger radii */
  --r-xs:8px; --r-sm:12px; --r-md:16px; --r-lg:22px; --r-xl:30px;

  /* DAY · light (default) */
  --paper-0:#f3f4f6; --paper-1:#ffffff; --paper-2:#f6f7f9; --paper-3:#eceef2;
  --line:#e7e9ed; --line-2:#dbdee5;
  --ink-0:#15171c; --ink-1:#2c2f37; --ink-2:#4d525c; --ink-3:#767c86; --ink-4:#a3a9b2;
  --accent:#d9572a; --accent-soft:rgba(217,87,42,.10); --accent-line:rgba(217,87,42,.28);
  --good:oklch(56% 0.09 155); --warn:oklch(66% 0.12 70); --bad:oklch(56% 0.14 28);
  --shadow-sm:0 1px 2px rgba(20,23,30,.04);
  --shadow-md:0 1px 2px rgba(20,23,30,.05),0 8px 26px rgba(20,23,30,.06);
  --shadow-lg:0 2px 8px rgba(20,23,30,.06),0 24px 60px rgba(20,23,30,.12);
  --logo-body:#1b1a17; --logo-eye:#f2f0e9;
}
body{
  background:
    radial-gradient(900px 520px at 100% -8%, rgba(217,87,42,.05), transparent 60%),
    radial-gradient(820px 480px at -10% 105%, rgba(110,120,255,.045), transparent 60%),
    var(--paper-0) !important;
}

/* MIDNIGHT · dark */
body[data-theme="night"]{
  --paper-0:#0b0c0e; --paper-1:#141619; --paper-2:#1a1d21; --paper-3:#22262c;
  --line:#24272d; --line-2:#2f333b;
  --ink-0:#eceef1; --ink-1:#c3c7ce; --ink-2:#9aa0a9; --ink-3:#767c85; --ink-4:#565c65;
  --accent:#e2622f; --accent-soft:rgba(226,98,47,.13); --accent-line:rgba(226,98,47,.34);
  --good:oklch(64% 0.10 158); --warn:oklch(70% 0.12 72); --bad:oklch(62% 0.15 28);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 1px 2px rgba(0,0,0,.4),0 12px 36px rgba(0,0,0,.45);
  --shadow-lg:0 2px 8px rgba(0,0,0,.5),0 28px 70px rgba(0,0,0,.55);
  --logo-body:#ece8de; --logo-eye:#0e0f11;
}
body[data-theme="night"]{
  background:
    radial-gradient(1000px 580px at 100% -10%, rgba(226,98,47,.10), transparent 60%),
    radial-gradient(820px 520px at -8% 108%, rgba(110,120,255,.09), transparent 60%),
    var(--paper-0) !important;
}

/* MONO · neutral greyscale (restyled to match) */
body[data-theme="mono"]{
  --paper-0:#f4f4f5; --paper-1:#ffffff; --paper-2:#f6f6f7; --paper-3:#ececee;
  --line:#e6e6e8; --line-2:#d8d8db;
  --ink-0:#161617; --ink-1:#2d2d2f; --ink-2:#4e4e51; --ink-3:#78787c; --ink-4:#a6a6aa;
  --logo-body:#161617; --logo-eye:#f4f4f5;
}
body[data-theme="mono"]{ background:var(--paper-0) !important; }

/* SAGE · cool muted green (restyled to match) */
body[data-theme="sage"]{
  --paper-0:#eef1ee; --paper-1:#fafbfa; --paper-2:#f0f3f0; --paper-3:#e4e8e4;
  --line:#dde2dd; --line-2:#cdd4cd;
  --ink-0:#171c18; --ink-1:#2c332d; --ink-2:#4c554d; --ink-3:#767f77; --ink-4:#a2aaa3;
  --logo-body:#1b211c; --logo-eye:#eef1ee;
}
body[data-theme="sage"]{
  background:
    radial-gradient(900px 520px at 100% -8%, rgba(217,87,42,.04), transparent 60%),
    radial-gradient(820px 480px at -10% 105%, rgba(80,120,90,.06), transparent 60%),
    var(--paper-0) !important;
}

/* page transition: keep a subtle slide but never let opacity stick at 0 */
.page{ animation:none !important; }
.page.active{ display:block; animation:ra-page-in .34s cubic-bezier(.22,.61,.36,1) !important; }
@keyframes ra-page-in{ from{ transform:translateY(6px); } to{ transform:none; } }

/* don't transition token-driven backgrounds (they freeze on theme/active swap) */
.nav-item,.seg button,.set-nav button,.mem-filter,.thread{ transition:none !important; }
.ppl-row,.int-avail-chip,.suggest-chip,.dec-btn,.mem-act,.cal-evt,.pipe-card,.card{
  transition:color .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease),transform .15s var(--ease) !important;
}

/* ── display type: now Geist, tuned weight/tracking (no serif) ── */
.greet,.page-title,.card-title,.dec-card .q,.td-subj,.evt-detail .e-title,.dec-q,
.mem-body .h,.set-section-hd .h,.person-detail .pd-name,.trip-route,.pipe-card .co,
.itin-day .day-lbl,.cal-day-head .day,.int-summary .cell .v,.pipe-summary .cell .v,
.metric-val,.savings-num,.dec-conf,.person-detail .pd-stat .v,.brand-name,.e-title,
.td-draft b,.trip-route .iata{
  font-style:normal !important; letter-spacing:-0.02em;
}
.greet,.page-title{ font-weight:600; letter-spacing:-0.032em; }
.card-title,.dec-card .q,.td-subj,.mem-body .h,.set-section-hd .h,.person-detail .pd-name,
.trip-route,.pipe-card .co,.evt-detail .e-title,.dec-q{ font-weight:600; letter-spacing:-0.025em; }
.savings-num,.metric-val,.dec-conf,.int-summary .cell .v,.pipe-summary .cell .v,
.cal-day-head .day,.itin-day .day-lbl,.person-detail .pd-stat .v{ font-weight:600; letter-spacing:-0.03em; }

/* em emphasis → brand accent, never italic */
.page-title em,.dec-card .q em,.mem-body .h em,.brief-narrative .key,.dec-q em,
.mem-recent-row .what em,.set-row .hint i,.td-draft b{ font-style:normal !important; color:var(--accent); }
.greet em{ font-style:normal !important; color:var(--ink-2); }

/* brief narrative reads as calm body copy now (was serif display) */
.brief-narrative{ font-family:'Geist',sans-serif !important; font-size:16px; line-height:1.62;
  color:var(--ink-1); letter-spacing:-0.004em; margin-top:16px; }
.brief-narrative .name{ color:var(--ink-0); font-weight:600; }

/* soften card surfaces */
.card,.dec-card,.cal-week,.thread-list,.thread-detail,.people-table,.mem-card,.int-card,
.int-avail,.set-section,.trip-card,.dec-log{ border-radius:var(--r-md); }
.pipe-col{ border-radius:16px; } .pipe-card{ border-radius:12px; }
.card{ box-shadow:var(--shadow-sm); }

/* avatars keep grotesk weight */
.avatar,.q-av,.p-av,.t-av,.ppl-av,.pd-av,.int-logo,.pipe-card .owner,.prep-attendees .av,
.int-avail-chip .lg,.cal-day-head .day{ font-weight:600; letter-spacing:-0.01em; }

/* ── BRAND ── */
.sidebar{ background:var(--paper-1); }
body[data-theme="night"] .sidebar{ background:linear-gradient(180deg,#141619,#0e1012); }
.brand{ padding:20px 18px 16px; align-items:center; gap:11px; }
.brand-mark{ background:transparent !important; box-shadow:none !important; width:30px; height:30px;
  display:grid; place-items:center; border-radius:0; }
.ra-bubble{ width:30px; height:30px; display:block; }
.brand-lock{ display:flex; align-items:center; }
.brand-name{ font-family:'Geist Mono',monospace !important; font-size:12.5px; font-weight:500;
  letter-spacing:-0.01em; color:var(--ink-0); line-height:1; }
.brand-caret{ display:inline-block; width:6px; height:13px; background:var(--accent); margin-left:3px;
  border-radius:1px; animation:ra-blink 1.1s steps(1) infinite; }
@keyframes ra-blink{ 0%,50%{opacity:1} 51%,100%{opacity:0} }
.brand-sub{ font-family:'Geist Mono',monospace; font-size:8px; letter-spacing:0.2em; color:var(--ink-3);
  text-transform:uppercase; margin-top:4px; }

/* mobile brand mark → bubble */
.m-topbar .m-brand{ font-family:'Geist Mono',monospace !important; font-size:12.5px !important;
  letter-spacing:-0.01em; gap:8px; }
.m-topbar .m-brand .mark{ background:transparent !important; box-shadow:none !important;
  width:26px; height:26px; display:grid; place-items:center; border-radius:0; }
.m-brand .mark .ra-bubble{ width:24px; height:24px; }

/* chat glyph → bubble */
.chat-glyph{ background:transparent !important; box-shadow:none !important; }
.chat-glyph .ra-bubble{ width:28px; height:28px; }
.chat-glyph::after{ border-color:var(--accent-line); }

/* ── aurora washes ── */
.brief-card::before{
  background:
    radial-gradient(540px 250px at 100% 0%, var(--accent-soft), transparent 62%),
    radial-gradient(440px 230px at 58% -12%, rgba(120,110,255,.10), transparent 60%) !important;
}
body[data-theme="night"] .brief-card::before{
  background:
    radial-gradient(580px 270px at 100% 0%, rgba(226,98,47,.16), transparent 62%),
    radial-gradient(480px 250px at 55% -14%, rgba(118,120,255,.16), transparent 60%) !important;
}
.savings-card .bg{
  background:
    radial-gradient(300px 200px at 0% 100%, var(--accent-soft), transparent 64%),
    radial-gradient(260px 180px at 32% 120%, rgba(120,110,255,.08), transparent 62%) !important;
}
.trip-hero{
  background:
    radial-gradient(620px 260px at 100% -20%, var(--accent-soft), transparent 60%),
    radial-gradient(420px 220px at 0% 120%, rgba(120,110,255,.06), transparent 60%),
    var(--paper-1) !important;
}

/* ── accent / radius fixups ── */
.btn-accent.clay:hover{ background:var(--accent-hover) !important; }
.sav-bar > i,.dec-bar > i{ background:linear-gradient(90deg, var(--accent), color-mix(in oklch, var(--accent) 62%, #e9a)) !important; }
.chat{ border-radius:18px; }
.chat.expanded{ border-radius:20px; }
.chat-send,.mem-filter.on{ border-radius:999px; }
.dec-btn.primary,.seg button.on{ border-radius:8px; }

/* Day-at-a-glance / calendar type pills: all white, only NEXT/NOW accent */
.cal-tag{ background:var(--paper-1); color:var(--ink-2); border-color:var(--line); }
.cal-tag.focus,.cal-tag.oneonone,.cal-tag.hold,.cal-tag.solo,.cal-tag.meeting{
  background:var(--paper-1) !important; color:var(--ink-2) !important; border-color:var(--line) !important;
}
.cal-tag.next,.cal-tag.now{ background:var(--accent-soft) !important; color:var(--accent) !important; border-color:var(--accent-line) !important; }

/* settings theme-preview swatches recolor to match palettes */
.theme-prev.paper{ background:#f3f4f6 !important; --prev-ink:#2c2f37; --prev-ink-soft:#9aa0a9; --prev-accent:#d9572a; }
.theme-prev.night{ background:#0b0c0e !important; --prev-ink:#eceef1; --prev-ink-soft:#767c85; --prev-accent:#e2622f; }
.theme-prev.mono{ background:#f4f4f5 !important; --prev-ink:#2d2d2f; --prev-ink-soft:#a6a6aa; --prev-accent:#d9572a; }
.theme-prev.sage{ background:#eef1ee !important; --prev-ink:#2c332d; --prev-ink-soft:#a2aaa3; --prev-accent:#d9572a; }