.stories-index{min-height:100dvh;height:100dvh;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;background:var(--color-stone);color:var(--color-ink)}.stories-index__header{max-width:900px;margin:0 auto;padding:32px 16px 24px}.stories-index__title{font-family:Space Grotesk,sans-serif;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;margin:0 0 8px;color:var(--color-ink)}.stories-index__subtitle{font-size:1rem;color:var(--color-ink-muted);margin:0;max-width:520px}.stories-index__search{display:flex;align-items:center;gap:var(--space-2, 8px);padding:var(--space-2, 8px) var(--space-4, 16px);border:1px solid var(--glass-border, rgba(128,128,128,.2));border-radius:var(--radius-control, 12px);background:#8080800f;margin-top:20px;max-width:420px}.stories-index__search-input{border:none;background:transparent;color:var(--color-ink);font-size:var(--text-sm, .875rem);outline:none;flex:1;min-width:0}.stories-index__search-input::placeholder{color:var(--color-ink-muted)}.stories-index__search-clear{background:none;border:none;font-size:1.2rem;line-height:1;color:var(--color-ink-muted);cursor:pointer;padding:0 4px;opacity:.6}.stories-index__search-clear:hover{opacity:1}.stories-index__grid{max-width:900px;margin:0 auto;padding:0 16px 48px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:20px}@media(max-width:480px){.stories-index__grid{grid-template-columns:1fr;gap:16px;padding-bottom:32px}}.story-card{display:flex;flex-direction:column;border-radius:16px;overflow:hidden;background:var(--card-bg, var(--color-white));border:1px solid var(--glass-border, rgba(0,0,0,.08));text-decoration:none;color:inherit;transition:transform .18s ease,box-shadow .18s ease}.story-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px #0000001a}.story-card:focus-visible{outline:2px solid var(--color-action);outline-offset:2px}.story-card--skeleton{height:280px;background:var(--glass-border, rgba(0,0,0,.08));animation:story-skeleton-pulse 1.4s ease-in-out infinite;pointer-events:none}@keyframes story-skeleton-pulse{0%,to{opacity:.5}50%{opacity:1}}.story-card__image-wrap{position:relative;height:160px;overflow:hidden;flex-shrink:0}.story-card__image{width:100%;height:100%;object-fit:cover;object-position:center}.story-card__image-placeholder{width:100%;height:100%;background:var(--glass-border, rgba(0,0,0,.08))}.story-card__category{position:absolute;bottom:8px;left:8px;background:#162027bf;color:var(--color-white);font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:3px 8px;border-radius:100px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.story-card__body{padding:14px 16px 16px;flex:1;display:flex;flex-direction:column;gap:4px}.story-card__city{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-action)}.story-card__name{font-family:Space Grotesk,sans-serif;font-size:1rem;font-weight:700;margin:0;color:var(--color-ink);line-height:1.3}.story-card__excerpt{font-size:.8125rem;color:var(--color-ink-muted);margin:4px 0 0;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.stories-index__empty{max-width:900px;margin:40px auto;padding:0 16px;text-align:center;color:var(--color-ink-muted)}.stories-index__clear-filter{display:inline-block;margin-top:12px;color:var(--color-action);font-size:.875rem;text-decoration:none}.stories-index__clear-filter:hover{text-decoration:underline}.stories-index__pagination{max-width:900px;margin:0 auto 48px;padding:0 16px;display:flex;align-items:center;gap:16px}.stories-index__page-btn{background:var(--color-action);color:var(--color-white);border:none;border-radius:100px;padding:8px 20px;font-size:.875rem;font-weight:600;cursor:pointer;transition:opacity .15s ease}.stories-index__page-btn:hover{opacity:.85}.stories-index__page-num{font-size:.875rem;color:var(--color-ink-muted)}@media(prefers-color-scheme:dark){.story-card{background:var(--card-bg, #1e2a32);border-color:var(--glass-border, rgba(255,255,255,.08))}.story-card:hover{box-shadow:0 8px 24px #0006}}[data-theme=dark] .story-card{background:var(--card-bg, #1e2a32);border-color:var(--glass-border, rgba(255,255,255,.08))}
