.film-open,.film-grid-hint{display:none}
.film-detail-open,.film-detail-open body{overflow:hidden}
.film-detail-dialog{padding:44px 12px 12px;width:min(520px,calc(100% - 24px));max-height:calc(100dvh - 24px);overscroll-behavior:contain;border-radius:16px;background:var(--paper)}
.film-detail-dialog .film-row{border:0;box-shadow:none;overflow:visible}
.film-detail-dialog .poster-wrap{margin:0;border-radius:8px}
.film-detail-dialog .film-poster{display:block;height:min(40svh,350px);width:100%;object-fit:contain}
.film-detail-dialog .film-content{padding:20px 14px}
.film-detail-dialog .film-content h2{font-size:27px;line-height:1.25;margin:0 0 12px}
.film-detail-dialog .film-summary{font-size:14px}
.film-detail-dialog .film-open{display:none}
.film-detail-close{position:sticky;float:right;top:0;margin-top:-40px;margin-right:-8px;width:44px;height:44px;min-height:44px;border:0;background:var(--paper);border-radius:50%;color:var(--ink);font-size:28px;line-height:1;z-index:5}
.film-detail-dialog[open]{animation:film-detail-in .18s ease-out}
@keyframes film-detail-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){
  .results:not(.shared-results) .results-intro {margin-bottom:18px}
  .results:not(.shared-results) .result-toolbar {display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;margin-bottom:12px;padding-bottom:12px}
  .results:not(.shared-results) .result-share {min-width:0;max-width:none}
  .results:not(.shared-results) .result-button {font-size:11px;padding:10px 7px;gap:5px;min-height:44px}
  .results:not(.shared-results) .share-buttons {gap:3px;flex-wrap:nowrap}
  .results:not(.shared-results) .result-share p {font-size:10px;margin-top:6px}
  .results:not(.shared-results) .result-context {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;margin-bottom:14px}
  .results:not(.shared-results) .result-context>button {grid-column:1/-1;justify-self:start;min-height:44px}
  .results:not(.shared-results) .result-context label {display:flex;align-items:center;flex-wrap:wrap}
  .results:not(.shared-results) .result-context select {max-width:100%;margin-left:0}


  .results:not(.shared-results)>.film-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
  .results:not(.shared-results)>.film-list>.film-row{position:relative;border-radius:8px;transition:box-shadow .2s}
  .results:not(.shared-results)>.film-list>.film-row .poster-wrap{margin:5px 5px 0;border-radius:4px}
  .results:not(.shared-results)>.film-list>.film-row .film-poster{display:block;height:auto;width:100%;aspect-ratio:2/3;object-fit:contain}
  .results:not(.shared-results)>.film-list>.film-row .film-rank{top:5px;left:5px;min-width:24px;height:24px;font-size:11px}
  .results:not(.shared-results)>.film-list>.film-row .poster-credit{display:none}
  .results:not(.shared-results)>.film-list>.film-row .film-content{padding:10px 7px 12px}
  .results:not(.shared-results)>.film-list>.film-row .film-content>:not(h2){display:none}
  .results:not(.shared-results)>.film-list>.film-row h2{font-size:14px;letter-spacing:-.35px;line-height:1.35;margin:0;overflow-wrap:anywhere}
  .results:not(.shared-results)>.film-list>.film-row .film-open{display:block;position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:8px;background:transparent;cursor:pointer;z-index:2}
  .film-open:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
  .film-grid-hint{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin:0 0 12px}
}
@media(prefers-reduced-motion:reduce){.film-detail-dialog[open]{animation:none}}
@media (max-width:360px) {
  .site-header {padding-inline:16px;gap:8px}
  .site-header .wordmark {font-size:21px}
  .results:not(.shared-results) .result-toolbar {grid-template-columns:minmax(0,1fr)}
  .results:not(.shared-results) .result-edit {justify-self:start}
  .results:not(.shared-results) .result-share {width:100%;margin-left:0}
}