/* Original event artwork is framed around the subject, with text kept separate. */
.calendar-event-badge {
  width:54px;
  height:54px;
  overflow:hidden;
  border:1px solid #d8b66f;
  border-radius:7px;
  background:radial-gradient(ellipse at top,#52614b,#25332b 75%);
  box-shadow:inset 0 0 0 2px #292016,0 3px 5px #0006;
  font-size:13px;
}
.calendar-event-badge::after { position:absolute; inset:0; content:''; border:2px solid #d9b77242; border-radius:6px; pointer-events:none; box-shadow:inset 0 1px 0 #ffedc45e; }
.calendar-event-badge img { object-fit:cover; transition:transform 200ms ease; }
.calendar-badge-initials { color:#ddc28a; font-weight:650; }
.calendar-reset-symbol { width:24px; height:28px; border:0; border-radius:0; background:none; }
.calendar-reset-symbol img { display:block; width:20px; height:24px; object-fit:contain; filter:drop-shadow(0 2px 1px #0007); }

/* A quiet heading and three useful, easy-to-scan event cards on the calculator. */
.events-now-strip {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  grid-template-areas:"heading reset more" "items items items";
  align-items:center;
  gap:10px 18px;
  padding:12px 14px 14px;
  border:1px solid #8b704344;
  border-radius:7px;
  background:linear-gradient(115deg,#28342c55,#1c1c228c 75%);
  box-shadow:inset 0 1px 0 #dcc2870b;
}
.events-now-heading { grid-area:heading; display:flex; flex-wrap:wrap; gap:8px; }
.events-now-heading h2 { color:#e6d3ae; font-size:13px; font-weight:650; }
.events-now-units { color:#a69b83; font-size:10px; margin-left:3px; letter-spacing:.08em; }
.calendar-live-dot { width:6px; height:6px; background:#b5cb8a; box-shadow:0 0 0 3px #b5cb8a13; }
.events-reset-chip { grid-area:reset; border:0; padding:0; margin:0; gap:7px; }
.events-reset-chip strong { display:flex; flex-wrap:wrap; align-items:baseline; gap:7px; font-size:10px; }
.events-reset-chip strong b { font-size:11px; }
.events-reset-chip small { font-size:9px; }
.events-reset-chip .calendar-countdown { font-size:10px; }
.events-reset-chip .calendar-reset-symbol { display:grid; }
.events-now-link { grid-area:more; order:initial; margin:0; font-size:11px; gap:8px; }
.events-now-items { grid-area:items; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; width:100%; }
.events-now-item { position:relative; display:flex; width:100%; min-width:0; min-height:76px; max-width:none; gap:12px; padding:9px 12px 9px 9px; border:1px solid #9e804743; border-radius:6px; background:linear-gradient(110deg,#3b372a88,#22262a7d); box-shadow:inset 0 1px 0 #f2d5910b; transition:border-color 180ms ease,background 180ms ease; }
.events-now-copy { display:flex; flex:1; flex-direction:column; align-items:flex-start; gap:5px; min-width:0; }
.events-now-copy strong { display:block; max-width:100%; white-space:normal; overflow:visible; text-overflow:clip; font-size:13px; font-weight:600; line-height:1.35; color:#e9decb; }
.events-now-time { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; }
.events-now-time > span { color:#a99d87; font-size:10px; }
.events-now-time .calendar-countdown { font-size:14px; letter-spacing:.03em; color:#f0d195; }
.events-now-empty { grid-column:1 / -1; padding:3px 0; }
.events-now-stale { grid-column:1 / -1; margin:0; font-size:11px; }
.events-now-strip:has(.events-now-stale) { display:grid; }
.events-now-item:focus-visible { outline-offset:2px; border-color:#d9b56b; }

/* Full calendar: compact settings, game banner cards, then a clear week plan. */
#calendar-page { margin-top:22px; }
.calendar-page-heading { margin-bottom:12px; }
.calendar-page-heading::before { top:0; left:0; }
.calendar-page-heading::after { top:0; right:0; }
.calendar-page-heading h1 { font-size:21px; }
.calendar-page-heading p { font-size:12px; }
.calendar-refresh { min-height:38px; padding:7px 13px; }
.calendar-time-options { margin:0 0 18px; border:1px solid #8470454a; border-radius:5px; background:#ffffff03; }
.calendar-time-options > summary { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:7px 18px; min-height:42px; padding:10px 13px; list-style:none; cursor:pointer; color:#c4b699; font-size:12px; }
.calendar-time-options > summary::-webkit-details-marker,.calendar-current-events > summary::-webkit-details-marker { display:none; }
.calendar-time-options > summary > span:last-child { display:flex; align-items:center; gap:13px; color:#e0c89b; font-size:11px; }
.calendar-time-options .calendar-timebar { margin:0; padding:15px 13px; border:0; border-top:1px solid #84704537; border-radius:0 0 5px 5px; background:#1c2521a8; }
.calendar-section-chevron { display:inline-block; font-size:17px; line-height:1; color:#d3b775; transition:transform 180ms ease; }
details[open] > summary .calendar-section-chevron { transform:rotate(180deg); }
.calendar-time-options > summary:focus-visible,.calendar-current-events > summary:focus-visible { outline:2px solid #edce8b; outline-offset:3px; }
.calendar-current-events { margin:0 0 25px; border:1px solid #9c7a454f; border-radius:6px; background:linear-gradient(130deg,#2b31252c,#201e24); box-shadow:0 4px 14px #0002; }
.calendar-current-events > summary { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:12px 15px; list-style:none; cursor:pointer; background:var(--game-woodgrain); border-radius:5px; color:#efd9ac; font-size:16px; font-weight:600; }
.calendar-current-events[open] > summary { border-bottom:1px solid #9c7a453b; border-radius:5px 5px 0 0; }
.calendar-current-events > summary > span:first-child { display:flex; align-items:center; gap:10px; }
.calendar-section-count { display:inline-grid; place-items:center; min-width:24px; min-height:22px; padding:1px 5px; border:1px solid #c0a3694d; border-radius:5px; background:#1f2a2090; color:#e5d4a4; font-size:11px; font-weight:550; }
.calendar-current-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:13px; }
.calendar-highlight { position:relative; isolation:isolate; min-width:0; min-height:128px; overflow:hidden; border:1px solid #be9c57a3; border-radius:5px; background:#29352a; box-shadow:inset 0 0 0 2px #171c15,0 3px 5px #0004; }
.calendar-highlight::after { position:absolute; inset:0; z-index:-1; content:''; pointer-events:none; background:linear-gradient(90deg,#101d1af2 0%,#15251be8 22%,#192a2294 53%,#172c210b 100%); }
.calendar-highlight-art { position:absolute; z-index:-2; inset:0; display:grid; place-items:center; background:radial-gradient(ellipse at top right,#536b40,#223329); color:#77926b; font:600 42px/1 var(--serif); }
.calendar-highlight-art.has-art > span { visibility:hidden; }
.calendar-highlight-art img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; }
.calendar-highlight-art img[hidden] { display:none; }
.calendar-highlight-copy { display:flex; position:relative; flex-direction:column; align-items:flex-start; min-height:126px; max-width:84%; padding:12px; text-shadow:0 1px 3px #000b; }
.calendar-highlight-status { display:flex; align-items:center; gap:6px; color:#d2dfae; font-size:9px; line-height:1.4; }
.calendar-highlight-status .calendar-live-dot { width:4px; height:4px; }
.calendar-highlight h3 { margin:6px 0 9px; color:#fff0cf; font:650 14px/1.35 var(--sans); }
.calendar-highlight-time { display:flex; flex-direction:column; gap:2px; margin-top:auto; }
.calendar-highlight-time > span { color:#c1c5ae; font-size:9px; }
.calendar-highlight-time .calendar-countdown { color:#f4d696; font-size:15px; font-weight:700; }
.calendar-schedule-title { margin:0 0 13px; color:#ebd8b2; font:600 20px/1.3 var(--serif); }
.calendar-toolbar { gap:13px 20px; margin-bottom:15px; }
.calendar-week-navigation { gap:6px; }
.calendar-week-navigation button { min-height:36px; min-width:36px; }
.calendar-week-navigation h2 { color:#e4d6bc; font-size:15px; }
.calendar-time-format { color:#b4a484; font-size:11px; }
.calendar-week-board { padding:0 12px 14px; border-color:#9b7c454f; background:linear-gradient(110deg,#272c2240,#1b1d2280); }
.calendar-week-days { margin:0 -12px 12px; background:var(--game-woodgrain); border-bottom-color:#a482484a; }
.calendar-week-day { flex-direction:column; align-items:center; gap:3px; padding:11px 5px 12px; color:#c0ad8d; font-size:11px; }
.calendar-week-day strong { color:#e6d4b0; font-size:21px; }
.calendar-week-day.is-today { background:linear-gradient(180deg,#456444,#233d2c); }
.calendar-week-day.is-today strong { color:#ffe4a4; }
.calendar-week-day.is-today::after { left:0; right:0; height:3px; background:#d1b06c; }
.calendar-week-events { grid-template-rows:repeat(var(--calendar-rows,2),minmax(76px,auto)); gap:8px 6px; }
.calendar-event-bar { position:relative; min-height:76px; gap:9px; padding:10px; border:1px solid #8b74414d; border-left:3px solid #ae8d52; border-radius:5px; background:linear-gradient(105deg,#39392b70,#24272b); }
.calendar-event-bar .calendar-event-badge { width:40px; height:40px; border-radius:5px; }
.calendar-event-bar h3 { margin-bottom:6px; white-space:normal; overflow:visible; text-overflow:clip; color:#e9ddc6; font-size:12px; font-weight:600; line-height:1.35; }
.calendar-event-bar p { color:#bcad94; font-size:11px; }
.calendar-event-bar.is-active { border-color:#a8945e82; border-left-color:#c9c786; background:linear-gradient(105deg,#3e4a2a99,#28372c); }
.calendar-event-bar.is-ended { opacity:.52; }
.calendar-event-bar.is-projected { opacity:.72; }
.calendar-event-bar[style*="span 1"] { flex-direction:column; align-items:flex-start; justify-content:center; }
.calendar-event-bar[style*="span 1"] .calendar-event-badge { display:grid; width:34px; height:34px; }
.calendar-event-bar .calendar-countdown { font-size:12px; }
.calendar-footer { margin-top:16px; padding-top:12px; border-top:1px solid #8974432b; font-size:11px; }
@media(hover:hover) and (pointer:fine){
 .events-now-item:hover { border-color:#bc9d5c9c; background:linear-gradient(110deg,#454b3288,#2a302b); }
 .events-now-item:hover .calendar-event-badge img { transform:scale(1.09); }
 .calendar-highlight:hover { border-color:#e3c27b; }
}
@media(max-width:1150px){
 .calendar-current-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .events-now-item { gap:10px; padding-right:9px; }
 .events-now-copy strong { font-size:12px; }
}
@media(max-width:1000px){
 .calendar-agenda { display:grid; gap:10px; }
 .calendar-agenda-event { align-items:center; padding:13px; border:1px solid #8c744541; border-left:3px solid #a58b58; border-radius:6px; background:linear-gradient(100deg,#313a2a70,#21252a); }
 .calendar-agenda-event.is-active { border-left-color:#b1c07f; background:linear-gradient(100deg,#45513660,#243227); }
 .calendar-agenda-event.is-ended { opacity:.55; }
 .calendar-agenda-event .calendar-event-badge { width:55px; height:55px; }
 .calendar-agenda-copy h3 { color:#ecdec4; font-size:14px; font-weight:600; }
 .calendar-agenda-copy p { font-size:11px; }
 .calendar-agenda-state { font-size:11px; }
 .calendar-agenda-state .calendar-countdown { font-size:14px; }
}
@media(max-width:700px){
 .calendar-page-heading { display:grid; grid-template-columns:minmax(0,1fr) 36px; align-items:center; gap:10px; padding:12px; }
 .calendar-page-heading > div { width:auto; min-width:0; }
 .calendar-page-heading h1 { min-width:0; padding:10px 20px; font-size:17px; }
 .calendar-page-heading p { font-size:11px; text-align:left; }
 .calendar-page-heading .calendar-refresh { width:36px; min-width:36px; margin:0; }
 .events-now-strip { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"heading more" "items items" "reset reset"; gap:10px; padding:11px; }
 .events-now-heading h2 { font-size:12px; }
 .events-now-heading { gap:6px; }
 .events-now-units { font-size:9px; }
 .events-now-items { grid-template-columns:minmax(0,1fr); order:initial; gap:7px; }
 .events-now-item { min-height:62px; gap:11px; padding:8px; }
 .events-now-item .calendar-event-badge { width:45px; height:45px; }
 .events-now-copy { gap:3px; }
 .events-now-copy strong { font-size:12px; }
 .events-now-time .calendar-countdown { font-size:13px; }
 .events-now-time > span { font-size:10px; }
 .events-reset-chip { justify-self:start; margin:1px 0 0; padding:0; gap:7px; }
 .events-reset-chip .calendar-reset-symbol { width:18px; height:23px; }
 .events-reset-chip .calendar-reset-symbol img { width:17px; height:20px; }
 .events-reset-chip > span:last-child { display:flex; flex-wrap:wrap; align-items:baseline; gap:3px 9px; }
 .events-reset-chip strong { gap:6px; }
 .events-reset-chip small { justify-content:flex-start; }
 .events-now-link { font-size:11px; }
 .events-now-stale { order:initial; }
 .calendar-time-options > summary { font-size:11px; padding:10px 11px; }
 .calendar-time-options > summary > span:last-child { font-size:10px; gap:8px; }
 .calendar-current-events > summary { padding:12px; font-size:14px; }
 .calendar-current-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:10px; }
 .calendar-highlight { min-height:128px; }
 .calendar-highlight-copy { min-height:126px; max-width:96%; padding:10px; }
 .calendar-highlight::after { background:linear-gradient(90deg,#101d1ae8,#15251bd9 35%,#192a2266 80%); }
 .calendar-highlight h3 { font-size:12px; margin:6px 0 8px; }
 .calendar-highlight-time .calendar-countdown { font-size:14px; }
 .calendar-highlight-status { font-size:9px; }
 .calendar-schedule-title { font-size:19px; margin-bottom:11px; }
 .calendar-toolbar { align-items:flex-start; gap:10px; }
 .calendar-toolbar-notes { align-items:flex-start; }
 .calendar-week-navigation h2 { margin-top:5px; font-size:14px; }
 .calendar-mini-toggle { font-size:11px; }
 .calendar-agenda-event { display:grid; grid-template-columns:48px minmax(0,1fr); gap:7px 11px; padding:12px; }
 .calendar-agenda-event .calendar-event-badge { grid-row:1 / span 2; width:48px; height:48px; align-self:center; }
 .calendar-agenda-copy { min-width:0; }
 .calendar-agenda-copy h3 { font-size:13px; }
 .calendar-agenda-copy p { font-size:10px; gap:3px 6px; }
 .calendar-agenda-state { grid-column:2; margin:0; max-width:none; font-size:10px; align-items:center; }
 .calendar-agenda-state .calendar-countdown { font-size:13px; }
}
@media(prefers-reduced-motion:reduce){
 .calendar-event-badge img,.events-now-item,.calendar-section-chevron { transition:none; }
 .events-now-item:hover .calendar-event-badge img { transform:none; }
}