/* Holiday Spelling pages (2026-11-05). Each holiday sets its colors as --hs-a (accent), --hs-t
   (tint), --hs-b (border), --hs-d (dark) on .hs (holidays.php). */
.hs{ max-width:1040px; margin:0 auto; --hs-a:#b5541c; --hs-t:#fbf1ea; --hs-b:#efcfb8; --hs-d:#6b4a1e; }
.hs_pills{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin:6px 0 18px; }
.hs_pills a{ border:1px solid #ccc; background:#f6f8fa; border-radius:6px; padding:6px 16px; font-size:15px; color:#333; text-decoration:none; }
.hs_pills a[aria-current="true"]{ background:var(--hs-a); border-color:var(--hs-a); color:#fff; }
.hs_band{ margin-bottom:34px; scroll-margin-top:12px; }
.hs_band_title{ font-size:20px; margin:0 0 10px; color:var(--hs-a); }
.hs_js .hs_band{ display:none; }
.hs_js .hs_band.hs_on{ display:block; }
.hs_js .hs_band_title{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.hs_list{ border:1px solid var(--hs-b); background:var(--hs-t); border-radius:12px; padding:12px 16px; display:flex; align-items:center; gap:16px; margin-bottom:22px; }
.hs_list p{ flex:1; margin:0; font-size:15px; color:var(--hs-d); line-height:1.6; }
.hs_list b{ color:var(--hs-a); }
.hs_btn{ background:#22659e; color:#fff !important; border-radius:6px; padding:9px 14px; font-size:14px; text-decoration:none; white-space:nowrap; }
.hs_btn:hover{ background:#1b5180; }
.hs h3{ font-size:18px; margin:0 0 12px; border-bottom:1px solid #ddd; padding-bottom:4px; }
.hs_grid{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:16px; margin-bottom:24px; }
.hs_card{ border:1px solid #ddd; border-radius:8px; padding:8px 8px 10px; text-align:center; font-size:14px; display:flex; flex-direction:column; background:#fff; }
.hs_card > a:first-child{ color:#222; text-decoration:none; }
.hs_card img{ width:100%; height:auto; border:1px solid #eee; display:block; margin-bottom:6px; aspect-ratio:408/528; }
.hs_noimg{ display:flex; align-items:center; justify-content:center; aspect-ratio:408/528; border:1px dashed var(--hs-b); background:var(--hs-t); color:var(--hs-a); margin-bottom:6px; font-size:15px; }
.hs_collage{ display:grid; grid-template-columns:repeat(3, 1fr); grid-auto-rows:1fr; gap:6%; padding:10% 8%; aspect-ratio:408/528; border:1px solid #eee; background:#fff; margin-bottom:6px; box-sizing:border-box; align-content:center; }
.hs_collage img{ width:100%; aspect-ratio:1; object-fit:contain; border:0; margin:0; }
.hs_name{ display:block; font-weight:600; }
.hs_what{ display:block; color:#666; font-size:12.5px; margin:2px 0 6px; line-height:1.35; flex:1; }
.hs_acts{ display:flex; justify-content:center; align-items:center; gap:12px; flex-wrap:wrap; }
.hs_dl{ color:#22659e; font-size:13px; }
.hs_assign{ font:inherit; font-size:13px; color:#22659e; background:none; border:0; padding:0; text-decoration:underline; cursor:pointer; }
.hs_assign[disabled]{ color:#888; cursor:wait; }
.hs_more{ text-align:center; color:#555; font-size:14px; line-height:1.8; }
/* hub */
.hs_hub_grid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px; margin:6px 0 30px; }
.hs_hub_card{ position:relative; display:flex; flex-direction:column; gap:6px; border:1px solid var(--hs-b); background:var(--hs-t); border-radius:12px; padding:16px; text-decoration:none; color:#333; }
.hs_hub_card:hover{ border-color:var(--hs-a); }
.hs_hub_card.hs_now{ border-width:2px; border-color:var(--hs-a); }
.hs_hub_name{ font-size:20px; font-weight:700; color:var(--hs-a); }
.hs_hub_words{ font-size:14px; color:#555; }
.hs_hub_meta{ font-size:12.5px; color:#777; }
.hs_badge{ position:absolute; top:12px; right:12px; background:var(--hs-a); color:#fff; font-size:12px; font-weight:700; border-radius:10px; padding:2px 9px; }
.hs_badge.hs_soon{ background:#fff; color:var(--hs-a); border:1px solid var(--hs-a); }
@media (max-width: 800px){
	.hs_grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; }
	.hs_hub_grid{ grid-template-columns:1fr; }
	.hs_list{ flex-direction:column; align-items:stretch; text-align:left; }
	.hs_btn{ text-align:center; white-space:normal; }
}
