.calendar{--bg:#05060f;--glow:#0d2a4a;--accent:#1de9d6;--accent-text:#04211f;--rim:#1de9d6;--text:#fff;--font:system-ui, sans-serif;box-sizing:border-box;background:radial-gradient(circle at 50% 0%, var(--glow), var(--bg) 70%);min-height:100dvh;color:var(--text);font-family:var(--font);position:relative;overflow-x:hidden}.calendar *,.calendar :before,.calendar :after{box-sizing:border-box}.calendar-main{max-width:60rem;margin:0 auto;padding:.5rem 1rem 2.5rem;position:relative}.calendar-title{text-align:center;font:700 clamp(1.5rem, 5vw, 2.4rem)/1.15 var(--font-display,var(--font));margin:.5rem 0 .25rem}.calendar-kicker{text-align:center;opacity:.85;margin:0 0 1.25rem}.calendar-grid{grid-template-columns:repeat(auto-fill,minmax(min(6.5rem,28vw),1fr));gap:.6rem;margin:0;padding:0;list-style:none;display:grid}.calendar-door{aspect-ratio:1}.door-face{text-align:center;width:100%;height:100%;color:inherit;border:1px solid color-mix(in srgb, var(--rim) 40%, transparent);background:color-mix(in srgb, var(--text) 7%, transparent);border-radius:.8rem;flex-direction:column;justify-content:center;align-items:center;gap:.25rem;padding:.4rem;text-decoration:none;display:flex;position:relative;overflow:hidden}.door-number{font:700 clamp(1.4rem, 6vw, 2rem)/1 var(--font-display,var(--font));position:relative}.door-note{font-size:.78rem;line-height:1.2;position:relative}.door-image{object-fit:cover;opacity:.35;width:100%;height:100%;position:absolute;inset:0}.calendar-door[data-state=open] .door-face{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}.calendar-door[data-state=open] .door-face:hover{filter:brightness(1.08)}.calendar-door[data-state=open] .door-face:focus-visible{outline:3px solid var(--text);outline-offset:3px}.calendar-door[data-state=opened] .door-face{border-style:dashed}.calendar-door[data-state=missed] .door-face,.calendar-door[data-state=ended] .door-face{opacity:.6}.calendar-door[data-today] .door-face{box-shadow:0 0 0 2px var(--rim)}@media (prefers-reduced-motion:no-preference){.calendar-door[data-state=open][data-today] .door-face{animation:2.4s ease-in-out infinite door-glow}}@keyframes door-glow{50%{box-shadow:0 0 0 2px var(--rim), 0 0 1.2rem color-mix(in srgb, var(--accent) 60%, transparent)}}.calendar.embedded{min-height:0}