:root {
  --ink: #f5f8fb;
  --ink-soft: rgba(218, 235, 247, .68);
  --ink-faint: rgba(190, 211, 226, .46);
  --rule: rgba(104, 170, 214, .09);
  --card: #eef3f7;
  --card-ink: #152033;
  --card-label: #718092;
  --hisoka-paper: #f4f6f8;
  --hisoka-surface: #ffffff;
  --hisoka-ink: #121722;
  --hisoka-muted: #667080;
  --hisoka-border: #dce2e8;
  --hisoka-blue: #4a7dff;
  --hisoka-green: #177d9c;
}

html {
  background: #05070c;
}

.hisoka-home {
  background: var(--hisoka-paper) !important;
}

.hisoka-home .hero {
  background:
    radial-gradient(64% 52% at 27% 84%, rgba(74, 125, 255, .11) 0%, rgba(74, 125, 255, 0) 72%),
    radial-gradient(70% 60% at 92% 8%, rgba(85, 216, 239, .06) 0%, rgba(85, 216, 239, 0) 68%),
    #05070c;
}

.hisoka-home .hero::after {
  background:
    radial-gradient(72% 44% at 50% 117%, rgba(95, 155, 255, .26) 0%, rgba(49, 93, 182, .12) 42%, rgba(20, 42, 88, .03) 72%, rgba(5, 7, 12, 0) 88%),
    linear-gradient(180deg, rgba(5, 7, 12, 0) 54%, rgba(35, 71, 132, .04) 78%, rgba(55, 108, 190, .08) 100%);
}

.hisoka-home .guides i {
  background: linear-gradient(180deg, rgba(85, 216, 239, 0) 0%, var(--rule) 12%, var(--rule) 78%, rgba(85, 216, 239, 0) 100%);
}

.hisoka-home .ghost {
  color: rgba(85, 216, 239, .045);
}

.hisoka-home .dock {
  border-color: rgba(141, 207, 233, .16);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, 0) 42%),
    rgba(7, 12, 22, .82);
  box-shadow: 0 calc(8 * var(--u)) calc(22 * var(--u)) rgba(0, 0, 0, .38), inset 0 1px rgba(120, 205, 235, .08);
}

.hisoka-home .dock-item {
  background: rgba(35, 68, 105, .16);
}

.hisoka-home .dock-item[data-near="true"] {
  border-color: rgba(85, 216, 239, .28);
  background: rgba(12, 25, 43, .96);
}

.hisoka-home .dock-mark,
.hisoka-home .dock-item.is-active {
  border-color: #eef6fb;
  background: #eef6fb;
  color: #111a29 !important;
}

.hisoka-home .liquid-plate {
  background:
    linear-gradient(180deg, rgba(109, 211, 242, .12), rgba(74, 125, 255, .025) 44%, rgba(255, 255, 255, 0) 64%),
    rgba(5, 11, 21, .56);
}

.hisoka-home .play-ring {
  border-color: rgba(85, 216, 239, .24);
}

.hisoka-home .card figure {
  background: #06111e;
}

.hisoka-home .portal-media img {
  filter: grayscale(.9) sepia(.35) hue-rotate(150deg) saturate(2.2) brightness(.72) contrast(1.18) !important;
}

.hisoka-home .card:hover .portal-media img {
  filter: grayscale(.85) sepia(.35) hue-rotate(150deg) saturate(2.35) brightness(.78) contrast(1.18) !important;
}

.hisoka-home .card .knob,
.hisoka-home .knob--about {
  background: #f6fbff;
  box-shadow: 0 calc(6 * var(--u)) calc(16 * var(--u)) rgba(2, 7, 15, .24);
}

.hisoka-home .card .knob svg,
.hisoka-home .knob--about svg {
  color: #23445f;
}

.hisoka-home .scroll {
  color: rgba(190, 221, 238, .56) !important;
}

.hisoka-home .scroll .track {
  background: rgba(85, 216, 239, .2);
}

.hisoka-home .scroll .track::after {
  background: rgba(126, 226, 255, .86);
}

.editorial-band,
.home-footer {
  background: var(--hisoka-paper);
}

.topics {
  background: var(--hisoka-surface);
}

.about {
  background: #e9eef3;
}

.home-footer {
  background: #05070c;
}

.eyebrow {
  color: var(--hisoka-green) !important;
}

.text-link,
.post-arrow,
.topic-row span:last-child {
  color: var(--hisoka-blue) !important;
}

::selection {
  background: rgba(85, 216, 239, .22);
  color: #101827;
}
