/* 知識+ 主頁（/qa/）與首頁「知識+」那一頁共用的樣式：原版知識+ 的三欄骨架（左分類／中問題列表／右廣告），衣服換本站色票＋Y2K 虛華閃亮。
   日間：暖紙色底、墨紫字，閃亮元素是葡萄柚粉→淡紫的珠光漸層；夜間：墨色底加斜細紋（style.css），閃亮元素改粉紫霓虹發光。字永遠放在實色底上，閃亮的只有邊、章、底線、星星，不蓋字。
   節拍：172 BPM，一拍 349ms、半拍 174ms（kp.js 把時間寫進 --d）。減少動態：全部不動、直接是最後一格（沒有 .arm）。
   名條樣式在檔案最底下（從 qa.css 複製出來，因為首頁不能載入 qa.css：它會把整頁吸附關掉）。 */
:root{
  --kp-g1:oklch(84% .1 350);--kp-g2:oklch(86% .08 308);--kp-g3:oklch(97% .03 350);
  --kp-pearl:linear-gradient(120deg,var(--kp-g1),var(--kp-g3) 38%,var(--kp-g2) 68%,var(--kp-g1));
  --kp-glow:none;--kp-star:oklch(80% .12 330);--kp-bar:var(--kp-pearl);--kp-bar-ink:var(--ink);
  --kp-logo1:oklch(60% .21 355);--kp-logo2:oklch(50% .2 300);
  --kp-ok:color-mix(in oklch,var(--pink) 82%,var(--ink));
  --kp-ad-bg:linear-gradient(135deg,oklch(97% .03 350),oklch(94% .045 310));
}
[data-theme="night"]{
  --kp-g1:oklch(74% .17 352);--kp-g2:oklch(70% .17 305);--kp-g3:oklch(86% .1 330);
  --kp-glow:0 0 12px oklch(74% .17 352 / .55),0 0 2px oklch(86% .1 330 / .9);--kp-star:oklch(88% .12 330);
  --kp-bar:linear-gradient(120deg,oklch(32% .1 335),oklch(27% .08 300) 60%,oklch(32% .1 335));--kp-bar-ink:oklch(94% .02 330);
  --kp-logo1:oklch(84% .13 350);--kp-logo2:oklch(76% .15 305);
  --kp-ok:oklch(86% .12 350);
  --kp-ad-bg:linear-gradient(135deg,oklch(24% .045 330),oklch(22% .05 300));
}
.kp{position:relative;width:100%;max-width:1360px;margin:0 auto;--b:349ms}
/* 背景的細碎亮片（靜止的；閃一下的星星是 .kp-spark） */
.kp::before{content:"";position:absolute;inset:-10px 0 0;z-index:-1;pointer-events:none;opacity:.55;
  background:radial-gradient(circle,var(--kp-star) 0 1.4px,transparent 1.8px) 0 0/97px 83px,radial-gradient(circle,var(--kp-g2) 0 1px,transparent 1.4px) 41px 37px/61px 71px}
[data-theme="night"] .kp::before{opacity:.4}
.kp-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 14px}
.kp-logo{position:relative;margin:-12px -16px -12px -6px;padding:12px 16px 12px 6px;overflow:hidden;font:900 clamp(44px,6.4vw,78px)/1.1 var(--serif);letter-spacing:.04em;white-space:nowrap}
.kp-ch{display:inline-block;background:linear-gradient(180deg,var(--kp-logo1),var(--kp-logo2));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 oklch(99% .01 45 / .9)) drop-shadow(0 0 7px oklch(70% .15 340 / .25))}
[data-theme="night"] .kp-ch{filter:drop-shadow(0 0 8px oklch(74% .17 352 / .65))}
.kp-sheen{position:absolute;inset:0 -30% 0 -30%;pointer-events:none;mix-blend-mode:soft-light;opacity:0;
  background:linear-gradient(100deg,transparent 40%,#fff 50%,transparent 60%);transform:translateX(-100%) skewX(-16deg)}
.kp-ask{display:inline-flex;align-items:center;gap:.4em;flex:none;margin:0;padding:.35em 1.1em .4em;border:2px solid transparent;border-radius:999px;background:linear-gradient(var(--card),var(--card)) padding-box,var(--kp-pearl) border-box;box-shadow:var(--kp-glow);color:var(--kp-ok);font-weight:700;letter-spacing:.14em;cursor:var(--cur-hand,pointer);position:relative;overflow:hidden}
.kp-ask::after{content:"✦";font-size:.8em;color:var(--kp-g1);text-shadow:var(--kp-glow)}
[data-theme="night"] .kp-ask{color:var(--kp-g3);text-shadow:var(--kp-glow)}
.kp-ask::before{display:none!important}

/* 版面：桌機三欄；平板兩欄；手機單欄（頁首→問題列表→廣告欄→排行榜→分類） */
.kp-grid{display:grid;grid-template-columns:240px minmax(0,1fr) 288px;grid-template-areas:"cats mid ads" "lb mid ads";gap:18px;align-items:start}
.kp-cats{grid-area:cats}.kp-mid{grid-area:mid}.kp-ads{grid-area:ads}.kp-lb{grid-area:lb}
.kp-box{position:relative;border:2px solid transparent;border-radius:16px;background:linear-gradient(var(--card),var(--card)) padding-box,var(--kp-pearl) border-box;box-shadow:var(--kp-glow);overflow:hidden}
.kp-bh{margin:0;padding:7px 14px 6px;font:700 15px/1.6 var(--sans);letter-spacing:.14em;color:var(--kp-bar-ink);background:var(--kp-bar);position:relative}
.kp-bh::after{content:"";position:absolute;left:0;right:0;top:0;height:48%;background:linear-gradient(180deg,oklch(100% 0 0 / .55),transparent);pointer-events:none}
[data-theme="night"] .kp-bh{text-shadow:0 0 8px oklch(74% .17 352 / .8)}
[data-theme="night"] .kp-bh::after{background:linear-gradient(180deg,oklch(100% 0 0 / .1),transparent)}
.kp-bh>*{position:relative}
/* 左：分類 */
.kp-cats ul{list-style:none;margin:0;padding:6px 6px 8px}
.kp-cats button{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:.5em;width:100%;padding:7px 10px;border-radius:10px;cursor:var(--cur-hand,pointer);font:500 15px/1.5 var(--sans);letter-spacing:.04em;color:var(--ink);
  background:linear-gradient(var(--pink),var(--pink)) 50% calc(100% - 3px)/0% 1.5px no-repeat;transition:background-size .45s var(--ease)}
.kp-cats button::before{content:"✦";font-size:.75em;color:var(--kp-g1);opacity:0;transition:opacity .25s}
.kp-cats button:hover,.kp-cats button:focus-visible{background-size:calc(100% - 20px) 1.5px}
.kp-cats button[aria-pressed="true"]{background-color:var(--pink-soft);font-weight:700}
.kp-cats button[aria-pressed="true"]::before,.kp-cats button:hover::before{opacity:1}
.kp-cats button:focus-visible{outline:2px solid var(--pink);outline-offset:-2px}
/* 左下：排行榜 */
.kp-lb .lb-list{list-style:none;margin:0;padding:4px 10px 0}
.kp-lb .lb-list li{display:grid;grid-template-columns:1.5em 32px minmax(0,1fr) auto;gap:2px 8px;align-items:center;padding:7px 0;border-top:1px dashed var(--line-strong)}
.kp-lb .lb-list li:first-child{border-top:0}
.kp-lb .lb-rank{font:italic 800 17px/1 var(--latin);color:var(--muted);text-align:center}
.kp-lb .lb-list li:nth-child(1) .lb-rank{color:var(--kp-ok)}
.kp-lb .lb-who{min-width:0}
.kp-lb .lb-who .tag-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.kp-lb .lb-cnt{font:600 12.5px/1.4 var(--sans);color:var(--muted);text-align:right;white-space:nowrap}
.kp-lb .lb-cnt b{font:italic 800 17px/1 var(--latin);color:var(--ink);margin-right:.15em;font-variant-numeric:tabular-nums}
.kp-lb li.lb-empty{display:block;padding:10px 4px 6px;color:var(--muted);font-size:14px;letter-spacing:.04em;text-align:center;border:0}
.kp-lb .lb-empty .av{display:grid;margin:0 auto 6px}
.kp-lb .lb-howto{margin:8px 12px 10px;font-size:12.5px;line-height:1.7;color:var(--muted)}
.kp-lb .lb-howto code{font-size:.92em;padding:.05em .4em;background:var(--pink-soft);color:var(--ink);white-space:nowrap}
.kp-lb .lb-howto a{color:var(--kp-ok);font-weight:600}
.kp-tiers{margin:0 12px 12px;font-size:12.5px;color:var(--muted)}
.kp-tiers summary{cursor:var(--cur-hand,pointer);font-weight:600;letter-spacing:.06em;color:var(--kp-ok)}
.kp-tiers dl{margin:8px 0 0;display:grid;gap:4px}.kp-tiers dt{font-weight:700;letter-spacing:.06em}
.kp-tiers dd{margin:0;display:flex;flex-wrap:wrap;gap:5px}.kp-tiers .tag-name{font-size:12px;line-height:1.55}
.kp-tiers small{display:block;margin-top:8px;line-height:1.6}
/* 動物頭像：32×32 像素格 SVG、無外框線，外面只有一圈淡色圓底 */
.av{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--av-bg,var(--bg2));overflow:hidden;vertical-align:middle}
.av svg{display:block;width:100%;height:100%;image-rendering:pixelated}
.kp .av{width:32px;height:32px}
.kp-photo{flex:none;width:34px;height:34px;border-radius:50%;object-fit:cover;background:var(--bg2);display:block}

/* 中：頁籤＋列表 */
.kp-tabs{display:flex;gap:4px;padding:8px 10px 0;background:var(--kp-bar);position:relative}
.kp-tabs button{all:unset;box-sizing:border-box;padding:7px 18px 8px;border-radius:12px 12px 0 0;cursor:var(--cur-hand,pointer);font:700 15px/1.4 var(--sans);letter-spacing:.1em;color:var(--kp-bar-ink);position:relative}
.kp-tabs button[aria-selected="true"]{background:var(--card);color:var(--ink)}
.kp-tabs button:not([aria-selected="true"]):hover{background:oklch(100% 0 0 / .35)}
[data-theme="night"] .kp-tabs button:not([aria-selected="true"]):hover{background:oklch(100% 0 0 / .1)}
[data-theme="night"] .kp-tabs button[aria-selected="true"]{box-shadow:0 -2px 10px oklch(74% .17 352 / .5)}
.kp-tabs button:focus-visible{outline:2px solid var(--pink);outline-offset:-3px}
.kp-list{list-style:none;margin:0;padding:0 4px}
.kp-row[hidden]{display:none}
.kp-row+.kp-row{border-top:1px dashed var(--line-strong)}
.kp-q{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:13px 10px;color:inherit;text-decoration:none;cursor:var(--cur-hand,pointer);position:relative}
.kp-q:focus-visible{outline:2px solid var(--pink);outline-offset:-2px}
.kp-body{min-width:0;display:grid;gap:3px}
.kp-rc{display:flex;align-items:center;gap:.5em;font:700 12.5px/1.4 var(--sans);letter-spacing:.1em;color:var(--kp-ok)}
.kp-rc::before{content:"✦";font-size:.9em;color:var(--kp-g1);opacity:.55;transition:opacity .25s,transform .35s var(--ease)}
.kp-t{justify-self:start;max-width:100%;font:600 clamp(16px,1.5vw,19px)/1.5 var(--serif);letter-spacing:.03em;
  background:linear-gradient(var(--pink),var(--pink)) 50% 100%/0% 1.5px no-repeat;transition:background-size .45s var(--ease)}
.kp-q:hover .kp-t,.kp-q:focus-visible .kp-t{background-size:100% 1.5px}
.kp-q:hover .kp-rc::before,.kp-q:focus-visible .kp-rc::before{opacity:1;transform:scale(1.5) rotate(20deg);text-shadow:var(--kp-glow)}
.kp-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;font:500 13px/1.6 var(--sans);color:var(--muted)}
.kp-meta time{font:italic 400 13px/1.6 var(--latin)}
.kp-stamp{justify-self:end;display:inline-block;padding:2px 10px;font:700 14px/1.55 var(--sans);letter-spacing:.14em;white-space:nowrap;border-radius:8px;transform-origin:50% 50%}
.kp-stamp.ok{color:var(--kp-ok);border:2px solid currentColor;transform:rotate(-6deg);background:var(--pink-soft);box-shadow:var(--kp-glow)}
.kp-stamp.wait{color:var(--muted);border:1px dashed var(--line-strong)}
.kp-none{margin:0;padding:26px 10px;text-align:center;color:var(--muted);letter-spacing:.06em}
.kp-none[hidden]{display:none}
.kp-go{display:flex;justify-content:center;margin:18px 0 0}
.kp-go .go-in{align-self:center;font-size:clamp(17px,1.5vw,21px);padding:14px 14px;color:var(--kp-ok);font-weight:700}
.kp-go .go-in::before,.kp-go .go-in::after{opacity:.75;animation:kp-breath 2.8s ease-in-out infinite}
.kp-go .go-in::before{left:-14px;right:auto}.kp-go .go-in::after{right:-14px;left:auto}
.kp-go .go-in:hover::before,.kp-go .go-in:focus-visible::before{left:-18px;opacity:1}.kp-go .go-in:hover::after,.kp-go .go-in:focus-visible::after{right:-18px;opacity:1}
@keyframes kp-breath{50%{transform:scale(1.25);opacity:1}}

/* 右：廣告欄三格 */
.kp-ads{display:grid;gap:14px}
.kp-ad{position:relative;display:grid;align-items:center;gap:8px 12px;padding:14px 16px;border:2px solid transparent;border-radius:16px;overflow:hidden;color:var(--ink);text-decoration:none;min-height:104px;cursor:var(--cur-hand,pointer);
  background:var(--kp-ad-bg) padding-box,var(--kp-pearl) border-box;box-shadow:var(--kp-glow);font:inherit;text-align:left;width:100%;appearance:none;-webkit-appearance:none}
.kp-ad::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,oklch(100% 0 0 / .4),transparent 45%)}
[data-theme="night"] .kp-ad::after{background:linear-gradient(180deg,oklch(100% 0 0 / .07),transparent 45%)}
.kp-ad:focus-visible{outline:2px solid var(--pink);outline-offset:3px}
.kp-ad:hover{transform:translateY(-2px)}
.kp-ad{transition:transform .3s var(--ease)}
.ad-tx{position:relative;z-index:1;font:700 clamp(16px,1.3vw,18px)/1.5 var(--sans);letter-spacing:.06em}
.ad-tx small{display:block;font:500 12.5px/1.5 var(--sans);letter-spacing:.04em;color:var(--muted)}
.ad-ico{position:relative;z-index:1;display:block}
.ad-ico svg{display:block;overflow:visible}
.ad-bmc{grid-template-columns:auto 1fr;min-height:84px}
.ad-bmc .ad-ico svg{width:54px;height:54px}
.ad-rent{grid-template-columns:auto 1fr}
.ad-rent .ad-ico{width:82px;height:74px;align-self:start;margin-top:-14px;transform-origin:50% 0}
.ad-rent .ad-ico svg{width:82px;height:74px}
.ad-kat{grid-template-columns:auto 1fr}
.ad-kat .ad-ico{width:58px}
.ad-kat .ad-ico svg{width:58px;height:58px}
.ad-kat .shim{background:linear-gradient(100deg,oklch(52% .21 355) 0%,oklch(50% .2 300) 25%,oklch(55% .15 70) 50%,oklch(52% .21 355) 75%,oklch(50% .2 300) 100%) 0 0/220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:900;letter-spacing:.1em}
[data-theme="night"] .ad-kat .shim{background-image:linear-gradient(100deg,oklch(80% .15 352) 0%,oklch(80% .15 300) 25%,oklch(92% .12 95) 50%,oklch(80% .15 352) 75%,oklch(80% .15 300) 100%)}
.ad-cur{display:inline-block;width:.1em;height:1em;margin-left:.1em;vertical-align:-.12em;background:currentColor}

/* 瀏覽器要自己的游標、「點我進入」「我要發問」在預覽頁是 span，仍然像按鍵 */
.kp-prev{cursor:var(--cur-hand,pointer)}

/* 閒置的星星：每 6–10 秒一顆，同時最多一顆 */
.kp-spark{position:absolute;z-index:3;width:26px;height:26px;margin:-13px 0 0 -13px;pointer-events:none;color:var(--kp-g1);filter:drop-shadow(0 0 5px var(--kp-star));animation:kp-spark 1.3s ease-in-out both}
[data-theme="day"] .kp-spark{color:oklch(76% .15 340)}
.kp-spark svg{display:block;width:100%;height:100%;fill:currentColor}
@keyframes kp-spark{0%{transform:scale(0) rotate(0)}45%{transform:scale(1.15) rotate(70deg)}100%{transform:scale(0) rotate(150deg)}}

/* 小跳動：已解決章再蓋一下、頁首斜光 */
.kp-stamp.ok.again{animation:kp-stamp .6s var(--ease)}
@keyframes kp-stamp{0%{transform:rotate(-6deg) scale(1.7);opacity:.2}55%{transform:rotate(-6deg) scale(.93);opacity:1}100%{transform:rotate(-6deg) scale(1)}}
.kp-sheen.kgo{animation:kp-sheen .9s ease-in-out both}
@keyframes kp-sheen{0%{opacity:.9;transform:translateX(-100%) skewX(-16deg)}100%{opacity:.9;transform:translateX(100%) skewX(-16deg)}}

/* ---------- 進場（有 .arm 才藏起來，.kgo 開始；時間由 JS 寫進 --d，每項一拍） ---------- */
.kp.arm .kp-ch{opacity:0;transform:translateY(105%)}
.kp.arm.kgo .kp-ch{animation:kp-rise .42s var(--ease) both;animation-delay:calc(var(--i) * 174ms + var(--d0,0ms))}
@keyframes kp-rise{from{opacity:0;transform:translateY(105%)}to{opacity:1;transform:none}}
.kp.arm [data-step]{opacity:0}
.kp.arm.kgo [data-step]{animation:kp-box .5s var(--ease) both;animation-delay:var(--d,0ms)}
@keyframes kp-box{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.kp.arm .kp-row{opacity:0}
.kp.arm.kgo .kp-row.fly{animation:kp-slide .5s var(--ease) both;animation-delay:var(--d,0ms)}
.kp.arm.kgo .kp-row:not(.fly){opacity:1}
@keyframes kp-slide{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}
.kp.arm .kp-ask,.kp.arm .kp-go{opacity:0}
.kp.arm.kgo .kp-ask{animation:kp-box .5s var(--ease) both;animation-delay:var(--d0,0ms)}
.kp.arm.kgo .kp-go{animation:kp-box .6s var(--ease) both;animation-delay:var(--dgo,4200ms)}
/* 廣告：.on 才開始（JS 加）；字一個一個出現 */
.kp.arm .ad-tx .ch,.kp.arm .ad-cur{visibility:hidden}
.kp.arm .kp-ad.on .ad-tx .ch{animation:kp-vis .01s step-end both;animation-delay:calc(var(--t0,0ms) + 300ms + var(--i) * 85ms)}
.kp.arm .kp-ad.on .ad-cur{animation:kp-vis .01s step-end both,kp-blink .9s step-end 3 both;animation-delay:calc(var(--t0,0ms) + 300ms),calc(var(--t0,0ms) + 300ms + var(--n) * 85ms)}
@keyframes kp-vis{from{visibility:hidden}to{visibility:visible}}
@keyframes kp-blink{0%,100%{visibility:hidden}0.01%,45%{visibility:visible}50%{visibility:hidden}}
/* ① 咖啡：杯子從左滑入彈一下；三條蒸氣一條一條冒，之後慢慢持續冒 */
.kp.arm .ad-bmc:not(.on) .ad-ico{opacity:0;transform:translateX(-90px)}
.kp.arm .ad-bmc.on .ad-ico{animation:kp-cup .8s cubic-bezier(.34,1.5,.5,1) both}
@keyframes kp-cup{0%{opacity:0;transform:translateX(-90px)}60%{opacity:1;transform:translateX(6px)}80%{transform:translateX(-3px)}100%{opacity:1;transform:none}}
.steam{fill:none;stroke:var(--muted);stroke-width:2.4;stroke-linecap:round;opacity:.0}
.kp.arm .ad-bmc.on .steam{animation:kp-steam 3.2s ease-in-out infinite both;animation-delay:calc(700ms + var(--s) * 349ms)}
.kp:not(.arm) .steam{opacity:.7}
@keyframes kp-steam{0%{opacity:0;transform:translateY(5px)}25%{opacity:.8}70%{opacity:.5}100%{opacity:0;transform:translateY(-7px)}}
/* ② 招租：吊牌從上面掉下來晃兩下停住；之後每 8 秒晃一次（.swing 由 JS 加） */
.kp.arm .ad-rent:not(.on) .ad-ico{opacity:0;transform:translateY(-120%)}
.kp.arm .ad-rent.on .ad-ico{animation:kp-drop 1.6s ease-out both}
.kp.arm .ad-rent.on .ad-ico.swing{animation:kp-swing 1.2s ease-in-out both}
@keyframes kp-drop{0%{opacity:0;transform:translateY(-120%) rotate(0)}30%{opacity:1;transform:translateY(0) rotate(0)}48%{transform:rotate(11deg)}66%{transform:rotate(-8deg)}82%{transform:rotate(3deg)}100%{transform:rotate(0)}}
@keyframes kp-swing{0%{transform:rotate(0)}25%{transform:rotate(9deg)}55%{transform:rotate(-6deg)}80%{transform:rotate(2deg)}100%{transform:rotate(0)}}
/* ③ Katsuji：鍵帽從下面彈上來、像被按下去壓一下；字一個一個出現；滑鼠移上去再按一下 */
.kp.arm .ad-kat:not(.on) .ad-ico{opacity:0;transform:translateY(130%)}
.kp.arm .ad-kat.on .ad-ico{animation:kp-keyin .9s cubic-bezier(.3,1.4,.5,1) both}
@keyframes kp-keyin{0%{opacity:0;transform:translateY(130%)}45%{opacity:1;transform:translateY(-14%)}62%{transform:translateY(0) scaleY(1)}76%{transform:translateY(8%) scaleY(.82)}100%{opacity:1;transform:none}}
.kp-ad.ad-kat:hover .ad-ico,.kp-ad.ad-kat.press .ad-ico{animation:kp-press .35s ease-out both}
.kp.arm .kp-ad.ad-kat.on:hover .ad-ico{animation:kp-press .35s ease-out both}
@keyframes kp-press{0%{transform:none}45%{transform:translateY(8%) scaleY(.82)}100%{transform:none}}
.kp.arm .ad-kat.on .shim{animation:kp-shim 3.4s linear infinite}
@keyframes kp-shim{to{background-position:-220% 0}}
.kp:not(.arm) .ad-kat .shim{animation:none}

/* 訂閱卡（/qa/ 的 Katsuji 廣告打開的，卡片用網站現成的 .notify-box／.notify，表單網址跟首頁同一個） */
.kp-sub{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;background:oklch(12% .02 330 / .55)}
.kp-sub[hidden]{display:none}
.kp-sub .notify-box{position:relative;left:auto;top:auto;transform:none;opacity:1;pointer-events:auto;width:min(92vw,440px);box-shadow:0 30px 80px oklch(15% .02 340 / .35);max-height:92svh;overflow:auto}
.kp-sub .kp-sub-x{align-self:flex-end;margin:-10px -12px -6px 0}

/* ---------- 首頁「知識+」那一頁 ---------- */
.qaplus{justify-content:flex-start;gap:0;padding-top:clamp(72px,10svh,96px);padding-bottom:clamp(20px,4svh,40px);cursor:var(--cur-hand,pointer)}
.qaplus .kp{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:center}
.qaplus .kp-head{margin-bottom:10px}
.qaplus .kp-logo{font-size:clamp(40px,min(6.4vw,9svh),72px)}
.qaplus .kp-row,.qaplus .kp-ad{cursor:var(--cur-hand,pointer)}
.qaplus .kp-q{padding-top:10px;padding-bottom:10px}
.qaplus .kp-lb .lb-howto,.qaplus .kp-tiers{display:none}
.qaplus .kp-ad{min-height:88px;padding-top:10px;padding-bottom:10px}
.qaplus .kp-ads{gap:10px}
.qaplus .kp-go{margin-top:10px}
.qaplus .kp-ad:hover{transform:none}

@media (max-width:1023px){
  .kp-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"mid mid" "ads ads" "cats lb"}
  .kp-ads{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kp-ad{grid-template-columns:1fr!important;justify-items:start;align-content:start}
  .ad-rent .ad-ico{margin-top:-6px}
}
@media (max-width:719px){
  .kp-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"mid" "ads" "lb" "cats"}
  .kp-ads{grid-template-columns:1fr}
  .kp-ad{grid-template-columns:auto 1fr!important;align-items:center}
  .kp-q{grid-template-columns:30px minmax(0,1fr) auto;grid-template-areas:"ph rc st" "ph t t" "ph meta meta";gap:2px 10px;padding:12px 6px;align-items:start}
  .kp-body{display:contents}
  .kp-photo{grid-area:ph;width:30px;height:30px;margin-top:2px}
  .kp-rc{grid-area:rc}.kp-t{grid-area:t}.kp-meta{grid-area:meta;gap:2px 8px}
  .kp-stamp{grid-area:st;justify-self:end;align-self:center}
  .kp-logo{font-size:clamp(40px,12vw,56px)}
  .kp-tabs button{padding:6px 14px 7px}
  /* 首頁那一頁（手機）：全部擠進一個螢幕——列表緊一點、廣告縮成一行、分類改成一排小標籤 */
  .qaplus{padding-top:72px;padding-bottom:calc(var(--tab-h) + 12px + env(safe-area-inset-bottom))}
  .qaplus .kp{justify-content:flex-start}
  .qaplus .kp-head{margin:0 0 6px}
  .qaplus .kp-logo{font-size:44px}
  .qaplus .kp-grid{gap:8px}
  .qaplus .kp-q{padding:6px 4px;gap:0 10px}
  .qaplus .kp-photo{width:26px;height:26px}
  .qaplus .kp-q{grid-template-columns:26px minmax(0,1fr) auto}
  .qaplus .kp-meta{flex-wrap:nowrap;white-space:nowrap;font-size:11.5px}
  .qaplus .kp-meta .tag-lv{font-size:11px}
  .qaplus .kp-meta time{font-size:11.5px}
  .qaplus .kp-t{font-size:14.5px;line-height:1.4;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .qaplus .kp-body,.qaplus .kp-t{min-width:0}
  .qaplus .kp-q{overflow:hidden}
  .qaplus .kp-cats .kp-bh{display:none}
  .qaplus .kp-bh{display:block}
  .qaplus .kp-rc,.qaplus .kp-meta{font-size:12px;line-height:1.4}
  .qaplus .kp-stamp{font-size:12.5px;padding:0 8px}
  .qaplus .kp-meta .nm .tag-name{font-size:12px;line-height:1.5}
  .qaplus .kp-ads{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .qaplus .kp-ad{grid-template-columns:1fr!important;min-height:0;padding:8px 6px;gap:2px;justify-items:center;text-align:center}
  .qaplus .kp-ad .ad-tx{font-size:12.5px;line-height:1.35;letter-spacing:.02em}
  .qaplus .ad-bmc .ad-ico svg,.qaplus .ad-kat .ad-ico svg{width:34px;height:34px}
  .qaplus .ad-rent .ad-ico,.qaplus .ad-rent .ad-ico svg{width:50px;height:46px}
  .qaplus .ad-rent .ad-ico{margin:-8px 0 0}
  .qaplus .ad-kat .ad-ico{width:34px}
  .qaplus .kp-lb .lb-howto{display:none}
  .qaplus .kp-lb .kp-bh{padding:2px 12px 1px;font-size:13px}
  .qaplus .kp-logo{font-size:40px}
  .qaplus .kp-ask{padding:.2em .9em .25em;font-size:14px}
  .qaplus .kp-lb li.lb-empty{padding:3px 4px 4px}
  .qaplus .kp-cats ul{display:flex;flex-wrap:wrap;gap:2px 4px;padding:4px 6px 6px}
  .qaplus .kp-cats button{width:auto;padding:3px 9px;font-size:13px}
  .qaplus .kp-lb li.lb-empty{padding:4px 4px 6px;font-size:13px}
  .qaplus .kp-lb .lb-empty .av{display:none}
  .qaplus .kp-go{margin-top:4px}
  .qaplus .kp-go .go-in{padding:8px 12px}
  .qaplus .kp-tabs{padding-top:5px}
  .qaplus .kp-tabs button{padding:4px 12px 5px;font-size:14px}
  .qaplus .kp-none{padding:16px 10px}
}
@media (max-height:600px){
  .qaplus{padding-top:60px;padding-bottom:calc(var(--tab-h) + 8px)}
  .qaplus .kp-ads,.qaplus .kp-lb,.qaplus .kp-cats{display:none}
  .qaplus .kp-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"mid"}
}
@media (prefers-reduced-motion:reduce){
  .kp *,.kp *::before,.kp *::after{animation:none!important;transition:none!important}
  .kp-spark{display:none}
}
/* ---------- 名條（可重用：排行榜之後也用）----------
   .nm 把名條跟等級排成一行；.tag-name 是名條本體；顏色／效果用 .tag-rainbow／.tag-moon／.tag-forest／.tag-gold／.tag-fruit；等級章用 .tag-lv + .tag-lv1／2／3。
   日夜主題各一組色（深淺底都要看得清楚）；減少動態時漸層停在靜態那一格。 */
.nm{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 8px;vertical-align:middle}
.tag-name{display:inline-block;padding:0 .7em;border:1px solid var(--line-strong);border-radius:999px;font:700 14px/1.75 var(--sans);letter-spacing:.06em;white-space:nowrap;vertical-align:middle}
/* 彩虹：漸層文字，每 7 秒平移一整個色循環（Discord 漸層名條那種） */
.tag-rainbow{--rb1:oklch(60% .22 20);--rb2:oklch(66% .17 55);--rb3:oklch(66% .15 100);--rb4:oklch(60% .17 150);--rb5:oklch(58% .17 235);--rb6:oklch(55% .21 300);
  color:transparent;-webkit-text-fill-color:transparent;border-color:color-mix(in oklch,var(--rb5) 40%,transparent);
  background:linear-gradient(90deg,var(--rb1),var(--rb2),var(--rb3),var(--rb4),var(--rb5),var(--rb6),var(--rb1)) 0 0 / 200px 100% repeat-x;
  -webkit-background-clip:text;background-clip:text;animation:tag-flow 7s linear infinite}
[data-theme="night"] .tag-rainbow{--rb1:oklch(76% .17 20);--rb2:oklch(82% .13 60);--rb3:oklch(88% .15 105);--rb4:oklch(80% .17 150);--rb5:oklch(78% .13 235);--rb6:oklch(76% .16 300)}
@keyframes tag-flow{to{background-position:200px 0}}
/* 月光：深夜底板上，銀白漸到淡紫，慢慢流動（板子日夜都是深色，字才看得清楚） */
.tag-moon{color:transparent;-webkit-text-fill-color:transparent;border-color:oklch(72% .08 300 / .6);
  background:linear-gradient(90deg,oklch(97% .008 260),oklch(86% .06 290),oklch(78% .12 305),oklch(86% .06 290),oklch(97% .008 260)) 0 0 / 120px 100% repeat-x,
    oklch(26% .05 290);
  -webkit-background-clip:text,padding-box;background-clip:text,padding-box;animation:tag-flow-moon 9s linear infinite}
@keyframes tag-flow-moon{to{background-position:120px 0,0 0}}
/* 單色名條：從本站色票挑（葉綠、金、果肉橘），字色往墨色靠一點，淺色底也讀得到 */
.tag-forest,.tag-gold,.tag-fruit{color:color-mix(in oklch,var(--c) 52%,var(--ink));background:color-mix(in oklch,var(--c) 15%,transparent);border-color:color-mix(in oklch,var(--c) 50%,transparent)}
.tag-forest{--c:var(--forest)}
.tag-gold{--c:var(--gold)}
.tag-fruit{--c:var(--fruit)}
/* 等級章：小方塊，等級越高越亮 */
.tag-lv{display:inline-block;padding:0 .55em;border:1px solid currentColor;font:700 12px/1.7 var(--sans);letter-spacing:.08em;white-space:nowrap;vertical-align:middle}
.tag-lv1{color:var(--muted)}
.tag-lv2{color:color-mix(in oklch,var(--forest) 60%,var(--ink))}
.tag-lv3{color:var(--pink);background:var(--pink-soft)}
/* ---------- 名條顏色（機器人 qa-bot 的 COLORS 一一對應：tag-<id>）----------
   單色（1–2 級）：pink 葡萄柚粉、fruit 果肉橘、gold 蜜金（上面那組）、butter 鵝黃、mint 薄荷綠、sky 天空藍
   兩色漸層（3–5 級）：sunset 日落、meadow 草地、sea 海汐、lilac 丁香
   流動彩條（6 級以上）：candy 糖漿、aurora 極光、soda 汽水
   保留：rainbow 彩虹（太空葡萄柚）、moon 月光（知識長）。 */
:root{--np-butter:oklch(52% .11 85);--np-pink:oklch(56% .2 355);--np-fruit:oklch(64% .14 45);--np-gold:oklch(62% .12 82);--np-mint:oklch(56% .12 155);--np-sky:oklch(56% .13 240);--np-violet:oklch(54% .17 300);--np-teal:oklch(58% .1 195);--np-lime:oklch(66% .14 118)}
[data-theme="night"]{--np-butter:oklch(88% .12 95);--np-pink:oklch(76% .15 352);--np-fruit:oklch(78% .12 50);--np-gold:oklch(82% .12 88);--np-mint:oklch(80% .14 155);--np-sky:oklch(78% .11 240);--np-violet:oklch(76% .15 300);--np-teal:oklch(80% .1 195);--np-lime:oklch(88% .15 118)}
.tag-pink,.tag-butter,.tag-mint,.tag-sky{color:color-mix(in oklch,var(--c) 52%,var(--ink));background:color-mix(in oklch,var(--c) 15%,transparent);border-color:color-mix(in oklch,var(--c) 50%,transparent)}
.tag-fruit{--c:var(--np-fruit)}.tag-gold{--c:var(--np-gold)}
.tag-pink{--c:var(--np-pink)}.tag-butter{--c:var(--np-butter)}.tag-mint{--c:var(--np-mint)}.tag-sky{--c:var(--np-sky)}
/* 漸層／流動：文字漸層＋淡底；流動的那排每 7 秒平移一個色循環 */
.tag-sunset,.tag-meadow,.tag-sea,.tag-lilac,.tag-candy,.tag-aurora,.tag-soda{color:transparent;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;
  border-color:color-mix(in oklch,var(--g2) 45%,transparent)}
.tag-sunset{--g1:var(--np-fruit);--g2:var(--np-pink)}
.tag-meadow{--g1:var(--np-mint);--g2:var(--np-gold)}
.tag-sea{--g1:var(--np-sky);--g2:var(--np-mint)}
.tag-lilac{--g1:var(--np-pink);--g2:var(--np-violet)}
.tag-sunset,.tag-meadow,.tag-sea,.tag-lilac{background-image:linear-gradient(90deg,var(--g1),var(--g2))}
.tag-candy{--g1:var(--np-pink);--g2:var(--np-fruit);--g3:var(--np-gold)}
.tag-aurora{--g1:var(--np-mint);--g2:var(--np-sky);--g3:var(--np-violet)}
.tag-soda{--g1:var(--np-sky);--g2:var(--np-teal);--g3:var(--np-lime)}
.tag-candy,.tag-aurora,.tag-soda{background-image:linear-gradient(90deg,var(--g1),var(--g2),var(--g3),var(--g1));background-size:200px 100%;background-repeat:repeat-x;animation:tag-flow 7s linear infinite}

/* 減少動態：名條漸層停住 */
@media (prefers-reduced-motion:reduce){.tag-rainbow,.tag-moon,.tag-candy,.tag-aurora,.tag-soda{animation:none}}

.kp:not(.arm) .ad-cur{display:none}
.kp-main{flex:1;padding:6px var(--gut) 64px}

/* 真題目列的動物頭像：跟 .kp-photo 同大同位置 */
.kp-q>.av{width:34px;height:34px}
@media (max-width:719px){
  .kp-q>.av{grid-area:ph;width:30px;height:30px;margin-top:2px}
  .qaplus .kp-q>.av{width:26px;height:26px}
}
.av-photo{flex:none;display:block;border-radius:50%;object-fit:cover;background:var(--bg2)}   /* qdata.js 的 avatar()：莉亞用相片 */