/* Preferred Sources: additive placements only. Load after main.css.
   Keep the frozen DM Sans / warm-paper / maroon visual system and its tokens.
   Rendering, eligibility, completion and stacking measurements belong to JS. */

.preferred-source-pill{
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  max-width:100%;
  padding:10px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--card);
  color:var(--ink);
  font-family:var(--sans);
  font-size:13px;
  font-weight:700;
  line-height:16px;
  text-decoration:none;
  white-space:nowrap;
  vertical-align:middle;
  cursor:pointer;
}
.preferred-source-pill:hover{
  border-color:var(--accent-line);
  text-decoration:none;
}
.preferred-source-pill:focus-visible{
  border-radius:999px;
  box-shadow:var(--focus);
}
.preferred-source-pill.preferred-source-maroon{
  background:transparent;
  border-color:rgba(255,255,255,.28);
  color:#fff;
}
.preferred-source-pill.preferred-source-maroon:hover{
  border-color:rgba(255,255,255,.55);
}
.preferred-source-google{
  display:block;
  width:14px;
  height:14px;
  flex:0 0 14px;
}
/* Do not set fill/currentColor on the Google mark: retain its four colours. */

.preferred-source-about{
  display:flex;
  justify-content:center;
  margin-top:28px;
}
/* Replace the existing reserved clearance, rather than adding to it.
   The absolute globe's crest is at hero bottom minus --ab-globe. */
.abhero.has-preferred-source{
  padding-bottom:calc(var(--ab-globe) + 36px);
}

.preferred-source-insights{
  display:flex;
  justify-content:flex-start;
  margin-top:24px;
}
/* A pill is 38px high (16px line + 20px padding + 2px border).
   New left-column content: 24 + 38 - 6 = 56px.
   Remove 12px top and 28px bottom: net growth <=16px.
   The existing grid, rail and 313px desktop minimum remain untouched. */
.inshero.has-preferred-source{
  --preferred-source-ins-padding:24px;
}
.inshero.has-preferred-source .uspin{
  padding-top:calc(var(--preferred-source-ins-padding) - 12px);
  padding-bottom:max(0px,calc(var(--preferred-source-ins-padding) - 28px));
}
.inshero.has-preferred-source .inshh{
  margin-bottom:calc(var(--s5) - 6px);
}
/* Desktop has only 24px bottom padding available. The remaining 4px is
   accounted for in the left grid item's occupied height, not the logo rail.
   This never changes the partner rail's markup or its own spacing rules. */
.inshero.has-preferred-source .insintro{
  margin-bottom:min(0px,calc(var(--preferred-source-ins-padding) - 28px));
}
@media (min-width:721px) and (max-width:1199px){
  .inshero.has-preferred-source{
    --preferred-source-ins-padding:32px;
  }
}
@media (max-width:720px){
  .inshero.has-preferred-source{
    --preferred-source-ins-padding:28px;
  }
}

.preferred-source-home{
  position:fixed;
  right:16px;
  bottom:var(--preferred-source-bottom,calc(16px + env(safe-area-inset-bottom,0px)));
  z-index:30;
  max-width:calc(100vw - 32px);
  animation:preferred-source-reveal 220ms var(--e-out) both;
}
.preferred-source-home .preferred-source-pill{
  box-shadow:var(--sh-3);
}
/* Reserve the sibling close target without changing the anchor's 10px/16px
   padding, or nesting an interactive control inside it. */
.preferred-source-home .preferred-source-pill::after{
  content:"";
  width:22px;
  flex:0 0 22px;
}
/* JS sets --preferred-source-bottom to viewport bottom minus the visible
   #totop top + 10px. Never infer visibility from .show alone or enable totop.
   At exactly 720px the two controls can coexist; below that only totop does. */
.preferred-source-home.is-stacked{
  bottom:var(--preferred-source-bottom,calc(16px + env(safe-area-inset-bottom,0px)));
}
.preferred-source-close{
  position:absolute;
  top:50%;
  right:7px;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--ink-3);
  font-family:var(--sans);
  font-size:16px;
  font-weight:400;
  line-height:1;
  cursor:pointer;
}
.preferred-source-close:hover{
  color:var(--ink);
}
/* Override main.css's generic focus position so the sibling close control
   stays visually inside the anchor's reserved right end. */
.preferred-source-close:focus-visible{
  position:absolute;
  border-radius:999px;
  box-shadow:var(--focus-tight);
}
@media (width < 720px){
  .preferred-source-home{display:none}
}
/* Floating promotion must not cover or compete with existing overlays. */
body.locked .preferred-source-home,
body.menuing .preferred-source-home,
body.searching .preferred-source-home{
  display:none;
}

.preferred-source-article{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 16px;
  max-width:100%;
  margin:24px 0 0;
  animation:preferred-source-reveal 200ms var(--e-out) both;
}
.preferred-source-article .preferred-source-pill{
  flex:0 0 auto;
}
.art .preferred-source-copy{
  flex:1 1 260px;
  min-width:0;
  margin:0;
  color:var(--ink-3);
  font-family:var(--sans);
  font-size:12.5px;
  font-weight:400;
  line-height:1.55;
}
.art .preferred-source-thanks{
  margin:24px 0 0;
  color:var(--ink-3);
  font-family:var(--sans);
  font-size:12.5px;
  font-weight:400;
  line-height:1.55;
}
.preferred-source-article .preferred-source-thanks{
  margin:0;
}
@media (max-width:720px){
  .preferred-source-article{
    flex-direction:column;
    align-items:flex-start;
  }
  .preferred-source-copy{flex:0 1 auto}
}

.preferred-source-home[hidden],
.preferred-source-about[hidden],
.preferred-source-insights[hidden],
.preferred-source-article[hidden],
.preferred-source-thanks[hidden]{
  display:none!important;
}
@keyframes preferred-source-reveal{
  from{opacity:0}
  to{opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .preferred-source-home,
  .preferred-source-article{
    animation:none;
  }
}