/* Cinemall V0.6 — navbar flottante e scheda film */
main{padding-bottom:calc(184px + var(--safe))}
.movieCard{cursor:pointer}

.bottomNav{
  position:fixed;
  z-index:20;
  left:50%;
  bottom:calc(18px + var(--safe));
  transform:translateX(-50%);
  width:auto;
  height:74px;
  padding:0;
  display:flex;
  align-items:flex-end;
  gap:2px;
  overflow:visible;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
}
.bottomNav button{
  flex:0 0 72px;
  width:72px;
  height:72px;
  padding:12px;
  border:0;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:var(--ink);
  color:#fff;
  transition:transform .18s ease,background-color .18s ease;
}
.bottomNav button img{width:46px;height:46px;object-fit:contain;display:block}
.bottomNav button.active{transform:translateY(-11px);color:#fff}
.bottomNav button[data-view="home"].active{background:var(--blue)}
.bottomNav button[data-view="cinema"].active{background:var(--purple)}
.bottomNav button[data-view="platform"].active{background:var(--yellow)}
.bottomNav button[data-view="options"].active{background:var(--red)}

.fab{
  z-index:21;
  right:max(20px,calc((100% - 720px)/2));
  bottom:calc(116px + var(--safe));
}

.detailPage{background:var(--ink)}
.detailPage #view{
  width:min(100%,760px);
  min-height:100vh;
  margin:auto;
  padding:0 0 calc(120px + var(--safe));
  background:var(--ink);
}
.movieDetail{min-height:100vh;background:var(--ink);color:#fff}
.detailVisual{
  position:relative;
  height:clamp(440px,58vh,650px);
  overflow:hidden;
  background:#123d4c;
}
.detailVisual>img{width:100%;height:100%;display:block;object-fit:cover}
.detailPlaceholder{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(145deg,var(--accent),#183b48)}
.detailPlaceholder img{width:128px;height:128px;object-fit:contain;opacity:.9}
.detailBack,.detailEdit{
  border:0;
  background:transparent;
  color:#fff;
  display:grid;
  place-items:center;
}
.detailBack{
  position:absolute;
  z-index:2;
  top:calc(24px + env(safe-area-inset-top,0px));
  left:22px;
  width:54px;
  height:54px;
  filter:drop-shadow(0 2px 6px #0008);
}
.detailBack svg{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.detailSheet{
  position:relative;
  z-index:3;
  min-height:46vh;
  margin-top:-40px;
  padding:52px 34px calc(172px + var(--safe));
  border-radius:46px 46px 0 0;
  background:var(--ink);
}
.detailSheet h1{
  max-width:calc(100% - 72px);
  margin:0 0 22px;
  font-family:'Bricolage Grotesque','Arial Black',sans-serif;
  font-size:clamp(39px,7vw,58px);
  line-height:.98;
  letter-spacing:-1.7px;
}
.detailEdit{position:absolute;top:48px;right:30px;width:52px;height:52px}
.detailEdit svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.detailMeta{color:#ddd;font-size:clamp(19px,4.5vw,29px);font-weight:300;font-style:italic}
.detailRating{display:flex;align-items:center;gap:18px;margin-top:19px}
.detailRating span{font-size:clamp(34px,7vw,50px);font-weight:700;line-height:1}
.detailRating b{max-width:min(70%,320px);padding:8px 17px;border-radius:9px;font-size:clamp(20px,4.5vw,29px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.detailNotes{margin-top:48px}
.detailNotes h2{margin:0 0 18px;font-size:25px;font-style:italic}
.detailNotes p{margin:0;color:#f1f1f1;font-size:19px;line-height:1.48;white-space:pre-wrap}
.detailNotes p.collapsed{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:7}
.noteToggle{float:right;margin-top:7px;border:0;background:transparent;color:#aaa;font-size:17px;font-weight:300;font-style:italic;text-decoration:underline}
.detailPage .bottomNav button:not(.active){background:#f3f3f3}
.detailPage .bottomNav button:not(.active) img{filter:brightness(0)}

@media(max-width:520px){
  .bottomNav{height:66px;bottom:calc(14px + var(--safe))}
  .bottomNav button{flex-basis:64px;width:64px;height:64px;padding:11px;border-radius:16px}
  .bottomNav button img{width:42px;height:42px}
  .fab{right:18px;bottom:calc(98px + var(--safe));width:64px;height:64px;border-radius:18px}
  .detailVisual{height:55vh;min-height:420px}
  .detailSheet{margin-top:-32px;padding:44px 28px calc(150px + var(--safe));border-radius:38px 38px 0 0}
  .detailSheet h1{font-size:40px;margin-bottom:18px}
  .detailEdit{top:39px;right:24px;width:46px;height:46px}
  .detailEdit svg{width:38px;height:38px}
  .detailMeta{font-size:20px}
  .detailNotes{margin-top:40px}
  .detailNotes p{font-size:17px}
}

@media(min-width:900px){
  .detailPage #view{width:min(760px,100%)}
  .detailSheet h1{font-size:58px}
}