
:root{
  --bg:#02050b;--panel:#07111d;--border:rgba(57,220,255,.32);
  --cyan:#39dcff;--text:#edfaff;--muted:#91a9b8;--gold:#ffd45a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,sans-serif}
.shell{max-width:1250px;margin:auto;padding:0 18px 35px}
.crazychat-header-image{width:100%;line-height:0;background:#02050b;border-bottom:1px solid var(--border)}
.crazychat-header-image img{width:100%;height:auto;display:block}
.header{display:flex;align-items:center;gap:18px;padding:14px 0;flex-wrap:wrap}
.brand{font-size:1.3rem;font-weight:800;color:#fff;text-decoration:none}
.brand span{color:var(--cyan)}
nav{display:flex;gap:7px;flex-wrap:wrap;flex:1}
nav a,.login{color:var(--text);text-decoration:none;padding:8px 10px;border:1px solid transparent;border-radius:7px}
nav a:hover,nav a.active,.login:hover{border-color:var(--border);color:var(--cyan)}
.login{border-color:var(--border)}
main{padding-top:8px}
.panel{background:linear-gradient(145deg,rgba(7,17,29,.96),rgba(3,8,15,.96));border:1px solid var(--border);border-radius:12px;box-shadow:0 0 28px rgba(57,220,255,.08)}
.hero{padding:34px;margin-bottom:24px;display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center}
.eyebrow,.kicker{color:var(--cyan);font-weight:800;letter-spacing:1.5px;font-size:.75rem}
h1{font-size:clamp(2rem,5vw,3.6rem);margin:5px 0 10px;text-shadow:0 0 14px rgba(57,220,255,.45)}
h2{margin:0;font-size:1.5rem}
h3{margin:7px 0 8px}
.lead{font-size:1.05rem;color:var(--muted);max-width:760px;line-height:1.6}
.status{border:1px solid var(--border);padding:14px 17px;border-radius:9px;min-width:180px}
.status strong{display:block;color:var(--gold);margin-top:6px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{padding:22px;min-height:190px}
.card p{color:var(--muted);line-height:1.6}
.icon{font-size:1.7rem;color:var(--cyan);font-weight:800}
footer{margin-top:28px;padding:18px 2px;color:var(--muted);font-size:.85rem;border-top:1px solid rgba(57,220,255,.18)}
@media(max-width:850px){.hero{grid-template-columns:1fr}.grid{grid-template-columns:1fr}}

/* REV3 — footer consistent with CrazyChat NEON basis */
.footer-main{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.footer-main strong{color:var(--text)}
.footer-links{display:flex;flex-wrap:wrap;gap:8px 15px;font-size:.82rem}
.footer-links a{color:var(--muted);text-decoration:none}
.footer-links a:hover{color:var(--cyan)}
footer small{font-size:.72rem}
