/* Board poster: local files only, portrait artwork is never cropped. */
.club-notice-strip { background: var(--surface-soft); border-bottom: 1px solid var(--border); padding: 1rem 0; }
.club-notice-strip__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.club-notice-strip__label { color: var(--muted); font-size: .78rem; font-weight: 700; }
.club-notice-strip p { margin: .2rem 0 0; font-weight: 700; }
.club-notice-strip__actions { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; flex-shrink: 0; }
.club-notice-button { display: inline-flex; justify-content: center; align-items: center; min-height: 44px; padding: .7rem 1rem; background: #315f2c; border: 1px solid #315f2c; border-radius: 10px; color: #fff; font: inherit; font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none; cursor: pointer; box-sizing: border-box; }
.club-notice-button:hover { background: #264e22; color: #fff; text-decoration: none; }
.club-notice-button--secondary { background: #f1f6eb; color: #31512a; border-color: #cfdec3; }
.club-notice-button--secondary:hover { background: #e4eddc; color: #31512a; }
.club-notice-link { text-decoration: underline; text-underline-offset: .2em; font-weight: 650; }
.club-notice-dialog { width: min(95vw, 980px); max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); border: 1px solid #d8e2cd; border-radius: 20px; padding: 0; background: #fff; color: #263c24; box-shadow: 0 24px 80px #15231155; overflow: hidden; color-scheme: light; }
.club-notice-dialog[open] { display: flex; flex-direction: column; }
.club-notice-dialog::backdrop { background: #14251199; }
.club-notice-dialog [hidden], .club-notice-strip [hidden] { display: none !important; }
.club-notice-dialog__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-shrink: 0; padding: 1.2rem 1.35rem; border-bottom: 1px solid #dce6d4; }
.club-notice-dialog__header p { margin: 0 0 .4rem; color: #637359; font-size: .75rem; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.club-notice-dialog h2 { margin: 0; line-height: 1.25; font-size: clamp(1.15rem, 3vw, 1.6rem); }
.club-notice-dialog h2:focus { outline: none; }
.club-notice-dialog__close { flex-shrink: 0; width: 44px; height: 44px; border: 1px solid #d9e3cf; border-radius: 50%; background: #f4f8ef; color: #315f2c; cursor: pointer; font-size: 1.7rem; line-height: 1; }
.club-notice-dialog__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: 1.4rem; padding: 1.3rem; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.club-notice-dialog__poster img { display: block; width: 100%; height: auto; border-radius: 10px; object-fit: contain; }
.club-notice-dialog__text { min-width: 0; }
.club-notice-dialog__text p { line-height: 1.75; margin: 1.1rem 0; }
.club-notice-dialog__badge { display: inline-block; padding: .4rem .65rem; border: 1px solid #dfc975; border-radius: 8px; background: #fff7da; color: #665111; font-size: .85rem; font-weight: 700; }
.club-notice-dialog__signature { color: #64745a; font-size: .9rem; }
.club-notice-dialog__actions { display: flex; flex-wrap: wrap; gap: .65rem; padding: 1rem 1.3rem; border-top: 1px solid #dce6d4; background: #fff; flex-shrink: 0; }
.club-notice-dialog :focus-visible, .club-notice-strip :focus-visible { outline: 3px solid #638a3d; outline-offset: 3px; }
.notice-card--announcement { scroll-margin-top: 125px; }
.notice-card--announcement .notice-media { align-self: start; }
.notice-card--announcement .notice-media img { height: auto; aspect-ratio: auto; object-fit: contain; }
@media (max-width: 700px) { .club-notice-dialog__body { grid-template-columns: 1fr; gap: 1rem; padding: 1rem; } .club-notice-dialog__header { padding: .9rem 1rem; gap: .6rem; } .club-notice-dialog__actions { padding: .8rem 1rem; } .club-notice-dialog__actions > * { flex: 1 1 140px; } .club-notice-strip__inner { align-items: flex-start; flex-direction: column; } .club-notice-strip__actions { flex-shrink: 1; } .notice-card--announcement .notice-media img { max-width: 420px; margin: auto; } }
@media (max-height: 500px) { .club-notice-dialog__header { padding: .6rem 1rem; } .club-notice-dialog__actions { padding: .6rem 1rem; } }
