:root{--bg:#F8F6F0;--paper:#fffdf8;--ink:#3E3A39;--muted:#7A7571;--green:#6B775C;--green2:#566149;--red:#9B4A46;--line:#E2DDD5;--gold:#B99765;--serif:"Noto Serif SC","Source Han Serif SC","Songti SC",serif;--sans:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;--shadow:0 22px 60px rgba(40,32,24,.08);--container:1350px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.8;overflow-x:hidden;-webkit-font-smoothing:antialiased}.grain{position:fixed;inset:0;pointer-events:none;z-index:10000;opacity:1;background:radial-gradient(circle at 18% 10%,rgba(185,151,101,.055),transparent 24%),radial-gradient(circle at 84% 18%,rgba(107,119,92,.04),transparent 22%),radial-gradient(circle at 54% 86%,rgba(155,74,70,.025),transparent 24%),linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0) 25%,rgba(255,255,255,.08) 100%)}a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover}.container{width:min(calc(100% - 56px),var(--container));margin:auto}.section{padding:130px 0}h1,h2,h3,.serif{font-family:var(--serif);font-weight:500}h1,h2,h3,p{margin-top:0}.nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:rgba(248,246,240,.86);backdrop-filter:blur(16px);transition:.35s;border-bottom:1px solid transparent}.nav.scrolled{height:66px;border-bottom:1px solid rgba(226,221,213,.8);box-shadow:0 8px 24px rgba(0,0,0,.03)}.logo{display:flex;align-items:center;gap:12px}.logo-mark{width:34px;height:34px;border-radius:50%;border:1px solid var(--green);display:grid;place-items:center;color:var(--green)}.logo b{font-family:var(--serif);font-size:24px;letter-spacing:3px}.logo small{display:block;font-size:10px;letter-spacing:4px;color:var(--muted)}.logo i{font-style:normal;border:1px solid var(--red);color:var(--red);font-size:10px;padding:2px 5px;border-radius:2px}.nav-links{display:flex;gap:34px}.nav-links a{font-size:14px;letter-spacing:1px;position:relative}.nav-links a:after{content:"";position:absolute;left:50%;bottom:-8px;width:0;height:1px;background:var(--green);transform:translateX(-50%);transition:.3s}.nav-links a:hover:after{width:100%}.nav-cta{border:1px solid var(--line);border-radius:999px;padding:10px 26px;font-size:13px;transition:.3s}.nav-cta:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}.hero{min-height:100vh;padding:120px 0 60px;display:flex;align-items:center;position:relative}.hero-inner{display:grid;grid-template-columns:.9fr 1.1fr;gap:68px;align-items:center}.kicker{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:4px;color:var(--green);margin-bottom:25px}.kicker:before{content:"";width:32px;height:1px;background:var(--green)}.hero h1{font-size:clamp(44px,5vw,78px);line-height:1.3;letter-spacing:3px;margin-bottom:28px}.hero p{color:var(--muted);font-size:17px;max-width:560px;text-align:justify;margin-bottom:42px}.hero-actions,.contact-actions{display:flex;gap:24px;flex-wrap:wrap}.btn{height:50px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:0 32px;font-size:14px;letter-spacing:1px;transition:.35s}.btn.primary{background:var(--green);color:#fff;border:1px solid var(--green)}.btn.primary:hover{background:var(--green2);transform:translateY(-3px);box-shadow:0 18px 34px rgba(107,119,92,.22)}.btn.ghost{border:1px solid var(--line);background:rgba(255,255,255,.3)}.btn.ghost:hover{border-color:var(--green);color:var(--green);gap:12px}.hero-art{position:relative}.hero-img{height:72vh;border-radius:14px 140px 14px 14px;overflow:hidden;box-shadow:var(--shadow);background:#efece5}.hero-img img{transition:1.2s}.hero-art:hover img{transform:scale(1.035)}.vertical-note{position:absolute;right:-28px;bottom:12%;writing-mode:vertical-rl;background:rgba(248,246,240,.88);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);box-shadow:var(--shadow);padding:34px 20px;border-radius:8px;letter-spacing:6px;font-size:15px}.vertical-note em{font-style:normal;color:var(--red);border:1px solid var(--red);padding:4px 2px;margin-top:12px}.scroll-hint{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);font-size:10px;letter-spacing:4px;color:#aaa}.brand{background:#FDFDFB}.brand-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.frame-offset{position:relative}.frame-offset:before{content:"";position:absolute;inset:-18px 18px 18px -18px;border:1px solid var(--line);z-index:0}.brand-img img{height:620px;border-radius:10px;box-shadow:var(--shadow);position:relative;z-index:1}.section-label{display:block;color:var(--muted);font-size:12px;letter-spacing:4px;text-transform:uppercase;margin-bottom:14px}.brand-text h2,.section-head h2,.heritage h2,.contact h2{font-size:clamp(32px,3.3vw,50px);line-height:1.35;margin-bottom:16px;letter-spacing:2px}.lead{color:var(--green)!important;font-size:15px!important}.thin-line{width:54px;height:1px;background:var(--line);margin:32px 0}.brand-text p{color:var(--muted);text-align:justify}.signature{margin-top:44px;border-top:1px solid var(--line);padding-top:28px;display:flex;align-items:baseline;gap:18px}.signature strong{font-family:var(--serif);font-size:38px;letter-spacing:6px}.signature span{font-size:13px;color:var(--muted)}.signature i{font-style:normal;color:var(--red);border:1px solid var(--red);font-size:12px;padding:2px 5px}.courses{background:#FDFDFB}.section-head{text-align:center;max-width:780px;margin:0 auto 70px}.section-head p{color:var(--muted)}.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}.course-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.025);transition:.4s}.course-card:hover{transform:translateY(-10px);box-shadow:0 28px 58px rgba(0,0,0,.07);border-color:var(--green)}.course-card img{height:245px}.course-card div{padding:34px 30px;text-align:center}.course-card span{display:inline-block;font-size:11px;border:1px solid var(--green);color:var(--green);border-radius:999px;padding:4px 14px;margin-bottom:16px}.course-card h3{font-size:25px}.course-card p{color:var(--muted);font-size:14px;text-align:justify;min-height:76px}.course-card a{font-size:13px;border-bottom:1px solid currentColor}.works{background:#F4EFEA}.works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.work{position:relative;aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:#eee;box-shadow:0 12px 28px rgba(0,0,0,.04);cursor:pointer}.work img{transition:.9s cubic-bezier(.2,.8,.2,1)}.work:hover img{transform:scale(1.08)}.work div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:34px 20px;text-align:center;color:#fff;background:linear-gradient(to top,rgba(30,31,24,.85),transparent 62%);opacity:0;transition:.45s}.work:hover div{opacity:1}.work h3{font-size:28px;letter-spacing:4px;margin-bottom:4px;transform:translateY(18px);transition:.45s}.work p{font-size:13px;color:rgba(255,255,255,.84);transform:translateY(18px);transition:.45s .06s}.work:hover h3,.work:hover p{transform:translateY(0)}.heritage{background:#1f281f;color:#e9dfcc}.heritage-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}.heritage p{color:#d7ccbb;text-align:justify}.heritage-img img{height:470px;border-radius:16px}.archive-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:34px}.archive-list span{border:1px solid rgba(233,223,204,.28);padding:16px 18px;border-radius:12px;color:#ead8aa}.journal{background:var(--bg)}.journal-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:40px}.journal-main,.journal-item{background:#fff;border:1px solid transparent;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.025);transition:.4s}.journal-main:hover,.journal-item:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(0,0,0,.07);border-color:var(--line)}.journal-main img{height:350px}.journal-main div{padding:38px}.journal-main span,.journal-item span{color:var(--green);font-size:12px;letter-spacing:2px}.journal-main h3{font-size:30px;line-height:1.45}.journal-main p,.journal-item p{color:var(--muted);font-size:14px;text-align:justify}.journal-side{display:grid;gap:22px}.journal-item{display:grid;grid-template-columns:180px 1fr;align-items:center}.journal-item img{height:180px}.journal-item div{padding:24px}.journal-item h3{font-size:22px;line-height:1.45}.contact{background:#FDFDFB}.contact-card{position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);background:#fff}.contact-card>img{height:420px;opacity:.9}.contact-content{position:absolute;left:8%;top:50%;transform:translateY(-50%);width:min(520px,84%);background:rgba(253,253,251,.86);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.8);border-radius:18px;padding:42px}.contact-content p{color:var(--muted)}footer{background:var(--ink);color:#F8F6F0;text-align:center;padding:86px 0 42px}.footer-logo{font-family:var(--serif);font-size:32px;letter-spacing:6px;margin-bottom:14px}footer p{color:#aaa}footer small{display:block;color:#777;margin-top:30px}.reveal{opacity:0;transform:translateY(42px);transition:1s cubic-bezier(.2,.8,.2,1)}.reveal.active{opacity:1;transform:translateY(0)}.delay-1{transition-delay:.15s}.delay-2{transition-delay:.3s}.delay-3{transition-delay:.45s}@media(max-width:1020px){.nav-links,.nav-cta{display:none}.hero-inner,.brand-grid,.heritage-grid,.journal-layout{grid-template-columns:1fr}.hero{padding-top:100px}.hero-copy{text-align:center}.kicker{justify-content:center}.kicker:before{display:none}.hero p{max-width:100%;text-align:center}.hero-actions{justify-content:center}.hero-img{height:52vh}.vertical-note{right:12px}.course-grid,.works-grid{grid-template-columns:1fr}.brand-img img{height:auto}.journal-item{grid-template-columns:1fr}.journal-item img{height:220px}}@media(max-width:640px){.container{width:min(calc(100% - 28px),var(--container))}.section{padding:82px 0}.logo b{font-size:20px}.hero h1{font-size:42px}.hero-actions,.contact-actions{display:grid}.btn{width:100%}.contact-content{position:static;transform:none;width:auto;margin:0;border-radius:0}.contact-card>img{height:260px}.archive-list{grid-template-columns:1fr}}


/* ================================
   手机端精修版：H5/微信内打开体验
   目标：保持电脑端高级感，手机端改成更适合竖屏阅读和转化的节奏。
================================ */
.mobile-cta-bar{display:none}
@media (max-width: 760px){
  body{padding-bottom:72px;background:#F8F6F0;}
  .grain{opacity:.12;background-size:8px 8px;}
  .container{width:min(calc(100% - 26px),var(--container));}
  .section{padding:68px 0;}

  /* 顶部：保留品牌和预约，不挤导航 */
  .nav{height:64px;padding:0 14px;background:rgba(248,246,240,.94);}
  .nav.scrolled{height:58px;}
  .logo{gap:8px;min-width:0;}
  .logo-mark{width:30px;height:30px;font-size:14px;flex:0 0 auto;}
  .logo b{font-size:20px;letter-spacing:2px;white-space:nowrap;}
  .logo small{display:none;}
  .logo i{font-size:9px;padding:1px 4px;}
  .nav-links{display:none!important;}
  .nav-cta{display:inline-flex!important;padding:8px 14px;border-color:rgba(107,119,92,.35);font-size:12px;background:rgba(255,255,255,.56);white-space:nowrap;}

  /* 首屏：手机端改成“标题—主图—题跋—按钮”的节奏 */
  .hero{min-height:auto;padding:92px 0 36px;display:block;}
  .hero-inner{display:flex;flex-direction:column;gap:24px;}
  .hero-copy{text-align:left;}
  .kicker{justify-content:flex-start;font-size:11px;letter-spacing:2.5px;margin-bottom:16px;}
  .kicker:before{display:block;width:24px;}
  .hero h1{font-size:38px;line-height:1.26;letter-spacing:1.5px;margin-bottom:18px;}
  .hero p{font-size:15.5px;line-height:1.9;text-align:left;margin-bottom:24px;color:#6f6862;}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  .btn{height:46px;width:auto;padding:0 16px;font-size:13px;}
  .hero-art{width:100%;}
  .hero-img{height:auto;aspect-ratio:4/5;border-radius:14px 76px 14px 14px;box-shadow:0 18px 42px rgba(40,32,24,.09);}
  .hero-art:hover img{transform:none;}
  .vertical-note{position:static;writing-mode:horizontal-tb;display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding:12px 14px;letter-spacing:2px;font-size:13px;border-radius:14px;background:rgba(255,253,248,.72);box-shadow:0 10px 28px rgba(40,32,24,.05);}
  .vertical-note em{margin:0;padding:2px 6px;}
  .scroll-hint{display:none;}

  /* 章节标题：更像公众号高级图文 */
  .section-head{text-align:left;margin:0 0 26px;max-width:none;}
  .section-head h2,.brand-text h2,.heritage h2,.contact h2{font-size:30px;line-height:1.34;letter-spacing:1px;}
  .section-head p{font-size:15px;line-height:1.8;}
  .section-label{font-size:11px;letter-spacing:3px;margin-bottom:10px;}

  /* 品牌区：先读故事，再看手作图 */
  .brand-grid{display:flex;flex-direction:column;gap:30px;}
  .brand-text{order:1;}
  .brand-img{order:2;}
  .frame-offset:before{inset:-10px 10px 10px -10px;}
  .brand-img img{height:auto;aspect-ratio:4/5;border-radius:12px;}
  .brand-text p{font-size:15px;line-height:1.95;}
  .lead{font-size:14px!important;line-height:1.7!important;}
  .thin-line{margin:22px 0;}
  .signature{margin-top:30px;padding-top:22px;gap:12px;flex-wrap:wrap;}
  .signature strong{font-size:32px;letter-spacing:4px;}

  /* 课程：手机端三张清晰大卡片 */
  .course-grid{display:grid;grid-template-columns:1fr;gap:18px;}
  .course-card{border-radius:18px;}
  .course-card:hover{transform:none;}
  .course-card img{height:auto;aspect-ratio:16/10;}
  .course-card div{padding:24px 22px;text-align:left;}
  .course-card span{font-size:11px;margin-bottom:12px;}
  .course-card h3{font-size:24px;margin-bottom:8px;}
  .course-card p{min-height:0;font-size:14.5px;line-height:1.85;text-align:left;margin-bottom:16px;}

  /* 作品：改成横向滑动展柜，比单列堆叠更有浏览感 */
  .works-grid{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 6px 18px;margin:0 -6px;-webkit-overflow-scrolling:touch;}
  .works-grid::-webkit-scrollbar{height:4px;}
  .works-grid::-webkit-scrollbar-thumb{background:rgba(107,119,92,.32);border-radius:999px;}
  .work{flex:0 0 76%;aspect-ratio:4/5;scroll-snap-align:start;border-radius:18px;}
  .work div{opacity:1;background:linear-gradient(to top,rgba(30,31,24,.78),rgba(30,31,24,.08) 62%,transparent);padding:28px 18px;}
  .work h3,.work p{transform:none;}
  .work h3{font-size:26px;letter-spacing:3px;}
  .work p{font-size:12.5px;margin-bottom:0;}

  /* 非遗档案：信息收拢，避免手机端过长 */
  .heritage{padding:72px 0;background:#20281f;}
  .heritage-grid{display:flex;flex-direction:column;gap:26px;}
  .heritage p{font-size:15px;line-height:1.9;text-align:left;}
  .archive-list{grid-template-columns:1fr 1fr;gap:10px;margin-top:24px;}
  .archive-list span{padding:13px 10px;text-align:center;font-size:13px;border-radius:12px;}
  .heritage-img img{height:auto;aspect-ratio:4/3;border-radius:16px;}

  /* 文章：保留主次，但手机端更像信息流 */
  .journal-layout{display:flex;flex-direction:column;gap:18px;}
  .journal-main img{height:auto;aspect-ratio:16/10;}
  .journal-main div{padding:24px 22px;}
  .journal-main h3{font-size:24px;line-height:1.42;}
  .journal-main p,.journal-item p{font-size:14.5px;text-align:left;}
  .journal-side{gap:16px;}
  .journal-item{display:grid;grid-template-columns:112px 1fr;align-items:stretch;border-radius:16px;}
  .journal-item img{height:100%;min-height:128px;}
  .journal-item div{padding:16px 16px;}
  .journal-item h3{font-size:17px;line-height:1.45;margin-bottom:6px;}
  .journal-item p{display:none;}

  /* 联系区：预约卡更像落款，按钮更强 */
  .contact-card{border-radius:20px;}
  .contact-card>img{height:auto;aspect-ratio:16/10;}
  .contact-content{position:static;transform:none;width:auto;margin:0;border-radius:0;padding:26px 22px;background:rgba(253,253,251,.98);}
  .contact-content p{font-size:15px;line-height:1.85;}
  .contact-actions{display:grid;grid-template-columns:1fr;gap:10px;}

  footer{padding:64px 0 92px;}
  .footer-logo{font-size:28px;}

  /* 手机端底部固定预约栏 */
  .mobile-cta-bar{position:fixed;left:10px;right:10px;bottom:10px;z-index:1200;display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:8px;padding:8px;background:rgba(248,246,240,.9);backdrop-filter:blur(14px);border:1px solid rgba(226,221,213,.9);border-radius:20px;box-shadow:0 16px 38px rgba(40,32,24,.13);}
  .mobile-cta-bar a{height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:13px;border:1px solid var(--line);background:rgba(255,255,255,.62);}
  .mobile-cta-bar a.primary{background:var(--green);border-color:var(--green);color:#fff;}
}

@media (max-width: 380px){
  .hero h1{font-size:34px;}
  .logo b{font-size:18px;}
  .nav-cta{padding:7px 10px;}
  .work{flex-basis:82%;}
  .journal-item{grid-template-columns:96px 1fr;}
}


/* 学员作品与学员中心 */
.student-works{background:#FDFDFB;position:relative;overflow:hidden}
.student-works:before{content:"";position:absolute;left:4%;top:80px;width:160px;height:160px;border:1px solid rgba(185,151,101,.18);border-radius:50%;pointer-events:none}
.student-showcase{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.student-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.025);transition:.4s}
.student-card:hover{transform:translateY(-8px);box-shadow:0 24px 48px rgba(0,0,0,.065);border-color:var(--green)}
.student-card img{height:260px;background:#f3efe7}
.student-card div{padding:20px 22px}.student-card b{font-family:var(--serif);font-size:20px;display:block;margin-bottom:6px;letter-spacing:1px}.student-card span{display:block;color:var(--muted);font-size:13px}
.student-note{margin-top:28px;border:1px solid var(--line);border-radius:18px;padding:24px 28px;background:rgba(248,246,240,.74);display:flex;align-items:center;justify-content:space-between;gap:24px}.student-note strong{font-family:var(--serif);font-size:24px}.student-note p{margin:6px 0 0;color:var(--muted)}
.auth-page{min-height:100vh;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:120px 24px 60px;position:relative}.auth-card{width:min(1060px,100%);display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:var(--shadow)}.auth-visual{background:#F4EFEA;padding:52px;display:flex;flex-direction:column;justify-content:space-between;min-height:620px}.auth-visual h1{font-size:46px;line-height:1.28;margin-bottom:18px}.auth-visual p{color:var(--muted)}.auth-seal{align-self:flex-start;color:var(--red);border:1px solid var(--red);padding:8px 10px;border-radius:4px;letter-spacing:4px;writing-mode:vertical-rl}.auth-form{padding:56px}.auth-form h2{font-size:34px;margin-bottom:10px}.auth-form .form-sub{color:var(--muted);margin-bottom:32px}.form-row{margin-bottom:18px}.form-row label{display:block;font-size:13px;color:var(--muted);margin-bottom:8px}.form-row input,.form-row select{width:100%;height:48px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 14px;font-family:var(--sans);font-size:15px}.form-row input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(107,119,92,.08)}.auth-btn{width:100%;height:50px;border:0;border-radius:999px;background:var(--green);color:#fff;font-size:15px;letter-spacing:1px;cursor:pointer;margin-top:10px}.auth-btn:hover{background:var(--green2)}.auth-switch{margin-top:22px;text-align:center;color:var(--muted);font-size:14px}.auth-switch a{color:var(--green);border-bottom:1px solid currentColor}.study-hero{padding:130px 0 60px;background:#FDFDFB}.study-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}.study-panel{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:34px}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:30px}.resource-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:0 10px 30px rgba(0,0,0,.025)}.resource-card h3{font-size:22px}.resource-card p{font-size:14px;color:var(--muted);min-height:78px}.resource-card a{font-size:13px;color:var(--green);border-bottom:1px solid currentColor}
@media(max-width:1020px){.student-showcase{display:flex;overflow-x:auto;gap:16px;scroll-snap-type:x mandatory;padding-bottom:12px}.student-card{min-width:76%;scroll-snap-align:start}.student-note{display:block}.student-note .btn{margin-top:16px}.auth-card,.study-grid{grid-template-columns:1fr}.auth-visual{min-height:auto}.resource-grid{grid-template-columns:1fr}}
@media(max-width:640px){.student-card{min-width:86%}.auth-page{padding:96px 14px 40px}.auth-visual,.auth-form{padding:30px 22px}.auth-visual h1{font-size:34px}.auth-card{border-radius:20px}.resource-card p{min-height:0}}

/* --- fix: brand story image should not crop the vertical text inside the image --- */
.brand-img{
  position:relative;
  z-index:1;
  min-height:620px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:linear-gradient(180deg,#f7f2ea 0%,#fbf8f2 100%);
  border-radius:10px;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.brand-img img{
  width:auto;
  max-width:100%;
  height:auto;
  max-height:576px;
  object-fit:contain;
  object-position:center top;
  border-radius:6px;
  box-shadow:none;
}

@media(max-width:1020px){
  .brand-img{min-height:auto;padding:14px}
  .brand-img img{width:100%;max-height:none}
}

/* --- fix v2: brand image full width, no inner blank, no text crop --- */
.brand-img{
  min-height:auto !important;
  padding:0 !important;
  background:transparent !important;
  border-radius:10px !important;
  overflow:hidden !important;
}
.brand-img img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:10px !important;
  box-shadow:var(--shadow) !important;
}


/* 师承联盟・城市分站 */
.city-alliance{background:linear-gradient(180deg,#FDFDFB 0%,#F4EFEA 100%);position:relative;overflow:hidden}
.city-alliance:before{content:"师承";position:absolute;right:4%;top:70px;font-family:var(--serif);font-size:150px;line-height:1;color:rgba(107,119,92,.045);letter-spacing:12px;pointer-events:none}
.alliance-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:stretch;margin-bottom:28px}
.alliance-title-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:42px 44px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.alliance-title-card:after{content:"";position:absolute;right:-50px;bottom:-50px;width:180px;height:180px;border:1px solid rgba(155,74,70,.18);border-radius:50%}
.alliance-title-card span{display:inline-flex;color:var(--red);border:1px solid rgba(155,74,70,.38);border-radius:999px;padding:4px 14px;font-size:12px;letter-spacing:3px;margin-bottom:18px}
.alliance-title-card h3{font-size:34px;line-height:1.35;margin-bottom:18px;letter-spacing:1px}
.alliance-title-card p{color:var(--muted);text-align:justify;margin:0}
.alliance-metrics{display:grid;grid-template-columns:1fr;gap:14px}
.alliance-metrics div{background:#1f281f;color:#e9dfcc;border-radius:18px;padding:30px;border:1px solid rgba(233,223,204,.16);box-shadow:0 16px 34px rgba(31,40,31,.12)}
.alliance-metrics b{font-family:var(--serif);font-size:28px;display:block;letter-spacing:2px;margin-bottom:6px}
.alliance-metrics em{font-style:normal;color:#d7ccbb;font-size:14px}
.station-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}
.station-card{background:rgba(255,255,255,.82);border:1px solid var(--line);border-radius:18px;padding:28px 26px;box-shadow:0 10px 30px rgba(0,0,0,.025);transition:.4s}
.station-card:hover{transform:translateY(-8px);box-shadow:0 26px 52px rgba(0,0,0,.07);border-color:var(--green)}
.station-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:16px}
.station-top strong{font-family:var(--serif);font-size:28px;letter-spacing:2px}
.station-badge{font-size:12px;color:var(--green);border:1px solid rgba(107,119,92,.35);border-radius:999px;padding:4px 10px;background:rgba(255,255,255,.6);white-space:nowrap}
.station-card p{color:var(--muted);font-size:14.5px;text-align:justify;min-height:78px}
.station-card ul{list-style:none;margin:20px 0 22px;padding:0;display:grid;gap:8px;color:#6f6862;font-size:13.5px}
.station-card li:before{content:"•";color:var(--red);margin-right:8px}
.station-card a{color:var(--green);font-size:13px;border-bottom:1px solid currentColor}
.alliance-process{margin-top:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.alliance-process div{background:rgba(248,246,240,.72);border:1px solid var(--line);border-radius:16px;padding:22px 20px}
.alliance-process span{font-family:var(--serif);font-size:26px;color:rgba(155,74,70,.48);display:block;margin-bottom:8px}
.alliance-process b{font-family:var(--serif);font-size:21px;letter-spacing:1px}
.alliance-process p{font-size:13.5px;color:var(--muted);margin:8px 0 0;text-align:justify;line-height:1.75}

.alliance-page{padding:128px 0 90px;background:var(--bg)}
.alliance-page .page-title{max-width:900px;margin:0 auto 46px;text-align:center}
.alliance-page .page-title h1{font-size:clamp(38px,5vw,64px);line-height:1.25;margin-bottom:18px}
.alliance-page .page-title p{color:var(--muted)}
.alliance-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.alliance-detail-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px;box-shadow:var(--shadow)}
.alliance-detail-card h2{font-size:30px;margin-bottom:14px}.alliance-detail-card p,.alliance-detail-card li{color:var(--muted)}
.alliance-detail-card ul{padding-left:1.2em;margin:0;display:grid;gap:8px}

@media(max-width:1020px){
  .alliance-hero,.station-grid,.alliance-process,.alliance-detail-grid{grid-template-columns:1fr}
  .alliance-title-card{padding:30px 24px}.alliance-title-card h3{font-size:28px}
  .station-card p{min-height:0}.city-alliance:before{font-size:90px;right:-10px;top:40px}
}
@media(max-width:760px){
  .city-alliance{padding:72px 0}.city-alliance:before{display:none}
  .alliance-title-card{border-radius:18px;padding:26px 22px}
  .alliance-title-card h3{font-size:25px}.alliance-title-card p{text-align:left;font-size:14.5px}
  .alliance-metrics div{padding:22px}.alliance-metrics b{font-size:24px}
  .station-grid{gap:16px}.station-card{padding:24px 20px}.station-top strong{font-size:24px}.station-card p{font-size:14.5px;text-align:left}
  .alliance-process{gap:12px}.alliance-process p{text-align:left}
  .mobile-cta-bar{grid-template-columns:1fr 1fr 1fr 1.1fr}
  .mobile-cta-bar a{font-size:12px}
}


/* Works category page */
.section-more{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top:18px;
  color:var(--green);
  border-bottom:1px solid currentColor;
  font-size:14px;
  letter-spacing:1px;
}
.works-hero{
  min-height:88vh;
  padding:128px 0 70px;
  display:flex;
  align-items:center;
  background:linear-gradient(180deg,#FDFDFB 0%,#F8F6F0 100%);
}
.works-hero-inner{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:70px;
  align-items:center;
}
.works-hero-copy h1{
  font-size:clamp(44px,5vw,76px);
  line-height:1.25;
  letter-spacing:4px;
  margin-bottom:26px;
}
.works-hero-copy p{
  max-width:620px;
  color:var(--muted);
  text-align:justify;
  margin-bottom:38px;
}
.works-hero-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:end;
}
.works-hero-gallery img{
  height:360px;
  border-radius:18px;
  box-shadow:var(--shadow);
  object-fit:cover;
}
.works-hero-gallery img:first-child{
  grid-row:span 2;
  height:620px;
  border-radius:18px 120px 18px 18px;
}
.works-hero-gallery img:nth-child(2){height:292px}
.works-hero-gallery img:nth-child(3){height:292px}
.category-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
}
.category-card{
  display:block;
  min-height:260px;
  padding:30px 24px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 12px 30px rgba(0,0,0,.025);
  transition:.4s;
}
.category-card:hover{
  transform:translateY(-8px);
  border-color:var(--green);
  box-shadow:0 28px 54px rgba(0,0,0,.07);
}
.category-card span{
  color:var(--gold);
  font-family:var(--serif);
  font-size:32px;
}
.category-card h3{
  font-size:25px;
  margin:16px 0 8px;
}
.category-card p{
  color:var(--muted);
  font-size:14px;
  min-height:58px;
}
.category-card em{
  display:block;
  margin-top:22px;
  color:var(--green);
  font-style:normal;
  font-size:13px;
  letter-spacing:2px;
}
.work-category-block.soft{background:#FDFDFB}
.category-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:70px;
  align-items:center;
}
.category-layout.reverse{grid-template-columns:1.1fr .9fr}
.category-copy h2{
  font-size:clamp(34px,3.8vw,56px);
  line-height:1.3;
  letter-spacing:3px;
}
.category-copy p{
  color:var(--muted);
  text-align:justify;
}
.tag-cloud{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}
.tag-cloud span{
  display:inline-flex;
  align-items:center;
  height:38px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.52);
  color:#655e58;
  font-size:13px;
}
.category-feature{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:#fff;
}
.category-feature img{
  height:520px;
  object-fit:cover;
}
.category-feature div{
  position:absolute;
  left:30px;
  right:30px;
  bottom:30px;
  padding:24px;
  background:rgba(253,253,251,.86);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.72);
  border-radius:16px;
}
.category-feature h3{
  font-size:26px;
  margin-bottom:6px;
}
.category-feature p{
  color:var(--muted);
  margin-bottom:0;
  font-size:14px;
}
.craft-levels{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.craft-levels article{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.025);
  transition:.35s;
}
.craft-levels article:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.craft-levels img{
  height:280px;
  border-radius:14px;
  object-fit:cover;
}
.craft-levels b{
  display:block;
  font-family:var(--serif);
  font-size:24px;
  margin:18px 4px 4px;
}
.craft-levels span{
  display:block;
  color:var(--muted);
  font-size:13px;
  margin:0 4px 10px;
}
.tea-block{
  background:#20281f;
  color:#F8F6F0;
}
.tea-block .section-head p{color:#d7ccbb}
.tea-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.tea-card{
  min-height:250px;
  padding:32px 26px;
  border-radius:18px;
  border:1px solid rgba(233,223,204,.22);
  background:rgba(255,255,255,.045);
}
.tea-card h3{
  font-size:25px;
  margin-bottom:14px;
  color:#F8F6F0;
}
.tea-card p{
  color:#d7ccbb;
  font-size:14px;
}
.tea-card span{
  display:block;
  margin-top:28px;
  color:#ead8aa;
  font-size:13px;
}
.restore-block{background:#F4EFEA}
.restore-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  padding:44px;
  box-shadow:var(--shadow);
}
.restore-card span{
  color:var(--gold);
  letter-spacing:3px;
  font-size:12px;
}
.restore-card h3{
  font-size:34px;
  margin:12px 0 18px;
}
.restore-card p{
  color:var(--muted);
  text-align:justify;
}
.restore-card ul{
  margin:28px 0 0;
  padding-left:20px;
  color:#665f58;
  line-height:2;
}
.works-all{background:#FDFDFB}
@media(max-width:1180px){
  .category-grid{grid-template-columns:repeat(2,1fr)}
  .tea-grid{grid-template-columns:repeat(2,1fr)}
  .category-layout,.category-layout.reverse,.works-hero-inner{grid-template-columns:1fr}
  .works-hero-gallery img:first-child{height:520px}
}
@media(max-width:640px){
  .works-hero{padding:106px 0 54px;min-height:auto}
  .works-hero-copy h1{font-size:40px}
  .works-hero-copy p{text-align:left}
  .works-hero-gallery{grid-template-columns:1fr;gap:14px}
  .works-hero-gallery img,.works-hero-gallery img:first-child,.works-hero-gallery img:nth-child(2),.works-hero-gallery img:nth-child(3){
    height:auto;
    aspect-ratio:4/5;
    border-radius:16px;
  }
  .category-grid,.tea-grid,.craft-levels{grid-template-columns:1fr}
  .category-card{min-height:auto}
  .category-layout{gap:34px}
  .category-feature img{height:auto;aspect-ratio:4/5}
  .category-feature div{position:static;border-radius:0;background:#fff}
  .restore-card{padding:30px 22px}
}


/* --- Third-level works archive pages --- */
.archive-hero{
  min-height:78vh;
  padding:126px 0 72px;
  display:flex;
  align-items:center;
  background:linear-gradient(120deg,rgba(253,253,251,.96),rgba(244,239,234,.78));
  border-bottom:1px solid var(--line);
}
.archive-hero-inner{display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center}
.archive-hero h1{font-size:clamp(42px,5vw,76px);line-height:1.18;letter-spacing:4px;margin-bottom:22px}
.archive-hero p{color:var(--muted);font-size:16px;text-align:justify;max-width:650px}
.archive-hero-art{display:grid;grid-template-columns:1fr .72fr;gap:18px;align-items:end}
.archive-hero-art img{border-radius:14px;box-shadow:var(--shadow);background:#eee;object-fit:cover}
.archive-hero-art img:first-child{height:560px;border-radius:14px 118px 14px 14px}
.archive-hero-art img:nth-child(2){height:360px}
.archive-stat{display:flex;gap:26px;flex-wrap:wrap;margin-top:34px;color:var(--muted)}
.archive-stat span{border-top:1px solid var(--line);padding-top:12px;font-size:13px;letter-spacing:1px}
.archive-tabs{position:sticky;top:66px;z-index:50;background:rgba(248,246,240,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.archive-tabs .container{display:flex;gap:10px;flex-wrap:wrap;padding:16px 0}
.archive-tabs a{font-size:13px;border:1px solid var(--line);border-radius:999px;padding:8px 16px;color:var(--muted);background:rgba(255,255,255,.52);transition:.25s}
.archive-tabs a:hover,.archive-tabs a.active{background:var(--green);color:#fff;border-color:var(--green)}
.subsection-head{display:grid;grid-template-columns:.68fr 1.32fr;gap:40px;align-items:end;margin-bottom:36px}
.subsection-head h2{font-size:clamp(30px,3.2vw,48px);line-height:1.3;letter-spacing:2px;margin-bottom:0}
.subsection-head p{color:var(--muted);text-align:justify;margin-bottom:0}
.filter-chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
.filter-chips span{font-size:13px;color:var(--green);border:1px solid rgba(107,119,92,.28);background:rgba(255,255,255,.55);border-radius:999px;padding:8px 15px}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.archive-work-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 12px 32px rgba(40,32,24,.035);transition:.35s}
.archive-work-card:hover{transform:translateY(-8px);box-shadow:0 28px 58px rgba(40,32,24,.09);border-color:rgba(107,119,92,.45)}
.archive-work-card .pic{height:360px;background:#f2eee8;overflow:hidden}
.archive-work-card .pic img{transition:.9s cubic-bezier(.2,.8,.2,1)}
.archive-work-card:hover .pic img{transform:scale(1.055)}
.archive-work-card .info{padding:26px 26px 24px}
.archive-work-card .meta{display:flex;justify-content:space-between;gap:10px;color:var(--green);font-size:12px;letter-spacing:1px;margin-bottom:12px}
.archive-work-card h3{font-size:28px;letter-spacing:3px;margin-bottom:10px}
.archive-work-card p{color:var(--muted);font-size:14px;text-align:justify;min-height:52px}
.archive-work-card dl{display:grid;grid-template-columns:56px 1fr;gap:6px 12px;margin:18px 0 0;font-size:13px;color:var(--muted)}
.archive-work-card dt{color:#9a8977}.archive-work-card dd{margin:0;color:var(--ink)}
.archive-note-panel{margin-top:60px;background:#1f281f;color:#e9dfcc;border-radius:22px;padding:48px;display:grid;grid-template-columns:.9fr 1.1fr;gap:36px;align-items:center;box-shadow:var(--shadow)}
.archive-note-panel h3{font-size:34px;letter-spacing:3px}.archive-note-panel p{color:#d7ccbb;text-align:justify}.archive-note-panel ul{margin:0;padding-left:20px;color:#ead8aa;font-size:14px}.archive-note-panel li{margin:6px 0}
.back-band{background:#FDFDFB;border-top:1px solid var(--line);text-align:center;padding:86px 0}
.back-band h2{font-size:40px;letter-spacing:3px;margin-bottom:14px}.back-band p{color:var(--muted);margin-bottom:30px}
@media(max-width:1020px){
  .archive-hero-inner,.subsection-head,.archive-note-panel{grid-template-columns:1fr}
  .archive-hero-copy{text-align:center}.archive-hero p{text-align:center;max-width:100%}.archive-stat{justify-content:center}
  .archive-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .archive-hero{min-height:auto;padding:104px 0 48px}.archive-hero h1{font-size:40px}.archive-hero-copy{text-align:left}.archive-hero p{text-align:left}
  .archive-hero-art{grid-template-columns:1fr}.archive-hero-art img:first-child,.archive-hero-art img:nth-child(2){height:auto;aspect-ratio:4/5;border-radius:14px}
  .archive-tabs{top:0}.archive-tabs .container{overflow-x:auto;flex-wrap:nowrap;padding:12px 0}.archive-tabs a{white-space:nowrap}
  .archive-grid{grid-template-columns:1fr}.archive-work-card .pic{height:auto;aspect-ratio:4/5}.archive-note-panel{padding:30px 22px}
}

/* =========================================================
   全站子页面手机端适配补丁：works/alliance/login/study 等
   目标：不影响电脑端，只修手机端阅读、卡片、标签、网格与按钮。
========================================================= */
@media (max-width: 900px){
  html, body{width:100%;max-width:100%;overflow-x:hidden;}
  body{padding-bottom:72px;}
  .container{width:min(calc(100% - 28px), var(--container));}
  .section{padding:72px 0;}
  .nav{height:68px;padding:0 16px;}
  .nav.scrolled{height:62px;}
  .logo{gap:9px;min-width:0;}
  .logo-mark{width:30px;height:30px;font-size:14px;flex:0 0 auto;}
  .logo b{font-size:19px;letter-spacing:2px;white-space:nowrap;}
  .logo small{display:none;}
  .logo i{font-size:9px;padding:1px 4px;}
  .nav-links,.nav-cta{display:none!important;}

  /* 子页面头图/标题 */
  .page-hero,
  .archive-hero,
  .works-hero,
  .alliance-hero,
  .sub-hero{
    min-height:auto!important;
    padding:104px 0 54px!important;
    text-align:left!important;
  }
  .page-hero .container,
  .archive-hero .container,
  .works-hero .container,
  .alliance-hero .container,
  .sub-hero .container{
    display:block!important;
  }
  .page-hero h1,
  .archive-hero h1,
  .works-hero h1,
  .alliance-hero h1,
  .sub-hero h1{
    font-size:38px!important;
    line-height:1.25!important;
    letter-spacing:1px!important;
    margin-bottom:18px!important;
  }
  .page-hero p,
  .archive-hero p,
  .works-hero p,
  .alliance-hero p,
  .sub-hero p{
    font-size:15px!important;
    line-height:1.9!important;
    text-align:left!important;
    max-width:100%!important;
  }

  /* 分类卡片/总览页卡片 */
  .category-grid,
  .works-category-grid,
  .system-grid,
  .alliance-grid,
  .city-grid,
  .station-grid,
  .teacher-grid,
  .feature-grid,
  .policy-grid,
  .archive-nav-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .category-card,
  .works-category-card,
  .system-card,
  .alliance-card,
  .city-card,
  .station-card,
  .teacher-card,
  .feature-card,
  .policy-card,
  .archive-nav-card{
    border-radius:18px!important;
    padding:22px!important;
  }

  /* 作品库网格 */
  .archive-grid,
  .works-archive-grid,
  .work-archive-grid,
  .portfolio-grid,
  .gallery-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .archive-work-card,
  .works-archive-card,
  .portfolio-card{
    border-radius:18px!important;
    overflow:hidden!important;
  }
  .archive-work-card .pic,
  .works-archive-card .pic,
  .portfolio-card .pic,
  .archive-work-card > .pic,
  .works-archive-card > .pic{
    width:100%!important;
    height:auto!important;
    aspect-ratio:4/5!important;
    overflow:hidden!important;
  }
  .archive-work-card img,
  .works-archive-card img,
  .portfolio-card img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }
  .archive-work-card .info,
  .works-archive-card .info,
  .portfolio-card .info{
    padding:18px!important;
  }
  .archive-work-card h3,
  .works-archive-card h3,
  .portfolio-card h3{
    font-size:24px!important;
    line-height:1.35!important;
    margin-bottom:8px!important;
  }
  .archive-work-card p,
  .works-archive-card p,
  .portfolio-card p{
    font-size:14px!important;
    line-height:1.8!important;
    text-align:left!important;
  }
  .archive-work-card dl,
  .works-archive-card dl,
  .portfolio-card dl{
    display:grid!important;
    grid-template-columns:auto 1fr!important;
    gap:6px 12px!important;
    margin-top:14px!important;
    font-size:13px!important;
  }

  /* 标签筛选区：手机端横滑，不挤压换成密密麻麻 */
  .filter-chips,
  .tag-row,
  .chips,
  .category-tags,
  .archive-tags{
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:10px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding:2px 2px 12px!important;
    margin-left:-2px!important;
    scrollbar-width:none;
  }
  .filter-chips::-webkit-scrollbar,
  .tag-row::-webkit-scrollbar,
  .chips::-webkit-scrollbar,
  .category-tags::-webkit-scrollbar,
  .archive-tags::-webkit-scrollbar{display:none;}
  .filter-chips span,
  .tag-row span,
  .chips span,
  .category-tags span,
  .archive-tags span,
  .filter-chips a,
  .tag-row a,
  .chips a,
  .category-tags a,
  .archive-tags a{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    font-size:13px!important;
    padding:8px 14px!important;
    border-radius:999px!important;
  }

  /* 分区标题 */
  .section-head,
  .subsection-head{
    text-align:left!important;
    margin-bottom:30px!important;
  }
  .section-head h2,
  .subsection-head h2{
    font-size:30px!important;
    line-height:1.35!important;
    letter-spacing:1px!important;
  }
  .section-head p,
  .subsection-head p{
    font-size:15px!important;
    line-height:1.9!important;
    text-align:left!important;
  }
  .section-label{font-size:11px!important;letter-spacing:3px!important;}

  /* 说明面板/返回带 */
  .archive-note-panel,
  .note-panel,
  .back-band .container,
  .info-panel,
  .study-panel{
    display:block!important;
    padding:24px!important;
    border-radius:18px!important;
  }
  .archive-note-panel h3,
  .note-panel h3,
  .back-band h2,
  .info-panel h3{
    font-size:25px!important;
    line-height:1.35!important;
  }
  .archive-note-panel ul,
  .note-panel ul{padding-left:18px!important;margin-top:16px!important;}
  .back-band{text-align:left!important;padding:58px 0!important;}
  .back-band p{font-size:15px!important;text-align:left!important;}
  .back-band .btn{width:100%;margin-top:14px;}

  /* 表单页：登录/注册/学员中心 */
  .auth-page,
  .auth-wrap,
  .login-wrap,
  .register-wrap,
  .study-wrap{
    min-height:auto!important;
    padding:96px 16px 40px!important;
  }
  .auth-card,
  .login-card,
  .register-card,
  .study-card,
  form{
    width:100%!important;
    max-width:100%!important;
    border-radius:20px!important;
  }
  .auth-card,
  .login-card,
  .register-card{padding:26px 20px!important;}
  input,select,textarea{font-size:16px!important;max-width:100%!important;}

  /* 手机底部 CTA */
  .mobile-cta-bar{
    position:fixed;
    left:10px;
    right:10px;
    bottom:10px;
    z-index:9999;
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr;
    gap:8px;
    padding:8px;
    background:rgba(248,246,240,.93);
    backdrop-filter:blur(14px);
    border:1px solid rgba(226,221,213,.9);
    border-radius:999px;
    box-shadow:0 14px 38px rgba(40,32,24,.12);
  }
  .mobile-cta-bar a{
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    font-size:13px;
    color:var(--ink);
  }
  .mobile-cta-bar a.primary{background:var(--green);color:#fff;}
}

@media (min-width: 901px){
  .mobile-cta-bar{display:none!important;}
}

@media (max-width: 520px){
  .page-hero h1,
  .archive-hero h1,
  .works-hero h1,
  .alliance-hero h1,
  .sub-hero h1{font-size:34px!important;}
  .archive-grid,
  .works-archive-grid,
  .portfolio-grid{gap:16px!important;}
  .archive-work-card .info,
  .works-archive-card .info,
  .portfolio-card .info{padding:16px!important;}
  .category-card,
  .works-category-card,
  .alliance-card,
  .city-card{padding:20px!important;}
}


/* --- mobile navigation unification: bottom nav only --- */
@media (max-width: 900px){
  body{padding-bottom:82px!important;}
  .nav{display:none!important;}
  .hero{padding-top:32px!important;}
  .works-hero,.archive-hero,.alliance-hero,.page-hero,.sub-hero{padding-top:42px!important;}
  .mobile-cta-bar{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    z-index:9999!important;
    display:grid!important;
    grid-template-columns:repeat(6,1fr)!important;
    gap:4px!important;
    padding:7px!important;
    background:rgba(248,246,240,.94)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
    border:1px solid rgba(226,221,213,.96)!important;
    border-radius:24px!important;
    box-shadow:0 14px 36px rgba(40,32,24,.14)!important;
  }
  .mobile-cta-bar a{
    min-width:0!important;
    height:42px!important;
    padding:0 2px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:nowrap!important;
    font-size:12px!important;
    letter-spacing:0!important;
    color:var(--ink)!important;
    background:rgba(255,255,255,.58)!important;
    border:1px solid rgba(226,221,213,.82)!important;
    box-shadow:none!important;
  }
  .mobile-cta-bar a.primary{
    background:var(--green)!important;
    border-color:var(--green)!important;
    color:#fff!important;
  }
}
@media (max-width: 380px){
  .mobile-cta-bar{left:6px!important;right:6px!important;gap:3px!important;padding:6px!important;}
  .mobile-cta-bar a{font-size:11px!important;height:40px!important;}
}
@media (min-width: 901px){
  .mobile-cta-bar{display:none!important;}
}

/* --- mobile smart bottom nav: auto hide and manual recall --- */
.nav-fab{display:none;}
@media(max-width:768px){
  body{padding-bottom:28px!important;}
  .mobile-cta-bar{
    transition:transform .34s cubic-bezier(.2,.8,.2,1), opacity .28s ease, box-shadow .28s ease!important;
    will-change:transform,opacity;
  }
  .mobile-cta-bar.is-hidden{
    transform:translateY(calc(100% + 28px))!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .nav-fab{
    position:fixed;
    right:14px;
    bottom:16px;
    z-index:1300;
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    border:1px solid rgba(226,221,213,.92);
    background:rgba(248,246,240,.9);
    color:var(--green);
    font-size:12px;
    letter-spacing:1px;
    box-shadow:0 14px 34px rgba(40,32,24,.16);
    backdrop-filter:blur(14px);
    opacity:0;
    transform:translateY(10px) scale(.96);
    pointer-events:none;
    transition:.28s ease;
  }
  .nav-fab.show{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
  }
  .archive-tabs{top:0!important;}
}
@media(min-width:769px){.nav-fab{display:none!important;}}

/* --- mobile smart nav: silkier motion and softer visual feedback --- */
@media(max-width:768px){
  .mobile-cta-bar{
    transform:translate3d(0,0,0) scale(1)!important;
    transform-origin:50% 100%;
    opacity:1;
    filter:blur(0);
    transition:
      transform .62s cubic-bezier(.19,1,.22,1),
      opacity .46s ease,
      filter .46s ease,
      box-shadow .46s ease!important;
    box-shadow:0 18px 46px rgba(40,32,24,.16),0 1px 0 rgba(255,255,255,.72) inset!important;
  }
  .mobile-cta-bar.is-hidden{
    transform:translate3d(0,calc(100% + 34px),0) scale(.94)!important;
    opacity:0!important;
    filter:blur(2px);
    pointer-events:none!important;
    box-shadow:0 6px 16px rgba(40,32,24,.05)!important;
  }
  .mobile-cta-bar a{
    transition:
      transform .38s cubic-bezier(.19,1,.22,1),
      background-color .32s ease,
      color .32s ease,
      border-color .32s ease,
      box-shadow .32s ease!important;
  }
  .mobile-cta-bar a:active{
    transform:scale(.94);
  }
  .nav-fab{
    transform:translate3d(0,14px,0) scale(.82) rotate(-4deg);
    transition:
      transform .58s cubic-bezier(.19,1,.22,1),
      opacity .42s ease,
      box-shadow .42s ease,
      background-color .42s ease!important;
  }
  .nav-fab.show{
    opacity:1;
    transform:translate3d(0,0,0) scale(1) rotate(0deg);
    animation:qiuqingFabBreath 2.6s ease-in-out infinite;
  }
  .nav-fab:active{
    transform:translate3d(0,0,0) scale(.92)!important;
  }
}
@keyframes qiuqingFabBreath{
  0%,100%{box-shadow:0 14px 34px rgba(40,32,24,.14),0 0 0 0 rgba(107,119,92,.18)}
  50%{box-shadow:0 18px 42px rgba(40,32,24,.18),0 0 0 8px rgba(107,119,92,0)}
}


/* --- article category system --- */
.article-hero{
  min-height:58vh;
  display:flex;
  align-items:center;
  padding:120px 0 70px;
  background:
    radial-gradient(circle at 14% 20%,rgba(185,151,101,.12),transparent 24%),
    radial-gradient(circle at 86% 16%,rgba(107,119,92,.10),transparent 26%),
    linear-gradient(135deg,#f8f6f0 0%,#f1ebe0 100%);
}
.article-hero h1{font-size:clamp(44px,6vw,82px);letter-spacing:4px;line-height:1.18;margin-bottom:22px}
.article-hero p{max-width:780px;color:var(--muted);font-size:18px;text-align:justify}
.article-category-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.article-category-card{position:relative;min-height:360px;padding:42px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.68);box-shadow:0 18px 50px rgba(40,32,24,.055);overflow:hidden;transition:.45s cubic-bezier(.2,.8,.2,1)}
.article-category-card:nth-child(5){grid-column:1/-1;min-height:300px;background:linear-gradient(135deg,rgba(31,40,31,.95),rgba(86,97,73,.92));color:#f8f0df}
.article-category-card:nth-child(5) p,.article-category-card:nth-child(5) em{color:rgba(248,240,223,.78)}
.article-category-card:hover{transform:translateY(-8px);box-shadow:0 26px 64px rgba(40,32,24,.1);border-color:rgba(107,119,92,.42)}
.article-cat-index{position:absolute;right:28px;top:24px;font-family:var(--serif);font-size:62px;color:rgba(107,119,92,.12);line-height:1}
.article-category-card:nth-child(5) .article-cat-index{color:rgba(255,255,255,.12)}
.article-category-card h2{font-size:42px;margin:14px 0 16px;letter-spacing:3px}
.article-category-card p{color:var(--muted);font-size:16px;text-align:justify;max-width:780px}
.tag-cloud{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}
.tag-cloud span,.tag-cloud a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid rgba(226,221,213,.95);background:rgba(255,255,255,.45);font-size:13px;color:var(--muted)}
.article-category-card:nth-child(5) .tag-cloud span{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:rgba(248,240,223,.85)}
.article-card-footer{position:absolute;left:42px;right:42px;bottom:32px;display:flex;justify-content:space-between;align-items:center;gap:18px;border-top:1px solid rgba(226,221,213,.8);padding-top:18px}
.article-card-footer em{font-style:normal;color:var(--muted);font-size:13px}.article-card-footer a{color:var(--green);font-weight:600}.article-category-card:nth-child(5) .article-card-footer{border-color:rgba(255,255,255,.18)}.article-category-card:nth-child(5) .article-card-footer a{color:#ead8aa}
.article-blueprint{padding-top:20px}.article-blueprint-card{padding:48px;border-radius:28px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}.article-blueprint-card h2{font-size:42px}.article-blueprint-card p{max-width:900px;color:var(--muted);text-align:justify}.blueprint-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:28px}.blueprint-grid span{padding:18px 12px;text-align:center;border-radius:16px;background:#f4efe8;color:var(--green);font-weight:600;font-size:14px}
.crumb-link{display:inline-flex;margin-bottom:20px;color:var(--green);font-size:14px}.article-intro-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:stretch}.article-intro-copy,.article-tags-panel{padding:42px;border-radius:24px;border:1px solid var(--line);background:rgba(255,255,255,.72);box-shadow:0 12px 34px rgba(40,32,24,.045)}.article-intro-copy h2{font-size:42px}.article-intro-copy p{color:var(--muted);text-align:justify}.article-loop{padding-top:22px;border-top:1px solid var(--line);margin-top:26px}.article-tags-panel h3{font-size:34px}.tag-cloud.big a{min-height:42px;padding:0 18px;background:#f8f4ec;color:var(--green)}
.article-posts{background:#f4efe8}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.post-card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 12px 32px rgba(40,32,24,.045);transition:.45s cubic-bezier(.2,.8,.2,1)}.post-card:hover{transform:translateY(-8px);box-shadow:0 26px 58px rgba(40,32,24,.1)}.post-img{height:190px;background:#eee}.post-img img{width:100%;height:100%;object-fit:cover}.post-body{padding:24px}.post-body span{font-size:12px;color:var(--green);letter-spacing:2px}.post-body h3{font-size:24px;line-height:1.45;margin:10px 0}.post-body p{font-size:14px;color:var(--muted);text-align:justify;min-height:76px}.post-body a{font-size:13px;color:var(--green);border-bottom:1px solid currentColor}.article-back-band{background:#1f281f;color:#f8f0df}.article-back-band p{color:rgba(248,240,223,.75)}
/* Article column hero palette: unified deep tea-green for long-form reading. */
.article-hero-zhengben,
.article-hero-seasonal,
.article-hero-craft,
.article-hero-tea,
.article-hero-inheritance{
  --article-hero-base:#333B2E;
  --article-hero-deep:#263024;
  --article-hero-soft:#3D4736;
  --article-hero-line:rgba(219,199,154,.62);
  color:#F6F0E4;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 18%,rgba(80,92,69,.40),transparent 30%),
    radial-gradient(circle at 84% 16%,rgba(209,184,128,.12),transparent 28%),
    linear-gradient(135deg,var(--article-hero-deep) 0%,var(--article-hero-base) 50%,var(--article-hero-soft) 100%);
}
.article-hero-zhengben:before,
.article-hero-seasonal:before,
.article-hero-craft:before,
.article-hero-tea:before,
.article-hero-inheritance:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 72% 52%,rgba(255,255,255,.055),transparent 38%),
    linear-gradient(90deg,rgba(255,255,255,.03),transparent 48%,rgba(255,255,255,.035));
  opacity:.86;
}
.article-hero-zhengben:after,
.article-hero-seasonal:after,
.article-hero-craft:after,
.article-hero-tea:after,
.article-hero-inheritance:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 8px),
    repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 1px,transparent 10px);
  opacity:.42;
}
.article-hero-zhengben > .container,
.article-hero-seasonal > .container,
.article-hero-craft > .container,
.article-hero-tea > .container,
.article-hero-inheritance > .container{
  position:relative;
  z-index:1;
}
.article-hero-zhengben h1,
.article-hero-seasonal h1,
.article-hero-craft h1,
.article-hero-tea h1,
.article-hero-inheritance h1{color:#F8F0DF;}
.article-hero-zhengben p,
.article-hero-seasonal p,
.article-hero-craft p,
.article-hero-tea p,
.article-hero-inheritance p{color:rgba(248,240,223,.78);}
.article-hero-zhengben .kicker,
.article-hero-seasonal .kicker,
.article-hero-craft .kicker,
.article-hero-tea .kicker,
.article-hero-inheritance .kicker{color:rgba(226,207,164,.86);}
.article-hero-zhengben .kicker:before,
.article-hero-seasonal .kicker:before,
.article-hero-craft .kicker:before,
.article-hero-tea .kicker:before,
.article-hero-inheritance .kicker:before{background:var(--article-hero-line);}

@media(max-width:900px){
  .article-hero{min-height:auto;padding:54px 0 38px}.article-hero h1{font-size:38px!important;letter-spacing:2px}.article-hero p{font-size:15px;text-align:left}.article-category-grid,.article-intro-grid,.post-grid,.blueprint-grid{grid-template-columns:1fr!important}.article-category-card,.article-category-card:nth-child(5){grid-column:auto;min-height:auto;padding:26px 22px}.article-cat-index{font-size:44px;right:20px;top:18px}.article-category-card h2,.article-intro-copy h2,.article-blueprint-card h2{font-size:30px}.article-card-footer{position:static;margin-top:22px;display:grid;gap:10px}.tag-cloud{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px}.tag-cloud span,.tag-cloud a{white-space:nowrap;flex:0 0 auto}.article-blueprint-card,.article-intro-copy,.article-tags-panel{padding:24px;border-radius:20px}.post-img{height:auto;aspect-ratio:16/10}.post-body p{min-height:auto}.article-posts{padding-top:72px}.blueprint-grid span{text-align:left}.crumb-link{font-size:13px}
}


/* --- article detail page: Jinshu Chaguo misreading --- */
.article-detail-page{background:#f8f6f0;}
.article-detail-hero{padding:132px 0 72px;background:linear-gradient(135deg,#f8f6f0 0%,#eee6d7 100%);position:relative;overflow:hidden;}
.article-detail-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 20%,rgba(185,151,101,.16),transparent 26%),radial-gradient(circle at 82% 10%,rgba(107,119,92,.12),transparent 24%);pointer-events:none;}
.article-detail-hero-grid{position:relative;display:grid;grid-template-columns:.88fr 1.12fr;gap:52px;align-items:center;}
.article-detail-title h1{font-size:clamp(36px,4.5vw,64px);line-height:1.25;letter-spacing:1.5px;margin:18px 0 18px;}
.article-subtitle{font-family:var(--serif);font-size:22px;line-height:1.65;color:var(--green);margin-bottom:28px;}
.article-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;}
.article-meta span{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:999px;border:1px solid rgba(226,221,213,.96);background:rgba(255,255,255,.55);font-size:13px;color:var(--muted);}
.article-cover{display:block;border-radius:26px;overflow:hidden;box-shadow:0 28px 76px rgba(40,32,24,.16);border:1px solid rgba(255,255,255,.78);background:#efe8da;}
.article-cover img{width:100%;height:auto;display:block;object-fit:cover;}
.article-reading-wrap{padding:84px 0 40px;}
.article-reading-grid{display:grid;grid-template-columns:280px minmax(0,820px);gap:58px;align-items:start;justify-content:center;}
.article-toc{position:sticky;top:96px;padding:28px 24px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.72);box-shadow:0 16px 42px rgba(40,32,24,.05);}
.article-toc h2{font-size:26px;margin-bottom:16px;}
.article-toc a{display:block;padding:11px 0;border-bottom:1px solid rgba(226,221,213,.72);color:var(--muted);font-size:14px;transition:.25s;}
.article-toc a:hover{color:var(--green);transform:translateX(4px);}
.article-content{font-family:var(--serif);font-size:19px;line-height:2.16;color:#4a4440;}
.article-content h2{font-size:34px;line-height:1.45;margin:58px 0 24px;padding-top:18px;border-top:1px solid var(--line);letter-spacing:1px;color:var(--ink);}
.article-content p{margin:0 0 24px;text-align:justify;}
.article-content p:first-child{font-size:21px;color:#3e3a39;}
.article-figure{margin:46px 0 50px;padding:16px;border-radius:26px;background:rgba(255,255,255,.76);border:1px solid var(--line);box-shadow:0 20px 54px rgba(40,32,24,.08);}
.article-figure img{width:100%;height:auto;border-radius:18px;object-fit:cover;}
.article-figure figcaption{font-family:var(--sans);font-size:13px;color:var(--muted);line-height:1.8;margin-top:12px;text-align:center;}
.article-reserve-note{margin-top:56px;padding:34px;border-radius:24px;border:1px dashed rgba(107,119,92,.45);background:rgba(255,255,255,.56);font-family:var(--sans);}
.article-reserve-note h3{font-size:28px;margin-bottom:8px;}
.article-reserve-note p{font-family:var(--sans);font-size:15px;line-height:1.9;color:var(--muted);margin:0;text-align:justify;}
.article-related{background:#f4efe8;padding-top:86px;}
.article-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.article-related-card{display:block;min-height:210px;padding:30px;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 12px 32px rgba(40,32,24,.045);transition:.42s cubic-bezier(.2,.8,.2,1);}
.article-related-card:hover{transform:translateY(-8px);box-shadow:0 24px 54px rgba(40,32,24,.1);border-color:rgba(107,119,92,.42);}
.article-related-card span{font-size:12px;color:var(--green);letter-spacing:2px;}
.article-related-card h3{font-size:28px;margin:12px 0;}
.article-related-card p{font-size:14px;color:var(--muted);text-align:justify;margin:0;}
.featured-post .post-img{height:230px;}

/* --- stronger mobile optimization for article category pages and article detail --- */
@media(max-width:900px){
  .article-system.section,.article-intro.section,.article-posts.section,.article-blueprint.section{padding:52px 0!important;}
  .article-hero{padding:46px 0 34px!important;border-bottom:1px solid rgba(226,221,213,.68);}
  .article-hero .container{width:calc(100% - 32px)!important;}
  .article-hero h1{font-size:36px!important;line-height:1.22!important;}
  .article-hero p{font-size:15px!important;line-height:1.9!important;}
  .article-category-grid{gap:16px!important;}
  .article-category-card{border-radius:22px!important;padding:24px 20px!important;overflow:hidden!important;}
  .article-category-card h2{font-size:30px!important;margin-top:8px!important;}
  .article-category-card p{font-size:14px!important;line-height:1.9!important;text-align:left!important;}
  .article-card-footer{border-top:1px solid rgba(226,221,213,.75)!important;padding-top:16px!important;}
  .article-card-footer a{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:999px;background:var(--green);color:#fff!important;padding:0 18px;width:max-content;}
  .post-grid{gap:16px!important;}
  .post-card{border-radius:20px!important;}
  .post-img{height:auto!important;aspect-ratio:16/10!important;}
  .post-body{padding:20px!important;}
  .post-body h3{font-size:22px!important;}
  .post-body p{text-align:left!important;font-size:14px!important;line-height:1.85!important;}
  .article-blueprint-card{padding:24px 20px!important;}
  .blueprint-grid{gap:10px!important;}
}
@media(max-width:768px){
  .article-detail-hero{padding:34px 0 36px!important;}
  .article-detail-hero-grid{display:flex!important;flex-direction:column!important;gap:24px!important;width:calc(100% - 28px)!important;}
  .article-detail-title{order:1;width:100%;}
  .article-cover{order:2;width:100%;border-radius:22px;box-shadow:0 18px 42px rgba(40,32,24,.13);}
  .article-cover img{aspect-ratio:3/4;object-fit:cover;}
  .article-detail-title h1{font-size:32px!important;line-height:1.36!important;letter-spacing:.5px!important;margin:14px 0 12px!important;}
  .article-subtitle{font-size:17px!important;line-height:1.75!important;margin-bottom:18px!important;}
  .article-meta{gap:8px!important;margin-top:18px!important;}
  .article-meta span{font-size:12px!important;min-height:32px!important;padding:0 12px!important;}
  .article-reading-wrap{padding:48px 0 18px!important;}
  .article-reading-grid{display:block!important;width:calc(100% - 30px)!important;}
  .article-toc{position:relative!important;top:auto!important;margin-bottom:28px!important;padding:22px 18px!important;border-radius:20px!important;}
  .article-toc h2{font-size:23px!important;}
  .article-toc a{font-size:13px!important;padding:9px 0!important;}
  .article-content{font-size:17px!important;line-height:2.05!important;}
  .article-content h2{font-size:25px!important;line-height:1.48!important;margin:46px 0 20px!important;padding-top:18px!important;}
  .article-content p{margin-bottom:20px!important;text-align:left!important;}
  .article-content p:first-child{font-size:18px!important;}
  .article-figure{margin:34px 0 38px!important;padding:10px!important;border-radius:22px!important;}
  .article-figure img{border-radius:16px!important;}
  .article-figure figcaption{font-size:12px!important;text-align:left!important;padding:0 4px!important;}
  .article-reserve-note{padding:24px 20px!important;margin-top:42px!important;}
  .article-reserve-note h3{font-size:24px!important;}
  .article-related{padding:56px 0 76px!important;}
  .article-related-grid{grid-template-columns:1fr!important;gap:14px!important;}
  .article-related-card{min-height:auto!important;padding:24px 20px!important;}
  .article-related-card h3{font-size:24px!important;}
}

/* =========================================================
   Final fix: article detail visibility + mobile article pages
   Version: article-visible-20260427
   Reason: avoid article body depending on scroll reveal JS, prevent blank article area.
========================================================= */
.article-detail-page .article-content,
.article-detail-page .article-content.reveal,
.article-detail-page .article-figure,
.article-detail-page .article-figure.reveal,
.article-detail-page .article-reserve-note,
.article-detail-page .article-related-card,
.article-detail-page .article-related-card.reveal{
  opacity:1 !important;
  transform:none !important;
  visibility:visible !important;
}
.article-detail-page .article-reading-grid{
  grid-template-columns:minmax(220px,280px) minmax(0,820px) !important;
}
.article-detail-page .article-content{
  min-height:200px;
  background:transparent;
}
.article-detail-page .article-content:before{
  content:"";
  display:block;
  width:54px;
  height:1px;
  background:var(--line);
  margin:0 0 28px;
}
.article-detail-page .article-content p,
.article-detail-page .article-content h2,
.article-detail-page .article-content figure{
  visibility:visible !important;
}

/* Article category mobile final optimization */
@media(max-width:900px){
  html,body{max-width:100%;overflow-x:hidden;}
  .article-hero.page-hero{padding-top:46px!important;}
  .article-category-grid,
  .article-intro-grid,
  .post-grid,
  .blueprint-grid{
    grid-template-columns:1fr!important;
  }
  .article-category-card,
  .article-tags-panel,
  .article-intro-copy,
  .article-blueprint-card,
  .post-card{
    width:100%!important;
    max-width:100%!important;
  }
  .tag-cloud,
  .tag-cloud.big{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:10px!important;
    padding-bottom:8px!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .tag-cloud::-webkit-scrollbar,
  .tag-cloud.big::-webkit-scrollbar{display:none;}
  .tag-cloud span,
  .tag-cloud a,
  .tag-cloud.big a{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
  .article-card-footer{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:12px!important;
  }
}
@media(max-width:768px){
  .article-detail-page .nav{display:none!important;}
  .article-detail-page main{padding-top:0!important;}
  .article-detail-hero{padding-top:28px!important;}
  .article-detail-hero-grid{width:calc(100% - 28px)!important;margin:auto!important;}
  .article-reading-grid{width:calc(100% - 28px)!important;margin:auto!important;}
  .article-toc{display:block!important;}
  .article-toc a{display:inline-flex!important;margin:0 8px 8px 0!important;border:1px solid rgba(226,221,213,.9)!important;border-radius:999px!important;padding:6px 12px!important;background:rgba(255,255,255,.55)!important;}
  .article-detail-title h1{font-size:30px!important;}
  .article-content{display:block!important;width:100%!important;max-width:100%!important;opacity:1!important;visibility:visible!important;}
  .article-content:before{margin-bottom:22px;}
  .article-content p{font-size:17px!important;line-height:2.02!important;color:#4a4440!important;}
  .article-content h2{font-size:24px!important;}
  .article-cover img{aspect-ratio:3/4!important;object-fit:cover!important;}
  .article-figure img{height:auto!important;max-height:none!important;object-fit:contain!important;}
  .article-related-grid{grid-template-columns:1fr!important;}
  .mobile-cta-bar{z-index:1200!important;}
  .nav-fab{z-index:1201!important;}
}

/* 2026-04-28 首页首屏优化：减少重复导航，仅保留“进入茶果作品档案”主入口 */
.hero-single-action{
  margin-top:4px;
  margin-bottom:22px;
}
.hero-single-action .hero-archive-btn{
  min-width:218px;
  gap:10px;
  box-shadow:0 18px 34px rgba(107,119,92,.16);
}
.hero-single-action .hero-archive-btn span{
  transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
.hero-single-action .hero-archive-btn:hover span{
  transform:translateX(4px);
}
.hero-identity{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  letter-spacing:2px;
}
.hero-identity i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:rgba(107,119,92,.48);
  display:inline-block;
}
@media(max-width:1020px){
  .hero-single-action{justify-content:center;margin-bottom:18px;}
  .hero-identity{justify-content:center;line-height:1.8;}
}
@media(max-width:640px){
  .hero p{margin-bottom:28px;}
  .hero-actions.hero-single-action{display:flex!important;justify-content:flex-start;margin:0 0 18px;}
  .hero-single-action .hero-archive-btn{width:auto;min-width:0;padding:0 28px;height:48px;}
  .hero-identity{justify-content:flex-start;gap:8px 10px;font-size:12px;letter-spacing:1.5px;margin-bottom:4px;}
  .hero-identity i{width:3px;height:3px;}
}


/* --- refined signature seal: pure CSS, no image replacement needed --- */
.signature-seal{
  position:relative;
  width:38px;
  height:38px;
  display:inline-grid;
  grid-template-columns:1fr;
  place-items:center;
  align-self:center;
  margin-left:2px;
  border:2px solid rgba(155,74,70,.88);
  color:var(--red);
  font-family:var(--serif);
  font-weight:700;
  line-height:1;
  letter-spacing:0;
  border-radius:3px;
  transform:rotate(-2deg);
  background:
    radial-gradient(circle at 22% 18%,rgba(155,74,70,.12) 0 1px,transparent 2px),
    radial-gradient(circle at 74% 82%,rgba(155,74,70,.10) 0 1px,transparent 2px),
    rgba(255,255,255,.15);
  box-shadow:0 5px 14px rgba(155,74,70,.07);
}
.signature-seal::before{
  content:"";
  position:absolute;
  inset:3px;
  border:1px solid rgba(155,74,70,.42);
  border-radius:1px;
  pointer-events:none;
}
.signature-seal::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:4px;
  background:
    linear-gradient(90deg,transparent 0 8%,rgba(255,253,248,.55) 8% 12%,transparent 12% 100%),
    linear-gradient(180deg,transparent 0 72%,rgba(255,253,248,.45) 72% 76%,transparent 76% 100%);
  opacity:.42;
  mix-blend-mode:screen;
  pointer-events:none;
}
.signature-seal b{
  display:block;
  font-size:14px;
  line-height:.96;
  font-weight:700;
  transform:scaleX(.92);
}
@media(max-width:640px){
  .signature-seal{width:34px;height:34px;border-width:1.5px;}
  .signature-seal b{font-size:13px;}
}


/* --- course cards: refined desktop flip interaction, mobile remains clean --- */
.course-grid{align-items:stretch;}
.course-card.course-flip{
  position:relative;
  min-height:552px;
  perspective:1400px;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
}
.course-card.course-flip:hover{
  transform:translateY(-8px);
  border-color:transparent;
  box-shadow:none;
}
.course-flip .course-card-inner{
  position:relative;
  width:100%;
  height:100%;
  min-height:552px;
  padding:0!important;
  text-align:initial!important;
  transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(.22,.72,.18,1), box-shadow .42s ease;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.025);
}
.course-flip:hover .course-card-inner{
  transform:rotateY(180deg);
  box-shadow:0 28px 58px rgba(0,0,0,.07);
}
.course-flip .course-face{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.course-flip .course-face-front img{
  height:245px;
  flex:0 0 245px;
  object-fit:cover;
}
.course-flip .course-front-body{
  padding:34px 30px!important;
  text-align:center!important;
}
.course-flip .course-face-back{
  justify-content:center;
  padding:38px 34px!important;
  transform:rotateY(180deg);
  background:
    radial-gradient(circle at 18% 12%,rgba(185,151,101,.11),transparent 30%),
    radial-gradient(circle at 84% 86%,rgba(107,119,92,.10),transparent 34%),
    linear-gradient(180deg,#fffdf8,#f8f6f0);
}
.course-face-back .course-back-kicker{
  display:inline-flex;
  align-self:flex-start;
  margin-bottom:18px;
  border:1px solid rgba(107,119,92,.45);
  color:var(--green);
  border-radius:999px;
  padding:4px 14px;
  font-size:11px;
  letter-spacing:1.5px;
}
.course-face-back h3{
  font-size:28px;
  margin-bottom:24px;
  letter-spacing:1.5px;
}
.course-face-back dl{
  margin:0 0 30px;
  display:grid;
  gap:16px;
}
.course-face-back dt{
  color:var(--green);
  font-size:12px;
  letter-spacing:2px;
  margin-bottom:4px;
}
.course-face-back dd{
  margin:0;
  color:var(--ink);
  font-size:15px;
  line-height:1.8;
  padding-bottom:14px;
  border-bottom:1px solid rgba(226,221,213,.72);
}
.course-face-back dl > div:last-child dd,
.course-face-back dd:last-child{border-bottom:0;}
.course-back-btn{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  align-self:flex-start;
  height:44px;
  padding:0 24px;
  border:1px solid var(--green)!important;
  border-radius:999px;
  background:var(--green);
  color:#fff;
  font-size:13px!important;
  letter-spacing:1px;
  transition:.35s ease;
}
.course-back-btn:hover{background:var(--green2);transform:translateY(-2px);}
@media (max-width:768px){
  .course-card.course-flip{
    min-height:0;
    perspective:none;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 10px 30px rgba(0,0,0,.025);
    overflow:hidden;
  }
  .course-card.course-flip:hover{transform:none;box-shadow:0 10px 30px rgba(0,0,0,.025);}
  .course-flip .course-card-inner{
    position:static;
    min-height:0;
    height:auto;
    transform:none!important;
    box-shadow:none;
  }
  .course-flip .course-face{
    position:static;
    display:flex;
    border:0;
    border-radius:0;
    transform:none!important;
    backface-visibility:visible;
  }
  .course-flip .course-face-back{display:none;}
  .course-flip .course-face-front img{height:auto;aspect-ratio:16/10;flex:auto;}
  .course-flip .course-front-body{padding:24px 22px!important;text-align:left!important;}
}

/* --- seal content refined to identity mark: 非遗 --- */
.signature-seal[aria-label="非遗印"]{
  width:36px;
  height:36px;
  border-color:rgba(155,74,70,.9);
}
.signature-seal[aria-label="非遗印"] b{
  font-size:13px;
  line-height:.95;
  letter-spacing:0;
}

/* --- course front copy refinement: desktop flip has no redundant front links; mobile keeps clear CTA --- */
.course-flip .course-front-body p{
  line-height:2.05;
  min-height:112px;
}
.course-flip .course-front-body .mobile-course-link{
  display:none;
}
@media (max-width:768px){
  .course-flip .course-front-body p{
    min-height:0;
    line-height:1.9;
    margin-bottom:18px;
  }
  .course-flip .course-front-body .mobile-course-link{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    height:42px;
    padding:0 20px;
    border:1px solid var(--green)!important;
    border-radius:999px;
    color:var(--green);
    background:rgba(255,255,255,.52);
    font-size:13px!important;
    letter-spacing:1px;
  }
}


/* === Open letter module in city alliance section: focused full-image letter card === */
.alliance-letter-layout{grid-template-columns:1.18fr .82fr;align-items:stretch}
.alliance-letter-card{
  display:block;
  padding:0!important;
  overflow:hidden!important;
  background:#fff;
  border:1px solid rgba(160,142,114,.18);
  border-radius:24px;
  box-shadow:var(--shadow);
  min-height:0;
}
.alliance-letter-card:after,
.alliance-letter-card:before{display:none!important;content:none!important}
.alliance-letter-card>span,
.alliance-letter-card>h3,
.alliance-letter-card>p,
.alliance-letter-actions{display:none!important}
.letter-trigger{
  position:relative;
  display:block;
  width:100%;
  height:100%;
  min-height:100%;
  padding:0;
  background:transparent;
  border:0;
  border-radius:24px;
  cursor:pointer;
  overflow:hidden;
  isolation:isolate;
  transition:transform .55s cubic-bezier(.22,.61,.36,1), filter .45s ease, box-shadow .55s ease;
}
.letter-trigger:hover,
.letter-trigger:focus-visible{transform:translateY(-3px);filter:brightness(1.018)}
.letter-trigger:focus-visible{outline:2px solid rgba(123,133,104,.48);outline-offset:4px}
.alliance-letter-card.is-opening .letter-trigger{transform:translateY(-2px) scale(.995);filter:brightness(1.01)}
.letter-sequence{
  position:relative;
  display:block;
  width:100%;
  height:100%;
  min-height:100%;
  aspect-ratio:2048/1365;
  border-radius:24px!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  background:#f5efe5;
  clip-path:none!important;
}
.letter-sequence:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 0%,transparent 38%,rgba(255,255,255,.26) 48%,transparent 58%,transparent 100%);
  transform:translateX(-120%);
  opacity:0;
}
.letter-trigger:hover .letter-sequence:before{animation:letterHoverSheen 1.15s ease forwards}
.letter-frame{
  position:absolute;
  inset:0;
  display:block;
  opacity:0;
  transform:scale(1.002);
  transition:opacity .44s ease, transform .72s cubic-bezier(.22,.61,.36,1), filter .5s ease;
}
.letter-frame img{width:100%;height:100%;object-fit:cover;display:block}
.letter-frame-closed{opacity:1;z-index:1;transform:scale(1)}
.letter-frame-half{z-index:2;opacity:0}
.letter-frame-open{z-index:3;opacity:0}
.letter-trigger:hover .letter-frame-closed{transform:scale(1.008)}
.alliance-letter-card.is-opening .letter-frame-closed{
  animation:letterClosedOut .62s cubic-bezier(.22,.61,.36,1) forwards;
}
.alliance-letter-card.is-opening .letter-frame-half{
  animation:letterHalfGhost .58s cubic-bezier(.22,.61,.36,1) forwards;
}
.alliance-letter-card.is-opening .letter-frame-open{
  animation:letterOpenIn .68s cubic-bezier(.22,.61,.36,1) forwards;
}
.alliance-letter-card.is-opening .letter-sequence:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:radial-gradient(circle at 50% 52%,rgba(255,250,232,.32),transparent 56%);
  opacity:0;
  animation:letterSoftGlow .68s ease forwards;
}
.alliance-letter-layout .alliance-metrics{
  height:100%;
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:1fr 1fr;
  gap:18px;
}
.alliance-letter-layout .alliance-metrics div{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:0;
  padding:42px 38px;
}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes letterHoverSheen{0%{opacity:0;transform:translateX(-120%)}20%{opacity:.38}100%{opacity:0;transform:translateX(120%)}}
@keyframes letterClosedOut{0%{opacity:1;transform:scale(1)}55%{opacity:.64;transform:scale(1.006)}100%{opacity:0;transform:scale(1.012)}}
@keyframes letterHalfGhost{0%{opacity:0;transform:scale(1.01)}30%{opacity:.42;transform:scale(1.006)}58%{opacity:.32;transform:scale(1.004)}100%{opacity:0;transform:scale(1.002)}}
@keyframes letterOpenIn{0%,18%{opacity:0;transform:translateY(3px) scale(1.008)}56%{opacity:.92;transform:translateY(1px) scale(1.002)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes letterSoftGlow{0%,28%{opacity:0}55%{opacity:.34}100%{opacity:0}}
@media (max-width:768px){
  .alliance-letter-layout{grid-template-columns:1fr}
  .alliance-letter-card{border-radius:20px}
  .letter-trigger{border-radius:20px}
  .letter-sequence{aspect-ratio:1638/2048;min-height:420px;border-radius:20px!important}
  .alliance-letter-layout .alliance-metrics{grid-template-rows:auto auto;gap:12px}
  .alliance-letter-layout .alliance-metrics div{padding:28px 24px;min-height:130px}
}
@media (prefers-reduced-motion: reduce){
  .letter-trigger,.letter-frame,.letter-sequence:before{transition:none!important;animation:none!important}
  .alliance-letter-card.is-opening .letter-frame-closed{opacity:0}
  .alliance-letter-card.is-opening .letter-frame-open{opacity:1}
}

.letter-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:28px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease, visibility .35s ease;z-index:1200}
.letter-modal.is-visible{opacity:1;visibility:visible;pointer-events:auto}
.letter-modal-backdrop{position:absolute;inset:0;background:rgba(35,30,26,.48);backdrop-filter:blur(4px)}
.letter-modal-dialog{position:relative;width:min(980px,100%);max-height:min(90vh,980px);background:linear-gradient(180deg,#fffdf7 0%,#f7f1e8 100%);border:1px solid rgba(157,132,98,.18);border-radius:28px;box-shadow:0 24px 80px rgba(36,28,20,.22);overflow:hidden;transform:translateY(24px) scale(.98);transition:transform .42s cubic-bezier(.22,.61,.36,1)}
.letter-modal.is-visible .letter-modal-dialog{transform:translateY(0) scale(1)}
.letter-modal-close{position:absolute;top:18px;right:18px;width:42px;height:42px;border-radius:999px;border:1px solid rgba(80,65,52,.12);background:rgba(255,255,255,.86);font-size:28px;line-height:1;color:#5d5144;cursor:pointer;z-index:2}
.letter-modal-inner{padding:56px 48px 34px;overflow:auto;max-height:min(90vh,980px)}
.letter-modal-head{padding-right:44px;margin-bottom:28px}
.letter-modal-head h2{font-size:42px;line-height:1.25;margin:8px 0 10px}
.letter-subtitle{font-family:var(--serif);font-size:18px;color:#7b6e61;letter-spacing:1px;margin:0}
.letter-article{display:flex;flex-direction:column;gap:24px}
.letter-section{padding-bottom:24px;border-bottom:1px solid rgba(157,132,98,.12)}
.letter-section:last-child{border-bottom:0;padding-bottom:4px}
.letter-salutation{font-family:var(--serif);font-size:22px;letter-spacing:1px;margin-bottom:18px;color:#4b4339}
.letter-section h3{font-size:28px;line-height:1.45;margin:0 0 14px;font-family:var(--serif);letter-spacing:1px}
.letter-section p{margin:0 0 13px;color:#53483d;line-height:2;text-align:justify;font-size:16px}
.intro-block{background:rgba(255,255,255,.55);padding:22px 24px;border:1px solid rgba(157,132,98,.10);border-radius:20px}
.letter-modal-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;padding-top:24px;border-top:1px solid rgba(157,132,98,.12);margin-top:14px}
.body-lock{overflow:hidden}

.letter-page{background:linear-gradient(180deg,#fbfaf5 0%,#f5f0e8 100%)}
.letter-page-hero{padding:130px 0 48px;position:relative;overflow:hidden}
.letter-page-hero:before{content:"公开信";position:absolute;right:5%;top:84px;font-family:var(--serif);font-size:140px;letter-spacing:10px;color:rgba(107,119,92,.05);pointer-events:none}
.letter-page-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center}
.letter-page-cover img{width:100%;border-radius:28px;box-shadow:0 20px 60px rgba(37,28,21,.10);border:1px solid rgba(157,132,98,.16)}
.letter-page-copy h1{font-size:58px;line-height:1.25;margin:10px 0 16px}
.letter-page-copy p{color:var(--muted);line-height:1.95;text-align:justify}
.letter-page-copy .meta-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.letter-page-copy .meta-tags span{padding:8px 14px;border-radius:999px;border:1px solid rgba(123,133,104,.18);font-size:13px;color:#766b5f;background:rgba(255,255,255,.65)}
.letter-page-body{padding:0 0 96px}
.letter-reading-paper{background:rgba(255,255,255,.78);border:1px solid rgba(157,132,98,.12);border-radius:30px;box-shadow:0 18px 55px rgba(37,28,21,.08);padding:44px}

@media (max-width: 1024px){
  .letter-modal-inner{padding:48px 30px 28px}
  .letter-modal-head h2{font-size:34px}
  .letter-page-copy h1{font-size:46px}
}
@media (max-width: 768px){
  .alliance-letter-card>p{text-align:left}
  .letter-trigger{border-radius:18px}
  .letter-envelope-stage{aspect-ratio:5/7;min-height:420px}
  .letter-paper-card{left:12%;right:12%;bottom:22%;min-height:52%;padding:16px 16px 14px}
  .letter-paper-card strong{font-size:18px;line-height:1.5}
  .letter-paper-card em{font-size:12px;line-height:1.75}
  .letter-envelope-base{left:6%;right:6%;bottom:8%;height:60%;border-radius:18px 18px 20px 20px}
  .letter-envelope-left{left:6%;width:44%}
  .letter-envelope-right{right:6%;width:44%}
  .letter-envelope-flap{left:6%;right:6%;top:18%;height:47%}
  .letter-wax-seal{bottom:26%;width:50px;height:50px}
  .alliance-letter-actions{gap:10px}
  .letter-modal{padding:12px}
  .letter-modal-dialog{max-height:calc(100vh - 24px);border-radius:22px}
  .letter-modal-inner{padding:50px 18px 22px;max-height:calc(100vh - 24px)}
  .letter-modal-close{top:12px;right:12px;width:38px;height:38px;font-size:24px}
  .letter-modal-head{padding-right:0;margin-bottom:20px}
  .letter-modal-head h2{font-size:26px;line-height:1.45}
  .letter-subtitle{font-size:15px;line-height:1.8}
  .letter-section h3{font-size:22px;line-height:1.55}
  .letter-section p{font-size:15px;line-height:1.95;text-align:left}
  .intro-block{padding:18px 16px;border-radius:16px}
  .letter-page-hero{padding:112px 0 30px}
  .letter-page-hero:before{display:none}
  .letter-page-grid{grid-template-columns:1fr;gap:20px}
  .letter-page-copy h1{font-size:30px;line-height:1.45}
  .letter-page-copy p{text-align:left}
  .letter-page-body{padding-bottom:78px}
  .letter-reading-paper{padding:22px 16px;border-radius:20px}
}

@media (prefers-reduced-motion: reduce){.letter-trigger,.letter-envelope-image,.letter-envelope-open,.letter-envelope-flap,.letter-paper-card,.letter-wax-seal{transition:none!important;animation:none!important}}


/* === Works archive navigation simplification: compact category dropdown === */
.archive-main-nav{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-top:28px;
  position:relative;
  z-index:8;
}
.archive-dropdown{position:relative;z-index:12;}
.archive-dropdown summary{
  list-style:none;
  min-width:176px;
  cursor:pointer;
  user-select:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-radius:999px;
  padding:14px 24px;
  background:var(--green);
  color:#fff;
  border:1px solid var(--green);
  box-shadow:0 12px 26px rgba(44,57,42,.12);
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, background .28s ease;
  font-size:15px;
  letter-spacing:1px;
}
.archive-dropdown summary::-webkit-details-marker{display:none;}
.archive-dropdown summary span{
  font-size:11px;
  opacity:.78;
  letter-spacing:1px;
}
.archive-dropdown[open] summary,
.archive-dropdown summary:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 34px rgba(44,57,42,.18);
  background:#5f6f55;
}
.archive-dropdown-panel{
  position:absolute;
  left:0;
  top:calc(100% + 12px);
  min-width:248px;
  padding:14px;
  border-radius:22px;
  border:1px solid rgba(107,119,92,.16);
  background:rgba(255,253,247,.96);
  backdrop-filter:blur(18px);
  box-shadow:0 24px 60px rgba(48,40,31,.12);
  animation:archiveMenuIn .26s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes archiveMenuIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.archive-menu-group{display:grid;gap:7px;}
.archive-menu-group b{
  display:block;
  padding:7px 10px 5px;
  font-size:12px;
  color:#9a8977;
  letter-spacing:2px;
  text-transform:uppercase;
  font-weight:500;
}
.archive-menu-group a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-radius:14px;
  padding:10px 12px;
  color:var(--ink);
  background:rgba(255,255,255,.52);
  border:1px solid transparent;
  font-size:14px;
  transition:.22s ease;
}
.archive-menu-group a::after{content:"→";color:#a58d77;opacity:.72;transform:translateX(-2px);transition:.22s ease;}
.archive-menu-group a:hover,.archive-menu-group a.current{
  background:#f5f0e8;
  border-color:rgba(107,119,92,.18);
  color:var(--green);
}
.archive-menu-group a:hover::after{transform:translateX(2px);opacity:1;}
.archive-menu-divider{height:1px;background:var(--line);margin:10px 4px;}
.archive-first-section{padding-top:92px;}
.archive-first-section .filter-chips{margin-top:-10px;margin-bottom:34px;}
.archive-tabs{display:none!important;}
.archive-hero .btn.ghost{padding:14px 24px;}

@media(max-width:900px){
  .archive-main-nav{gap:12px;margin-top:24px;align-items:stretch;}
  .archive-dropdown{width:100%;}
  .archive-dropdown summary{width:100%;justify-content:space-between;padding:13px 18px;font-size:14px;}
  .archive-dropdown-panel{position:static;margin-top:10px;min-width:0;width:100%;border-radius:18px;padding:12px;box-shadow:0 16px 38px rgba(48,40,31,.10);}
  .archive-main-nav .btn.ghost{width:100%;justify-content:center;}
  .archive-stat{gap:12px;margin-top:22px;}
  .archive-stat span{font-size:12px;}
  .archive-first-section{padding-top:68px!important;}
  .archive-first-section .filter-chips{margin-top:-8px;margin-bottom:26px;}
  .subsection-head{display:block!important;}
}

/* Works archive nav refinement: compact horizontal topic bubbles */
.archive-dropdown{position:relative;z-index:30;}
.archive-dropdown::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  height:14px;
}
.archive-dropdown-panel{
  top:calc(100% + 8px)!important;
  min-width:0!important;
  width:max-content!important;
  max-width:min(680px, 82vw)!important;
  padding:16px 18px!important;
  border-radius:28px!important;
}
.archive-theme-pills{display:block!important;}
.archive-theme-pills b{
  display:block!important;
  padding:2px 4px 12px!important;
  font-size:12px!important;
  color:#9a8977!important;
  letter-spacing:2px!important;
  font-weight:500!important;
}
.archive-theme-chip-row{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
}
.archive-theme-chip-row a,
.archive-menu-group.archive-theme-pills a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  border-radius:999px!important;
  padding:9px 17px!important;
  color:var(--green)!important;
  background:rgba(255,255,255,.58)!important;
  border:1px solid rgba(107,119,92,.20)!important;
  box-shadow:0 8px 24px rgba(47,42,35,.035)!important;
  white-space:nowrap!important;
  font-size:14px!important;
  letter-spacing:1px!important;
}
.archive-theme-chip-row a::after,
.archive-menu-group.archive-theme-pills a::after{content:none!important;display:none!important;}
.archive-theme-chip-row a:hover,
.archive-theme-chip-row a.current,
.archive-menu-group.archive-theme-pills a:hover,
.archive-menu-group.archive-theme-pills a.current{
  background:rgba(107,119,92,.10)!important;
  border-color:rgba(107,119,92,.32)!important;
  transform:translateY(-1px);
}
.archive-main-nav .btn.ghost{white-space:nowrap;}
.archive-work-card dl.work-poem{
  display:block!important;
  grid-template-columns:unset!important;
  margin-top:18px!important;
  padding-top:14px!important;
  border-top:1px solid var(--line)!important;
  color:var(--muted)!important;
}
.archive-work-card dl.work-poem dd{
  margin:0!important;
  display:block!important;
  line-height:1.9!important;
}
.archive-work-card dl.work-poem dd:first-child{
  color:var(--ink)!important;
  font-size:14px!important;
  letter-spacing:1px!important;
}
.archive-work-card dl.work-poem dd + dd{
  margin-top:4px!important;
  color:#9a8977!important;
  font-size:12px!important;
  letter-spacing:1px!important;
}
@media(max-width:900px){
  .archive-dropdown-panel{
    width:100%!important;
    max-width:100%!important;
    border-radius:22px!important;
    padding:14px!important;
  }
  .archive-theme-chip-row{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    padding-bottom:4px!important;
    -webkit-overflow-scrolling:touch;
  }
  .archive-theme-chip-row::-webkit-scrollbar{display:none;}
  .archive-theme-chip-row a{flex:0 0 auto!important;}
}


/* === Works archive nav glass bubble refinement === */
.archive-dropdown summary span{display:none!important;}
.archive-dropdown summary{
  min-width:160px!important;
  padding:14px 30px!important;
  gap:0!important;
}
.archive-dropdown-panel{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  padding:12px 0 0!important;
  border-radius:0!important;
  max-width:min(760px, 88vw)!important;
}
.archive-theme-pills b{display:none!important;}
.archive-theme-chip-row{
  gap:14px!important;
  padding:6px 4px 10px!important;
}
.archive-theme-chip-row a,
.archive-menu-group.archive-theme-pills a{
  position:relative!important;
  overflow:hidden!important;
  min-width:118px!important;
  min-height:54px!important;
  padding:12px 22px!important;
  border-radius:999px!important;
  color:#5f6f55!important;
  background:linear-gradient(135deg, rgba(255,255,255,.46), rgba(255,255,255,.18))!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.78),
    inset 0 -10px 24px rgba(255,255,255,.22),
    0 16px 34px rgba(48,40,31,.08),
    0 0 0 1px rgba(107,119,92,.10)!important;
  backdrop-filter:blur(14px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.12)!important;
  transform:translateY(10px) scale(.92)!important;
  opacity:0!important;
  animation:bubblePop .46s cubic-bezier(.18,.89,.32,1.22) forwards!important;
}
.archive-theme-chip-row a:nth-child(1){animation-delay:.02s!important;}
.archive-theme-chip-row a:nth-child(2){animation-delay:.07s!important;}
.archive-theme-chip-row a:nth-child(3){animation-delay:.12s!important;}
.archive-theme-chip-row a:nth-child(4){animation-delay:.17s!important;}
.archive-theme-chip-row a::before,
.archive-menu-group.archive-theme-pills a::before{
  content:""!important;
  position:absolute!important;
  top:8px!important;
  left:16px!important;
  width:34%!important;
  height:28%!important;
  border-radius:999px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0))!important;
  opacity:.72!important;
  pointer-events:none!important;
}
.archive-theme-chip-row a::after,
.archive-menu-group.archive-theme-pills a::after{content:none!important;display:none!important;}
.archive-theme-chip-row a:hover,
.archive-theme-chip-row a.current,
.archive-menu-group.archive-theme-pills a:hover,
.archive-menu-group.archive-theme-pills a.current{
  background:linear-gradient(135deg, rgba(255,255,255,.62), rgba(247,250,244,.28))!important;
  border-color:rgba(255,255,255,.88)!important;
  color:var(--green)!important;
  transform:translateY(-3px) scale(1.02)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.84),
    inset 0 -12px 26px rgba(255,255,255,.26),
    0 22px 42px rgba(48,40,31,.12),
    0 0 0 1px rgba(107,119,92,.18)!important;
}
@keyframes bubblePop{
  0%{opacity:0;transform:translateY(12px) scale(.86)}
  65%{opacity:1;transform:translateY(-2px) scale(1.035)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
@media(max-width:900px){
  .archive-dropdown summary{width:100%!important;min-width:0!important;justify-content:center!important;padding:13px 18px!important;}
  .archive-dropdown-panel{padding:10px 0 0!important;width:100%!important;max-width:100%!important;}
  .archive-theme-chip-row{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:12px!important;
    padding:6px 2px 12px!important;
  }
  .archive-theme-chip-row a,
  .archive-menu-group.archive-theme-pills a{
    flex:0 0 auto!important;
    min-width:112px!important;
    min-height:50px!important;
    padding:11px 18px!important;
    opacity:1!important;
    transform:none!important;
    animation:none!important;
  }
}


/* === Works archive glass bubble dropdown hotfix: no <details>, CSS hover/focus + mobile tap === */
.archive-hover-menu{
  position:relative!important;
  z-index:80!important;
  display:inline-flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
}
.archive-hover-menu .archive-trigger{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:1px solid var(--green)!important;
  background:var(--green)!important;
  color:#fff!important;
  min-width:160px!important;
  border-radius:999px!important;
  padding:14px 30px!important;
  font-size:15px!important;
  line-height:1!important;
  letter-spacing:1px!important;
  cursor:pointer!important;
  font-family:inherit!important;
  box-shadow:0 12px 26px rgba(44,57,42,.12)!important;
  transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, background .28s ease!important;
}
.archive-hover-menu:hover .archive-trigger,
.archive-hover-menu:focus-within .archive-trigger,
.archive-hover-menu.is-open .archive-trigger{
  transform:translateY(-2px)!important;
  box-shadow:0 18px 34px rgba(44,57,42,.18)!important;
  background:#5f6f55!important;
}
.archive-hover-menu .archive-dropdown-panel{
  display:block!important;
  position:absolute!important;
  left:0!important;
  top:calc(100% + 10px)!important;
  width:max-content!important;
  min-width:0!important;
  max-width:min(760px,88vw)!important;
  margin:0!important;
  padding:12px 0 0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(10px)!important;
  transition:opacity .24s ease, transform .28s cubic-bezier(.2,.8,.2,1), visibility .24s ease!important;
}
.archive-hover-menu:hover .archive-dropdown-panel,
.archive-hover-menu:focus-within .archive-dropdown-panel,
.archive-hover-menu.is-open .archive-dropdown-panel{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0)!important;
}
.archive-hover-menu .archive-theme-chip-row{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:14px!important;
  padding:6px 4px 10px!important;
  align-items:center!important;
}
.archive-hover-menu .archive-theme-chip-row a{
  position:relative!important;
  overflow:hidden!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:118px!important;
  min-height:54px!important;
  padding:12px 22px!important;
  border-radius:999px!important;
  color:#5f6f55!important;
  background:linear-gradient(135deg, rgba(255,255,255,.48), rgba(255,255,255,.18))!important;
  border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    inset 0 -10px 24px rgba(255,255,255,.22),
    0 16px 34px rgba(48,40,31,.08),
    0 0 0 1px rgba(107,119,92,.10)!important;
  backdrop-filter:blur(14px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.12)!important;
  white-space:nowrap!important;
  font-size:15px!important;
  letter-spacing:1px!important;
  opacity:0!important;
  transform:translateY(12px) scale(.90)!important;
}
.archive-hover-menu:hover .archive-theme-chip-row a,
.archive-hover-menu:focus-within .archive-theme-chip-row a,
.archive-hover-menu.is-open .archive-theme-chip-row a{
  animation:bubblePop .46s cubic-bezier(.18,.89,.32,1.22) forwards!important;
}
.archive-hover-menu .archive-theme-chip-row a:nth-child(1){animation-delay:.02s!important;}
.archive-hover-menu .archive-theme-chip-row a:nth-child(2){animation-delay:.07s!important;}
.archive-hover-menu .archive-theme-chip-row a:nth-child(3){animation-delay:.12s!important;}
.archive-hover-menu .archive-theme-chip-row a:nth-child(4){animation-delay:.17s!important;}
.archive-hover-menu .archive-theme-chip-row a::before{
  content:""!important;
  position:absolute!important;
  top:8px!important;
  left:16px!important;
  width:34%!important;
  height:28%!important;
  border-radius:999px!important;
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,0))!important;
  opacity:.72!important;
  pointer-events:none!important;
}
.archive-hover-menu .archive-theme-chip-row a::after{content:none!important;display:none!important;}
.archive-hover-menu .archive-theme-chip-row a:hover,
.archive-hover-menu .archive-theme-chip-row a.current{
  background:linear-gradient(135deg, rgba(255,255,255,.66), rgba(247,250,244,.30))!important;
  border-color:rgba(255,255,255,.9)!important;
  color:var(--green)!important;
  transform:translateY(-3px) scale(1.02)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.84),
    inset 0 -12px 26px rgba(255,255,255,.26),
    0 22px 42px rgba(48,40,31,.12),
    0 0 0 1px rgba(107,119,92,.18)!important;
}
@media(max-width:900px){
  .archive-hover-menu{
    display:flex!important;
    width:100%!important;
    align-items:stretch!important;
  }
  .archive-hover-menu .archive-trigger{
    width:100%!important;
    min-width:0!important;
    justify-content:center!important;
    padding:13px 18px!important;
  }
  .archive-hover-menu .archive-dropdown-panel{
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    max-height:0!important;
    overflow:hidden!important;
    padding:0!important;
    opacity:0!important;
    visibility:hidden!important;
    transform:none!important;
    transition:max-height .36s cubic-bezier(.2,.8,.2,1), opacity .22s ease, padding .22s ease!important;
  }
  .archive-hover-menu:focus-within .archive-dropdown-panel,
  .archive-hover-menu.is-open .archive-dropdown-panel{
    max-height:92px!important;
    padding:10px 0 0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .archive-hover-menu .archive-theme-chip-row{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    gap:12px!important;
    padding:6px 2px 12px!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .archive-hover-menu .archive-theme-chip-row::-webkit-scrollbar{display:none!important;}
  .archive-hover-menu .archive-theme-chip-row a{
    flex:0 0 auto!important;
    min-width:112px!important;
    min-height:50px!important;
    padding:11px 18px!important;
    opacity:1!important;
    transform:none!important;
    animation:none!important;
  }
}


/* === Works archive static glass bubble navigation: stable no-hover version === */
.archive-static-nav{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:16px 18px!important;margin-top:30px!important;}
.archive-trigger-static{min-width:176px!important;justify-content:center!important;box-shadow:0 18px 42px rgba(99,113,84,.18)!important;}
.archive-category-link{white-space:nowrap!important;}
.archive-static-theme-bubbles{flex:1 0 100%!important;display:flex!important;flex-wrap:wrap!important;gap:12px!important;align-items:center!important;margin-top:2px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;}
.archive-static-theme-bubbles a{position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:48px!important;padding:0 28px!important;border-radius:999px!important;border:1px solid rgba(112,126,96,.24)!important;background:linear-gradient(145deg, rgba(255,255,255,.62), rgba(255,255,255,.28))!important;color:#64715c!important;text-decoration:none!important;letter-spacing:.08em!important;font-size:15px!important;line-height:1!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.76), 0 14px 34px rgba(68,58,46,.06)!important;backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease, color .28s ease!important;}
.archive-static-theme-bubbles a::before{content:""!important;position:absolute!important;left:18px!important;top:10px!important;width:22px!important;height:8px!important;border-radius:999px!important;background:rgba(255,255,255,.45)!important;transform:rotate(-18deg)!important;pointer-events:none!important;}
.archive-static-theme-bubbles a:hover,.archive-static-theme-bubbles a:focus-visible{transform:translateY(-3px)!important;border-color:rgba(105,118,90,.38)!important;color:#58684e!important;background:linear-gradient(145deg, rgba(255,255,255,.78), rgba(255,255,255,.38))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.84), 0 18px 42px rgba(68,58,46,.10)!important;outline:none!important;}
@media (max-width:900px){.archive-static-nav{gap:12px!important;margin-top:22px!important;align-items:center!important;}.archive-trigger-static,.archive-category-link{width:auto!important;min-width:0!important;flex:0 0 auto!important;height:48px!important;padding:0 22px!important;font-size:14px!important;}.archive-static-theme-bubbles{margin-top:2px!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;gap:10px!important;padding:2px 2px 10px!important;scroll-snap-type:x proximity!important;-webkit-overflow-scrolling:touch!important;}.archive-static-theme-bubbles::-webkit-scrollbar{display:none!important;}.archive-static-theme-bubbles a{flex:0 0 auto!important;min-height:44px!important;padding:0 22px!important;font-size:14px!important;scroll-snap-align:start!important;}}




/* === Works archive floating section switcher === */
.archive-float-switcher{
  position:fixed;
  right:clamp(18px,3vw,42px);
  bottom:clamp(24px,4vw,48px);
  z-index:980;
  display:flex;
  align-items:flex-end;
  gap:12px;
  opacity:0;
  visibility:hidden;
  transform:translateY(18px) scale(.98);
  pointer-events:none;
  transition:opacity .38s ease, transform .42s cubic-bezier(.22,.61,.36,1), visibility .38s ease;
}
.archive-float-switcher.is-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.archive-float-toggle{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:8px;
  min-width:178px;
  padding:12px 15px 12px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.48);
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(248,243,235,.46));
  box-shadow:0 18px 44px rgba(59,48,38,.13), inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(16px) saturate(1.08);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
  color:#5f5143;
  cursor:pointer;
  font-family:inherit;
  transition:transform .28s ease, box-shadow .28s ease, background .28s ease;
}
.archive-float-toggle:hover,
.archive-float-toggle:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 22px 52px rgba(59,48,38,.16), inset 0 1px 0 rgba(255,255,255,.84);
  outline:none;
}
.archive-float-toggle small{font-size:11px;letter-spacing:1.8px;color:#9a8a76;text-transform:uppercase;white-space:nowrap;}
.archive-float-toggle strong{font-family:var(--serif);font-size:15px;letter-spacing:1px;color:#4c4237;white-space:nowrap;}
.archive-float-toggle span{font-size:12px;letter-spacing:1px;color:#8a6d55;white-space:nowrap;}
.archive-float-panel{
  position:absolute;
  right:0;
  bottom:58px;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  width:min(520px,calc(100vw - 48px));
  padding:0;
  opacity:0;
  transform:translateY(12px) scale(.98);
  visibility:hidden;
  pointer-events:none;
  transition:opacity .26s ease, transform .32s cubic-bezier(.22,.61,.36,1), visibility .26s ease;
}
.archive-float-switcher.is-open .archive-float-panel{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.archive-float-panel a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.50);
  background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.88),rgba(255,255,255,.46) 40%,rgba(240,232,219,.34) 100%);
  box-shadow:0 12px 30px rgba(57,49,38,.10), inset 0 1px 0 rgba(255,255,255,.78);
  backdrop-filter:blur(14px) saturate(1.12);
  -webkit-backdrop-filter:blur(14px) saturate(1.12);
  color:#6f604f;
  text-decoration:none;
  font-size:13px;
  letter-spacing:1px;
  white-space:nowrap;
  transition:transform .24s ease, box-shadow .24s ease, color .24s ease, border-color .24s ease;
}
.archive-float-panel a:hover,
.archive-float-panel a:focus-visible,
.archive-float-panel a.current{
  transform:translateY(-3px);
  color:#7d3d2f;
  border-color:rgba(166,105,88,.28);
  box-shadow:0 16px 38px rgba(89,62,45,.14), inset 0 1px 0 rgba(255,255,255,.86);
  outline:none;
}
@media (max-width: 900px){
  .archive-float-switcher{
    left:14px;
    right:auto;
    bottom:82px;
    justify-content:flex-start;
    align-items:flex-start;
    width:auto;
  }
  .archive-float-toggle{
    min-width:0;
    max-width:calc(100vw - 28px);
    padding:11px 13px;
    grid-template-columns:auto auto auto;
  }
  .archive-float-panel{
    left:0;
    right:auto;
    bottom:56px;
    width:calc(100vw - 28px);
    flex-wrap:nowrap;
    overflow-x:auto;
    justify-content:flex-start;
    padding:2px 2px 8px;
    scrollbar-width:none;
  }
  .archive-float-panel::-webkit-scrollbar{display:none;}
  .archive-float-panel a{flex:0 0 auto;min-height:38px;padding:9px 14px;font-size:12px;}
}
@media (max-width: 420px){
  .archive-float-toggle small{display:none;}
  .archive-float-toggle strong{font-size:14px;}
  .archive-float-toggle span{font-size:11px;}
}

/* Works archive: refined Chinese-knot hanging switcher typography.
   Main label uses lighter tea-ink tone and Song/Ming style for a calmer title-tag feel.
   Long plaque size from previous version is retained.

   Works archive: long Chinese-knot hanging switcher.
   Desktop uses a taller plaque; mobile keeps compact bottom-left style. */
@keyframes qqKnotReveal{
  from{opacity:0;transform:translateY(-24px) scale(.98);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes qqKnotBreath{
  0%,100%{filter:drop-shadow(0 22px 34px rgba(92,70,48,.13)) saturate(.98);}
  50%{filter:drop-shadow(0 28px 44px rgba(92,70,48,.19)) saturate(1.03);}
}
@keyframes qqKnotAura{
  0%{opacity:0;transform:scale(.92);filter:blur(8px);}
  14%{opacity:.85;}
  58%{opacity:.36;transform:scale(1.12);filter:blur(14px);}
  100%{opacity:0;transform:scale(1.25);filter:blur(22px);}
}
@keyframes qqKnotEcho{
  0%{opacity:0;transform:scale(.99);filter:blur(0) sepia(.18) saturate(1.12) brightness(1.05);}
  12%{opacity:.42;}
  52%{opacity:.24;transform:scale(1.075);filter:blur(6px) sepia(.22) saturate(1.20) brightness(1.08);}
  100%{opacity:0;transform:scale(1.16);filter:blur(15px) sepia(.22) saturate(1.22) brightness(1.08);}
}
@media (min-width: 901px){
  .archive-float-switcher{
    left:calc(50% + 505px);
    right:auto;
    top:82px;
    bottom:auto;
    width:250px;
    height:500px;
    justify-content:center;
    align-items:flex-start;
    transform:translateY(-24px) scale(.98);
    z-index:90;
  }
  .archive-float-switcher.is-visible{
    transform:translateY(0) scale(1);
    animation:qqKnotReveal .38s cubic-bezier(.22,.61,.36,1) 1;
  }
  .archive-float-toggle{
    position:relative;
    width:250px;
    height:500px;
    min-width:0;
    max-width:none;
    padding:0;
    display:block;
    background:transparent url('../images/ui/qiuqing-knot-switcher.png') center / contain no-repeat;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    color:#4d4439;
    text-align:center;
    cursor:pointer;
    animation:qqKnotBreath 4.8s ease-in-out infinite;
    transform-origin:center top;
    transition:transform .28s ease, filter .28s ease;
  }
  .archive-float-toggle:hover,
  .archive-float-toggle:focus-visible{
    background:transparent url('../images/ui/qiuqing-knot-switcher.png') center / contain no-repeat;
    transform:translateY(-4px);
    box-shadow:none;
    outline:none;
  }
  .archive-float-switcher.is-open .archive-float-toggle{transform:translateY(-2px) rotateY(-5deg);}
  .archive-float-toggle{overflow:visible;isolation:isolate;}
  .archive-float-toggle::before,
  .archive-float-toggle::after{
    content:"";
    position:absolute;
    pointer-events:none;
    opacity:0;
    transform-origin:center center;
    will-change:opacity, transform, filter;
  }
  .archive-float-toggle::before{
    inset:18% 15% 16%;
    z-index:-2;
    border-radius:999px;
    background:radial-gradient(ellipse at center,rgba(213,178,118,.24) 0%,rgba(213,178,118,.16) 34%,rgba(213,178,118,0) 72%);
    filter:blur(8px);
    transform:scale(.92);
  }
  .archive-float-toggle::after{
    inset:-10px;
    z-index:-1;
    background:transparent url('../images/ui/qiuqing-knot-switcher.png') center / contain no-repeat;
    transform:scale(.99);
    filter:blur(0) sepia(.18) saturate(1.12) brightness(1.05);
  }
  .archive-float-toggle.is-echoing::before{
    animation:qqKnotAura 1.08s cubic-bezier(.16,.74,.25,1) 1 forwards;
  }
  .archive-float-toggle.is-echoing::after{
    animation:qqKnotEcho 1.08s cubic-bezier(.16,.74,.25,1) 1 forwards;
  }
  .archive-float-toggle small,
  .archive-float-toggle span,
  .archive-float-toggle strong{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0;
    padding:0;
    pointer-events:none;
    z-index:2;
    text-align:center;
    text-shadow:0 1px 0 rgba(255,255,255,.72);
    box-sizing:border-box;
  }
  .archive-float-toggle small,
  .archive-float-toggle span{
    width:64px;
    height:18px;
    font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", var(--serif);
    font-size:12px;
    font-weight:400;
    line-height:1;
    letter-spacing:2.6px;
    color:rgba(181,142,93,.82);
    white-space:nowrap;
  }
  .archive-float-toggle small{top:27.2%;}
  .archive-float-toggle span{top:67.1%;}
  .archive-float-toggle strong{
    top:33%;
    width:64px;
    height:154px;
    font-family:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", var(--serif);
    font-size:23px;
    font-weight:400;
    line-height:1.24;
    letter-spacing:.11em;
    color:rgba(96,83,70,.88);
    white-space:normal;
    overflow:visible;
    writing-mode:vertical-rl;
    text-orientation:upright;
    font-feature-settings:"vert" 1;
  }
  .archive-float-panel{
    position:absolute;
    left:calc(50% + 78px);
    right:auto;
    top:150px;
    bottom:auto;
    width:250px;
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:10px;
    padding:15px;
    border-radius:26px;
    background:rgba(255,251,244,.72);
    border:1px solid rgba(207,190,166,.56);
    box-shadow:0 24px 64px rgba(79,61,45,.15), inset 0 1px 0 rgba(255,255,255,.74);
    backdrop-filter:blur(18px) saturate(1.06);
    -webkit-backdrop-filter:blur(18px) saturate(1.06);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform-origin:left center;
    transform:perspective(900px) rotateY(-12deg) translateX(-10px) scale(.98);
    transition:opacity .28s ease, transform .32s cubic-bezier(.22,.61,.36,1), visibility .28s ease;
  }
  .archive-float-switcher.is-open .archive-float-panel{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:perspective(900px) rotateY(0deg) translateX(0) scale(1);
  }
  .archive-float-panel a{
    min-height:43px;
    padding:10px 12px;
    justify-content:center;
    border-radius:999px;
    font-size:13px;
    letter-spacing:1px;
    background:rgba(255,255,255,.52);
    border:1px solid rgba(210,198,178,.62);
    box-shadow:0 10px 24px rgba(93,72,50,.08), inset 0 1px 0 rgba(255,255,255,.8);
  }
  .archive-float-panel a:hover,
  .archive-float-panel a:focus-visible,
  .archive-float-panel a.current{
    transform:translateY(-2px);
    color:#6b6f52;
    border-color:rgba(116,128,91,.38);
    background:rgba(255,255,255,.80);
    box-shadow:0 16px 36px rgba(91,73,51,.14), inset 0 1px 0 rgba(255,255,255,.9);
  }
}
@media (min-width: 901px) and (max-width: 1360px){
  .archive-float-switcher{width:230px;height:460px;}
  .archive-float-toggle{width:230px;height:460px;}
  .archive-float-toggle small,.archive-float-toggle span{font-size:12px;width:60px;letter-spacing:2.2px;}
  .archive-float-toggle strong{font-size:22px;width:60px;height:144px;}
  .archive-float-panel{left:calc(50% + 72px);width:232px;top:138px;padding:14px;}
}
@media (max-width: 900px){
  .archive-float-toggle span{white-space:nowrap;}
}



/* === Seasonal archive section cleanup: quieter heading and no inner chips === */
#sec1 .subsection-head,
#sec2 .subsection-head,
#sec3 .subsection-head,
#sec4 .subsection-head{
  display:block!important;
  max-width:780px!important;
  margin-bottom:30px!important;
}
#sec1 .subsection-head h2,
#sec2 .subsection-head h2,
#sec3 .subsection-head h2,
#sec4 .subsection-head h2{
  margin-bottom:12px!important;
  letter-spacing:.12em!important;
}
#sec1 .subsection-head p,
#sec2 .subsection-head p,
#sec3 .subsection-head p,
#sec4 .subsection-head p{
  max-width:620px!important;
  margin:0!important;
  text-align:left!important;
  color:#84796d!important;
  font-size:15px!important;
  line-height:1.95!important;
  letter-spacing:.08em!important;
}
#sec1 .filter-chips,
#sec2 .filter-chips,
#sec3 .filter-chips,
#sec4 .filter-chips{
  display:none!important;
}
@media (max-width: 900px){
  #sec1 .subsection-head,
  #sec2 .subsection-head,
  #sec3 .subsection-head,
  #sec4 .subsection-head{
    max-width:100%!important;
    margin-bottom:22px!important;
  }
  #sec1 .subsection-head h2,
  #sec2 .subsection-head h2,
  #sec3 .subsection-head h2,
  #sec4 .subsection-head h2{
    margin-bottom:10px!important;
  }
  #sec1 .subsection-head p,
  #sec2 .subsection-head p,
  #sec3 .subsection-head p,
  #sec4 .subsection-head p{
    font-size:13px!important;
    line-height:1.9!important;
    letter-spacing:.04em!important;
  }
}


/* --- 2026-05-01 article column navigation: book-leaf tabs, no secondary filter tags in intro --- */
.article-column-panel{
  position:relative;
  min-height:100%;
  padding:42px 40px 38px 46px;
  border-radius:24px;
  border:1px solid rgba(226,221,213,.92);
  background:
    linear-gradient(90deg,rgba(185,151,101,.18) 0,rgba(185,151,101,.18) 1px,transparent 1px,transparent 100%),
    radial-gradient(circle at 92% 12%,rgba(185,151,101,.12),transparent 28%),
    linear-gradient(135deg,rgba(255,253,248,.88),rgba(248,244,236,.72));
  box-shadow:0 16px 42px rgba(40,32,24,.055);
  overflow:hidden;
}
.article-column-panel:before{
  content:"";
  position:absolute;
  left:24px;
  top:32px;
  bottom:32px;
  width:1px;
  background:linear-gradient(to bottom,transparent,rgba(185,151,101,.55),rgba(107,119,92,.2),transparent);
}
.article-column-panel:after{
  content:"卷";
  position:absolute;
  right:28px;
  top:22px;
  font-family:var(--serif);
  font-size:76px;
  line-height:1;
  color:rgba(107,119,92,.055);
  pointer-events:none;
}
.article-column-panel h3{
  position:relative;
  z-index:1;
  font-size:34px;
  letter-spacing:3px;
  margin:0 0 8px;
}
.article-column-note{
  position:relative;
  z-index:1;
  margin:0 0 24px;
  color:var(--muted);
  font-size:14px;
  line-height:1.9;
}
.article-column-nav{
  position:relative;
  z-index:1;
  display:grid;
  gap:12px;
}
.article-column-item{
  position:relative;
  display:grid;
  grid-template-columns:48px 1fr;
  grid-template-areas:"vol title" "vol desc";
  align-items:center;
  min-height:64px;
  padding:12px 16px 12px 14px;
  border:1px solid rgba(226,221,213,.82);
  border-radius:14px 18px 18px 14px;
  background:rgba(255,255,255,.56);
  box-shadow:0 8px 22px rgba(40,32,24,.035);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s,background .32s,box-shadow .32s;
}
.article-column-item:before{
  content:"";
  position:absolute;
  left:-1px;
  top:12px;
  bottom:12px;
  width:3px;
  border-radius:999px;
  background:rgba(185,151,101,.34);
}
.article-column-item span{
  grid-area:vol;
  color:rgba(107,119,92,.72);
  font-size:12px;
  letter-spacing:2px;
}
.article-column-item strong{
  grid-area:title;
  font-family:var(--serif);
  font-weight:500;
  color:var(--ink);
  font-size:22px;
  letter-spacing:2px;
  line-height:1.28;
}
.article-column-item small{
  grid-area:desc;
  color:var(--muted);
  font-size:12px;
  letter-spacing:.5px;
  line-height:1.45;
}
.article-column-item:hover{
  transform:translateX(4px);
  border-color:rgba(185,151,101,.48);
  background:rgba(255,253,248,.9);
  box-shadow:0 14px 30px rgba(40,32,24,.065);
}
.article-column-item.is-current{
  border-color:rgba(107,119,92,.36);
  background:linear-gradient(135deg,rgba(107,119,92,.12),rgba(255,253,248,.84));
}
.article-column-item.is-current:before{
  background:var(--green);
}
.article-column-item.is-current span{
  color:var(--gold);
}
.article-column-item.is-current strong{
  color:var(--green2);
}
.article-column-panel-zhengben,
.article-column-panel-seasonal,
.article-column-panel-craft,
.article-column-panel-tea,
.article-column-panel-inheritance{--column-current:rgba(51,59,46,.115);--column-line:#333B2E;}
.article-column-panel .article-column-item.is-current{
  background:linear-gradient(135deg,var(--column-current,rgba(107,119,92,.12)),rgba(255,253,248,.86));
}
.article-column-panel .article-column-item.is-current:before{
  background:var(--column-line,var(--green));
}
.article-column-panel .article-column-item.is-current strong{color:#333B2E;}
.article-column-panel .article-column-item.is-current span{color:#9D7F4C;}
.article-path-card{
  margin:0 0 18px;
  padding:15px 16px;
  border-radius:16px;
  border:1px solid rgba(226,221,213,.86);
  background:linear-gradient(135deg,rgba(255,253,248,.78),rgba(248,244,236,.62));
}
.article-path-card span{
  display:block;
  color:var(--gold);
  font-size:11px;
  letter-spacing:2px;
  margin-bottom:4px;
}
.article-path-card strong{
  display:block;
  font-family:var(--serif);
  font-size:23px;
  font-weight:500;
  letter-spacing:2px;
  color:var(--green2);
  line-height:1.35;
}
.article-path-card small{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:3px;
}
@media(max-width:900px){
  .article-column-panel{
    width:100%!important;
    max-width:100%!important;
    min-height:auto;
    padding:24px 20px 22px 24px;
    border-radius:20px;
  }
  .article-column-panel:before{left:14px;top:24px;bottom:24px;}
  .article-column-panel:after{font-size:58px;right:18px;top:18px;}
  .article-column-panel h3{font-size:28px;}
  .article-column-note{font-size:13px;margin-bottom:16px;}
  .article-column-nav{gap:10px;}
  .article-column-item{
    min-height:58px;
    grid-template-columns:44px 1fr;
    padding:10px 13px;
  }
  .article-column-item:hover{transform:none;}
  .article-column-item strong{font-size:20px;}
  .article-column-item small{font-size:11px;}
  .article-path-card{margin-bottom:14px;padding:13px 14px;}
}


/* --- article index visual card preview: zhengben --- */
.article-category-preview-grid .article-category-card{
  min-height:360px;
}
.article-category-preview-grid .article-category-card:nth-child(5){
  grid-column:1 / -1;
  background:rgba(255,255,255,.68);
  color:var(--ink);
}
.article-category-preview-grid .article-category-card:nth-child(5) p,
.article-category-preview-grid .article-category-card:nth-child(5) em{
  color:var(--muted);
}
.article-category-preview-grid .article-category-card:nth-child(5) .article-cat-index{
  color:rgba(107,119,92,.12);
}
.article-visual-card{
  display:block;
  position:relative;
  min-height:0!important;
  aspect-ratio:8 / 5;
  padding:0!important;
  border-radius:24px;
  overflow:hidden;
  background:#1f281f;
  text-decoration:none;
  box-shadow:0 18px 50px rgba(40,32,24,.075);
}
.article-visual-card picture,
.article-visual-card img{
  display:block;
  width:100%;
  height:100%;
}
.article-visual-card img{
  object-fit:cover;
  object-position:center center;
  transform:scale(1.01);
  transition:transform .75s cubic-bezier(.2,.8,.2,1), filter .65s ease;
}
.article-visual-dim{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(24,31,25,0) 18%,rgba(24,31,25,.18) 100%);
  transition:background .45s ease;
}
.article-visual-hover{
  position:absolute;
  left:34px;
  right:34px;
  bottom:28px;
  z-index:2;
  color:#f8f0df;
  opacity:0;
  transform:translateY(12px);
  transition:opacity .42s ease, transform .42s cubic-bezier(.2,.8,.2,1);
  pointer-events:none;
}
.article-visual-hover .section-label{
  color:rgba(234,216,170,.82);
}
.article-visual-hover p{
  max-width:520px;
  margin:10px 0 16px;
  color:rgba(248,240,223,.86);
  font-size:15px;
  line-height:1.9;
  text-align:left;
}
.article-enter{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  font-size:14px;
  font-weight:600;
  letter-spacing:1px;
  color:#ead8aa;
}
.article-visual-card:hover img,
.article-visual-card:focus-visible img{
  transform:scale(1.045);
  filter:saturate(.9) brightness(.72);
}
.article-visual-card:hover .article-visual-dim,
.article-visual-card:focus-visible .article-visual-dim{
  background:linear-gradient(135deg,rgba(21,29,23,.66),rgba(40,45,33,.46));
}
.article-visual-card:hover .article-visual-hover,
.article-visual-card:focus-visible .article-visual-hover{
  opacity:1;
  transform:translateY(0);
}
.article-text-card{
  display:flex;
  flex-direction:column;
}
.article-text-card p{
  max-width:660px;
}
.article-text-card .text-enter{
  margin-top:auto;
  padding-top:28px;
  color:var(--green);
}
.article-text-card .tag-cloud,
.article-category-preview-grid .article-card-footer{
  display:none!important;
}
@media(max-width:900px){
  .article-category-preview-grid .article-category-card,
  .article-category-preview-grid .article-category-card:nth-child(5){
    min-height:auto!important;
    grid-column:auto;
  }
  .article-visual-card{
    aspect-ratio:3 / 4;
    border-radius:22px;
  }
  .article-visual-hover{
    left:24px;
    right:24px;
    bottom:22px;
    opacity:1;
    transform:none;
  }
  .article-visual-dim{
    background:linear-gradient(180deg,rgba(24,31,25,0) 42%,rgba(24,31,25,.58) 100%);
  }
  .article-visual-hover p{
    font-size:14px;
    line-height:1.75;
    margin-bottom:10px;
  }
  .article-text-card .text-enter{
    padding-top:20px;
  }
}


/* === 2026-05-01 Article column visual card: match homepage works hover rhythm === */
.article-visual-card{
  box-shadow:0 18px 50px rgba(40,32,24,.075),0 0 0 0 rgba(107,119,92,.10)!important;
  animation:qiuqingArticleColumnBreath 4.8s ease-in-out infinite;
}
.article-visual-card:hover,
.article-visual-card:focus-visible{
  animation-play-state:paused;
  transform:translateY(-8px)!important;
  box-shadow:0 28px 68px rgba(40,32,24,.16)!important;
  border-color:rgba(234,216,170,.34)!important;
}
.article-visual-card img{
  transform:scale(1.01)!important;
  filter:none!important;
  transition:transform .9s cubic-bezier(.2,.8,.2,1), filter .65s ease!important;
}
.article-visual-card:hover img,
.article-visual-card:focus-visible img{
  transform:scale(1.075)!important;
  filter:saturate(.96) contrast(.98)!important;
}
.article-visual-dim{
  background:linear-gradient(to top,rgba(30,31,24,.18) 0%,rgba(30,31,24,.06) 28%,rgba(30,31,24,0) 62%)!important;
  opacity:1!important;
  transition:opacity .45s ease, background .45s ease!important;
}
.article-visual-card:hover .article-visual-dim,
.article-visual-card:focus-visible .article-visual-dim{
  background:linear-gradient(to top,rgba(30,31,24,.82) 0%,rgba(30,31,24,.50) 30%,rgba(30,31,24,.14) 54%,rgba(30,31,24,0) 72%)!important;
}
.article-visual-hover{
  left:0!important;
  right:0!important;
  bottom:0!important;
  padding:0 34px 30px!important;
  min-height:42%;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  opacity:0!important;
  transform:translateY(24px)!important;
  transition:opacity .45s ease, transform .52s cubic-bezier(.19,1,.22,1)!important;
}
.article-visual-card:hover .article-visual-hover,
.article-visual-card:focus-visible .article-visual-hover{
  opacity:1!important;
  transform:translateY(0)!important;
}
.article-visual-hover .section-label{
  font-size:11px!important;
  letter-spacing:3px!important;
  color:rgba(234,216,170,.78)!important;
}
.article-visual-hover p{
  max-width:520px!important;
  margin:8px 0 12px!important;
  color:rgba(248,240,223,.88)!important;
  font-size:14px!important;
  line-height:1.85!important;
}
.article-visual-hover .article-enter{
  color:#ead8aa!important;
  transform:translateY(12px);
  transition:transform .45s cubic-bezier(.19,1,.22,1) .04s;
}
.article-visual-card:hover .article-enter,
.article-visual-card:focus-visible .article-enter{
  transform:translateY(0);
}
@keyframes qiuqingArticleColumnBreath{
  0%,100%{box-shadow:0 18px 50px rgba(40,32,24,.075),0 0 0 0 rgba(107,119,92,.08)}
  50%{box-shadow:0 22px 58px rgba(40,32,24,.095),0 0 0 8px rgba(107,119,92,0)}
}
@media(max-width:900px){
  .article-visual-card{
    animation:none!important;
  }
  .article-visual-card:hover,
  .article-visual-card:focus-visible{
    transform:none!important;
  }
  .article-visual-hover{
    left:0!important;
    right:0!important;
    bottom:0!important;
    padding:0 24px 22px!important;
    min-height:36%;
    opacity:1!important;
    transform:none!important;
  }
  .article-visual-dim,
  .article-visual-card:hover .article-visual-dim,
  .article-visual-card:focus-visible .article-visual-dim{
    background:linear-gradient(to top,rgba(30,31,24,.70) 0%,rgba(30,31,24,.34) 32%,rgba(30,31,24,.08) 56%,rgba(30,31,24,0) 74%)!important;
  }
  .article-visual-card:hover img,
  .article-visual-card:focus-visible img{
    transform:scale(1.01)!important;
    filter:none!important;
  }
}


/* === 2026-05-01 Article index hero: deep tea green unification === */
.article-index-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 16% 24%,rgba(234,216,170,.075),transparent 28%),
    radial-gradient(circle at 82% 18%,rgba(174,190,152,.060),transparent 30%),
    radial-gradient(circle at 72% 72%,rgba(185,151,101,.055),transparent 32%),
    linear-gradient(135deg,#1f2a22 0%,#2f3b2d 56%,#4b5743 100%)!important;
}
.article-index-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:42px 42px,42px 42px;
  opacity:.34;
  mix-blend-mode:screen;
}
.article-index-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:120px;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(31,42,34,0),rgba(244,239,232,.10));
}
.article-index-hero .kicker{
  color:rgba(234,216,170,.78)!important;
}
.article-index-hero .kicker::before{
  background:rgba(234,216,170,.62)!important;
}
.article-index-hero h1{
  color:#f8f0df!important;
  text-shadow:0 14px 34px rgba(0,0,0,.20);
}
.article-index-hero p{
  color:rgba(248,240,223,.82)!important;
}
@media(max-width:900px){
  .article-index-hero{
    min-height:48vh;
    padding:104px 0 58px;
  }
  .article-index-hero h1{
    color:#f8f0df!important;
  }
  .article-index-hero p{
    color:rgba(248,240,223,.82)!important;
  }
}


/* === 2026-05-01 Article secondary filter: plum branch tags === */
.article-secondary-filter{
  background:#f4efe8;
  padding:18px 0 34px;
}
.plum-filter-shell{
  position:relative;
  min-height:230px;
  border:1px solid rgba(226,221,213,.86);
  border-radius:28px;
  overflow:hidden;
  padding:34px 42px;
  background:
    radial-gradient(circle at 78% 24%,rgba(234,216,170,.14),transparent 28%),
    linear-gradient(135deg,rgba(255,255,255,.82),rgba(248,244,236,.58));
  box-shadow:0 18px 54px rgba(40,32,24,.055);
}
.plum-filter-head{
  position:relative;
  z-index:3;
  max-width:390px;
}
.plum-filter-head h2{
  font-size:34px;
  letter-spacing:3px;
  margin:12px 0 12px;
}
.plum-filter-head p{
  color:var(--muted);
  font-size:14px;
  line-height:1.9;
  text-align:justify;
}
.plum-branch-filter{
  position:absolute;
  inset:0;
  z-index:2;
}
.plum-branch-img{
  position:absolute;
  height:520px;
  width:auto;
  right:26%;
  top:-172px;
  opacity:.58;
  transform:rotate(-5deg);
  pointer-events:none;
  filter:drop-shadow(0 18px 22px rgba(40,32,24,.10));
  animation:qiuqingPlumBranchIn 1.1s cubic-bezier(.19,1,.22,1) both;
}
.plum-tag{
  position:absolute;
  z-index:4;
  display:inline-flex;
  align-items:center;
  gap:10px;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  color:var(--green);
  font-family:inherit;
  transform:translateY(10px);
  opacity:0;
  animation:qiuqingPlumTagIn .68s cubic-bezier(.19,1,.22,1) forwards;
}
.plum-tag-1{left:45%;top:32%;animation-delay:.12s;}
.plum-tag-2{left:59%;top:17%;animation-delay:.22s;}
.plum-tag-3{left:64%;top:56%;animation-delay:.32s;}
.plum-tag-4{left:79%;top:36%;animation-delay:.42s;}
.plum-flower{
  position:relative;
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 13%,rgba(246,221,218,.96) 0 20%,transparent 21%),
    radial-gradient(circle at 83% 38%,rgba(244,211,208,.94) 0 21%,transparent 22%),
    radial-gradient(circle at 71% 80%,rgba(246,226,221,.96) 0 21%,transparent 22%),
    radial-gradient(circle at 29% 80%,rgba(246,226,221,.96) 0 21%,transparent 22%),
    radial-gradient(circle at 17% 38%,rgba(244,211,208,.94) 0 21%,transparent 22%),
    radial-gradient(circle at 50% 50%,#c99a67 0 8%,#efe1bd 9% 12%,transparent 13%);
  filter:drop-shadow(0 7px 12px rgba(64,38,24,.16));
  transition:transform .38s cubic-bezier(.19,1,.22,1),filter .38s ease;
}
.plum-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(156,126,76,.24);
  background:rgba(255,255,255,.68);
  color:rgba(51,59,46,.88);
  font-size:13px;
  letter-spacing:.08em;
  box-shadow:0 10px 22px rgba(40,32,24,.055);
  transition:background .32s ease,border-color .32s ease,color .32s ease,transform .32s cubic-bezier(.19,1,.22,1);
}
.plum-tag:hover .plum-flower,
.plum-tag:focus-visible .plum-flower,
.plum-tag.is-active .plum-flower{
  transform:scale(1.10) rotate(-2deg);
  filter:drop-shadow(0 10px 16px rgba(157,127,76,.22)) drop-shadow(0 0 12px rgba(234,216,170,.20));
}
.plum-tag:hover .plum-label,
.plum-tag:focus-visible .plum-label,
.plum-tag.is-active .plum-label{
  background:rgba(51,59,46,.92);
  border-color:rgba(234,216,170,.42);
  color:#f8f0df;
  transform:translateY(-1px);
}
.plum-tag:focus-visible{
  outline:0;
}
.plum-tag:focus-visible .plum-label{
  box-shadow:0 0 0 3px rgba(234,216,170,.28);
}
.plum-mobile-filter{
  display:none;
}
@keyframes qiuqingPlumBranchIn{
  0%{opacity:0;transform:translateY(-24px) rotate(-5deg);}
  100%{opacity:.58;transform:translateY(0) rotate(-5deg);}
}
@keyframes qiuqingPlumTagIn{
  0%{opacity:0;transform:translateY(12px) scale(.96);}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
@media(max-width:900px){
  .article-secondary-filter{
    padding:14px 0 22px;
  }
  .plum-filter-shell{
    min-height:auto;
    padding:22px 18px 18px;
    border-radius:22px;
    overflow:hidden;
  }
  .plum-filter-head h2{
    font-size:28px;
    margin:10px 0 8px;
  }
  .plum-filter-head p{
    display:none;
  }
  .plum-branch-filter{
    display:none;
  }
  .plum-mobile-filter{
    display:flex;
    gap:10px;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding:2px 2px 6px;
    margin-top:16px;
  }
  .plum-mobile-filter button{
    flex:0 0 auto;
    min-height:38px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid rgba(156,126,76,.24);
    background:rgba(255,255,255,.72);
    color:rgba(51,59,46,.86);
    font-size:13px;
    letter-spacing:.06em;
  }
  .plum-mobile-filter button.is-active{
    background:#333B2E;
    color:#f8f0df;
    border-color:rgba(234,216,170,.36);
  }
}

/* === 2026-05-01 plum secondary filter visibility fix === */
.article-secondary-filter.plum-filter-section{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:2!important;
  background:#f4efe8!important;
  padding:34px 0 40px!important;
}
.plum-filter-shell{
  display:block!important;
  opacity:1!important;
  transform:none!important;
  visibility:visible!important;
}
.plum-branch-filter{
  display:block!important;
}
.plum-branch-img{
  display:block!important;
  opacity:.66!important;
  visibility:visible!important;
}
.plum-tag{
  visibility:visible!important;
}
.plum-tag .plum-label{
  white-space:nowrap;
}
@media(max-width:900px){
  .article-secondary-filter.plum-filter-section{
    padding:18px 0 22px!important;
  }
  .plum-branch-filter{
    display:none!important;
  }
  .plum-mobile-filter{
    display:flex!important;
  }
}

/* === 2026-05-01 Article floating plum secondary filter: works-knot behavior === */
.article-plum-float{
  position:fixed;
  left:calc(50% + 505px);
  top:82px;
  width:318px;
  height:520px;
  z-index:92;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-22px) scale(.98);
  transition:opacity .38s ease, transform .42s cubic-bezier(.22,.61,.36,1), visibility .38s ease;
}
.article-plum-float.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
.article-plum-float-shell{
  position:relative;
  width:100%;
  height:100%;
  overflow:visible;
  isolation:isolate;
}
.article-plum-float-branch{
  position:absolute;
  right:70px;
  top:-68px;
  height:580px;
  width:auto;
  opacity:.78;
  pointer-events:none;
  filter:drop-shadow(0 18px 22px rgba(43,35,27,.13));
  transform:rotate(-2deg);
  transform-origin:top center;
  animation:qiuqingArticlePlumBranchBreath 5.2s ease-in-out infinite;
}
.article-plum-floating-tags{
  position:absolute;
  inset:0;
  z-index:2;
}
.article-plum-tag{
  position:absolute;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:9px;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  color:var(--green);
  font-family:inherit;
  opacity:0;
  transform:translateY(10px) scale(.98);
  animation:qiuqingArticlePlumTagIn .62s cubic-bezier(.19,1,.22,1) forwards;
}
.article-plum-tag-1{left:0;top:96px;animation-delay:.10s;}
.article-plum-tag-2{left:112px;top:58px;animation-delay:.18s;}
.article-plum-tag-3{left:42px;top:228px;animation-delay:.26s;}
.article-plum-tag-4{left:132px;top:322px;animation-delay:.34s;}
.article-plum-flower{
  position:relative;
  flex:0 0 auto;
  width:38px;
  height:38px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 13%,rgba(247,222,219,.96) 0 20%,transparent 21%),
    radial-gradient(circle at 83% 38%,rgba(246,214,211,.94) 0 21%,transparent 22%),
    radial-gradient(circle at 71% 80%,rgba(248,229,224,.96) 0 21%,transparent 22%),
    radial-gradient(circle at 29% 80%,rgba(248,229,224,.96) 0 21%,transparent 22%),
    radial-gradient(circle at 17% 38%,rgba(246,214,211,.94) 0 21%,transparent 22%),
    radial-gradient(circle at 50% 50%,#c99a67 0 8%,#efe1bd 9% 12%,transparent 13%);
  filter:drop-shadow(0 7px 12px rgba(64,38,24,.15));
  transition:transform .38s cubic-bezier(.19,1,.22,1),filter .38s ease;
}
.article-plum-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(156,126,76,.24);
  background:rgba(255,255,255,.70);
  color:rgba(51,59,46,.90);
  font-size:13px;
  letter-spacing:.08em;
  white-space:nowrap;
  box-shadow:0 10px 24px rgba(40,32,24,.065),inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter:blur(12px) saturate(1.08);
  -webkit-backdrop-filter:blur(12px) saturate(1.08);
  transition:background .32s ease,border-color .32s ease,color .32s ease,transform .32s cubic-bezier(.19,1,.22,1),box-shadow .32s ease;
}
.article-plum-tag:hover .article-plum-flower,
.article-plum-tag:focus-visible .article-plum-flower,
.article-plum-tag.is-active .article-plum-flower{
  transform:scale(1.10) rotate(-2deg);
  filter:drop-shadow(0 10px 16px rgba(157,127,76,.22)) drop-shadow(0 0 12px rgba(234,216,170,.20));
}
.article-plum-tag:hover .article-plum-label,
.article-plum-tag:focus-visible .article-plum-label,
.article-plum-tag.is-active .article-plum-label{
  background:rgba(51,59,46,.94);
  border-color:rgba(234,216,170,.42);
  color:#f8f0df;
  transform:translateY(-1px);
  box-shadow:0 15px 32px rgba(40,32,24,.12),inset 0 1px 0 rgba(255,255,255,.18);
}
.article-plum-tag:focus-visible{outline:0;}
.article-plum-tag:focus-visible .article-plum-label{box-shadow:0 0 0 3px rgba(234,216,170,.28),0 15px 32px rgba(40,32,24,.12);}
.article-plum-mobile-toggle,
.article-plum-mobile-panel{display:none;}
@keyframes qiuqingArticlePlumBranchBreath{
  0%,100%{filter:drop-shadow(0 18px 22px rgba(43,35,27,.13));transform:rotate(-2deg) translateY(0);}
  50%{filter:drop-shadow(0 24px 30px rgba(43,35,27,.18));transform:rotate(-2deg) translateY(4px);}
}
@keyframes qiuqingArticlePlumTagIn{
  0%{opacity:0;transform:translateY(14px) scale(.96);}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
@media (min-width:901px) and (max-width:1360px){
  .article-plum-float{width:292px;height:492px;}
  .article-plum-float-branch{right:62px;height:540px;top:-60px;}
  .article-plum-tag-1{left:0;top:92px;}
  .article-plum-tag-2{left:100px;top:58px;}
  .article-plum-tag-3{left:34px;top:214px;}
  .article-plum-tag-4{left:116px;top:304px;}
  .article-plum-label{font-size:12px;padding:0 12px;}
  .article-plum-flower{width:34px;height:34px;}
}
@media(max-width:900px){
  .article-plum-float{
    left:14px;
    right:auto;
    top:auto!important;
    bottom:82px;
    width:auto;
    height:auto;
    z-index:980;
    transform:translateY(14px) scale(.98);
  }
  .article-plum-float.is-visible{transform:translateY(0) scale(1);}
  .article-plum-float-shell{width:auto;height:auto;}
  .article-plum-float-branch,
  .article-plum-floating-tags{display:none!important;}
  .article-plum-mobile-toggle{
    display:grid;
    grid-template-columns:auto auto auto;
    align-items:center;
    gap:8px;
    min-height:44px;
    padding:10px 13px;
    border:1px solid rgba(255,255,255,.52);
    border-radius:999px;
    background:linear-gradient(135deg,rgba(255,255,255,.76),rgba(248,243,235,.48));
    box-shadow:0 18px 44px rgba(59,48,38,.13), inset 0 1px 0 rgba(255,255,255,.72);
    backdrop-filter:blur(16px) saturate(1.08);
    -webkit-backdrop-filter:blur(16px) saturate(1.08);
    color:#5f5143;
    font-family:inherit;
  }
  .article-plum-mobile-toggle small{font-size:11px;letter-spacing:1.8px;color:#9a8a76;text-transform:uppercase;white-space:nowrap;}
  .article-plum-mobile-toggle strong{font-family:var(--serif);font-size:14px;letter-spacing:1px;color:#4c4237;white-space:nowrap;font-weight:500;}
  .article-plum-mobile-toggle span{font-size:12px;letter-spacing:1px;color:#8a6d55;white-space:nowrap;}
  .article-plum-mobile-panel{
    position:absolute;
    left:0;
    bottom:56px;
    display:flex;
    gap:10px;
    width:calc(100vw - 28px);
    overflow-x:auto;
    overflow-y:hidden;
    padding:2px 2px 8px;
    scrollbar-width:none;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(12px) scale(.98);
    transition:opacity .26s ease, transform .32s cubic-bezier(.22,.61,.36,1), visibility .26s ease;
  }
  .article-plum-mobile-panel::-webkit-scrollbar{display:none;}
  .article-plum-float.is-open .article-plum-mobile-panel{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  .article-plum-mobile-panel button{
    flex:0 0 auto;
    min-height:38px;
    padding:9px 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.50);
    background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.88),rgba(255,255,255,.48) 44%,rgba(240,232,219,.34) 100%);
    box-shadow:0 12px 30px rgba(57,49,38,.10), inset 0 1px 0 rgba(255,255,255,.78);
    color:#6f604f;
    font-size:12px;
    letter-spacing:1px;
    white-space:nowrap;
  }
  .article-plum-mobile-panel button.is-active{
    background:#333B2E;
    color:#f8f0df;
    border-color:rgba(234,216,170,.36);
  }
}
@media(max-width:420px){
  .article-plum-mobile-toggle small{display:none;}
  .article-plum-mobile-toggle strong{font-size:14px;}
  .article-plum-mobile-toggle span{font-size:11px;}
}

/* === 2026-05-01 Article floating plum secondary filter: visual refinement === */
@media (min-width:901px){
  .article-plum-float{
    top:124px!important;
    width:286px!important;
    height:432px!important;
    transform:translateY(-14px) scale(.985)!important;
  }
  .article-plum-float.is-visible{
    transform:translateY(0) scale(1)!important;
  }
  .article-plum-float-branch{
    right:66px!important;
    top:-24px!important;
    height:462px!important;
    opacity:.62!important;
    filter:drop-shadow(0 14px 20px rgba(43,35,27,.10))!important;
  }
  .article-plum-tag{
    gap:7px!important;
  }
  .article-plum-tag-1{left:2px!important;top:104px!important;}
  .article-plum-tag-2{left:88px!important;top:58px!important;}
  .article-plum-tag-3{left:35px!important;top:202px!important;}
  .article-plum-tag-4{left:104px!important;top:268px!important;}
  .article-plum-flower{
    width:32px!important;
    height:32px!important;
    opacity:.82!important;
    filter:drop-shadow(0 5px 10px rgba(64,38,24,.12))!important;
  }
  .article-plum-label{
    position:relative!important;
    min-height:30px!important;
    padding:0 12px!important;
    border-radius:15px!important;
    border-color:rgba(156,126,76,.18)!important;
    background:rgba(255,252,244,.58)!important;
    color:rgba(57,64,50,.80)!important;
    font-size:12px!important;
    letter-spacing:.10em!important;
    box-shadow:0 8px 20px rgba(40,32,24,.050),inset 0 1px 0 rgba(255,255,255,.70)!important;
  }
  .article-plum-label::before{
    content:"";
    position:absolute;
    left:-10px;
    top:50%;
    width:10px;
    height:1px;
    background:linear-gradient(90deg,rgba(185,151,101,0),rgba(185,151,101,.38));
    transform:translateY(-50%);
  }
  .article-plum-tag:hover .article-plum-flower,
  .article-plum-tag:focus-visible .article-plum-flower{
    opacity:.96!important;
    transform:scale(1.08) rotate(-2deg)!important;
    filter:drop-shadow(0 8px 14px rgba(157,127,76,.18)) drop-shadow(0 0 8px rgba(234,216,170,.12))!important;
  }
  .article-plum-tag.is-active .article-plum-flower{
    opacity:1!important;
    transform:scale(1.10) rotate(-2deg)!important;
    filter:drop-shadow(0 8px 14px rgba(157,127,76,.20)) drop-shadow(0 0 12px rgba(234,216,170,.18))!important;
  }
  .article-plum-tag:hover .article-plum-label,
  .article-plum-tag:focus-visible .article-plum-label{
    background:rgba(255,252,244,.78)!important;
    color:#4b5743!important;
    border-color:rgba(185,151,101,.30)!important;
    transform:translateY(-1px)!important;
    box-shadow:0 12px 25px rgba(40,32,24,.075),inset 0 1px 0 rgba(255,255,255,.76)!important;
  }
  .article-plum-tag.is-active .article-plum-label{
    background:rgba(75,87,67,.92)!important;
    border-color:rgba(234,216,170,.32)!important;
    color:#f8f0df!important;
    transform:translateY(-1px)!important;
    box-shadow:0 12px 28px rgba(40,32,24,.105),inset 0 1px 0 rgba(255,255,255,.16)!important;
  }
  @keyframes qiuqingArticlePlumBranchBreath{
    0%,100%{filter:drop-shadow(0 14px 20px rgba(43,35,27,.10));transform:rotate(-2deg) translateY(0);}
    50%{filter:drop-shadow(0 18px 26px rgba(43,35,27,.14));transform:rotate(-2deg) translateY(3px);}
  }
}
@media (min-width:901px) and (max-width:1360px){
  .article-plum-float{top:120px!important;width:262px!important;height:404px!important;}
  .article-plum-float-branch{right:58px!important;top:-22px!important;height:430px!important;}
  .article-plum-tag-1{left:0!important;top:100px!important;}
  .article-plum-tag-2{left:76px!important;top:58px!important;}
  .article-plum-tag-3{left:26px!important;top:190px!important;}
  .article-plum-tag-4{left:84px!important;top:252px!important;}
  .article-plum-label{font-size:11px!important;padding:0 10px!important;min-height:28px!important;}
  .article-plum-flower{width:28px!important;height:28px!important;}
}

/* === 2026-05-01 Article floating plum secondary filter: final micro-tune === */
@media (min-width:901px){
  .article-plum-float{
    left:calc(50% + 524px)!important;
    top:126px!important;
    width:278px!important;
    height:424px!important;
  }
  .article-plum-float-branch{
    right:60px!important;
    top:-18px!important;
    height:448px!important;
    opacity:.56!important;
    filter:drop-shadow(0 12px 18px rgba(43,35,27,.08))!important;
  }
  .article-plum-floating-tags{
    transform:translateX(4px);
  }
  .article-plum-tag{gap:5px!important;}
  .article-plum-tag-1{left:8px!important;top:102px!important;}
  .article-plum-tag-2{left:78px!important;top:60px!important;}
  .article-plum-tag-3{left:33px!important;top:196px!important;}
  .article-plum-tag-4{left:92px!important;top:258px!important;}
  .article-plum-flower{
    width:31px!important;
    height:31px!important;
    opacity:.72!important;
    filter:drop-shadow(0 4px 8px rgba(64,38,24,.09))!important;
  }
  .article-plum-label{
    min-height:31px!important;
    padding:0 13px!important;
    border-radius:14px!important;
    border-color:rgba(136,109,66,.26)!important;
    background:rgba(255,253,247,.76)!important;
    color:rgba(53,60,47,.88)!important;
    font-size:13px!important;
    letter-spacing:.085em!important;
    box-shadow:0 9px 22px rgba(40,32,24,.06), inset 0 1px 0 rgba(255,255,255,.80)!important;
  }
  .article-plum-label::before{
    left:-7px!important;
    width:7px!important;
    background:linear-gradient(90deg,rgba(185,151,101,0),rgba(185,151,101,.48))!important;
  }
  .article-plum-tag:hover .article-plum-flower,
  .article-plum-tag:focus-visible .article-plum-flower{
    opacity:.94!important;
    transform:scale(1.07) rotate(-2deg)!important;
    filter:drop-shadow(0 7px 12px rgba(157,127,76,.16)) drop-shadow(0 0 8px rgba(234,216,170,.13))!important;
  }
  .article-plum-tag.is-active .article-plum-flower{
    opacity:1!important;
    transform:scale(1.10) rotate(-2deg)!important;
    filter:drop-shadow(0 8px 14px rgba(157,127,76,.20)) drop-shadow(0 0 12px rgba(234,216,170,.20))!important;
  }
  .article-plum-tag:hover .article-plum-label,
  .article-plum-tag:focus-visible .article-plum-label{
    background:rgba(255,253,247,.90)!important;
    border-color:rgba(168,132,76,.35)!important;
    color:#4b5743!important;
  }
  .article-plum-tag.is-active .article-plum-label{
    background:rgba(83,96,76,.90)!important;
    border-color:rgba(234,216,170,.34)!important;
    color:#f8f0df!important;
    box-shadow:0 11px 24px rgba(40,32,24,.10), inset 0 1px 0 rgba(255,255,255,.14)!important;
  }
  .article-plum-tag.is-active .article-plum-label::before{
    background:linear-gradient(90deg,rgba(234,216,170,0),rgba(234,216,170,.62))!important;
  }
}
@media (min-width:901px) and (max-width:1360px){
  .article-plum-float{left:calc(50% + 430px)!important;top:122px!important;width:256px!important;height:394px!important;}
  .article-plum-float-branch{right:54px!important;top:-18px!important;height:418px!important;opacity:.54!important;}
  .article-plum-floating-tags{transform:translateX(3px);}
  .article-plum-tag-1{left:6px!important;top:96px!important;}
  .article-plum-tag-2{left:68px!important;top:56px!important;}
  .article-plum-tag-3{left:28px!important;top:184px!important;}
  .article-plum-tag-4{left:78px!important;top:246px!important;}
  .article-plum-label{font-size:12px!important;min-height:29px!important;padding:0 11px!important;}
  .article-plum-flower{width:28px!important;height:28px!important;}
}

/* === 2026-05-01 Article floating plum secondary filter: spacing tune === */
@media (min-width:1501px){
  .article-plum-float{
    left:calc(50% + 634px)!important;
    top:126px!important;
    width:270px!important;
    height:424px!important;
  }
  .article-plum-float-branch{
    right:58px!important;
    opacity:.50!important;
  }
  .article-plum-floating-tags{
    transform:translateX(0)!important;
  }
  .article-plum-tag-1{left:2px!important;top:102px!important;}
  .article-plum-tag-2{left:68px!important;top:58px!important;}
  .article-plum-tag-3{left:22px!important;top:188px!important;}
  .article-plum-tag-4{left:78px!important;top:252px!important;}
  .article-plum-label::before{
    left:-11px!important;
    width:11px!important;
  }
}
@media (min-width:1361px) and (max-width:1500px){
  .article-plum-float{
    left:auto!important;
    right:-18px!important;
    top:126px!important;
    width:258px!important;
    height:416px!important;
  }
  .article-plum-float-branch{
    right:52px!important;
    opacity:.50!important;
  }
  .article-plum-floating-tags{
    transform:translateX(2px)!important;
  }
  .article-plum-tag-1{left:0!important;top:100px!important;}
  .article-plum-tag-2{left:62px!important;top:58px!important;}
  .article-plum-tag-3{left:20px!important;top:184px!important;}
  .article-plum-tag-4{left:74px!important;top:246px!important;}
}
@media (min-width:901px) and (max-width:1360px){
  .article-plum-float{
    left:auto!important;
    right:-12px!important;
  }
  .article-plum-float-branch{
    opacity:.50!important;
  }
  .article-plum-floating-tags{
    transform:translateX(0)!important;
  }
}


/* === 2026-05-01 Article floating plum secondary filter: click petal fall preview === */
@media (min-width:901px){
  .article-plum-tag{
    overflow:visible!important;
  }
  .article-plum-petal{
    position:absolute;
    left:14px;
    top:13px;
    width:8px;
    height:5px;
    border-radius:68% 32% 62% 38% / 58% 42% 60% 40%;
    background:
      radial-gradient(circle at 36% 30%,rgba(255,255,255,.70) 0 18%,transparent 19%),
      linear-gradient(135deg,rgba(249,221,216,.86),rgba(238,188,184,.64));
    box-shadow:0 2px 5px rgba(111,67,52,.08);
    pointer-events:none;
    z-index:8;
    opacity:0;
    transform-origin:45% 45%;
    animation:qiuqingArticlePlumPetalFall .96s cubic-bezier(.18,.62,.28,1) forwards;
    animation-delay:var(--petal-delay,0ms);
    will-change:transform,opacity;
  }
}
@keyframes qiuqingArticlePlumPetalFall{
  0%{opacity:0;transform:translate(0,0) rotate(0deg) scale(.62);}
  16%{opacity:.78;}
  60%{opacity:.64;}
  100%{opacity:0;transform:translate(var(--petal-x,14px),var(--petal-y,30px)) rotate(var(--petal-r,18deg)) scale(.92);}
}
@media(max-width:900px), (prefers-reduced-motion: reduce){
  .article-plum-petal{display:none!important;animation:none!important;}
}