/* TMT-Media production stylesheet — Stage 28.0 */

/* Source owner: tmt-clean-portfolio.css */
/* Clean Portfolio / single-player presentation. Runtime hooks remain in tmt-single-player.js. */
.tmt-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.tmt-portfolio,.tmt-portfolio .container,#tmt-single-player{overflow:visible}
#tmt-single-player{--tmt-cover-size:340px;--tmt-row-size:16px;max-width:100%}
#tmt-single-player .tmt-player__panel{position:relative;padding:35px;border:1px solid rgba(0,0,0,.06);border-radius:12px;background:var(--tmt-panel-grad);box-shadow:0 4px 10px rgba(0,0,0,.08);transition:transform .2s ease,box-shadow .2s ease}
@media (hover:hover){#tmt-single-player .tmt-player__panel:hover{transform:translateY(-5px);box-shadow:0 10px 24px rgba(0,0,0,.14)}}
#tmt-single-player .tmt-two-col{display:grid;grid-template-columns:var(--tmt-cover-size) minmax(0,1fr);grid-template-areas:"cover playlist" "caption .";grid-template-rows:var(--tmt-cover-size) auto;column-gap:1.25rem;row-gap:.5rem}
#tmt-single-player .tmt-cover{grid-area:cover;width:var(--tmt-cover-size);height:var(--tmt-cover-size)}
#tmt-single-player .tmt-cover img{display:block;width:100%;height:100%;object-fit:contain;border-radius:12px}
#tmt-single-player .tmt-cover-caption{grid-area:caption;margin:0;padding:0 .25rem;overflow:hidden;white-space:nowrap;text-align:center;text-overflow:ellipsis;font-size:1rem}
#tmt-single-player .tmt-playlist-wrap{grid-area:playlist;display:block;height:var(--tmt-cover-size);max-height:var(--tmt-cover-size);overflow:auto;scrollbar-width:thin;scrollbar-color:var(--text,#111) transparent}
#tmt-single-player .tmt-playlist-wrap::-webkit-scrollbar{width:10px}
#tmt-single-player .tmt-playlist-wrap::-webkit-scrollbar-track{background:transparent}
#tmt-single-player .tmt-playlist-wrap::-webkit-scrollbar-thumb{border-radius:6px;background:var(--text,#111)}
#tmtPlaylist{margin:0;padding:0;list-style:none}
#tmtPlaylist .tmt-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:.6rem .5rem .6rem .9rem;border-radius:8px;cursor:pointer}
#tmtPlaylist .tmt-item:focus-visible{outline:2px solid currentColor;outline-offset:-2px}
#tmtPlaylist .tmt-title{display:block;min-width:0;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;overflow-wrap:normal;hyphens:none;text-align:left}
#tmtPlaylist .tmt-title .artist,#tmtPlaylist .tmt-title .song{display:inline;white-space:inherit}
#tmtPlaylist .tmt-duration{padding-left:.75rem;opacity:.9;font-variant-numeric:tabular-nums}
#tmtPlaylist .tmt-thumb{display:none;width:40px;height:40px;border-radius:6px;object-fit:cover;background:rgba(0,0,0,.06)}
#tmtPlaylist .tmt-item[aria-selected="true"]{background:linear-gradient(90deg,rgba(0,0,0,.06),rgba(0,0,0,.03))}
#tmtPlaylist .tmt-item[aria-selected="true"]::before{content:"";position:absolute;inset:6px auto 6px 0;width:6px;border-radius:0 6px 6px 0;background:var(--text,#111)}
#tmt-single-player .tmt-wave-wrap{position:relative;margin-top:1rem}
#tmtWave{display:block;box-sizing:content-box;width:100%;height:96px;padding:0;border:0;background:transparent;cursor:pointer}
#tmt-single-player .tmt-bar-wrap{display:none;margin-top:.6rem}
#tmt-single-player .tmt-bar-wrap input[type="range"]{width:100%;height:6px;margin:0;padding:0;border-radius:999px;appearance:none;background:rgba(127,127,127,.24)}
#tmt-single-player .tmt-bar-wrap input[type="range"]::-webkit-slider-thumb{width:14px;height:14px;margin-top:-4px;border:2px solid var(--section-bg,#fff);border-radius:50%;appearance:none;background:var(--text,#111);box-shadow:0 1px 2px rgba(0,0,0,.25)}
#tmt-single-player .tmt-bar-wrap input[type="range"]::-moz-range-track{height:6px;border-radius:999px;background:rgba(127,127,127,.24)}
#tmt-single-player .tmt-bar-wrap input[type="range"]::-moz-range-thumb{width:14px;height:14px;border:2px solid var(--section-bg,#fff);border-radius:50%;background:var(--text,#111);box-shadow:0 1px 2px rgba(0,0,0,.25)}
#tmt-single-player .tmt-transport{display:flex;align-items:center;justify-content:center;gap:.55rem;margin-top:.6rem}
#tmt-single-player .tmt-transport button{display:inline-grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:999px;background:transparent;color:inherit;line-height:0;cursor:pointer}
#tmt-single-player .tmt-transport button:focus-visible{outline:0;box-shadow:0 0 0 2px var(--section-bg,#fff),0 0 0 4px currentColor}
#tmt-single-player .tmt-transport .icon{display:block;width:28px;height:28px;pointer-events:none}
#tmt-single-player .tmt-transport .play .icon{width:36px;height:36px}
#tmt-single-player #shuffleBtn .icon,#tmt-single-player #loopBtn .icon{width:22px;height:22px;color:var(--muted,#6b7280);transition:color .15s ease}
#tmt-single-player #shuffleBtn[aria-pressed="true"] .icon,#tmt-single-player #loopBtn[aria-pressed="true"] .icon{color:var(--text,#111)}
#tmt-single-player .tmt-time{margin-top:.25rem;text-align:center;opacity:.9;font-variant-numeric:tabular-nums}


/* Single-player information control. Component-owned copy of the approved Dual Player dock finish. */
#tmt-single-player .tmt-single-info {
  position:absolute;
  right:1.25rem;
  bottom:1.25rem;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
}

#tmt-single-player .tmt-single-info__button {
  appearance:none;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  padding:0;
  border:0;
  border-radius:999px;
  background:linear-gradient(180deg,#ffffff 0%,#f4f2ee 48%,#e5e2dc 100%);
  box-shadow:
    inset 0 2px 5px rgba(255,255,255,.90),
    inset 0 -4px 8px rgba(0,0,0,.08),
    0 7px 18px rgba(0,0,0,.26);
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  font-family:var(--tmt-font-sans);
  font-size:13px;
  font-weight:600;
  line-height:1;
  cursor:pointer;
  transform:none;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease;
}

#tmt-single-player .tmt-single-info__button:hover,
#tmt-single-player .tmt-single-info__button:focus-visible {
  background:linear-gradient(180deg,#1b1b1b 0%,#161616 45%,#111111 100%);
  box-shadow:
    inset 0 1px 3px rgba(255,255,255,.07),
    inset 0 -4px 8px rgba(0,0,0,.34),
    0 7px 18px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,255,255,.07);
  color:#f7f3ea !important;
  -webkit-text-fill-color:#f7f3ea !important;
  outline:0;
}

html[data-tmt-theme="dark"] #tmt-single-player .tmt-single-info__button {
  background:linear-gradient(180deg,#1b1b1b 0%,#161616 45%,#111111 100%);
  box-shadow:
    inset 0 1px 3px rgba(255,255,255,.07),
    inset 0 -4px 8px rgba(0,0,0,.34),
    0 7px 18px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,255,255,.07);
  color:#f7f3ea !important;
  -webkit-text-fill-color:#f7f3ea !important;
}

html[data-tmt-theme="dark"] #tmt-single-player .tmt-single-info__button:hover,
html[data-tmt-theme="dark"] #tmt-single-player .tmt-single-info__button:focus-visible {
  background:linear-gradient(180deg,#ffffff 0%,#f4f2ee 48%,#e5e2dc 100%);
  box-shadow:
    inset 0 2px 5px rgba(255,255,255,.90),
    inset 0 -4px 8px rgba(0,0,0,.08),
    0 7px 18px rgba(0,0,0,.26);
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
}

#tmt-single-player .tmt-single-info__button:active { transform:none; }

#tmt-single-player .tmt-single-info__box {
  position:absolute;
  right:36px;
  bottom:36px;
  z-index:20;
  box-sizing:border-box;
  min-width:260px;
  max-width:min(420px,90vw);
  padding:.9rem 1rem;
  border:0;
  border-radius:10px;
  background:linear-gradient(180deg,#1b1b1b 0%,#161616 45%,#111111 100%);
  box-shadow:
    inset 0 1px 3px rgba(255,255,255,.05),
    inset 0 -4px 8px rgba(0,0,0,.30),
    0 12px 26px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,255,255,.06);
  color:#f7f3ea !important;
  -webkit-text-fill-color:#f7f3ea !important;
  font-family:var(--tmt-font-sans);
  font-size:.85rem;
  font-weight:400;
  line-height:1.5;
  opacity:0;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .15s ease,transform .15s ease;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:normal;
}


#tmt-single-player .tmt-single-info:hover .tmt-single-info__box,
#tmt-single-player .tmt-single-info__box.is-visible {
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}

#tmt-single-player .tmt-single-info__title {
  margin:0 0 .45rem;
  font-size:.95rem;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.01em;
}

#tmt-single-player .tmt-single-info__body { margin:0 0 .55rem; }

#tmt-single-player .tmt-single-info__subtitle {
  margin:.5rem 0 .3rem;
  font-size:.88rem;
  font-weight:650;
  line-height:1.5;
  letter-spacing:.01em;
}

#tmt-single-player .tmt-single-info__list {
  margin:0;
  padding:0;
  list-style:none;
}

#tmt-single-player .tmt-single-info__list li { margin:.15rem 0;line-height:1.45; }
#tmt-single-player .tmt-single-info__keys { font-family:var(--tmt-font-sans);font-variant-numeric:tabular-nums;font-weight:600;opacity:.95; }
#tmt-single-player .tmt-single-info__separator { margin:0 .25rem 0 .15rem; }
#tmt-single-player .tmt-single-info__description { opacity:.9; }

@media (max-width:700px) {
  #tmt-single-player .tmt-single-info { right:1rem;bottom:1rem; }
  #tmt-single-player .tmt-single-info__box {
    position:fixed;
    right:1rem;
    bottom:4.5rem;
    left:1rem;
    min-width:0;
    max-width:none;
    font-size:.8rem;
    line-height:1.4;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion:reduce) {
  #tmt-single-player .tmt-single-info__button,
  #tmt-single-player .tmt-single-info__box { transition:none; }
}

@media (max-width:900px){
  #tmt-single-player .tmt-player__panel{padding:.9rem .9rem .7rem}
  #tmt-single-player .tmt-two-col{grid-template-columns:1fr;grid-template-areas:"cover" "caption" "playlist";grid-template-rows:auto auto auto;gap:.35rem}
  #tmt-single-player .tmt-cover{width:min(100%,360px);height:auto;aspect-ratio:1;margin:0 auto}
  #tmt-single-player .tmt-cover img{width:100%;height:100%;max-width:100%;border-radius:10px}
  #tmt-single-player .tmt-cover-caption{margin:0 0 .2rem}
  #tmt-single-player .tmt-playlist-wrap{position:relative;height:156px;min-height:156px;max-height:156px;padding:0;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth}
  #tmtPlaylist .tmt-thumb{display:none}
  #tmtPlaylist .tmt-item{grid-template-columns:minmax(0,1fr) auto;gap:.75rem;height:52px;min-height:52px;margin:0;padding:.45rem .55rem .45rem .7rem;box-sizing:border-box}
  #tmtPlaylist .tmt-title,#tmtPlaylist .tmt-duration{font-size:var(--tmt-row-size);line-height:1.2}
  #tmtPlaylist .tmt-duration{justify-self:end;text-align:right}
}
@media (max-width:700px) and (orientation:portrait){
  #tmt-single-player .tmt-player__panel{width:100%;max-width:100%;padding:1rem .75rem .75rem;box-sizing:border-box}
  #tmt-single-player .tmt-two-col{display:grid;grid-template-columns:1fr;grid-template-areas:"cover" "caption" "playlist";grid-template-rows:auto auto auto;gap:.35rem}
  #tmt-single-player #tmtWave{display:none}
  #tmt-single-player .tmt-bar-wrap{display:block}


}

/* Stage 28.14.0: keep the player information control 35 px from the lower-right card edges. */
#tmt-single-player .tmt-single-info {
  right: 35px;
  bottom: 35px;
}

@media (max-width: 700px) {
  #tmt-single-player .tmt-single-info {
    right: 35px;
    bottom: 35px;
  }
}