/* Compact story discovery, scoped away from the reading pages and shared chrome. */
.stories-directory{padding-top:27px;padding-bottom:50px;color:#30483d}
.stories-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}
.stories-heading h1{margin:0;font-size:39px;line-height:1.45;letter-spacing:.09em;flex:none;white-space:nowrap}
.stories-heading p{margin:6px 0 0;font-size:17px;line-height:1.85;color:#6c7266}
.stories-heading .stories-count{font-size:15px;white-space:nowrap;color:#77776e}
.stories-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:11px}
.stories-sort{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 23px;border:1px solid #c9cbbb;border-radius:3px;background:transparent;color:#4c5c48;font-size:16px;line-height:1.6;white-space:nowrap}
.stories-sort:hover{border-color:#68785d;background:#eeeee3;color:#30483d}
.stories-sort[aria-current="true"],.stories-sort[aria-current="page"]{background:#344f43;border-color:#344f43;color:#fffdf7}
.stories-sort-note{min-height:26px;margin:0 0 24px;color:#727768;font-size:14px;line-height:1.8}
.stories-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.story-batch{display:contents}
.story-tile{min-width:0;margin:0;border:1px solid #d8d9cc;background:var(--tile-bg,#e9eee2);color:var(--tile-ink,#385346)}
.story-tile-link{display:flex;flex-direction:column;align-items:center;height:100%;min-height:308px;padding:21px 18px 18px;color:inherit;text-align:center;position:relative;transition:box-shadow .18s ease,background .18s ease}
.story-tile-link::before{content:"";position:absolute;inset:10px;border:1px solid currentColor;opacity:.1;pointer-events:none}
.story-tile-link:hover{color:inherit;box-shadow:0 5px 18px rgba(42,58,40,.09)}
.story-tile-link:focus-visible{outline-offset:4px;outline:3px solid #99664e}
.story-tile-pinyin{font-family:"Microsoft YaHei",var(--sans);font-size:18px;line-height:1.6;margin:0;min-height:29px;color:inherit}
.story-tile-art{width:100%;text-align:center}
.story-tile-title{margin:0;line-height:1.2;font-weight:400}
.story-tile-art .story-tile-pinyin{display:block}
.story-tile-read{display:none}
.story-tile-character{font-family:var(--serif);font-size:116px;font-weight:400;font-synthesis:none;line-height:1.2;letter-spacing:0;margin:4px 0 13px;min-height:140px;display:flex;align-items:center;justify-content:center}
.story-tile-hook{font-family:var(--serif);font-size:17px;line-height:1.65;font-weight:400;margin:0 0 15px;min-height:56px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.story-tile-strokes{display:block;margin-top:auto;padding-top:9px;border-top:1px solid rgba(55,73,48,.12);font-size:14px;line-height:1.6;min-width:64px;color:#63715f}
[data-story-sentinel]{height:1px;width:100%;margin-top:30px;pointer-events:none}
.stories-more-wrap{text-align:center;margin-top:15px}
.stories-more{display:flex;align-items:center;justify-content:center;gap:24px;max-width:250px;min-height:50px;margin:0 auto;border:1px solid #9eaa94;border-radius:3px;padding:10px 23px;background:#fffdf8;color:#344f43;font:17px/1.6 var(--sans);text-decoration:none;cursor:pointer}
.stories-more:hover{background:#eaeedf;color:#30483d}
.stories-more[aria-busy="true"]{color:#717868;cursor:progress;background:#f0f0e7}
.stories-more[hidden]{display:none}
.stories-directory [data-story-status]{min-height:29px;margin:12px auto 0;text-align:center;color:#6e7567;font-size:15px;line-height:1.8}
.stories-pagination{margin:23px 0 0}
.stories-ready .stories-pagination{display:none}
.stories-ready.stories-load-error .stories-pagination{display:block}
.stories-no-results{padding:40px 0;color:#6b7165}
.home [data-home-random-section] .section-heading{align-items:center;flex-wrap:wrap;gap:12px 20px}
.home [data-home-random-section] .section-heading h2{margin-right:auto}
.home-shuffle,[data-home-shuffle]{display:inline-flex;align-items:center;gap:9px;justify-content:center;min-height:44px;border:1px solid #bec5b4;border-radius:3px;background:transparent;color:#40533d;padding:7px 16px;font:15px/1.6 var(--sans);cursor:pointer}
.home-shuffle:hover,[data-home-shuffle]:hover{background:#eaeedf;border-color:#8b9c7c}
[data-home-shuffle][hidden]{display:none}
[data-home-shuffle]:disabled{cursor:progress;color:#7a8273}
[data-home-random-status]{min-height:27px;margin:13px 0 0;color:#717867;font-size:14px;line-height:1.8;text-align:center}
.home [data-home-random] .post-excerpt{min-height:5.7em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:1000px){.stories-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.story-tile-character{font-size:110px;min-height:132px}.story-tile-link{min-height:300px;padding:19px 16px 17px}}
@media(max-width:700px){.stories-directory{padding-top:22px;padding-bottom:35px}.stories-heading{display:block;margin-bottom:19px}.stories-heading h1{font-size:32px}.stories-heading p{font-size:18px;line-height:1.8}.stories-heading .stories-count{font-size:16px;margin-top:6px}.stories-toolbar{gap:8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:10px}.stories-sort{min-height:48px;padding:8px 5px;font-size:17px}.stories-sort-note{font-size:15px;margin-bottom:20px;min-height:27px}.stories-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 13px}.story-tile-link{padding:15px 11px 14px;min-height:270px}.story-tile-link::before{inset:7px}.story-tile-pinyin{font-size:18px;line-height:1.6;min-height:29px}.story-tile-character{font-size:87px;min-height:108px;line-height:1.2;margin:5px 0 10px}.story-tile-hook{font-size:17px;line-height:1.75;min-height:60px;margin-bottom:11px}.story-tile-strokes{font-size:15px;padding-top:8px}.stories-more{font-size:18px;min-height:52px}.stories-directory [data-story-status]{font-size:16px;min-height:29px}.home [data-home-shuffle]{font-size:17px;min-height:48px;padding-inline:14px}.home [data-home-random-status]{font-size:16px;min-height:29px}}
@media(max-width:360px){.stories-grid{gap:12px 10px}.story-tile-link{padding:15px 9px 14px;min-height:254px}.story-tile-character{font-size:75px;min-height:94px}.story-tile-hook{font-size:17px}.stories-sort{font-size:16px}.stories-heading h1{font-size:30px}}
@media(max-width:700px){.stories-heading{display:flex;align-items:baseline;gap:12px}.stories-heading .stories-count{margin:0;font-size:15px;white-space:normal;text-align:right}.home [data-home-random] .post-excerpt{min-height:9.5em;-webkit-line-clamp:5}.story-tile-hook{margin-top:12px}.story-tile-title{margin:0}}
@media(max-width:280px){.stories-grid{grid-template-columns:minmax(0,1fr)}.stories-toolbar{grid-template-columns:minmax(0,1fr)}.story-tile-character{font-size:96px}}
@media(prefers-reduced-motion:reduce){.story-tile-link{transition:none}}

/* Preserve each lesson's authored phrase breaks; never truncate its short caption. */
.story-tile-hook{display:block;width:100%;font-size:17px;min-height:3.6em;line-height:1.8;overflow:visible;overflow-wrap:normal;-webkit-line-clamp:unset;-webkit-box-orient:initial}
.story-tile-line{display:block;line-height:1.8;text-wrap:balance;word-break:normal;overflow-wrap:anywhere}
.story-tile-phrase{display:inline-block;max-width:100%;text-wrap:balance;vertical-align:top}
@media(min-width:361px) and (max-width:389px){.story-tile-link{padding-inline:6px}}
@media(max-width:360px){.stories-grid{grid-template-columns:minmax(0,1fr)}.story-tile-link{padding-inline:18px}.story-tile-hook{font-size:17px;min-height:3.6em}.story-tile-line{font-size:17px}}