/* Black Depth: public-site surfaces only. Editor and reading typography stay separate. */
.ksl-site {
  --ksl-depth-highlight: inset 0 1px 0 #ffffff29, inset 1px 0 0 #ffffff0c;
  --ksl-depth-shadow: 0 2px 0 #252b35, 0 5px 0 #060709, 0 15px 25px #000b;
}
.ksl-site .x-header {
  position: relative;
  z-index: 10;
  background: linear-gradient(180deg, #15171b, #080a0d 78%);
  border-bottom-color: #667181;
  box-shadow: 0 7px 20px #0009;
}
.ksl-site .x-header::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, #fae4bd99, #bcd7ff66, transparent);
  pointer-events: none;
}
.ksl-site .x-logo {
  display: grid;
  place-items: center;
  width: 53px;
  height: 53px;
  flex-shrink: 0;
  padding: 0;
  border: 1px solid #fbe2b2;
  border-radius: 12px;
  background: linear-gradient(145deg, #fff0c9, #e8c17f 58%, #ba8f4d);
  color: #111316;
  font-weight: 800;
  box-shadow: inset 0 1px 1px #fff, 0 3px 0 #7e5d30, 0 8px 16px #000a;
  transform: rotate(-3deg);
}
.ksl-site .x-menu .sub-menu {
  background: linear-gradient(145deg, #202833, #10141b);
  border-color: #7b8ba2;
  box-shadow: var(--ksl-depth-highlight), 0 14px 36px #000c;
}
.ksl-site .x-sidebar {
  background: linear-gradient(90deg, #0e1116, #080a0d);
  border-color: #566171;
  box-shadow: inset -8px 0 20px #0004;
}
.ksl-site .x-sectors { gap: 6px; }
.ksl-site .x-sectors a { border-radius: 8px; }
.ksl-site .x-sectors a[aria-current],
.ksl-site .x-sectors a[aria-current]:hover,
.ksl-site .x-menu .sub-menu .current-menu-item > a {
  background: linear-gradient(135deg, #43392a, #262119);
  color: #ffe6ba;
  box-shadow: inset 0 0 0 2px #bda478, inset 0 3px 0 #ffe6aa55, 0 3px 0 #15130f, 0 6px 12px #0007;
}
.ksl-site .x-intro {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid #667487;
  border-radius: 17px;
  background: radial-gradient(ellipse at 95% 0, #35405499, transparent 55%), linear-gradient(135deg, #1d242e, #10141b 56%, #090b0f);
  box-shadow: var(--ksl-depth-highlight), 0 4px 0 #0b1017, 0 18px 30px #0009;
}
.ksl-site .x-intro::before {
  content: '';
  position: absolute;
  inset: 0 25% auto 0;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), #e9c79044, transparent);
  z-index: 2;
  pointer-events: none;
}
.ksl-site .x-intro > :not(.x-lens) { position: relative; z-index: 1; }
.ksl-site .x-intro-top > span:last-child { display: none; }
.ksl-site .x-intro h1 { font-size: 30px; }
.ksl-site .x-intro > h1, .ksl-site .x-intro > p { max-width: 85%; }
.ksl-site .x-intro > p { color: #e0e6ef; }
.ksl-site .x-lens {
  position: absolute;
  width: 182px;
  height: 182px;
  right: -42px;
  top: -15px;
  z-index: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 28% 25%, #b2d7ff38, transparent 30%), radial-gradient(circle at 65% 75%, #000, #172536 75%);
  border: 1px solid #a3bbd2;
  box-shadow: inset 2px 3px 3px #f1f8ff6b, inset -4px -7px 9px #000, 0 0 0 5px #101720, 0 0 0 6px #72839b99, 0 0 0 15px #0c1016, 0 0 0 16px #64758b77, 0 18px 30px #000b;
  transform: rotate(-20deg);
  opacity: .85;
  pointer-events: none;
}
.ksl-site .x-lens::before {
  content: '';
  position: absolute;
  inset: 19px;
  border: 1px solid #b3c7df44;
  border-radius: 50%;
  box-shadow: inset 0 2px 8px #b3d8ff33;
}
.ksl-site .x-lens::after {
  content: '';
  position: absolute;
  inset: -7px;
  border: 2px solid transparent;
  border-right-color: var(--gold);
  border-radius: 50%;
}
.ksl-site .x-search {
  padding: 9px 10px 9px 15px;
  border-color: #7b8b9f;
  border-radius: 10px;
  background: #020304;
  box-shadow: inset 0 3px 7px #000, 0 1px 0 #ffffff2c;
}
.ksl-site .x-search button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 42px;
  padding: 5px 12px;
  border: 1px solid #d5e7ff;
  border-radius: 7px;
  background: linear-gradient(145deg, #e1eeff, #b4cff3);
  color: #0a1018;
  font-weight: 800;
  box-shadow: inset 0 1px 0 #fff, 0 2px 0 #536b8d;
}
.ksl-site .x-companies { gap: 22px 20px; }
.ksl-site :is(.x-company, .x-story, .x-related-card, .x-series > a, .post-navigation a) {
  position: relative;
  border-color: #68768a;
  border-radius: 13px;
  background: linear-gradient(150deg, #242d39, #161c25 37%, #10141b);
  box-shadow: var(--ksl-depth-highlight), var(--ksl-depth-shadow);
}
.ksl-site .x-company::before {
  content: '';
  position: absolute;
  inset: 0 12% auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, #e0edff88, transparent);
  pointer-events: none;
}
.ksl-site :is(.x-company, .x-related-card):focus-within { border-color: var(--accent); }
.ksl-site .x-symbol {
  background: linear-gradient(145deg, #283b55, #101722);
  border-color: #7f93ad;
  color: #dbeaff;
  box-shadow: inset 0 1px 0 #d9e9ff33, 0 3px 6px #0006;
}
.ksl-site .x-kind-links { gap: 7px; }
.ksl-site .x-kind-links a {
  background: linear-gradient(180deg, #283d59, #192a40);
  border-color: #7b95b7;
  color: #d3e7ff;
  font-size: 14px;
  box-shadow: inset 0 1px 0 #cee3ff24, 0 2px 0 #070a0f;
}
.ksl-site .x-kind-links a:hover { background: #36516f; color: #fff; }
.ksl-site .x-kind-links span { background: #0b0e13; }
.ksl-site .x-company-sector {
  margin-top: 16px;
  padding-top: 11px;
  border-top: 1px solid #69778a;
  color: #d8dfe8;
}
.ksl-site .x-show-all {
  margin-top: 22px;
  border-color: #6b7b90;
  border-radius: 8px;
  background: linear-gradient(#171d26, #10151c);
  box-shadow: var(--ksl-depth-highlight), 0 3px 0 #050608;
}
.ksl-site .x-focus-grid { border-top: 0; padding-top: 0; gap: 20px; }
.ksl-site .x-focus-grid article {
  padding: 19px 20px;
  border: 1px solid #8a7d62;
  border-radius: 10px;
  background: linear-gradient(130deg, #29251d, #101317 75%);
  box-shadow: var(--ksl-depth-highlight), 0 8px 20px #0008;
}
.ksl-site .x-focus-grid article:nth-child(even) {
  border-color: #7c8faa;
  background: linear-gradient(130deg, #1b2a3b, #101317 75%);
}
.ksl-site .x-series .x-series-label, .ksl-site .post-navigation .x-series-label {
  background: linear-gradient(145deg, #ffe8bf, #e8c17f);
  box-shadow: inset 0 1px 0 #fff8, 0 2px 0 #846333;
}
.ksl-site .x-series-next .x-series-label, .ksl-site .nav-next .x-series-label {
  background: linear-gradient(145deg, #e1eeff, #b4cff3);
  box-shadow: inset 0 1px 0 #fff8, 0 2px 0 #536b8d;
}
.ksl-site .x-series-unavailable .x-series-label { background: transparent; box-shadow: none; }
.ksl-site .x-related-grid { gap: 20px; }
@media (hover: hover) and (pointer: fine) {
  .ksl-site :is(.x-company, .x-related-card, .x-series > a, .post-navigation a) {
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  }
  .ksl-site :is(.x-company, .x-related-card, .x-series > a, .post-navigation a):hover {
    transform: translateY(-4px);
    border-color: var(--accent);
    box-shadow: var(--ksl-depth-highlight), 0 4px 0 #293647, 0 18px 30px #000e, 0 0 20px #9cc9ff12;
  }
  .ksl-site :is(.x-search button, .x-kind-links a, .x-show-all):active { transform: translateY(2px); }
}
@media (max-width: 1000px) {
  .ksl-site .x-lens { right: -75px; opacity: .65; }
  .ksl-site .x-intro h1 { font-size: 28px; }
}
@media (max-width: 760px) {
  .ksl-site .x-lens { display: none; }
  .ksl-site .x-intro > h1, .ksl-site .x-intro > p { max-width: none; }
  .ksl-site .x-intro h1 { font-size: 27px; }
  .ksl-site .x-sidebar { box-shadow: none; }
  .ksl-site .x-companies { gap: 22px 16px; }
}
@media (max-width: 480px) {
  .ksl-site .x-logo { width: 45px; height: 45px; border-radius: 10px; }
  .ksl-site .x-intro h1 { font-size: 25px; }
  .ksl-site .x-search { gap: 9px; padding-left: 11px; }
  .ksl-site .x-search button { padding-inline: 9px; }
}
@media (pointer: coarse) {
  .ksl-site :is(.x-kind-links a, .x-search button) { min-height: 44px; display: inline-flex; align-items: center; }
}
@media (prefers-reduced-motion: reduce) {
  .ksl-site :is(.x-company, .x-related-card, .x-series > a, .post-navigation a) { transition: none; }
  .ksl-site :is(.x-company, .x-related-card, .x-series > a, .post-navigation a):hover,
  .ksl-site :is(.x-search button, .x-kind-links a, .x-show-all):active { transform: none; }
}
