/* 前 111 個工具頁的相容式視覺層；保留各頁既有 Gemini 主色。 */
body[data-classic-tool]{
  --tool-visual-accent:var(--classic-accent,#38bdf8);
  --tool-visual-accent-rgb:var(--classic-accent-rgb,56,189,248);
  --classic-line:rgba(var(--classic-accent-rgb,56,189,248),.24);
  --classic-glow:rgba(var(--classic-accent-rgb,56,189,248),.16);
}
body[data-classic-tool] .classic-main{position:relative;min-width:0}
body[data-classic-tool] .classic-hero{
  position:relative;
  width:100%;
  max-width:68rem;
  min-width:0;
  margin:0 auto 2rem!important;
  padding:2rem clamp(1rem,4vw,3rem) 2.15rem;
  border:1px solid var(--classic-line);
  border-radius:1.6rem;
  background:
    radial-gradient(circle at 50% 0,rgba(var(--classic-accent-rgb),.15),transparent 19rem),
    linear-gradient(145deg,rgba(var(--classic-accent-rgb),.075),rgba(15,23,42,.56) 52%,rgba(var(--classic-accent-rgb),.035));
  box-shadow:0 30px 90px -54px rgba(var(--classic-accent-rgb),.92),inset 0 1px rgba(255,255,255,.045);
  overflow:hidden;
  isolation:isolate;
}
body[data-classic-tool] .classic-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:19rem;
  height:19rem;
  left:50%;
  top:-16rem;
  transform:translateX(-50%);
  border-radius:50%;
  background:var(--classic-accent);
  filter:blur(68px);
  opacity:.25;
  pointer-events:none;
}
body[data-classic-tool] .classic-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(115deg,transparent 34%,rgba(255,255,255,.035) 50%,transparent 66%);
  transform:translateX(-105%);
  animation:classic-sheen 9s ease-in-out infinite;
  pointer-events:none;
}
@keyframes classic-sheen{0%,68%,100%{transform:translateX(-105%)}82%{transform:translateX(105%)}}
body[data-classic-tool] .classic-hero-title{
  position:relative;
  z-index:1;
  max-width:56rem;
  margin:.85rem auto .6rem!important;
  font-size:clamp(2rem,5vw,3.4rem)!important;
  line-height:1.12!important;
  letter-spacing:-.035em!important;
  text-wrap:balance;
  overflow-wrap:anywhere;
}
body[data-classic-tool] .classic-hero-kicker{
  position:relative;
  z-index:1;
  border-color:var(--classic-line)!important;
  background:rgba(var(--classic-accent-rgb),.075)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.06),0 9px 26px -18px var(--classic-accent)!important;
}
body[data-classic-tool] .classic-hero-lead{
  position:relative;
  z-index:1;
  max-width:49rem!important;
  margin-inline:auto!important;
  font-size:clamp(.92rem,2vw,1.04rem)!important;
  line-height:1.75!important;
  text-wrap:pretty;
}
body[data-classic-tool] .classic-hero-mark{
  position:absolute;
  z-index:0;
  display:grid;
  place-items:center;
  width:4.4rem;
  height:4.4rem;
  left:50%;
  top:1.4rem;
  transform:translateX(-50%);
  border:1px solid rgba(var(--classic-accent-rgb),.38);
  border-radius:1.25rem;
  color:var(--classic-accent);
  background:linear-gradient(145deg,rgba(var(--classic-accent-rgb),.2),rgba(var(--classic-accent-rgb),.055));
  box-shadow:0 16px 42px -21px var(--classic-accent),inset 0 1px rgba(255,255,255,.1);
}
body[data-classic-tool] .classic-hero-mark svg{width:2rem;height:2rem;filter:drop-shadow(0 0 12px var(--classic-accent))}
body[data-classic-tool] .classic-hero-mark span{
  position:absolute;
  inset:-1.15rem;
  border:1px dashed rgba(var(--classic-accent-rgb),.22);
  border-radius:1.65rem;
}
body[data-classic-tool] .classic-card{
  border-color:var(--classic-line)!important;
  box-shadow:0 24px 72px -38px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.018) inset!important;
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease!important;
}
body[data-classic-tool] .classic-card:hover{
  border-color:rgba(var(--classic-accent-rgb),.43)!important;
  box-shadow:0 30px 82px -40px rgba(var(--classic-accent-rgb),.5),0 0 0 1px rgba(255,255,255,.025) inset!important;
}
body[data-classic-tool] .classic-card :is(input,textarea,select,[contenteditable=true]):focus{
  border-color:var(--classic-accent)!important;
  box-shadow:0 0 0 3px rgba(var(--classic-accent-rgb),.12)!important;
}
body[data-classic-tool] .classic-card :is(button,[role=button]).primary,
body[data-classic-tool] .classic-card :is(button,[role=button])[class*="bg-primary"],
body[data-classic-tool] .classic-card :is(button,[role=button])[class*="bg-hub-accent"]{
  box-shadow:0 13px 34px -17px rgba(var(--classic-accent-rgb),.9)!important;
}
body[data-classic-tool] .classic-seo{position:relative;margin-top:3.5rem}
body[data-classic-tool] .classic-seo :is(h2,h3,summary):hover{color:var(--classic-accent)}

/* 01 Aurora */
body[data-classic-layout=aurora] .classic-hero{padding-top:7.15rem;text-align:center}
body[data-classic-layout=aurora] .classic-hero-mark span{border-radius:50%;animation:classic-orbit 18s linear infinite}
body[data-classic-layout=aurora] .classic-card{border-radius:1.55rem!important}
@keyframes classic-orbit{to{transform:rotate(360deg)}}

/* 02 Split */
body[data-classic-layout=split] .classic-hero{text-align:left;padding:2.5rem 12rem 2.5rem 3rem}
body[data-classic-layout=split] .classic-hero::before{left:auto;right:-4rem;top:-9rem;transform:none}
body[data-classic-layout=split] .classic-hero-title,
body[data-classic-layout=split] .classic-hero-lead{margin-inline:0!important}
body[data-classic-layout=split] .classic-hero-mark{left:auto;right:3.25rem;top:50%;width:7rem;height:7rem;transform:translateY(-50%) rotate(6deg);border-radius:2rem}
body[data-classic-layout=split] .classic-hero-mark svg{width:3rem;height:3rem}
body[data-classic-layout=split] .classic-hero-mark span{inset:-1rem;border-radius:2.4rem}
body[data-classic-layout=split] .classic-workspace>.classic-card:nth-child(odd){border-radius:1.5rem .65rem 1.5rem .65rem!important}
body[data-classic-layout=split] .classic-workspace>.classic-card:nth-child(even){border-radius:.65rem 1.5rem .65rem 1.5rem!important}

/* 03 Blueprint */
body[data-classic-layout=blueprint] .classic-hero{text-align:left;padding:2.15rem 2.3rem 2.15rem 8.8rem;border-width:2px;border-radius:.45rem;background-image:linear-gradient(rgba(var(--classic-accent-rgb),.09) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--classic-accent-rgb),.09) 1px,transparent 1px),linear-gradient(145deg,rgba(var(--classic-accent-rgb),.1),rgba(9,18,33,.9));background-size:22px 22px,22px 22px,auto}
body[data-classic-layout=blueprint] .classic-hero-title,
body[data-classic-layout=blueprint] .classic-hero-lead{margin-inline:0!important}
body[data-classic-layout=blueprint] .classic-hero-title{font-family:"Fira Code",monospace}
body[data-classic-layout=blueprint] .classic-hero-mark{left:2.2rem;top:50%;transform:translateY(-50%);border-radius:.3rem}
body[data-classic-layout=blueprint] .classic-hero-mark span{border-radius:.25rem}
body[data-classic-layout=blueprint] .classic-card{border-radius:.4rem!important}

/* 04 Terminal */
body[data-classic-layout=terminal] .classic-hero{text-align:left;padding:3.8rem 6rem 2rem 2rem;border-radius:.75rem;background:linear-gradient(160deg,rgba(2,8,18,.97),rgba(var(--classic-accent-rgb),.085))}
body[data-classic-layout=terminal] .classic-hero::before{width:.62rem;height:.62rem;left:1.3rem;top:1.3rem;transform:none;filter:none;opacity:1;background:#fb7185;box-shadow:1rem 0 #fbbf24,2rem 0 #34d399}
body[data-classic-layout=terminal] .classic-hero::after{inset:2.8rem 0 auto;height:1px;transform:none;animation:none;background:rgba(var(--classic-accent-rgb),.16)}
body[data-classic-layout=terminal] .classic-hero-title,
body[data-classic-layout=terminal] .classic-hero-lead{margin-inline:0!important}
body[data-classic-layout=terminal] .classic-hero-title{font-family:"Fira Code",monospace}
body[data-classic-layout=terminal] .classic-hero-title::before{content:"> ";color:var(--classic-accent)}
body[data-classic-layout=terminal] .classic-hero-mark{left:auto;right:1.45rem;top:3.55rem;transform:none;width:3.25rem;height:3.25rem;border-radius:.45rem}
body[data-classic-layout=terminal] .classic-hero-mark span{display:none}
body[data-classic-layout=terminal] .classic-card{border-radius:.55rem!important}

/* 05 Glass */
body[data-classic-layout=glass] .classic-hero{padding-top:7.25rem;border-radius:3rem;background:linear-gradient(135deg,rgba(var(--classic-accent-rgb),.15),rgba(255,255,255,.035),rgba(var(--classic-accent-rgb),.07));backdrop-filter:blur(24px)}
body[data-classic-layout=glass] .classic-hero-mark{transform:translateX(-50%) rotate(-8deg);border-radius:1.7rem;backdrop-filter:blur(14px)}
body[data-classic-layout=glass] .classic-hero-mark span{border-radius:2.25rem}
body[data-classic-layout=glass] .classic-card{border-radius:2rem!important;backdrop-filter:blur(22px)}

/* 06 Editorial */
body[data-classic-layout=editorial] .classic-hero{text-align:left;padding:1.65rem 1rem 1.65rem 7rem;border:0;border-left:.35rem solid var(--classic-accent);border-radius:0;background:transparent;box-shadow:none;overflow:visible}
body[data-classic-layout=editorial] .classic-hero::before,body[data-classic-layout=editorial] .classic-hero::after{display:none}
body[data-classic-layout=editorial] .classic-hero-title,
body[data-classic-layout=editorial] .classic-hero-lead{margin-inline:0!important}
body[data-classic-layout=editorial] .classic-hero-title{font-size:clamp(2.55rem,6vw,4.4rem)!important;line-height:1.02!important}
body[data-classic-layout=editorial] .classic-hero-mark{left:1rem;top:1.75rem;transform:none;border:0;border-radius:0;background:transparent;box-shadow:none}
body[data-classic-layout=editorial] .classic-hero-mark svg{width:2.7rem;height:2.7rem}
body[data-classic-layout=editorial] .classic-hero-mark span{display:none}
body[data-classic-layout=editorial] .classic-card{border-width:0 0 0 2px!important;border-radius:0!important;box-shadow:none!important}

/* 07 Neon */
body[data-classic-layout=neon] .classic-hero{padding-top:7.2rem;border-radius:.85rem;border-color:rgba(var(--classic-accent-rgb),.58);box-shadow:0 0 0 1px rgba(var(--classic-accent-rgb),.16),0 0 44px -17px rgba(var(--classic-accent-rgb),.8),inset 0 0 58px rgba(var(--classic-accent-rgb),.045)}
body[data-classic-layout=neon] .classic-hero-mark{transform:translateX(-50%) rotate(45deg);border-radius:.55rem;box-shadow:0 0 28px rgba(var(--classic-accent-rgb),.25)}
body[data-classic-layout=neon] .classic-hero-mark svg{transform:rotate(-45deg)}
body[data-classic-layout=neon] .classic-hero-mark span{border-radius:.5rem}
body[data-classic-layout=neon] .classic-card{border-radius:.7rem!important;box-shadow:0 0 0 1px rgba(var(--classic-accent-rgb),.08),0 22px 64px -35px rgba(var(--classic-accent-rgb),.72)!important}

/* 08 Compact */
body[data-classic-layout=compact] .classic-hero{text-align:left;padding:1.35rem 1.5rem 1.35rem 6.7rem;border-radius:1rem}
body[data-classic-layout=compact] .classic-hero::before{left:auto;right:-6rem;top:-10rem;transform:none}
body[data-classic-layout=compact] .classic-hero-title,
body[data-classic-layout=compact] .classic-hero-lead{margin-inline:0!important}
body[data-classic-layout=compact] .classic-hero-title{font-size:clamp(1.8rem,4vw,2.65rem)!important;margin-block:.55rem .35rem!important}
body[data-classic-layout=compact] .classic-hero-lead{line-height:1.55!important}
body[data-classic-layout=compact] .classic-hero-mark{left:1.45rem;top:50%;transform:translateY(-50%);width:3.8rem;height:3.8rem;border-radius:1rem}
body[data-classic-layout=compact] .classic-hero-mark span{display:none}
body[data-classic-layout=compact] .classic-card{border-radius:.8rem!important}

html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-classic-tool] .classic-card{
  border-color:color-mix(in srgb,var(--classic-accent) 25%,var(--th-border))!important;
}
html[data-hub-theme=light] body[data-classic-tool] .classic-hero{
  background:linear-gradient(145deg,rgba(var(--classic-accent-rgb),.1),rgba(255,255,255,.9) 54%,rgba(var(--classic-accent-rgb),.055));
  box-shadow:0 28px 80px -50px rgba(var(--classic-accent-rgb),.7),inset 0 1px rgba(255,255,255,.8);
}
html[data-hub-theme=light] body[data-classic-tool] .classic-card{
  background:var(--th-panel)!important;
  color:var(--th-text)!important;
}
html[data-hub-theme=light] body[data-classic-tool] .classic-card :is([class*="bg-hub-800"],[class*="bg-hub-900"],[class*="bg-slate-800"],[class*="bg-slate-900"]):not(pre):not(code){
  background-color:var(--th-panel-2)!important;
}
html[data-hub-theme=light] body[data-classic-tool] .classic-card :is(.border-hub-700,[class*="border-slate-700"],[class*="border-slate-800"]){
  border-color:var(--th-border)!important;
}
html[data-hub-theme=light] body[data-classic-layout=terminal] .classic-hero{background:linear-gradient(155deg,#172033,#26354d)}
html[data-hub-theme=light] body[data-classic-layout=terminal] .classic-hero :is(.classic-hero-title,.classic-hero-lead){color:#e2e8f0!important}
html[data-hub-theme=light] body[data-classic-layout=blueprint] .classic-hero{background-image:linear-gradient(rgba(var(--classic-accent-rgb),.12) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--classic-accent-rgb),.12) 1px,transparent 1px),linear-gradient(145deg,rgba(var(--classic-accent-rgb),.12),rgba(255,255,255,.94))}
html[data-hub-theme=light] body[data-classic-layout=editorial] .classic-hero{background:transparent;box-shadow:none}

@media(max-width:720px){
  body[data-classic-tool] .classic-hero{padding:6.1rem 1rem 1.5rem!important;text-align:center!important;border-radius:1.2rem;margin-bottom:1.2rem!important;overflow:hidden}
  body[data-classic-tool] .classic-hero-title,body[data-classic-tool] .classic-hero-lead{margin-inline:auto!important}
  body[data-classic-tool] .classic-hero-title{font-size:clamp(1.85rem,8vw,2.6rem)!important}
  body[data-classic-tool] .classic-hero-mark{left:50%!important;right:auto!important;top:1.2rem!important;width:3.8rem!important;height:3.8rem!important;transform:translateX(-50%)!important;border-radius:1rem!important}
  body[data-classic-tool] .classic-hero-mark svg{width:1.75rem;height:1.75rem;transform:none!important}
  body[data-classic-tool] .classic-hero-mark span{display:block;inset:-.65rem;border-radius:1.35rem}
  body[data-classic-layout=terminal] .classic-hero{padding-top:4.7rem!important;text-align:left!important}
  body[data-classic-layout=terminal] .classic-hero-mark{left:auto!important;right:.9rem!important;top:3.25rem!important;transform:none!important;width:2.9rem!important;height:2.9rem!important}
  body[data-classic-layout=terminal] .classic-hero-mark span{display:none}
  body[data-classic-layout=editorial] .classic-hero{border-left:0;border-top:.3rem solid var(--classic-accent);border-radius:0!important}
  body[data-classic-layout=editorial] .classic-hero-mark span{display:none}
}
@media(max-width:480px){
  body[data-classic-tool] .classic-main{padding-left:.75rem!important;padding-right:.75rem!important}
  body[data-classic-tool] .classic-hero-kicker{max-width:100%;font-size:.68rem!important}
  body[data-classic-tool] .classic-card{border-radius:.85rem!important}
}