:root{
  --ink:#352b3e;
  --paper:#fcfafc;
  --card:#fff;
  --berry:#8a5a9c;
  --blush:#d6a8c7;
  --blue:#8879aa;
  --muted:#766e7b;
  --line:rgba(67,48,78,.12);
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  color:var(--ink);
  background:var(--paper);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 0,rgba(221,193,224,.28),transparent 28%),radial-gradient(circle at 92% 36%,rgba(245,216,231,.26),transparent 24%),var(--paper)}
a{color:inherit;text-decoration:none}
.shell{width:min(100%,920px);min-height:100vh;margin:auto;padding:24px clamp(18px,5vw,54px) max(30px,env(safe-area-inset-bottom))}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:.04em}
.mark{width:32px;height:32px;display:grid;place-items:center;color:#fff;background:var(--berry);border-radius:50% 50% 50% 12px;transform:rotate(-12deg)}
.mark span{transform:rotate(12deg)}
.brand-text{display:grid;gap:1px;line-height:1.05}.brand-text strong{font:700 .94rem Georgia,serif;letter-spacing:.025em}.brand-text small{color:var(--muted);font-size:.62rem;font-weight:700;letter-spacing:.08em}
.intro{padding:clamp(70px,12vh,126px) 0 clamp(54px,9vh,90px)}
.eyebrow,.section-kicker{margin:0;color:var(--berry);font-size:.76rem;font-weight:800;letter-spacing:.12em}
h1,h2,h3{font-family:"Songti SC","STSong","Noto Serif SC",serif}
h1{max-width:720px;margin:18px 0 20px;font-size:clamp(2.55rem,6.5vw,4.8rem);line-height:1.08;letter-spacing:-.055em}
h1 em{display:block;color:var(--berry);font-style:normal}
.lead{max-width:610px;margin:0;color:#625869;font-size:clamp(1.02rem,2.5vw,1.24rem);line-height:1.82}
.directions{padding-bottom:62px}.direction-head{margin-bottom:18px}.category-list{display:grid;gap:13px}.category{overflow:hidden;border:1px solid rgba(138,90,156,.12);border-radius:24px;background:rgba(255,255,255,.72);box-shadow:0 12px 40px rgba(82,55,96,.045)}.category[open]{background:linear-gradient(145deg,#fff,#faf6fb)}.category summary{display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:15px;align-items:center;padding:24px;cursor:pointer;list-style:none}.category summary::-webkit-details-marker{display:none}.category summary:focus-visible{outline:3px solid var(--blush);outline-offset:-3px}.category-copy{display:grid;justify-items:start}.category-copy strong{margin:10px 0 6px;font-family:"Songti SC","STSong","Noto Serif SC",serif;font-size:1.28rem}.category-copy small{color:#625869;font-size:.84rem;line-height:1.65}.direction-status{display:inline-flex;padding:4px 8px;color:var(--berry);background:rgba(138,90,156,.08);border-radius:99px;font-size:.68rem;font-weight:800}.muted-status{color:var(--muted);background:rgba(118,110,123,.08)}.category-toggle{position:relative;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--berry);box-shadow:0 6px 16px rgba(82,55,96,.18);transition:transform .2s ease}.category-toggle::before{content:"";width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg) translate(-1px,-1px)}.category[open] .category-toggle{transform:rotate(180deg)}.category-content{padding:0 22px 22px}.empty-category{padding:28px;color:var(--muted);background:#f8f4f9;border:1px dashed rgba(138,90,156,.18);border-radius:18px}.empty-category span{font:600 .68rem Georgia,serif;letter-spacing:.11em}.empty-category p{margin:9px 0 0;font-size:.9rem}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.section-head h2{margin:7px 0 0;font-size:clamp(1.48rem,3.3vw,2rem)}
.count{color:rgba(138,90,156,.28);font:italic 2.8rem Georgia,serif}
.test-card{display:grid;grid-template-columns:160px minmax(0,1fr);overflow:hidden;background:var(--card);border:1px solid rgba(138,90,156,.12);border-radius:21px;box-shadow:0 14px 42px rgba(82,55,96,.075);transition:transform .22s ease,box-shadow .22s ease}
.test-card:hover{transform:translateY(-4px);box-shadow:0 30px 78px rgba(82,55,96,.13)}
.test-card:focus-visible{outline:3px solid var(--blush);outline-offset:4px}
.card-art{position:relative;min-height:190px;overflow:hidden;background:linear-gradient(145deg,#f8f2fa,#eee3f1)}
.card-art::after{content:"";position:absolute;inset:12% 15%;border:1px solid rgba(138,90,156,.15);border-radius:50%}
.orbit{position:absolute;border:1px solid rgba(138,90,156,.16);border-radius:50%}
.orbit-one{width:210px;height:210px;right:-90px;top:-65px}
.orbit-two{width:145px;height:145px;left:-66px;bottom:-38px;background:radial-gradient(circle,rgba(214,168,199,.25),rgba(214,168,199,0) 68%)}
.heart{position:absolute;z-index:2;left:50%;top:50%;width:66px;height:66px;display:grid;place-items:center;transform:translate(-50%,-50%) rotate(-10deg);color:#fff;background:var(--berry);border-radius:50% 50% 50% 22px;font:italic 1.7rem Georgia,serif;box-shadow:0 12px 30px rgba(82,55,96,.18)}
.heart::after{content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.35);border-radius:inherit}
.card-copy{display:flex;flex-direction:column;align-items:flex-start;padding:24px 28px}
.tag{display:inline-flex;padding:6px 11px;color:#6f3e83;background:#fff;border:1px solid rgba(111,62,131,.22);border-radius:99px;box-shadow:0 4px 13px rgba(82,55,96,.06);font-size:.76rem;font-weight:850;letter-spacing:.025em}
.card-copy h3{margin:13px 0 10px;font-size:clamp(1.08rem,2.1vw,1.3rem);line-height:1.4;letter-spacing:-.018em}
.card-copy p{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;margin:0;color:#625869;font-size:.9rem;line-height:1.65}
footer{display:flex;justify-content:space-between;gap:20px;padding-top:22px;color:var(--muted);border-top:1px solid var(--line);font-size:.78rem}
footer span:first-child{color:var(--ink);font-weight:800}
@media(max-width:680px){
  .shell{padding:18px 16px max(24px,env(safe-area-inset-bottom))}
  .intro{padding:56px 0 48px}
  h1{margin:14px 0 16px;font-size:clamp(2.15rem,10vw,3rem);line-height:1.1}
  .lead{font-size:.94rem;line-height:1.7}
  .directions{padding-bottom:44px}
  .category summary{grid-template-columns:minmax(0,1fr) 30px;gap:10px;padding:18px 16px}
  .category-copy strong{font-size:1.12rem}
  .category-copy small{font-size:.8rem}
  .category-content{padding:0 12px 12px}
  .empty-category{padding:22px 18px}
  .test-card{grid-template-columns:82px minmax(0,1fr);border-radius:17px}
  .card-art{min-height:0}
  .card-art::after{inset:12% -45%}
  .orbit-one{width:145px;height:145px;right:-88px;top:-52px}
  .orbit-two{width:105px;height:105px;left:-62px;bottom:-32px}
  .heart{width:48px;height:48px;border-radius:50% 50% 50% 16px;font-size:1.2rem}
  .heart::after{inset:9px}
  .card-copy{padding:17px 15px 18px}
  .card-copy h3{margin:10px 0 8px;font-size:1rem;line-height:1.42}
  .card-copy p{font-size:.78rem;line-height:1.55}
  footer{flex-direction:column;gap:7px;line-height:1.55}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
