/*
Theme Name: 李颖的资料库
Theme URI: https://liying.marsideas.cn
Author: Marsidea
Description: 石油行业项目资料库专属主题 —— 极简典雅、黑白灰、响应式，含亮/暗/跟随系统主题切换、每篇文章自动生成可扫二维码与分享海报。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: liying-archive
*/

.stage{
  --paper:#FAF9F6; --paper-2:#F3F2ED; --raise:#FFFFFF;
  --ink:#1A1815; --ink-soft:#55524A; --muted:#8C887E;
  --line:#E4E2DA; --line-strong:#CFCCC2; --accent:#8F6A38;
  --serif:"Songti SC","STSong","Noto Serif SC","Source Han Serif SC",Georgia,"Times New Roman",serif;
  --sans:"PingFang SC","Noto Sans SC","Source Han Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;
  --maxw:1120px;
}
.stage[data-mode="dark"]{
  --paper:#121110; --paper-2:#1A1917; --raise:#201E1B;
  --ink:#EDEBE3; --ink-soft:#A9A599; --muted:#77746B;
  --line:#2B2925; --line-strong:#3A382F; --accent:#C89A5C;
}
@media (prefers-color-scheme: dark){
  .stage[data-mode="system"]{
    --paper:#121110; --paper-2:#1A1917; --raise:#201E1B;
    --ink:#EDEBE3; --ink-soft:#A9A599; --muted:#77746B;
    --line:#2B2925; --line-strong:#3A382F; --accent:#C89A5C;
  }
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; padding:0;}
.stage{
  background:var(--paper); color:var(--ink);
  font-family:var(--sans); line-height:1.7; font-size:16.5px; letter-spacing:.01em;
  -webkit-font-smoothing:antialiased; min-height:100vh; transition:background .3s ease, color .3s ease;
}
a{color:inherit; text-decoration:none; cursor:pointer;}
img{max-width:100%; height:auto;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}

/* ---------- header ---------- */
.site-head{position:sticky; top:0; z-index:60; background:color-mix(in srgb,var(--paper) 85%, transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line);}
.head-inner{max-width:var(--maxw); margin:0 auto; padding:18px 32px; display:flex; align-items:center; justify-content:space-between; gap:20px; position:relative;}
.brand{font-family:var(--serif); font-size:21px; letter-spacing:.02em; line-height:1.25; white-space:nowrap;}
.brand .en{display:block; font-family:var(--mono); font-size:9px; letter-spacing:.3em; text-transform:uppercase; color:var(--muted); margin-top:5px;}
.head-right{display:flex; align-items:center; gap:26px;}
.nav{display:flex; gap:30px; font-size:14.5px; color:var(--ink-soft);}
.nav a{position:relative; padding-bottom:4px; transition:color .2s;}
.nav a:hover{color:var(--ink);}
.nav a.on{color:var(--ink);}
.nav a.on::after{content:""; position:absolute; left:0; right:0; bottom:-1px; height:1.5px; background:var(--accent);}
.theme-toggle{display:inline-flex; border:1px solid var(--line-strong); border-radius:3px; overflow:hidden;}
.theme-toggle button{width:34px; height:30px; display:inline-flex; align-items:center; justify-content:center; background:var(--raise); color:var(--muted); border:none; cursor:pointer; font-size:14px; border-left:1px solid var(--line); transition:color .2s,background .2s;}
.theme-toggle button:first-child{border-left:none;}
.theme-toggle button[aria-pressed="true"]{color:var(--ink); background:var(--paper-2);}
.theme-toggle button:hover{color:var(--ink);}
.menu-btn{display:none; width:40px; height:36px; align-items:center; justify-content:center; background:none; border:1px solid var(--line-strong); border-radius:3px; cursor:pointer; color:var(--ink); padding:0;}
.menu-btn svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.5;}

/* ---------- hero ---------- */
.hero{padding:96px 0 68px; border-bottom:1px solid var(--line);}
.kicker{font-family:var(--mono); font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--accent); margin:0 0 24px;}
.hero h1{font-family:var(--serif); font-weight:400; margin:0; font-size:clamp(2.4rem,6.4vw,4.5rem); line-height:1.14; letter-spacing:.01em; text-wrap:balance;}
.hero p.lead{max-width:38ch; margin:28px 0 0; color:var(--ink-soft); font-size:clamp(1rem,1.4vw,1.12rem); line-height:1.85;}

/* ---------- meta strip ---------- */
.strip{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.strip .cell{background:var(--paper); padding:26px;}
.strip .lab{font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted);}
.strip .val{font-family:var(--serif); font-size:26px; margin-top:10px; letter-spacing:.02em;}
.strip .val small{font-size:13px; color:var(--muted); font-family:var(--sans); margin-left:6px;}

/* ---------- section head ---------- */
.sec{padding:64px 0 0;}
.sec-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:32px;}
.sec-head h2{font-family:var(--serif); font-weight:400; font-size:24px; margin:0; letter-spacing:.03em;}
.sec-head .idx{font-family:var(--mono); font-size:11px; letter-spacing:.2em; color:var(--muted); cursor:pointer;}

/* ---------- featured ---------- */
.feature{display:grid; grid-template-columns:1.15fr 1fr; border:1px solid var(--line); background:var(--raise);}
.feature .media{border-right:1px solid var(--line);}
.feature .body{padding:38px 38px 34px; display:flex; flex-direction:column;}
.tag{font-family:var(--mono); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--accent);}
.feature h3{font-family:var(--serif); font-weight:400; font-size:clamp(1.5rem,2.4vw,2rem); line-height:1.28; margin:16px 0 0; letter-spacing:.01em;}
.feature p{color:var(--ink-soft); margin:18px 0 0; font-size:15.5px; line-height:1.8;}
.feature .foot{margin-top:auto; padding-top:26px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:var(--muted);}
.readmore{color:var(--ink); border-bottom:1.5px solid var(--accent); padding-bottom:2px; white-space:nowrap;}

/* ---------- grid ---------- */
.grid{display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:26px;}
.card{border:1px solid var(--line); background:var(--raise); display:flex; flex-direction:column; transition:border-color .25s, transform .25s;}
.card:hover{border-color:var(--line-strong); transform:translateY(-3px);}
.card .media{border-bottom:1px solid var(--line); aspect-ratio:16/9;}
.card .c-body{padding:24px 26px 26px;}
.card .c-meta{display:flex; gap:14px; font-family:var(--mono); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}
.card h3{font-family:var(--serif); font-weight:400; font-size:19px; line-height:1.4; margin:14px 0 0; letter-spacing:.01em;}
.card p{color:var(--ink-soft); font-size:14px; line-height:1.7; margin:12px 0 0;}

/* ---------- media plate (image or svg fallback) ---------- */
.media{position:relative; overflow:hidden; color:var(--ink); background:repeating-linear-gradient(0deg,transparent,transparent 7px,color-mix(in srgb,var(--line) 55%,transparent) 7px,color-mix(in srgb,var(--line) 55%,transparent) 8px);}
.media img{width:100%; height:100%; object-fit:cover; display:block;}
.media svg{display:block; width:100%; height:100%;}
.media .glyph{stroke:currentColor; fill:none; opacity:.6;}
.media .glyph-fill{fill:currentColor; opacity:.5;}

/* ---------- footer ---------- */
.foot-full{margin-top:78px; border-top:1px solid var(--line); padding:46px 0 68px; display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:22px; max-width:var(--maxw); margin-left:auto; margin-right:auto; padding-left:32px; padding-right:32px;}
.foot-full .f-brand{font-family:var(--serif); font-size:18px;}
.foot-full .f-note{font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:var(--muted); white-space:nowrap;}

/* ---------- article list ---------- */
.list-head{padding:72px 0 0;}
.list-head .kicker{margin:0 0 18px;}
.list-head h1{font-family:var(--serif); font-weight:400; font-size:clamp(2rem,4.4vw,3rem); margin:0; letter-spacing:.02em;}
.filters{display:flex; flex-wrap:wrap; gap:10px; margin:34px 0 8px; padding-bottom:28px; border-bottom:1px solid var(--line);}
.chip{font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:var(--ink-soft); background:none; border:1px solid var(--line-strong); border-radius:2px; padding:8px 15px; cursor:pointer; transition:color .2s,border-color .2s,background .2s;}
.chip:hover{color:var(--ink); border-color:var(--accent);}
.chip.on{color:var(--paper); background:var(--ink); border-color:var(--ink);}
.rows{margin-top:6px;}
.row{display:grid; grid-template-columns:190px 1fr auto; gap:30px; align-items:center; padding:26px 0; border-bottom:1px solid var(--line); cursor:pointer; transition:padding-left .25s;}
.row:hover{padding-left:8px;}
.row .thumb{aspect-ratio:16/10; border:1px solid var(--line);}
.row .r-body .r-cat{font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent);}
.row .r-body h3{font-family:var(--serif); font-weight:400; font-size:21px; line-height:1.34; margin:9px 0 0; letter-spacing:.01em; transition:color .2s;}
.row:hover .r-body h3{color:var(--accent);}
.row .r-body p{color:var(--ink-soft); font-size:14px; line-height:1.7; margin:9px 0 0;}
.row .r-side{text-align:right; font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--muted); white-space:nowrap;}
.row .r-side .arrow{display:block; margin-top:10px; font-size:15px; color:var(--ink-soft);}
.empty-note{padding:60px 0; color:var(--muted); font-family:var(--mono); font-size:13px; letter-spacing:.1em;}

/* ---------- article ---------- */
.art-wrap{max-width:720px; margin:0 auto; padding:0 32px;}
.art-top{padding:60px 0 0;}
.backlink{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); display:inline-block; margin-bottom:22px;}
.backlink:hover{color:var(--accent);}
.breadcrumb{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted);}
.breadcrumb .accent{color:var(--accent);}
.art-title{font-family:var(--serif); font-weight:400; font-size:clamp(1.9rem,4.6vw,3.1rem); line-height:1.22; margin:18px 0 0; letter-spacing:.01em; text-wrap:balance;}
.art-meta{display:flex; flex-wrap:wrap; gap:20px; margin-top:24px; padding-bottom:28px; border-bottom:1px solid var(--line); font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; color:var(--muted);}
.art-meta b{color:var(--ink-soft); font-weight:400;}
.art-hero{margin:36px 0; border:1px solid var(--line); aspect-ratio:3/1.55; background:var(--raise);}
.art-body{font-size:17px; line-height:1.9; color:var(--ink);}
.art-body>*:first-child{margin-top:0;}
.art-body p{margin:0 0 24px;}
.art-body h2{font-family:var(--serif); font-weight:400; font-size:26px; margin:46px 0 18px; letter-spacing:.02em;}
.art-body h3,.art-body h4{font-family:var(--serif); font-weight:400; font-size:22px; margin:42px 0 16px; letter-spacing:.02em;}
.art-body ul,.art-body ol{margin:0 0 24px; padding-left:1.4em;}
.art-body li{margin:8px 0;}
.art-body img{border:1px solid var(--line);}
.art-body figure{margin:34px 0;}
.art-body figcaption{font-family:var(--mono); font-size:11px; letter-spacing:.08em; color:var(--muted); margin-top:12px; text-align:center;}
.art-body a{color:var(--accent); border-bottom:1px solid color-mix(in srgb,var(--accent) 40%,transparent);}
.art-body blockquote{margin:32px 0; padding:4px 0 4px 26px; border-left:2px solid var(--accent); font-family:var(--serif); font-size:21px; line-height:1.6; color:var(--ink); letter-spacing:.01em;}
.art-body blockquote p{margin:0;}

/* ---------- share ---------- */
.share{margin:54px 0 0; border:1px solid var(--line); background:var(--paper-2); display:grid; grid-template-columns:auto 1fr; gap:32px; padding:34px 36px; align-items:center;}
.qr{width:132px; height:132px; background:#fff; border:1px solid var(--line-strong); padding:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center;}
.qr svg,.qr img,.qr canvas{display:block; width:100%; height:100%;}
.share .s-body h5{font-family:var(--serif); font-weight:400; font-size:20px; margin:0 0 6px; letter-spacing:.02em;}
.share .s-body p{margin:0 0 18px; color:var(--ink-soft); font-size:14.5px; line-height:1.7;}
.s-actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center;}
.btn{font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; padding:11px 20px; border:1px solid var(--line-strong); background:var(--raise); color:var(--ink); cursor:pointer; border-radius:2px; transition:background .2s,color .2s,border-color .2s;}
.btn:hover{border-color:var(--accent);}
.btn.primary{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.btn.primary:hover{background:var(--accent); border-color:var(--accent); color:#fff;}
.copied{font-family:var(--mono); font-size:11px; letter-spacing:.1em; color:var(--accent); opacity:0; transition:opacity .3s;}
.copied.show{opacity:1;}

/* ---------- about / generic page ---------- */
.about{max-width:900px; margin:0 auto; padding:76px 32px 0;}
.about .kicker{margin-bottom:20px;}
.about h1{font-family:var(--serif); font-weight:400; font-size:clamp(2rem,4.2vw,3rem); margin:0 0 40px; letter-spacing:.02em;}
.about-grid{display:grid; grid-template-columns:300px 1fr; gap:44px; align-items:start;}
.portrait{border:1px solid var(--line); aspect-ratio:3/4; background:var(--raise);}
.about-text{font-size:16.5px; line-height:1.95; color:var(--ink-soft);}
.about-text>*:first-child{margin-top:0;}
.about-text p{margin:0 0 22px;}
.about-text p:first-of-type{font-family:var(--serif); font-size:19px; color:var(--ink); line-height:1.8;}
.about-text h2,.about-text h3{font-family:var(--serif); font-weight:400; color:var(--ink); margin:30px 0 14px;}
.about-text a{color:var(--accent);}
.page-simple{max-width:720px; margin:0 auto; padding:70px 32px 0;}
.page-simple h1{font-family:var(--serif); font-weight:400; font-size:clamp(2rem,4.2vw,2.8rem); margin:0 0 30px; letter-spacing:.02em;}
.page-simple .art-body{font-size:16.5px;}

/* ---------- poster modal ---------- */
.poster-modal{position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:24px;}
.poster-modal[hidden]{display:none;}
.poster-backdrop{position:absolute; inset:0; background:rgba(10,9,8,.72); backdrop-filter:blur(4px);}
.poster-inner{position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:16px; max-height:92vh;}
.poster-inner img{max-width:min(420px,86vw); max-height:70vh; border:1px solid rgba(255,255,255,.15); box-shadow:0 24px 60px rgba(0,0,0,.5); background:#FAF9F6;}
.poster-actions{display:flex; gap:12px;}
.poster-actions .btn.primary{background:#fff; color:#1A1815; border-color:#fff;}
.poster-actions .btn{background:transparent; color:#fff; border-color:rgba(255,255,255,.4); text-decoration:none;}
.poster-hint{font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:rgba(255,255,255,.7); margin:0;}

/* ---------- reveal ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1; transform:none; transition:none;} .card:hover,.stage{transition:none;} }

/* ---------- WP admin bar offset ---------- */
body.admin-bar .site-head{top:32px;}
@media (max-width:782px){ body.admin-bar .site-head{top:46px;} }

/* ---------- mobile ---------- */
@media (max-width:760px){
  .wrap,.art-wrap,.about,.page-simple{padding-left:20px; padding-right:20px;}
  .foot-full{padding-left:20px; padding-right:20px;}
  .head-inner{padding:14px 20px;}
  .head-right{gap:12px;}
  .menu-btn{display:inline-flex;}
  .nav{position:absolute; top:100%; left:0; right:0; z-index:40; flex-direction:column; gap:0; align-items:stretch; background:var(--paper); border-bottom:1px solid var(--line); padding:6px 20px 14px; display:none; box-shadow:0 12px 24px rgba(0,0,0,.07);}
  .nav.open{display:flex;}
  .nav a{padding:13px 0; border-bottom:1px solid var(--line); font-size:15px;}
  .nav a:last-child{border-bottom:none;}
  .nav a.on::after{display:none;}
  .nav a.on{color:var(--accent);}
  .hero{padding:56px 0 42px;}
  .sec{padding:52px 0 0;}
  .feature{grid-template-columns:1fr;}
  .feature .media{border-right:none; border-bottom:1px solid var(--line); aspect-ratio:16/8;}
  .feature .body{padding:28px 24px;}
  .grid{grid-template-columns:1fr;}
  .strip{grid-template-columns:1fr;}
  .list-head{padding:48px 0 0;}
  .row{grid-template-columns:110px 1fr; gap:18px; align-items:start; padding:20px 0;}
  .row:hover{padding-left:0;}
  .row .r-side{display:none;}
  .row .r-body h3{font-size:18px;}
  .row .r-body p{display:none;}
  .share{grid-template-columns:1fr; justify-items:center; text-align:center; padding:30px 24px;}
  .share .s-body{text-align:center;} .s-actions{justify-content:center;}
  .about-grid{grid-template-columns:1fr; gap:28px;}
  .portrait{max-width:240px;}
  .foot-full{padding-top:38px; padding-bottom:54px;}
}