/* ToolHub 共用工具視覺核心：所有規則皆以 data-tool-visual 為作用範圍。 */
body[data-tool-visual]{
  --tool-visual-accent:#38bdf8;
  --tool-visual-accent-rgb:56,189,248;
  --tool-visual-radius:1.25rem;
  --tool-visual-panel:rgba(21,31,50,.88);
  --tool-visual-line:rgba(var(--tool-visual-accent-rgb),.2);
  position:relative;
  isolation:isolate;
}
body[data-tool-visual]::before,
body[data-tool-visual]::after{
  content:"";
  position:fixed;
  z-index:-1;
  width:28rem;
  height:28rem;
  border-radius:50%;
  background:var(--tool-visual-accent);
  filter:blur(105px);
  opacity:.09;
  pointer-events:none;
}
body[data-tool-visual]::before{left:-15rem;top:10rem}
body[data-tool-visual]::after{right:-17rem;top:42rem;opacity:.065}
body[data-tool-visual] main{min-width:0}
body[data-tool-visual] :is(button,a,input,select,textarea):focus-visible{
  outline:2px solid var(--tool-visual-accent);
  outline-offset:3px;
}
body[data-tool-visual] :is(button,.btn){transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,filter .2s ease}
body[data-tool-visual] :is(button,.btn):not(:disabled):hover{filter:brightness(1.06)}
body[data-tool-visual] .tool-visual-surface{position:relative;min-width:0}
body[data-tool-visual] .tool-visual-surface::before{
  content:"";
  position:absolute;
  left:1.1rem;
  right:1.1rem;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--tool-visual-accent),transparent);
  opacity:.55;
  pointer-events:none;
}
html[data-hub-theme]:not([data-hub-theme=midnight]) body[data-tool-visual]{
  --tool-visual-panel:color-mix(in srgb,var(--tool-visual-accent) 5%,var(--th-panel));
  --tool-visual-line:color-mix(in srgb,var(--tool-visual-accent) 24%,var(--th-border));
}
html[data-hub-theme=light] body[data-tool-visual]::before,
html[data-hub-theme=light] body[data-tool-visual]::after{opacity:.055}
@media(max-width:640px){
  body[data-tool-visual]::before{width:19rem;height:19rem;left:-11rem}
  body[data-tool-visual]::after{width:21rem;height:21rem}
}
@media(prefers-reduced-motion:reduce){
  body[data-tool-visual] *,body[data-tool-visual] *::before,body[data-tool-visual] *::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}
