/* TianTianSpeak v3 — 卡通风格覆盖层：加载在 style.css / extra.css 之后，不改动前两者 */
:root{
  --ink:#10294a;--cream:#eef7ff;--c-yellow:#ffd166;--c-pink:#ff7f7f;--c-blue:#4aa8ff;--c-green:#5fdc9a;--c-purple:#7f8cff;--c-orange:#ffa24d;
  --bg:var(--cream);--bg-elevated:#fff;--bg-card:#fff;--bg-card-hover:#fff0f5;
  --border:var(--ink);--border-subtle:var(--ink);
  --text:var(--ink);--text-secondary:color-mix(in srgb,var(--ink) 80%,var(--cream));--text-tertiary:color-mix(in srgb,var(--ink) 62%,var(--cream));
  --accent:var(--ink);--accent-dim:rgba(43,33,64,.08);--accent-glow:transparent;
  --font-sans:ui-rounded,"Hiragino Maru Gothic ProN","Yuanti SC","PingFang SC","Helvetica Neue",sans-serif;
  --radius:22px;--radius-sm:14px;--radius-xs:10px;
  --bd:3px solid var(--ink);--sh:5px 5px 0 var(--ink);
}
html{scroll-behavior:smooth}
body{font-family:var(--font-sans);font-weight:500;background-color:var(--cream);background-image:radial-gradient(color-mix(in srgb,var(--ink) 14%,transparent) 1.4px,transparent 1.6px);background-size:28px 28px}
a:hover{opacity:1}

/* 导航 */
.nav{background:var(--c-yellow);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:var(--bd)}
.nav-inner{height:64px}
.nav-logo{font-family:var(--font-sans);font-weight:900;font-size:1.25rem}
.nav-links a{font-size:.95rem;font-weight:800;color:var(--ink)}
.nav-links a:hover{text-decoration:underline wavy;text-underline-offset:5px}
.lang-toggle{font-family:var(--font-sans);font-weight:800;color:var(--ink);background:#fff;border:var(--bd);box-shadow:2px 2px 0 var(--ink);padding:3px 12px}
.lang-toggle:hover{background:var(--c-pink)}

/* 首屏 */
.hero{position:relative;max-width:none;background:var(--c-blue);border-bottom:var(--bd);padding-left:max(1.5rem,calc((100vw - var(--content-max))/2 + 2rem));padding-right:max(1.5rem,calc((100vw - var(--content-max))/2 + 2rem));overflow:hidden}
.hero:before,.hero:after{content:"";position:absolute;border:var(--bd);border-radius:50%;z-index:0}
.hero:before{width:150px;height:150px;background:var(--c-yellow);left:-40px;bottom:30px}
.hero:after{width:90px;height:90px;background:var(--c-pink);right:6%;top:92px}
.hero>*{position:relative;z-index:1}
.hero-visual:before{display:none}
.hero-badge{background:var(--c-pink);color:var(--ink);border:var(--bd);border-radius:999px;font-family:var(--font-sans);font-weight:900;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}
.hero-title{font-family:var(--font-sans);font-weight:900;letter-spacing:0;color:var(--ink);-webkit-text-fill-color:var(--ink);background:none}
.hero-subtitle{display:inline-block;font-weight:900;color:var(--ink);background:var(--c-yellow);border:var(--bd);border-radius:16px;padding:.1em .5em;box-shadow:var(--sh);transform:rotate(-1.5deg)}
.hero-desc{color:var(--ink);font-weight:600}
.hero-install{background:var(--c-pink);border:var(--bd);border-radius:999px;box-shadow:var(--sh);font-family:var(--font-sans);font-weight:900;transition:transform .12s,box-shadow .12s}
.hero-install:hover{border-color:var(--ink);transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
.hero-install code,.hero-install a,.install-prompt{color:var(--ink);font-family:var(--font-sans);font-weight:900}
.hero-cta{color:var(--ink)!important;font-weight:800}
.hero-stats .stat{color:var(--ink);font-weight:700}
.hero-stats .stat strong{background:#fff;border:var(--bd);border-radius:12px;padding:0 .4em;margin-right:.2em;box-shadow:2px 2px 0 var(--ink)}
.stat-sep{background:var(--ink)}

/* 轮播窗口 */
.shot-window{border:var(--bd);border-radius:22px;box-shadow:8px 8px 0 var(--ink);background:#fff}
.shot-window .browser-header{background:var(--c-yellow);border-bottom:var(--bd);padding:.6rem 1rem}
.shot-window .dot{width:14px;height:14px;border:2px solid var(--ink)}
.shot-window .dot.red{background:var(--c-pink)}.shot-window .dot.yellow{background:var(--c-orange)}.shot-window .dot.green{background:var(--c-green)}
.shot-window .browser-url{background:#fff;border:2px solid var(--ink);border-radius:999px;color:var(--ink);font-family:var(--font-sans);font-weight:800;font-size:.75rem}
.shot-cap{color:var(--ink);font-weight:600}
.shot-cap b{font-weight:900;background:linear-gradient(transparent 55%,var(--c-yellow) 55%)}
.shot-dots button{width:16px;height:16px;border:var(--bd);background:#fff;transition:transform .15s}
.shot-dots button[aria-current="true"]{background:var(--c-pink);transform:scale(1.25)}

/* 通用区块 */
.section-label{display:inline-block;background:var(--c-green);color:var(--ink);border:var(--bd);border-radius:999px;padding:.1rem .9rem;font-family:var(--font-sans);font-weight:900;letter-spacing:0;box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg)}
.section-title{font-family:var(--font-sans);font-weight:900;letter-spacing:0;color:var(--ink)}
.section-desc{color:var(--text-secondary);font-weight:600}

/* 痛点 */
.comparison-card{border:var(--bd);border-radius:24px;box-shadow:var(--sh);background:#fff}
.comparison-card.without{background:color-mix(in srgb,var(--c-pink) 22%,#fff)}
.comparison-card.with{background:color-mix(in srgb,var(--c-green) 22%,#fff)}
.comparison-card.without{transform:rotate(-.8deg)}.comparison-card.with{transform:rotate(.8deg)}
.comparison-header{font-weight:900;color:var(--ink);border-bottom:var(--bd)}
.comparison-icon{border:2px solid var(--ink);color:var(--ink)!important;font-weight:900}
.comparison-card.without .comparison-icon{background:var(--c-pink)}
.comparison-card.with .comparison-icon{background:var(--c-green)}
.comparison-list li{color:var(--ink);font-weight:600;border-bottom:2px dashed color-mix(in srgb,var(--ink) 25%,transparent)}

/* 能力卡 */
.cap-card{border:var(--bd);border-radius:24px;box-shadow:var(--sh);transition:transform .15s}
.cap-card:nth-child(odd){transform:rotate(-1deg)}.cap-card:nth-child(even){transform:rotate(1deg)}
.cap-card:hover{border-color:var(--ink);transform:rotate(0) translateY(-4px)}
.cap-icon-wrap{width:56px;height:56px;border:var(--bd);border-radius:18px;color:var(--ink)}
.cap-card:nth-child(6n+1) .cap-icon-wrap{background:var(--c-pink)}.cap-card:nth-child(6n+2) .cap-icon-wrap{background:var(--c-blue)}
.cap-card:nth-child(6n+3) .cap-icon-wrap{background:var(--c-green)}.cap-card:nth-child(6n+4) .cap-icon-wrap{background:var(--c-purple)}
.cap-card:nth-child(6n+5) .cap-icon-wrap{background:var(--c-orange)}.cap-card:nth-child(6n) .cap-icon-wrap{background:var(--c-yellow)}
.cap-card h3{font-weight:900;font-size:1.1rem;color:var(--ink)}
.cap-card>p{color:var(--text-secondary);font-weight:500;font-size:.9rem}
.cap-example{border-top:2px dashed var(--ink)}
.cap-example code{opacity:1;color:var(--text-secondary);font-family:var(--font-sans);font-weight:700;font-size:.78rem}

/* 价格 */
.api-section{background:var(--c-purple);border-block:var(--bd);max-width:none}
.api-section .section-desc{color:var(--ink)}
.price-card{border:var(--bd);border-radius:26px;box-shadow:var(--sh)}
.price-card h3{font-weight:900;font-size:1.1rem}
.price-card .amt{font-weight:900;letter-spacing:0}
.price-card.best{background:var(--c-yellow);box-shadow:var(--sh);transform:rotate(1.2deg)}
.price-card.best h3:before{content:"★ "}
.price-card .term{border-top:2px dashed var(--ink);color:var(--ink);font-weight:700}
.price-note{color:var(--ink);font-weight:700}
.price-note a{font-weight:900;text-decoration:underline wavy;text-underline-offset:4px}

/* 下载 */
.install-step{border:var(--bd);border-radius:24px;background:#fff;box-shadow:var(--sh)}
.install-step:nth-child(odd){transform:rotate(-.6deg)}.install-step:nth-child(even){transform:rotate(.6deg)}
.step-num{background:var(--c-yellow);color:var(--ink);border:var(--bd);font-weight:900;border-radius:50%}
.step-content h3{font-weight:900;color:var(--ink)}
.dl-btn{background:var(--c-pink);color:var(--ink)!important;border:var(--bd);border-radius:999px;box-shadow:var(--sh);font-weight:900;padding:.75rem 1.6rem;transition:transform .12s,box-shadow .12s}
.dl-btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
.dl-btn.alt{background:var(--c-blue);color:var(--ink)!important}
.dl-note{color:var(--text-secondary);font-weight:600}

/* FAQ */
.faq-item{border:var(--bd)!important;border-radius:20px;background:#fff;box-shadow:4px 4px 0 var(--ink);margin-bottom:16px;padding:0 1.25rem}
.faq-item:first-child{border-top:var(--bd)}
.faq-item summary{font-weight:900;color:var(--ink)}
.faq-item summary::after{color:var(--ink);font-weight:900}
.faq-item p{color:var(--text-secondary);font-weight:500}
.faq-item[open]{background:color-mix(in srgb,var(--c-yellow) 25%,#fff)}

/* 页脚 */
.footer{background:var(--c-yellow);border-top:var(--bd)}
.footer-logo{font-family:var(--font-sans);font-weight:900;color:var(--ink)}
.footer-author,.footer-right a{color:var(--ink);font-weight:700}
.footer-right a{text-decoration:underline wavy;text-underline-offset:4px}

@media(max-width:900px){.hero:before{display:none}.hero:after{width:60px;height:60px;top:80px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.nav-links{gap:1.25rem}

/* 首屏：文字居中在上，示例图放大在下 */
.hero{display:block;text-align:center;min-height:auto;padding-top:7rem;padding-bottom:4rem}
.hero:after{right:4%}
.hero-content{max-width:760px;margin:0 auto}
.hero-desc{margin-left:auto;margin-right:auto;max-width:640px}
.hero-actions,.hero-stats{justify-content:center}
.hero-visual{max-width:1040px;margin:3rem auto 0}
.hero .shot-window{border-radius:26px}
@media(max-width:900px){.hero .shot-window{max-width:none}.hero-visual{max-width:none}.hero{padding-top:6rem}}

/* 永久免费 */
.free-section{max-width:none;background:var(--c-green);border-block:var(--bd)}
.free-box{max-width:820px;margin:0 auto;background:#fff;border:var(--bd);border-radius:30px;box-shadow:8px 8px 0 var(--ink);padding:2rem 2rem 2.2rem;text-align:center}
.free-box h3{margin:0;font-size:clamp(2rem,5vw,3rem);font-weight:900;line-height:1.2}
.free-box h3 em{font-style:normal;background:var(--c-yellow);border:var(--bd);border-radius:16px;padding:0 .3em;display:inline-block;transform:rotate(-2deg);box-shadow:var(--sh)}
.free-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:1.6rem 0 1.4rem;padding:0;list-style:none}
.free-list li{background:var(--cream);border:var(--bd);border-radius:999px;padding:.2rem 1rem;font-weight:800;box-shadow:2px 2px 0 var(--ink)}
.free-list li:before{content:"✓ ";font-weight:900}
.free-box p{margin:.4rem 0;color:var(--text-secondary);font-weight:600}
.free-box .more{display:inline-block;margin-top:1rem;font-weight:900;text-decoration:underline wavy;text-underline-offset:5px}

/* 价格页 */
.page-head{padding:7.5rem 1.5rem 2.5rem;text-align:center;background:var(--c-purple);border-bottom:var(--bd)}
.page-head h1{margin:.5rem 0;font-size:clamp(2rem,6vw,3.4rem);font-weight:900;line-height:1.25}
.page-head p{max-width:640px;margin:0 auto;font-weight:700}
.trial{display:table;margin:0 auto 1.8rem;background:var(--c-green);border:var(--bd);border-radius:999px;padding:.25rem 1.3rem;font-weight:900;box-shadow:3px 3px 0 var(--ink);transform:rotate(-1.5deg)}
.cmp-wrap{overflow-x:auto;border:var(--bd);border-radius:24px;background:#fff;box-shadow:var(--sh);margin-top:1rem}
.cmp{width:100%;min-width:560px;border-collapse:separate;border-spacing:0;text-align:center}
.cmp th,.cmp td{padding:.9rem 1.1rem;border-bottom:2px dashed color-mix(in srgb,var(--ink) 25%,transparent);font-size:.95rem}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp tbody th{text-align:left;font-weight:900}
.cmp thead th{padding:1.2rem 1rem;font-size:1.15rem;font-weight:900;background:var(--c-blue);border-bottom:var(--bd)}
.cmp thead th.pro{background:var(--c-pink)}
.cmp td.pro{background:color-mix(in srgb,var(--c-pink) 14%,#fff)}
.cmp th+th,.cmp td+td{border-left:2px dashed color-mix(in srgb,var(--ink) 25%,transparent)}
.cmp thead th+th{border-left:var(--bd)}
.cmp small{display:block;font-weight:600;font-size:.78rem;color:var(--text-tertiary);line-height:1.5}
.cmp .x{color:var(--text-tertiary)}.cmp .ck{font-weight:900;font-size:1.1rem}
.deal{text-align:center;font-weight:900;font-size:1.3rem;margin:3rem 0 .4rem}
.page-section{max-width:var(--content-max);margin:0 auto;padding:3.5rem clamp(1.5rem,5vw,4rem)}
.back{display:inline-block;margin-bottom:1rem;font-weight:900;text-decoration:underline wavy;text-underline-offset:5px}

/* 截图顶部自带约 3.4% 的黑色菜单栏，裁掉：舞台比例相应收窄，图片上移 */
.shot-stage{overflow:hidden;aspect-ratio:1600/1004}
.shot-stage img{inset:auto;left:0;top:-3.52%;width:100%;height:auto;object-fit:initial}

/* 视频介绍 */
.video-section{max-width:none;background:var(--c-yellow);border-block:var(--bd)}
.video-section .section-inner{text-align:center}
.video-frame{max-width:900px;margin:2rem auto 0;background:#fff;border:var(--bd);border-radius:26px;box-shadow:8px 8px 0 var(--ink);overflow:hidden}
.video-frame .bar{display:flex;gap:8px;align-items:center;padding:.6rem 1rem;background:var(--c-pink);border-bottom:var(--bd)}
.video-frame .bar i{width:14px;height:14px;border-radius:50%;border:2px solid var(--ink);background:#fff}
.video-frame .bar i:nth-child(2){background:var(--c-yellow)}.video-frame .bar i:nth-child(3){background:var(--c-green)}
.video-frame video{display:block;width:100%;aspect-ratio:16/9;background:#161618;object-fit:contain}
.video-frame video:fullscreen{aspect-ratio:auto;object-fit:contain}

/* 适合谁 */
.audience-section .cap-card h3{font-size:1.05rem}
.aud-list{margin:1rem 0 0;padding:1rem 0 0;list-style:none;border-top:2px dashed var(--ink);display:flex;flex-direction:column;gap:.35rem}
.aud-list li{font-size:.82rem;font-weight:800;color:var(--ink)}
.aud-list li:before{content:"✓ ";font-weight:900}

/* 价格页顶部与首页首屏保持一致：蓝底 + 装饰圆 + 贴纸式副标题 */
.page-head{position:relative;overflow:hidden;background:var(--c-blue)}
.page-head:before,.page-head:after{content:"";position:absolute;border:var(--bd);border-radius:50%}
.page-head:before{width:110px;height:110px;background:var(--c-yellow);left:-30px;bottom:-30px}
.page-head:after{width:70px;height:70px;background:var(--c-pink);right:7%;top:96px}
.page-head>*{position:relative;z-index:1}
.page-head p{display:inline-block;max-width:none;background:var(--c-yellow);border:var(--bd);border-radius:16px;padding:.15em .8em;box-shadow:var(--sh);transform:rotate(-1.5deg);font-weight:900}
.cmp thead th{background:var(--c-yellow)}
.cmp thead th.pro{background:var(--c-pink)}
@media(max-width:900px){.page-head:before{display:none}}

/* 手机：对比表保持三列并排，不横向滚动 */
@media(max-width:640px){
  .page-section{padding-top:2.2rem}
  .cmp{min-width:0;table-layout:fixed}
  .cmp th:first-child{width:35%}
  .cmp th,.cmp td{padding:.65rem .4rem;font-size:.82rem;line-height:1.45}
  .cmp tbody th{font-size:.82rem;padding-left:.7rem}
  .cmp thead th{font-size:.95rem;padding:.8rem .3rem}
  .cmp small{font-size:.68rem}
  .cmp-wrap{border-radius:18px;box-shadow:4px 4px 0 var(--ink)}
  .deal{font-size:1.1rem;margin-top:2.2rem}
  .price-card .amt{font-size:1.9rem}
}

/* 截图放大 */
.shot-stage{cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:300;background:color-mix(in srgb,var(--ink) 92%,transparent);display:flex;flex-direction:column}
.lightbox[hidden]{display:none}
.lb-close{position:absolute;top:12px;right:12px;z-index:2;width:44px;height:44px;border-radius:50%;border:var(--bd);background:var(--c-yellow);color:var(--ink);font-size:1.1rem;font-weight:900;cursor:pointer;box-shadow:3px 3px 0 var(--ink)}
.lb-hint{margin:0;padding:16px 64px 8px 16px;color:#fff;font-weight:700;font-size:.85rem}
.lb-scroll{flex:1;overflow:auto;-webkit-overflow-scrolling:touch;display:flex;align-items:center;padding:8px 0 24px}
.lb-scroll img{flex:none;width:max(100%,960px);height:auto;border-radius:12px}
@media(min-width:960px){.lb-hint{display:none}.lb-scroll{justify-content:center}.lb-scroll img{width:min(1280px,96vw)}}
@media(max-width:600px){.nav-links a[href="pricing.html"]{display:inline-block;font-size:.8rem}.nav-links{gap:.6rem}}

/* 轮播左右按钮 */
.shot-window{position:relative}
.shot-arrow{position:absolute;top:calc(50% + 24px);z-index:3;width:48px;height:48px;margin-top:-24px;border-radius:50%;border:var(--bd);background:var(--c-yellow);color:var(--ink);font-size:1.6rem;font-weight:900;line-height:1;cursor:pointer;box-shadow:3px 3px 0 var(--ink);display:grid;place-items:center;padding:0 0 .15em;transition:transform .12s,background .12s}
.shot-arrow:hover{background:var(--c-pink);transform:scale(1.08)}
.shot-arrow.prev{left:14px}.shot-arrow.next{right:14px}
@media(max-width:600px){.shot-arrow{width:38px;height:38px;font-size:1.3rem}.shot-arrow.prev{left:8px}.shot-arrow.next{right:8px}}
.usage-plan{border:var(--bd);border-radius:24px;background:#fff;box-shadow:var(--sh)}.usage-plan h3,.usage-plan ol{color:var(--ink)}

/* 会员价格：扫码支付弹窗 */
.price-card[data-plan]{cursor:pointer;transition:transform .15s}
.price-card[data-plan]:hover,.price-card[data-plan]:focus-visible{transform:translateY(-3px)}
.qr-modal{position:fixed;inset:0;z-index:300;background:color-mix(in srgb,var(--ink) 70%,transparent);display:flex;align-items:center;justify-content:center;padding:16px}
.qr-modal[hidden]{display:none}
.qr-box{position:relative;width:100%;max-width:320px;padding:24px 20px 20px;background:#fff;border:var(--bd);border-radius:26px;box-shadow:var(--sh);text-align:center}
.qr-box h3{margin:0 0 12px;font-weight:900;font-size:1.1rem}
.qr-box img{width:240px;max-width:100%;height:auto;display:block;margin:0 auto}
.qr-box p{margin:12px 0 6px;font-weight:700;font-size:.9rem}
.qr-box a{font-size:.8rem;color:var(--text-secondary)}
.qr-close{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:50%;border:var(--bd);background:var(--c-yellow);color:var(--ink);font-weight:900;cursor:pointer}

/* ---- 官网打磨 ---- */
/* 标题自己说话：去掉小标签胶囊 */
.section-label{display:none}
.section-title{text-wrap:balance;margin-bottom:1rem}
.section-desc,.cap-card>p,.aud-list{text-wrap:pretty}
/* 带文字的卡片只轻微倾斜，正文保持易读 */
.cap-card:nth-child(odd){transform:rotate(-.5deg)}.cap-card:nth-child(even){transform:rotate(.5deg)}
.comparison-card.without{transform:rotate(-.4deg)}.comparison-card.with{transform:rotate(.4deg)}
.cap-example code{font-size:.84rem}
.dl-note{font-size:.85rem;line-height:1.7;max-width:62ch}
/* 下载是主要动作：导航里单独突出，手机上也保留 */
.nav-links a.nav-dl{background:var(--c-pink);border:var(--bd);border-radius:999px;padding:2px 14px;box-shadow:2px 2px 0 var(--ink)}
.nav-links a.nav-dl:hover{text-decoration:none;background:#fff}
@media(max-width:600px){.nav-links a.nav-dl{display:inline-block;font-size:.8rem;padding:1px 10px}}
@media(min-width:601px) and (max-width:900px){.nav-links a[href="#video"],.nav-links a[href="#faq"]{display:none}}
/* 浏览器自带的部分也跟着配色 */
::selection{background:var(--c-yellow);color:var(--ink)}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}
.dl-btn:focus-visible,.hero-install:focus-visible{outline-offset:4px}
html{scroll-padding-top:80px}
/* 减少动效 / 无滚动触发时内容照常可见 */
@media(prefers-reduced-motion:reduce){.section-inner{opacity:1;transform:none}}
.hero-stats .stat strong{font-family:var(--font-sans);font-weight:900}

/* 首屏信息条：可点击，跳到对应说明 */
.hero-stats{flex-wrap:wrap;row-gap:.75rem}
a.stat{text-decoration:none;max-width:15rem;text-align:left;line-height:1.4;transition:transform .12s}
a.stat:hover{transform:translateY(-2px)}
a.stat:hover span{text-decoration:underline wavy;text-underline-offset:4px}
.hero-stats .stat strong{font-variant-numeric:tabular-nums;min-width:3.4ch;display:inline-block;text-align:center}
@media(max-width:700px){.stat-sep{display:none}.hero-stats{flex-direction:column;align-items:center}a.stat{max-width:none;text-align:center}}
/* 导航当前区块 */
.nav-links a[aria-current="true"]:not(.nav-dl){text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}
/* 悬浮下载 */
.float-dl{position:fixed;right:16px;bottom:16px;z-index:90;padding:.6rem 1.3rem;border:var(--bd);border-radius:999px;background:var(--c-pink);color:var(--ink);font-weight:900;box-shadow:var(--sh);animation:floatIn .3s cubic-bezier(.16,1,.3,1)}
.float-dl[hidden]{display:none}
.float-dl:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
@keyframes floatIn{from{opacity:0;transform:translateY(12px)}}
.footer-right a[href$="#install"]{font-weight:900}

/* ---- 卡片悬停交互（适合谁 / 为什么 / 能力）---- */
.cap-card,.comparison-card{transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s cubic-bezier(.16,1,.3,1),background-color .2s,opacity .25s}
.cap-icon-wrap{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.cap-example{transition:background-color .2s}
.aud-list li,.comparison-list li{transition:transform .2s cubic-bezier(.16,1,.3,1),background-color .2s}
@media(hover:hover){
  /* 卡片：摆正、上浮、阴影加深 */
  .cap-card:nth-child(n):hover{transform:rotate(0) translateY(-6px);box-shadow:9px 11px 0 var(--ink)}
  .cap-card:hover .cap-icon-wrap{transform:rotate(-10deg) scale(1.12)}
  .cap-card:hover .cap-example{background:color-mix(in srgb,var(--c-yellow) 45%,#fff)}
  /* 同组里其他卡片退后一点，视线落在当前这张 */
  .cap-grid:has(.cap-card:hover) .cap-card:not(:hover){opacity:.72}
  /* 列表条目：悬停时右移并高亮 */
  .aud-list li:hover{transform:translateX(6px);background:color-mix(in srgb,var(--c-green) 35%,transparent);border-radius:8px}
  /* 对比：悬停一侧卡片时摆正，另一侧淡出；条目高亮 */
  .comparison-card:hover{transform:rotate(0) translateY(-4px);box-shadow:8px 10px 0 var(--ink)}
  .comparison-grid:has(.comparison-card:hover) .comparison-card:not(:hover){opacity:.6}
  .comparison-list li:hover{transform:translateX(6px)}
  .comparison-card.without .comparison-list li:hover{background:color-mix(in srgb,var(--c-pink) 45%,transparent)}
  .comparison-card.with .comparison-list li:hover{background:color-mix(in srgb,var(--c-green) 45%,transparent)}
  .comparison-card.without:hover .comparison-icon{transform:rotate(90deg)}
  .comparison-icon{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
  .comparison-card.with:hover .comparison-icon{transform:scale(1.25)}
}
.cap-card:focus-within{box-shadow:9px 11px 0 var(--ink)}
@media(prefers-reduced-motion:reduce){.cap-card,.comparison-card{transition:none}}
.aud-list li{padding:.15rem .5rem;margin-left:-.5rem;border-radius:8px}