.story-index,.story-article { padding:clamp(7rem,13vw,12rem) 0 6rem; min-height:65vh; }
.story-kicker { color:var(--text-muted); font-size:.8rem; letter-spacing:.12em; margin-bottom:1.5rem; }
.story-title { font-size:clamp(2.5rem,7vw,6rem); line-height:1.12; letter-spacing:-.05em; overflow-wrap:anywhere; margin:0 0 2rem; }
.story-empty { margin-top:5rem; color:var(--text-secondary); font-size:clamp(1.1rem,2vw,1.5rem); }
.story-list { list-style:none; margin:4rem 0 0; padding:0; }
.story-list li { margin:1rem 0; }
.story-card { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:2rem; border-radius:24px; background:var(--bg-secondary); color:inherit; text-decoration:none; }
.story-card h2 { margin:.7rem 0; font-size:clamp(1.5rem,3vw,2.5rem); }
.story-card p,.story-meta { color:var(--text-secondary); }
.story-dot { flex-shrink:0; width:2.5rem; height:2.5rem; border-radius:50%; background:var(--accent-color); transition:transform .2s; }
.story-card:hover .story-dot { transform:scale(1.15); }
.story-card:focus-visible,.story-return:focus-visible { outline:2px solid var(--accent-color); outline-offset:5px; }
.story-reading { max-width:760px; margin:3rem auto 0; font-size:1.125rem; line-height:1.9; overflow-wrap:anywhere; }
.story-reading p,.story-reading figure,.story-reading blockquote { margin:0 0 2rem; }
.story-reading h2 { margin:3rem 0 1rem; line-height:1.4; }
.story-reading blockquote { padding:1.5rem; background:var(--bg-secondary); border-radius:20px; }
.story-reading img { width:100%; height:auto; border-radius:20px; }
.story-reading figcaption { color:var(--text-muted); font-size:.85rem; }
.story-return { display:inline-block; margin-top:3rem; color:inherit; }
.story-share { display:flex; align-items:center; flex-wrap:wrap; gap:.75rem; margin-top:1.5rem; }
.story-share-button { padding:.75rem 1.25rem; border:1px solid var(--text-muted); border-radius:999px; background:var(--bg-secondary); color:var(--text-color); font:inherit; cursor:pointer; }
.story-share-button:hover { border-color:var(--accent-color); }
.story-share-button:focus-visible,.story-share-url:focus-visible { outline:2px solid var(--accent-color); outline-offset:4px; }
.story-share-button:disabled { opacity:.6; cursor:wait; }
.story-share-status { margin:0; color:var(--text-secondary); font-size:.9rem; }
.story-share-url { flex-basis:100%; min-width:0; padding:.75rem; border:1px solid var(--text-muted); border-radius:8px; background:var(--bg-secondary); color:var(--text-color); font:inherit; }
.story-share [hidden] { display:none; }
@media(max-width:600px) { .story-card { padding:1.5rem; gap:1rem; } .story-dot { width:1.5rem; height:1.5rem; } }
@media(prefers-reduced-motion:reduce) { .story-dot { transition:none; } }