/* Annual gallery — layered over showcase.css; parchment palette, centered. */
:root { --field-border: rgba(74,63,48,.28); --panel-border: rgba(74,63,48,.2); }
.season-1{--accent:#5E81AC;} .season-2{--accent:#81A1C1;} .season-3{--accent:#8FBCBB;}
.season-4{--accent:#A3BE8C;} .season-5{--accent:#94B87E;} .season-6{--accent:#D9BB77;}
.season-7{--accent:#DDA96F;} .season-8{--accent:#D08770;} .season-9{--accent:#C77468;}
.season-10{--accent:#BF616A;} .season-11{--accent:#B48EAD;} .season-12{--accent:#8A8EB0;}

.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

.gallery-nav-link{display:block;text-align:center;margin:0 0 2.5rem;
  font-family:'Cormorant SC',serif;font-style:normal;font-size:.75rem;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);
  text-decoration:none;transition:color .3s;}
.gallery-nav-link:hover,.gallery-nav-link:focus{color:var(--gold);}

.gallery-masthead{text-align:center;margin-bottom:2rem;}
.gallery-title{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;
  font-style:normal;font-size:2.6rem;letter-spacing:.06em;color:var(--ink-mid);
  margin:0;}
/* Medium key — centered beneath the figure, like a plate caption. */
.legend{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;
  list-style:none;padding:0;margin:0 0 2.5rem;
  font-family:'Cormorant SC',serif;font-style:normal;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-light);}
.legend li{display:flex;align-items:center;gap:.4rem;}
.legend .shape{width:12px;height:12px;background:var(--ink-faint);display:inline-block;}
.legend .shape-image{border-radius:50%;}
.legend .shape-both{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);}
.legend .shape-sound{clip-path:polygon(50% 0,100% 100%,0 100%);}
.legend .shape-video{width:16px;height:11px;border-radius:2px;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 62%,4px 50%,0 38%);}

.gallery-fields{display:flex;gap:12px;align-items:flex-start;
  width:max-content;max-width:100%;margin:1.5rem auto 1.4rem;
  overflow-x:auto;padding-bottom:.5rem;}
.gallery-field{flex:0 0 52px;text-align:center;}
.field-well{position:relative;width:52px;height:342px;border:1px solid var(--field-border);
  border-radius:7px;background:transparent;}
.field-well.upcoming{border-style:dashed;opacity:.5;}
.field-label{margin-top:.5rem;font-family:'Cormorant SC',serif;font-style:normal;
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-light);}
.field-upcoming{font-size:.68rem;font-style:italic;color:var(--ink-faint);opacity:.7;}

.shape-btn{position:absolute;width:14px;height:14px;padding:0;border:0;cursor:pointer;
  background:var(--accent);transition:transform .12s ease,opacity .2s ease;}
/* Viewed shapes fade so you can tell what you've already opened. */
.shape-btn.seen{opacity:.4;}
.shape-btn.m-image{border-radius:50%;}
.shape-btn.m-both{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);}
.shape-btn.m-sound{clip-path:polygon(50% 0,100% 100%,0 100%);}
.shape-btn.m-video{width:18px;height:12px;border-radius:2px;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 62%,4px 50%,0 38%);}
.shape-btn:hover,.shape-btn:focus-visible{transform:scale(1.28);z-index:2;}
.shape-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.shape-more{position:absolute;left:6px;width:40px;height:14px;padding:0;border:0;
  background:transparent;color:var(--accent);font-size:.7rem;cursor:pointer;}

.gallery-preview{position:fixed;z-index:10;max-width:250px;padding:13px;
  border:1px solid var(--panel-border);background:var(--parchment-warm);
  font-size:.85rem;color:var(--ink-mid);pointer-events:none;}
.gallery-preview .preview-crop{width:132px;height:132px;overflow:hidden;
  margin:0 auto .4rem;}
.gallery-preview .preview-crop img{width:132px;height:132px;display:block;
  object-fit:cover;transform:scale(2.4);}
.gallery-preview .date{color:var(--ink-faint);font-size:.72rem;margin-bottom:.3rem;}

.gallery-panel{max-width:640px;margin:1rem auto 2rem;
  border:1px solid var(--panel-border);border-radius:11px;padding:34px;
  min-height:200px;background:var(--parchment-warm);}
.gallery-panel .date{color:var(--ink-faint);font-size:.8rem;margin-bottom:.6rem;}
.gallery-panel img,.gallery-panel video,.gallery-panel iframe{max-width:100%;}
.gallery-panel .body{white-space:pre-line;}
.gallery-panel .translation{white-space:pre-line;margin-top:1rem;color:var(--ink-light);}
.gallery-panel .meta{color:var(--ink-faint);font-size:.8rem;margin-top:1rem;}
.gallery-panel .more-list{list-style:none;padding:0;margin:0;}
.gallery-panel .more-list li{margin:.3rem 0;}
.gallery-panel .more-item{background:transparent;border:0;padding:0;cursor:pointer;
  font:inherit;color:var(--ink-mid);text-align:left;}
.gallery-panel .more-item:hover,.gallery-panel .more-item:focus{color:var(--gold);}
.gallery-help{text-align:center;color:var(--ink-faint);font-size:.85rem;}

.gallery-baseline{max-width:640px;margin:0 auto;}

@media (max-width:720px){ .gallery-panel{padding:20px;} }
@media (prefers-reduced-motion: reduce){
  .shape-btn{transition:none;}
  *{scroll-behavior:auto !important;}
}

/* Rendered Markdown inside the reading panel */
.gallery-panel .body h2,
.gallery-panel .body h3,
.gallery-panel .body h4 {
  font-weight: 600;
  line-height: 1.25;
  margin: 1.1em 0 0.4em;
}
.gallery-panel .body h2 { font-size: 1.3em; }
.gallery-panel .body h3 { font-size: 1.12em; }
.gallery-panel .body h4 { font-size: 1em; }
.gallery-panel .body p { margin: 0 0 0.7em; }
.gallery-panel .body ul { margin: 0 0 0.7em; padding-left: 1.3em; }
.gallery-panel .body li { margin: 0.15em 0; }
.gallery-panel .body hr {
  border: 0;
  border-top: 1px solid currentColor;
  opacity: 0.25;
  margin: 1.2em 0;
}
.gallery-panel .body a {
  color: var(--rust);
  text-decoration: underline;
  text-decoration-color: var(--rust-light);
  text-underline-offset: 2px;
}
.gallery-panel .body a:hover,
.gallery-panel .body a:focus { color: var(--rust-light); }
