/* =====================================================================
   cybertrickz.info — TOOL PAGE constructivist skin (proof of concept).
   CSS-only: overrides the widget's inline styles (hence !important) and
   the legacy .ct-tool-page editorial kit. Scoped per page via body class
   — currently page-id-343 only. Markup, copy, and JS untouched.
   ===================================================================== */
body.ct-newtool{
  --ctn-navy:#01133f; --ctn-navy2:#012456; --ctn-cyan:#3e92cc; --ctn-amber:#f0b429;
  --ctn-canvas:#f5f5f5; --ctn-ink:#01133f;
}

/* ---------- WIDGET (#kda-root) ---------- */
body.ct-newtool #kda-root{font-family:'DM Sans',system-ui,sans-serif !important;}
body.ct-newtool #kda-root h1{
  font-family:'Syne',sans-serif !important;font-weight:700 !important;letter-spacing:-0.02em !important;
  color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;
}
body.ct-newtool #kda-root h1 + p{color:#3d4358 !important;-webkit-text-fill-color:#3d4358 !important;}
/* card sections: sharp, bordered, hard cyan shadow */
body.ct-newtool #kda-root section{
  border-radius:0 !important;
  box-shadow:6px 6px 0 0 var(--ctn-cyan) !important;
  border:2px solid var(--ctn-ink) !important;
}
body.ct-newtool #kda-root > section:first-child{border:0 !important;box-shadow:none !important;}
/* buttons: navy, sharp, mechanical press */
body.ct-newtool #kda-root button{
  border-radius:0 !important;
  font-family:'DM Mono',ui-monospace,monospace !important;
  text-transform:uppercase !important;letter-spacing:.05em !important;font-size:.85rem !important;
}
body.ct-newtool #kda-root #analyze-button,
body.ct-newtool #kda-root #fetch-url{
  background:var(--ctn-navy) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;
  border:2px solid var(--ctn-ink) !important;box-shadow:4px 4px 0 0 var(--ctn-cyan) !important;
  transition:all 150ms ease-out !important;
}
body.ct-newtool #kda-root #analyze-button:hover,
body.ct-newtool #kda-root #fetch-url:hover{opacity:1 !important;background:var(--ctn-navy2) !important;transform:none !important;}
body.ct-newtool #kda-root #analyze-button:active,
body.ct-newtool #kda-root #fetch-url:active{transform:translate(2px,2px) !important;box-shadow:none !important;}
/* tabs */
body.ct-newtool #kda-root #tab-text,
body.ct-newtool #kda-root #tab-url{
  background:transparent !important;color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;
  border-bottom:3px solid transparent !important;box-shadow:none !important;
}
body.ct-newtool #kda-root #tab-text[style*="border-bottom: 3px solid"],
body.ct-newtool #kda-root #tab-url[style*="border-bottom: 3px solid"]{border-bottom:3px solid var(--ctn-cyan) !important;}
/* inputs */
body.ct-newtool #kda-root textarea,
body.ct-newtool #kda-root input,
body.ct-newtool #kda-root select{
  border-radius:0 !important;border:2px solid var(--ctn-ink) !important;
  font-family:'DM Sans',sans-serif !important;color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;
}
body.ct-newtool #kda-root input:focus,
body.ct-newtool #kda-root textarea:focus,
body.ct-newtool #kda-root select:focus{
  border-color:var(--ctn-cyan) !important;box-shadow:3px 3px 0 0 var(--ctn-cyan) !important;outline:none !important;
}
/* results table */
body.ct-newtool #kda-root table{border:2px solid var(--ctn-ink) !important;border-radius:0 !important;}
body.ct-newtool #kda-root table th{
  background:var(--ctn-navy) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;
  font-family:'DM Mono',monospace !important;text-transform:uppercase !important;letter-spacing:.06em !important;font-size:.75rem !important;border-radius:0 !important;
}
body.ct-newtool #kda-root .kda-badge,
body.ct-newtool #kda-root [style*="border-radius: 20px"],
body.ct-newtool #kda-root [style*="border-radius:20px"]{border-radius:9999px !important;}
/* preview + status panels */
body.ct-newtool #kda-root #fetched-preview{border-radius:0 !important;border:2px solid var(--ctn-ink) !important;background:var(--ctn-canvas) !important;}

/* ---------- EDITORIAL (.entry-content prose) ---------- */
body.ct-newtool .entry-content > h2,
body.ct-newtool.ct-tool-page .entry-content > h2{
  font-family:'Syne',sans-serif !important;font-weight:700 !important;letter-spacing:-0.02em !important;
  color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;
  border-left:none !important;padding-left:0 !important;font-style:normal !important;
}
body.ct-newtool .entry-content > h2::before{content:"" !important;display:block !important;width:38px;height:4px;background:var(--ctn-cyan);margin-bottom:14px;}
body.ct-newtool .entry-content > h3,
body.ct-newtool.ct-tool-page .entry-content > h3{
  font-family:'Syne',sans-serif !important;font-weight:700 !important;
  color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;font-style:normal !important;
}
body.ct-newtool .entry-content > p,
body.ct-newtool .entry-content > ul,
body.ct-newtool .entry-content > ol,
body.ct-newtool .entry-content li{
  font-family:'DM Sans',system-ui,sans-serif !important;
  color:#2b3348 !important;-webkit-text-fill-color:#2b3348 !important;
}
body.ct-newtool .entry-content li::marker{color:var(--ctn-cyan);}
body.ct-newtool .entry-content a{color:var(--ctn-cyan) !important;-webkit-text-fill-color:var(--ctn-cyan) !important;text-decoration:underline;text-underline-offset:2px;}
body.ct-newtool .entry-content a:hover{color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;}
/* =====================================================================
   ROLLOUT LAYER — generic constructivist harmonization for ALL tool
   pages. Attribute-selector overrides target STATIC inline styles; when
   tool JS rewrites an element's style attribute for active/selected
   state, the selector stops matching and the JS state wins — keeps
   interactive feedback alive.
   ===================================================================== */
/* controls: sharp + mono */
body.ct-newtool .entry-content button{
  border-radius:0 !important;
  font-family:'DM Mono',ui-monospace,monospace !important;
  text-transform:uppercase !important;letter-spacing:.04em !important;
}
body.ct-newtool .entry-content input,
body.ct-newtool .entry-content textarea,
body.ct-newtool .entry-content select{
  border-radius:0 !important;
  font-family:'DM Sans',system-ui,sans-serif !important;
}
/* kill legacy rounded corners on any inline-styled element (circles stay circles) */
body.ct-newtool .entry-content [style*="border-radius"]{border-radius:0 !important;}
body.ct-newtool .entry-content [style*="border-radius: 50%"],
body.ct-newtool .entry-content [style*="border-radius:50%"],
body.ct-newtool .entry-content [style*="border-radius: 999"],
body.ct-newtool .entry-content [style*="border-radius:999"],
body.ct-newtool .entry-content [style*="border-radius: 50px"]{border-radius:9999px !important;}
/* soft shadows -> hard offset */
body.ct-newtool .entry-content [style*="box-shadow"]{box-shadow:6px 6px 0 0 var(--ctn-cyan) !important;}
/* gradients -> flat navy */
body.ct-newtool .entry-content [style*="linear-gradient"]{background:var(--ctn-navy) !important;color:#fff !important;-webkit-text-fill-color:#fff !important;}
/* off-brand accent colors -> brand (static inline only; JS states win) */
body.ct-newtool .entry-content [style*="#1d4ed8"]{background-color:var(--ctn-navy) !important;}
body.ct-newtool .entry-content [style*="#2563eb"]{background-color:var(--ctn-navy) !important;}
body.ct-newtool .entry-content [style*="#0d9488"]{background-color:var(--ctn-cyan) !important;}
body.ct-newtool .entry-content [style*="#4285f4"]{background-color:var(--ctn-navy) !important;border-color:var(--ctn-ink) !important;}
/* .cte serif editorial -> constructivist type (layout untouched) */
body.ct-newtool .cte h2,body.ct-newtool .cte h3,body.ct-newtool .cte h4{
  font-family:'Syne',sans-serif !important;font-weight:700 !important;letter-spacing:-0.02em !important;
  color:var(--ctn-navy) !important;-webkit-text-fill-color:var(--ctn-navy) !important;font-style:normal !important;
}
body.ct-newtool .cte p,body.ct-newtool .cte li{
  font-family:'DM Sans',system-ui,sans-serif !important;
}
body.ct-newtool .cte a{color:var(--ctn-cyan) !important;-webkit-text-fill-color:var(--ctn-cyan) !important;}