/* Planet folders and a small photo selection before the full contact sheet. */
.archive-planet-hoth { --archive-tone:#7da5b2; }
.archive-planet-tatooine { --archive-tone:#bb9058; }
.archive-planet-mustafar { --archive-tone:#bd6a43; }
.archive-planet,.archive-collection {
  --archive-wash:color-mix(in srgb,var(--archive-tone) 23%,var(--poster-paper));
  --archive-rule:color-mix(in srgb,var(--archive-tone) 65%,var(--poster-ink));
}

#app .archive-collection-intro { margin:8px 0 0; padding-top:16px; border-top:3px solid var(--poster-ink); }
#app .archive-collection-intro h2 { margin:0 0 6px; font-size:32px; }
#app .archive-collection-intro p { margin:0; font-size:16px; line-height:1.5; }
#app .archive-collections { gap:20px; margin:22px 0 0; align-items:start; }
#app .archive-collection {
  display:flex; flex-direction:column; overflow:visible; border:1px solid var(--poster-ink);
  color:var(--poster-ink); background:var(--archive-wash);
  box-shadow:3px 3px 0 color-mix(in srgb,var(--poster-ink) 17%,transparent);
  transition:transform .2s ease,box-shadow .2s ease;
}
.archive-folder-tab {
  display:block; width:fit-content; min-width:116px; margin:-1px 0 0 -1px;
  padding:7px 13px 6px; border:1px solid var(--poster-ink); border-bottom:0;
  background:var(--archive-wash); font-size:11px; line-height:1.3; font-weight:800; letter-spacing:.1em;
}
#app .archive-collection-photo { margin:0 10px; border:1px solid var(--poster-ink); }
#app .archive-collection-photo img { aspect-ratio:16/10; filter:none!important; }
#app .archive-collection-label { padding:16px 17px 18px; color:var(--poster-ink); }
#app .archive-collection-label h3 { margin:0 0 9px; color:var(--poster-ink)!important; font-size:34px; line-height:1; }
#app .archive-collection-label>span { font-size:13px; line-height:1.5; }
#app .archive-collection-label b { color:var(--poster-ink); }

.archive-highlights { margin:4px 0 24px; }
.archive-highlights-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:10px 20px; padding:16px 0 14px; border-top:3px solid var(--archive-rule); }
#app .archive-highlights-heading h2 { margin:0; font-size:32px; line-height:1; }
.archive-highlights-heading>span { font-size:12px; line-height:1.5; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.archive-highlight-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:16px; }
.archive-highlight { display:flex; flex-direction:column; min-width:0; margin:0; border:1px solid var(--poster-ink); background:var(--archive-wash); }
.archive-highlight-lead { grid-row:span 2; }
#app .archive-highlight>button {
  display:block; flex:1; width:100%; min-height:0; padding:0; border:0; border-radius:0;
  color:inherit; background:var(--poster-ink); cursor:zoom-in; overflow:hidden; box-shadow:none;
}
.archive-highlight img { display:block; width:100%; height:100%; aspect-ratio:16/9; object-fit:cover; filter:none!important; transition:transform .35s ease; }
.archive-highlight-lead img { aspect-ratio:auto; min-height:300px; }
.archive-highlight figcaption { display:flex; align-items:baseline; gap:12px; min-height:62px; padding:12px 14px; border-top:1px solid var(--poster-ink); color:var(--poster-ink); }
.archive-highlight figcaption>span:first-child { font-size:12px; font-weight:800; opacity:.65; }
#app .archive-highlight figcaption p { flex:1; margin:0; font-size:16px; line-height:1.35; font-style:normal; }
.archive-highlight-zoom { font-size:19px; font-weight:700; }

#app .archive-planet .archive-downloads { padding:18px 20px; margin:0 0 20px; border:1px solid var(--poster-ink); border-left:5px solid var(--archive-rule); background:var(--archive-wash); gap:14px 20px; }
#app .archive-planet .archive-downloads h2 { font-size:25px; margin:0 0 5px; }
#app .archive-planet .archive-downloads p { font-size:15px; line-height:1.5; }

.archive-all-photos { margin:0; border:1px solid var(--poster-ink); background:color-mix(in srgb,var(--poster-paper-deep) 55%,var(--poster-paper)); }
.archive-all-photos>summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 20px; color:var(--poster-ink); background:var(--archive-wash); cursor:pointer; list-style:none; font-size:25px; line-height:1.1; font-weight:800; }
.archive-all-photos>summary::-webkit-details-marker { display:none; }
.archive-all-photos>summary small { display:block; margin-top:5px; font-size:14px; line-height:1.5; font-weight:400; }
.archive-disclosure-icon { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; border:1px solid var(--poster-ink); font-size:26px; font-weight:400; }
.archive-disclosure-icon::after { content:'+'; }
.archive-all-photos[open] .archive-disclosure-icon::after { content:'−'; }
.archive-full-gallery { padding:0 20px 20px; }
#app .archive-full-gallery .archive-gallery-heading { padding:18px 0 14px; border-top:0; font-size:12px; }
#app .archive-full-gallery .archive-gallery { gap:14px; }
#app .archive-full-gallery .archive-gallery figure { background:var(--archive-wash); }
#app .archive-full-gallery .archive-gallery figcaption { padding:9px 11px; color:var(--poster-ink); font-size:11px; }
#app .archive-full-gallery .archive-pagination { margin-top:20px; padding-top:18px; font-size:13px; }
.archive-all-photos>summary:focus-visible,#app .archive-highlight>button:focus-visible { outline:3px solid var(--archive-rule); outline-offset:4px; }

@media(hover:hover) {
  #app .archive-collection:hover { transform:translateY(-3px); box-shadow:4px 7px 0 color-mix(in srgb,var(--poster-ink) 12%,transparent); }
  .archive-highlight>button:hover img { transform:scale(1.025); }
  .archive-all-photos>summary:hover { background:color-mix(in srgb,var(--archive-tone) 32%,var(--poster-paper)); }
}
@media(max-width:780px) {
  #app .archive-collections { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
  #app .archive-collection-label { display:block; padding:14px 12px; }
  #app .archive-collection-label h3 { margin-bottom:8px; font-size:28px; }
  #app .archive-collection-label>span { text-align:left; font-size:12px; gap:8px; }
  .archive-folder-tab { min-width:94px; padding-inline:10px; font-size:10px; }
  .archive-highlight-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .archive-highlight-lead { grid-column:1/-1; grid-row:auto; }
  .archive-highlight-lead img { aspect-ratio:16/9; min-height:0; }
}
@media(max-width:540px) {
  #app .archive-collections { grid-template-columns:1fr; gap:22px; }
  #app .archive-collection-photo img { aspect-ratio:16/9; }
  #app .archive-collection-label { display:flex; align-items:center; gap:18px; padding:16px; }
  #app .archive-collection-label h3 { margin:0; font-size:30px; }
  #app .archive-collection-label>span { margin-left:auto; text-align:right; font-size:12px; }
  .archive-highlights-heading { padding-top:14px; }
  #app .archive-highlights-heading h2 { font-size:28px; }
  .archive-highlight-grid { grid-template-columns:1fr; gap:16px; }
  .archive-highlight-lead { grid-column:auto; }
  .archive-highlight figcaption { min-height:0; padding:12px; gap:10px; }
  #app .archive-highlight figcaption p { font-size:16px; }
  #app .archive-planet .archive-downloads { padding:16px; }
  .archive-all-photos>summary { padding:16px; font-size:23px; }
  .archive-full-gallery { padding:0 12px 16px; }
}
@media(prefers-reduced-motion:reduce) {
  #app .archive-collection,.archive-highlight img { transition:none; }
  #app .archive-collection:hover,.archive-highlight>button:hover img { transform:none; }
}
