/* MUSIC FM — Home Dedications / premium editorial wall, 2026-10-08 */
.home-page .mf-home-dedications{
  margin-top:32px!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(214,224,234,.92)!important;
  border-radius:3px!important;
  background:linear-gradient(180deg,#fff 0%,#fff 64%,#fbfcfe 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 18px 46px rgba(4,19,39,.065)!important;
}
.home-page .mf-home-dedications::before,.home-page .mf-home-dedications::after{content:none!important;display:none!important}

/* Exactly the same title language used by the regular home sections. */
.home-page .mf-hd-head.mf-section-heading{
  min-height:78px!important;
  height:78px!important;
  margin:0!important;
  padding:0 24px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  background:linear-gradient(180deg,#fff 0%,#fdfefe 100%)!important;
  border:0!important;
  border-bottom:1px solid #e4e9f0!important;
}
.home-page .mf-hd-title{display:flex;align-items:center;gap:12px;min-width:0}
.home-page .mf-hd-title>i{display:block;width:26px;height:1px;flex:0 0 26px;background:#5ba7e8!important}
.home-page .mf-hd-title h2{
  margin:0!important;
  color:#17243a!important;
  font-size:31px!important;
  line-height:1.12!important;
  letter-spacing:-.9px!important;
  font-weight:900!important;
}
.home-page .mf-hd-actions{display:flex;align-items:center;gap:18px;flex:0 0 auto}
.home-page .mf-hd-send{
  min-height:40px!important;padding:9px 14px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  border:1px solid #1268c7!important;border-radius:2px!important;background:#1476d2!important;color:#fff!important;
  box-shadow:0 7px 18px rgba(20,118,210,.15)!important;font-size:12px!important;font-weight:850!important
}
.home-page .mf-hd-send:hover{background:#0d5fc2!important;border-color:#0d5fc2!important;transform:translateY(-1px)!important}
.home-page .mf-hd-send .mf-icon{width:12px;height:12px}
.home-page .mf-hd-all{display:inline-flex;align-items:center;gap:7px;color:#0d5fc2!important;font-size:11.5px;font-weight:850;border:0!important;background:transparent!important;padding:8px 0!important}
.home-page .mf-hd-all:hover{color:#041327!important;gap:10px}
.home-page .mf-hd-all .mf-icon{width:10px;height:10px}

.home-page .mf-hd-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  padding:20px!important;
  background:linear-gradient(180deg,#f6f8fb 0%,#f9fafc 100%)!important;
}
.home-page .mf-hd-card{
  position:relative!important;
  min-width:0!important;
  min-height:260px!important;
  padding:20px 20px 17px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid #dde5ed!important;
  border-radius:3px!important;
  background:linear-gradient(150deg,#fff 0%,#fff 60%,#f9fbfd 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 8px 24px rgba(4,19,39,.045)!important;
  transition:transform .3s cubic-bezier(.2,.75,.25,1),box-shadow .3s ease,border-color .3s ease!important;
}
.home-page .mf-hd-card::before{content:none!important;display:none!important}
.home-page .mf-hd-card::after{
  content:'״';position:absolute;left:15px;top:42px;color:rgba(20,124,255,.055);font:900 92px/1 var(--mf-font,"IBM Plex Sans Hebrew",sans-serif);pointer-events:none;z-index:0
}
.home-page .mf-hd-card:hover{transform:translateY(-3px)!important;border-color:#cbd7e3!important;box-shadow:inset 0 1px 0 #fff,0 16px 34px rgba(4,19,39,.075)!important}
.home-page .mf-hd-card>*{position:relative;z-index:1}
.home-page .mf-hd-card-top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:15px;border-bottom:1px solid #edf1f5}
.home-page .mf-hd-user{display:flex;align-items:center;gap:11px;min-width:0;padding:0!important;border:0!important}
.home-page .mf-hd-avatar{
  width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;overflow:hidden;border-radius:50%;
  border:1px solid #d8e5f3;background:linear-gradient(145deg,#eff6ff,#f8fbff);color:#147cff;font-size:15px;font-weight:900;
  box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(13,95,194,.06)
}
.home-page .mf-hd-card:nth-child(2) .mf-hd-avatar{background:linear-gradient(145deg,#eefaf9,#f8fdfc);border-color:#d8eeeb;color:#169f9b}
.home-page .mf-hd-card:nth-child(3) .mf-hd-avatar{background:linear-gradient(145deg,#f4f1fb,#fbfaff);border-color:#e5def7;color:#7159c4}
.home-page .mf-hd-avatar--image{background:#fff!important}.home-page .mf-hd-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.home-page .mf-hd-user-copy{display:flex;flex-direction:column;min-width:0}
.home-page .mf-hd-user-copy strong{color:#17243a!important;font-size:13.5px;font-weight:900;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-page .mf-hd-user-copy small{margin-top:4px;color:#8a97a8;font-size:10.5px;line-height:1.2}
.home-page .mf-hd-recipient{flex:0 0 auto;min-width:82px;padding:8px 10px;text-align:right;background:#f5f8fb;border:1px solid #e6ebf1;border-radius:2px}
.home-page .mf-hd-recipient small{display:block;color:#9aa5b3;font-size:8.5px;font-weight:700;line-height:1;margin-bottom:4px}
.home-page .mf-hd-recipient strong{display:block;max-width:120px;color:#0d5fc2;font-size:11.5px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-page .mf-hd-copy{flex:1;padding:18px 2px 16px!important}
.home-page .mf-hd-copy p{margin:0!important;color:#253247!important;font-size:16px!important;line-height:1.67!important;font-weight:650!important}
.home-page .mf-hd-song{display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 15px!important;padding:10px 11px!important;border:0!important;background:#f5f8fb!important;color:#34445a!important}
.home-page .mf-hd-song-icon{width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;color:#1476d2;background:#fff;border:1px solid #e0e8f0}
.home-page .mf-hd-song-icon .mf-icon{width:13px;height:13px}
.home-page .mf-hd-song>span:last-child{display:flex;flex-direction:column;min-width:0}
.home-page .mf-hd-song small{color:#96a1ae!important;font-size:8.5px!important;line-height:1.1!important}
.home-page .mf-hd-song b{margin-top:2px;color:#34445a!important;font-size:11.5px!important;line-height:1.2!important;font-weight:900!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-page .mf-hd-song em{margin-top:2px;color:#768397;font-size:9.5px;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-page .mf-hd-card-footer{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-top:auto!important;padding-top:14px!important;border-top:1px solid #edf1f5!important}
.home-page .mf-hd-like{flex:0 0 auto}
.home-page .mf-hd-like:disabled{cursor:not-allowed}
.home-page .mf-hd-like[aria-busy="true"]{pointer-events:none}
.home-page .mf-hd-view{display:inline-flex!important;align-items:center!important;gap:7px!important;color:#5e6f83!important;font-size:10.5px!important;font-weight:850!important;transition:color .2s ease,gap .2s ease!important}
.home-page .mf-hd-view:hover{color:#0d5fc2!important;gap:9px!important}.home-page .mf-hd-view .mf-icon{width:9px;height:9px}
.home-page .mf-hd-status{margin:0 20px 16px;padding:9px 11px;background:#f7f9fc;border:1px solid #e1e7ee;color:#52647a;font-size:11px;font-weight:700}

@media(max-width:930px){
  .home-page .mf-hd-grid{gap:11px!important;padding:14px!important}
  .home-page .mf-hd-card{padding:17px 16px 15px!important}
  .home-page .mf-hd-recipient{min-width:72px;padding-inline:8px}.home-page .mf-hd-recipient strong{max-width:92px}
}
@media(max-width:760px){
  .home-page .mf-home-dedications{margin-top:22px!important;border-inline:0!important;border-radius:0!important;box-shadow:0 12px 30px rgba(4,19,39,.045)!important}
  .home-page .mf-hd-head.mf-section-heading{height:auto!important;min-height:0!important;padding:19px 16px 16px!important;display:block!important}
  .home-page .mf-hd-title{gap:10px}.home-page .mf-hd-title>i{width:22px;flex-basis:22px}
  .home-page .mf-hd-title h2{font-size:28px!important;letter-spacing:-.75px!important}
  .home-page .mf-hd-actions{margin-top:15px;justify-content:space-between;gap:12px}
  .home-page .mf-hd-send{min-height:38px!important;padding:8px 12px!important;font-size:11.5px!important}
  .home-page .mf-hd-all{font-size:11px}
  .home-page .mf-hd-grid{grid-template-columns:1fr!important;gap:10px!important;padding:10px!important;background:#f6f8fb!important}
  .home-page .mf-hd-card{min-height:0!important;padding:16px 15px 14px!important;box-shadow:inset 0 1px 0 #fff,0 7px 18px rgba(4,19,39,.04)!important;transform:none!important}
  .home-page .mf-hd-card::after{font-size:72px;top:40px;left:11px}
  .home-page .mf-hd-avatar{width:42px;height:42px;flex-basis:42px}
  .home-page .mf-hd-card-top{gap:10px;padding-bottom:13px}
  .home-page .mf-hd-recipient{min-width:70px}.home-page .mf-hd-recipient strong{max-width:105px}
  .home-page .mf-hd-copy{padding:15px 1px 14px!important}.home-page .mf-hd-copy p{font-size:15px!important;line-height:1.62!important}
  .home-page .mf-hd-song{margin-bottom:13px!important}
}
@media(max-width:400px){
  .home-page .mf-hd-card-top{align-items:flex-start}.home-page .mf-hd-recipient{min-width:64px;padding:7px 8px}.home-page .mf-hd-recipient strong{max-width:76px}
  .home-page .mf-hd-card-footer{gap:8px!important}
}


/* Home dedication composer — premium modal, 2026-10-08 */
.home-page .mf-hd-send,
.home-page .mf-hd-send span,
.home-page .mf-hd-send .mf-icon{color:#fff!important;fill:currentColor!important}
.home-page .mf-hd-send{font-family:inherit!important;cursor:pointer!important}

.home-page .mf-hd-compose-layer{
  position:fixed;inset:0;z-index:2300;display:grid;place-items:center;padding:28px;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .38s cubic-bezier(.22,1,.36,1),visibility .38s;
}
.home-page .mf-hd-compose-layer.is-open{opacity:1;visibility:visible;pointer-events:auto}
.home-page .mf-hd-compose-backdrop{position:absolute;inset:0;border:0;background:rgba(4,19,39,.34);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:default}
.home-page .mf-hd-compose-dialog{
  position:relative;width:min(720px,100%);max-height:min(760px,calc(100vh - 56px));overflow:auto;overscroll-behavior:contain;
  border:1px solid rgba(214,224,234,.96);border-radius:4px;background:linear-gradient(180deg,#fff 0%,#fff 72%,#fafbfd 100%);
  box-shadow:0 34px 90px rgba(4,19,39,.24),inset 0 1px 0 #fff;
  transform:translateY(18px) scale(.985);opacity:0;transition:transform .52s cubic-bezier(.22,1,.36,1),opacity .34s ease;
}
.home-page .mf-hd-compose-layer.is-open .mf-hd-compose-dialog{transform:translateY(0) scale(1);opacity:1}
.home-page .mf-hd-compose-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:26px 28px 22px;border-bottom:1px solid #e7ecf1;background:linear-gradient(180deg,#fff,#fcfdff)}
.home-page .mf-hd-compose-head>div{min-width:0}.home-page .mf-hd-compose-head small{display:block;color:#1476d2;font-size:9.5px;font-weight:900;letter-spacing:1.4px;direction:ltr;text-align:right}
.home-page .mf-hd-compose-head h3{margin:5px 0 4px;color:#122943;font-size:28px;line-height:1.12;font-weight:900;letter-spacing:-.8px}.home-page .mf-hd-compose-head p{margin:0;color:#7b899c;font-size:12px;line-height:1.6}
.home-page .mf-hd-compose-x{width:42px;height:42px;flex:0 0 42px;border:1px solid #d9e2eb;border-radius:3px;background:#fff;color:#607187;font:400 29px/1 Arial,sans-serif;display:grid;place-items:center;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease}
.home-page .mf-hd-compose-x:hover{background:#f4f8fc;color:#0d5fc2;border-color:#c8d7e5}
.home-page .mf-hd-compose-body{padding:25px 28px 27px}
.home-page .mf-hd-compose-as{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 12px;background:#f6f8fb;border:1px solid #e7ecf1;color:#65758a;font-size:11px}.home-page .mf-hd-compose-as .mf-icon{width:14px;height:14px;color:#1476d2}.home-page .mf-hd-compose-as strong{color:#1d314b;font-size:11.5px}
.home-page .mf-hd-compose-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}.home-page .mf-hd-compose-field{display:block;min-width:0}.home-page .mf-hd-compose-field--wide,.home-page .mf-hd-compose-music-title{grid-column:1/-1}
.home-page .mf-hd-compose-field>span{display:block;margin-bottom:7px;color:#34475e;font-size:11px;font-weight:850}.home-page .mf-hd-compose-field>span b{color:#df4056}
.home-page .mf-hd-compose-field :is(input,textarea){width:100%;border:1px solid #d8e2eb;border-radius:2px;background:#fbfcfe;color:#1f3046;padding:12px 13px;outline:0;font:600 13px/1.5 var(--mf-font,"IBM Plex Sans Hebrew",sans-serif);transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.home-page .mf-hd-compose-field input{height:46px}.home-page .mf-hd-compose-field textarea{min-height:112px;resize:vertical}.home-page .mf-hd-compose-field :is(input,textarea):focus{background:#fff;border-color:#7fb4e9;box-shadow:0 0 0 3px rgba(20,124,255,.08)}
.home-page .mf-hd-compose-field small{display:block;margin-top:5px;color:#9aa6b4;font-size:9.5px;text-align:left;direction:ltr}.home-page .mf-hd-compose-field small b{color:#718095;font-weight:800}
.home-page .mf-hd-compose-music-title{display:flex;align-items:center;gap:11px;margin-top:2px;padding-top:17px;border-top:1px solid #edf1f5}.home-page .mf-hd-compose-music-title>.mf-icon{width:16px;height:16px;color:#1476d2}.home-page .mf-hd-compose-music-title>div{display:flex;align-items:center;gap:8px}.home-page .mf-hd-compose-music-title strong{color:#253951;font-size:12px}.home-page .mf-hd-compose-music-title span{padding:3px 6px;background:#f2f6fa;color:#8a98a9;font-size:8.5px;font-weight:800}
.home-page .mf-hd-compose-agree{display:flex;align-items:flex-start;gap:9px;margin-top:18px;color:#718095;font-size:10.5px;line-height:1.6;cursor:pointer}.home-page .mf-hd-compose-agree input{margin-top:4px;accent-color:#1476d2}.home-page .mf-hd-compose-agree a{color:#0d5fc2;text-decoration:underline;text-underline-offset:2px}
.home-page .mf-hd-compose-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:20px;padding-top:18px;border-top:1px solid #edf1f5}.home-page .mf-hd-compose-foot>small{color:#94a0af;font-size:9.5px;line-height:1.5}
.home-page .mf-hd-compose-primary,.home-page a.mf-hd-compose-primary{min-height:42px;padding:10px 16px;border:1px solid #0d65c5;border-radius:2px;background:#1476d2;color:#fff!important;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:850 11.5px/1 var(--mf-font,"IBM Plex Sans Hebrew",sans-serif);text-decoration:none;cursor:pointer;box-shadow:0 8px 20px rgba(20,118,210,.15)}
.home-page .mf-hd-compose-primary .mf-icon{width:11px;height:11px;color:#fff}.home-page .mf-hd-compose-primary:hover{background:#0d5fc2}.home-page .mf-hd-compose-primary:disabled{opacity:.55;cursor:wait}
.home-page .mf-hd-compose-secondary{min-height:42px;padding:10px 16px;border:1px solid #d8e1ea;border-radius:2px;background:#fff;color:#52647a!important;display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:850;text-decoration:none}
.home-page .mf-hd-compose-result{margin-top:16px;padding:11px 12px;border:1px solid #dfe6ee;background:#f7f9fc;color:#52647a;font-size:11px;font-weight:700}.home-page .mf-hd-compose-result.is-success{border-color:#cce6df;background:#f3faf7;color:#187165}.home-page .mf-hd-compose-result.is-error{border-color:#efcbd2;background:#fff7f8;color:#ad3447}
.home-page .mf-hd-compose-guest{text-align:center;padding:20px 8px 12px}.home-page .mf-hd-compose-guest-icon{width:58px;height:58px;margin:0 auto 14px;display:grid;place-items:center;border:1px solid #dbe6ef;background:#f7faff;color:#1476d2}.home-page .mf-hd-compose-guest-icon .mf-icon{width:22px;height:22px}.home-page .mf-hd-compose-guest h4{margin:0;color:#172d48;font-size:20px}.home-page .mf-hd-compose-guest p{max-width:430px;margin:8px auto 18px;color:#78879a;font-size:12px;line-height:1.65}.home-page .mf-hd-compose-guest>div{display:flex;justify-content:center;gap:10px}
/* Composer deliberately leaves root scrolling styles untouched to avoid scrollbar flicker. */

@media(max-width:640px){
  .home-page .mf-hd-compose-layer{padding:0;place-items:end stretch}
  .home-page .mf-hd-compose-backdrop{background:rgba(4,19,39,.31);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
  .home-page .mf-hd-compose-dialog{width:100%;max-height:calc(100dvh - 72px);border-radius:0;border-inline:0;border-bottom:0;transform:translateY(28px);box-shadow:0 -20px 54px rgba(4,19,39,.18)}
  .home-page .mf-hd-compose-head{padding:20px 17px 16px}.home-page .mf-hd-compose-head h3{font-size:24px}.home-page .mf-hd-compose-head p{font-size:11px}.home-page .mf-hd-compose-x{width:40px;height:40px;flex-basis:40px}
  .home-page .mf-hd-compose-body{padding:18px 17px 22px}.home-page .mf-hd-compose-grid{grid-template-columns:1fr;gap:14px}.home-page .mf-hd-compose-field--wide,.home-page .mf-hd-compose-music-title{grid-column:auto}.home-page .mf-hd-compose-music-title{margin-top:2px}
  .home-page .mf-hd-compose-foot{align-items:stretch;flex-direction:column-reverse}.home-page .mf-hd-compose-foot .mf-hd-compose-primary{width:100%}.home-page .mf-hd-compose-foot>small{text-align:center}.home-page .mf-hd-compose-guest>div{flex-direction:column}.home-page .mf-hd-compose-guest :is(.mf-hd-compose-primary,.mf-hd-compose-secondary){width:100%}
}


/* 2026-10-08 — compact mobile dedication composer */
@media(max-width:640px){
  .home-page .mf-hd-compose-layer{
    padding:0 10px calc(76px + env(safe-area-inset-bottom,0px));
    place-items:end stretch;
  }
  .home-page .mf-hd-compose-dialog{
    width:100%;
    max-height:min(72dvh,680px);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    border:1px solid rgba(214,224,234,.96);
    border-bottom:1px solid rgba(214,224,234,.96);
    border-radius:4px;
    transform:translateY(18px);
  }
  .home-page .mf-hd-compose-head{
    flex:0 0 auto;
    padding:14px 14px 12px;
    gap:14px;
  }
  .home-page .mf-hd-compose-head small{font-size:8.5px;letter-spacing:1.15px}
  .home-page .mf-hd-compose-head h3{margin-top:3px;font-size:21px;line-height:1.08}
  .home-page .mf-hd-compose-head p{margin-top:3px;font-size:10px;line-height:1.45}
  .home-page .mf-hd-compose-x{width:36px;height:36px;flex-basis:36px;font-size:25px}
  .home-page .mf-hd-compose-body{
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:13px 14px 14px;
  }
  .home-page .mf-hd-compose-as{margin-bottom:11px;padding:7px 9px;font-size:9.5px}
  .home-page .mf-hd-compose-grid{grid-template-columns:1fr;gap:10px}
  .home-page .mf-hd-compose-field>span{margin-bottom:5px;font-size:10px}
  .home-page .mf-hd-compose-field input{height:40px;padding-block:8px}
  .home-page .mf-hd-compose-field textarea{min-height:78px;max-height:110px;padding-block:9px}
  .home-page .mf-hd-compose-field :is(input,textarea){font-size:12px;padding-inline:11px}
  .home-page .mf-hd-compose-field small{margin-top:3px;font-size:8.5px}
  .home-page .mf-hd-compose-music-title{margin-top:0;padding-top:10px;gap:8px}
  .home-page .mf-hd-compose-music-title strong{font-size:10.5px}
  .home-page .mf-hd-compose-music-title span{font-size:7.5px}
  .home-page .mf-hd-compose-agree{margin-top:10px;font-size:9px;line-height:1.45}
  .home-page .mf-hd-compose-foot{margin-top:12px;padding-top:12px;gap:8px}
  .home-page .mf-hd-compose-foot>small{display:none}
  .home-page .mf-hd-compose-primary{min-height:40px;padding:9px 14px}
}

@media(max-width:390px){
  .home-page .mf-hd-compose-dialog{max-height:70dvh}
  .home-page .mf-hd-compose-head p{display:none}
  .home-page .mf-hd-compose-as{display:none}
  .home-page .mf-hd-compose-field textarea{min-height:72px}
}


/* 2026-10-08 — mobile composer locked between top + bottom navigation */
@media(max-width:640px){
  .home-page .mf-hd-compose-layer{
    inset:auto!important;
    top:calc(var(--mf-ui-header-height,72px) + env(safe-area-inset-top,0px) + 8px)!important;
    right:8px!important;
    bottom:calc(72px + env(safe-area-inset-bottom,0px) + 8px)!important;
    left:8px!important;
    width:auto!important;
    height:auto!important;
    padding:0!important;
    display:block!important;
  }
  .home-page .mf-hd-compose-backdrop{
    position:fixed!important;
    top:calc(var(--mf-ui-header-height,72px) + env(safe-area-inset-top,0px))!important;
    right:0!important;
    bottom:calc(72px + env(safe-area-inset-bottom,0px))!important;
    left:0!important;
  }
  .home-page .mf-hd-compose-dialog{
    position:relative!important;
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    margin:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    border:1px solid rgba(214,224,234,.96)!important;
    border-radius:4px!important;
    box-shadow:0 18px 48px rgba(4,19,39,.18),inset 0 1px 0 rgba(255,255,255,.98)!important;
  }
  .home-page .mf-hd-compose-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
}

@media(max-width:390px){
  .home-page .mf-hd-compose-layer{
    right:6px!important;
    left:6px!important;
    top:calc(var(--mf-ui-header-height,72px) + env(safe-area-inset-top,0px) + 6px)!important;
    bottom:calc(72px + env(safe-area-inset-bottom,0px) + 6px)!important;
  }
  .home-page .mf-hd-compose-dialog{max-height:none!important;height:100%!important}
}


/* 2026-10-08 — taller mobile composer: use the full space between both navs */
@media(max-width:640px){
  .home-page .mf-hd-compose-layer{
    top:calc(env(safe-area-inset-top,0px) + 5px)!important;
    right:6px!important;
    bottom:calc(72px + env(safe-area-inset-bottom,0px) + 5px)!important;
    left:6px!important;
  }
  .home-page .mf-hd-compose-dialog{
    height:100%!important;
    max-height:none!important;
  }
}
@media(max-width:390px){
  .home-page .mf-hd-compose-layer{
    top:calc(env(safe-area-inset-top,0px) + 4px)!important;
    right:5px!important;
    bottom:calc(72px + env(safe-area-inset-bottom,0px) + 4px)!important;
    left:5px!important;
  }
}

/* 2026-10-08 — final mobile dedication composer: centered premium modal */
@media(max-width:640px){
  .home-page .mf-hd-compose-layer{
    position:fixed!important;
    inset:0!important;
    width:auto!important;
    height:auto!important;
    padding:
      calc(var(--mf-ui-header-height,72px) + env(safe-area-inset-top,0px) + 14px)
      10px
      calc(72px + env(safe-area-inset-bottom,0px) + 14px)!important;
    display:grid!important;
    place-items:center!important;
  }
  .home-page .mf-hd-compose-backdrop{
    position:absolute!important;
    inset:0!important;
    background:rgba(4,19,39,.34)!important;
    backdrop-filter:blur(8px)!important;
    -webkit-backdrop-filter:blur(8px)!important;
  }
  .home-page .mf-hd-compose-dialog{
    position:relative!important;
    width:min(100%,540px)!important;
    height:auto!important;
    max-height:min(700px,100%)!important;
    margin:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    border:1px solid rgba(211,222,232,.98)!important;
    border-radius:5px!important;
    background:linear-gradient(180deg,#fff 0%,#fff 76%,#fbfcfe 100%)!important;
    box-shadow:0 24px 64px rgba(4,19,39,.22),inset 0 1px 0 rgba(255,255,255,.98)!important;
    transform:translateY(14px) scale(.992)!important;
  }
  .home-page .mf-hd-compose-layer.is-open .mf-hd-compose-dialog{
    transform:translateY(0) scale(1)!important;
  }
  .home-page .mf-hd-compose-head{
    flex:0 0 auto!important;
    padding:16px 17px 14px!important;
    gap:14px!important;
  }
  .home-page .mf-hd-compose-head h3{
    font-size:23px!important;
    line-height:1.08!important;
    margin:3px 0 3px!important;
  }
  .home-page .mf-hd-compose-head p{
    font-size:10.5px!important;
    line-height:1.45!important;
  }
  .home-page .mf-hd-compose-x{
    width:42px!important;
    height:42px!important;
    flex:0 0 42px!important;
  }
  .home-page .mf-hd-compose-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:14px 17px 16px!important;
  }
  .home-page .mf-hd-compose-as{margin-bottom:12px!important}
  .home-page .mf-hd-compose-grid{gap:11px!important}
  .home-page .mf-hd-compose-field textarea{
    min-height:88px!important;
    max-height:118px!important;
  }
  .home-page .mf-hd-compose-foot{
    margin-top:12px!important;
    padding-top:12px!important;
  }
}

@media(max-width:390px){
  .home-page .mf-hd-compose-layer{
    padding:
      calc(var(--mf-ui-header-height,72px) + env(safe-area-inset-top,0px) + 9px)
      8px
      calc(72px + env(safe-area-inset-bottom,0px) + 9px)!important;
  }
  .home-page .mf-hd-compose-dialog{
    width:100%!important;
    max-height:100%!important;
  }
  .home-page .mf-hd-compose-head{padding:14px 15px 12px!important}
  .home-page .mf-hd-compose-body{padding:12px 15px 14px!important}
  .home-page .mf-hd-compose-head h3{font-size:21px!important}
}


/* 2026-10-08 — desktop dedication composer: compact centered premium modal */
@media(min-width:641px){
  .home-page .mf-hd-compose-layer{
    padding:34px 48px!important;
    place-items:center!important;
  }
  .home-page .mf-hd-compose-dialog{
    width:min(620px,calc(100vw - 96px))!important;
    max-height:min(640px,calc(100dvh - 150px))!important;
    overflow:auto!important;
    border-radius:4px!important;
  }
  .home-page .mf-hd-compose-head{
    gap:18px!important;
    padding:20px 22px 17px!important;
  }
  .home-page .mf-hd-compose-head h3{
    margin:3px 0 3px!important;
    font-size:24px!important;
    line-height:1.08!important;
  }
  .home-page .mf-hd-compose-head p{
    font-size:10.5px!important;
    line-height:1.45!important;
  }
  .home-page .mf-hd-compose-x{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
    font-size:25px!important;
  }
  .home-page .mf-hd-compose-body{
    padding:19px 22px 21px!important;
  }
  .home-page .mf-hd-compose-as{
    margin-bottom:14px!important;
    padding:8px 10px!important;
  }
  .home-page .mf-hd-compose-grid{
    gap:12px 14px!important;
  }
  .home-page .mf-hd-compose-field>span{
    margin-bottom:5px!important;
    font-size:10.5px!important;
  }
  .home-page .mf-hd-compose-field :is(input,textarea){
    padding:9px 11px!important;
    font-size:12px!important;
  }
  .home-page .mf-hd-compose-field input{
    height:42px!important;
  }
  .home-page .mf-hd-compose-field textarea{
    min-height:88px!important;
    max-height:120px!important;
  }
  .home-page .mf-hd-compose-music-title{
    margin-top:0!important;
    padding-top:13px!important;
  }
  .home-page .mf-hd-compose-agree{
    margin-top:13px!important;
  }
  .home-page .mf-hd-compose-foot{
    margin-top:14px!important;
    padding-top:14px!important;
  }
  .home-page .mf-hd-compose-primary,
  .home-page a.mf-hd-compose-primary{
    min-height:40px!important;
    padding:9px 14px!important;
  }
}

/* ========================================================================== 
   2026-10-08 — dedication composer as a complete card, no internal scrollbar
   Desktop + mobile: all fields remain visible in one card.
   ========================================================================== */
.home-page .mf-hd-compose-dialog{
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}
.home-page .mf-hd-compose-body{
  min-height:auto!important;
  overflow:visible!important;
  overscroll-behavior:auto!important;
  -webkit-overflow-scrolling:auto!important;
}
.home-page .mf-hd-compose-field textarea{
  resize:none!important;
}

@media(min-width:641px){
  .home-page .mf-hd-compose-layer{
    padding:calc(96px + 22px) 42px 30px!important;
    place-items:center!important;
  }
  .home-page .mf-hd-compose-dialog{
    width:min(680px,calc(100vw - 84px))!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .home-page .mf-hd-compose-head{
    padding:18px 22px 15px!important;
  }
  .home-page .mf-hd-compose-head h3{
    font-size:24px!important;
  }
  .home-page .mf-hd-compose-body{
    padding:16px 22px 18px!important;
    overflow:visible!important;
  }
  .home-page .mf-hd-compose-as{
    margin-bottom:11px!important;
    padding:7px 10px!important;
  }
  .home-page .mf-hd-compose-grid{
    gap:10px 14px!important;
  }
  .home-page .mf-hd-compose-field>span{
    margin-bottom:4px!important;
  }
  .home-page .mf-hd-compose-field input{
    height:40px!important;
  }
  .home-page .mf-hd-compose-field textarea{
    height:84px!important;
    min-height:84px!important;
    max-height:84px!important;
  }
  .home-page .mf-hd-compose-field small{
    margin-top:3px!important;
  }
  .home-page .mf-hd-compose-music-title{
    padding-top:10px!important;
  }
  .home-page .mf-hd-compose-agree{
    margin-top:10px!important;
  }
  .home-page .mf-hd-compose-foot{
    margin-top:11px!important;
    padding-top:11px!important;
  }
}

@media(max-width:640px){
  .home-page .mf-hd-compose-layer{
    position:fixed!important;
    inset:0!important;
    width:auto!important;
    height:auto!important;
    padding:
      calc(92px + env(safe-area-inset-top,0px))
      9px
      calc(82px + env(safe-area-inset-bottom,0px))!important;
    display:grid!important;
    place-items:center!important;
  }
  .home-page .mf-hd-compose-dialog{
    position:relative!important;
    width:min(100%,540px)!important;
    height:auto!important;
    max-height:none!important;
    margin:0!important;
    overflow:visible!important;
    display:block!important;
    border-radius:5px!important;
  }
  .home-page .mf-hd-compose-head{
    padding:12px 14px 10px!important;
    gap:12px!important;
  }
  .home-page .mf-hd-compose-head small{
    font-size:8px!important;
  }
  .home-page .mf-hd-compose-head h3{
    margin:2px 0!important;
    font-size:21px!important;
    line-height:1.04!important;
  }
  .home-page .mf-hd-compose-head p{
    font-size:9.5px!important;
    line-height:1.35!important;
  }
  .home-page .mf-hd-compose-x{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
    font-size:24px!important;
  }
  .home-page .mf-hd-compose-body{
    padding:10px 14px 12px!important;
    overflow:visible!important;
  }
  .home-page .mf-hd-compose-as{
    margin-bottom:8px!important;
    padding:6px 8px!important;
    min-height:30px!important;
  }
  .home-page .mf-hd-compose-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:7px 8px!important;
  }
  .home-page .mf-hd-compose-grid>.mf-hd-compose-field:first-child,
  .home-page .mf-hd-compose-field--wide,
  .home-page .mf-hd-compose-music-title{
    grid-column:1/-1!important;
  }
  .home-page .mf-hd-compose-field>span{
    margin-bottom:3px!important;
    font-size:9.5px!important;
  }
  .home-page .mf-hd-compose-field :is(input,textarea){
    padding:7px 9px!important;
    font-size:11.5px!important;
  }
  .home-page .mf-hd-compose-field input{
    height:38px!important;
  }
  .home-page .mf-hd-compose-field textarea{
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
  }
  .home-page .mf-hd-compose-field small{
    margin-top:2px!important;
    font-size:8px!important;
  }
  .home-page .mf-hd-compose-music-title{
    margin-top:0!important;
    padding-top:7px!important;
    gap:7px!important;
    min-height:27px!important;
  }
  .home-page .mf-hd-compose-music-title>.mf-icon{
    width:14px!important;
    height:14px!important;
  }
  .home-page .mf-hd-compose-music-title strong{
    font-size:10px!important;
  }
  .home-page .mf-hd-compose-agree{
    margin-top:7px!important;
    gap:7px!important;
    font-size:8.5px!important;
    line-height:1.35!important;
  }
  .home-page .mf-hd-compose-agree input{
    margin-top:1px!important;
  }
  .home-page .mf-hd-compose-result{
    margin-top:7px!important;
    padding:7px 8px!important;
    font-size:9px!important;
  }
  .home-page .mf-hd-compose-foot{
    margin-top:8px!important;
    padding-top:8px!important;
    gap:7px!important;
    flex-direction:row!important;
    align-items:center!important;
  }
  .home-page .mf-hd-compose-foot>small{
    display:none!important;
  }
  .home-page .mf-hd-compose-foot .mf-hd-compose-primary{
    width:100%!important;
    min-height:38px!important;
    padding:8px 12px!important;
  }
}

@media(max-width:380px), (max-height:760px) and (max-width:640px){
  .home-page .mf-hd-compose-layer{
    padding:
      calc(82px + env(safe-area-inset-top,0px))
      7px
      calc(74px + env(safe-area-inset-bottom,0px))!important;
  }
  .home-page .mf-hd-compose-head{
    padding:9px 12px 8px!important;
  }
  .home-page .mf-hd-compose-head p{
    display:none!important;
  }
  .home-page .mf-hd-compose-body{
    padding:8px 12px 10px!important;
  }
  .home-page .mf-hd-compose-as{
    margin-bottom:6px!important;
    min-height:27px!important;
  }
  .home-page .mf-hd-compose-grid{
    gap:5px 7px!important;
  }
  .home-page .mf-hd-compose-field input{
    height:35px!important;
  }
  .home-page .mf-hd-compose-field textarea{
    height:62px!important;
    min-height:62px!important;
    max-height:62px!important;
  }
  .home-page .mf-hd-compose-music-title{
    min-height:24px!important;
    padding-top:5px!important;
  }
  .home-page .mf-hd-compose-agree{
    margin-top:5px!important;
  }
  .home-page .mf-hd-compose-foot{
    margin-top:6px!important;
    padding-top:6px!important;
  }
}

/* Honest empty state: never replace unavailable community data with demo activity. */
.home-page .mf-hd-grid.is-empty{grid-template-columns:1fr}
.home-page .mf-hd-empty{min-height:150px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;padding:24px 26px;border:1px solid rgba(13,50,83,.1);background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(246,250,254,.9));box-shadow:0 14px 38px rgba(7,34,61,.06)}
.home-page .mf-hd-empty>span{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#eef6ff;color:#147cff}.home-page .mf-hd-empty>span svg{width:20px;height:20px}
.home-page .mf-hd-empty strong{display:block;color:#102c49;font-size:18px;line-height:1.25}.home-page .mf-hd-empty p{margin:5px 0 0;color:#667c91;font-size:12px;line-height:1.65}
.home-page .mf-hd-empty button{border:1px solid rgba(20,124,255,.22);background:#fff;color:#147cff;min-height:40px;padding:0 16px;font:inherit;font-size:11px;font-weight:800;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.home-page .mf-hd-empty button:hover{transform:translateY(-1px);border-color:rgba(20,124,255,.5);box-shadow:0 8px 22px rgba(20,124,255,.1)}
@media(max-width:640px){.home-page .mf-hd-empty{grid-template-columns:auto 1fr;padding:18px;gap:13px}.home-page .mf-hd-empty>span{width:42px;height:42px}.home-page .mf-hd-empty strong{font-size:16px}.home-page .mf-hd-empty p{font-size:10.5px}.home-page .mf-hd-empty button{grid-column:1/-1;width:100%}}
@media(prefers-reduced-motion:reduce){.home-page .mf-hd-empty button{transition:none}}

/* 2026-10-18: composer portal fix. The layer is mounted directly on body to
   escape the isolated main / site-shell stacking contexts. Keep the panel
   above site chrome and scroll it within the available viewport. */
body.home-page > .mf-hd-compose-layer{
  position:fixed!important;inset:0!important;z-index:2147483000!important;
  box-sizing:border-box!important;
  width:100%!important;height:100%!important;
  display:grid!important;place-items:center!important;
  padding:clamp(12px,3vh,28px)!important;
}
body.home-page > .mf-hd-compose-layer:not(.is-open){
  visibility:hidden!important;pointer-events:none!important;opacity:0!important;
}
body.home-page > .mf-hd-compose-layer.is-open{
  visibility:visible!important;pointer-events:auto!important;opacity:1!important;
}
body.home-page > .mf-hd-compose-layer .mf-hd-compose-backdrop{
  position:absolute!important;inset:0!important;
}
body.home-page > .mf-hd-compose-layer .mf-hd-compose-dialog{
  position:relative!important;box-sizing:border-box!important;
  width:min(680px,100%)!important;
  height:auto!important;
  max-height:calc(100dvh - 56px)!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  opacity:1;
}
body.home-page > .mf-hd-compose-layer .mf-hd-compose-body{
  max-height:none!important;overflow:visible!important;
}
@media(max-width:640px){
  body.home-page > .mf-hd-compose-layer{
    padding:calc(12px + env(safe-area-inset-top,0px))
      10px calc(12px + env(safe-area-inset-bottom,0px))!important;
  }
  body.home-page > .mf-hd-compose-layer .mf-hd-compose-dialog{
    width:100%!important;height:auto!important;
    max-height:calc(100dvh - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important;
    overflow-y:auto!important;display:block!important;
  }
}
@media(prefers-reduced-motion:reduce){
  body.home-page > .mf-hd-compose-layer,
  body.home-page > .mf-hd-compose-layer .mf-hd-compose-dialog{transition:none!important}
}

/* 2026-10-18 — backdrop flash / white edge correction.
   Keep the viewport scrollbar stable; remove blur's bright GPU edge artifact.
   A non-button backdrop also prevents browser focus/active feedback. */
body.home-page > .mf-hd-compose-layer{
  inset:0!important;
  width:auto!important;
  height:auto!important;
  overflow:hidden!important;
}
body.home-page > .mf-hd-compose-layer .mf-hd-compose-backdrop{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:0!important;
  background:rgba(4,19,39,.58)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  touch-action:none;
  cursor:default;
  transition:none!important;
}

/* Clickable dedication author: preserve the Classic card treatment. */
.home-page .mf-hd-card .mf-hd-avatar:is(a){text-decoration:none;cursor:pointer}
.home-page .mf-hd-card .mf-hd-avatar:is(a):hover{border-color:#a9bfd8}
.home-page .mf-hd-user-copy .mf-hd-author-link{color:inherit;text-decoration:none;outline-offset:3px}
.home-page .mf-hd-user-copy .mf-hd-author-link:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.home-page .mf-hd-card .mf-hd-avatar:is(a):focus-visible,.home-page .mf-hd-user-copy .mf-hd-author-link:focus-visible{outline:2px solid #176ac5;outline-offset:3px}