/* ColaTea 全站共用样式（v1.19 由首页内联样式抽出，首页与所有 posts/<slug>/index.html 共用） */
  :root{
    --bg:#f7fafc;
    --hero-bg:#fbf8f2;
    --card:#ffffff;
    --ink:#101826;
    --ink-2:#425061;
    --ink-3:#8593a3;
    --line:#e6edf3;
    --teal:#14b8a6;   --teal-ink:#0d9185;
    --blue:#3b82f6;   --blue-ink:#2563d9;
    --pink:#ef6aa8;   --pink-ink:#d84e90;
    --violet:#8b5cf6;
    --grad:linear-gradient(90deg,var(--teal),var(--blue) 55%,var(--violet));
    --sans:-apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",Roboto,sans-serif;
    --mono:"SF Mono",ui-monospace,Consolas,"Courier New",monospace;
  }
  *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
  html{-webkit-text-size-adjust:100%;overflow-x:hidden}
  body{background:var(--bg);color:var(--ink);font-family:var(--sans);
    font-size:15.5px;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  .wrap{max-width:1080px;margin:0 auto;
    padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}

  /* ================= Hero（品牌主视觉区） ================= */
  .hero{background:var(--hero-bg);position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
  .hero::after{content:"";position:absolute;inset:0;pointer-events:none;
    background-image:radial-gradient(rgba(20,184,166,.08) 1px,transparent 1px);
    background-size:26px 26px;
    mask-image:linear-gradient(115deg,rgba(0,0,0,.7),transparent 55%);
    -webkit-mask-image:linear-gradient(115deg,rgba(0,0,0,.7),transparent 55%)}
  .hero-in{position:relative;display:grid;grid-template-columns:1.05fr .95fr;
    align-items:stretch;gap:30px;padding-top:24px;padding-bottom:24px;min-height:0} /* v1.23：上下内边距对称 24/24，使 HeroCopy 的 50% 恰为 Hero 几何中心 */
  /* 注意：此处不能加 z-index——会形成堆叠上下文，把 .hero 的米白底排除在
     主视觉 mix-blend-mode 的混合背景之外，圆外白底会原样露出（2026-11-03 验证） */
  .hero-copy{position:relative;text-align:center} /* v1.23：降级为定位容器，两个子块各自绝对定位 */
  /* HeroMain：品牌字 + 标语，整组垂直中心定在 Hero 50% 高度（C-57） */
  .hero-main{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);
    padding-left:clamp(0px,6vw,84px); /* 与 HeroNote 同一左内边距，保证两行居中轴一致 */
    display:flex;flex-direction:column;align-items:center}
  .wordmark{position:relative;display:inline-block;font-size:84px;font-weight:800;letter-spacing:-.015em;line-height:1.05;color:var(--ink)}
  .wordmark b{font-weight:800;background:var(--grad);-webkit-background-clip:text;
    background-clip:text;color:transparent}
  .tagline{margin-top:16px;font-size:17px;font-weight:600;line-height:1.7;color:var(--ink);
    text-wrap:balance}
  .tagline .power{font-weight:800;background:var(--grad);-webkit-background-clip:text;
    background-clip:text;color:transparent}
  .scroll-pill{display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:60px;border-radius:99px;background:var(--teal);color:#fff;
    font-size:17px;cursor:pointer;border:0;box-shadow:0 6px 16px rgba(20,184,166,.35);
    transition:.2s}
  .float a:hover .scroll-pill{transform:translateY(3px);background:var(--teal-ink)}
  .hero-note{position:absolute;left:0;right:0;bottom:0;margin:0; /* v1.23：绝对贴 HeroCopy 底 → 与主视觉底边对齐 */
    display:flex;align-items:center;justify-content:center;gap:9px;
    padding-left:clamp(0px,6vw,84px);
    font-family:var(--mono);font-size:10.5px;color:var(--ink-3);letter-spacing:.03em}
  .hero-note::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--grad);flex:none}

  .hero-art{position:relative;display:flex;justify-content:center;align-items:center;min-height:360px}
  /* 龙珠（七星球）：位于文案区与主视觉区之间、Hero 五分之一高度处；橙色珠体 + 高光 + 七星环布，带光晕 */
  .sun{position:absolute;z-index:0;left:50%;top:20%;transform:translate(-50%,-50%);
    width:64px;height:64px;border-radius:50%;pointer-events:none;
    background:radial-gradient(circle at 35% 30%,#ffd77a 0%,#ffaa33 45%,#f07f1f 78%,#d96a12 100%);
    box-shadow:0 0 38px 12px rgba(255,160,60,.50),
      inset -6px -8px 14px rgba(160,70,0,.35),
      inset 4px 6px 10px rgba(255,240,200,.55)}
  .sun::after{content:"";position:absolute;left:16%;top:10%;width:36%;height:24%;
    border-radius:50%;background:rgba(255,255,255,.8);filter:blur(2px);transform:rotate(-22deg)}
  .sun i{position:absolute;font-style:normal;color:#e8452c;font-size:10px;line-height:1;
    transform:translate(-50%,-50%); /* 七颗红星沿圆环均布（间隔 51.4°，半径约 27px） */
    text-shadow:0 0 2px rgba(255,255,255,.35),0 1px 1px rgba(120,30,0,.4)}
  .sun i:nth-child(1){top:21.7%;left:50%}
  .sun i:nth-child(2){top:32.4%;left:72%}
  .sun i:nth-child(3){top:56.3%;left:77.5%}
  .sun i:nth-child(4){top:75.4%;left:62.3%}
  .sun i:nth-child(5){top:75.4%;left:37.7%}
  .sun i:nth-child(6){top:56.3%;left:22.5%}
  .sun i:nth-child(7){top:32.4%;left:28%}
  /* 阳光虚化：人物背后一团弥散暖光（无圆形边界） */
  .wash{position:absolute;z-index:0;width:460px;height:460px;right:-3%;top:50%;
    transform:translateY(-50%);pointer-events:none;border-radius:50%;
    background:radial-gradient(closest-side,
      rgba(255,238,205,.95) 0%,rgba(255,226,178,.62) 42%,
      rgba(255,236,214,.26) 68%,rgba(255,246,232,0) 100%);
    filter:blur(22px)}
  .figure{position:relative} /* 不加 z-index，避免形成堆叠上下文问题 */
  /* 主视觉为不透明 PNG，白底经 mix-blend-mode:multiply 融入背景；替换图片时保持同名覆盖即可 */
  .figure img{height:min(360px,46vh);width:auto;position:relative;z-index:5;
    mix-blend-mode:multiply} /* 图片不透明，禁用 drop-shadow（会投出矩形影子）；层次由 HeroWash 提供 */
  .float{position:absolute;z-index:6;right:0;top:auto;bottom:0; /* 胶囊底边与主视觉底边对齐；纵向排列（三项沿同一竖轴） */
    display:flex;flex-direction:column;align-items:center;gap:12px}
  .float a{display:flex;align-items:center;justify-content:center;width:44px;transition:.18s}
  .float img{width:44px;height:44px;border-radius:12px;box-shadow:0 4px 12px rgba(16,24,38,.10);
    transition:.18s}
  .float a:hover img{transform:translateY(-3px) scale(1.05)}
  .float a:active img{transform:scale(.96)}

  /* ================= 两栏主体 ================= */
  .cols{display:grid;grid-template-columns:1fr 288px;gap:30px;align-items:start;
    padding-top:26px}
  .main{min-width:0}

  /* ---------- 信息流 ---------- */
  .feed-group + .feed-group{margin-top:30px}
  .feed-cap{display:flex;align-items:baseline;justify-content:space-between;padding:6px 0 2px}
  .feed-cap .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--ink-3)}
  .feed-cap .v{font-family:var(--mono);font-size:11px;color:var(--ink-3)}

  /* MoreLink（C-58）：分组末尾「查看全部 N 篇 →」，点击进分组归档页；只有一层，不做页内二次展开 */
  .more{display:flex;align-items:center;justify-content:center;gap:8px;
    margin-top:16px;padding:12px 18px;border:1px solid var(--line);border-radius:12px;
    font-size:13px;font-weight:600;color:var(--ink-2);background:#fff;transition:.2s}
  .more span{transition:transform .2s}
  .more:hover{color:var(--teal-ink);border-color:rgba(20,179,166,.45);
    box-shadow:0 4px 14px rgba(20,120,110,.10)}
  .more:hover span{transform:translateX(3px)}
  .more:active{transform:scale(.995)}

  .row{display:flex;gap:18px;padding:20px 14px;border-bottom:1px solid var(--line);
    border-radius:14px;transition:.15s}
  .row:hover{background:var(--card);box-shadow:0 3px 14px rgba(16,24,38,.05)}
  .thumb{flex:none;position:relative;width:120px;height:84px;border-radius:10px;overflow:hidden;
    border:1px solid var(--line)}
  .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
  .row:hover .thumb img{transform:scale(1.04)}
  .txt{min-width:0;flex:1;display:block}
  .txt h2{font-size:17px;font-weight:700;line-height:1.5;color:var(--ink);transition:color .15s}
  .row:hover .txt h2{color:var(--teal-ink)}
  .txt p{font-size:13.5px;color:var(--ink-2);margin-top:5px;line-height:1.65;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .meta{display:flex;gap:13px;align-items:center;margin-top:9px;flex-wrap:wrap;
    font-family:var(--mono);font-size:11px;color:var(--ink-3)}
  .meta .t::before{content:"#";opacity:.55;margin-right:1px}
  .meta .st{color:var(--teal-ink)}
  .meta .st.dim{color:var(--ink-3)}
  .meta .st.pink{color:var(--pink-ink)}

  /* ---------- 占位尺寸标签 DimTag（v1.20）：默认隐藏，悬停显示于右下角 ---------- */
  .dim-tag{position:absolute;right:6px;bottom:6px;z-index:2;pointer-events:none;white-space:nowrap;
    font-family:var(--mono);font-size:10px;line-height:1;color:#fff;letter-spacing:.04em;
    background:rgba(16,24,38,.72);padding:4px 8px;border-radius:6px;
    opacity:0;transform:translateY(3px);transition:.18s}
  .thumb:hover .dim-tag,.rec-thumb:hover .dim-tag,.cover-img:hover .dim-tag{opacity:1;transform:none}
  .rec-thumb{position:relative;flex:none;width:56px;height:42px;border-radius:7px;overflow:hidden;
    border:1px solid var(--line)}
  .rec-thumb img{width:100%;height:100%;object-fit:cover}
  .rec-thumb .dim-tag{font-size:8px;padding:3px 5px;right:3px;bottom:3px;letter-spacing:0}
  /* 触屏无悬停：常显（小一号，不挡内容） */
  @media(hover:none){
    .dim-tag{opacity:.9;transform:none;font-size:9px;padding:3px 6px}
  }

  /* ---------- 侧栏 ---------- */
  .side{display:flex;flex-direction:column;gap:18px;position:sticky;top:18px}
  .side-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px}
  .side-title{font-size:13px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:8px;
    margin-bottom:14px}
  .side-title::before{content:"";width:4px;height:14px;border-radius:2px;background:var(--grad)}

  /* 关于我卡片（点击展开） */
  .about-toggle{all:unset;cursor:pointer;font-size:13px;font-weight:700;color:var(--ink);
    display:flex;align-items:center;gap:8px;margin-bottom:14px;width:100%;
    min-height:34px;justify-content:space-between}
  .about-toggle::before{content:"";width:4px;height:14px;border-radius:2px;background:var(--grad)}
  .about-toggle:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
  .about-toggle .chev{font-family:var(--mono);font-size:11px;color:var(--ink-3);
    transition:transform .2s;flex:none}
  .about-toggle[aria-expanded="true"] .chev{transform:rotate(45deg)}
  .about-mini{display:flex;gap:12px;align-items:center}
  .about-mini img{width:52px;height:52px;border-radius:13px;border:1px solid var(--line)}
  .about-mini .nm{font-weight:700;font-size:14.5px}
  .about-mini .ds{font-size:12px;color:var(--ink-3);margin-top:2px}
  .about-txt{font-size:12.5px;color:var(--ink-2);margin-top:12px;line-height:1.7}
  .about-more{display:none;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line)}
  .about-more.open{display:block}
  .kv-mini{display:grid;grid-template-columns:56px 1fr;gap:8px 12px;font-size:12.5px}
  .kv-mini dt{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);padding-top:3px;letter-spacing:.08em}
  .kv-mini dd{color:var(--ink-2);line-height:1.55;word-break:break-all}
  .kv-mini dd a{border-bottom:1px solid var(--line)}
  .kv-mini dd a:hover{color:var(--teal-ink);border-color:var(--teal)}
  .socials{display:flex;gap:10px;margin-top:14px}
  .socials a{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;
    font-size:12px;color:#fff;transition:.15s}
  .socials a:hover{transform:translateY(-2px)}
  .socials a:active{transform:scale(.94)}
  .so-gh{background:#24292e}.so-mail{background:var(--blue)}.so-rss{background:#f59e0b}.so-wx{background:#22c55e}

  .cloud{display:flex;flex-wrap:wrap;gap:8px}
  .cloud a{font-size:12px;padding:5px 12px;border-radius:99px;color:#fff;opacity:.92;transition:.15s}
  .cloud a:hover{opacity:1;transform:translateY(-1px)}
  .cg1{background:var(--teal)}.cg2{background:var(--blue)}.cg3{background:var(--pink)}
  .cg4{background:var(--violet)}.cg5{background:#f59e0b}.cg6{background:#64748b}

  .rec{display:flex;gap:11px;padding:9px 0;align-items:center}
  .rec + .rec{border-top:1px dashed var(--line)}
  .rec img{width:56px;height:42px;border-radius:7px;object-fit:cover;flex:none;border:1px solid var(--line)}
  .rec .rt{font-size:12.5px;line-height:1.5;color:var(--ink);display:-webkit-box;
    -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .rec:hover .rt{color:var(--teal-ink)}
  .rec .rd{font-family:var(--mono);font-size:10px;color:var(--ink-3);margin-top:3px;display:block}

  .flinks{display:flex;flex-wrap:wrap;gap:8px}
  .flinks a{font-size:12px;color:var(--ink-2);background:var(--bg);border:1px solid var(--line);
    border-radius:8px;padding:5px 11px;transition:.15s}
  .flinks a:hover{color:var(--teal-ink);border-color:var(--teal)}

  /* ================= 详情页 ================= */
  .back{display:inline-flex;align-items:center;gap:6px;margin:26px 0 0;
    font-size:13px;color:var(--ink-3);transition:.15s;min-height:34px}
  .back:hover{color:var(--teal-ink)}
  .back::before{content:"←";font-family:var(--mono)}
  .post{background:var(--card);border:1px solid var(--line);border-radius:16px;
    margin:18px 0 0;overflow:hidden}
  .post-head{padding:30px 34px 0}
  .post-head .kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
    color:var(--teal-ink);text-transform:uppercase}
  .post-head h1{font-size:25px;font-weight:700;line-height:1.45;margin:10px 0 12px;letter-spacing:-.01em}
  .post-meta{display:flex;gap:16px;flex-wrap:wrap;padding-bottom:22px;
    font-family:var(--mono);font-size:11px;color:var(--ink-3);border-bottom:1px solid var(--line)}
  .post-meta .st{color:var(--teal-ink)}
  .post-meta .st.dim{color:var(--ink-3)}
  .post-meta .st.pink{color:var(--pink-ink)}
  .cover{padding:22px 34px 0}
  .cover-img{position:relative;border-radius:12px} /* v1.20：包一层承载 DimTag */
  .cover img{width:100%;border-radius:12px;border:1px solid var(--line)}
  .cover figcaption{font-size:12px;color:var(--ink-3);text-align:center;padding-top:8px}
  .body{padding:24px 34px 34px;font-size:15.5px;line-height:1.95;color:var(--ink-2)}
  .body h3{font-size:17px;font-weight:700;color:var(--ink);margin:28px 0 8px;
    display:flex;align-items:center;gap:9px}
  .body h3:first-child{margin-top:0}
  .body h3::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--grad);flex:none}
  .body p{margin-bottom:13px}
  .body strong{color:var(--ink);font-weight:600}
  .body ul{margin:0 0 13px 20px}
  .body li{margin-bottom:6px}
  .body code{font-family:var(--mono);font-size:12.5px;background:#e7f6f4;
    color:var(--teal-ink);padding:1px 6px;border-radius:5px}
  /* ---------- Markdown 渲染结果（v1.21，见术语表第 7 节） ---------- */
  .body h4{font-size:15px;font-weight:700;color:var(--ink);margin:18px 0 6px}
  .body a{color:var(--teal-ink);border-bottom:1px solid rgba(20,184,166,.35)}
  .body a:hover{border-bottom-color:var(--teal)}
  .body img{width:100%;border-radius:12px;border:1px solid var(--line);margin:6px 0 14px}
  .body pre{margin:0 0 14px;padding:14px 16px;background:#f4f8fa;border:1px solid var(--line);
    border-radius:10px;overflow-x:auto;line-height:1.65}
  .body pre code{background:none;color:var(--ink-2);padding:0;font-size:12.5px;white-space:pre}
  .body blockquote{margin:0 0 14px;padding:4px 0 4px 14px;border-left:3px solid var(--line);
    color:var(--ink-3)}
  .body hr{border:0;border-top:1px solid var(--line);margin:22px 0}
  .body ul ul,.body ol ol,.body ul ol,.body ol ul{margin:2px 0 2px 16px;font-size:14.5px}
  .body .md-error{color:var(--pink-ink);font-size:13px}
  .post-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
    border-top:1px solid var(--line);padding:18px 34px;font-size:13px;background:#fbfdfe}
  .post-foot a{color:var(--ink-2);min-height:34px;display:inline-flex;align-items:center}
  .post-foot a:hover{color:var(--teal-ink)}

  /* ================= 404 ================= */
  .nf{padding:110px 0;text-align:center}
  .nf .code{font-family:var(--mono);font-size:58px;font-weight:700;
    background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .nf h2{font-size:20px;margin:8px 0 6px}
  .nf p{color:var(--ink-3);font-size:13.5px;margin-bottom:24px}
  .btn{display:inline-block;background:var(--teal);color:#fff;font-size:13.5px;
    padding:9px 22px;border-radius:99px;transition:.15s;min-height:34px}
  .btn:hover{background:var(--teal-ink)}

  /* ================= 归档页（P1a 项目 / P1b 生活，v1.24） ================= */
  .arc{max-width:780px;padding-top:34px;padding-bottom:20px}
  .arc-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;
    padding-bottom:14px;border-bottom:1px solid var(--line)}
  .arc-back{display:inline-block;font-family:var(--mono);font-size:11px;
    letter-spacing:.06em;color:var(--ink-3);margin-bottom:8px}
  .arc-back:hover{color:var(--teal-ink)}
  .arc-title{font-size:27px;font-weight:800;letter-spacing:-.01em;color:var(--ink);line-height:1.2}
  .arc-count{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);
    padding-bottom:5px;white-space:nowrap}
  .arc .feed-group{margin-top:6px}
  .arc-empty{color:var(--ink-3);font-size:13.5px;padding:44px 0;text-align:center}

  /* Pager（C-59）：只在多页时渲染；上一页 / 第 X / Y 页 / 下一页 */
  .pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:26px}
  .pager .pg{font-family:var(--mono);font-size:12px;padding:9px 16px;border-radius:10px;
    border:1px solid var(--line);background:#fff;color:var(--ink-2);transition:.2s}
  .pager a.pg:hover{color:var(--teal-ink);border-color:rgba(20,179,166,.45)}
  .pager .pg.off{opacity:.35;pointer-events:none}
  .pager .pg-info{font-family:var(--mono);font-size:11px;color:var(--ink-3)}

  /* ================= 页脚 ================= */
  footer{margin-top:64px;border-top:1px solid var(--line);background:var(--card)}
  .foot-in{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
    padding:22px 0 36px;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
  .foot-in a:hover{color:var(--teal-ink)}
  /* v1.32：右侧组（托管说明 / 关于入口 / 版本标记 C-62） */
  .foot-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
  .ver{color:var(--ink-3);opacity:.75;letter-spacing:.02em;white-space:nowrap}

  .view{display:none;animation:fade .22s ease}
  .view.on{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

  /* ================= 移动端 ================= */
  @media(max-width:900px){
    .cols{grid-template-columns:1fr}
    .side{position:static}
    .hero-main,.hero-note{padding-left:0}
  }
  @media(max-width:720px){
    .wrap{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
    .hero-in{grid-template-columns:1fr;gap:18px;padding-top:26px;padding-bottom:56px;min-height:0}
    .wordmark{font-size:52px}
    .tagline{font-size:15px;margin-top:12px}
    .scroll-pill{width:38px;height:50px;font-size:14px}
    .hero-main{position:static;transform:none} /* 移动端还原为流式排布，仍水平居中 */
    .hero-note{position:static;font-size:9.5px;margin-top:18px}
    .hero-art{order:-1;min-height:0}
    .figure img{height:min(280px,36vh)}
    .sun{width:48px;height:48px;left:max(8px,calc(50% - 172px));top:8px;transform:none}
    .sun i{font-size:7.5px}
    .wash{width:340px;height:340px;right:50%;transform:translate(50%,-50%);filter:blur(20px)}
    .float{flex-direction:row;right:50%;transform:translateX(50%);top:auto;bottom:-8px;gap:10px}
    .float a{width:38px}
    .float img{width:38px;height:38px}
    .arc{padding-top:24px}
    .arc-title{font-size:21px}
    .arc-count{font-size:10.5px}
    .more{padding:11px 14px;font-size:12.5px}
    .pager .pg{padding:8px 13px;font-size:11px}
    .row{gap:13px;padding:16px 8px}
    .thumb{width:96px;height:68px;border-radius:8px}
    .txt h2{font-size:15.5px}
    .txt p{-webkit-line-clamp:1;font-size:13px}
    .meta{gap:10px;font-size:10.5px}
    .post-head,.cover,.body{padding-left:20px;padding-right:20px}
    .post-foot{padding:16px 20px}
    .nf{padding:80px 0}
    .about-toggle{min-height:44px} /* 触屏点击热区 */
  }
  @media(max-width:340px){
    .wordmark{font-size:44px}
    .tagline{font-size:13px}
    .thumb{width:84px;height:60px}
    .txt h2{font-size:14.5px}
  }
  /* 触屏设备：去掉悬停依赖，点按即有反馈 */
  @media(hover:none){
    .row:hover{background:transparent;box-shadow:none}
    .row:hover .thumb img{transform:none}
    .row:active{background:var(--card)}
    .float a:hover img{transform:none}
  }