/* Tools 8-page shared shell + unified palette — 2026-08-24 */
:root{
  color-scheme:light;
  --tools-workbench:#f4f6f5;
  --tools-workbench-2:#f8f9f8;
  --tools-surface:#ffffff;
  --tools-line:#e1e5e2;
  --tools-line-strong:#d4dbd7;
  --tools-text:#202420;
  --tools-muted:#69736e;
  --tools-ink:#343b3a;
  --tools-footer:#292a25;
  --jp:#214f77;
  --learn:#2f776c;
  --travel:#b27b00;
  --font-serif:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --font-sans:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --page:#f4f6f5;
  --surface:#ffffff;
  --surface-soft:#f8f9f8;
  --surface-deep:#eef1ef;
  --text:#202420;
  --muted:#69736e;
  --line:#e1e5e2;
  --primary:#343b3a;
  --accent:#343b3a;
  --shadow:0 8px 24px rgba(41,49,45,.055);
}
html,body{background:var(--tools-workbench)!important;color:var(--tools-text)!important;background-image:none!important}
body{overflow-x:clip}

/* accessibility */
.site-skip-link.skip-link,.skip-link{
  position:fixed;left:12px;top:10px;z-index:1000;transform:translateY(-150%);
  background:#fff;border:1px solid var(--tools-ink);padding:8px 12px;color:var(--tools-text);text-decoration:none;font-size:12px
}
.site-skip-link.skip-link:focus,.skip-link:focus{transform:none}

/* shared tools header */
.tools-shell-head{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);border-bottom:1px solid var(--tools-line);backdrop-filter:blur(12px)}
.tools-shell-inner{width:min(1440px,calc(100% - 32px));min-height:78px;margin:auto;display:flex;align-items:center;gap:24px}
.tools-shell-brand{display:flex;align-items:center;gap:11px;flex:0 0 auto;color:var(--tools-text);text-decoration:none}
.tools-shell-mark{width:38px;height:38px;display:grid;place-items:center;border:1.5px solid var(--tools-ink);background:#fff;color:var(--tools-ink);font:500 20px/1 var(--font-serif);transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease}
.tools-shell-brand:hover .tools-shell-mark,.tools-shell-brand:focus-visible .tools-shell-mark{transform:translate(-2px,-2px);background:var(--tools-ink);color:#fff;box-shadow:5px 5px 0 #dfe5e2}
.tools-shell-brand:focus-visible{outline:3px solid rgba(52,59,58,.14);outline-offset:5px}
.tools-shell-copy strong{display:block;font-family:var(--font-serif);font-size:15px;line-height:1.25}
.tools-shell-copy small{display:block;margin-top:3px;color:#8b9490;font-size:9.5px;white-space:nowrap}
.tools-shell-nav{margin-left:auto;display:flex;align-items:center;gap:clamp(14px,2vw,28px);min-width:0;color:#66706c;font-size:12px;white-space:nowrap}
.tools-shell-nav a{position:relative;min-height:44px;display:inline-flex;align-items:center;padding:0 1px;color:#66706c;text-decoration:none;transition:color .16s ease}
.tools-shell-nav a::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:1.5px;background:var(--tools-ink);transform:scaleX(0);transform-origin:left;transition:transform .16s ease}
.tools-shell-nav a:hover,.tools-shell-nav a:focus-visible,.tools-shell-nav a[aria-current="page"]{color:var(--tools-text)}
.tools-shell-nav a:hover::after,.tools-shell-nav a:focus-visible::after,.tools-shell-nav a[aria-current="page"]::after{transform:scaleX(1)}

/* shared footer */
.tools-shell-footer{margin-top:56px;background:var(--tools-footer);color:#f2f2ed;padding:34px 0 40px}
.tools-shell-footer-inner{width:min(1120px,calc(100% - 72px));margin:auto;display:flex;justify-content:space-between;gap:30px}
.tools-shell-footer nav{display:flex;flex-wrap:wrap;gap:10px 18px}.tools-shell-footer a{color:inherit;text-decoration:none;font-size:10.5px}.tools-shell-footer a:hover{text-decoration:underline}.tools-shell-footer p{margin:0;color:#b9bbb4;font-size:10.5px}

/* all-tools /others workbench hierarchy */
.tools-home-v8 .home-hero{background:var(--tools-workbench)!important;border-bottom:1px solid var(--tools-line)}
.tools-home-v8 .home-hero::before,.tools-home-v8 .home-hero::after{content:none!important;display:none!important}
.tools-home-v8 #tool-search{background:#fff!important;border:1px solid var(--tools-line-strong)!important;box-shadow:0 8px 22px rgba(41,49,45,.045)!important}
.tools-home-v8 #tool-search input{background:#fff!important}.tools-home-v8 #tool-search:focus-within{border-color:#b7c0bc!important;box-shadow:0 10px 28px rgba(41,49,45,.07)!important}
.tools-home-v8 .tool-discovery{background:#fff!important;border-bottom:1px solid var(--tools-line)}
.tools-home-v8 .all-tools-section{background:var(--tools-workbench-2)!important}
.tools-home-v8 .discovery-layout>div,.tools-home-v8 .category-list{background:#fff!important;border-color:var(--tools-line)!important;box-shadow:none!important}
.tools-home-v8 .tool-card{border-color:var(--tools-line)!important;box-shadow:none!important;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background-color .16s ease}
.tools-home-v8 .tool-card:hover,.tools-home-v8 .tool-card:focus-visible{transform:translateY(-2px);border-color:#bbc5c0!important;box-shadow:0 9px 22px rgba(41,49,45,.06)!important}
.tools-home-v8 .tool-card small{opacity:1!important;font-weight:700!important;letter-spacing:.02em}
.tools-home-v8 .tool-card h3{opacity:1!important}.tools-home-v8 .tool-card p{opacity:1!important}
.tools-home-v8 .tool-card[data-theme="atlas"]{background:#f3f7fd!important;border-color:#d8e1ec!important}
.tools-home-v8 .tool-card[data-theme="terminal"]{background:#0f1c30!important;border-color:#2a3d59!important;color:#eef4fb!important}
.tools-home-v8 .tool-card[data-theme="terminal"] small{color:#b8c9db!important}.tools-home-v8 .tool-card[data-theme="terminal"] h3{color:#f7fbff!important;font-family:var(--font-mono)!important}.tools-home-v8 .tool-card[data-theme="terminal"] p{color:#d3deea!important}.tools-home-v8 .tool-card[data-theme="terminal"]>strong{color:#c7d7e8!important}
.tools-home-v8 .tool-card[data-theme="pure"]{background:#fff!important}
.tools-home-v8 .tool-card[data-theme="pixel"]{background:#f2f7f6!important;border-color:#d9e5e1!important}.tools-home-v8 .tool-card[data-theme="neon"]{background:#f1f8f7!important;border-color:#d5e6e2!important}.tools-home-v8 .tool-card[data-theme="studio"]{background:#f7f5fa!important;border-color:#e2dfea!important}.tools-home-v8 .tool-card[data-theme="notebook"]{background:#fbf8f1!important;border-color:#e9e1d2!important}.tools-home-v8 .tool-card[data-theme="paper"]{background:#fdfaf4!important;border-color:#e8e0d3!important}.tools-home-v8 .tool-card[data-theme="ledger"]{background:#f4f7f2!important;border-color:#dce4d8!important}
.tools-home-v8 .tool-card:not([data-theme="terminal"]) small{color:#68726d!important}.tools-home-v8 .tool-card:not([data-theme="terminal"]) h3{color:#202420!important}.tools-home-v8 .tool-card:not([data-theme="terminal"]) p{color:#69736e!important}.tools-home-v8 .tool-card:not([data-theme="terminal"])>strong{color:#343b3a!important}
.tools-home-v8 .tool-card[data-theme="atlas"] small,.tools-home-v8 .tool-card[data-theme="atlas"]>strong{color:#49677f!important}.tools-home-v8 .tool-card[data-theme="pixel"] small,.tools-home-v8 .tool-card[data-theme="pixel"]>strong,.tools-home-v8 .tool-card[data-theme="neon"] small,.tools-home-v8 .tool-card[data-theme="neon"]>strong{color:#4f7168!important}.tools-home-v8 .tool-card[data-theme="studio"] small,.tools-home-v8 .tool-card[data-theme="studio"]>strong{color:#71647b!important}.tools-home-v8 .tool-card[data-theme="notebook"] small,.tools-home-v8 .tool-card[data-theme="notebook"]>strong,.tools-home-v8 .tool-card[data-theme="paper"] small,.tools-home-v8 .tool-card[data-theme="paper"]>strong{color:#7c6b50!important}.tools-home-v8 .tool-card[data-theme="ledger"] small,.tools-home-v8 .tool-card[data-theme="ledger"]>strong{color:#5e7258!important}

/* category pages: same palette as /others */
.tool-category-page .category-hero{background:var(--tools-workbench)!important;color:var(--tools-text)!important;border-color:var(--tools-line)!important;box-shadow:none!important}.tool-category-page .category-hero::before,.tool-category-page .category-hero::after{content:none!important;display:none!important}.tool-category-page .category-hero h1,.tool-category-page .category-hero h2,.tool-category-page .category-hero h3{color:var(--tools-text)!important}.tool-category-page .category-hero p,.tool-category-page .category-hero small,.tool-category-page .category-hero span{color:var(--tools-muted)!important}.tool-category-page .category-hero .eyebrow{color:var(--tools-ink)!important}
.tool-category-page .hero-stat{background:#fff!important;border-color:var(--tools-line-strong)!important;color:var(--tools-text)!important;box-shadow:none!important}.tool-category-page .hero-stat strong{color:var(--tools-text)!important}.tool-category-page .hero-stat span,.tool-category-page .hero-stat p{color:var(--tools-muted)!important}
.tool-category-page .tool-grid{background:transparent!important}.tool-category-page .tool-card,.tool-category-page .tool-card.featured{background:#fff!important;color:var(--tools-text)!important;border-color:var(--tools-line)!important;box-shadow:none!important}.tool-category-page .tool-card h2,.tool-category-page .tool-card h3,.tool-category-page .tool-card strong{color:var(--tools-text)!important}.tool-category-page .tool-card p,.tool-category-page .tool-card small{color:var(--tools-muted)!important}.tool-category-page .tool-card>span{color:#6e7974!important}.tool-category-page .tool-card:hover,.tool-category-page .tool-card:focus-visible{background:#fff!important;border-color:#bcc6c1!important;box-shadow:0 8px 20px rgba(41,49,45,.055)!important}.tool-category-page .tool-card:hover h2,.tool-category-page .tool-card:focus-visible h2,.tool-category-page .tool-card:hover strong,.tool-category-page .tool-card:focus-visible strong{color:var(--tools-ink)!important}
.tool-category-page .content-section,.tool-category-page .reason-grid>*,.tool-category-page .table-shell,.tool-category-page .table-wrap,.tool-category-page .table-scroll{background:#fff!important;color:var(--tools-text)!important;border-color:var(--tools-line)!important;box-shadow:none!important}.tool-category-page .content-section h2,.tool-category-page .content-section h3,.tool-category-page .reason-grid h2,.tool-category-page .reason-grid h3,.tool-category-page .reason-grid strong{color:var(--tools-text)!important}.tool-category-page .content-section p,.tool-category-page .content-section small,.tool-category-page .reason-grid p,.tool-category-page .reason-grid small{color:var(--tools-muted)!important}
.tool-category-page table{background:#fff!important;color:var(--tools-text)!important;border-color:var(--tools-line)!important}.tool-category-page thead th,.tool-category-page th{background:var(--tools-workbench-2)!important;color:var(--tools-text)!important;border-color:var(--tools-line)!important}.tool-category-page tbody tr:nth-child(odd) td{background:#fff!important}.tool-category-page tbody tr:nth-child(even) td{background:var(--tools-workbench-2)!important}.tool-category-page td{color:var(--tools-muted)!important;border-color:var(--tools-line)!important}

@media(max-width:900px){.tools-shell-inner{display:grid;grid-template-columns:1fr;gap:8px;padding-top:10px}.tools-shell-nav{width:calc(100% + 32px);margin-left:-16px;padding:0 16px 4px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;border-top:1px solid var(--tools-line)}.tools-shell-nav::-webkit-scrollbar{display:none}.tools-shell-nav a{flex:0 0 auto;min-height:46px;font-size:11px}}
@media(max-width:720px){.tools-shell-head{position:relative}.tools-shell-inner{width:calc(100% - 28px);padding:11px 0 0}.tools-shell-mark{width:35px;height:35px;font-size:19px}.tools-shell-copy strong{font-size:14px}.tools-shell-copy small{font-size:8px}.tools-shell-nav{width:calc(100% + 28px);margin-left:-14px;gap:20px;padding:0 14px 3px;border-bottom:1px solid var(--tools-line)}.tools-shell-footer{margin-top:44px;padding:28px 0 32px}.tools-shell-footer-inner{width:calc(100% - 28px);display:block}.tools-shell-footer p{margin-top:10px}.tools-home-v8 #tool-search{box-shadow:none!important}.tools-home-v8 .tool-card:hover,.tools-home-v8 .tool-card:focus-visible,.tool-category-page .tool-card:hover,.tool-category-page .tool-card:focus-visible{transform:none;box-shadow:none!important}}
@media(max-width:390px){.tools-shell-inner,.tools-shell-footer-inner{width:calc(100% - 24px)}.tools-shell-nav{width:calc(100% + 24px);margin-left:-12px;padding-left:12px;padding-right:12px;gap:18px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}