/* Nippo landing and opening safety reminder: match the cKas black-and-white home. */
:root {
  --nippo-ink: #111;
  --nippo-paper: #fff;
  --nippo-rule: #d8d8d8;
}

html body.nippo-landing-page {
  color: var(--nippo-ink) !important;
  background: var(--nippo-paper) !important;
}

.nippo-landing-header {
  background: var(--nippo-paper) !important;
  border-bottom: 1px solid var(--nippo-rule) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.nippo-landing-header > div,
.nippo-landing-header > div > strong,
.nippo-label,
.nippo-hero h1,
.nippo-content h2,
.nippo-content h3,
.nippo-hero > p:not(.nippo-label),
.nippo-content p {
  color: var(--nippo-ink) !important;
}

.nippo-landing-header .ckas-back-button,
.nippo-landing-header .nippo-theme-toggle,
.nippo-landing-header .nippo-language-toggle {
  border: 1px solid var(--nippo-ink) !important;
  border-radius: 0 !important;
  background: var(--nippo-paper) !important;
  color: var(--nippo-ink) !important;
  box-shadow: none !important;
}

.nippo-hero,
.nippo-content,
.nippo-flow li {
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

.nippo-hero {
  padding: clamp(28px, 6vw, 56px) 0 !important;
  border-bottom: 1px solid var(--nippo-rule) !important;
}

.nippo-hero h1 {
  max-width: 15ch;
  font-weight: 900;
  letter-spacing: -.045em;
}

.nippo-actions a,
.nippo-primary,
.nippo-secondary {
  min-height: 48px;
  border: 1px solid var(--nippo-ink) !important;
  border-radius: 0 !important;
  color: var(--nippo-ink) !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

.nippo-actions .nippo-primary {
  color: var(--nippo-paper) !important;
  background: var(--nippo-ink) !important;
}

.nippo-local-note {
  padding: 12px 0 !important;
  border-top: 1px solid var(--nippo-rule) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.nippo-flow {
  gap: 0 !important;
  border-top: 1px solid var(--nippo-rule);
}

.nippo-flow li {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--nippo-rule) !important;
}

.nippo-flow li > span {
  border-radius: 0 !important;
  color: var(--nippo-paper) !important;
  background: var(--nippo-ink) !important;
}

.nippo-links a { color: var(--nippo-ink) !important; }

/* The safety dialog sits above the sticky page header and uses a compact layout. */
body.safety-reminder-open .nippo-landing-header { visibility: hidden !important; }

html body.nippo-landing-page .global-safety-reminder {
  z-index: 11000 !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 76px 20px calc(var(--ad-placeholder-height, 0px) + 88px) !important;
  background: var(--nippo-paper) !important;
}

html body.nippo-landing-page .global-safety-reminder::before,
html body.nippo-landing-page .global-safety-reminder-panel::before {
  display: none !important;
}

html body.nippo-landing-page .global-safety-reminder-panel {
  box-sizing: border-box !important;
  width: min(920px, 100%) !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--nippo-ink) !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .global-safety-reminder-content-card {
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 0 42px !important;
  padding: clamp(22px, 4vw, 40px) !important;
  border: 1px solid var(--nippo-ink) !important;
  border-radius: 0 !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .global-safety-reminder-content-card .global-safety-reminder-visual {
  gap: 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .safety-visual-picture {
  border: 1px solid var(--nippo-rule) !important;
  border-radius: 0 !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

html body.nippo-landing-page :is(.global-safety-reminder-kicker, .global-safety-reminder h2,
  .global-safety-reminder-message, .global-safety-reminder-confirm,
  .safety-visual-headline strong, .safety-visual-headline span,
  .safety-visual-headline small, .safety-visual-picture span) {
  color: var(--nippo-ink) !important;
}

html body.nippo-landing-page .global-safety-reminder-primary {
  min-height: 56px !important;
  padding: 0 28px !important;
  border: 1px solid var(--nippo-ink) !important;
  border-radius: 0 !important;
  color: var(--nippo-paper) !important;
  background: var(--nippo-ink) !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .global-safety-reminder-primary:focus-visible {
  outline: 2px solid var(--nippo-ink) !important;
  outline-offset: 3px !important;
}

html body.nippo-landing-page .global-safety-reminder-back {
  width: 42px !important;
  height: 42px !important;
  border: 1px solid var(--nippo-ink) !important;
  border-radius: 0 !important;
  color: var(--nippo-ink) !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

@media (max-width: 767px) {
  html body.nippo-landing-page .global-safety-reminder {
    padding: calc(68px + env(safe-area-inset-top)) 14px calc(var(--ad-placeholder-height, 0px) + 80px + env(safe-area-inset-bottom)) !important;
  }

  html body.nippo-landing-page .global-safety-reminder-content-card {
    padding: 18px 14px !important;
  }

  html body.nippo-landing-page .global-safety-reminder-panel .safety-visual-picture {
    width: min(44%, 164px) !important;
  }

  .nippo-hero { padding: 30px 0 !important; }
  .nippo-content { padding: 26px 0 !important; }
}

/* The report landing page follows the home page's black editorial hero. */
html body.nippo-landing-page {
  --nippo-ink: #090909;
  --nippo-paper: #fff;
  --nippo-muted: #595959;
  --nippo-rule: #d8d8d8;
  background: var(--nippo-paper) !important;
}

html body.nippo-landing-page[data-theme="dark"] {
  --nippo-ink: #fff;
  --nippo-paper: #090909;
  --nippo-muted: #aaa;
  --nippo-rule: #3a3a3a;
}

/* Keep the daily-report landing page on the same width rhythm as cKas home:
   compact header, wide hero, inset reading column. */
html body.nippo-landing-page {
  --nippo-header-width: 1180px;
  --nippo-main-width: 1180px;
  --nippo-content-width: 1052px;
}

html body.nippo-landing-page .nippo-landing-header {
  max-width: var(--nippo-header-width) !important;
  min-height: calc(82px + env(safe-area-inset-top)) !important;
  border-bottom-color: var(--nippo-rule) !important;
  background: var(--nippo-paper) !important;
  color: var(--nippo-ink) !important;
}

html body.nippo-landing-page .nippo-landing-main {
  max-width: var(--nippo-main-width) !important;
  padding: 0 0 72px !important;
}

html body.nippo-landing-page .nippo-hero {
  position: relative !important;
  isolation: isolate !important;
  box-sizing: border-box !important;
  min-height: 390px !important;
  margin: 0 !important;
  padding: 62px 64px 56px !important;
  overflow: hidden !important;
  border: 1px solid var(--nippo-ink) !important;
  border-top: 0 !important;
  color: #fff !important;
  text-align: left !important;
  background: #090909 !important;
}

html body.nippo-landing-page .nippo-hero::after {
  content: "01";
  position: absolute;
  z-index: -1;
  right: 18px;
  bottom: -126px;
  color: transparent;
  -webkit-text-stroke: 1px #464646;
  font: 900 clamp(270px, 38vw, 500px)/.9 Arial, sans-serif;
  letter-spacing: -.1em;
  pointer-events: none;
}

html body.nippo-landing-page .nippo-hero .nippo-label {
  color: #aaa !important;
  letter-spacing: .24em !important;
}

html body.nippo-landing-page .nippo-hero h1 {
  position: relative;
  max-width: 770px !important;
  margin: 24px 0 16px !important;
  color: #fff !important;
  font-size: clamp(42px, 7vw, 76px) !important;
  font-weight: 800 !important;
  line-height: 1.16 !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
}

html body.nippo-landing-page .nippo-hero > p:not(.nippo-label) {
  position: relative;
  max-width: 560px !important;
  color: #c2c2c2 !important;
  font-size: 15px !important;
}

html body.nippo-landing-page .nippo-actions {
  position: relative;
  margin: 28px 0 15px !important;
  gap: 10px !important;
}

html body.nippo-landing-page .nippo-actions a {
  width: fit-content !important;
  min-height: 52px !important;
  padding: 0 20px !important;
  border: 1px solid #fff !important;
  border-radius: 0 !important;
  font-size: 13px !important;
}

html body.nippo-landing-page .nippo-primary {
  color: #090909 !important;
  background: #fff !important;
}

html body.nippo-landing-page .nippo-secondary {
  color: #fff !important;
  background: transparent !important;
}

html body.nippo-landing-page .nippo-local-note {
  max-width: 640px;
  margin: 0 !important;
  padding: 13px 0 0 !important;
  border-top: 1px solid #464646 !important;
  color: #aaa !important;
  background: transparent !important;
}

html body.nippo-landing-page #nippo-ja,
html body.nippo-landing-page #nippo-en {
  padding: 0 64px;
}

html body.nippo-landing-page .nippo-content {
  max-width: var(--nippo-content-width);
  margin: 0 auto !important;
  padding: 55px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--nippo-rule) !important;
  border-radius: 0 !important;
  background: var(--nippo-paper) !important;
  color: var(--nippo-ink) !important;
}

html body.nippo-landing-page .nippo-content :is(h2, h3, p, summary, li) {
  color: var(--nippo-ink) !important;
}

html body.nippo-landing-page .nippo-content > .nippo-label {
  color: var(--nippo-muted) !important;
  letter-spacing: .24em !important;
}

html body.nippo-landing-page .nippo-content h2 {
  margin: 9px 0 22px !important;
  font-size: clamp(30px, 4vw, 42px) !important;
  letter-spacing: -.06em;
}

html body.nippo-landing-page .nippo-content p {
  color: var(--nippo-muted) !important;
}

html body.nippo-landing-page .nippo-flow {
  display: block !important;
  border-top: 1px solid var(--nippo-rule) !important;
}

html body.nippo-landing-page .nippo-flow li {
  padding: 18px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nippo-rule) !important;
  background: transparent !important;
}

html body.nippo-landing-page .nippo-flow li > span {
  color: var(--nippo-paper) !important;
  background: var(--nippo-ink) !important;
}

html body.nippo-landing-page .nippo-links a { color: var(--nippo-ink) !important; }

@media (max-width: 780px) {
  html body.nippo-landing-page #nippo-ja,
  html body.nippo-landing-page #nippo-en { padding-inline: 34px; }
  html body.nippo-landing-page .nippo-hero { min-height: 350px !important; padding-inline: 34px !important; }
}

@media (max-width: 600px) {
  html body.nippo-landing-page .nippo-landing-header { min-height: calc(68px + env(safe-area-inset-top)) !important; }
  html body.nippo-landing-page .nippo-hero { min-height: 350px !important; padding: 42px 22px 38px !important; }
  html body.nippo-landing-page .nippo-hero::after { right: -10px; bottom: -60px; font-size: 260px; }
  html body.nippo-landing-page .nippo-hero h1 { margin-top: 22px !important; font-size: clamp(39px, 10.2vw, 54px) !important; }
  html body.nippo-landing-page .nippo-hero > p:not(.nippo-label) { max-width: 370px !important; font-size: 13px !important; }
  html body.nippo-landing-page #nippo-ja,
  html body.nippo-landing-page #nippo-en { padding-inline: 22px; }
  html body.nippo-landing-page .nippo-content { padding: 44px 0 !important; }
}

/* Header and hero controls: align to the cKas home bar and CTA contrast. */
html body.nippo-landing-page .nippo-landing-header {
  box-sizing: border-box !important;
  width: min(100%, var(--nippo-header-width)) !important;
  max-width: var(--nippo-header-width) !important;
  grid-template-columns: 44px auto minmax(0, 1fr) 42px !important;
  justify-content: initial !important;
}

html body.nippo-landing-page .nippo-landing-header > div {
  grid-column: 2 !important;
  justify-content: flex-start !important;
  color: var(--nippo-ink) !important;
}

html body.nippo-landing-page .nippo-landing-header > div > strong {
  color: var(--nippo-ink) !important;
  font-size: 18px !important;
}

html body.nippo-landing-page .nippo-landing-header :is(.ckas-back-button, .nippo-theme-toggle, .nippo-language-toggle) {
  border-radius: 0 !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle {
  grid-column: 4 !important;
  justify-self: end !important;
  margin: 0 !important;
}

html body.nippo-landing-page .nippo-hero .nippo-actions .nippo-primary {
  border-color: #fff !important;
  color: #090909 !important;
  background: #fff !important;
}

html body.nippo-landing-page .nippo-hero .nippo-actions .nippo-secondary {
  border-color: #fff !important;
  color: #fff !important;
  background: #090909 !important;
}

html body.nippo-landing-page .nippo-hero .nippo-actions a {
  border-radius: 0 !important;
}

html body.nippo-landing-page .nippo-hero .nippo-local-note {
  border-color: #464646 !important;
  color: #c2c2c2 !important;
  background: #090909 !important;
}

@media (max-width: 600px) {
  html body.nippo-landing-page .nippo-landing-header {
    grid-template-columns: 42px auto minmax(0, 1fr) 42px !important;
  }
}

/* Keep the report hero divider the same one-pixel weight as the home hero. */
html body.nippo-landing-page[data-theme] .nippo-hero {
  border-bottom-width: 1px !important;
}

/* Center the tool name independently and echo the cKas home navigation. */
html body.nippo-landing-page .nippo-landing-header {
  position: sticky !important;
  grid-template-columns: 44px minmax(0, 1fr) auto 42px !important;
}

html body.nippo-landing-page .nippo-landing-header > div {
  position: absolute !important;
  left: 50% !important;
  grid-column: auto !important;
  transform: translateX(-50%) !important;
  white-space: pre-line !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle {
  width: 42px !important;
  height: 42px !important;
  border: 1px solid var(--nippo-rule) !important;
  border-radius: 0 !important;
  color: var(--nippo-ink) !important;
  background: var(--nippo-paper) !important;
  transition: background .18s ease, border-color .18s ease !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle:hover {
  border-color: var(--nippo-ink) !important;
  background: color-mix(in srgb, var(--nippo-ink) 6%, var(--nippo-paper)) !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle:focus-visible {
  outline: 2px solid var(--nippo-ink) !important;
  outline-offset: 3px !important;
}

@media (max-width: 780px) {
  html body.nippo-landing-page .nippo-landing-header {
    grid-template-columns: 42px minmax(0, 1fr) 42px !important;
  }
}

/* Match the cKas home theme control: 42px square, neutral border, 19px icon. */
html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle {
  box-sizing: border-box !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 1px solid var(--nippo-rule) !important;
  border-radius: 0 !important;
  color: var(--nippo-ink) !important;
  background: var(--nippo-paper) !important;
  box-shadow: none !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle svg {
  width: 19px !important;
  height: 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body.nippo-landing-page .nippo-landing-header .nippo-theme-toggle:hover {
  border-color: var(--nippo-ink) !important;
  background: color-mix(in srgb, var(--nippo-ink) 6%, var(--nippo-paper)) !important;
}

html body.nippo-landing-page .nippo-landing-footer {
  box-sizing: border-box !important;
  width: min(100% - 40px, var(--nippo-content-width)) !important;
  margin: 0 auto !important;
  padding: 28px 0 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  border-top: 1px solid var(--nippo-rule) !important;
  color: var(--nippo-muted) !important;
  background: var(--nippo-paper) !important;
  font-size: 11px !important;
}

html body.nippo-landing-page .nippo-landing-footer p { margin: 0 !important; }

html body.nippo-landing-page .nippo-landing-footer nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 10px 16px !important;
}

html body.nippo-landing-page .nippo-landing-footer a {
  color: var(--nippo-ink) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

@media (max-width: 600px) {
  html body.nippo-landing-page .nippo-landing-footer {
    align-items: flex-start !important;
    flex-direction: column !important;
    margin-inline: 20px !important;
    padding: 26px 0 calc(30px + env(safe-area-inset-bottom)) !important;
  }

  html body.nippo-landing-page .nippo-landing-footer nav { justify-content: flex-start !important; }
}

/* Theme changes affect color only; keep the header and hero geometry fixed. */
html body.nippo-landing-page[data-theme] .nippo-landing-header {
  box-sizing: border-box !important;
  width: min(100%, var(--nippo-header-width)) !important;
  max-width: var(--nippo-header-width) !important;
  min-height: calc(82px + env(safe-area-inset-top)) !important;
  padding: env(safe-area-inset-top) 12px 0 !important;
  grid-template-columns: 44px minmax(0, 1fr) auto 42px !important;
}

html body.nippo-landing-page[data-theme] .nippo-landing-header :is(.ckas-back-button, .nippo-theme-toggle) {
  box-sizing: border-box !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border-width: 1px !important;
}

html body.nippo-landing-page[data-theme] .nippo-landing-main {
  box-sizing: border-box !important;
  width: min(100%, var(--nippo-main-width)) !important;
  max-width: var(--nippo-main-width) !important;
}

html body.nippo-landing-page[data-theme] .nippo-hero {
  box-sizing: border-box !important;
  width: 100% !important;
}

@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-landing-header {
    min-height: calc(68px + env(safe-area-inset-top)) !important;
    grid-template-columns: 42px minmax(0, 1fr) 42px !important;
  }
}

@media (max-width: 780px) {
  html body.nippo-landing-page[data-theme] .nippo-landing-header .nippo-theme-toggle {
    grid-column: 3 !important;
  }
}

/* Use the shared cKas app mark for the report landing back-to-home link. */
html body.nippo-landing-page .nippo-landing-header .ckas-home-icon {
  box-sizing: border-box !important;
  width: 42px !important;
  height: 42px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body.nippo-landing-page .nippo-landing-header .ckas-home-icon img {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  object-fit: contain;
}

html body.nippo-landing-page .nippo-hero .nippo-primary::after {
  content: "→";
  margin-inline-start: 24px;
}

/* Mirror the cKas home bar geometry on the report landing page. */
html body.nippo-landing-page[data-theme] .nippo-landing-header {
  box-sizing: border-box !important;
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  max-width: 1180px !important;
  min-height: calc(82px + env(safe-area-inset-top)) !important;
  margin: 0 auto !important;
  padding: env(safe-area-inset-top) 32px 0 !important;
  display: flex !important;
  grid-template-columns: none !important;
  justify-content: space-between !important;
}
@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-landing-header {
    min-height: calc(68px + env(safe-area-inset-top)) !important;
    padding-inline: 20px !important;
  }
}

/* Shared three-slot header and hero proportions from the cKas home page. */
html body.nippo-landing-page[data-theme] .nippo-landing-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  justify-content: normal !important;
}
html body.nippo-landing-page[data-theme] .nippo-header-icon-link {
  grid-column: 1 !important;
  justify-self: start !important;
}
html body.nippo-landing-page[data-theme] .nippo-header-title {
  grid-column: 2 !important;
  justify-self: center !important;
}
html body.nippo-landing-page[data-theme] .nippo-landing-header .nippo-theme-toggle {
  grid-column: 3 !important;
  justify-self: end !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero {
  min-height: 390px !important;
  padding: 38px 42px 36px !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero h1 {
  max-width: 770px !important;
  margin: 24px 0 16px !important;
  font-size: clamp(36px, 5vw, 58px) !important;
  line-height: 1.16 !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero > p:not(.nippo-label) {
  position: absolute !important;
  left: 42px;
  bottom: 36px;
  max-width: 100% !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
}
html body.nippo-landing-page[data-theme] .nippo-actions {
  margin-top: 22px !important;
}
@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-landing-header {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero {
    min-height: 290px !important;
    padding: 28px 22px 26px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero h1 {
    font-size: clamp(34px, 8.8vw, 44px) !important;
  }
}

/* The hero's outlined word labels the daily report section. */
html body.nippo-landing-page .nippo-hero::after {
  content: "REPORT";
  right: 18px;
  bottom: 8px;
  font-size: clamp(60px, 8vw, 110px);
  letter-spacing: -.08em;
  white-space: nowrap;
}
html body.nippo-landing-page[data-theme] .nippo-hero h1 {
  max-width: 600px !important;
  font-size: clamp(36px, 5vw, 58px) !important;
  text-align: left !important;
  white-space: nowrap !important;
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero {
  min-height: 290px !important;
  border: 0 !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero > p:not(.nippo-label) {
  max-width: 720px !important;
  font-size: 14px !important;
}

html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions {
  position: absolute !important;
  left: 38%;
  top: 165px;
  right: auto;
  bottom: auto;
  z-index: 1;
  margin: 0 !important;
}

@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-hero { padding-top: 18px !important; }
}

/* Put the same back control used by the safety reminder beside the cKas mark. */
html body.nippo-landing-page[data-theme] .nippo-landing-header .nippo-landing-header-brand {
  grid-column: 1 !important;
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
html body.nippo-landing-page[data-theme] .nippo-landing-header-brand .global-safety-reminder-back {
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 44px !important;
  margin-left: 8px !important;
  border: 1px solid #dedede !important;
  color: #111 !important;
  background: #fff !important;
  box-shadow: none !important;
}
html body.nippo-landing-page[data-theme="dark"] .nippo-landing-header-brand .global-safety-reminder-back {
  border-color: #111 !important;
  color: #f6f6f6 !important;
  background: #111 !important;
}
html body.nippo-landing-page[data-theme] .nippo-landing-header-brand .global-safety-reminder-back svg {
  width: 23px !important;
  height: 23px !important;
}
html body.nippo-landing-page #nippo-ja > .nippo-content:first-child,
html body.nippo-landing-page #nippo-en > .nippo-content:first-child {
  padding-top: 27px !important;
}
html body.nippo-landing-page #nippo-ja > .nippo-content:first-child h2,
html body.nippo-landing-page #nippo-en > .nippo-content:first-child h2 {
  font-size: clamp(28px, 3.6vw, 38px) !important;
  letter-spacing: -.06em !important;
}
@media (max-width: 600px) {
  html body.nippo-landing-page[data-theme] .nippo-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero h1 { order: 1 !important; }
  html body.nippo-landing-page[data-theme] .nippo-hero > p:not(.nippo-label) {
    order: 2 !important;
    margin: 0 !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions {
    order: 3 !important;
    align-self: flex-start !important;
    margin: 18px 0 0 36px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions a {
    min-height: 42px !important;
    padding-inline: 12px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-primary::after {
    margin-inline-start: 12px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero {
    min-height: 250px !important;
    padding: 28px 22px 26px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero h1 {
    max-width: 370px !important;
    font-size: clamp(34px, 8.8vw, 44px) !important;
  }
  html[lang="en"] body.nippo-landing-page[data-theme] .nippo-hero h1 {
    font-size: clamp(24px, 6.5vw, 30px) !important;
  }
  html body.nippo-landing-page .nippo-hero::after {
    right: 8px;
    bottom: 6px;
    font-size: clamp(32px, 9vw, 50px);
  }
  html body.nippo-landing-page[data-theme] .nippo-hero > p:not(.nippo-label) {
    position: relative !important;
    left: auto;
    bottom: auto;
    max-width: 330px !important;
    font-size: 12px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions {
    position: relative !important;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    align-self: flex-start !important;
    margin: 18px 0 0 36px !important;
  }
}

/* Match the home page's one-pixel dividers and compact top hero inset. */
html body.nippo-landing-page[data-theme] .nippo-landing-header {
  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
}
html body.nippo-landing-page[data-theme] .nippo-hero {
  min-height: 226px !important;
  border-bottom: 1px solid var(--nippo-rule) !important;
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}
@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-hero {
    min-height: 0 !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}

/* Center the report action in the desktop hero and place it just above the
   outlined REPORT label on phone screens. */
@media (min-width: 768px) {
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
}
@media (max-width: 600px) {
  html body.nippo-landing-page[data-theme] .nippo-hero {
    min-height: 202px !important;
  }
  html body.nippo-landing-page[data-theme] .nippo-hero .nippo-actions {
    position: absolute !important;
    top: auto !important;
    right: 8px !important;
    bottom: 56px !important;
    left: auto !important;
    align-self: auto !important;
    margin: 0 !important;
    transform: none !important;
  }
}

/* Keep the return control at the left and the decorative mark with the centered app name. */
.nippo-landing-header > .nippo-header-identity,
body[data-step] .step-top-brand-bar > .nippo-header-identity,
html body .global-safety-reminder .global-safety-reminder-header > .nippo-header-identity {
  grid-column: 2 !important;
  justify-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0;
  white-space: nowrap;
}
.nippo-header-identity > .nippo-header-mark {
  display: block !important;
  width: 34px !important;
  height: 34px !important;
  flex: 0 0 34px !important;
  object-fit: contain !important;
}
.nippo-header-identity > .nippo-header-title,
html body .global-safety-reminder .global-safety-reminder-header .nippo-header-title {
  grid-column: auto !important;
  transform: none !important;
}
@media (max-width: 520px) {
  .nippo-header-identity > .nippo-header-mark { width: 30px !important; height: 30px !important; flex-basis: 30px !important; }
}

/* Match the input/safety header's mobile back position on the report landing page. */
@media (max-width: 767px) {
  html body.nippo-landing-page[data-theme] .nippo-landing-header-brand .global-safety-reminder-back {
    margin-left: calc(max(10px, env(safe-area-inset-left)) - 20px) !important;
  }
}
