/* The "cosmic" result treatment — founder call (2026-08-18): a computed result
 * should NOT blend into the parchment site. The site is where you ask; the
 * night sky is where the answer comes from. So every result container flips to
 * the deep-indigo look the kundli chart-box already owns, and the reader knows
 * at a glance which part of the page is THEIRS.
 *
 * Mechanism: the whole site styles itself through the dense.css custom
 * properties (--card, --ink, --line …), so scoping REDEFINED tokens under
 * `.cosmic` restyles every descendant — panels, tables, readings — without
 * touching a single component rule. New components inherit the treatment for
 * free; only literal (non-token) colours need spot fixes below.
 *
 * Applied to: kundli section.report · rashifal #rf-result (hub + 12 sign
 * pages) · the calculators' #cx-out. NOT applied to forms, navigation or
 * anything the site itself says.
 */
.cosmic{
  /* grounds */
  --paper:#100A20;
  --paper-2:#170F2B;
  --paper-3:#241A3A;
  --card:#1B1332;
  /* text — measured against --card: ink 13.9:1 · ink-2 11.1:1 · ink-3 7.6:1 ·
     ink-mute 4.9:1, all past WCAG AA on the dark ground */
  --ink:#F4ECDA;
  --ink-2:#E3D6BC;
  --ink-3:#C7B893;
  --ink-mute:#9E9070;
  /* lines & accents — the saffron family brightens so borders and caps stay
     visible; crimson would vanish on indigo, so its role passes to a lit
     salmon that keeps the "emphasis" meaning */
  --line:rgba(224,179,78,.30);
  --line-2:rgba(224,179,78,.14);
  --saffron:#E0B34E;
  --saffron-2:#F0CE82;
  --gold:#E0B34E;
  --crimson:#FFAE85;
  --crimson-2:#FFC29F;
  --maroon:#F0CE82;
  --dharma:#8FCF9F;
  --indigo:#33295E;

  background:radial-gradient(120% 90% at 50% 0%,#241A3A 0%,#150F24 55%,#0C0816 100%);
  border:1px solid rgba(224,179,78,.32);
  border-radius:18px;
  padding:20px;
  box-shadow:0 14px 40px rgba(12,8,22,.4),inset 0 1px 0 rgba(240,206,130,.10);
  /* ⚠️ Inherited `color` resolves var(--ink) at the BODY, outside this scope —
     so text with no color of its own (the report's name line, plain <p>s) came
     through dark-on-dark. Declaring color on the scope root re-anchors the
     inheritance to the cosmic tokens. */
  color:var(--ink);
}

/* Literal colours that tokens can't reach: the parchment cards carry a white
   inset highlight that reads as a smudge on indigo. */
.cosmic .panel,
.cosmic .rf-card{box-shadow:0 10px 26px rgba(0,0,0,.35)}
.cosmic .rf-loading,.cosmic .rf-hint,.cosmic .rf-err{box-shadow:none}

/* Buttons whose gradients now resolve to LIGHT golds must not keep white
   text. Dark text on gold is the app's own btn-gold convention anyway. */
.cosmic .cx-cta,
.cosmic .btn-gold{background:linear-gradient(180deg,#F0CE82,#E0B34E);color:#2A1B06;box-shadow:0 8px 22px rgba(224,179,78,.25)}

/* Components that USED the light-theme tokens as their dark parts break when
   the tokens flip: the app-CTA band colours its text with --paper (now near
   black) and the "apply this time" chip uses --ink as its BACKGROUND (now
   cream, with gold text on it). Pin both to what they meant, not what they
   said. */
.cosmic .ctab{color:#F6F0E4}
.cosmic .exp-apply{background:#33295E;color:#F0CE82}
.cosmic .rf-lucky{background:#33295E;color:var(--ink-2)}
/* the planet orbs kept white glyphs while their gold ground brightened —
   the gold-button convention (dark on gold) reads at 8.5:1 */
.cosmic .gcard .gc-orb{color:#2A1B06}

/* PDF and print go through window.print(), so the cosmic ground must fall
   away or every kundli PDF comes out as a sheet of black ink. */
@media print{
  .cosmic{
    --paper:#F6F0E4;--paper-2:#FBF6EC;--paper-3:#EFE6D3;--card:#FFFCF6;
    --ink:#1F1812;--ink-2:#3E3225;--ink-3:#5C4D40;--ink-mute:#6E6152;
    --line:rgba(140,90,26,.22);--line-2:rgba(31,24,18,.08);
    --saffron:#C8862C;--saffron-2:#E0A94E;--gold:#B8862C;
    --crimson:#A8331E;--crimson-2:#C24A33;--maroon:#6B1F18;
    --dharma:#2F5A3D;--indigo:#2A2451;
    background:#fff;border:none;box-shadow:none;padding:0;
  }
  .cosmic .panel,.cosmic .rf-card{box-shadow:none}
}

@media(max-width:560px){.cosmic{padding:14px 12px;border-radius:14px}}