/* Home: a direct About entrance below the portrait on small screens. */
.mobile-profile-entry { display:none; }
@media (max-width:720px) {
  :root { --stage-size:580px; }
  body .stage .profile-entry { display:none; }
  body .hero-track { height:var(--stage-size); }
  body .wordmark { font-size:clamp(44px,13.5vw,84px); letter-spacing:-.04em; }
  .mobile-profile-entry {
    position:relative; display:grid; grid-template-columns:44px minmax(0,1fr) 32px;
    align-items:center; gap:12px; margin:16px 0 20px; padding:12px 14px;
    min-height:76px; border:1px solid #c3b3d3; border-radius:14px;
    background:#faf6ff; color:#241c32;
    box-shadow:0 3px 0 #d7cde2;
    transition:translate 160ms var(--ease),box-shadow 160ms var(--ease);
  }
  .mobile-profile-entry img { width:44px; height:52px; object-fit:cover; object-position:50% 24%; border-radius:7px; }
  .mobile-profile-copy { min-width:0; }
  .mobile-profile-entry strong { display:block; font:500 19px/1.4 Mitr,Anuphan,sans-serif; }
  .mobile-profile-entry small { display:block; margin-top:3px; font:400 14px/1.5 Anuphan,sans-serif; color:#564760; }
  .mobile-profile-arrow { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#241c32; color:#fff; font-size:22px; }
  .mobile-profile-entry:focus-visible { outline:3px solid #705294; outline-offset:4px; }
  .mobile-profile-entry:active { translate:0 2px; box-shadow:0 1px 0 #d7cde2; }
  html[data-theme=dark] .mobile-profile-entry { background:#171627; color:#f5efff; border-color:#786286; box-shadow:0 3px 0 #4c3d60; }
  html[data-theme=dark] .mobile-profile-entry small { color:#c9bfd5; }
  html[data-theme=dark] .mobile-profile-arrow { background:#e2c98f; color:#142032; }
  html[data-theme=dark] .mobile-profile-entry:focus-visible { outline-color:#e2c98f; }
  html[data-theme=dark] .mobile-profile-entry:active { box-shadow:0 1px 0 #4c3d60; }
  body .shelf-deepdives-grid { grid-template-columns:minmax(0,1fr); }
  .deepdive-card, .deepdive-brand { min-width:0; }
  .deepdive-primary-btn { min-height:44px; min-width:0; white-space:normal; text-align:center; }
  .series-pills { flex-wrap:wrap; }
  .series-ep-btn { min-width:44px; min-height:44px; }
}
@media (max-width:360px) {
  :root { --stage-size:550px; }
}
/* Two-column tablet cards also need actions to wrap inside their own card. */
@media (min-width:721px) and (max-width:960px) {
  body .shelf-deepdives-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .deepdive-card, .deepdive-brand { min-width:0; }
  .deepdive-primary-btn { min-width:0; min-height:44px; white-space:normal; text-align:center; }
  .deepdive-card-bottom { flex-direction:column; align-items:stretch; }
  .series-pills { flex-wrap:wrap; }
  .series-ep-btn { min-width:44px; min-height:44px; }
}
/* Touch can leave hover latched; the large character is a desktop pointer detail. */
@media (hover:none), (pointer:coarse) {
  .profile-entry .chrollo-ghost-backdrop { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .mobile-profile-entry { transition:none; }
  .mobile-profile-entry:active { translate:none; }
}
body.paused .mobile-profile-entry { transition:none; }
body.paused .mobile-profile-entry:active { translate:none; }
