/* Kyoto: a warm accent in actions and wayfinding.
 * This layer deliberately leaves numerical status colors and club kits intact.
 */

#viewLanding .hero::before { display: none; }

#viewLanding .hero-title em {
  position: relative;
  display: inline-block;
  color: var(--text-primary);
  background: none;
  -webkit-text-fill-color: currentColor;
  text-shadow: none;
}

#viewLanding .hero-title em::after {
  content: '';
  position: absolute;
  inset: auto -2% -0.085em 0;
  height: 0.075em;
  min-height: 4px;
  background: var(--brand-gradient);
  border-radius: 1px;
  transform: skewX(-18deg);
}

#viewLanding .hero-inner { align-items: center; }

.kyoto-squad-stage {
  position: relative;
  isolation: isolate;
  width: 100%;
  padding: 36px 22px 36px 0;
}

#viewLanding .kyoto-squad-stage .hero-pitch {
  max-width: none;
  height: 434px;
  border-color: rgb(255 255 255 / 0.14);
  box-shadow: 0 24px 48px rgb(0 0 0 / 0.24);
}

#viewLanding .hero-pitch::after { color: #c1d3c6; }

/* The label sits on a solid plate for contrast across the entire gradient.
 * The exposed gold end carries a drawn arrow; the warm edge connects both. */
html:root body #viewLanding button.mc-btn.mc-btn-primary:not(:disabled) {
  position: relative;
  display: inline-grid;
  grid-template-columns: 1fr 44px;
  align-items: stretch;
  gap: 0;
  min-height: 52px;
  padding: 2px !important;
  border: 0 !important;
  background: var(--brand-gradient) !important;
  box-shadow: 0 7px 18px rgb(0 0 0 / 0.12) !important;
  color: var(--brand-ink) !important;
  text-decoration: none;
  transition: transform 140ms var(--brand-ease);
}

.kyoto-action-label {
  display: grid;
  place-items: center;
  padding: 12px 18px;
  border-radius: 2px 0 0 2px;
  color: #ffffff;
  -webkit-text-fill-color: #ffffff !important;
  background: var(--brand-plate);
}

.kyoto-action-arrow {
  align-self: center;
  justify-self: center;
  width: 22px;
  height: 22px;
  stroke: #241404 !important;
  fill: none;
  stroke-width: 1.8;
  transition: transform 180ms var(--brand-ease);
}

#viewLanding .mc-btn-follow {
  color: var(--text-secondary) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

#viewLanding .mc-btn-primary:focus-visible {
  outline: 2px solid var(--tac-cyan);
  outline-offset: 4px;
}

#viewLanding .mc-btn-primary:active { transform: scale(0.985); }

/* Diagonal finish at the end of a header makes the gradient recognizable
 * without putting a variable-contrast background behind reading content. */
.scout-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.scout-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -1px;
  right: -22px;
  bottom: -1px;
  width: 110px;
  background: var(--brand-gradient);
  clip-path: polygon(62% 0, 100% 0, 100% 100%, 0 100%);
  opacity: 0.35;
  pointer-events: none;
}

.scout-hero > * { position: relative; z-index: 1; }

#viewLanding .landing-card:first-child {
  background: var(--brand-wash), var(--tac-surface) !important;
}

#viewLanding .lc-accent { height: 2px; }

#viewLanding .mc-final-cards .mc-final-card:first-child {
  position: relative;
  overflow: hidden;
  background: var(--brand-wash), var(--tac-surface) !important;
}

#viewLanding .mc-final-card:first-child::after {
  content: '';
  position: absolute;
  width: 100px;
  height: 100px;
  right: -62px;
  bottom: -50px;
  border: 12px solid transparent;
  border-image: var(--brand-gradient) 1;
  transform: rotate(-28deg);
  pointer-events: none;
}

#viewLanding .mc-final-card:first-child .mc-arrow { color: var(--brand-emphasis); }

.tab-btn.active::before { background: var(--brand-gradient); }

:root.light-mode #viewLanding .kyoto-squad-stage .hero-pitch {
  background: linear-gradient(180deg, #173924, #10291b) !important;
  border-color: transparent;
  box-shadow: 0 22px 46px rgb(83 49 15 / 0.14);
}

:root.light-mode .scout-hero::after { opacity: 0.25; }

/* Use the existing mark's alpha to preserve its exact silhouette. */
img[src*="supercomputer-mark.png"] {
  object-position: -9999px -9999px !important;
  background: var(--brand-gradient) !important;
  -webkit-mask: url('supercomputer-mark.png') center / contain no-repeat;
  mask: url('supercomputer-mark.png') center / contain no-repeat;
  filter: none !important;
}

.tactical-sidebar-links { gap: 4px; }
.tactical-sidebar-links a { min-height: 44px; display: flex; align-items: center; justify-content: center; padding: 8px 3px; }
.tactical-sidebar-links a:hover { color: var(--text-primary); }

@media (hover: hover) and (pointer: fine) {
  #viewLanding .mc-btn-primary:hover { transform: translateY(-1px); }
  #viewLanding .mc-btn-primary:hover .kyoto-action-arrow { transform: translateX(3px); }
  #viewLanding .mc-btn-follow:hover { color: var(--text-primary) !important; filter: none; }
  #viewLanding .landing-card:hover,
  #viewLanding .mc-final-card:hover { border-color: var(--brand-line) !important; }
}

@media (max-width: 1000px) and (min-width: 761px) {
  .kyoto-squad-stage { max-width: 400px; margin-inline: auto; }
}

@media (max-width: 760px) {
  #viewLanding .hero-inner { gap: 16px; }
  .kyoto-squad-stage { max-width: 380px; margin: 0 auto; padding: 28px 18px; }
  #viewLanding .kyoto-squad-stage .hero-pitch { height: 355px; }
  #viewLanding .mc-btn-primary { grid-template-columns: 1fr 52px; }
  .scout-hero::after { width: 52px; right: -22px; opacity: 0.2; }
}

@media (prefers-reduced-motion: reduce) {
  #viewLanding .mc-btn-primary,
  .kyoto-action-arrow { transition: none; }
  #viewLanding .mc-btn-primary:hover,
  #viewLanding .mc-btn-primary:active,
  #viewLanding .mc-btn-primary:hover .kyoto-action-arrow { transform: none; }
}

@media (forced-colors: active) {
  .scout-hero::after,
  #viewLanding .hero-title em::after { display: none; }
  #viewLanding .mc-btn-primary { border: 2px solid ButtonText !important; }
  .kyoto-action-label { color: ButtonText; -webkit-text-fill-color: ButtonText !important; background: ButtonFace; }
  .kyoto-action-arrow { stroke: ButtonText !important; }
}
