/* Cek Nama Mandarin(传播小游戏):手机优先;页面照官网样式(衬线 + 细线 + 陶土红),分享卡片在 canvas 里画 */
.cn h1{font-family:var(--f-h);font-weight:900;letter-spacing:-.01em}
.cn .lede{color:var(--ink2);font-size:17px;margin-bottom:18px}
.cn-shared{background:var(--paper2);border-left:3px solid var(--clay);padding:10px 14px;font-size:15px;margin:0 0 16px}
.cn-tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:16px}
.cn-tabs button{flex:1;background:none;border:0;border-bottom:2px solid transparent;padding:12px 6px;font:700 16px var(--f-b);color:var(--ink2);cursor:pointer;margin-bottom:-1px}
.cn-tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--clay)}
.cn-form{display:grid;gap:8px}
.cn-l{font:700 14px var(--f-b);color:var(--ink2);margin-top:6px}
.cn-in{width:100%;font:600 20px var(--f-b);padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.cn-in:focus{outline:2px solid var(--clay);outline-offset:1px;border-color:transparent}
.cn-g{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:15px;color:var(--ink2);margin:6px 0 4px}
.cn-g label{display:flex;align-items:center;gap:6px;color:var(--ink);cursor:pointer}
.cn-g input{accent-color:var(--clay);width:18px;height:18px}
.cn-go{width:100%;font-size:18px;padding:16px;margin-top:6px}
.cn-res{margin-top:24px;border-top:2px solid var(--ink);padding-top:18px}
.cn-res canvas{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;border-radius:6px;box-shadow:0 18px 50px rgba(43,37,34,.18)}
.cn-detail{margin:20px 0 6px}
.cn-detail h2{font:800 13px var(--f-b);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin:18px 0 6px}
.cn-chars{display:flex;flex-wrap:wrap;gap:8px}
.cn-chars button{display:flex;align-items:baseline;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 14px;cursor:pointer;font:inherit;color:var(--ink);text-align:left}
.cn-chars button b{font:700 30px var(--f-h)}
.cn-chars button span{font:700 15px var(--f-b);color:var(--clay)}
.cn-chars button small{display:block;font-size:13px;color:var(--ink2)}
.cn-chars button:hover{border-color:var(--clay)}
.cn-line{font-size:16px;line-height:1.55;margin:0}
.cn-line .zh{font-family:var(--f-h);font-weight:700}
.cn-line .py{color:var(--clay);font-weight:700}
.cn-say{background:none;border:0;color:var(--clay);font:700 15px var(--f-b);cursor:pointer;padding:2px 4px}
.cn-act{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:20px 0}
.cn-act .btn{flex:1 1 160px;text-align:center}
.cn-cta{border-top:1px solid var(--line);padding-top:16px;margin-top:8px}
.cn-cta p{margin:0 0 12px;font-size:16px}
.cn-small{font-size:14px;color:var(--ink2)}.cn-small a{color:var(--clay);font-weight:700}
.cn-note{font-size:13px;color:var(--ink2);margin:24px 0}