/* KuduDoc v6 — continuous ground (study control, "Ground" row). See ground.js. */
.gd { position: absolute; inset: 0; pointer-events: none; }
.gd__c { position: absolute; inset: 0; }
html[data-ground-v="navy"] .gd { display: none; }

/* on a lighter ground the mark's strokes become see-through brand blue, which reads as a tone
   darker on any shade from pale blue to navy; the orange stroke still arrives at the seal */
html[data-ground-v="blue"][data-flat], html[data-ground-v="sky"][data-flat] {
  --lsw: 0;
  --lfd0: rgba(0, 78, 153, .11); --lfd1: rgba(0, 78, 153, .15); --lfd2: rgba(0, 78, 153, .08); --lfd3: rgba(0, 78, 153, .12);
  --lfe0: rgba(0, 78, 153, .06); --lfe1: #ff762b; --lfe2: rgba(0, 78, 153, .05); --lfe3: rgba(0, 78, 153, .06);
  --lsd0: none; --lsd1: none; --lsd2: none; --lsd3: none; --lse0: none; --lse1: none; --lse2: none; --lse3: none;
}
html[data-ground-v="blue"] .amb-switch--flat, html[data-ground-v="sky"] .amb-switch--flat { display: none; }

/* ---------------------------------------------------------------- light-tone versions
   ground.js gives each section .on-dark or .on-light from the ground behind it. The fold, the
   chooser and the close were designed dark; these are their light counterparts. */
.fold.on-light { color: var(--slate); }
.fold.on-light .eyebrow { color: var(--blue); }
.fold.on-light .h1 { color: var(--ink); }
.fold.on-light .w-work { background-image: linear-gradient(100deg, #006bcb 10%, #2f93ea 90%); }
.fold.on-light .lede { color: var(--ink-2); }
.fold.on-light .note { color: var(--slate); }
.fold.on-light .scroll-cue { color: var(--blue-700); }
.fold.on-light .scroll-cue i { background: linear-gradient(180deg, var(--blue-700), transparent); }
.on-light .btn-ghost { color: var(--ink); box-shadow: inset 0 0 0 1.5px rgba(16, 45, 73, .28); }
.on-light .btn-ghost::after { background: rgba(16, 45, 73, .06); }
.on-light .ember-soft { color: var(--orange); }
.on-light .kicker .num-ember { background: var(--peach); color: var(--orange); box-shadow: inset 0 0 0 1px rgba(255, 118, 43, .3); }
.on-light.beat-seal .tchips .icon { color: var(--orange); }
.on-light p.fence { border-color: rgba(16, 45, 73, .18); }
.on-light .chooser button { color: var(--ink); background: rgba(255, 255, 255, .72); box-shadow: inset 0 0 0 1.5px rgba(16, 45, 73, .12); }
.on-light .chooser button .icon { color: var(--blue); }
.on-light .chooser button:hover { background: #fff; box-shadow: inset 0 0 0 1.5px rgba(16, 45, 73, .24); }
.on-light .chooser button[aria-checked="true"] { background: var(--navy); color: #fff; box-shadow: 0 10px 24px -12px rgba(16, 45, 73, .6), 0 0 0 4px rgba(0, 107, 203, .14); }
.on-light .chooser button[aria-checked="true"] .icon { color: var(--sky); }
.on-light .choose-panel { background: rgba(255, 255, 255, .62); box-shadow: inset 0 0 0 1px rgba(16, 45, 73, .08), 0 12px 30px -20px rgba(16, 45, 73, .3); }
.on-light .cp-title { color: var(--slate); }
.on-light .cp-title b, .on-light .cp-list li { color: var(--ink); }
.on-light .cp-list .icon { color: var(--blue); }
.close.on-light { color: var(--slate); }
.close.on-light .kicker { color: var(--blue); }
.close.on-light .h-close { color: var(--ink); }
.close.on-light .note { color: var(--slate); }

/* on a tinted ground, secondary text needs more weight than on paper: body copy in ink-2 and
   fences in a firm slate, never the faint grey (checked against the palest blue stops) */
html[data-ground-v="blue"] .on-light .lead, html[data-ground-v="blue"] .on-light .body, html[data-ground-v="blue"] .on-light .lede,
html[data-ground-v="sky"] .on-light .lead, html[data-ground-v="sky"] .on-light .body, html[data-ground-v="sky"] .on-light .lede { color: var(--ink-2); }
html[data-ground-v="blue"] .on-light .fence, html[data-ground-v="sky"] .on-light .fence { color: #3d5470; }
