/* Illustrated camp stories. */
.story-trigger { display:block; width:100%; margin:15px 0 0; padding:10px 0 0; border:0; border-top:1px solid #8d674137; color:#376c66; background:transparent; text-align:left; font:900 13px/1.6 var(--body); cursor:pointer; }
.story-trigger::before { content:'▸'; display:inline-block; margin-right:6px; transition:transform .2s; }
.story-trigger[aria-expanded="true"]::before { transform:rotate(90deg); }
.story-trigger small { margin-left:5px; font-size:10px; letter-spacing:.05em; }
.story-trigger:focus-visible { outline:3px solid #176bca; outline-offset:3px; }
.story-schedule { grid-column:1/-1; grid-row:2; position:relative; margin:6px 0 26px; border:1px solid #8f714c66; border-radius:12px 28px 12px 28px; background:#fff5df; box-shadow:0 10px 0 #87623712; }
.story-schedule[hidden] { display:none; }
.story-panel { padding:25px 28px 28px; }
.story-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding:0 0 20px; }
.story-toolbar p { margin:0; color:#786344; font-size:13px; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.story-card { position:relative; overflow:hidden; border:1px solid #b69a7055; border-radius:8px 23px 8px 23px; background:#fffaf0; box-shadow:3px 4px 0 #8762370b; }
.story-scene { position:relative; aspect-ratio:1.78; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#eee4c9; }
.story-card:nth-child(2) .story-scene { background:#e4e6cb; }
.story-card:nth-child(3) .story-scene { background:#f1dcc1; }
.story-card:nth-child(4) .story-scene { background:#d9dfcf; }
.story-scene img { display:block; width:100%; height:100%; object-fit:contain; }
.story-index { position:absolute; top:13px; left:15px; padding:5px 9px; border:1px solid #fff3d999; border-radius:4px; color:#4e533a; background:#fff5dedf; font-size:10px; font-weight:900; letter-spacing:.12em; }
.story-copy { padding:21px 23px 23px; }
.story-time { display:block; margin-bottom:8px; color:#a45536; font-size:11px; font-weight:900; letter-spacing:.07em; }
.story-copy h4 { margin:0; color:#325f57; font:800 24px/1.2 var(--display); }
.story-en { margin:4px 0 10px; font-size:11px; font-weight:900; letter-spacing:.08em; color:#8a7658; text-transform:uppercase; }
.story-copy .story-desc { margin:0; font-size:14px; line-height:1.75; color:#5d4b34; }
.story-small-note { display:block; margin-top:12px; padding-top:9px; border-top:1px solid #b69a7038; color:#877056; font-size:11px; }
.story-close { display:flex; gap:14px; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:18px 0 0; }
.story-close p { margin:0; font-size:12px; color:#7a694f; }
.exact-schedule { width:100%; margin-top:16px; border-top:1px solid #b69a7055; padding-top:14px; }
.exact-schedule > summary { color:#356b61; font-size:13px; font-weight:900; cursor:pointer; }
.exact-schedule ol { list-style:none; padding:8px 0 0; margin:0; }
.exact-schedule li { display:grid; grid-template-columns:105px 1fr; gap:12px; padding:10px 0; border-bottom:1px solid #b69a7033; }
.exact-schedule time { color:#a45536; font-size:12px; font-weight:900; }
.exact-schedule b,.exact-schedule li span { display:block; font-size:13px; }
.exact-schedule li span { color:#8a7658; font-size:11px; }
.story-pending { margin:16px 0 0; padding:10px 13px; border-radius:6px; background:#f4e7cc; color:#81583c; font-size:12px; }
.story-schedule:not([hidden]) .story-card { animation:story-arrive .7s both; }
.story-schedule:not([hidden]) .story-card:nth-child(2) { animation-delay:.12s; }
.story-schedule:not([hidden]) .story-card:nth-child(3) { animation-delay:.24s; }
.story-schedule:not([hidden]) .story-card:nth-child(4) { animation-delay:.36s; }
@keyframes story-arrive { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:760px) {
 .story-schedule { grid-column:1/-1; grid-row:3; margin-top:3px; }
 .story-panel { padding:18px 15px 20px; }
 .story-grid { grid-template-columns:1fr; gap:16px; }
 .story-copy { padding:18px; }
 .story-copy h4 { font-size:23px; }
 .exact-schedule li { grid-template-columns:90px 1fr; }
}
@media (prefers-reduced-motion:reduce) { .story-schedule:not([hidden]) .story-card { animation:none; } }