.hyeon-entry{max-width:480px;margin:auto;background:#08080e;text-align:center;color:#f4ecdb;overflow:hidden}
.hyeon-entry[hidden]{display:none!important}
.hyeon-entry-art{position:relative;height:clamp(280px,calc(100svh - 425px),530px);overflow:hidden;background:#08080e}
.hyeon-entry-art img,.hyeon-entry-art video{width:100%;height:100%;display:block;object-fit:cover;object-position:50% 42%;animation:hyeon-entry-arrive 1.6s ease-out both}
.hyeon-entry-art::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#08080e,transparent 24%,transparent 85%,#08080e66)}
.hyeon-entry-copy{position:relative;padding:0 22px 24px;margin-top:-8px}
.hyeon-entry-copy h2{font-size:26px;line-height:1.35;margin:0 0 10px;font-weight:800;color:#f5eddf;word-break:keep-all;text-wrap:balance}
.hyeon-entry-copy p{font-size:16px;line-height:1.6;margin:0 0 14px;word-break:keep-all}
.hyeon-entry-copy .hyeon-entry-facts{color:#c8c1b6;font:12px/1.7 sans-serif;word-break:keep-all}
.hyeon-entry .primary-action{width:100%;margin:0;min-height:52px}
.hyeon-entry-story{background:none;border:0;color:#c7bda8;text-decoration:underline;text-underline-offset:4px;padding:15px 10px;font-family:inherit;font-size:13px;line-height:1.4;cursor:pointer}
.hyeon-checkout-note{color:#d8cbaa;text-align:center;font-size:13px;line-height:1.7;margin:14px 12px;word-break:keep-all}
.hyeon-checkout-note[hidden]{display:none!important}
@keyframes hyeon-entry-arrive{from{transform:scale(1.035);filter:brightness(.6)}to{transform:scale(1);filter:brightness(1)}}
@media(prefers-reduced-motion:reduce){.hyeon-entry-art img,.hyeon-entry-art video{animation:none}}

/* Only the visible Hyeon entry uses this compact frame. Other views restore their headers. */
.app-shell:has(> [data-view="topic"].is-active > [data-topic-step-entry]:not([hidden])) {
  padding-bottom: 0;
}
.app-shell:has(> [data-view="topic"].is-active > [data-topic-step-entry]:not([hidden])) > .topbar {
  display: none;
}
[data-view="topic"].is-active:has(> [data-topic-step-entry]:not([hidden])) {
  min-height: 100svh;
  padding-bottom: 0;
}
[data-view="topic"].is-active:has(> [data-topic-step-entry]:not([hidden])) > .view-title {
  height: 44px;
  padding-inline: 10px;
}
[data-view="topic"].is-active:has(> [data-topic-step-entry]:not([hidden])) > .view-title h1 {
  font-size: 16px;
}
[data-view="topic"].is-active:has(> [data-topic-step-entry]:not([hidden])) > .view-title button {
  width: 44px;
  height: 44px;
}
.hyeon-entry:not([hidden]) .hyeon-entry-art {
  height: clamp(300px, calc(100svh - 176px), 660px);
  min-height: 0;
}
.hyeon-entry:not([hidden]) .hyeon-entry-art img,
.hyeon-entry:not([hidden]) .hyeon-entry-art video {
  object-position: 50% 0%;
}
.hyeon-entry:not([hidden]) .hyeon-entry-copy {
  padding: 0 16px max(12px, env(safe-area-inset-bottom, 0px));
}
.hyeon-entry:not([hidden]) .hyeon-entry-copy h2 {
  font-size: clamp(19px, 6.1vw, 26px);
  line-height: 1.3;
  margin-bottom: 8px;
}
.hyeon-entry:not([hidden]) .hyeon-entry-copy p {
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 12px;
}
.hyeon-entry:not([hidden]) .hyeon-entry-story {
  min-height: 44px;
  padding-block: 11px;
}