/* station hero: phone only — cover + title + play, not the whole page */
.stn-hero{display:block;width:100%;margin:0}
.stn-hero .cover,.stn-hero img,.stn .stn-art{display:block}

@media (max-width: 980px) {
  .stn-hero,
  .stn > .cover:first-child,
  .stn > .stn-art {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 8px auto 14px !important;
  }
  .stn-hero .cover,
  .stn-hero img,
  .stn > .cover:first-child,
  .stn .stn-art {
    width: min(72vw, 280px) !important;
    height: min(72vw, 280px) !important;
    max-width: 280px !important;
    margin: 0 auto !important;
    border-radius: 6px;
    object-fit: cover;
  }
  .stn > h1,
  .stn .stn-title,
  .stn > .stn-sub,
  .stn > #stnPlay,
  .stn > .stn-play {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .stn > h1, .stn .stn-title { font-size: 24px !important; margin: 8px auto 6px !important; }
  .stn > .stn-sub { color: #8b95a8; font-size: 13px; }
  #stnPlay, .stn-play {
    display: flex !important;
    align-items: center; justify-content: center; gap: 8px;
    width: min(88%, 360px);
    height: 52px; margin: 18px auto 12px;
    border: 0; border-radius: 999px;
    background: #fff !important; color: #111 !important;
    font-weight: 700; font-size: 16px;
  }
  /* everything after play stays left, Moodby-style */
  .stn .stn-tags, .stn .stn-desc, .stn p, .stn .tag-btn,
  .stn .stn-meta, .stn .stn-actions { text-align: left !important; }
}








.mood-head{display:flex;align-items:center;gap:8px;margin:0 0 18px;min-height:44px}
.mood-head b{flex:1;text-align:center;font-size:18px;font-weight:700}
.mood-back{width:40px;height:40px;border:0;background:none;color:#fff;font-size:22px;cursor:pointer}
/* inside the app the top bar already has Back */
#main .mood-head .mood-back,#main .mood-head>span{display:none}
.prof-cam svg{width:14px;height:14px}
.prof-hero{display:flex;align-items:center;gap:14px;padding:8px 4px 20px}
.prof-av{position:relative;width:72px;height:72px;border-radius:50%;background:#3d9a4a;display:grid;place-items:center;font-size:28px;font-weight:700;color:#fff;flex:none}
/* the photo is rounded itself: clipping the whole circle cut the camera badge off its edge */
.prof-av img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.prof-cam{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:#fff;color:#111;border:0;font-size:12px;display:grid;place-items:center;cursor:pointer}
.prof-hero .who b{display:block;font-size:18px}
.prof-hero .who small{display:block;color:#8b95a8;margin-top:4px;font-size:13px}
.mood-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px 2px;border:0;border-bottom:1px solid #2a3344;background:none;color:#fff;font:inherit;text-align:left;cursor:pointer}
.mood-row span{color:#c5cddb}
.mood-row b,.mood-row em{font-style:normal;font-weight:500;color:#8b95a8}
.mood-row.dim span,.mood-row.dim b{color:#5d6778}
.mood-sec{margin:22px 0 8px;color:#C9A227;font-weight:700;font-size:15px}
.mood-row.out span{color:#e35d5d}
.mood-row.del span{color:#5d6778}
.mood-input{width:100%;background:transparent;border:0;border-bottom:1px solid #3a4558;color:#fff;padding:16px 4px;font:inherit;outline:none;margin:28px 0 28px}
.mood-send{display:block;width:100%;max-width:420px;margin:8px auto 0;height:52px;border:0;border-radius:999px;background:#C9A227;color:#111;font-weight:700;font-size:16px;cursor:pointer}
.mood-sheet{position:fixed;inset:0;z-index:150;background:rgba(8,12,20,.55);display:flex;align-items:flex-end;justify-content:center}
.mood-sheet .box{width:min(440px,100%);background:#2c3548;border-radius:16px 16px 0 0;padding:18px 18px 28px}
.mood-sheet input{width:100%;background:#1c2433;border:1px solid #3a4558;border-radius:10px;color:#fff;padding:12px;margin:8px 0;font:inherit}
@media (max-width:980px){
  .mtabs button .mtab-ico,.mtabs button svg{width:26px!important;height:26px!important}
  .player .thumb,#nowArt{width:44px!important;height:44px!important;flex:0 0 44px!important;overflow:hidden!important}
}