/* 24周年の仮告知。既存の styles.css に重ねて利用します。 */
.draft-note { padding: 9px 16px; text-align: center; background: #eeeafb; color: #493a96; font-size: .8rem; }
.header-container { gap: 22px; flex-wrap: wrap; }
.logo { flex: 0 1 440px; }
.main-nav a { white-space: nowrap; }
.main-nav ul { flex-wrap: wrap; gap: 12px 20px; }
.nav-toggle { border: 0; background: transparent; padding: 0; }
.tag { background: #6351cc; }
.grid-layout > * { min-width: 0; }
.archive-link { margin-top: 22px; font-size: .9rem; }
.anniversary-banner { display: block; padding: 26px 14px; border: 2px solid #e8bd65; border-radius: 8px; color: #fff1ba; background: linear-gradient(115deg, #35271018, #35271018), url('img/8th_ucbak.jpg') center/cover; box-shadow: inset 0 0 0 3px #ffffff40; text-shadow: 0 2px 4px #3d2c19, 0 0 8px #3d2c1960; }
.event-link .anniversary-banner span { color: #fffdf5; }
.anniversary-banner strong { display: block; color: #fff1ba; font-size: clamp(1.7rem,4vw,2.6rem); margin: 4px 0 12px; }
.anniversary-banner strong span { font-size: .7em; }
.anniversary-banner .banner-kicker { font-size: .9rem; }
.event-link .anniversary-banner .banner-caption { display: inline-block; padding: 6px 10px; border-radius: 6px; background: #fffaf0e6; color: #533f2c; text-shadow: none; font-size: .8rem; font-weight: 500; }
.event-link > span:last-child:not(.anniversary-banner) { margin-top: 14px; }
.compact-banner { padding: 0; margin-top: 0; }
.anniversary-hero { position: relative; isolation: isolate; overflow: hidden; background: #c5ae81; padding: 75px 20px; margin-bottom: 48px; color: #fffdf5; text-align: center; border-bottom: 4px solid #e8bd65; }
.anniversary-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: url('img/8th_ucbak.jpg') center/cover; }
.anniversary-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(#35271014,#35271014); }
.anniversary-heading { max-width: 820px; margin: auto; }
.anniversary-kicker { font-size: .8rem; letter-spacing: .2em; font-weight: 700; color: #fff4d5; text-shadow: 0 2px 4px #3d2c19; }
.anniversary-heading h1 { font-size: clamp(1.15rem,3vw,1.6rem); margin: 16px 0; color: #fffdf5; text-shadow: 0 2px 4px #3d2c19, 0 0 12px #3d2c1980; }
.anniversary-heading h1 span { display: block; font-size: clamp(1.7rem,5vw,3.2rem); }
.anniversary-heading h1 b { color: #ffdc80; font-size: 1.8em; line-height: 1.2; text-shadow: 0 2px 4px #654520; }
.anniversary-heading > p:not(.anniversary-kicker) { font-weight: 700; text-shadow: 0 2px 4px #3d2c19, 0 0 8px #3d2c1980; }
.hero-status { display: inline-block; margin-top: 24px; padding: 10px 20px; border: 2px solid white; border-radius: 30px; font-size: .85rem; font-weight: 700; color: white; background: #b83073; box-shadow: 0 4px 14px #b8307325; }
.main-column .card > p { margin-bottom: 18px; line-height: 1.9; }
.anniversary-photo { margin: 28px auto; max-width: 500px; }
.anniversary-photo img { border-radius: 8px; width: 100%; }
figcaption { color: #636e72; font-size: .8rem; text-align: center; margin-top: 9px; }
.pending-box { border-left: 4px solid var(--main-color); background: #f3f0fd; padding: 20px; margin: 24px 0; border-radius: 0 8px 8px 0; }
.pending-box h3 { font-size: 1.05rem; margin-bottom: 10px; color: #4e3caa; }
.pending-box p { line-height: 1.9; }
.event-facts > div { display: grid; grid-template-columns: 110px 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid #ece8f4; }
.event-facts dt { font-weight: 700; }
.event-facts dd span { display: block; color: #636e72; font-size: .8rem; margin-top: 5px; }
.schedule-card { padding: 22px; margin-top: 20px; border-left: 4px solid #c49950; background: #fcf8ef; border-radius: 0 8px 8px 0; }
.schedule-card h3 { margin-bottom: 12px; color: #553d67; }
.schedule-card time { font-weight: 700; color: #674d24; }
.schedule-card p { line-height: 1.9; }
.schedule-detail { margin-top: 18px; padding-inline: 14px; }
#schedule { scroll-margin-top: 150px; }
.portal-hero { padding: 58px 20px; }
.portal-hero h1 { font-size: clamp(1.7rem, 4.5vw, 2.8rem); }
.portal-photo { max-width: 600px; }
.portal-rules { padding-left: 28px; }
.portal-rules li { padding: 0 0 20px 8px; margin-bottom: 20px; border-bottom: 1px solid #ece8f4; }
.portal-rules li:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: 0; }
.portal-rules li::marker { color: #6351cc; font-size: 1.15rem; font-weight: 700; }
.portal-rules h3 { color: #553d67; font-size: 1.1rem; margin-bottom: 8px; }
.portal-rules p { line-height: 1.9; }
.past-event { display: block; color: var(--text-color); padding: 22px 0 22px 18px; border-left: 4px solid #b3a5e9; margin-top: 24px; background: #faf9fd; border-radius: 0 8px 8px 0; }
.past-label { font-size: .75rem; color: #66549b; }
.past-event h3 { margin: 8px 0; }
.past-event p { font-size: .95rem; margin-bottom: 8px; padding-right: 16px; }
.past-event > span:last-child { font-size: .85rem; color: #6351cc; }
a:focus-visible,button:focus-visible { outline: 3px solid #bb7b28; outline-offset: 5px; }
@media(min-width: 769px) and (max-width: 1100px) { .header-container { justify-content: center; } }
@media(max-width: 768px) {
  .header-container { gap: 12px; }
  .logo { flex: 1 1 auto; width: auto; margin: 0; max-width: calc(100% - 50px); }
  .main-nav { visibility: hidden; }
  .main-nav.active { visibility: visible; }
  .anniversary-hero { padding: 50px 16px; margin-bottom: 30px; }
  .event-facts > div { grid-template-columns: 1fr; gap: 6px; }
  #schedule { scroll-margin-top: 85px; }
}
@media(prefers-reduced-motion: reduce) { *,*::before,*::after { transition: none !important; scroll-behavior: auto !important; } }