/* 谢霖作品集 · 样式表（改进版）
   由原版 fonts.css + styles.css + refinements.css 合并，删掉了另外三个方向（失序工作台/作品星图/数字标本馆）和顶部概念栏的样式；
   末尾是改进版新增与修正。 */

/* ===== 来自原版 fonts.css ===== */
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/barlow-condensed-600.woff2) format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/barlow-condensed-700.woff2) format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(fonts/barlow-condensed-800.woff2) format("woff2");
}
@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/dm-mono-400.woff2) format("woff2");
}
@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/dm-mono-500.woff2) format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/playfair-display-500-italic.woff2) format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/playfair-display-500.woff2) format("woff2");
}
@font-face{font-family:"Noto Sans SC";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/noto-sans-sc.woff2") format("woff2");}
@font-face{font-family:"Noto Serif SC";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/noto-serif-sc.woff2") format("woff2");}

/* ===== 来自原版 styles.css ===== */
:root{--ink:#20221e;--paper:#eeece4;--lime:#d9fa6d;--mono:"DM Mono",monospace;--display:"Barlow Condensed","Arial Narrow",sans-serif;--serif:"Playfair Display","Noto Serif SC",Georgia,serif;--sans:"Inter","Noto Sans SC","Microsoft YaHei",sans-serif;--bar:0px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;color:var(--ink);background:var(--paper);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
button,input{font:inherit}
button{color:inherit;cursor:pointer}
button{border:0;background:none}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button:focus-visible,a:focus-visible{outline:2px solid #63852b;outline-offset:5px}
button:disabled{opacity:.28;cursor:default}
::selection{background:var(--lime);color:#20221e}
.skip-link{position:fixed;top:-60px;left:20px;background:var(--lime);padding:12px;z-index:100}
.skip-link:focus{top:65px}
.mono,.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.06em}
.eyebrow{display:flex;align-items:center;gap:10px}
.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
main{min-height:calc(100vh - var(--bar));outline:0}
.site-header{height:93px;padding:0 4.3%;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:3}
.wordmark{display:flex;gap:14px;align-items:center}
.wordmark strong{font-size:26px;font-weight:900;letter-spacing:-1px}
.wordmark .wordmark-rule{height:29px;width:1px;background:currentColor;opacity:.3}
.wordmark span:last-child{font-family:var(--mono);font-size:9px;letter-spacing:1px;line-height:1.5}
.site-nav{display:flex;gap:30px;font-size:12px;align-items:center}
.site-nav button{padding:5px 0}
.site-nav button:hover{text-decoration:underline;text-underline-offset:5px}
.nav-dot{width:6px;height:6px;background:currentColor;border-radius:50%;display:inline-block;margin-right:7px}
.site-location{font-size:10px;font-family:var(--mono);letter-spacing:.03em;opacity:.7}
.text-button{padding:11px 0;border-bottom:1px solid currentColor;display:inline-flex;align-items:center;gap:40px;font-size:12px}
.text-button .arrow{font-size:22px;line-height:1}
.footer{display:flex;justify-content:space-between;align-items:center;padding:24px 4.3%;font-size:10px;font-family:var(--mono);border-top:1px solid #20221e30}
.footer button{font-family:var(--sans);font-size:12px}
.footer button:hover{text-decoration:underline}
.grain{position:relative}
.grain:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.045;z-index:1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.75' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.asterisk{display:inline-block;font-family:Arial,sans-serif;font-weight:400}
.pill{display:inline-flex;border:1px solid currentColor;border-radius:30px;padding:7px 13px;font-size:10px;gap:6px;align-items:center}
.reveal{animation:rise .65s both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
.editorial{background:#f4f1e9;color:#302f29;overflow:hidden}
.editorial .site-header{border-bottom:1px solid #302f29;margin:0 4.3%;padding:0}
.editorial .wordmark strong{font-family:var(--serif);font-size:30px}
.editorial .site-nav{font-family:var(--serif)}
.ed-hero{padding:34px 4.3% 50px;position:relative;display:grid;grid-template-columns:1.08fr 1fr;gap:5%;min-height:700px}
.ed-meta{display:flex;justify-content:space-between;border-bottom:1px solid #302f2960;padding-bottom:13px;grid-column:1 / -1;font-family:var(--mono);font-size:9px;letter-spacing:.04em}
.ed-title{position:relative;padding-top:7px;z-index:2}
.ed-title h1{font-family:var(--serif);font-weight:500;font-size:clamp(65px,7vw,118px);letter-spacing:-.075em;line-height:1.12;margin:13px 0 25px}
.ed-title h1 .indent{padding-left:.95em}
.ed-title h1 em{font-family:var(--serif);font-weight:500;color:#d94b30;letter-spacing:-.06em;display:block;font-size:1.15em;line-height:.95;margin-top:15px;margin-left:.4em;white-space:nowrap}
.ed-title p{font-size:12px;line-height:2;margin-left:9%;max-width:250px}
.ed-title .text-button{margin-left:9%;gap:90px}
.ed-feature{position:relative;margin-top:16px;min-height:495px;padding-top:20px}
.ed-feature .big-feature{width:85%;margin-left:5%;height:425px;background:#253d5b;cursor:pointer;padding:0;overflow:hidden;position:relative}
.ed-feature .big-feature img{width:100%;height:100%;object-fit:cover;object-position:75% 50%;transition:transform .8s}
.ed-feature .big-feature:hover img{transform:scale(1.045)}
.ed-feature .ed-caption{position:absolute;right:0;top:37px;writing-mode:vertical-rl;font-family:var(--mono);font-size:9px;letter-spacing:1px}
.ed-feature .ed-small{position:absolute;left:-8%;bottom:-22px;width:51%;height:185px;padding:7px;background:#eeeae0;border:1px solid #d9d2c2;transform:rotate(-7deg);box-shadow:0 10px 28px #312d2820;z-index:3}
.ed-small img{width:100%;height:100%;object-fit:cover}
.ed-stamp{position:absolute;right:-2%;bottom:1px;width:126px;height:126px;border:1px solid #d94b30;border-radius:50%;color:#d94b30;transform:rotate(18deg);display:flex;flex-direction:column;align-items:center;justify-content:center;font:10px var(--mono);gap:5px}
.ed-stamp b{font:italic 52px var(--serif);line-height:1}
.ed-mark{font-family:var(--serif);color:#d94b30;font-size:90px;position:absolute;top:-30px;right:7%;z-index:4;font-weight:400}
.ed-marquee{background:#d94b30;color:#f4f1e9;border-block:1px solid #302f29;padding:22px 0;overflow:hidden;white-space:nowrap;font-family:var(--serif);font-size:33px;letter-spacing:-1px;transform:rotate(-1.6deg) scale(1.03);margin:40px 0 15px}
.ed-marquee span{display:inline-block;animation:marquee 42s linear infinite}
@keyframes marquee{to{transform:translateX(-50%)}}
.ed-works{padding:95px 8.5%;position:relative}
.ed-section-title{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid #302f29;padding-bottom:24px}
.ed-section-title h2{font:italic 57px var(--serif);margin:0;letter-spacing:-2px}
.ed-projects{display:grid;grid-template-columns:1fr 1fr;gap:65px 10%;padding-top:50px}
.ed-project{position:relative;text-align:left;padding:0;min-width:0;align-self:start}
.ed-project:nth-child(even){margin-top:140px}
.ed-project .ed-img{overflow:hidden;background:#e7e0d2;position:relative;aspect-ratio:1.1}
.ed-project:nth-child(3) .ed-img{aspect-ratio:.9}
.ed-project img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.ed-project:hover img{transform:scale(1.04)}
.ed-project .ed-num{font:italic 44px var(--serif);color:#d94b30;position:absolute;left:-23px;top:-27px;z-index:1}
.ed-project h3{font:500 22px var(--serif);margin:17px 0 7px}
.ed-project .ed-project-meta{display:flex;justify-content:space-between;border-top:1px solid #302f2940;padding-top:11px;font:9px var(--mono)}
.ed-project .ed-project-meta .arrow{font-size:20px}
.ed-about{margin:0 4.3% 55px;border-block:1px solid #302f29;padding:60px 4.6%;display:grid;grid-template-columns:1fr 1fr;gap:15%}
.ed-about h2{font:500 43px var(--serif);margin:0;line-height:1.5;letter-spacing:-2px}
.ed-about p{line-height:2;font-size:13px}
body.modal-open{overflow:hidden}
dialog{padding:0;border:0;color:#20221e;background:#f3f1e9;box-shadow:0 30px 100px #0004;max-width:none;max-height:none}
dialog::backdrop{background:#111a20d9}
.project-dialog{width:min(1280px,94vw);height:min(840px,90svh);overflow:hidden}
.dialog-top{height:66px;border-bottom:1px solid #20221e2b;display:flex;align-items:center;justify-content:space-between;padding:0 27px;background:#f3f1e9;gap:20px}
.dialog-top .mono{font-size:10px}
.dialog-close{width:38px;height:38px;border:1px solid #20221e35;border-radius:50%;font-size:23px}
.dialog-close:hover{background:#20221e;color:#f3f1e9}
.project-body{display:grid;grid-template-columns:285px 1fr;height:calc(100% - 66px)}
.project-info{padding:35px 26px;border-right:1px solid #20221e2b;overflow:auto;display:flex;flex-direction:column}
.project-info .project-number{font:56px var(--display);line-height:1;color:#77786c}
.project-info h2{font:500 30px var(--serif);margin:18px 0 7px;line-height:1.4}
.project-info .project-en{font:9px var(--mono);letter-spacing:1px;margin-bottom:23px}
.project-info p{font-size:12px;line-height:2;color:#66675d}
.project-info .project-format{font-size:10px;padding:15px 0;border-block:1px solid #20221e20;margin:14px 0}
.project-info .source-note{font:9px var(--mono);line-height:1.8;opacity:.6;margin-top:auto;padding-top:30px;overflow-wrap:anywhere}
.project-info .text-button{font-size:11px;justify-content:space-between;margin-top:13px}
.project-visual{display:flex;flex-direction:column;min-width:0;min-height:0;background:#e4e3dd}
.image-stage{position:relative;flex:1;min-height:0;overflow:auto;display:flex;align-items:center;justify-content:center;padding:25px;background-image:linear-gradient(45deg,#dddcd610 25%,transparent 25%),linear-gradient(-45deg,#dddcd610 25%,transparent 25%)}
.image-stage img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 7px 30px #00000015}
.image-stage.full{display:block;text-align:center}
.image-stage.full img{max-height:none;width:100%;height:auto;max-width:1400px;margin:auto}
.image-stage .image-loading{position:absolute;inset:0;display:grid;place-content:center;font:10px var(--mono);pointer-events:none}
.project-controls{height:61px;flex-shrink:0;border-top:1px solid #20221e20;display:flex;align-items:center;justify-content:space-between;background:#f3f1e9;padding:0 24px;gap:12px}
.page-nav{display:flex;gap:17px;align-items:center}
.page-nav button{font-size:23px;width:30px;height:30px}
.page-nav span{font:10px var(--mono);min-width:58px;text-align:center}
.view-toggle{font-size:10px;border:1px solid #20221e40;padding:8px 12px;border-radius:20px}
.view-toggle[aria-pressed=true]{background:#20221e;color:#eee}
.page-range{width:110px;accent-color:#535d32;cursor:pointer}
.resume-dialog{width:min(900px,92vw);height:90svh;overflow:auto}
.resume-content{padding:38px 7% 50px}
.resume-title-row{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:2px solid #20221e;padding-bottom:25px}
.resume-title-row h2{font-size:54px;line-height:1;margin:16px 0 10px;letter-spacing:-3px}
.resume-title-row h2 small{font:24px var(--display);letter-spacing:0;margin-left:15px}
.resume-title-row p{font-size:12px;margin:0}
.resume-title-row .asterisk{font-size:77px;color:#809348;line-height:.9}
.resume-summary{padding:26px 0;display:grid;grid-template-columns:1fr 140px;gap:40px}
.resume-summary p{font-size:13px;line-height:2;margin:0}
.resume-summary .experience-count{font:64px var(--display);line-height:1}
.resume-summary .experience-count small{font:10px var(--sans);display:block;margin-top:10px}
.resume-section-heading{font:10px var(--mono);display:flex;justify-content:space-between;border-bottom:1px solid #20221e;letter-spacing:1px;padding-bottom:12px;margin-top:10px}
.resume-job{padding:23px 0;border-bottom:1px solid #20221e25;display:grid;grid-template-columns:135px 1fr;gap:20px}
.resume-job time{font:10px var(--mono);padding-top:3px}
.resume-job h3{font-size:15px;margin:0 0 7px}
.resume-job .company{font-size:11px;color:#6b6c63}
.resume-job p{font-size:11px;line-height:1.9;color:#66685c;margin:11px 0 0}
.resume-bottom{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin-top:28px}
.resume-bottom h3{font:10px var(--mono);letter-spacing:1px}
.resume-bottom p{font-size:11px;line-height:2}
.skill-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}
.skill-tags span{font-size:10px;border:1px solid #20221e40;padding:7px 9px}
.resume-actions{display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}
.resume-actions a{background:#20221e;color:#f3f1e9;padding:13px 21px;font-size:11px}
.resume-actions a.secondary{background:none;border:1px solid #20221e40;color:#20221e}
.resume-fine{font-size:9px;line-height:1.9;color:#77796d;margin-top:20px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,18px);padding:12px 22px;background:#20221e;color:#f2f2e9;font-size:11px;border-radius:5px;z-index:100;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 5px 20px #0002;max-width:90%;white-space:nowrap}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (min-width:1650px){
  .site-header{padding-inline:max(4.3%,calc((100vw - 1540px)/2))}
  .ed-hero{max-width:1600px;margin:auto}
}
@media (max-width:1100px){
  .site-location{display:none}
  .ed-hero{min-height:650px}
  .ed-feature .big-feature{height:355px}
  .ed-feature{min-height:443px}
  .ed-title h1{font-size:80px}
  .ed-feature .ed-small{bottom:7px;height:155px}
  .ed-stamp{width:105px;height:105px;bottom:25px}
}
@media (max-width:760px){
  :root{--bar:0px}
  .site-header{height:76px;padding-inline:6%}
  .wordmark strong{font-size:24px}
  .wordmark span:last-child{font-size:8px}
  .site-nav{gap:17px;font-size:11px}
  .site-nav .nav-dot{display:none}
  .footer>span:nth-child(2){display:none}
  .editorial .site-header{margin:0 6%}
  .ed-hero{padding:25px 6% 40px;display:block;min-height:0}
  .ed-meta{font-size:7px;gap:20px}
  .ed-title h1{font-size:70px;margin:18px 0 20px}
  .ed-title h1 .indent{padding-left:.75em}
  .ed-title h1 em{font-size:1.12em;margin-left:.55em}
  .ed-title p{margin-left:4px;font-size:11px;max-width:235px}
  .ed-title .text-button{margin-left:0;margin-top:0;font-size:10px;gap:30px}
  .ed-feature{margin-top:20px;min-height:350px;padding-top:15px}
  .ed-feature .big-feature{width:85%;margin-left:10%;height:300px}
  .ed-feature .ed-small{left:0;bottom:-5px;width:47%;height:139px}
  .ed-feature .ed-caption{right:0;top:27px;font-size:7px}
  .ed-mark{font-size:70px;right:8%;top:-28px}
  .ed-stamp{width:94px;height:94px;right:0;bottom:-24px;font-size:8px}
  .ed-stamp b{font-size:37px}
  .ed-marquee{font-size:25px;margin:42px 0 0;padding:14px 0}
  .ed-works{padding:64px 8%}
  .ed-section-title h2{font-size:38px}
  .ed-section-title .mono{font-size:8px}
  .ed-projects{grid-template-columns:1fr;gap:47px;padding-top:40px}
  .ed-project:nth-child(even){margin-top:0;margin-left:13%}
  .ed-project:nth-child(odd){margin-right:9%}
  .ed-project h3{font-size:21px}
  .ed-project .ed-num{font-size:37px;left:-17px;top:-23px}
  .ed-about{margin:0 6% 30px;padding:35px 0;display:block}
  .ed-about h2{font-size:33px;letter-spacing:-1px}
  .ed-about p{font-size:11px}
  .editorial .footer{font-size:8px;padding:22px 6%}
  .project-dialog{width:100vw;height:100svh}
  .dialog-top{height:57px;padding:0 18px}
  .dialog-top .mono{font-size:8px}
  .project-body{height:calc(100% - 57px);display:flex;flex-direction:column}
  .project-info{flex-shrink:0;padding:17px 20px;border:0;border-bottom:1px solid #20221e25;display:grid;grid-template-columns:1fr auto;gap:3px 15px;overflow:visible}
  .project-info .project-number{display:none}
  .project-info h2{font-size:22px;margin:0;grid-column:1}
  .project-info .project-en{font-size:8px;margin:0;grid-column:1}
  .project-info p{font-size:10px;line-height:1.7;margin:7px 0 0;grid-column:1 / -1}
  .project-info .project-format{border:0;padding:0;margin:0;font-size:9px;grid-column:2;grid-row:1 / 3;align-self:center}
  .project-info .source-note{display:none}
  .project-info .text-button{display:none}
  .project-visual{flex:1}
  .image-stage{padding:16px}
  .project-controls{padding:0 15px;height:58px}
  .page-nav{gap:8px}
  .page-nav span{font-size:9px;min-width:55px}
  .page-range{width:65px}
  .view-toggle{font-size:9px;padding:8px 9px}
  .resume-dialog{width:100vw;height:100svh}
  .resume-content{padding:24px 6% 40px}
  .resume-title-row h2{font-size:42px}
  .resume-title-row h2 small{font-size:20px}
  .resume-title-row .asterisk{font-size:62px}
  .resume-title-row p{font-size:10px}
  .resume-summary{grid-template-columns:1fr 75px;gap:18px;padding:22px 0}
  .resume-summary p{font-size:11px}
  .resume-summary .experience-count{font-size:52px}
  .resume-summary .experience-count small{font-size:9px;line-height:1.7}
  .resume-job{grid-template-columns:1fr;gap:12px;padding:21px 0}
  .resume-job h3{font-size:14px}
  .resume-job time{font-size:9px}
  .resume-bottom{grid-template-columns:1fr;gap:15px}
  .resume-section-heading{font-size:9px}
  .toast{font-size:10px;bottom:15px;white-space:normal;text-align:center;width:max-content}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
.ed-stamp b{font-size:34px;white-space:nowrap}
@media (max-width:760px){
  .ed-stamp b{font-size:26px}
}
@media (max-width:380px){
  .site-nav{gap:12px;font-size:10px}
  .wordmark{gap:9px}
  .wordmark span:last-child{font-size:7px}
  .ed-title h1{font-size:62px}
}

/* ===== 来自原版 refinements.css ===== */
.editorial-v2 .ed-hero{grid-template-columns:1fr 1.08fr;gap:4%;padding-bottom:62px}
.editorial-v2 .ed-feature{display:flex;align-items:center;padding:0 16px 0 0;min-height:510px}
.hero-reading-table{position:relative;width:100%;height:470px;background:#dedfd5;border:1px solid #302f2910;display:block;isolation:isolate;transition:background .3s}
.hero-reading-table:hover{background:#d6d9cd}
.hero-table-label{position:absolute;left:25px;top:24px;font:8px var(--mono);letter-spacing:1.5px;color:#616652}
.hero-back-page,.hero-main-page{position:absolute;height:auto;object-fit:contain;box-shadow:0 10px 25px #1d2c2925;border:1px solid #ffffff80;transition:transform .5s}
.hero-back-page{width:66%;left:25%;top:15%;transform:rotate(8deg)}
.hero-main-page{width:88%;left:4%;top:30%;transform:rotate(-6deg)}
.hero-reading-table:hover .hero-main-page{transform:translateY(-7px) rotate(-3deg)}
.hero-open{position:absolute;bottom:21px;left:25px;right:25px;display:flex;align-items:center;justify-content:space-between;text-align:left;font:18px var(--serif)}
.hero-open small{display:block;font:8px var(--mono);letter-spacing:.7px;margin-top:6px}
.hero-open b{font:24px var(--sans);border:1px solid #302f2955;border-radius:50%;width:38px;height:38px;display:grid;place-items:center}
.editorial-v2 .ed-caption{right:-13px;top:78px}
.editorial-v2 .ed-mark{top:9px;right:-3%;font-size:84px}
.editorial-v2 .ed-stamp{right:-14px;bottom:-13px;background:#f4f1e9f0;width:108px;height:108px}
.editorial-v2 .ed-stamp b{font-size:24px}
.editorial-v2 .ed-marquee{margin-top:15px}
.editorial-v2 .ed-works{padding:88px 6.7% 100px}
.editorial-v2 .ed-section-title{align-items:end}
.editorial-v2 .ed-section-title .eyebrow{font-size:8px;margin-bottom:15px}
.ed-selection-note{font-size:11px;line-height:1.9;text-align:right;opacity:.65;padding-bottom:5px}
.curated-projects{grid-template-columns:repeat(12,minmax(0,1fr));gap:90px 5%;padding-top:65px}
.ed-story{min-width:0;align-self:start}
.story-tea{grid-column:1 / 8}
.story-jewelry{grid-column:8 / 13;margin-top:160px}
.story-brochure{grid-column:2 / 12;margin-top:10px}
.story-estate{grid-column:4 / 10;margin-top:10px}
.story-noodles{grid-column:7 / 13;margin-top:125px}
.story-art{position:relative;padding:0;width:100%;display:block;text-align:left}
.story-art:focus-visible{outline-offset:8px}
.story-art .ed-num{position:absolute;font:italic 42px var(--serif);color:#bf4b34;top:-35px;left:-13px;z-index:3}
.story-view{position:absolute;bottom:18px;right:18px;display:flex;gap:28px;padding:12px 16px;background:#f4f1e9ef;border:1px solid #302f2920;backdrop-filter:blur(6px);font-size:10px;opacity:0;transform:translateY(6px);transition:.25s;z-index:4}
.story-art:hover .story-view,.story-art:focus-visible .story-view{opacity:1;transform:none}
.story-view>span{font-size:14px}
.ed-scene{position:relative;overflow:hidden;isolation:isolate;width:100%;aspect-ratio:1.13}
.scene-note{position:absolute;left:23px;top:22px;font:8px var(--mono);letter-spacing:1px;opacity:.6;z-index:2}
.scene-corner{position:absolute;bottom:23px;left:25px;line-height:1.65;font:8px/1.7 var(--mono);letter-spacing:1px;opacity:.6}
.scene-paper{position:absolute;object-fit:contain;width:auto;height:auto;border:1px solid #c6c8ba66;box-shadow:0 16px 24px #14252b23;transition:transform .6s}
.scene-tea{background:#dfe3d7}
.tea-mark{width:67%;top:11%;left:4%;transform:rotate(-8deg)}
.tea-pack{width:83%;top:38%;left:16%;transform:rotate(6deg)}
.story-art:hover .tea-pack{transform:translate(-3px,-8px) rotate(3deg)}
.scene-jewelry{background:#d6d9d1;aspect-ratio:.73}
.jewelry-portrait{position:absolute;width:75%;height:auto;left:6%;top:13%;box-shadow:0 12px 28px #28332d20}
.jewelry-strip{position:absolute;width:30%;height:73%;right:-2%;top:20%;transform:rotate(7deg);overflow:hidden;box-shadow:0 12px 28px #28332d2b;background:#fff}
.jewelry-strip img{width:100%;height:auto}
.scene-jewelry .scene-corner{font-size:8px}
.scene-city{aspect-ratio:1.9;background:#223b57;color:#f5eada}
.scene-city .scene-note{opacity:.8}
.city-human{width:48%;left:5%;top:18%;transform:rotate(-10deg)}
.city-landscape{width:43%;left:51%;top:14%;transform:rotate(8deg)}
.city-cover{width:57%;left:26%;top:31%;transform:rotate(-1deg)}
.scene-city .scene-corner{left:auto;right:26px;text-align:right;bottom:18px;opacity:.8}
.story-art:hover .city-cover{transform:translateY(-10px) rotate(1deg)}
.scene-poster{aspect-ratio:.82;display:grid;place-items:center;padding:53px 16% 57px}
.scene-estate{background:#dfe1dd}
.scene-noodles{background:#e8c8ac;aspect-ratio:.95}
.poster-print{height:100%;width:100%;object-fit:contain;filter:drop-shadow(8px 15px 12px #35291b24);transition:transform .5s}
.story-art:hover .poster-print{transform:translateY(-6px)}
.story-description{display:flex;justify-content:space-between;gap:20px;align-items:baseline;border-bottom:1px solid #302f2950;padding:20px 0 18px}
.story-description h3{font:500 25px var(--serif);margin:0 0 9px}
.story-description h3 button{padding:0;font:inherit;text-align:left}
.story-description h3 button:hover{color:#c24b34}
.story-description p{font:8px var(--mono);letter-spacing:1px;margin:0;opacity:.7}
.story-description>span{font-size:11px;text-align:right;white-space:nowrap}
.story-description small{font-size:9px;display:block;opacity:.5;margin-top:8px}
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reader-v2{width:min(1720px,calc(100vw - 28px));height:calc(100dvh - 28px);max-height:none;max-width:none;padding:0;background:#eeeae2;border:1px solid #ddd8ce;overflow:hidden;border-radius:4px;color:#302f29;margin:auto}
.reader-v2[open]{display:flex;flex-direction:column}
.reader-v2.reader-immersive{width:100vw;height:100dvh;border-radius:0;border:0}
.reader-v2::backdrop{background:#272b29eb}
.reader-v2 button:focus-visible,.reader-v2 input:focus-visible{outline:2px solid #bd533a;outline-offset:2px}
.reader-v2 button:hover{background:#d8d3c766}
.reader-v2 button:disabled:hover{background:none}
.reader-header{height:74px;flex-shrink:0;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;padding:0 24px;border-bottom:1px solid #b9b5a740;background:#f5f2eb;gap:15px;z-index:5}
.reader-back{justify-self:start;display:flex;align-items:center;gap:13px;font-size:18px;padding:10px 8px}
.reader-back span{font-size:11px}
.reader-heading{text-align:center;min-width:0}
.reader-heading>span{font:8px var(--mono);letter-spacing:1.2px;opacity:.5;display:block}
.reader-heading h2{font:500 21px var(--serif);margin:5px 0 0;line-height:1.3;white-space:nowrap}
.reader-header-actions{display:flex;align-items:center;justify-content:end;gap:9px}
.reader-header-actions button{font-size:18px;display:flex;gap:6px;align-items:center;padding:8px}
.reader-header-actions button span{font-size:10px;white-space:nowrap}
.reader-header-actions .reader-x{font-size:25px;padding:0;width:35px;height:35px;border:1px solid #302f2925;border-radius:50%;display:grid;place-items:center;margin-left:8px}
.reader-canvas{position:relative;flex:1;min-height:0;overflow:hidden;touch-action:none;user-select:none;overscroll-behavior:none;outline-offset:-4px!important;background:#deddd6;background-image:radial-gradient(#a7a69c30 .65px,transparent .65px);background-size:15px 15px}
.reader-canvas.can-pan{cursor:grab}
.reader-canvas.is-dragging{cursor:grabbing}
.reader-image{position:absolute;left:0;top:0;max-width:none!important;max-height:none!important;transform-origin:0 0;box-shadow:0 4px 20px #272b2918;pointer-events:none;user-select:none;will-change:transform;transition:opacity .16s;background:white}
.reader-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:15px;font-size:12px;background:#deddd6;z-index:2}
.reader-loading button{border-bottom:1px solid;padding:6px}
.reader-canvas-label{position:absolute;left:16px;bottom:12px;font:7px var(--mono);letter-spacing:1px;color:#76776b;pointer-events:none;writing-mode:vertical-rl;transform:rotate(180deg);background:#deddd6ac;padding:9px 5px}
.reader-toolbar{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:20px;flex-shrink:0;min-height:66px;padding:10px 25px;background:#f5f2eb;border-top:1px solid #c1bcae55;z-index:3}
.reader-toolbar button{border-radius:4px;min-width:33px;height:33px;display:inline-flex;align-items:center;justify-content:center;font-size:20px}
.reader-paging{display:flex;align-items:center;gap:8px}
.reader-page-field{display:flex;gap:6px;align-items:center;font:11px var(--mono);color:#6b6b5e}
.reader-page-field input{width:36px;padding:6px 1px;text-align:center;border:0;border-bottom:1px solid #302f2930;font:11px var(--mono);color:#302f29;background:transparent;appearance:textfield;-moz-appearance:textfield}
.reader-page-field input::-webkit-inner-spin-button,.reader-page-field input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.reader-toolbar .reader-thumbs-btn{gap:6px;font-size:18px;margin-left:9px;padding:0 7px}
.reader-thumbs-btn span{font-size:10px}
.reader-thumbs-btn[aria-expanded=true]{background:#e1dbcdaa}
.reader-zoom{display:flex;gap:10px;align-items:center;justify-content:center}
.reader-zoom-value{font:11px var(--mono);min-width:42px;text-align:center}
.reader-zoom-slider{width:110px;height:3px;accent-color:#bc5339;cursor:pointer}
.reader-modes{display:flex;align-items:center;justify-content:end;gap:5px}
.reader-modes button{font-size:10px;white-space:nowrap;padding:0 10px;border:1px solid #302f2920}
.reader-modes button[aria-pressed=true]{background:#302f29;color:#f5f2eb;border-color:#302f29}
.reader-hints{height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:9px;letter-spacing:.02em;opacity:.63;background:#f5f2eb}
.touch-hint{display:none}
.reader-info{position:absolute;z-index:8;top:75px;right:20px;width:340px;background:#f8f5ed;padding:27px 25px;border:1px solid #c0bbaa;box-shadow:0 18px 50px #2224}
.reader-info h3{font:22px var(--serif);margin:16px 0}
.reader-info p{font-size:12px;line-height:1.9;opacity:.75}
.reader-info dl{display:grid;grid-template-columns:70px 1fr;font-size:10px;gap:12px;padding-block:18px;border-block:1px solid #302f2920}
.reader-info dt{opacity:.5}
.reader-info dd{margin:0;overflow-wrap:anywhere}
.reader-info .reader-resolution{font-size:10px}
.reader-info>button{font-size:10px;margin-top:14px;border-bottom:1px solid #302f2980;padding:8px 0}
.reader-filmstrip{position:relative;display:flex;align-items:center;gap:10px;flex-shrink:0;height:97px;overflow-x:auto;overflow-y:hidden;background:#e7e3d9;padding:10px 24px;border-top:1px solid #302f2915;scrollbar-width:thin;scrollbar-color:#b7b2a4 #e7e3d9}
.reader-filmstrip button{flex:0 0 83px;height:76px;padding:4px;border:1px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:space-between;border-radius:3px;background:#f3efe6}
.reader-filmstrip img{height:49px;width:100%;object-fit:contain}
.reader-filmstrip span{font:8px var(--mono);opacity:.55}
.reader-filmstrip .selected{border-color:#ba523b;background:#fcf8ed;box-shadow:0 0 0 1px #ba523b}
.reader-filmstrip .selected span{opacity:1;color:#ba523b}
.reader-v2 [hidden]{display:none!important}
.reader-long-nav{position:absolute;top:50%;right:15px;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:9px;padding:9px 4px;border:1px solid #c4bca990;background:#f5f2eccc;backdrop-filter:blur(5px);border-radius:25px}
.reader-long-nav button{font-size:14px;width:24px;height:24px;border-radius:50%}
.reader-progress{height:80px;width:3px;background:#302f2920;position:relative;overflow:hidden;border-radius:2px}
.reader-progress i{position:absolute;top:0;left:0;width:100%;background:#b6573c;min-height:5%}
@media (min-width:1650px){
  .editorial-v2 .ed-hero{max-width:1600px;margin:auto}
  .editorial-v2 .ed-works{max-width:1500px;margin:auto}
  .hero-reading-table{height:540px}
}
@media (max-width:1100px){
  .editorial-v2 .ed-feature{min-height:450px}
  .hero-reading-table{height:400px}
  .hero-main-page{top:32%}
  .ed-scene .scene-note{font-size:7px;left:18px;top:17px}
  .scene-corner{font-size:7px;bottom:17px;left:18px}
  .curated-projects{gap:80px 4%}
  .story-jewelry{margin-top:125px}
  .story-description h3{font-size:22px}
  .story-description{gap:8px}
  .story-description>span{font-size:10px}
  .story-description small{font-size:8px}
  .scene-poster{padding:44px 13% 50px}
  .reader-toolbar{gap:9px;padding:10px 16px}
  .reader-modes button{padding:0 6px}
  .reader-zoom-slider{width:80px}
  .reader-header-actions button span{display:none}
  .reader-header-actions{gap:4px}
}
@media (max-width:760px){
  .editorial-v2 .ed-hero{display:block;padding:25px 6% 45px}
  .editorial-v2 .ed-feature{min-height:360px;margin-top:28px;padding-right:4px;display:block}
  .hero-reading-table{height:345px}
  .hero-table-label{top:18px;left:17px;font-size:7px}
  .hero-back-page{top:16%}
  .hero-main-page{top:31%;width:91%;left:2%}
  .hero-open{bottom:18px;left:17px;right:17px;font-size:17px}
  .hero-open small{font-size:7px}
  .hero-open b{width:32px;height:32px;font-size:20px}
  .editorial-v2 .ed-feature .ed-mark{top:-24px;right:-4px;font-size:65px}
  .editorial-v2 .ed-stamp{right:0;bottom:-26px;width:90px;height:90px}
  .editorial-v2 .ed-stamp b{font-size:19px}
  .editorial-v2 .ed-caption{right:-14px;top:47px;font-size:7px}
  .editorial-v2 .ed-marquee{margin-top:15px}
  .editorial-v2 .ed-works{padding:55px 6% 60px}
  .editorial-v2 .ed-section-title h2{font-size:36px}
  .editorial-v2 .ed-section-title .eyebrow{font-size:6px;margin-bottom:12px;gap:7px}
  .ed-selection-note{font-size:9px;max-width:86px}
  .curated-projects{display:block;padding-top:48px}
  .ed-story{margin:0 0 52px}
  .ed-story:last-child{margin-bottom:0}
  .story-jewelry{margin-left:10%}
  .story-estate{margin-right:10%}
  .story-noodles{margin-left:6%}
  .story-art .ed-num{font-size:32px;left:-9px;top:-26px}
  .scene-city{aspect-ratio:1.14}
  .city-human{width:61%;top:17%;left:1%}
  .city-landscape{width:49%;top:14%;left:47%}
  .city-cover{width:85%;left:10%;top:39%}
  .scene-city .scene-corner{bottom:14px;right:17px;font-size:7px}
  .scene-note{letter-spacing:.4px!important;font-size:6px!important}
  .story-description{padding:16px 0}
  .story-description h3{font-size:21px}
  .story-description p{font-size:7px}
  .story-description>span{font-size:9px}
  .story-description small{font-size:8px}
  .story-view{opacity:1;transform:none;font-size:9px;padding:8px 10px;bottom:13px;right:13px;gap:14px}
  .scene-corner{bottom:16px;left:16px;font-size:6px}
  .scene-jewelry .scene-corner{font-size:6px}
  .scene-poster{padding:43px 14% 49px}
  .reader-v2{width:100vw;height:100dvh;border-radius:0;border:0}
  .reader-header{height:64px;padding:0 12px;grid-template-columns:42px 1fr auto;gap:9px}
  .reader-back{font-size:21px;padding:8px}
  .reader-back span{display:none}
  .reader-heading{text-align:left}
  .reader-heading h2{font-size:18px;margin-top:3px}
  .reader-heading>span{font-size:6px;letter-spacing:.5px}
  .reader-header-actions{gap:2px}
  .reader-header-actions button{font-size:17px;padding:8px}
  .reader-header-actions .reader-x{display:none}
  .reader-header-actions button span{display:none}
  .reader-toolbar{grid-template-columns:1fr 1fr;padding:8px 12px 9px;gap:8px 6px;min-height:92px}
  .reader-paging{gap:4px}
  .reader-toolbar button{min-width:27px;height:30px}
  .reader-page-field{gap:3px;font-size:10px}
  .reader-page-field input{width:27px;font-size:10px}
  .reader-thumbs-btn{margin-left:4px!important;font-size:17px!important;padding:0 4px!important}
  .reader-thumbs-btn span{font-size:9px}
  .reader-zoom{gap:3px;justify-content:end}
  .reader-zoom-slider{width:48px}
  .reader-zoom-value{font-size:10px;min-width:36px}
  .reader-modes{grid-column:1 / -1;justify-content:center;gap:8px}
  .reader-modes button{padding:0 16px;height:27px;font-size:10px}
  .reader-hints{height:26px;padding:0 15px;font-size:8px;gap:10px}
  .desktop-hint{display:none}
  .touch-hint{display:inline}
  .reader-hints>span:last-child{font-size:7px;white-space:nowrap}
  .reader-canvas-label{left:3px;bottom:10px;font-size:6px;padding:6px 3px}
  .reader-info{top:65px;right:10px;width:calc(100% - 20px);max-width:350px;padding:22px}
  .reader-filmstrip{height:86px;padding:7px 15px}
  .reader-filmstrip button{flex-basis:74px;height:68px}
  .reader-filmstrip img{height:44px}
  .reader-long-nav{right:7px;padding:5px 2px}
  .reader-long-nav button{width:21px;height:22px;font-size:12px}
  .reader-progress{height:65px}
}
@media (max-width:360px){
  .reader-zoom-slider{width:33px}
  .reader-toolbar{padding-inline:8px;column-gap:3px}
  .reader-thumbs-btn span{display:none}
  .reader-header-actions{gap:0}
  .reader-heading h2{font-size:17px}
  .ed-selection-note{font-size:8px;max-width:68px}
  .editorial-v2 .ed-section-title h2{font-size:31px}
  .hero-reading-table{height:306px}
  .editorial-v2 .ed-feature{min-height:320px}
  .story-description h3{font-size:19px}
}
@media (pointer:coarse){
  .reader-v2 button{min-height:36px}
  .reader-hints .desktop-hint{display:none}
  .reader-hints .touch-hint{display:inline}
  .story-view{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){
  .reader-image,.scene-paper,.poster-print,.hero-main-page,.hero-back-page{transition:none}
}
.hero-main-page{width:85%;height:65%;left:3%;top:17%;object-fit:contain;border:0;box-shadow:none;filter:drop-shadow(0 12px 14px #1d2c2927)}
.hero-back-page{width:66%;height:52%;left:29%;top:8%;object-fit:contain;border:0;box-shadow:none;filter:drop-shadow(0 7px 10px #1d2c2920)}
.hero-open{bottom:19px}
.tea-pack{width:79%;top:30%;left:15%}
.city-cover{width:52%;left:27%;top:22%}
.reader-page-field,.reader-page-field span,.reader-thumbs-btn span{white-space:nowrap}
.reader-page-field input{flex-shrink:0}
.reader-toolbar .reader-thumbs-btn{flex-shrink:0}
@media (max-width:760px){
  .hero-main-page{width:88%;height:66%;left:2%;top:18%}
  .hero-back-page{width:67%;height:51%;left:29%;top:8%}
  .city-cover{width:79%;left:13%;top:34%}
  .reader-thumbs-btn span{display:none}
  .reader-page-field input{width:25px}
  .reader-paging{gap:3px}
  .reader-toolbar .reader-thumbs-btn{margin-left:2px}
}

/* ===== 改进版新增 / 修正 ===== */

/* 首屏：服务说明 + 行动按钮 */
.ed-title p.ed-offer{max-width:340px;font-size:13px;line-height:1.95}
.ed-offer strong{display:block;font:500 17px/1.5 var(--serif);letter-spacing:.02em;margin-bottom:4px}
.ed-hero-actions{display:flex;align-items:center;gap:34px;margin:26px 0 0 9%;flex-wrap:wrap}
.ed-title .ed-hero-actions .text-button{margin-left:0;gap:44px}
.hero-cta{display:inline-flex;align-items:center;gap:14px;padding:13px 22px;background:#20221e;color:#f4f1e9;font-size:13px;border-radius:999px;transition:background .2s,transform .2s}
.hero-cta:hover{background:#d94b30}
.hero-cta:active{transform:scale(.97)}

/* 页头“联系” */
.site-nav .nav-contact{padding:6px 14px;border:1px solid currentColor;border-radius:999px}
.site-nav .nav-contact:hover{background:#20221e;color:#f4f1e9;text-decoration:none}

/* 修正：竖排图注与红色星号不再重叠；“ON THE READING TABLE”不被图片压住 */
.editorial-v2 .ed-caption{top:132px}
.hero-table-label{z-index:5}

/* 修正：选题说明不再出现单字换行 */
.ed-selection-note{text-wrap:balance}

/* 联系区 */
.ed-contact{margin:0 4.3% 60px;padding:64px 4.6%;background:#20221e;color:#f4f1e9;display:grid;grid-template-columns:1fr 1.15fr;gap:8%;position:relative;overflow:hidden}
.ed-contact:after{content:'✳';position:absolute;right:-18px;top:-46px;font:400 190px var(--serif);color:#d94b30;opacity:.9;pointer-events:none}
.ed-contact .eyebrow{color:#d9fa6d}
.ed-contact h2{font:500 46px/1.35 var(--serif);letter-spacing:-2px;margin:18px 0 0}
.contact-body{position:relative;z-index:1}
.contact-label{font:12px var(--mono);letter-spacing:.08em;opacity:.7}
.contact-phone{display:block;font:500 clamp(34px,4.2vw,56px)/1.2 var(--serif);letter-spacing:.01em;margin:8px 0 22px;color:#f4f1e9}
.contact-phone.is-missing{color:#f09a86;font-size:28px;border:1px dashed #f09a86;display:inline-block;padding:6px 14px}
a.contact-phone:hover{color:#d9fa6d}
.contact-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px}
.ed-contact .hero-cta{background:#d9fa6d;color:#20221e}
.ed-contact .hero-cta:hover{background:#f4f1e9}
.contact-copy{padding:13px 20px;border:1px solid #f4f1e966;border-radius:999px;font-size:13px}
.contact-copy:hover{border-color:#f4f1e9}
.contact-services{list-style:none;padding:0;margin:0 0 26px;display:flex;flex-wrap:wrap;gap:8px}
.contact-services li{padding:7px 13px;border:1px solid #f4f1e940;border-radius:999px;font-size:12px}
.contact-job{font-size:12px;line-height:1.9;opacity:.8;margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px}
.contact-job .text-button{gap:26px;padding:6px 0}

/* 简历弹窗里的电话 */
.resume-phone{display:flex;align-items:baseline;gap:16px;margin:4px 0 30px;padding:14px 0;border-block:1px solid #20221e26;font:500 22px var(--serif)}
.resume-phone small{font:11px var(--mono);letter-spacing:.06em;opacity:.6}
.resume-phone.is-missing{color:#b8412a}
a.resume-phone:hover{color:#d94b30}

/* 修正：装饰小字最小 9px（原来有 6–8px） */
.hero-table-label,.scene-note,.scene-corner,.story-description p,.ed-section-title .eyebrow,.ed-meta span,.hero-open small{font-size:9px}

/* 手机端浮动“联系我” */
.float-contact{display:none}

@media (max-width:760px){
  /* 修正：手机端最小字号 */
  .hero-table-label,.editorial-v2 .ed-caption,.ed-feature .ed-caption{font-size:9px}
  .ed-selection-note{font-size:11px;max-width:none}
  .editorial .footer{font-size:10px}
  .scene-note,.scene-corner{font-size:9px !important}
  .ed-title p.ed-offer{font-size:13px;max-width:none;margin-left:4px}
  .ed-offer strong{font-size:16px}
  .ed-hero-actions{margin:22px 0 0 4px;gap:24px}
  .ed-title .ed-hero-actions .text-button{font-size:12px;gap:26px}
  .editorial-v2 .ed-caption{top:70px}

  .ed-section-title .eyebrow,.story-description p,.story-description small,.hero-open small,.ed-meta span{font-size:9px !important}
  .ed-about .eyebrow,.ed-contact .eyebrow{font-size:10px}
  /* 修正：手机上角落小字会压到作品图，隐藏 */
  .scene-corner{display:none}
  /* 修正：“进入阅读”在手机上不再盖住作品，整张卡片本身可点 */
  .story-view{display:none}

  .site-nav{gap:14px;font-size:12px}
  .site-nav .nav-contact{padding:5px 11px}

  .ed-contact{display:block;margin:0 0 40px;padding:46px 6% 50px}
  .ed-contact:after{font-size:130px;right:-12px;top:-30px}
  .ed-contact h2{font-size:34px;letter-spacing:-1px;margin-bottom:26px}
  .contact-phone{font-size:36px}

  .float-contact{display:flex;align-items:center;gap:8px;position:fixed;right:16px;bottom:18px;z-index:40;padding:12px 18px;border-radius:999px;background:#20221e;color:#f4f1e9;font-size:13px;box-shadow:0 8px 24px #0003;opacity:0;transform:translateY(12px);pointer-events:none;transition:.25s}
  .float-contact.show{opacity:1;transform:none;pointer-events:auto}
  body.modal-open .float-contact{display:none}
}
@media (max-width:380px){
  .site-nav{gap:10px;font-size:11px}
  .wordmark span:last-child{display:none}
}
@media (prefers-reduced-motion:reduce){
  .hero-cta,.float-contact{transition:none}
}
.editorial .ed-section-title .eyebrow,.editorial .scene-corner,.editorial .wordmark span{font-size:9px !important}

/* ===== 长图阅读：原生滚动 =====
   注意：弹窗背后不要用全屏 backdrop-filter 模糊，滚动时每帧都要重算，会把帧率拖到约 30fps */
.reader-canvas.is-long{touch-action:auto;cursor:auto}
.reader-scroll{position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;outline:none}
.reader-scroll:focus-visible{outline:2px solid #63852b;outline-offset:-4px}
.long-stack{margin:36px auto 60px;background:#fff;box-shadow:0 4px 20px #272b2918}
.long-stack img+img{margin-top:-1px} /* 切片接缝防细线 */
.long-stack img{display:block;width:100%;height:auto;max-width:none!important;user-select:none;-webkit-user-drag:none}
.reader-long-nav[hidden]{display:none}
@media (max-width:760px){.long-stack{margin:0 auto 24px}}

/* ===== 作品图库：统一卡片 ===== */
.ed-more{padding:10px 4.3% 70px}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 4%;margin-top:34px}
.more-art{position:relative;display:block;width:100%;aspect-ratio:4/5;background:#e3e1d8;overflow:hidden}
.more-art img{width:100%;height:100%;object-fit:contain;padding:7%;transition:transform .35s}
.more-art img.is-long{object-fit:cover;object-position:top;padding:7% 16% 0}
.more-art:hover img{transform:scale(1.025)}
.more-count{position:absolute;left:14px;bottom:12px;font:9px var(--mono);letter-spacing:.08em;color:#5b5e50;background:#f4f1e9d9;padding:5px 8px}
.ai-tag{position:absolute;right:12px;top:12px;font-size:11px;padding:5px 9px;border-radius:999px;background:#20221e;color:#f4f1e9}
.ai-note{display:inline-block;font-size:12px;padding:4px 10px;border-radius:999px;background:#20221e;color:#f4f1e9;margin:0 0 6px}
.more-card .story-description{margin-top:14px}
.more-no{font:italic 500 20px var(--serif);color:#d94b30}
@media (max-width:1000px){.more-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.ed-more{padding:0 6% 50px}.more-grid{gap:30px 4%;margin-top:22px}.more-card h3{font-size:15px}}
@media (prefers-reduced-motion:reduce){.more-art img{transition:none}}
.more-card .story-description p{font:12px var(--sans);letter-spacing:0;opacity:.75}
@media (max-width:760px){.more-card .story-description p{font-size:11px !important}}

/* ===== 精修前后对比（compare.js） ===== */
.ed-compare{padding:88px 6.7% 30px;max-width:1500px;margin:auto}
.cmp-layout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5.5%;margin-top:40px;align-items:start}
.cmp-stage{position:relative;height:min(78vh,760px);aspect-ratio:var(--ar);max-width:100%;overflow:hidden;background:#e3e1d8;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;-webkit-tap-highlight-color:transparent}
.cmp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:opacity .25s}
.cmp-after{position:absolute;inset:0;clip-path:inset(0 0 0 calc(var(--pos) * 1%))}
.cmp-line{position:absolute;top:0;bottom:0;left:calc(var(--pos) * 1%);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px #20221e22;pointer-events:none}
.cmp-handle{position:absolute;left:calc(var(--pos) * 1%);top:86%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#fff;color:#20221e;display:grid;place-items:center;font:600 17px/1 var(--sans);letter-spacing:5px;text-indent:5px;box-shadow:0 4px 14px #20221e33;cursor:ew-resize;transition:transform .15s}
.cmp-stage.is-dragging .cmp-handle{transform:scale(1.08)}
.cmp-handle:focus-visible{outline:3px solid #d94b30;outline-offset:3px}
.cmp-label{position:absolute;top:14px;padding:6px 11px;font-size:12px;line-height:1.2;background:#20221ec2;color:#f4f1e9;border-radius:999px;pointer-events:none;transition:opacity .2s}
.cmp-label.is-before{left:14px}.cmp-label.is-after{right:14px}.cmp-label.is-hidden{opacity:0}
.ai-tag.cmp-ai{top:auto;right:auto;left:14px;bottom:14px;pointer-events:none}
.ai-tag.cmp-ai[hidden]{display:none}
.cmp-stage.is-switching .cmp-img{opacity:.55}
.cmp-list{display:flex;flex-direction:column;border-top:1px solid #302f2930}
.cmp-list button{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:center;padding:12px 10px 12px 0;border-bottom:1px solid #302f2930;text-align:left;opacity:.6;transition:opacity .2s,padding .2s;box-shadow:inset 0 0 #d94b30}
.cmp-list button:hover{opacity:.9}
.cmp-list button.selected{opacity:1;padding-left:14px;box-shadow:inset 3px 0 #d94b30}
.cmp-list img{width:52px;aspect-ratio:2/3;height:auto;object-fit:cover;background:#e3e1d8;display:block}
.cmp-list b{display:block;font:italic 500 14px var(--serif);color:#d94b30}
.cmp-list strong{display:block;font:500 17px var(--serif);margin:2px 0 3px}
.cmp-list small{font-size:12px;opacity:.7}
.cmp-detail{margin-top:28px}
.cmp-detail h3{font:500 26px var(--serif);margin:0 0 6px}
.cmp-detail p{font-size:14px;line-height:1.85;max-width:34em;margin:0 0 10px}
.cmp-detail .cmp-type{font-size:12px;opacity:.65;margin-bottom:14px}
.cmp-variants{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:16px 0}
.cmp-variants span{font-size:12px;opacity:.7;margin-right:4px}
.cmp-variants button{padding:8px 15px;border:1px solid #302f2960;border-radius:999px;font-size:13px;background:transparent}
.cmp-variants button[aria-pressed="true"]{background:#20221e;color:#f4f1e9;border-color:#20221e}
.cmp-detail .cmp-note{font-size:12px;opacity:.6;margin-top:16px}
@media (max-width:1000px){.cmp-stage{height:min(70vh,640px)}.cmp-layout{gap:4%}}
@media (max-width:760px){
  .ed-compare{padding:55px 6% 20px}
  .cmp-layout{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:22px}
  .cmp-stage{height:auto;width:100%}
  .cmp-handle{width:42px;height:42px;margin:-21px 0 0 -21px;font-size:15px}
  .cmp-label{top:10px;font-size:11px;padding:5px 9px}.cmp-label.is-before{left:10px}.cmp-label.is-after{right:10px}
  .ai-tag.cmp-ai{left:10px;bottom:10px}
  .cmp-list{flex-direction:row;overflow-x:auto;gap:8px;border:0;padding-bottom:4px;scrollbar-width:none}
  .cmp-list::-webkit-scrollbar{display:none}
  .cmp-list button{flex:0 0 auto;grid-template-columns:34px auto;gap:9px;padding:5px 12px 5px 5px;border:1px solid #302f2930;border-radius:10px;box-shadow:none}
  .cmp-list button.selected{padding-left:5px;border-color:#20221e;box-shadow:none;background:#fff8}
  .cmp-list img{width:34px}
  .cmp-list b,.cmp-list small{display:none}
  .cmp-list strong{font-size:14px;margin:0;white-space:nowrap}
  .cmp-detail{margin-top:6px}
  .cmp-detail h3{font-size:21px}
  .cmp-detail p{font-size:13px}
}
@media (prefers-reduced-motion:reduce){.cmp-img,.cmp-label,.cmp-handle,.cmp-list button{transition:none}}

/* ===== 阅读器：两侧翻页按钮 + 醒目的总览按钮（2026-09-27） ===== */
.reader-v2 .reader-side{position:absolute;top:50%;z-index:4;width:52px;height:52px;margin-top:-26px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid #c4bca9aa;background:#f7f4eecc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 6px 22px #2a2a2418,0 1px 2px #2a2a2412;color:#2b2a26;cursor:pointer;transition:opacity .2s,transform .2s,background .2s,color .2s,box-shadow .2s}
.reader-v2 .reader-side svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.reader-v2 .reader-side-prev{left:22px}
.reader-v2 .reader-side-next{right:22px}
.reader-v2 .reader-side:hover{background:#fffdf8;color:#ba523b;box-shadow:0 10px 28px #2a2a2426,0 1px 2px #2a2a2414}
.reader-v2 .reader-side-prev:hover{transform:translateX(-2px)}
.reader-v2 .reader-side-next:hover{transform:translateX(2px)}
.reader-v2 .reader-side:active{transform:scale(.95)}
.reader-v2 .reader-side:focus-visible{outline:2px solid #ba523b;outline-offset:3px}
.reader-v2 .reader-side:disabled{opacity:0;pointer-events:none}
/* 长图的上下进度条让到右侧按钮左边 */
.reader-canvas.is-long .reader-long-nav{right:88px}

/* 总览按钮：画布右上角，醒目的橙红色 */
.reader-v2 .reader-overview{position:absolute;top:18px;right:22px;z-index:5;display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 20px 0 16px;border-radius:22px;border:0;background:#ba523b;color:#fff;font-size:15px;font-weight:600;letter-spacing:.5px;box-shadow:0 8px 24px #ba523b45,0 2px 6px #2a2a2420;cursor:pointer;transition:background .2s,transform .2s,box-shadow .2s}
.reader-v2 .reader-overview svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.reader-v2 .reader-overview:hover{background:#a3432e;transform:translateY(-1px);box-shadow:0 12px 28px #ba523b55,0 2px 6px #2a2a2420}
.reader-v2 .reader-overview:focus-visible{outline:2px solid #22241f;outline-offset:3px}
.reader-v2 .reader-overview .ov-close{display:none}
.reader-v2 .reader-overview[aria-expanded=true]{background:#22241f;box-shadow:0 6px 18px #22241f30}
.reader-v2 .reader-overview[aria-expanded=true] .ov-open{display:none}
.reader-v2 .reader-overview[aria-expanded=true] .ov-close{display:inline}
.reader-v2 .reader-overview[aria-expanded=false] .ov-open{display:inline}

@media (max-width:760px){
  .reader-v2 .reader-side{width:40px;height:40px;margin-top:-20px}
  .reader-v2 .reader-side svg{width:18px;height:18px}
  .reader-v2 .reader-side-prev{left:10px}
  .reader-v2 .reader-side-next{right:10px}
  /* 手机：隐藏两侧翻页箭头，改为左右滑动翻页 */
  .reader-v2 .reader-side{display:none}
  .reader-v2 .reader-hints span:not(.desktop-hint):not(.touch-hint){display:none}
  .reader-canvas.is-long .reader-long-nav{right:58px}
  .reader-v2 .reader-overview{top:12px;right:12px;height:38px;padding:0 15px 0 12px;font-size:13px}
  .reader-v2 .reader-overview svg{width:16px;height:16px}
}

/* 滑动翻页松手未翻页时，图片平滑回位 */
.reader-v2 .swipe-back{transition:transform .2s ease-out, opacity .25s}
