/* Article catalogue and a quiet, paper-coloured reading surface. */
@font-face{font-family:"Starsea Reading Serif";src:url("/assets/reading-serif-400-ba5813ee44ff.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Starsea Heading Sans";src:url("/assets/heading-sans-700-90d9f8775068.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
.article-page .section-main{width:min(100%,1320px);margin:0 auto auto;padding-top:12px}
.article-page .section-heading{margin:14px 0 28px}
.article-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:26px;align-items:stretch}
.article-card{padding:0;overflow:hidden;isolation:isolate;min-width:0;border-radius:24px;background:#102b3b;box-shadow:0 18px 50px #021c3040;transition:transform .2s,border-color .2s}
.article-card:hover{transform:translateY(-5px);border-color:#e5c18a}
.article-card-link{display:flex;flex-direction:column;height:100%}
.article-card-link:focus-visible{outline:3px solid #ffe2ac;outline-offset:-5px;border-radius:24px}
.article-card-image{position:relative;aspect-ratio:3/2;overflow:hidden;background:#283d42}
.article-card-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.article-card:hover .article-card-image img{transform:scale(1.035)}
.article-card-image::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#102b3b99);pointer-events:none}
.article-card-content{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:22px 24px 25px}
.article-card h2{font:700 32px/1.5 "Starsea Heading Sans","Noto Sans SC","Microsoft YaHei",sans-serif;letter-spacing:.08em;margin:13px 0;color:#fff4db;overflow-wrap:anywhere}
.article-card .article-category{font-size:12px;line-height:1.7;max-width:100%;border-radius:10px;padding:4px 10px;overflow-wrap:anywhere}
.article-card p.article-excerpt{margin:0 0 21px;font:400 16px/1.8 "Starsea Reading Serif","Noto Serif SC","Songti SC","SimSun",serif;color:#d8e0dc}
.article-card-meta{display:grid;gap:9px;font-size:12px;line-height:1.65;color:#c5d5d7;width:100%;margin-top:auto;padding-top:17px;border-top:1px solid #e0d9c12b}
.article-card-meta>div{display:flex;flex-wrap:wrap;gap:3px 9px;align-items:baseline}
.article-card-meta time{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.article-read-more{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:20px;width:100%;font-size:13px;color:#f2d8a8}
.article-read-more svg{width:19px;height:19px}
.article-sort-note{margin:0 0 16px;color:#d2dfdf;font-size:12px;line-height:1.6;text-align:right}
.reading-page .scenery{filter:saturate(.7)}
.reading-main{width:min(100%,1050px);margin:0 auto auto;padding:8px 0 32px}
.reading-main>.back-link{margin-bottom:20px}
.reading-paper{color-scheme:light;color:#302c29;background:#fcf6e9;border:1px solid #ffebca99;border-radius:28px;padding:clamp(26px,5.8vw,68px);box-shadow:0 25px 85px #02152266}
.reading-paper .article-category{color:#7b5931;border-color:#b99a6870;background:#f0e3cc;font-family:inherit}
.reading-heading{text-align:center}
.reading-page .reading-title{font:700 29.333px/1.5 "Starsea Heading Sans","Noto Sans SC","Microsoft YaHei",sans-serif!important;letter-spacing:.12em!important;text-shadow:none;text-align:center;margin:.75em 0 .75em;overflow-wrap:anywhere}
.reading-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 23px;padding:14px 0 18px;color:#756c5f;font:400 12px/1.8 system-ui,"Microsoft YaHei",sans-serif;border-bottom:1px solid #d8cdb8}
.reading-meta>div{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px}
.reading-meta time{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.translation-tools{margin:18px 0 22px;padding:0;font:400 13px/1.7 system-ui,"Microsoft YaHei",sans-serif;color:#6a6258}
.translation-control-row{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.translation-control-row label{font-size:12px}
.translation-tools select{font:inherit;max-width:100%;min-height:42px;padding:8px 32px 8px 12px;border:1px solid #b9ab91;border-radius:10px;background:#fffaf0;color:#3e4e49;cursor:pointer}
.translation-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;border:1px solid #b9ab91;border-radius:10px;padding:8px 14px;background:#e8efea;color:#2b514d;cursor:pointer;font:600 13px/1.6 system-ui,sans-serif}
.translation-toggle:hover{background:#dce9df}
.translation-toggle[aria-pressed=true]{color:#fff5df;border-color:#365d56;background:#365d56}
.translation-toggle:disabled{opacity:.6;cursor:wait}
.translation-toggle svg{width:17px;height:17px}
.translation-tools :is(button,select):focus-visible{outline:3px solid #3c786f;outline-offset:3px}
.translation-hint{margin:9px 0 0;text-align:center;font-size:12px;color:#81796c}
.machine-notice{margin:16px 0 0;padding:13px 16px;background:#fff0d0;border:1px solid #d9b66c;border-radius:12px;color:#6c4519;font-size:13px;line-height:1.8;text-align:center}
.translation-status{margin:8px 0 0;text-align:center;font-size:12px;color:#526a61;min-height:1.7em}
.article-text{font:400 21.333px/1.5 "Starsea Reading Serif","Noto Serif SC","Songti SC","SimSun",serif;letter-spacing:.025em;overflow-wrap:break-word;line-break:strict}
.article-text p{margin:0 0 .75em;text-align:left;text-indent:2em}
.article-text p:last-child{margin-bottom:0}
.article-text:not(:lang(zh)){letter-spacing:0}
.article-text:lang(th){font-family:"Noto Serif Thai","Leelawadee UI",Tahoma,serif}
.reading-content{position:relative;isolation:isolate;overflow:hidden}
.reading-prose{position:relative;min-width:0;z-index:1}
.translation-watermarks{position:absolute;inset:0 -50%;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;margin:0;transform:rotate(-32deg);pointer-events:none;user-select:none}
.translation-watermarks[hidden]{display:none}
.translation-watermarks span{display:block;flex-shrink:0;margin:0;text-align:center;white-space:nowrap;font:600 clamp(28px,3.4vw,48px)/1.08 system-ui,"Microsoft YaHei","Leelawadee UI",sans-serif;letter-spacing:.015em;color:rgba(105,89,68,.075)}
.reading-illustration{margin:1.5em 0 0;text-align:center;font-size:21.333px}
.reading-illustration img{display:block;width:100%;height:auto;aspect-ratio:3/2;border-radius:15px;border:1px solid #d9c5a3;box-shadow:0 8px 24px #543c1c1f}
.image-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px 20px;margin-top:12px;font:500 13px/1.5 system-ui,sans-serif}
.image-actions a{padding:7px 13px;color:#45675b;border:1px solid #bec8b7;border-radius:9px;background:#f0f1e6}
.image-actions a:hover{background:#e4eadb}
.image-actions a:focus-visible{outline:3px solid #3c786f;outline-offset:3px}
.reading-bottom{display:flex;justify-content:center;margin-top:26px}
.reading-bottom .back-link{color:#b9d8d4}
@media(min-width:1500px){.article-page .section-main{width:min(100%,1440px)}}
@media(max-width:720px){.article-list{gap:20px;grid-template-columns:repeat(auto-fill,minmax(min(100%,275px),1fr))}.article-card-content{padding:20px}.reading-paper{padding:28px 24px;border-radius:21px}.article-text{font-size:20px;line-height:1.6}.reading-page .reading-title{font-size:29.333px!important}.reading-meta{gap:6px 18px}.reading-illustration{margin-top:1.5em}.translation-control-row{gap:8px}.translation-control-row label{flex-basis:100%;text-align:center}.translation-tools{margin:20px 0 24px}}
@media(max-width:380px){.reading-page .page-shell{padding:0 14px}.reading-paper{padding:25px 20px}.article-text{font-size:18px;line-height:1.65}.article-card h2{font-size:29px}.reading-meta{font-size:11px}.translation-tools select{max-width:170px}}
@media(prefers-reduced-motion:reduce){.article-card,.article-card-image img{transition:none}}
@media print{.site-header,.site-footer,.scenery,.translation-tools,.reading-main>.back-link,.reading-bottom{display:none!important}.reading-page{background:#fff;color:#000}.reading-page .page-shell{display:block;padding:0}.reading-paper{border:0;box-shadow:none;background:white;padding:0}.reading-main{width:100%}.reading-illustration{break-inside:avoid}.reading-meta{color:#444}}
