/* TU media availability icons / lead notice.
   No font-family here (inherit from body).
   Explicit sizes to override site-wide img width rules. */

/* List cards: icons next to the category label */
.topview__article__media-icons {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  margin-right: 8px;
  vertical-align: middle;
  flex: none;
}
.topview__article__media-icons .tu-media-icon {
  width: 18px !important;
  height: 18px !important;
  max-width: none;
  display: inline-block;
  vertical-align: middle;
}

/* Article page: lead notice */
.tu-media-notice {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 1em;
  font-size: 15px;
  color: #14244D;
}
.tu-media-notice a {
  color: #14244D;
  text-decoration: underline;
}
.tu-media-notice .tu-media-icon {
  width: 16px !important;
  height: 16px !important;
  max-width: none;
}

/* Audio Articles list page */
.tu-audio-list__lead {
  margin: 0 0 1.5em;
  font-size: 15px;
}
.tu-audio-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid #e0e0e0;
}
.tu-audio-list__meta {
  min-width: 0;
}
.tu-audio-list__title {
  display: block;
  font-size: 16px;
  color: #14244D;
  text-decoration: none;
}
.tu-audio-list__title:hover {
  text-decoration: underline;
}
.tu-audio-list__date {
  font-size: 13px;
  color: #666;
}
.tu-audio-list__player {
  flex: none;
  width: 300px;
  max-width: 45%;
}
/* SP: list rows like TOP "Most Read Articles" (thumb 119x64 left,
   title/date right, player full width below) */
@media (max-width: 575px) {
  .tu-audio-list__item {
    display: grid;
    grid-template-columns: 119px 1fr;
    column-gap: 12px;
    row-gap: 10px;
    align-items: start;
  }
  .tu-audio-list__title {
    font-size: 15px;
    line-height: 1.4;
  }
  .tu-audio-list__player {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
  }
}

/* Audio Articles list: thumbnail */
.tu-audio-list__thumb {
  flex: none;
  width: 160px;
}
.tu-audio-list__thumb img {
  width: 100%;
  height: auto;
  display: block;
}
.tu-audio-list__meta {
  flex: 1;
}
@media (max-width: 575px) {
  .tu-audio-list__thumb {
    width: 119px;
    height: 64px;
    overflow: hidden;
  }
  .tu-audio-list__thumb img {
    height: 100%;
    object-fit: cover;
  }
}

/* Header nav: AUDIO entry (link to /en/audio/).
   Separated from the category items by a left rule so readers do not
   read it as a fifth article category. Icon inherits the link color. */
.tu-audio-nav__link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.tu-audio-nav__link .tu-audio-nav__icon {
  width: 15px !important;
  height: 15px !important;
  max-width: none;
  flex: none;
}
.global__nav .tu-audio-nav {
  margin-left: 6px;
  padding-left: 14px;
  border-left: 1px solid rgba(20, 36, 77, 0.25);
}
.drawer__menu__main .tu-audio-nav {
  border-left: none;
  margin-left: 0;
  padding-left: 0;
}

/* Audio Articles entry buttons (link to /en/audio/).
   TOP: next to the Archives button. Article: right under the audio player. */
.latest__articles__nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}
.latest__articles__nav .btn--default.btn--large {
  min-width: 150px;
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 768px) {
  .latest__articles__nav {
    gap: 16px;
  }
  .latest__articles__nav .btn--default.btn--large {
    min-width: 200px;
  }
}
.tu-audio-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.tu-audio-more-btn svg,
.tu-audio-more svg {
  width: 16px !important;
  height: 16px !important;
  max-width: none;
  flex: none;
}
.article__body .audio-block .tu-audio-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 300px;
  max-width: 100%;
  margin: 8px 0 0;
  padding: 9px 16px;
  border-radius: 999px;
  background: #eef0f4;
  color: #14244D;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}
.article__body .audio-block .tu-audio-more:hover {
  background: #e0e4ec;
  color: #14244D;
  opacity: 1;
  text-decoration: none;
}

/* >>> tu-audio-dock */
/* Sticky audio dock (module: article sticky audio player) */
:root{--tu-dock-h:52px}
.tu-audio-dock{position:fixed;left:0;right:0;bottom:0;z-index:1000;background:#14244D;color:#fff;box-shadow:0 -4px 16px rgba(0,0,0,.2);padding-bottom:env(safe-area-inset-bottom);transform:translateY(100%);opacity:0;visibility:hidden;transition:transform .3s ease,opacity .3s ease,visibility 0s linear .3s}
.tu-audio-dock.is-on{transform:none;opacity:1;visibility:visible;transition:transform .3s ease,opacity .3s ease,visibility 0s}
.tu-audio-dock[hidden]{display:none}
.tu-audio-dock__inner{display:flex;align-items:center;gap:12px;max-width:1140px;height:var(--tu-dock-h);margin:0 auto;padding:0 15px}
.tu-audio-dock button{display:inline-flex;align-items:center;justify-content:center;margin:0;padding:0;border:0;background:none;color:#fff;font:inherit;line-height:1;cursor:pointer}
.tu-audio-dock__play{flex:none;width:36px;height:36px}
.tu-audio-dock__play svg{width:30px;height:30px}
.tu-audio-dock__time{flex:none;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.tu-audio-dock__seek{flex:1 1 auto;min-width:60px;height:24px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}
.tu-audio-dock__seek::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(to right,#fff var(--tu-dock-progress,0%),rgba(255,255,255,.3) var(--tu-dock-progress,0%))}
.tu-audio-dock__seek::-webkit-slider-thumb{width:14px;height:14px;margin-top:-5px;border-radius:50%;background:#fff;-webkit-appearance:none;appearance:none}
.tu-audio-dock__seek::-moz-range-track{height:4px;border-radius:2px;background:rgba(255,255,255,.3)}
.tu-audio-dock__seek::-moz-range-progress{height:4px;border-radius:2px;background:#fff}
.tu-audio-dock__seek::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff}
.tu-audio-dock .tu-audio-dock__speed{flex:none;min-width:48px;height:28px;padding:0 8px;border:1px solid rgba(255,255,255,.6);border-radius:999px;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.tu-audio-dock .tu-audio-dock__speed:hover{background:rgba(255,255,255,.12)}
.tu-audio-dock__close{flex:none;width:32px;height:32px;border-radius:50%}
.tu-audio-dock__close:hover{background:rgba(255,255,255,.12)}
.tu-audio-dock button:focus-visible,.tu-audio-dock__seek:focus-visible{outline:3px solid #D1A617;outline-offset:2px}
body,.subscribe__pop,#page_top{transition:padding-bottom .3s ease,transform .3s ease}
html.tu-audio-dock-on body{padding-bottom:calc(var(--tu-dock-h) + env(safe-area-inset-bottom))}
html.tu-audio-dock-on .subscribe__pop,html.tu-audio-dock-on #page_top{transform:translateY(calc(0px - var(--tu-dock-h) - env(safe-area-inset-bottom)))}
.tu-audio-dock__seek:disabled{opacity:.4;cursor:default}
/* Hide the dock while the SP drawer menu is open */
.drawer-open .tu-audio-dock.is-on{transform:translateY(100%);opacity:0;visibility:hidden;transition:transform .3s ease,opacity .3s ease,visibility 0s linear .3s}
/* PC: keep the page-top button behind the dock */
@media (min-width:1200px){
  .tu-audio-dock{z-index:1000000}
}
/* SP: seek bar on its own full-width row */
@media (max-width:575px){
  :root{--tu-dock-h:84px}
  .tu-audio-dock__inner{flex-wrap:wrap;align-content:center;gap:2px 8px;padding:0 12px}
  .tu-audio-dock__seek{order:-1;flex:1 0 100%;height:28px}
  .tu-audio-dock__time{font-size:13px}
  .tu-audio-dock .tu-audio-dock__speed{margin-left:auto}
}
@media (prefers-reduced-motion:reduce){
  .tu-audio-dock,.tu-audio-dock.is-on,body,.subscribe__pop,#page_top{transition:none}
}
/* <<< tu-audio-dock */