/*
 * Kowabana Home Horror Gate v1
 * Front-page-only styles. The gate stays hidden until JS initialization succeeds.
 */

:where(.kfh-gate, .kfh-home),
:where(.kfh-gate, .kfh-home) * {
  box-sizing: border-box;
}

.kfh-gate {
  display: none;
}

.kfh-enhanced {
  --kfh-font-content: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
  background: #030304;
  color-scheme: dark;
  scroll-behavior: auto;
}

.kfh-enhanced .kfh-gate {
  --kfh-progress: 0;
  --kfh-approach: 0;
  --kfh-unseal: 0;
  --kfh-open: 0;
  --kfh-reveal: 0;
  --kfh-world-scale: .92;
  --kfh-world-y: 0px;
  --kfh-door-scale: .7;
  --kfh-left-angle: 0deg;
  --kfh-right-angle: 0deg;
  --kfh-seal-opacity: 1;
  --kfh-seal-y: 0px;
  --kfh-reveal-y: 34px;
  --kfh-room-opacity: .12;
  --kfh-corridor-opacity: 1;
  --kfh-mark-opacity: 1;
  display: block;
  position: relative;
  z-index: 100000;
  width: 100%;
  height: 340vh;
  height: 340svh;
  margin: 0;
  padding: 0;
  color: #f4f0e9;
  background: #030304;
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  isolation: isolate;
}

.kfh-gate[hidden] {
  display: none !important;
}

.kfh-gate button,
.kfh-gate a {
  font: inherit;
}

.kfh-gate__sticky {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 520px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 48%, rgba(126, 19, 34, .16), transparent 26%),
    #030304;
  contain: paint;
}

.kfh-world {
  position: absolute;
  inset: -5%;
  overflow: hidden;
  transform: translate3d(0, var(--kfh-world-y), 0) scale(var(--kfh-world-scale));
  transform-origin: 50% 52%;
  background:
    radial-gradient(ellipse at 50% 48%, rgba(115, 12, 25, .32) 0 6%, rgba(5, 4, 5, .12) 28%, transparent 56%),
    linear-gradient(180deg, #0c0b0d, #020203 78%);
  will-change: transform;
}

.kfh-world::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    repeating-linear-gradient(93deg, transparent 0 7.5%, rgba(255, 255, 255, .012) 7.7%, transparent 7.9%),
    repeating-linear-gradient(3deg, transparent 0 11%, rgba(255, 255, 255, .008) 11.2%, transparent 11.4%);
  content: "";
}

.kfh-archive-room {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  opacity: var(--kfh-room-opacity);
  background: #160309;
  will-change: opacity;
}

.kfh-archive-room__image {
  position: absolute;
  inset: -4%;
  background-image:
    linear-gradient(180deg, rgba(2, 2, 3, .48), rgba(7, 1, 3, .62)),
    linear-gradient(90deg, rgba(0, 0, 0, .78), transparent 32% 68%, rgba(0, 0, 0, .78)),
    url("https://kowabana-file.com/wp-content/uploads/2026/03/horror-hero.jpg");
  background-position: center;
  background-size: cover;
  filter: grayscale(.7) contrast(1.22) brightness(.5) sepia(.15);
  transform: scale(1.05);
}

.kfh-archive-room__light {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 50% 54%, rgba(255, 49, 73, .72) 0, rgba(164, 13, 34, .28) 16%, transparent 48%),
    linear-gradient(180deg, transparent 0 42%, rgba(111, 5, 22, .28) 68%, transparent 100%);
  mix-blend-mode: screen;
}

.kfh-archive-room__shelves {
  position: absolute;
  top: 17%;
  bottom: 8%;
  width: 26%;
  border: 1px solid rgba(218, 190, 173, .12);
  background:
    repeating-linear-gradient(180deg, transparent 0 18%, rgba(197, 167, 149, .13) 18.2% 19%, transparent 19.2% 25%),
    repeating-linear-gradient(90deg, rgba(0, 0, 0, .28) 0 22%, rgba(138, 105, 91, .12) 22.5% 24%, rgba(0, 0, 0, .3) 24.5% 48%);
  box-shadow: inset 0 0 50px #000;
  opacity: .6;
}

.kfh-archive-room__shelves--left {
  left: 3%;
  transform: perspective(700px) rotateY(24deg);
  transform-origin: left center;
}

.kfh-archive-room__shelves--right {
  right: 3%;
  transform: perspective(700px) rotateY(-24deg);
  transform-origin: right center;
}

.kfh-archive-room__mark {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(62vw, 760px);
  opacity: var(--kfh-mark-opacity);
  text-align: center;
  transform: translate(-50%, -50%);
  text-shadow: 0 3px 28px #000, 0 0 50px rgba(215, 28, 53, .45);
}

.kfh-archive-room__mark span {
  display: block;
  margin-bottom: 1.2rem;
  color: #e5b5bc;
  font: 700 .64rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .42em;
}

.kfh-archive-room__mark strong {
  display: block;
  font-family: "Yuji Syuku", "Shippori Mincho", "Yu Mincho", serif;
  font-size: clamp(2.6rem, 7.2vw, 7rem);
  font-weight: 400;
  letter-spacing: .13em;
}

.kfh-archive-room__mark i {
  display: block;
  width: 72px;
  height: 1px;
  margin: 1.5rem auto 0;
  background: #e9344f;
  box-shadow: 0 0 18px #ec2444;
}

.kfh-corridor {
  position: absolute;
  z-index: 2;
  inset: 0;
  opacity: var(--kfh-corridor-opacity);
  will-change: opacity;
}

.kfh-corridor__ceiling,
.kfh-corridor__floor,
.kfh-corridor__wall {
  position: absolute;
  inset: 0;
}

.kfh-corridor__ceiling {
  clip-path: polygon(0 0, 100% 0, 60% 23%, 40% 23%);
  background:
    linear-gradient(100deg, transparent 0 28%, rgba(255, 255, 255, .035) 29%, transparent 30% 66%, rgba(255, 255, 255, .025) 67%, transparent 68%),
    linear-gradient(180deg, #171519, #080709);
  box-shadow: inset 0 -40px 80px #000;
}

.kfh-corridor__floor {
  clip-path: polygon(0 100%, 100% 100%, 60% 77%, 40% 77%);
  background:
    repeating-linear-gradient(93deg, transparent 0 8%, rgba(209, 183, 165, .06) 8.15% 8.35%, transparent 8.5% 16%),
    linear-gradient(0deg, #111014, #040405);
  box-shadow: inset 0 65px 100px #000;
}

.kfh-corridor__floor::after {
  position: absolute;
  inset: 0;
  clip-path: inherit;
  background: radial-gradient(ellipse at 50% 78%, rgba(157, 18, 37, .12), transparent 34%);
  content: "";
}

.kfh-corridor__wall {
  background-color: #111014;
  background-image:
    linear-gradient(112deg, transparent 0 47%, rgba(255, 255, 255, .035) 47.4%, transparent 48%),
    radial-gradient(circle at 32% 29%, rgba(255, 255, 255, .035) 0 1px, transparent 2px),
    repeating-linear-gradient(174deg, transparent 0 10%, rgba(255, 255, 255, .018) 10.3%, transparent 10.6% 18%);
  background-size: auto, 74px 61px, auto;
}

.kfh-corridor__wall--left {
  clip-path: polygon(0 0, 40% 23%, 40% 77%, 0 100%);
  box-shadow: inset -80px 0 110px #000, inset 35px 0 75px rgba(255, 255, 255, .018);
}

.kfh-corridor__wall--right {
  clip-path: polygon(100% 0, 60% 23%, 60% 77%, 100% 100%);
  box-shadow: inset 80px 0 110px #000, inset -35px 0 75px rgba(255, 255, 255, .018);
  transform: scaleX(-1);
}

.kfh-corridor__rib {
  position: absolute;
  z-index: 3;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, #252126, #080709 27% 72%, #211d21);
  box-shadow: 0 0 18px rgba(0, 0, 0, .9);
  opacity: .62;
}

.kfh-corridor__rib::before,
.kfh-corridor__rib::after {
  position: absolute;
  left: 50%;
  width: 42vw;
  height: 2px;
  background: #201d22;
  content: "";
  transform-origin: inherit;
}

.kfh-corridor__rib::before { top: 14%; }
.kfh-corridor__rib::after { bottom: 14%; }
.kfh-corridor__rib--one { left: 14%; }
.kfh-corridor__rib--one::before,
.kfh-corridor__rib--one::after { transform: rotate(18deg); transform-origin: left; }
.kfh-corridor__rib--two { left: 30%; opacity: .42; }
.kfh-corridor__rib--two::before,
.kfh-corridor__rib--two::after { width: 20vw; transform: rotate(21deg); transform-origin: left; }
.kfh-corridor__rib--three { right: 14%; }
.kfh-corridor__rib--three::before,
.kfh-corridor__rib--three::after { left: auto; right: 50%; transform: rotate(-18deg); transform-origin: right; }

.kfh-corridor__lamp {
  position: absolute;
  z-index: 4;
  top: 8%;
  left: 50%;
  width: 82px;
  height: 18px;
  border: 1px solid #292529;
  background: #111013;
  box-shadow: 0 6px 16px #000;
  transform: translateX(-50%) perspective(120px) rotateX(48deg);
}

.kfh-corridor__lamp span {
  position: absolute;
  inset: 4px 13px;
  background: #6e1825;
  box-shadow: 0 0 16px rgba(219, 38, 64, .36), 0 18px 48px rgba(184, 24, 48, .16);
}

.kfh-doorway {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  width: clamp(310px, 42vw, 610px);
  height: clamp(440px, 68vh, 720px);
  perspective: 1500px;
  transform: translate(-50%, -48%) scale(var(--kfh-door-scale));
  transform-origin: center;
  transform-style: preserve-3d;
  will-change: transform;
}

.kfh-doorway__halo {
  position: absolute;
  z-index: -1;
  inset: -9%;
  background: radial-gradient(ellipse, rgba(236, 38, 67, .36), rgba(116, 9, 27, .13) 40%, transparent 70%);
  filter: blur(20px);
  opacity: var(--kfh-reveal);
}

.kfh-doorway__frame {
  position: absolute;
  z-index: 8;
  inset: 3% 2% 0;
  border: clamp(8px, 1.1vw, 16px) solid #252126;
  box-shadow:
    inset 0 0 0 2px #080709,
    inset 0 0 28px rgba(0, 0, 0, .9),
    0 0 0 3px #070608,
    0 14px 45px rgba(0, 0, 0, .88);
  pointer-events: none;
}

.kfh-doorway__lintel {
  position: absolute;
  z-index: 12;
  top: -4%;
  right: 4%;
  left: 4%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  padding: 6px 10px 5px 14px;
  border: 1px solid #3a3439;
  color: #9d9696;
  background: #111013;
  box-shadow: 0 8px 20px #000;
  font: 700 clamp(.55rem, .8vw, .68rem)/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .18em;
}

.kfh-doorway__lintel b {
  display: grid;
  width: 24px;
  height: 22px;
  place-items: center;
  color: #f0cbd0;
  background: #8e1025;
  font-size: .6rem;
}

.kfh-door-leaf {
  position: absolute;
  z-index: 6;
  top: 5%;
  bottom: 1.5%;
  width: 48%;
  overflow: hidden;
  border: 1px solid #373139;
  background:
    linear-gradient(88deg, rgba(255, 255, 255, .025), transparent 9% 90%, rgba(0, 0, 0, .5)),
    repeating-linear-gradient(180deg, transparent 0 16%, rgba(239, 224, 211, .025) 16.2%, transparent 16.5% 28%),
    linear-gradient(96deg, #19171b, #282329 46%, #121115);
  box-shadow: inset 0 0 45px rgba(0, 0, 0, .8), 0 0 24px #000;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  will-change: transform;
}

.kfh-door-leaf::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 24% 19%, #4b3a32 0 1px, transparent 2px),
    radial-gradient(circle at 72% 38%, #553d35 0 1px, transparent 2px),
    radial-gradient(circle at 39% 72%, #412f2b 0 1.5px, transparent 2.5px),
    linear-gradient(111deg, transparent 0 45%, rgba(211, 197, 183, .06) 45.3%, transparent 45.8%);
  background-size: 49px 43px, 61px 57px, 77px 71px, auto;
  content: "";
  opacity: .75;
}

.kfh-door-leaf::after {
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, .045);
  box-shadow: inset 0 0 60px #000;
  content: "";
}

.kfh-door-leaf--left {
  left: 3%;
  transform: rotateY(var(--kfh-left-angle));
  transform-origin: left center;
}

.kfh-door-leaf--right {
  right: 3%;
  transform: rotateY(var(--kfh-right-angle));
  transform-origin: right center;
}

.kfh-door-leaf__plate {
  position: absolute;
  z-index: 2;
  inset: 10% 11%;
  border: 1px solid rgba(185, 162, 150, .13);
  box-shadow: inset 0 0 0 6px rgba(0, 0, 0, .22), inset 0 0 32px rgba(0, 0, 0, .62);
}

.kfh-door-leaf__brace {
  position: absolute;
  z-index: 3;
  left: -8%;
  width: 116%;
  height: 7%;
  border-block: 1px solid rgba(122, 96, 85, .28);
  background: linear-gradient(180deg, #211c1e, #100e11 48%, #292227);
  box-shadow: 0 8px 18px rgba(0, 0, 0, .5);
}

.kfh-door-leaf__brace--one { top: 28%; transform: rotate(8deg); }
.kfh-door-leaf__brace--two { bottom: 24%; transform: rotate(-7deg); }

.kfh-door-leaf__handle {
  position: absolute;
  z-index: 5;
  top: 51%;
  width: 18px;
  height: 18px;
  border: 4px solid #0a090a;
  border-radius: 50%;
  background: #5b4b47;
  box-shadow: 0 0 0 1px #77635c, 0 5px 10px #000;
}

.kfh-door-leaf--left .kfh-door-leaf__handle { right: 9%; }
.kfh-door-leaf--right .kfh-door-leaf__handle { left: 9%; }

.kfh-doorway__seam {
  position: absolute;
  z-index: 9;
  top: 6%;
  bottom: 2%;
  left: 50%;
  width: 2px;
  background: #050405;
  box-shadow: 0 0 10px 2px rgba(236, 35, 63, .72), 0 0 28px rgba(205, 23, 49, .5);
  opacity: var(--kfh-unseal);
  transform: translateX(-50%);
}

.kfh-chain {
  position: absolute;
  z-index: 14;
  top: 50%;
  left: 50%;
  width: 76%;
  height: 18px;
  opacity: var(--kfh-seal-opacity);
  transform: translate(-50%, var(--kfh-seal-y)) rotate(-11deg);
  will-change: opacity, transform;
}

.kfh-chain span {
  display: block;
  width: 100%;
  height: 100%;
  background:
    radial-gradient(ellipse at center, transparent 0 29%, #4a4240 31% 42%, #171416 45% 52%, transparent 54%) 0 0 / 23px 16px repeat-x;
  filter: drop-shadow(0 5px 3px #000);
}

.kfh-padlock {
  position: absolute;
  z-index: 15;
  top: 48%;
  left: 50%;
  width: 42px;
  height: 42px;
  border: 1px solid #61514b;
  border-radius: 3px;
  opacity: var(--kfh-seal-opacity);
  background: linear-gradient(135deg, #655148, #211c1e 58%, #493b36);
  box-shadow: inset 0 0 12px #171215, 0 7px 16px #000;
  transform: translate(-50%, var(--kfh-seal-y)) rotate(4deg);
  will-change: opacity, transform;
}

.kfh-padlock::before {
  position: absolute;
  right: 8px;
  bottom: 88%;
  left: 8px;
  height: 26px;
  border: 6px solid #4b403d;
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  content: "";
}

.kfh-padlock span {
  position: absolute;
  top: 17px;
  left: 50%;
  width: 6px;
  height: 13px;
  border-radius: 50% 50% 2px 2px;
  background: #0b090a;
  transform: translateX(-50%);
}

.kfh-seal {
  position: absolute;
  z-index: 16;
  left: 50%;
  display: grid;
  width: 112%;
  height: clamp(32px, 5vh, 48px);
  place-items: center;
  overflow: hidden;
  border-block: 1px solid rgba(255, 210, 213, .42);
  opacity: var(--kfh-seal-opacity);
  color: #f9e4e5;
  background:
    repeating-linear-gradient(-54deg, rgba(255, 255, 255, .16) 0 12px, transparent 12px 28px),
    #a20f27;
  box-shadow: 0 6px 14px rgba(0, 0, 0, .56);
  font: 900 clamp(.62rem, 1.2vw, .86rem)/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .22em;
  text-shadow: 0 1px 2px #4b0612;
  transform: translate(-50%, var(--kfh-seal-y));
  will-change: opacity, transform;
}

.kfh-seal span { white-space: nowrap; }
.kfh-seal--one { top: 38%; transform: translate(-50%, var(--kfh-seal-y)) rotate(-7deg); }
.kfh-seal--two { top: 63%; transform: translate(-50%, var(--kfh-seal-y)) rotate(6deg); }

.kfh-dust {
  position: absolute;
  z-index: 18;
  border-radius: 50%;
  background: rgba(230, 212, 196, .5);
  box-shadow: 0 0 7px rgba(238, 220, 202, .22);
  opacity: .35;
}

.kfh-dust--one { top: 27%; left: 24%; width: 3px; height: 3px; transform: translate3d(calc(var(--kfh-progress) * 42px), calc(var(--kfh-progress) * 68px), 0); }
.kfh-dust--two { top: 62%; right: 22%; width: 2px; height: 2px; transform: translate3d(calc(var(--kfh-progress) * -31px), calc(var(--kfh-progress) * -54px), 0); }
.kfh-dust--three { top: 34%; right: 34%; width: 4px; height: 4px; transform: translate3d(calc(var(--kfh-progress) * -18px), calc(var(--kfh-progress) * 74px), 0); }

.kfh-grain {
  position: absolute;
  z-index: 22;
  inset: 0;
  opacity: .16;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.22) 0 .6px, transparent .8px),
    radial-gradient(circle at 72% 61%, rgba(255,255,255,.14) 0 .5px, transparent .7px);
  background-size: 5px 5px, 7px 7px;
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.kfh-vignette {
  position: absolute;
  z-index: 24;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.7), transparent 18% 78%, rgba(0,0,0,.8)),
    radial-gradient(ellipse at center, transparent 28%, rgba(0, 0, 0, .48) 69%, rgba(0, 0, 0, .96));
  pointer-events: none;
}

.kfh-gate__ui {
  position: absolute;
  z-index: 30;
  inset: 0;
  pointer-events: none;
}

.kfh-gate__ui > :is(a, button, nav),
.kfh-gate__ui .kfh-reveal {
  pointer-events: auto;
}

.kfh-skip {
  position: absolute;
  top: max(18px, env(safe-area-inset-top));
  right: max(22px, env(safe-area-inset-right));
  z-index: 8;
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 9px;
  padding: 8px 3px 8px 12px;
  color: #d9d3cc;
  border-bottom: 1px solid rgba(232, 220, 207, .35);
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-decoration: none;
}

.kfh-skip svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}

.kfh-skip:hover { color: #fff; border-color: #e43a53; }

.kfh-case-label {
  position: absolute;
  top: max(22px, env(safe-area-inset-top));
  left: max(24px, env(safe-area-inset-left));
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: #928b87;
  font: 700 .62rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .25em;
}

.kfh-case-label b { color: #d2c9c1; font-size: .7rem; }

.kfh-status {
  position: absolute;
  top: 11%;
  left: 50%;
  margin: 0;
  padding: 8px 13px;
  color: #d4cbc4;
  border: 1px solid rgba(222, 205, 192, .17);
  background: rgba(3, 3, 4, .54);
  font: 700 .65rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
  transform: translateX(-50%);
  backdrop-filter: blur(7px);
}

.kfh-status::before {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 9px;
  border-radius: 50%;
  background: #dd2e49;
  box-shadow: 0 0 10px #e82f4b;
  content: "";
  vertical-align: 1px;
}

.kfh-enter {
  position: absolute;
  bottom: 13%;
  left: 50%;
  display: flex;
  min-width: 174px;
  min-height: 66px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 8px 18px 8px 53px;
  border: 1px solid rgba(236, 219, 207, .3);
  border-radius: 1px;
  color: #f4eee8;
  background: rgba(5, 5, 6, .72);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .5), inset 0 0 0 1px rgba(255,255,255,.025);
  cursor: pointer;
  transform: translateX(-50%);
  transition: color .2s ease, border-color .2s ease, background .2s ease, opacity .25s ease;
  backdrop-filter: blur(8px);
}

.kfh-enter__target {
  position: absolute;
  left: 15px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid #a5283c;
  border-radius: 50%;
  box-shadow: 0 0 0 5px rgba(170, 26, 49, .08);
}

.kfh-enter__target::before,
.kfh-enter__target::after,
.kfh-enter__target i {
  position: absolute;
  background: #c7354d;
  content: "";
}

.kfh-enter__target::before { width: 12px; height: 1px; }
.kfh-enter__target::after { width: 1px; height: 12px; }
.kfh-enter__target i { width: 4px; height: 4px; border-radius: 50%; }

.kfh-enter__label {
  font-family: "Yu Mincho", serif;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .15em;
}

.kfh-enter small {
  color: #918984;
  font: 600 .52rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .14em;
}

.kfh-enter:hover {
  border-color: #d43a52;
  background: rgba(78, 8, 21, .78);
}

.kfh-nav-ready .kfh-enter {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.kfh-reveal {
  position: absolute;
  top: 48%;
  left: 50%;
  width: min(920px, calc(100% - 40px));
  opacity: var(--kfh-reveal);
  text-align: center;
  text-shadow: 0 3px 22px #000;
  transform: translate(-50%, calc(-50% + var(--kfh-reveal-y)));
  visibility: hidden;
  will-change: opacity, transform;
}

.kfh-nav-ready .kfh-reveal { visibility: visible; }

.kfh-reveal__eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 12px;
  color: #e5b8bf;
  font: 700 .62rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .3em;
}

.kfh-reveal__eyebrow span {
  width: 25px;
  height: 1px;
  background: #ed3b56;
  box-shadow: 0 0 10px #ed3b56;
}

.kfh-reveal__title {
  margin: 0;
  color: #f6f0e9;
  font-family: "Yuji Syuku", "Shippori Mincho", "Yu Mincho", serif;
  font-size: clamp(2.5rem, 7vw, 6.1rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: .13em;
}

.kfh-reveal__lead {
  margin: 13px auto 24px;
  color: #c7bdb5;
  font-family: "Yu Mincho", serif;
  font-size: clamp(.86rem, 1.35vw, 1rem);
  letter-spacing: .08em;
}

.kfh-reveal__links {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  width: min(820px, 100%);
  margin: 0 auto;
  border: 1px solid rgba(234, 219, 207, .24);
  background: rgba(235, 218, 207, .18);
  box-shadow: 0 18px 45px rgba(0, 0, 0, .5);
  text-align: left;
  backdrop-filter: blur(14px);
}

.kfh-reveal__links a {
  position: relative;
  display: grid;
  min-height: 90px;
  align-content: center;
  padding: 15px 38px 15px 18px;
  color: #eee7e0;
  background: rgba(8, 8, 10, .82);
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}

.kfh-reveal__links a:hover { color: #fff; background: rgba(101, 10, 27, .9); }
.kfh-reveal__links span { color: #dc3c54; font: 700 .55rem/1 ui-monospace, monospace; letter-spacing: .15em; }
.kfh-reveal__links strong { margin-top: 7px; font-family: "Yu Mincho", serif; font-size: .93rem; letter-spacing: .08em; }
.kfh-reveal__links small { margin-top: 4px; color: #8e8781; font-size: .64rem; }
.kfh-reveal__links i { position: absolute; right: 16px; top: 50%; color: #bc4052; font-style: normal; transform: translateY(-50%); }

.kfh-scroll-cue {
  position: absolute;
  bottom: max(27px, env(safe-area-inset-bottom));
  left: max(26px, env(safe-area-inset-left));
  display: flex;
  align-items: center;
  gap: 12px;
  opacity: calc(1 - var(--kfh-reveal));
  color: #827c78;
  font: 600 .55rem/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .2em;
}

.kfh-scroll-cue i {
  position: relative;
  display: block;
  width: 54px;
  height: 1px;
  overflow: hidden;
  background: rgba(224, 214, 205, .22);
}

.kfh-scroll-cue b {
  position: absolute;
  inset: 0 auto 0 0;
  width: 22%;
  background: #c92944;
  transform: translateX(calc(var(--kfh-progress) * 355%));
}

.kfh-progress {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: rgba(255, 255, 255, .07);
}

.kfh-progress span {
  display: block;
  width: calc(var(--kfh-progress) * 100%);
  height: 100%;
  background: linear-gradient(90deg, #6d0b1c, #ee3b57);
  box-shadow: 0 0 12px rgba(238, 59, 87, .5);
}

.kfh-gate :is(a, button):focus-visible,
.kfh-home :is(a, button):focus-visible {
  outline: 3px solid #fff1d8;
  outline-offset: 4px;
  box-shadow: 0 0 0 7px #9e1930;
}

/* Existing homepage restyle: all selectors stay under the page-only body class. */
.kfh-home {
  --kfh-bg: #070708;
  --kfh-surface: #111216;
  --kfh-surface-raised: #17181d;
  --kfh-text: #eee9e3;
  --kfh-muted: #aaa39c;
  --kfh-red: #bd213a;
  min-height: 100vh;
  overflow-x: clip;
  overflow-y: visible;
  color: var(--kfh-text);
  background:
    radial-gradient(circle at 50% 22%, rgba(118, 12, 30, .08), transparent 26%),
    var(--kfh-bg);
}

.kfh-home :is(a, button) { -webkit-tap-highlight-color: transparent; }
.kfh-home a { color: inherit; }

.kfh-home .l-header,
.kfh-site-header {
  position: relative;
  z-index: 20;
  border-bottom: 1px solid rgba(239, 225, 213, .12);
  color: #e8e2dc;
  background: rgba(7, 7, 8, .96);
  box-shadow: 0 10px 32px rgba(0, 0, 0, .4);
}

.kfh-site-header__inner {
  display: flex;
  width: min(1180px, calc(100% - 40px));
  min-height: 72px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin: 0 auto;
}

.kfh-site-logo {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  text-decoration: none;
}

.kfh-site-logo > span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #6e1828;
  color: #e5d8cf;
  background: #17070b;
  font-family: "Yu Mincho", serif;
}

.kfh-site-logo strong {
  font-family: "Yu Mincho", serif;
  font-size: 1.05rem;
  letter-spacing: .12em;
}

.kfh-site-header nav { display: flex; align-items: stretch; gap: 4px; }
.kfh-site-header nav a { display: grid; min-height: 44px; place-items: center; padding: 0 14px; color: #aaa39d; font-size: .78rem; font-weight: 700; text-decoration: none; }
.kfh-site-header nav a:hover { color: #fff; background: #25090e; }

.kfh-home .l-header__bar { color: #cfc5bc; background: #19060a; }
.kfh-home .c-headLogo__link,
.kfh-home .c-gnav > li > a { color: #e9e2db; }
.kfh-home .c-gnav a::after { background: var(--kfh-red); }
.kfh-home .l-fixHeader { color: #e9e2db; background: rgba(8,8,9,.96); }
.kfh-home .l-fixHeader::before { background: rgba(8,8,9,.98); }
.kfh-home .l-fixHeader__inner { color: #e9e2db; }

.kfh-home.top #content,
.kfh-home #content {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 96px;
  background: transparent;
}

.kfh-home #main_content {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  outline: 0;
}

.kfh-home #main_content > .l-mainContent__inner {
  width: 100%;
}

.kfh-home .post_content {
  width: min(1100px, calc(100% - 40px));
  max-width: none;
  margin: 0 auto;
  color: var(--kfh-text);
  font-family: var(--kfh-font-content);
  font-size: clamp(1rem, 1.2vw, 1.075rem);
  line-height: 1.85;
}

.kfh-enhanced .post_content > .horror-hero[data-kfh-legacy-hero] {
  display: none !important;
}

.kfh-home .post_content > .horror-hero {
  position: relative;
  left: 50%;
  width: 100vw;
  min-height: min(82vh, 820px);
  min-height: min(82svh, 820px);
  margin: 0 0 82px;
  overflow: hidden;
  border-bottom: 1px solid rgba(236, 217, 203, .14);
  background: #080709;
  transform: translateX(-50%);
}

.kfh-home .horror-hero__bg,
.kfh-home .horror-hero__bg::after,
.kfh-home .horror-hero__vignette,
.kfh-home .horror-hero__fog {
  position: absolute;
  inset: 0;
}

.kfh-home .horror-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(.55) contrast(1.18) brightness(.52) sepia(.08);
  transform: scale(1.035);
}

.kfh-home .horror-hero__bg::after {
  background:
    linear-gradient(180deg, rgba(5,5,6,.25), rgba(6,5,7,.15) 44%, #070708 100%),
    linear-gradient(90deg, rgba(0,0,0,.66), transparent 34% 66%, rgba(0,0,0,.66));
  content: "";
}

.kfh-home .horror-hero__fog {
  top: auto;
  height: 42%;
  opacity: .34;
  background: radial-gradient(ellipse at center, rgba(183, 177, 171, .16), transparent 68%);
  filter: blur(22px);
}

.kfh-home .horror-hero__fog--2 { top: 18%; bottom: auto; opacity: .16; }
.kfh-home .horror-hero__vignette { background: radial-gradient(ellipse at center, transparent 27%, rgba(0,0,0,.76) 88%); }

.kfh-home .horror-hero__content {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 50%;
  width: min(900px, calc(100% - 40px));
  color: #f5efe8;
  text-align: center;
  text-shadow: 0 4px 25px #000;
  transform: translate(-50%, -48%);
}

.kfh-home .horror-hero__content::before {
  display: block;
  width: 38px;
  height: 1px;
  margin: 0 auto 24px;
  background: #e43a53;
  box-shadow: 0 0 18px #e43a53;
  content: "";
}

.kfh-home .horror-hero__title {
  margin: 0;
  color: #f5efe8;
  background: none;
  font-family: "Yuji Syuku", "Shippori Mincho", "Yu Mincho", serif;
  font-size: clamp(3.1rem, 9vw, 8.5rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: .14em;
}

.kfh-home .horror-hero__subtitle {
  margin-top: 18px;
  color: #d24a5d;
  font: 700 clamp(.62rem, 1.2vw, .82rem)/1.2 ui-monospace, monospace;
  letter-spacing: .42em;
}

.kfh-home .horror-hero__desc {
  margin: 30px auto 0;
  color: #e5ddd5;
  font-family: var(--kfh-font-content);
  font-size: clamp(1rem, 2vw, 1.35rem);
  font-weight: 700;
  letter-spacing: .08em;
}

.kfh-home .horror-hero__subdesc {
  margin: 9px auto 0;
  color: #aaa199;
  font-size: clamp(.76rem, 1.2vw, .88rem);
  letter-spacing: .05em;
}

.kfh-archive-index {
  position: relative;
  margin: 0 0 92px;
  padding: clamp(28px, 5vw, 55px);
  overflow: hidden;
  border: 1px solid rgba(232, 216, 203, .16);
  background:
    linear-gradient(115deg, rgba(112, 11, 29, .12), transparent 42%),
    #101115;
  box-shadow: 0 22px 60px rgba(0,0,0,.28);
}

.kfh-archive-index::before {
  position: absolute;
  top: -60px;
  right: -50px;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(193, 38, 59, .18);
  border-radius: 50%;
  box-shadow: 0 0 0 30px rgba(193,38,59,.025), 0 0 0 60px rgba(193,38,59,.015);
  content: "";
}

.kfh-archive-index__eyebrow,
.kfh-card-index,
.kfh-entry-no {
  display: block;
  margin: 0 0 10px;
  color: #d43a52;
  font: 800 .58rem/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .23em;
}

.kfh-home .kfh-archive-index > .kfh-archive-index__site-title {
  margin: 0 0 8px;
  color: #d43a52;
  background: none;
  font-family: var(--kfh-font-content) !important;
  font-size: clamp(.92rem, 1.35vw, 1.08rem);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .16em;
  text-shadow: none;
}

.kfh-archive-index h2 {
  margin: 0;
  padding: 0;
  border: 0;
  color: #f0e9e3;
  background: none;
  font-family: var(--kfh-font-content);
  font-size: clamp(1.8rem, 4vw, 3.5rem);
  font-weight: 400;
  letter-spacing: .08em;
}

.kfh-home .kfh-archive-index h2::before,
.kfh-home .kfh-archive-index h2::after {
  display: none !important;
  content: none !important;
}

.kfh-archive-index > p:not(.kfh-archive-index__eyebrow) { max-width: 650px; margin: 12px 0 30px; color: var(--kfh-muted); }

.kfh-archive-index__links {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.kfh-archive-index__links a {
  position: relative;
  display: grid;
  min-height: 116px;
  align-content: end;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(225, 209, 197, .15);
  color: #e9e2db;
  background: rgba(5, 5, 6, .58);
  text-decoration: none;
}

.kfh-archive-index__links a::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: #a6172f;
  content: "";
  transform: scaleY(.25);
  transform-origin: bottom;
  transition: transform .25s ease;
}

.kfh-archive-index__links a:hover::before { transform: scaleY(1); }
.kfh-archive-index__links span { position: absolute; top: 14px; right: 15px; color: #6f6863; font: 700 .58rem/1 monospace; }
.kfh-archive-index__links strong { font-family: var(--kfh-font-content); font-size: 1rem; letter-spacing: .06em; }
.kfh-archive-index__links small { margin-top: 5px; color: #8f8882; font-size: .68rem; }

.kfh-home .post_content > h2.wp-block-heading,
.kfh-home .kowabana-category-navigation h2.wp-block-heading {
  position: relative;
  margin: 92px 0 28px;
  padding: 21px 0 18px 25px;
  border: 0;
  border-top: 1px solid rgba(228, 213, 200, .14);
  border-bottom: 1px solid rgba(228, 213, 200, .1);
  color: #eee7e0;
  background: linear-gradient(90deg, rgba(147, 16, 38, .16), transparent 60%);
  font-family: var(--kfh-font-content);
  font-size: clamp(1.55rem, 3.3vw, 2.45rem);
  font-weight: 400;
  letter-spacing: .08em;
}

.kfh-home .post_content > h2.wp-block-heading::before,
.kfh-home .kowabana-category-navigation h2.wp-block-heading::before {
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 0;
  width: 3px;
  background: #c72740;
  box-shadow: 0 0 12px rgba(213, 38, 65, .44);
  content: "";
}

.kfh-home .post_content > p,
.kfh-home .kowabana-category-navigation > p,
.kfh-home .kowabana-category-navigation > .wp-block-group__inner-container > p { color: #b7b0a9; }
.kfh-home .post_content strong { color: #f0e8e0; }

.kfh-four-files {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: file;
}

.kfh-four-files li {
  position: relative;
  min-height: 144px;
  padding: 25px 24px 22px 68px;
  border: 1px solid rgba(226, 211, 199, .13);
  background: #101115;
  counter-increment: file;
}

.kfh-four-files li::before {
  position: absolute;
  top: 24px;
  left: 22px;
  color: #c42b42;
  content: "0" counter(file);
  font: 800 .66rem/1 monospace;
}

.kfh-four-files strong { display: block; margin-bottom: 8px; font-family: var(--kfh-font-content); font-size: 1.08rem; letter-spacing: .05em; }
.kfh-four-files span { display: block; color: #9f9892; font-size: .84rem; line-height: 1.7; }

.kfh-home .kowabana-category-navigation {
  margin: 100px 0 0;
  padding: 0;
}

.kfh-home .kowabana-category-navigation h2.wp-block-heading { margin-top: 0; }
.kfh-home .wp-block-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 28px 0 0; }

.kfh-home .wp-block-column {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 260px;
  flex-direction: column;
  padding: 26px;
  border: 1px solid rgba(228, 213, 201, .14);
  background:
    linear-gradient(145deg, rgba(143, 14, 35, .1), transparent 44%),
    #111216;
}

.kfh-home .wp-block-column h3 { margin: 9px 0 13px; padding: 0; color: #eee7df; font-family: var(--kfh-font-content); font-size: 1.25rem; letter-spacing: .05em; }
.kfh-home .wp-block-column > p { margin: 0; color: #9d9690; font-size: .84rem; }
.kfh-home .wp-block-column > p:last-child { margin-top: auto; padding-top: 20px; }
.kfh-home .wp-block-column a { display: flex; min-height: 44px; align-items: center; justify-content: space-between; padding: 0 2px 0 0; border-bottom: 1px solid rgba(211, 48, 72, .45); color: #e4dcd4; font-weight: 700; text-decoration: none; }
.kfh-home .wp-block-column a i { color: #c83149; font-style: normal; }

.kfh-popular-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kfh-popular-list li {
  --kfh-popular-image: url("./popular-haunted-shrine.webp");
  --kfh-popular-position: 50% 50%;
  margin: 0;
}

.kfh-popular-list li:nth-child(2) { --kfh-popular-image: url("./popular-haunted-underpass.webp"); }
.kfh-popular-list li:nth-child(3) { --kfh-popular-image: url("./popular-haunted-underpass-alt.webp"); }
.kfh-popular-list li:nth-child(4) { --kfh-popular-image: url("./popular-haunted-tunnel.webp"); }
.kfh-popular-list li:nth-child(5) { --kfh-popular-image: url("./popular-haunted-shrine-alt.webp"); }
.kfh-popular-list li:nth-child(6) { --kfh-popular-image: url("./popular-haunted-hospital.webp"); }

.kfh-popular-list a {
  position: relative;
  display: grid;
  min-height: 154px;
  align-content: end;
  padding: 48px 22px 21px;
  overflow: hidden;
  border: 1px solid rgba(225, 210, 198, .13);
  color: #e9e2db;
  background: #111216;
  isolation: isolate;
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease;
}

.kfh-popular-list a::before,
.kfh-popular-list a::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.kfh-popular-list a::before {
  z-index: 0;
  inset: 0;
  background-color: #111216;
  background-image: var(--kfh-popular-image);
  background-position: var(--kfh-popular-position);
  background-repeat: no-repeat;
  background-size: cover;
}

.kfh-popular-list a::after {
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(to top, rgba(8, 9, 11, 1) 0%, rgba(8, 9, 11, .94) 26%, rgba(8, 9, 11, .57) 51%, rgba(4, 5, 6, .08) 100%),
    linear-gradient(90deg, rgba(4, 5, 6, .32), transparent 42%, rgba(57, 7, 15, .08));
  box-shadow: inset 0 0 28px rgba(0, 0, 0, .6);
}

.kfh-popular-list a:hover { border-color: rgba(219, 50, 76, .62); transform: translateY(-2px); }
.kfh-popular-list span { position: absolute; z-index: 2; top: 17px; left: 20px; color: #cf2d46; font: 800 .67rem/1 monospace; }
.kfh-popular-list strong { position: relative; z-index: 2; font-family: var(--kfh-font-content); font-size: .95rem; line-height: 1.65; text-shadow: 0 2px 10px #070709; }
.kfh-popular-list small { position: relative; z-index: 2; margin-top: 9px; color: #7f7873; font-size: .63rem; letter-spacing: .1em; }

.kfh-home .wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kfh-home .wp-block-post {
  position: relative;
  min-width: 0;
  min-height: 190px;
  margin: 0;
  padding: 25px 27px 58px;
  border: 1px solid rgba(227, 212, 200, .13);
  background: linear-gradient(145deg, #15161a, #0e0f12);
}

.kfh-home .wp-block-post:last-child:nth-child(odd) { grid-column: 1 / -1; min-height: 150px; }
.kfh-home .wp-block-post-title { margin: 16px 0 0; padding: 0; background: none; font-family: var(--kfh-font-content); font-size: clamp(1rem, 1.6vw, 1.18rem); line-height: 1.75; }
.kfh-home .wp-block-post-title a { color: #e9e1da; text-decoration: none; }
.kfh-home .wp-block-post-title a:hover { color: #ff6a7e; }
.kfh-home .wp-block-post-date { position: absolute; right: 27px; bottom: 22px; color: #79736e; font: 600 .62rem/1.2 ui-monospace, monospace; letter-spacing: .08em; }

.kfh-safety {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 24px;
  margin: 94px 0 0;
  padding: clamp(26px, 5vw, 48px);
  border: 1px solid rgba(222, 184, 111, .25);
  background: linear-gradient(120deg, rgba(96, 70, 28, .18), transparent 58%), #101012;
}

.kfh-safety > span {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid #ad8c51;
  border-radius: 50%;
  color: #e0b86f;
  font: 700 1.2rem/1 serif;
}

.kfh-safety h2 { margin: 0 0 12px; color: #eee4d6; font-family: var(--kfh-font-content); font-size: clamp(1.45rem, 3vw, 2.1rem); font-weight: 400; }
.kfh-safety p { margin: 7px 0; color: #aca398; }
.kfh-safety a { color: #dec18b; text-underline-offset: 4px; }

.kfh-home .l-footer,
.kfh-site-footer {
  border-top: 1px solid rgba(226, 210, 196, .13);
  color: #a9a19a;
  background: #050506;
}

.kfh-site-footer > div { width: min(1100px, calc(100% - 40px)); margin: 0 auto; padding: 55px 0; }
.kfh-site-footer strong { color: #e5ddd5; font-family: var(--kfh-font-content); letter-spacing: .12em; }
.kfh-site-footer p { margin: 7px 0 22px; }
.kfh-site-footer small { color: #6f6964; font: 600 .6rem/1.2 monospace; letter-spacing: .12em; }

@media (max-width: 781px) {
  .kfh-enhanced .kfh-gate { height: 320vh; height: 320svh; }
  .kfh-gate__sticky { min-height: 500px; }
  .kfh-doorway { width: min(82vw, 410px); height: min(66vh, 620px); }
  .kfh-case-label { top: max(16px, env(safe-area-inset-top)); left: max(16px, env(safe-area-inset-left)); }
  .kfh-case-label span { display: none; }
  .kfh-skip { top: max(11px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); font-size: .68rem; }
  .kfh-status { top: 10%; max-width: calc(100% - 32px); white-space: nowrap; font-size: .56rem; letter-spacing: .14em; }
  .kfh-reveal { top: 49%; width: calc(100% - 28px); }
  .kfh-reveal__eyebrow { margin-bottom: 7px; font-size: .52rem; }
  .kfh-reveal__title { font-size: clamp(2.35rem, 12vw, 4.2rem); }
  .kfh-reveal__lead { margin: 8px auto 14px; font-size: .72rem; }
  .kfh-reveal__links { grid-template-columns: 1fr; width: min(410px, 100%); }
  .kfh-reveal__links a { min-height: 58px; padding: 9px 38px 9px 14px; }
  .kfh-reveal__links strong { margin-top: 3px; font-size: .78rem; }
  .kfh-reveal__links small { display: none; }
  .kfh-enter { bottom: 11%; }
  .kfh-scroll-cue { display: none; }
  .kfh-archive-room__mark { display: none; }
  .kfh-site-header__inner { min-height: 64px; }
  .kfh-site-header nav a { padding-inline: 9px; font-size: .69rem; }
  .kfh-site-header nav a:last-child { display: none; }
  .kfh-home .post_content { width: min(100% - 28px, 1100px); }
  .kfh-home .post_content > .horror-hero { margin-bottom: 56px; min-height: 72svh; }
  .kfh-home .horror-hero__title { font-size: clamp(2.8rem, 15vw, 5.2rem); letter-spacing: .1em; }
  .kfh-home .horror-hero__desc { max-width: 20em; line-height: 1.8; }
  .kfh-home .horror-hero__subdesc { max-width: 27em; line-height: 1.7; }
  .kfh-archive-index { margin-bottom: 62px; }
  .kfh-archive-index__links,
  .kfh-home .wp-block-columns,
  .kfh-popular-list { grid-template-columns: 1fr; }
  .kfh-archive-index__links a { min-height: 90px; }
  .kfh-home .wp-block-column { min-height: 220px; }
  .kfh-four-files { grid-template-columns: 1fr; }
  .kfh-home .wp-block-post-template { grid-template-columns: 1fr; }
  .kfh-home .wp-block-post:last-child:nth-child(odd) { grid-column: auto; }
  .kfh-home .post_content > h2.wp-block-heading,
  .kfh-home .kowabana-category-navigation h2.wp-block-heading { margin-top: 68px; padding-left: 18px; }
  .kfh-home .kowabana-category-navigation h2.wp-block-heading { margin-top: 0; }
  .kfh-safety { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .kfh-doorway { height: min(61vh, 530px); }
  .kfh-status { top: 9%; }
  .kfh-enter { bottom: 8%; min-height: 58px; }
  .kfh-reveal { top: 48%; }
  .kfh-reveal__title { font-size: clamp(2rem, 11vw, 3rem); }
  .kfh-reveal__lead { max-width: 24em; }
  .kfh-reveal__links a { min-height: 52px; }
  .kfh-reveal__links span { font-size: .48rem; }
  .kfh-site-logo strong { font-size: .9rem; }
  .kfh-site-header nav a { padding-inline: 6px; }
  .kfh-home .horror-hero__content { width: calc(100% - 28px); }
  .kfh-home .horror-hero__desc { font-size: .94rem; }
  .kfh-four-files li { padding-left: 57px; }
  .kfh-four-files li::before { left: 18px; }
}

@media (max-height: 620px) and (orientation: landscape) {
  .kfh-doorway { width: min(37vw, 390px); height: 72vh; }
  .kfh-status { top: 6%; }
  .kfh-case-label span { display: none; }
  .kfh-enter { bottom: 8%; min-height: 54px; }
  .kfh-reveal { top: 48%; width: min(820px, calc(100% - 150px)); }
  .kfh-reveal__eyebrow { margin-bottom: 5px; }
  .kfh-reveal__title { font-size: clamp(2rem, 6vh, 3.4rem); }
  .kfh-reveal__lead { display: none; }
  .kfh-reveal__links a { min-height: 58px; padding-block: 8px; }
  .kfh-reveal__links small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .kfh-enhanced { scroll-behavior: auto; }
  .kfh-enhanced .kfh-gate {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
    --kfh-world-scale: 1.06 !important;
    --kfh-door-scale: 1 !important;
    --kfh-left-angle: -108deg !important;
    --kfh-right-angle: 108deg !important;
    --kfh-seal-opacity: 0 !important;
    --kfh-reveal: 1 !important;
    --kfh-reveal-y: 0px !important;
    --kfh-room-opacity: 1 !important;
    --kfh-corridor-opacity: .32 !important;
    --kfh-mark-opacity: 0 !important;
  }
  .kfh-gate__sticky { position: relative; }
  .kfh-enter,
  .kfh-scroll-cue,
  .kfh-progress { display: none; }
  .kfh-reveal { opacity: 1; transform: translate(-50%, -50%); visibility: visible; }
  .kfh-seal,
  .kfh-chain,
  .kfh-padlock { display: none; }
  .kfh-door-leaf--left { transform: rotateY(-108deg); }
  .kfh-door-leaf--right { transform: rotateY(108deg); }
  .kfh-home *,
  .kfh-gate * { scroll-behavior: auto !important; transition-duration: .001ms !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

@media print {
  .kfh-gate { display: none !important; }
  .kfh-home { color: #111; background: #fff; }
}
