/* AiChecker shared UI — Radar Cyan (all tool/content pages)
   Overrides page :root so every non-home page matches homepage vibe. */

:root{
  --bg:#0A0F14;
  --panel:#141D26;
  --panel-2:#10181F;
  --line:#1E2D3A;
  --ink:#E8EEF4;
  --muted:#6B7B8C;
  --faint:#4A5A6B;
  --gold-1:#2EE6D6;
  --gold:#00D4C4;
  --gold-2:#00B8A8;
  --gold-deep:#009688;
  --green:#1DB954;
  --blue:#3B82F6;
  --red:#EF476F;
  --violet:#A855F7;
  --shadow:0 10px 30px rgba(0,0,0,.28);
  --shadow-lg:0 18px 48px rgba(0,0,0,.42);
}

html{color-scheme:dark;overflow-x:clip}
body{overflow-x:clip;max-width:100%}
body{
  background:
    radial-gradient(1000px 560px at 88% -8%, rgba(0,212,196,.10), transparent 55%),
    radial-gradient(820px 520px at 0% 8%, rgba(168,85,247,.08), transparent 50%),
    linear-gradient(180deg, #0C1218 0%, #0A0F14 42%, #080C11 100%) !important;
  background-attachment: fixed !important;
  color: var(--ink) !important;
}

/* Ambient cyan blobs (replaces cream/gold aurora) */
.aurora{position:fixed;top:-18%;left:-12%;width:58vw;height:58vw;z-index:-1;pointer-events:none;
  background:radial-gradient(circle, rgba(0,212,196,.16), transparent 62%);
  filter:blur(86px);animation:drift 20s ease-in-out infinite alternate;opacity:.9}
.aurora.b{top:auto;bottom:-22%;left:auto;right:-12%;background:radial-gradient(circle, rgba(168,85,247,.10), transparent 62%);animation-duration:24s}
.aurora.c{top:34%;left:42%;width:36vw;height:36vw;background:radial-gradient(circle, rgba(0,212,196,.10), transparent 62%);animation-duration:28s;animation-direction:alternate-reverse}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,5vh) scale(1.1)}100%{transform:translate(-5vw,-3vh) scale(1.04)}}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s cubic-bezier(.2,.7,.2,1),transform .65s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* Card hover glow */
.glow{position:relative;isolation:isolate;transition:transform .28s,border-color .28s,box-shadow .28s}
.glow::after{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .3s;border-radius:inherit;pointer-events:none;
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(0,212,196,.14),transparent 48%)}
.glow:hover{transform:translateY(-3px);border-color:rgba(0,212,196,.45)!important;box-shadow:var(--shadow-lg)}
.glow:hover::after{opacity:1}

/* ===== SHARED NAV ===== */
nav{position:relative;z-index:200}
.menu-toggle{
  display:none;background:var(--panel);border:1px solid var(--line);color:var(--ink);
  cursor:pointer;padding:10px;border-radius:10px;transition:background .2s,border-color .2s,box-shadow .2s;
  line-height:0;flex-shrink:0;-webkit-tap-highlight-color:transparent;
}
.menu-toggle:hover,.menu-toggle:focus-visible{background:var(--panel-2);border-color:rgba(0,212,196,.4);outline:none}
.menu-toggle svg{width:24px;height:24px;display:block;pointer-events:none}
.menu-toggle[aria-expanded="true"]{background:rgba(0,212,196,.12);border-color:rgba(0,212,196,.45)}

.dropdown{position:relative}
.dropdown > a,
.dropdown > button.tools-toggle{
  cursor:pointer;display:inline-flex;align-items:center;gap:6px;
  color:var(--muted);font-size:14px;font-weight:500;text-decoration:none;
  background:none;border:none;font:inherit;padding:0;transition:color .2s;
  -webkit-tap-highlight-color:transparent;
}
.dropdown > a:hover,
.dropdown > button.tools-toggle:hover,
.dropdown > a:focus-visible,
.dropdown > button.tools-toggle:focus-visible{color:var(--ink);outline:none}
.dropdown .caret{font-size:10px;opacity:.7;transition:transform .2s;display:inline-block}
.dropdown.open .caret{transform:rotate(180deg)}

.dropdown-menu{
  position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--panel);border:1px solid var(--line);border-radius:14px;
  padding:8px;min-width:240px;max-width:min(320px,92vw);
  display:none;flex-direction:column;gap:2px;
  box-shadow:var(--shadow-lg);z-index:400;
  opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;
}
.dropdown-menu a{
  color:var(--muted);text-decoration:none;padding:11px 14px;border-radius:9px;
  display:flex;flex-direction:column;gap:2px;transition:background .2s,color .2s;
}
.dropdown-menu a:hover,
.dropdown-menu a:focus-visible{background:rgba(0,212,196,.10);color:var(--ink);outline:none}
.dropdown-menu a .dm-title{font-weight:600;color:var(--ink);font-size:14px}
.dropdown-menu a .dm-desc{font-size:12px;color:var(--faint)}

@media (hover:hover) and (pointer:fine) and (min-width:901px){
  .dropdown:hover > .dropdown-menu,
  .dropdown:focus-within > .dropdown-menu,
  .dropdown.open > .dropdown-menu,
  .dropdown-menu.show{
    display:flex;opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);
  }
}
@media (min-width:901px){
  .dropdown.open > .dropdown-menu,
  .dropdown-menu.show{
    display:flex;opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);
  }
}

/* Mobile + tablet */
@media (max-width:900px){
  .menu-toggle{display:inline-flex;align-items:center;justify-content:center}
  .nav-links{
    display:none !important;
    position:absolute;top:calc(100% + 8px);left:12px;right:12px;z-index:350;
    background:rgba(16,24,31,.98);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border:1px solid var(--line);border-radius:16px;
    flex-direction:column;align-items:stretch;gap:2px;
    padding:10px;margin:0;
    box-shadow:var(--shadow-lg);
    max-height:min(78vh,640px);overflow-y:auto;-webkit-overflow-scrolling:touch;
    animation:navIn .2s ease;
  }
  .nav-links.open{display:flex !important}
  .nav-links > a,
  .nav-links .dropdown{
    width:100%;padding:14px 16px;border-radius:10px;font-size:15px;
    border-bottom:1px solid var(--line);box-sizing:border-box;color:var(--ink);
  }
  .nav-links > a:last-child,
  .nav-links .dropdown:last-child{border-bottom:none}
  .nav-links > a:hover,
  .nav-links > a:focus-visible,
  .nav-links .dropdown:hover{background:rgba(0,212,196,.08)}
  .nav-links .btn-login{text-align:center;margin-top:4px;border-bottom:none !important}
  .nav-links .dropdown{
    display:flex;flex-direction:column;align-items:stretch;padding:0;
  }
  .nav-links .dropdown > a,
  .nav-links .dropdown > button.tools-toggle{
    width:100%;padding:14px 16px;justify-content:space-between;
    color:var(--ink);border-radius:10px;text-align:left;
  }
  .nav-links .dropdown-menu,
  .dropdown-menu{
    position:static !important;left:auto !important;top:auto !important;
    transform:none !important;opacity:1 !important;pointer-events:auto !important;
    display:none !important;
    min-width:0;max-width:none;width:100%;
    box-shadow:none !important;border:none !important;
    background:var(--panel-2);border-radius:10px;
    padding:4px 0 8px 8px;margin:0 0 6px;
  }
  .nav-links .dropdown.open > .dropdown-menu,
  .nav-links .dropdown-menu.show,
  .dropdown.open > .dropdown-menu,
  .dropdown-menu.show{display:flex !important}
  .nav-links .dropdown-menu a{padding:12px 14px}
  .nav-links .lang-switch{
    margin:8px 8px 4px;padding:12px 8px 4px;border-left:none;
    border-top:1px solid var(--line);width:auto;
  }
}
@media (max-width:480px){
  .nav-links{left:8px;right:8px;padding:8px}
}
@keyframes navIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Form controls on dark */
input,textarea,select{
  color:var(--ink);
  background:var(--panel);
  border:1px solid var(--line);
}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(0,212,196,.25);
}

/* Soften common surfaces */
body .panel, body .card, body .box, body .result-card, body .pricing-card, body .post-card{
  background:var(--panel);
  border-color:var(--line);
  box-shadow:var(--shadow);
  color:var(--ink);
}

/* Buttons that used cream/gold hardcodes */
.btn-primary,.btn-gold,.btn-login{
  background:linear-gradient(135deg,var(--gold),var(--gold-2)) !important;
  color:#041216 !important;
  border-color:var(--gold-2) !important;
}
.btn-primary:hover,.btn-gold:hover,.btn-login:hover{
  box-shadow:0 8px 24px rgba(0,212,196,.30) !important;
}

/* Brand mark / logo text accents */
.brand b, .brand strong, .g, .accent, .logo span{
  color:var(--gold);
}

@media (prefers-reduced-motion:reduce){
  .aurora,.aurora.b,.aurora.c{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
  .nav-links{animation:none}
}


/* mobile-safe-global */
html,body{max-width:100%;overflow-x:clip}
img,svg,video,canvas{max-width:100%;height:auto}
table{max-width:100%}
.scroll,.tbl-wrap,.table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.wrap,.container,.main,.content{max-width:100%}
@media (max-width:480px){
  h1{font-size:clamp(1.5rem,7vw,2.2rem)!important;overflow-wrap:anywhere}
  .hero-cta .btn,.btn-go,.btn-primary{width:100%;justify-content:center}
}