:root {
    --ink: #2e2925;
    --muted: #766d63;
    --paper: #f6f0e4;
    --paper-deep: #eadfca;
    --paper-light: #fffdf8;
    --red: #6b2f2a;
    --red-dark: #4d201d;
    --gold: #a87935;
    --line: rgba(87, 66, 47, .18);
    --shadow: 0 18px 45px rgba(74, 52, 31, .10);
    --radius: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 10% 10%, rgba(168,121,53,.08), transparent 26rem),
        linear-gradient(180deg, #f9f5eb 0, var(--paper) 100%);
    font-family: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
    line-height: 1.8;
}
a { color: var(--red); text-decoration: none; }
a:hover { color: var(--red-dark); }
img { max-width: 100%; }
button, input { font: inherit; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:999; background:#fff; padding:.6rem 1rem; border-radius:8px; }
.skip-link:focus { top:1rem; }

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(249,245,235,.94);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--line);
}
.header-inner {
    max-width: 1180px;
    min-height: 78px;
    margin: 0 auto;
    padding: 0 22px;
    display: flex;
    align-items: center;
    gap: 24px;
}
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); min-width:235px; }
.brand-mark, .seal {
    display:inline-grid;
    place-items:center;
    background:var(--red);
    color:#f8ead2;
    border-radius:8px;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.25);
}
.brand-mark { width:44px; height:44px; font-size:24px; font-weight:700; }
.brand-text { display:flex; flex-direction:column; line-height:1.25; }
.brand-text strong { font-size:21px; letter-spacing:.12em; }
.brand-text small { color:var(--muted); font-size:11px; margin-top:4px; white-space:nowrap; }
.main-nav { display:flex; gap:20px; align-items:center; margin-left:auto; white-space:nowrap; }
.main-nav a { color:#4b433c; font-size:15px; }
.main-nav a:hover { color:var(--red); }
.header-search { display:flex; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.65); overflow:hidden; }
.header-search input { width:170px; border:0; outline:0; background:transparent; padding:8px 4px 8px 14px; }
.header-search button { border:0; background:transparent; color:var(--red); padding:8px 13px; cursor:pointer; }
.nav-toggle { display:none; }

.site-main { max-width:1180px; margin:0 auto; padding:36px 22px 72px; min-height:70vh; }
.hero {
    min-height: 440px;
    display:grid;
    grid-template-columns: 1.25fr .75fr;
    gap:54px;
    align-items:center;
    padding:48px 54px;
    background:
        linear-gradient(90deg, rgba(255,253,248,.95), rgba(246,240,228,.82)),
        repeating-linear-gradient(90deg, transparent 0 34px, rgba(107,47,42,.03) 34px 35px);
    border:1px solid var(--line);
    border-radius:24px;
    box-shadow:var(--shadow);
    overflow:hidden;
    position:relative;
}
.hero::after { content:"詩"; position:absolute; right:-18px; bottom:-115px; font-size:330px; line-height:1; color:rgba(107,47,42,.045); font-weight:700; }
.hero-copy, .hero-quote { position:relative; z-index:1; }
.eyebrow { margin:0 0 8px; color:var(--gold); font-size:13px; letter-spacing:.2em; font-weight:700; text-transform:uppercase; }
.hero h1 { margin:0; font-size:54px; line-height:1.25; letter-spacing:.12em; color:#332824; }
.hero-copy > p:not(.eyebrow) { max-width:660px; color:var(--muted); font-size:17px; }
.hero-actions { display:flex; gap:12px; margin-top:26px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:8px 20px; border-radius:999px; border:1px solid var(--red); font-weight:700; }
.button.primary { background:var(--red); color:#fff7ea; }
.button.ghost { background:transparent; color:var(--red); }
.hero-quote { margin:0; padding:38px 30px; border-left:3px solid var(--red); background:rgba(255,255,255,.55); }
.hero-quote span { display:block; font-size:27px; line-height:1.6; letter-spacing:.12em; }
.hero-quote small { display:block; color:var(--muted); margin-top:12px; }

.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin:28px 0 52px; border:1px solid var(--line); background:var(--line); border-radius:14px; overflow:hidden; }
.stats div { padding:23px 14px; text-align:center; background:rgba(255,253,248,.88); }
.stats strong { display:block; font-size:27px; color:var(--red); }
.stats span { color:var(--muted); font-size:13px; }

.section-grid { display:grid; grid-template-columns:minmax(0, 1fr) 315px; gap:34px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin:0 0 20px; }
.section-heading h2 { margin:0; font-size:30px; }
.section-heading > a { font-size:14px; }
.poem-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.poem-card { padding:24px; background:rgba(255,253,248,.9); border:1px solid var(--line); border-radius:var(--radius); transition:.2s ease; }
.poem-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); border-color:rgba(107,47,42,.25); }
.poem-card-top { display:flex; gap:12px; justify-content:space-between; align-items:flex-start; }
.poem-card h2 { margin:0; font-size:21px; line-height:1.45; }
.form-badge { flex:none; color:var(--gold); border:1px solid rgba(168,121,53,.3); border-radius:999px; padding:1px 8px; font-size:11px; }
.poem-meta { margin:7px 0; color:var(--muted); font-size:14px; }
.poem-excerpt { margin:12px 0 14px; color:#514941; min-height:58px; }
.read-more { font-size:13px; font-weight:700; }
.section-side { display:flex; flex-direction:column; gap:20px; }
.side-panel { padding:24px; background:rgba(255,253,248,.78); border:1px solid var(--line); border-radius:var(--radius); }
.side-panel h2 { margin:0 0 16px; font-size:21px; }
.author-cloud { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.author-cloud a { display:flex; flex-direction:column; padding:10px 11px; background:rgba(107,47,42,.045); border-radius:9px; }
.author-cloud strong { font-size:16px; }
.author-cloud small { color:var(--muted); }
.tag-cloud { display:flex; flex-wrap:wrap; gap:9px; }
.tag-cloud a { display:inline-flex; align-items:center; gap:7px; padding:5px 11px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.55); }
.tag-cloud span { color:var(--muted); font-size:11px; }

.featured-section { margin-top:56px; }
.featured-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.featured-grid article, .theme-grid article { position:relative; padding:26px; background:var(--paper-light); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.seal { width:31px; height:31px; font-size:14px; }
.featured-grid .seal, .theme-grid .seal { position:absolute; right:18px; top:18px; opacity:.88; }
.featured-grid h3, .theme-grid h2 { margin:0 40px 8px 0; font-size:20px; }
.featured-grid p:last-child { color:#554b43; margin-bottom:0; }

.page-header { max-width:820px; margin:12px auto 36px; text-align:center; padding:32px 18px; }
.page-header h1 { font-size:42px; margin:0; letter-spacing:.06em; }
.page-header p:last-child { color:var(--muted); }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:13px; margin-bottom:26px; }
.breadcrumbs strong { color:var(--ink); }
.pagination { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; margin-top:34px; }
.pagination a, .pagination strong, .pagination span { min-width:38px; height:38px; display:inline-grid; place-items:center; padding:0 10px; border:1px solid var(--line); border-radius:8px; background:rgba(255,253,248,.85); }
.pagination strong { background:var(--red); color:white; border-color:var(--red); }

.poem-detail { max-width:800px; margin:0 auto; background:var(--paper-light); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); overflow:hidden; }
.poem-detail > header { text-align:center; padding:42px 30px 20px; }
.poem-detail h1 { margin:0; font-size:42px; letter-spacing:.08em; }
.poem-byline { color:var(--muted); }
.poem-original { padding:34px 30px 42px; text-align:center; background:linear-gradient(180deg, rgba(107,47,42,.025), transparent); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.poem-original p { margin:8px 0; font-size:23px; line-height:1.9; letter-spacing:.1em; }
.work-info, .work-themes { padding:26px 34px; }
.work-info h2, .work-themes h2, .related-section h2, .prose-panel h2 { margin-top:0; }
.work-info dl { display:grid; grid-template-columns:repeat(2,1fr); margin:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.work-info dl div { display:grid; grid-template-columns:88px 1fr; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.work-info dt, .work-info dd { padding:9px 12px; margin:0; }
.work-info dt { color:var(--muted); background:rgba(107,47,42,.035); }
.source-notes { margin:0 34px 30px; padding:12px 16px; background:var(--paper); border-radius:10px; }
.adjacent-posts { max-width:800px; margin:20px auto 48px; display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.adjacent-posts div { min-height:78px; padding:14px 18px; background:rgba(255,253,248,.85); border:1px solid var(--line); border-radius:12px; }
.adjacent-posts div:last-child { text-align:right; }
.adjacent-posts span { display:block; color:var(--muted); font-size:12px; }
.related-section { margin-top:44px; }

.author-list { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.author-list article { display:grid; grid-template-columns:58px 1fr; gap:18px; padding:24px; background:rgba(255,253,248,.9); border:1px solid var(--line); border-radius:var(--radius); }
.author-list h2 { margin:0; }
.author-list p { color:var(--muted); }
.author-initial { width:54px; height:54px; display:grid; place-items:center; color:var(--red); background:var(--paper-deep); border-radius:50%; font-size:25px; font-weight:700; }
.author-initial.large { width:78px; height:78px; font-size:34px; }
.author-header { display:flex; gap:22px; align-items:center; max-width:800px; margin:10px auto 28px; padding:30px; background:rgba(255,253,248,.85); border:1px solid var(--line); border-radius:var(--radius); }
.author-header h1 { margin:0; font-size:39px; }
.author-header p:last-child { margin:5px 0 0; color:var(--muted); }
.prose-panel { max-width:900px; margin:0 auto 38px; padding:30px 34px; background:rgba(255,253,248,.88); border:1px solid var(--line); border-radius:var(--radius); }
.prose-panel p { white-space:normal; }
.article-prose { font-size:16px; }
.article-prose h2 { margin-top:30px; }
.article-prose h2:first-child { margin-top:0; }
.theme-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.theme-grid p { color:var(--muted); }
.large-search { max-width:720px; display:flex; margin:0 auto 24px; border:1px solid var(--line); background:#fff; border-radius:999px; overflow:hidden; }
.large-search input { flex:1; min-width:0; padding:13px 20px; border:0; outline:0; }
.large-search button { border:0; background:var(--red); color:white; padding:0 26px; cursor:pointer; }
.search-count { text-align:center; color:var(--muted); }
.empty-state { max-width:650px; margin:70px auto; padding:54px 24px; text-align:center; background:rgba(255,253,248,.82); border:1px solid var(--line); border-radius:20px; }
.empty-state h1 { font-size:38px; }
.not-found .seal { margin:auto; }

.site-footer { color:#dfd2c2; background:#332a26; }
.footer-inner { max-width:1180px; margin:0 auto; padding:35px 22px; display:flex; justify-content:space-between; gap:30px; }
.footer-inner p { margin:4px 0 0; color:#aa9d91; }
.footer-links { display:flex; flex-wrap:wrap; gap:18px; align-items:center; }
.footer-links a { color:#dfd2c2; }
.copyright { text-align:center; border-top:1px solid rgba(255,255,255,.08); padding:13px; color:#9d9085; font-size:12px; }

@media (max-width: 980px) {
    .header-inner { flex-wrap:wrap; padding-top:12px; padding-bottom:12px; }
    .main-nav { order:3; width:100%; display:none; margin:0; padding-top:8px; border-top:1px solid var(--line); }
    .main-nav.is-open { display:flex; }
    .nav-toggle { display:block; margin-left:auto; border:1px solid var(--line); border-radius:8px; background:transparent; padding:6px 11px; }
    .header-search { display:none; }
    .hero { grid-template-columns:1fr; min-height:auto; }
    .hero-quote { max-width:620px; }
    .section-grid { grid-template-columns:1fr; }
    .section-side { display:grid; grid-template-columns:1fr 1fr; }
    .featured-grid { grid-template-columns:repeat(2,1fr); }
    .theme-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 680px) {
    .site-main { padding:22px 14px 50px; }
    .brand-text small { display:none; }
    .brand { min-width:0; }
    .main-nav.is-open { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
    .hero { padding:34px 24px; border-radius:16px; gap:30px; }
    .hero h1 { font-size:38px; }
    .hero-quote { padding:24px 20px; }
    .hero-quote span { font-size:21px; }
    .stats { grid-template-columns:repeat(2,1fr); }
    .poem-list, .author-list, .theme-grid, .featured-grid, .section-side { grid-template-columns:1fr; }
    .page-header { padding:20px 8px; }
    .page-header h1 { font-size:34px; }
    .poem-detail h1 { font-size:32px; }
    .poem-original p { font-size:20px; letter-spacing:.05em; }
    .work-info dl { grid-template-columns:1fr; }
    .adjacent-posts { grid-template-columns:1fr; }
    .adjacent-posts div:last-child { text-align:left; }
    .footer-inner { flex-direction:column; }
}