/* 迷幻三摩地 / tw420 — tokens, reset, shared pieces. Palette sampled from the avatar. */
:root{
  --bg0:#06020d;--bg1:#0c0420;--bg2:#170732;--indigo:#29307e;--violet:#9e1eb0;--pink:#ff5fd2;--pink-soft:#e182c9;--pink-pale:#eabcda;
  --cyan:#4dd6ea;--cyan-soft:#9bd2e5;--ink:#f3ecf7;--muted:#b7a7d6;--orange:#ff9a52;--tg:#2aabee;
  --glass:rgba(23,7,50,.58);--glass-2:rgba(41,48,126,.42);--line:rgba(234,188,218,.16);--line-2:rgba(77,214,234,.28);
  --r-card:22px;--r-bubble:18px;--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.3,1.5,.5,1);
  --font:"PingFang TC","Noto Sans TC","Microsoft JhengHei","Heiti TC","Hiragino Sans GB",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --grad:linear-gradient(100deg,#4dd6ea 0%,#ff5fd2 48%,#9e1eb0 100%);
  --wrap:min(1180px,calc(100vw - 40px));
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--bg0)}
body{font:400 16px/1.7 var(--font);color:var(--ink);background:radial-gradient(1200px 700px at 80% -10%,#2a0f55 0,transparent 60%),radial-gradient(900px 600px at -10% 30%,#10285c 0,transparent 55%),var(--bg0);
  min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:8px}
.wrap{width:var(--wrap);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
section{position:relative;padding:clamp(72px,11vw,140px) 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font:600 13px/1 var(--font);letter-spacing:.22em;color:var(--cyan);text-transform:uppercase}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--grad)}
h2.title{font:800 clamp(30px,5.2vw,58px)/1.12 var(--font);letter-spacing:-.01em;margin:14px 0 14px;text-wrap:balance}
.grad{background:linear-gradient(100deg,#7fe3f0 0%,#ff7be0 45%,#ffb36b 70%,#7fe3f0 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}   /* static: text never ends on dim violet */
.em{color:#ff8be6}
.lead{color:var(--muted);font-size:clamp(16px,1.6vw,19px);max-width:46ch;text-wrap:pretty}
/* reveal on scroll */
.rv{opacity:0;transform:translateY(26px) scale(.985);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--d,0) * 90ms)}   /* no blur: transform + opacity only */
.rv.in{opacity:1;transform:none}
/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:999px;font:700 16px/1 var(--font);letter-spacing:.02em;overflow:hidden;isolation:isolate;transition:transform .25s var(--spring),box-shadow .3s}
.btn.pri{background:linear-gradient(100deg,#9e1eb0,#ff5fd2 60%,#ff9a52);box-shadow:0 10px 34px -8px rgba(255,95,210,.65),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.ghost{background:var(--glass);border:1px solid var(--line-2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn:hover{transform:translateY(-3px) scale(1.03)}
.btn:active{transform:scale(.97)}
.btn svg{width:20px;height:20px;flex:none}
/* glass card */
.card{position:relative;background:#150a33;border:1px solid var(--line);border-radius:var(--r-card);box-shadow:0 24px 60px -34px rgba(158,30,176,.6)}
.noscroll{overflow:hidden}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none;filter:none}
}