/* Japanese break hints, prepared and reviewed during authoring.
   Desktop: hints are hidden and existing author-specified breaks stay unchanged.
   Mobile: hints are opportunities, never mandatory line breaks. */
wbr.jp-break { display: none; }
/* Avoid inheriting legacy rules that style every span as a label or a price. */
.jp-copy.jp-copy, .jp-unit.jp-unit { all: unset; }

@media (max-width: 760px) {
  body {
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
  }
  :is(h1, h2, h3, h4, p, li, dt, dd, summary, a, button, td, th, figcaption, label) {
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
    text-wrap: wrap;
  }
  wbr.jp-break { display: inline; }
  .jp-copy.jp-copy { min-width: 0; max-width: 100%; }
  .jp-unit.jp-unit {
    display: inline-block;
    max-width: 100%;
    vertical-align: baseline;
    word-break: normal;
    overflow-wrap: anywhere;
    line-break: strict;
    text-wrap: wrap;
  }
  /* Outrank responsive-breaks.css's br:not(.br-pc):not(.br-sp) rule. */
  br.jp-pc-break.jp-pc-break.jp-pc-break { display: none !important; }
  /* Allow text columns and labels to shrink inside existing flex/grid layouts. */
  main :is(p, h1, h2, h3, li, a, button) { min-width: 0; }
  .course-card, .course-card__content, .course-card__visual,
  .route-card, .choose-card, .guide-item { min-width: 0; }
  #start-title { font-size: clamp(1.7rem, 7.4vw, 2rem); line-height: 1.5; }
  #question-title, #result-title { font-size: clamp(1.35rem, 5.8vw, 1.65rem); line-height: 1.65; }
}

/* Screening headings keep semantic units intact at desktop widths too. */
:is(#start-title, #question-title, #result-title) .jp-unit.jp-unit {
  display: inline-block;
  max-width: 100%;
}
:is(#start-title, #question-title, #result-title) wbr.jp-break { display: inline; }

#start-title .jp-unit.jp-unit { white-space: nowrap; }

/* Short two-color headings stay on one line when they fit. */
em.heading-color-phrase { display:inline-block; max-width:100%; vertical-align:baseline; }
