:root{
  --bg:#0b0c10; --fg:#e8e8e8; --accent:#69f0ae; --muted:#a7a7a7; --stroke:#20232a;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,Arial,sans-serif}
a{text-decoration:none;color:var(--fg)}
.nav{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);border-bottom:1px solid var(--stroke)}
.logo{font-weight:800;letter-spacing:.3px}
.hero{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;max-width:1100px;margin:0 auto;padding:80px 24px;gap:20px}
.highlight{color:var(--accent)}
.btn{padding:10px 18px;border:1px solid var(--accent);border-radius:8px;cursor:pointer}
.btn-primary{background:var(--accent);color:#000;font-weight:700}
.contract{display:flex;align-items:center;gap:10px;margin-top:16px}
.contract code{background:#111214;padding:6px 10px;border-radius:6px}
.copy{padding:6px 10px;border:1px solid var(--accent);background:transparent;color:var(--accent);border-radius:6px;cursor:pointer}
.panel{max-width:900px;margin:0 auto;padding:64px 24px}
.meme-box{background:#111214;padding:20px;border-radius:12px;border:1px solid var(--stroke)}
.controls{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}
input{flex:1;padding:10px;border-radius:6px;border:1px solid var(--stroke);background:#0d0e12;color:var(--fg)}
canvas{width:100%;border-radius:10px;border:1px solid var(--stroke)}
.face{width:100%;max-width:420px}
.foot{text-align:center;padding:24px;color:var(--muted);border-top:1px solid var(--stroke)}
@media (max-width:920px){.hero{grid-template-columns:1fr}}