  @import url('fonts/fonts.css');
  * { margin:0; padding:0; box-sizing:border-box; }
  :root { --black:#0a0a0a; --white:#f5f3ee; --accent:#00ff88; --dim:#1a1a1a; --text-muted:#888; --font-head:'Syne',sans-serif; --font-mono:'DM Mono',monospace; }
  html,body { height:100%; }
  body { background:var(--black); color:var(--white); font-family:var(--font-head); display:flex; flex-direction:column; min-height:100vh; }
  .grid-bg { position:fixed; inset:0; pointer-events:none; z-index:0; background-image:linear-gradient(rgba(0,255,136,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,136,0.03) 1px,transparent 1px); background-size:60px 60px; }
  .container { position:relative; z-index:1; max-width:860px; margin:0 auto; padding:0 24px; width:100%; }
  header { padding:28px 0; }
  .logo { font-family:var(--font-head); font-weight:800; font-size:1.05rem; letter-spacing:0.02em; color:var(--white); text-decoration:none; display:inline-block; }
  .logo em { font-style:normal; color:var(--accent); }
  main { flex:1; display:flex; align-items:center; padding:20px 0 80px; }
  .content { max-width:560px; }
  .tag { font-family:var(--font-mono); font-size:10px; letter-spacing:0.25em; color:var(--text-muted); text-transform:uppercase; margin-bottom:24px; display:flex; align-items:center; gap:10px; }
  .tag::before { content:''; display:inline-block; width:20px; height:1px; background:rgba(255,255,255,0.2); }
  h1 { font-size:clamp(28px,5.5vw,52px); font-weight:800; line-height:1.05; letter-spacing:-0.03em; margin-bottom:24px; }
  .body-text { font-family:var(--font-mono); font-size:14px; color:var(--text-muted); line-height:1.85; margin-bottom:36px; }
  .body-text a { color:var(--white); text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.2); transition:border-color 0.2s; }
  .body-text a:hover { border-color:var(--accent); color:var(--accent); }
  .divider { height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.07),transparent); margin:36px 0; }
  .back { font-family:var(--font-mono); font-size:12px; color:var(--text-muted); text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:color 0.2s; }
  .back:hover { color:var(--accent); }
  footer { border-top:1px solid rgba(255,255,255,0.05); padding:22px 0; }
  .footer-inner { display:flex; align-items:center; justify-content:flex-end; }
  .footer-tag { font-family:var(--font-mono); font-size:11px; color:#2a2a2a; }
  .footer-logo { font-size:0.9rem; }
  .footer-links { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
  .footer-link { font-family:var(--font-mono); font-size:10px; color:#333; text-decoration:none; transition:color .2s; }
  .footer-link:hover { color:var(--accent); }

  @media (max-width:640px) {
    .container { padding:0 16px; }
    header { padding:20px 0; }
    main { padding:16px 0 60px; align-items:flex-start; }
    .body-text { font-size:13px; margin-bottom:28px; }
    .tag { margin-bottom:16px; }
    .footer-inner { flex-direction:column; align-items:flex-start; gap:14px; }
  }
