.list-view { --list-accent:#d7190b;min-height:100svh;overflow-x:clip;background:radial-gradient(circle at 82% 13%,rgba(215,25,11,.1),transparent 29rem),linear-gradient(115deg,transparent 46%,rgba(255,255,255,.012) 46.1%,transparent 46.3%),var(--color-bg);animation:list-arrive 420ms var(--ease-out) both; }
.list-view[hidden] { display:none; }
.list-header,.list-page,.list-footer { width:min(calc(100% - clamp(2rem,8vw,8rem)),var(--content-max));margin-inline:auto; }
.list-header { display:flex;align-items:center;justify-content:space-between;min-height:7rem;border-bottom:1px solid var(--color-border); }
.list-header .home-nav__link { border:0;background:transparent; }
.saved-nav-link span { margin-left:.35rem;color:var(--color-red);font-variant-numeric:tabular-nums; }
.list-hero { position:relative;min-height:min(46rem,calc(100svh - 7rem));padding:clamp(4rem,8vh,7rem) 0;overflow:hidden;border-bottom:1px solid var(--color-border); }
.list-back { padding:.65rem 0;border-bottom:1px solid var(--color-border);background:transparent;color:var(--color-muted);cursor:pointer;font-size:var(--font-xs);letter-spacing:.13em;text-transform:uppercase; }
.list-back:hover,.list-back:focus-visible { color:var(--color-white);border-color:var(--list-accent); }
.list-eyebrow { color:var(--list-accent);font-size:.62rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase; }
.list-hero > .list-eyebrow { margin-top:clamp(4rem,9vh,7rem); }
.list-hero h2 { position:relative;z-index:2;max-width:17ch;margin-top:var(--space-4);color:var(--color-white);font-size:clamp(3.8rem,8vw,8rem);font-weight:490;letter-spacing:-.07em;line-height:.85; }
.list-hero > p:last-of-type { position:relative;z-index:2;margin-top:clamp(2.5rem,6vh,4rem);color:var(--color-muted);font-size:clamp(1rem,1.6vw,1.3rem);line-height:1.7; }
.list-hero__mark { position:absolute;top:17%;right:2%;width:min(33vw,27rem);aspect-ratio:1;border:1px solid rgba(215,25,11,.2);transform:rotate(45deg); }
.list-hero__mark span { position:absolute;inset:22%;border:1px solid rgba(255,255,255,.06); }.list-hero__mark span:last-child { inset:45%;background:var(--list-accent);box-shadow:0 0 25px var(--list-accent); }
.list-worlds { padding:clamp(7rem,12vw,11rem) 0;border-bottom:1px solid var(--color-border); }
.list-worlds__heading { display:grid;grid-template-columns:1fr auto;align-items:end;gap:var(--space-6);margin-bottom:var(--space-7); }
.list-worlds__heading h3 { margin-top:var(--space-2);color:var(--color-white);font-size:clamp(3rem,6vw,6rem);font-weight:480;letter-spacing:-.065em; }.list-worlds__heading h3 span { color:var(--list-accent); }
.list-worlds__heading > p { color:var(--color-muted);font-size:var(--font-sm);line-height:1.7;text-align:right; }
.list-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2.2vw,2rem); }
.list-card { min-width:0; }
.list-card__poster { position:relative;display:flex;align-items:flex-end;aspect-ratio:2/3;padding:1.2rem;overflow:hidden;border:1px solid var(--color-border);background:var(--poster-bg,linear-gradient(145deg,#35100d,#080403));box-shadow:0 18px 40px rgba(0,0,0,.25); }
.list-card__poster::before { position:absolute;inset:8%;z-index:1;content:"";border:1px solid rgba(255,255,255,.08); }.list-card__poster.has-cinema-image::after { position:absolute;inset:0;z-index:3;content:"";background:linear-gradient(to top,rgba(0,0,0,.7),transparent 52%); }.list-card__poster .cinema-image { z-index:2; }
.list-card__poster strong { position:relative;z-index:4;max-width:8ch;color:var(--color-white);font-size:clamp(1.2rem,2.4vw,2rem);font-weight:500;letter-spacing:-.045em;line-height:.95; }
.list-card h4 { margin-top:var(--space-3);overflow:hidden;color:var(--color-white);font-size:var(--font-base);font-weight:550;text-overflow:ellipsis;white-space:nowrap; }
.list-card__meta { margin-top:.35rem;color:var(--color-muted);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase; }
.list-card__signals { display:flex;flex-wrap:wrap;gap:.35rem;margin-top:var(--space-3); }.list-card__signals span { padding:.4rem .5rem;border:1px solid var(--color-border);color:#777;font-size:.52rem;letter-spacing:.09em;text-transform:uppercase; }
.list-card__contexts { display:flex;flex-wrap:wrap;gap:.4rem;margin-top:var(--space-3); }.list-card__contexts > span { width:100%;color:#555;font-size:.52rem;letter-spacing:.1em;text-transform:uppercase; }
.list-card__contexts button,.list-card__remove { padding:.5rem .6rem;border:1px solid var(--color-border);background:transparent;color:var(--color-muted);cursor:pointer;font-size:.53rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase; }.list-card__contexts button:hover,.list-card__contexts button:focus-visible { border-color:var(--list-accent);color:var(--color-white); }
.list-card__remove { margin-top:var(--space-3);padding:.5rem 0;border-width:0 0 1px;color:#666; }.list-card__remove:hover,.list-card__remove:focus-visible { border-color:var(--list-accent);color:var(--color-white); }
.list-empty { display:grid;min-height:31rem;place-content:center;text-align:center; }.list-empty[hidden] { display:none; }.list-empty h3 { margin-top:var(--space-4);color:var(--color-white);font-size:clamp(2.8rem,6vw,6rem);font-weight:480;letter-spacing:-.06em;line-height:.9; }.list-empty > p:not(.list-eyebrow) { margin-top:var(--space-5);color:var(--color-muted);line-height:1.7; }.list-empty button { justify-self:center;margin-top:var(--space-6);padding:1rem 1.2rem;border:1px solid var(--list-accent);background:var(--list-accent);color:white;cursor:pointer;font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase; }
.list-footer { display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) 0 var(--space-7);color:#555;font-size:.58rem;letter-spacing:.15em;text-transform:uppercase; }.list-footer button { background:transparent;color:#777;cursor:pointer;font:inherit;letter-spacing:inherit;text-transform:inherit; }
@keyframes list-arrive { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:none; } }
@media (max-width:1024px) { .list-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:768px) { .list-header { min-height:5.5rem; }.list-hero { min-height:calc(100svh - 5.5rem); }.list-hero__mark { right:-35%;width:75vw; }.list-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.list-worlds__heading { grid-template-columns:1fr; }.list-worlds__heading > p { text-align:left; } }
@media (max-width:430px) { .list-header { align-items:flex-start;padding:1.3rem 0;gap:1rem; }.list-header .home-nav { flex-wrap:wrap;justify-content:flex-end;gap:.7rem 1.1rem; }.list-hero h2 { font-size:clamp(3.4rem,17vw,5rem); }.list-grid { grid-template-columns:1fr;gap:1.5rem; }.list-card { display:grid;grid-template-columns:5.5rem minmax(0,1fr);column-gap:1rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border); }.list-card__poster { grid-row:1 / span 7;width:5.5rem;padding:.55rem; }.list-card__poster strong { font-size:.8rem; }.list-card h4 { grid-column:2;margin-top:0; }.list-card__meta,.list-card__signals,.list-card__contexts,.list-card__remove { grid-column:2; }.list-footer { flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { .list-view { animation:none; }.list-card .cinema-image { transition:none; } }
