/* x1-fineshield-slack - /fineshield/slack (2026-10-01 additional pages). Every rule scoped under .x1-fineshield-slack. */
.x1-fineshield-slack .hero-media .hero-photo {object-position: 74% 50%;}

/* the ask / the agreement */
.x1-fineshield-slack .fsl-pair {row-gap: var(--stack-l); align-items: start;}
.x1-fineshield-slack .fsl-pair-a {grid-column: 1 / span 6;}
.x1-fineshield-slack .fsl-pair-b {grid-column: 7 / span 6; padding-left: var(--col-gap); border-left: 1px solid var(--rule);}
.x1-fineshield-slack .fsl-pair .eyebrow {color: var(--muted); margin-bottom: var(--stack-s);}
.x1-fineshield-slack .fsl-pair .h2 {font-size: clamp(2rem, 1.4rem + 2.2vw, 3.25rem); margin-bottom: 1.25rem; max-width: 14ch;}
.x1-fineshield-slack .fsl-pair .sub {font-size: var(--fs-lede); line-height: 1.55;}

/* signature: the held Slack draft beside the signed agreement */
.x1-fineshield-slack .fsl-sig {margin-top: var(--stack-l); display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(1rem, .5rem + 2vw, 2rem);
  background: var(--tint); border-radius: calc(var(--radius) + 6px); padding: clamp(1rem, .5rem + 2.5vw, 2.75rem); align-items: center;}
.x1-fineshield-slack .fsl-slack {background: var(--surface); border: 1px solid var(--rule); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden;}
.x1-fineshield-slack .fsl-slack-top {display: flex; align-items: center; gap: .5rem; padding: .85rem 1.25rem; border-bottom: 1px solid var(--rule); font-size: var(--fs-small); font-weight: 600; color: var(--ink); background: var(--bg);}
.x1-fineshield-slack .fsl-hash {color: var(--muted); font-weight: 400; font-size: 1.1rem; line-height: 1;}
.x1-fineshield-slack .fsl-msg {display: grid; grid-template-columns: 2.25rem 1fr; gap: .85rem; padding: 1.1rem 1.25rem 0;}
.x1-fineshield-slack .fsl-msg b {display: block; font-size: var(--fs-small); color: var(--ink); margin-bottom: .2rem;}
.x1-fineshield-slack .fsl-msg b i {font-style: normal; font-weight: 500; color: var(--muted); margin-left: .35rem;}
.x1-fineshield-slack .fsl-msg p {font-size: 1.0625rem; line-height: 1.55; color: var(--ink);}
.x1-fineshield-slack .fsl-av {width: 2.25rem; height: 2.25rem; border-radius: 8px; display: grid; place-items: center; font: 600 .9375rem/1 var(--sans); color: #fff;}
.x1-fineshield-slack .fsl-av-e {background: #5E5E5A;}
.x1-fineshield-slack .fsl-av-l {background: var(--ink);}
.x1-fineshield-slack .fsl-draft {margin: 1rem 1.25rem 0; padding: 1rem; border: 1px solid var(--accent); border-radius: 12px; grid-template-columns: 2.25rem 1fr;}
.x1-fineshield-slack .fsl-draft p {font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem);}
.x1-fineshield-slack .fsl-sig mark {background: linear-gradient(transparent 56%, var(--accent-soft) 56%); color: inherit; -webkit-box-decoration-break: clone; box-decoration-break: clone;
  text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px;}
.x1-fineshield-slack .fsl-sig mark::after {content: attr(data-n); display: inline-grid; place-items: center; width: 1.15rem; height: 1.15rem; margin-left: .3rem; border-radius: 50%;
  background: var(--accent); color: #fff; font: 700 .6875rem/1 var(--sans); vertical-align: .2em; text-decoration: none;}
.x1-fineshield-slack .fsl-wait {display: flex; align-items: center; gap: .5rem; margin: 1rem 1.25rem 1.1rem; font-size: .875rem; font-weight: 600; color: var(--accent);}
.x1-fineshield-slack .fsl-wait svg {width: 16px; height: 16px; flex: none;}
.x1-fineshield-slack .fsl-flags {list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem;}
.x1-fineshield-slack .fsl-flags li {display: grid; grid-template-columns: 1.6rem 1fr; gap: .85rem; align-items: start; background: var(--surface); border: 1px solid var(--rule); border-left: 2px solid var(--accent); border-radius: 12px; padding: 1rem 1.1rem;}
.x1-fineshield-slack .fsl-n {width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: #fff; font: 700 .75rem/1 var(--sans);}
.x1-fineshield-slack .fsl-k {display: block; font: 600 var(--fs-eyebrow)/1.4 var(--sans); letter-spacing: var(--track-eyebrow); text-transform: uppercase; color: var(--muted); margin-bottom: .25rem;}
.x1-fineshield-slack .fsl-k i {font-style: normal; color: var(--accent);}
.x1-fineshield-slack .fsl-flags p {font: 400 clamp(1.1875rem, 1.05rem + .5vw, 1.4375rem)/1.25 var(--serif); color: var(--ink);}

/* AHA pull line */
.x1-fineshield-slack .fsl-aha {margin: var(--stack-l) auto 0; max-width: 24ch; text-align: center; text-wrap: balance;
  font: italic 400 clamp(1.875rem, 1.3rem + 2.2vw, 3.25rem)/1.18 var(--serif); letter-spacing: -.015em; color: var(--ink);}
.x1-fineshield-slack .fsl-aha::before {content: ""; display: block; width: 2.5rem; height: 1px; background: var(--accent); margin: 0 auto 1.5rem;}

/* corrected draft */
.x1-fineshield-slack .fsl-fix {align-items: center;}
.x1-fineshield-slack .fsl-fix .h2 {max-width: 12ch;}
.x1-fineshield-slack .fsl-fix-card {background: var(--surface); border: 1px solid var(--rule); border-top: 2px solid var(--accent); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(1.25rem, 1rem + 1.5vw, 2.5rem);}
.x1-fineshield-slack .fsl-fix-top {display: flex; align-items: center; gap: .75rem; margin-bottom: 1.1rem;}
.x1-fineshield-slack .fsl-fix-top .fsl-k {margin: 0;}
.x1-fineshield-slack .fsl-quote {font: 400 clamp(1.5rem, 1.15rem + 1.3vw, 2.25rem)/1.28 var(--serif); color: var(--ink); text-wrap: pretty;}
.x1-fineshield-slack .fsl-quote mark {background: linear-gradient(transparent 60%, rgba(143,82,14,.14) 60%); color: inherit;}
.x1-fineshield-slack .fsl-fix-p {margin-top: var(--stack-m);}

/* three: route, scope, record */
.x1-fineshield-slack .fsl-three {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--col-gap);}
.x1-fineshield-slack .fsl-three > li {border-top: 1px solid var(--rule); padding-top: 1.5rem;}
.x1-fineshield-slack .fsl-three .h3 {font: 400 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.15 var(--serif); color: var(--ink); letter-spacing: -.01em; margin: 1.5rem 0 .85rem; max-width: 16ch; text-wrap: balance;}
.x1-fineshield-slack .fsl-three p {max-width: 34ch; text-wrap: pretty;}
.x1-fineshield-slack .fsl-mini {display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; min-height: 2.25rem;}
.x1-fineshield-slack .fsl-mini span {display: inline-flex; align-items: center; min-height: 2rem; padding: .3rem .75rem; border-radius: 999px; font-size: .8125rem; font-weight: 600; color: var(--ink); box-shadow: inset 0 0 0 1px rgba(0,0,0,.14); background: var(--surface);}
.x1-fineshield-slack .fsl-route i {width: 1.1rem; height: 1px; background: var(--muted); position: relative;}
.x1-fineshield-slack .fsl-route i::after {content: ""; position: absolute; right: -1px; top: -3px; border: 3.5px solid transparent; border-left: 5px solid var(--muted); border-right: 0;}
.x1-fineshield-slack .fsl-route .on {background: var(--ink); color: #fff; box-shadow: none;}
.x1-fineshield-slack .fsl-scope span {background: var(--tint); box-shadow: none;}
.x1-fineshield-slack .fsl-log span {border-radius: 6px; font: 500 .75rem/1 ui-monospace, "SF Mono", Menlo, monospace; text-transform: uppercase; letter-spacing: .04em; color: var(--muted);}

/* film */
.x1-fineshield-slack .fsl-film {margin: 0; max-width: 62rem; margin-inline: auto;}
.x1-fineshield-slack .fsl-film .eyebrow {color: var(--muted); margin-bottom: 1.25rem; text-align: center;}
.x1-fineshield-slack .fsl-film video {width: 100%; height: auto; aspect-ratio: 16 / 9;}
.x1-fineshield-slack .fsl-film-cta {justify-content: center; margin-top: 1.5rem;}

/* questions */
.x1-fineshield-slack .fsl-q {max-width: 46rem; margin-inline: auto;}
.x1-fineshield-slack .fsl-q .eyebrow {color: var(--muted); margin-bottom: var(--stack-s);}

@media (max-width: 960px) {
  .x1-fineshield-slack .fsl-pair-a, .x1-fineshield-slack .fsl-pair-b {grid-column: 1 / -1;}
  .x1-fineshield-slack .fsl-pair-b {padding-left: 0; border-left: 0; padding-top: var(--stack-m); border-top: 1px solid var(--rule);}
  .x1-fineshield-slack .fsl-sig {grid-template-columns: 1fr;}
  .x1-fineshield-slack .fsl-three {grid-template-columns: 1fr; row-gap: 2.5rem;}
  .x1-fineshield-slack .hero-media .hero-photo {aspect-ratio: 4 / 3;}
}
@media (max-width: 700px) {
  .x1-fineshield-slack .fsl-msg {padding: 1rem 1rem 0; grid-template-columns: 2rem 1fr; gap: .7rem;}
  .x1-fineshield-slack .fsl-draft {margin: .9rem .75rem 0; padding: .85rem;}
  .x1-fineshield-slack .fsl-av {width: 2rem; height: 2rem;}
  .x1-fineshield-slack .fsl-slack-top, .x1-fineshield-slack .fsl-wait {padding-inline: 1rem;}
  .x1-fineshield-slack .fsl-wait {margin-inline: 0;}
  .x1-fineshield-slack .fsl-film {padding: .75rem;}
}
@media (prefers-reduced-motion: reduce) {
  .x1-fineshield-slack * {transition: none !important; animation: none !important;}
}