
:root{--bg:#f7f6f3;--card:#fff;--card2:#fafaf7;--ink:#2a2724;--text:#211e1a;--muted:#6f685e;--light:#9a9285;--line:rgba(42,39,36,.16);--coral:#e2563f;
  --hard:4px 4px 0 var(--ink);--hard-sm:2px 2px 0 var(--ink);--hard-xs:1.5px 1.5px 0 rgba(42,39,36,.75);
  --shadow:var(--hard),0 18px 34px -22px rgba(42,39,36,.45);
  --font:"TuTu MiSans",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Helvetica,"Apple Color Emoji",Arial,sans-serif}
body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}
.page-title{font-family:var(--font)}
:focus-visible{outline:2px solid var(--coral);outline-offset:3px}
::selection{background:#f8dcb0}

/* 整页正文收进一张卡片，和顶部导航对齐同一栏宽 */
.page-wrap{flex:1 0 auto;width:calc(100% - 32px);max-width:712px;margin:26px auto 36px;padding:24px 30px 30px;
  background:var(--card);border:2px solid var(--ink);border-radius:18px;box-shadow:var(--shadow)}
@media(min-width:600px){.page-wrap{width:calc(100% - 48px)}}
.page-wrap>main{display:block}
.no-cover .page-icon,.no-cover .back-home,.no-cover .page-title:first-child{margin-top:0}
.no-cover .back-home~.page-icon{margin-top:18px}
.has-cover .page-icon{margin-top:-40px}
.cover{width:calc(100% - 32px);max-width:712px;height:180px;min-height:0;margin:26px auto -26px;border:2px solid var(--ink);border-bottom:0;border-radius:18px 18px 0 0;overflow:hidden}
.has-cover.page-wrap,.cover+.page-wrap{border-top-left-radius:0;border-top-right-radius:0;margin-top:0}
.page-icon{font-size:52px;height:56px;line-height:56px}
.page-title{font-size:32px;font-weight:700;letter-spacing:-.02em;margin-top:10px}
.page-body{margin-top:18px;color:var(--text)}
.ntn-text{color:var(--text)}
.page-body a{color:var(--coral);text-decoration:underline;text-decoration-color:rgba(226,86,63,.45);text-decoration-thickness:1.5px;text-underline-offset:3px}
@media(hover:hover){.page-body a:hover{text-decoration-color:var(--coral)}}
.ntn-h{font-weight:800;letter-spacing:-.01em;margin-top:26px}

/* 返回 / 回到主页：按钮 */
.back-home,.home-btn{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--ink);border-radius:999px;background:var(--card);
  color:var(--text);font-weight:700;text-decoration:none;transition:transform .06s,box-shadow .06s,background .12s}
.back-home{padding:5px 13px;font-size:12.5px;box-shadow:var(--hard-xs)}
.home-btn{padding:9px 20px;font-size:14px;box-shadow:var(--hard-sm)}
@media(hover:hover){.back-home:hover,.home-btn:hover{background:var(--card2);color:var(--text);box-shadow:var(--hard-sm)}}
@media(hover:hover){.back-home:active,.home-btn:active{transform:translate(1.5px,1.5px);box-shadow:0 0 0 var(--ink)}}
.home-btn-wrap{margin-top:36px}

/* 提示块（callout）：卡内小卡，保留原来的淡色底 */
.ntn-callout{border:1.5px solid var(--ink);border-radius:14px;padding:13px 16px 13px 13px;margin:12px 0;box-shadow:var(--hard-sm)}
.ntn-callout .ico{font-size:1.15em}
/* 「链接 + 一句说明」的提示块（LinkTree 那种）：整块可点，像按钮；不带箭头（和首页入口按钮统一） */
.ntn-callout:has(>div>a:first-child+.ntn-text){position:relative;transition:transform .08s,box-shadow .08s}
.ntn-callout:has(>div>a:first-child+.ntn-text)>div>a:first-child::before{content:"";position:absolute;inset:0;border-radius:inherit}
.ntn-callout:has(>div>a:first-child+.ntn-text)>div>a:first-child{color:var(--text);text-decoration:none}
@media(hover:hover){.ntn-callout:has(>div>a:first-child+.ntn-text):hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}}
@media(hover:hover){.ntn-callout:has(>div>a:first-child+.ntn-text):active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}}
.ntn-callout .ntn-text{color:var(--muted)}
/* Threads、Instagram（一张卡两个链接）：Instagram 渐变（黄→橙→粉→紫）调淡做底；左侧一道 Threads 黑 + 一道 Instagram 竖向渐变 */
.ntn-callout:has(a[href*="instagram.com"]){padding-left:19px;box-shadow:var(--hard-sm);
  background:linear-gradient(#0f1419,#0f1419) 0 0/3px 100% no-repeat,
    linear-gradient(180deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5) 3px 0/3px 100% no-repeat,
    linear-gradient(100deg,color-mix(in srgb,#feda75 16%,#fff),color-mix(in srgb,#d62976 10%,#fff) 55%,color-mix(in srgb,#962fbf 12%,#fff))}
/* 抖音 & 今日头条（一张卡两个链接，结构和普通链接卡不同）：字节系配色——抖音青 + 抖音红，渐变底 + 青红双竖条 */
.ntn-callout:has(a[href*="douyin.com"]){padding-left:19px;
  background:linear-gradient(100deg,color-mix(in srgb,#25f4ee 16%,#fff),color-mix(in srgb,#fe2c55 12%,#fff));
  box-shadow:inset 3px 0 0 #25f4ee,inset 6px 0 0 #fe2c55,var(--hard-sm)}
/* 链接卡按平台配色：底色 = 平台品牌色调淡，左侧一道品牌色竖条，悬停时底色加深；没匹配到的平台保持原来的 Notion 底色 */
.ntn-callout:has(>div>a[href*="youtube.com"]:first-child+.ntn-text){--brand:#ff0033}
.ntn-callout:has(>div>a[href*="bilibili.com"]:first-child+.ntn-text){--brand:#fb7299}
.ntn-callout:has(>div>a[href*="douyin.com"]:first-child+.ntn-text){--brand:#161823}
.ntn-callout:has(>div>a[href*="xiaohongshu.com"]:first-child+.ntn-text){--brand:#ff2442}
.ntn-callout:has(>div>a[href*="x.com"]:first-child+.ntn-text){--brand:#0f1419}
.ntn-callout:has(>div>a[href*="twitter.com"]:first-child+.ntn-text){--brand:#0f1419}
.ntn-callout:has(>div>a[href*="threads."]:first-child+.ntn-text){--brand:#0f1419}
.ntn-callout:has(>div>a[href*="facebook.com"]:first-child+.ntn-text){--brand:#1877f2}
.ntn-callout:has(>div>a[href*="t.me"]:first-child+.ntn-text){--brand:#229ed9}
.ntn-callout:has(>div>a[href*="linktr.ee"]:first-child+.ntn-text){--brand:#2fb84f}
.ntn-callout:has(>div>a[href*="tutu.media"]:first-child+.ntn-text){--brand:#d97757}
@supports (background:color-mix(in srgb,red 10%,white)){
.ntn-callout:has(>div>a:first-child+.ntn-text){--stripe:inset 6px 0 0 var(--brand,transparent);box-shadow:var(--stripe),var(--hard-sm);padding-left:19px}
@media(hover:hover){.ntn-callout:has(>div>a:first-child+.ntn-text):hover{box-shadow:var(--stripe),3px 3px 0 var(--ink)}}
@media(hover:hover){.ntn-callout:has(>div>a:first-child+.ntn-text):active{box-shadow:var(--stripe),0 0 0 var(--ink)}}
.ntn-callout:has(>div>a[href*="youtube.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#ff0033 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="youtube.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#ff0033 18%,#fff)}}
.ntn-callout:has(>div>a[href*="bilibili.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#fb7299 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="bilibili.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#fb7299 18%,#fff)}}
.ntn-callout:has(>div>a[href*="douyin.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#161823 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="douyin.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#161823 18%,#fff)}}
.ntn-callout:has(>div>a[href*="xiaohongshu.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#ff2442 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="xiaohongshu.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#ff2442 18%,#fff)}}
.ntn-callout:has(>div>a[href*="x.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#0f1419 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="x.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#0f1419 18%,#fff)}}
.ntn-callout:has(>div>a[href*="twitter.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#0f1419 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="twitter.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#0f1419 18%,#fff)}}
.ntn-callout:has(>div>a[href*="threads."]:first-child+.ntn-text){background-color:color-mix(in srgb,#0f1419 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="threads."]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#0f1419 18%,#fff)}}
.ntn-callout:has(>div>a[href*="facebook.com"]:first-child+.ntn-text){background-color:color-mix(in srgb,#1877f2 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="facebook.com"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#1877f2 18%,#fff)}}
.ntn-callout:has(>div>a[href*="t.me"]:first-child+.ntn-text){background-color:color-mix(in srgb,#229ed9 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="t.me"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#229ed9 18%,#fff)}}
.ntn-callout:has(>div>a[href*="linktr.ee"]:first-child+.ntn-text){background-color:color-mix(in srgb,#2fb84f 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="linktr.ee"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#2fb84f 18%,#fff)}}
.ntn-callout:has(>div>a[href*="tutu.media"]:first-child+.ntn-text){background-color:color-mix(in srgb,#d97757 10%,#fff)}
@media(hover:hover){.ntn-callout:has(>div>a[href*="tutu.media"]:first-child+.ntn-text):hover{background-color:color-mix(in srgb,#d97757 18%,#fff)}}
}
/* 「标题行 + 说明」结构里标题行的链接（含一行多个链接，如「抖音 & 今日头条」）：深色粗体，不用珊瑚色下划线 */
.ntn-callout:has(>div>.ntn-text)>div>a{color:var(--text);font-weight:700;text-decoration:none}
@media(hover:hover){.ntn-callout:has(>div>.ntn-text)>div>a:hover{text-decoration:underline;text-decoration-color:var(--ink)}}

/* 视频、图片、嵌入：描边 + 按钮级投影 */
.ntn-embed{border:2px solid var(--ink);border-radius:14px;overflow:hidden;box-shadow:var(--hard-sm);margin:14px 0}
.ntn-embed iframe{border-radius:0}
.ntn-image img{border:2px solid var(--ink);border-radius:14px;box-shadow:var(--hard-sm)}
.vid-grid{gap:16px;margin:12px 0}
.vid-card,.g-card{border:1.5px solid var(--ink);border-radius:14px;background:var(--card);box-shadow:var(--hard-sm);color:var(--text)!important;text-decoration:none!important;transition:transform .08s,box-shadow .08s}
@media(hover:hover){.vid-card:hover,.g-card:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}}
@media(hover:hover){.vid-card:active,.g-card:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}}
.vid-thumb{border-bottom:1.5px solid var(--ink)}
.vid-title{font-weight:700}
.vid-sub{color:var(--muted)}
.vid-tag{border:1.2px solid var(--ink);border-radius:999px;background:var(--card);padding:1px 8px;font-weight:600;box-shadow:var(--hard-xs)}
.g-card img{border-bottom:1.5px solid var(--ink)}
.g-card figcaption{font-weight:600}
.g-card a{text-decoration:none}

/* 联系卡 */
.cc-card{border:1.5px solid var(--ink);border-radius:14px;background:var(--card);box-shadow:var(--hard-sm);color:var(--text)!important;text-decoration:none!important;transition:transform .08s,box-shadow .08s}
@media(hover:hover){.cc-card:hover{border-color:var(--ink);transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink)}}
.cc-arrow{display:none}
@media(hover:hover){.cc-card:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}}
.cc-ico{border:1.5px solid var(--ink)}
.cc-title{font-weight:700}
.cc-addr,.cc-note{color:var(--muted)}

/* 粉丝数块 */
.fstats{border:1.5px solid var(--ink);border-radius:14px;background:var(--card2);box-shadow:var(--hard-sm);padding:16px 20px}
.fstats .fs-total{font-weight:800;font-variant-numeric:tabular-nums}
.fstats .fs-label{color:var(--muted)}
.fstats .fs-list{color:var(--muted)}
.fstats .fs-list b{color:var(--text);font-weight:700}

/* 商品搜索 */
.psearch input{height:50px;border:2px solid var(--ink);border-radius:999px;background:var(--card);box-shadow:var(--hard-sm);font-family:var(--font)}
.psearch input:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(226,86,63,.25),var(--hard-sm)}
.ps-card{border-bottom:1.5px dashed var(--line)}
.ps-name{font-weight:700}
.ps-links a{color:var(--coral)}
.ps-tools a{display:inline-flex;padding:4px 12px;border:1.5px solid var(--ink);border-radius:999px;background:var(--card);color:var(--text);font-weight:700;box-shadow:var(--hard-xs)}
@media(hover:hover){.ps-tools a:active{transform:translate(1.5px,1.5px);box-shadow:0 0 0 var(--ink)}}
.ps-card mark{background:#f8dcb0}

/* 钱包地址等行内代码 */
code{color:#9a3412;background:var(--card2);border:1px dashed rgba(42,39,36,.28);border-radius:6px;padding:.1em .4em;word-break:break-all}
.ntn-hr::after{height:0;border-top:1.5px dashed var(--line);background:none}

footer.site{font-size:13px;color:var(--muted);font-weight:600;padding:8px 16px 28px}
footer.site a{text-decoration:none}
@media(hover:hover){footer.site a:hover{color:var(--coral)}}
@media(max-width:560px){.page-wrap{padding:20px 18px 24px}.page-title{font-size:27px}.vid-grid{grid-template-columns:1fr}
  /* 手机：整页正文卡片去掉外框/阴影/圆角，铺满屏宽 */
  .page-wrap,.has-cover.page-wrap,.cover+.page-wrap{width:100%;margin:0;border:0;border-radius:0;box-shadow:none}
  .cover{width:100%;margin:0;border:0;border-radius:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.gnav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  box-shadow:0 1px 0 rgba(42,39,36,.05),0 2px 6px -2px rgba(42,39,36,.08),0 14px 30px -18px rgba(42,39,36,.30);
  font-family:"TuTu MiSans",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Helvetica,Arial,sans-serif;letter-spacing:0}
.gn-in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:7px;height:58px;padding:1px 16px 3px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.gn-in::-webkit-scrollbar{display:none}
.gnav a{text-decoration:none;font-size:14px;font-weight:700;line-height:1;padding:8px 13px;border-radius:999px;border:2px solid transparent;transition:transform .06s,box-shadow .06s}
.gnav .gn-in>a:nth-child(1){background:#ffdde8;color:#b02a5b;font-weight:800}
.gnav .gn-in>a:nth-child(2){background:#d97757;color:#fff}
.gnav .gn-in>a:nth-child(3){background:#fff0bf;color:#866100}
.gnav .gn-lang{background:#e9e3ff;color:#5b3fc4;padding:6px 12px;font-size:13px}
.gnav a[aria-current=page]{border-color:#2a2724;box-shadow:2px 2px 0 #2a2724;font-weight:800}
@media(hover:hover){.gnav .gn-lang:active{border-color:#2a2724;box-shadow:2px 2px 0 #2a2724;font-weight:800}.gnav a[aria-current=page]:active{transform:translate(2px,2px);box-shadow:none}}
.gn-sp{flex:1;min-width:8px}
@media (min-width:600px){.gn-in{padding-left:24px;padding-right:24px}}
@media(max-width:560px){.gnav{position:fixed;top:0;left:0;right:0;background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
  .gnav::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:100vh;background:#fff}
  body:has(>.gnav){padding-top:58px}.gn-in{gap:5px;padding:1px 12px 3px}.gnav .gn-in>a{padding:8px 10px;font-size:13.5px}.gn-sp{min-width:2px}}
@media(max-width:380px){.gn-in{gap:4px;padding:1px 10px 3px}.gnav .gn-in>a{padding:7px 8px;font-size:13px}}
