/* BENLY-only modes. Existing common/dawn/WORKS/LIBRARY styles are untouched. */
body[data-page="benly"] .benly-page [hidden] { display: none !important; }
body[data-page="benly"] .benly-overview,
body[data-page="benly"] .benly-overview.has-image {
  display: grid;
  grid-template-columns: minmax(0, 65%) minmax(0, 35%);
  align-items: start;
  min-height: 0;
}
body[data-page="benly"] .benly-overview::after { content: none; }
body[data-page="benly"] .benly-overview .benly-overview-copy {
  grid-column: 1; grid-row: 1; padding-right: 1rem;
  min-height: 0;
}
/* 図鑑・ランダムでは系譜の切替用に確保している高さを使わない。 */
body[data-page="benly"] .benly-overview[data-benly-mode="catalog"] .benly-overview-copy,
body[data-page="benly"] .benly-overview[data-benly-mode="random"] .benly-overview-copy {
  min-height: 0;
}
body[data-page="benly"] .benly-overview-side { grid-column: 2; grid-row: 1; min-width: 0; }
body[data-page="benly"] .benly-overview .benly-overview-figure,
body[data-page="benly"] .benly-overview .benly-overview-figure[hidden] {
  display: block !important; position: relative; top: auto; margin: 0;
  width: 100%; height: 236px;
}
body[data-page="benly"] .benly-overview .benly-overview-figure[hidden] { visibility: hidden; }
body[data-page="benly"] .benly-overview-figure img { height: 100%; }
body[data-page="benly"] .benly-overview[data-benly-mode="catalog"] .benly-overview-figure,
body[data-page="benly"] .benly-overview[data-benly-mode="random"] .benly-overview-figure {
  display: none !important;
}
.benly-lineage-intro {
  display: grid;
  grid-template-columns: minmax(0, 45%) minmax(0, 55%);
  align-items: stretch;
  gap: clamp(1rem, 2.5vw, 1.7rem);
  margin: .35rem 0 1.1rem;
}
.benly-lineage-intro-figure {
  min-height: 178px;
  margin: 0;
  overflow: hidden;
  border: 8px solid #e8e8e3;
  outline: 1px solid #303432;
  background: #111;
  box-shadow:
    inset 0 0 0 1px #bfc2bf,
    0 3px 3px rgba(18, 22, 20, .24),
    0 8px 12px rgba(18, 22, 20, .3);
}
.benly-lineage-intro-figure[hidden] { display: block; visibility: hidden; }
.benly-lineage-intro-figure img { display: block; width: 100%; height: 100%; object-fit: cover; }
.benly-lineage-intro-copy {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  min-width: 0;
  padding: clamp(.45rem, 1vw, .65rem);
  background: rgba(255, 255, 255, .58);
}
.benly-lineage-intro-copy h2 {
  margin: 0 0 .3rem;
  color: #17231f;
  font-size: 1.25rem;
  line-height: 1.25;
  letter-spacing: .025em;
}
.benly-lineage-intro-body { font-size: 1.04rem; line-height: 1.55; }
.benly-lineage-intro-body p { margin: 0 0 .55rem; }
.benly-lineage-intro-body p:last-child { margin-bottom: 0; }
.benly-mode-switch { position: relative; width: min(100%, 189px); height: 121px; margin: 0 0 .7rem auto; }
.benly-mode-rotor { position: absolute; inset: 0 auto auto 0; width: 126px; border: 0; padding: 0; background: none; cursor: pointer; animation: benly-rotor-hint 4.8s ease-in-out infinite; }
.benly-mode-rotor img { display: block; width: 100%; height: auto; transform-origin: 50% 43%; transform: rotate(var(--benly-mode-angle, 0deg)); transition: transform 340ms cubic-bezier(.22,.8,.32,1.08); }
.benly-mode-labels { position: absolute; width: 59px; height: auto; left: 130px; top: 0; pointer-events: none; }
.benly-mode-labels--active { --benly-label-clip-top: 35.29%; --benly-label-clip-bottom: 36.13%; clip-path: inset(var(--benly-label-clip-top) 0 var(--benly-label-clip-bottom) 0); }
.benly-mode-labels--active.is-entering { animation: benly-mode-label-wipe 440ms cubic-bezier(.18,.78,.24,1); }
@keyframes benly-mode-label-wipe {
  from { clip-path: inset(var(--benly-label-clip-top) 0 var(--benly-label-clip-bottom) 100%); }
  to { clip-path: inset(var(--benly-label-clip-top) 0 var(--benly-label-clip-bottom) 0); }
}
.benly-mode-switch[data-mode="random"] .benly-mode-labels--active { --benly-label-clip-top: 0; --benly-label-clip-bottom: 72.27%; }
.benly-mode-switch[data-mode="catalog"] .benly-mode-labels--active { --benly-label-clip-top: 71.43%; --benly-label-clip-bottom: 0; }
.benly-mode-label { position: absolute; left: 130px; width: 59px; padding: 0; border: 0; border-radius: 5px; background: transparent; cursor: pointer; }
.benly-mode-label--random { top: 0; height: 30px; }
.benly-mode-label--lineage { top: 38px; height: 31px; }
.benly-mode-label--catalog { top: 77px; height: 31px; }
.benly-mode-label:focus-visible, .benly-mode-rotor:focus-visible { outline: 3px solid #2f6182; outline-offset: 4px; }
@keyframes benly-rotor-hint {
  0%, 84%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  88% { transform: translate3d(2px, -1px, 0) rotate(1deg); }
  92% { transform: translate3d(-1px, 0, 0) rotate(-.5deg); }
}
@media (hover: hover) and (pointer: fine) {
  .benly-mode-rotor:hover { animation: benly-rotor-hover 560ms cubic-bezier(.22,.8,.32,1.08); }
}
@keyframes benly-rotor-hover {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  45% { transform: translate3d(3px, -2px, 0) scale(1.035); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}
body[data-page="benly"] .benly-model-node { box-sizing: border-box; width: 140px; height: 141px; min-height: 0; padding: 0; overflow: hidden; }
body[data-page="benly"] .benly-model-node-media { position: absolute; display: block; inset: 0 0 auto; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #d7dcda; margin: 0; }
body[data-page="benly"] .benly-model-node-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
body[data-page="benly"] .benly-model-node-info { position: absolute; inset: auto 0 0; display: block; height: 61px; padding: 5px 6px; box-sizing: border-box; text-align: center; }
body[data-page="benly"] .benly-model-node-info strong { display: block; margin: 0; font-size: 18px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body[data-page="benly"] .benly-model-node-info small { display: flex; justify-content: center; gap: 5px; margin: 1px -6px 0; padding: 3px 6px 0; border-top: 1px solid #59615f; font-size: 15px; line-height: 1.35; white-space: nowrap; }
.benly-model-name { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.benly-model-year { flex-shrink: 0; }
.benly-overview-heading-row { display: flex; align-items: center; flex-wrap: wrap; gap: .85rem; width: calc(153.846% - 195px); }
.benly-series-form { display: flex; flex-wrap: nowrap; align-items: center; gap: .45rem; margin: 0; }
.benly-series-form select { max-width: 100%; min-width: 120px; height: 2.15rem; padding: 0 .45rem; font: inherit; }
.benly-series-form button, .benly-shuffle button { height: 2.15rem; font: inherit; line-height: 1; padding: 0 .75rem; cursor: pointer; }
.benly-catalog-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 26px 18px; }
.benly-catalog-card { display: flex; flex-direction: column; min-width: 0; color: #18242c; text-decoration: none; }
.benly-catalog-photo { width: 100%; aspect-ratio: 3 / 4; display: grid; place-items: center; background: #000; border: 1px solid #66757d; overflow: hidden; color: #fff; }
.benly-catalog-photo img { width: 100%; height: 100%; object-fit: contain; transition: opacity .16s ease; }
.benly-catalog-card:hover img { opacity: .9; }
.benly-catalog-copy { display: flex; align-items: baseline; gap: .45rem; min-width: 0; margin-top: .5rem; }
.benly-catalog-card strong { margin: 0; font-size: 1.15rem; overflow-wrap: anywhere; }
.benly-catalog-card small { font-size: 1rem; }
.benly-catalog-card:focus-visible { outline: 2px solid #4d7695; outline-offset: 5px; }
.benly-catalog-pagination { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .4rem; margin: .25rem 0 1.5rem; }
.benly-catalog-pagination button { min-width: 2.2rem; height: 2.2rem; padding: 0 .55rem; border: 1px solid #6f7873; background: #f2f3f0; color: #18242c; cursor: pointer; }
.benly-catalog-pagination button:not(:disabled):hover { background: #d9ddda; }
.benly-catalog-pagination button[aria-current="page"] { color: #fff; background: #111; border-color: #111; font-weight: 700; }
.benly-catalog-pagination button[aria-current="page"]:disabled { opacity: 1; }
.benly-catalog-pagination button:disabled { cursor: default; opacity: .72; }
.benly-catalog-page-gap { min-width: 1.3rem; text-align: center; }
.benly-shuffle { text-align: left; margin: 0; }
#benlyRandomContent { min-width: 0; transition: opacity .15s ease; }
#benlyRandomContent[aria-busy="true"] { opacity: .5; }
#benlyRandomContent .benly-detail-page { width: 100%; margin: 0; }
@media (max-width: 1024px) { .benly-catalog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 767px) {
  body[data-page="benly"] .benly-overview,
  body[data-page="benly"] .benly-overview.has-image { grid-template-columns: minmax(0,1fr); }
  body[data-page="benly"] .benly-overview .benly-overview-copy { grid-column: 1; grid-row: 1; padding: 0; }
  body[data-page="benly"] .benly-overview-side { grid-column: 1; grid-row: 2; }
  body[data-page="benly"] .benly-overview .benly-overview-figure,
  body[data-page="benly"] .benly-overview .benly-overview-figure[hidden] { height: 160px; }
  .benly-overview-heading-row { width: 100%; gap: .7rem; }
  .benly-mode-switch { width: 189px; margin: .6rem auto; }
  .benly-lineage-intro { grid-template-columns: minmax(0, 1fr); gap: .75rem; margin-top: .5rem; }
  .benly-lineage-intro-figure { min-height: 0; aspect-ratio: 16 / 9; }
  .benly-lineage-intro-copy { padding: .6rem .7rem; }
  .benly-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px 12px; }

  /* SP: the same live switch sits left of the BENLY subheader artwork. */
  body[data-page="benly"].has-benly-switch-in-subheader .benly-overview-side { display:none; }
  html.js body.is-ready[data-page="benly"][data-theme="dawn"] .dawn-subheader-day {
    pointer-events:auto;
  }
  body[data-page="benly"] .dawn-subheader-day .subheader-inner > .benly-mode-switch {
    position:absolute;
    z-index:100;
    top:calc(45% - 36px);
    left:0;
    width:189px;
    height:121px;
    margin:0;
    pointer-events:auto;
    transform:scale(.88);
    transform-origin:top left;
  }
}
@media (max-width:350px) {
  body[data-page="benly"] .dawn-subheader-day .subheader-inner > .benly-mode-switch {
    left:0;
    transform:scale(.74);
  }
}
@media (prefers-reduced-motion: reduce) { .benly-mode-rotor, .benly-mode-rotor img, #benlyRandomContent { animation: none; transition: none; } .benly-mode-labels--active.is-entering { animation: none; } }