:root{
      --bg:#010503;
      --panel:rgba(0,12,5,.90);
      --panel-2:rgba(0,18,7,.82);
      --green:#39ff88;
      --cyan:#d8ff68;
      --red:#ff4d6d;
      --yellow:#d8ff68;
      --muted:#b6c78e;
      --text:#eafff5;
      --line:rgba(0,255,123,.22);
      --shadow:0 0 28px rgba(0,255,123,.12);
      --mono:"Share Tech Mono",monospace;
      --display:"Orbitron",Arial,sans-serif;
    }

    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{
      min-height:100vh;
      background:var(--bg);
      color:var(--text);
      font-family:var(--mono);
      overflow-x:hidden;
      cursor:crosshair;
    }
    a,button{cursor:pointer}
    a{color:inherit}

    body::before{
      content:"";
      position:fixed;
      inset:0;
      z-index:-4;
      background:
        repeating-linear-gradient(90deg,rgba(255,77,109,.06) 0 2px,transparent 2px 72px),
        repeating-linear-gradient(0deg,rgba(216,255,104,.035) 0 1px,transparent 1px 54px),
        radial-gradient(circle at 50% 45%,rgba(57,255,136,.10),transparent 34%),
        linear-gradient(180deg,rgba(0,18,7,.24),rgba(0,0,0,.88)),
        #010503;
    }
    body::after{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      z-index:50;
      background:
        linear-gradient(transparent 50%,rgba(0,0,0,.24) 50%),
        repeating-linear-gradient(90deg,transparent 0 180px,rgba(255,77,109,.05) 180px 183px),
        radial-gradient(circle at center,transparent 58%,rgba(0,0,0,.46));
      background-size:100% 3px,100% 100%,100% 100%;
      mix-blend-mode:screen;
    }

    #bg-video{
      position:fixed;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
      z-index:-5;
      opacity:.12;
      filter:contrast(1.45) saturate(.9) hue-rotate(45deg);
    }
    #matrix-bg{position:fixed;inset:0;z-index:-3;opacity:.08;pointer-events:none}

    .shell{width:min(1180px,calc(100% - 32px));margin:0 auto}
    .mono{font-family:var(--mono)}
    .muted{color:var(--muted)}
    .accent{color:var(--green)}
    .cyan{color:var(--cyan)}
    .red{color:var(--red)}
    .yellow{color:var(--yellow)}

    nav{
      position:sticky;
      top:0;
      z-index:20;
      height:58px;
      border-bottom:1px solid var(--line);
      background:rgba(0,8,3,.92);
      backdrop-filter:blur(12px);
    }
    .nav-inner{
      height:58px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:20px;
    }
    .brand{
      color:var(--green);
      letter-spacing:3px;
      font-family:var(--display);
      font-weight:900;
      text-shadow:0 0 18px rgba(57,255,136,.78);
      white-space:nowrap;
    }
    .nav-links{display:flex;gap:4px;align-items:center}
    .nav-links a{
      text-decoration:none;
      color:rgba(234,255,245,.68);
      font-size:.66rem;
      letter-spacing:1.4px;
      padding:21px 10px 19px;
      border-bottom:2px solid transparent;
      transition:.18s ease;
    }
    .nav-links a:hover,.nav-links a.active{color:var(--green);border-bottom-color:var(--green)}
    .nav-status{display:grid;grid-template-columns:7px 64px 124px;align-items:center;gap:8px;color:var(--green);font:12px var(--mono);white-space:nowrap}
    .nav-status::after{content:attr(data-signal);color:var(--yellow);margin-left:6px;overflow:hidden;text-overflow:ellipsis}
    .dot-live{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 1.8s infinite}
    @keyframes pulse{50%{opacity:.45;transform:scale(1.35)}}

    header{
      min-height:calc(100vh - 58px);
      display:grid;
      align-items:center;
      padding:72px 0 48px;
    }
    .hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:32px;align-items:center}
    .eyebrow{font:13px var(--mono);letter-spacing:4px;color:var(--yellow);margin-bottom:14px}
    h1{
      font-size:clamp(3.6rem,10vw,8rem);
      line-height:.9;
      letter-spacing:8px;
      color:var(--green);
      text-shadow:5px 0 var(--red),-3px 0 var(--yellow),0 0 52px rgba(57,255,136,.30);
      animation:glitch 4.2s infinite;
    }
    @keyframes glitch{
      0%,86%,100%{transform:translate(0);filter:none}
      87%{transform:translate(-2px,1px);filter:brightness(1.4)}
      88%{transform:translate(2px,-1px)}
      89%{transform:translate(0);filter:none}
    }
    .hero-title{margin-top:18px;color:var(--red);letter-spacing:3px;font-size:1.08rem}
    .hero-copy{margin-top:12px;max-width:720px;color:rgba(234,255,245,.72);font:15px/1.8 var(--mono)}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:38px;
      padding:0 16px;
      border:1px solid rgba(0,255,123,.55);
      color:var(--green);
      background:linear-gradient(135deg,rgba(57,255,136,.16),rgba(216,255,104,.08));
      text-decoration:none;
      font-size:.66rem;
      letter-spacing:1.7px;
      transition:.18s ease;
    }
    .btn:hover{box-shadow:0 0 20px rgba(0,255,123,.22);transform:translateY(-1px)}
    .btn.alt{border-color:rgba(216,255,104,.55);color:var(--yellow)}
    .btn.red{border-color:rgba(255,35,79,.55);color:var(--red)}

    .terminal{
      border:1px solid var(--line);
      background:rgba(0,0,0,.70);
      box-shadow:var(--shadow);
      border-radius:8px;
      overflow:hidden;
    }
    .broadcast-frame{
      position:relative;
      border:2px solid rgba(57,255,136,.48);
      background:
        linear-gradient(135deg,rgba(255,77,109,.12),transparent 24%),
        linear-gradient(315deg,rgba(216,255,104,.10),transparent 28%),
        rgba(0,0,0,.78);
      box-shadow:0 0 34px rgba(57,255,136,.18),inset 0 0 42px rgba(255,77,109,.06);
      overflow:hidden;
    }
    .broadcast-frame::before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      background:repeating-linear-gradient(-12deg,transparent 0 12px,rgba(216,255,104,.08) 12px 14px,transparent 14px 28px);
      mix-blend-mode:screen;
      animation:broadcastDrift 8s linear infinite;
    }
    .broadcast-frame::after{
      content:"SIGNAL 03";
      position:absolute;
      top:10px;
      right:12px;
      color:var(--red);
      font:12px var(--mono);
      letter-spacing:2px;
      text-shadow:0 0 10px var(--red);
    }
    @keyframes broadcastDrift{from{transform:translateX(-24px)}to{transform:translateX(24px)}}
    .signal-noise{
      position:fixed;
      inset:0;
      z-index:49;
      pointer-events:none;
      opacity:.13;
      background:
        repeating-radial-gradient(circle at 30% 20%,rgba(57,255,136,.22) 0 1px,transparent 1px 3px),
        repeating-linear-gradient(0deg,transparent 0 8px,rgba(255,77,109,.18) 8px 9px);
      mix-blend-mode:screen;
      animation:signalNoise .22s steps(2,end) infinite;
    }
    @keyframes signalNoise{
      0%{transform:translate(0,0)}
      50%{transform:translate(2px,-1px)}
      100%{transform:translate(-1px,1px)}
    }
    .glitch-burst{
      animation:glitchBurst .24s steps(2,end) both;
    }
    @keyframes glitchBurst{
      0%{filter:none;transform:translate(0)}
      35%{filter:contrast(1.6) saturate(1.4);transform:translate(-2px,1px)}
      70%{filter:contrast(1.2);transform:translate(2px,-1px)}
      100%{filter:none;transform:translate(0)}
    }
    .landing-band{padding:34px 0 12px}
    .landing-strip{
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:14px;
      margin-top:18px;
    }
    .signal-card{
      border:1px solid rgba(57,255,136,.28);
      background:rgba(0,0,0,.64);
      padding:16px;
      min-height:160px;
      position:relative;
      overflow:hidden;
    }
    .signal-card::before{
      content:"";
      position:absolute;
      left:0;
      top:0;
      right:0;
      height:3px;
      background:linear-gradient(90deg,var(--green),var(--yellow),var(--red));
    }
    .signal-card h3{color:var(--yellow);font:700 .82rem var(--mono);letter-spacing:1.8px;margin-bottom:8px}
    .signal-card p{font:13px/1.6 var(--mono);color:rgba(234,255,245,.72)}
    .signal-card a{display:inline-flex;margin-top:12px;color:var(--green);text-decoration:none;font:12px var(--mono);letter-spacing:1.4px}
    .landing-marquee{
      border-top:1px solid rgba(216,255,104,.35);
      border-bottom:1px solid rgba(216,255,104,.35);
      color:var(--yellow);
      overflow:hidden;
      background:rgba(0,0,0,.68);
      font:13px var(--mono);
      letter-spacing:2px;
      white-space:nowrap;
    }
    .landing-marquee span{display:inline-block;padding:10px 0;animation:marquee 18s linear infinite}
    @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
    .cta-panel{
      margin-top:18px;
      padding:22px;
      border:1px solid rgba(255,77,109,.42);
      background:linear-gradient(90deg,rgba(255,77,109,.12),rgba(57,255,136,.08),rgba(216,255,104,.10));
    }
    .cta-panel h2{margin-bottom:8px}
    .cta-panel p{font:13px/1.7 var(--mono);color:rgba(234,255,245,.74);max-width:820px}
    .terminal-top{height:34px;display:flex;align-items:center;gap:7px;padding:0 12px;border-bottom:1px solid rgba(255,255,255,.08)}
    .traffic{width:9px;height:9px;border-radius:50%}
    .traffic.r{background:#ff5f57}.traffic.y{background:#febc2e}.traffic.g{background:#28c840}
    .terminal-body{padding:18px;font:13px/1.8 var(--mono)}
    .prompt{color:var(--yellow)}
    .cursor{color:var(--green);animation:blink 1s step-end infinite}
    @keyframes blink{50%{opacity:0}}

    section{padding:54px 0}
    .section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}
    .label{font:12px var(--mono);letter-spacing:3px;color:var(--cyan);margin-bottom:6px}
    h2{font-size:1.55rem;color:var(--green);letter-spacing:3px;text-shadow:2px 0 var(--red),-2px 0 var(--yellow)}
    .section-note{max-width:520px;color:var(--muted);font:13px/1.65 var(--mono);text-align:right}

    .tabs{
      border:1px solid var(--line);
      border-radius:8px;
      background:var(--panel);
      box-shadow:var(--shadow);
      overflow:hidden;
    }
    .tab-nav{display:flex;flex-wrap:wrap;border-bottom:1px solid rgba(0,255,123,.18);padding:0 16px}
    .tab-btn{
      border:0;
      background:transparent;
      color:rgba(234,255,245,.58);
      padding:15px 14px 13px;
      font:700 .66rem var(--mono);
      letter-spacing:1.6px;
      border-bottom:2px solid transparent;
    }
    .tab-btn:hover,.tab-btn.active{color:var(--green);border-bottom-color:var(--green);background:rgba(0,255,123,.06)}
    .tab-content{display:none;padding:24px}
    .tab-content.active{display:block}
    @keyframes tabIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
    .page-panel{position:relative}

    .grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
    .grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
    .card{
      border:1px solid rgba(57,255,136,.28);
      background:var(--panel-2);
      border-radius:8px;
      padding:18px;
      transition:.18s ease;
      box-shadow:inset 0 0 22px rgba(57,255,136,.035);
    }
    .card:hover{border-color:rgba(0,255,123,.46);box-shadow:0 0 22px rgba(0,255,123,.10)}
    .card h3,.card h4{font:700 .86rem var(--mono);letter-spacing:1.6px;margin-bottom:9px;color:var(--green);text-shadow:0 0 10px rgba(57,255,136,.42)}
    .card p,.card li{font:13px/1.7 var(--mono);color:rgba(234,255,245,.72)}
    .card ul{padding-left:18px}
    .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
    .tag{
      border:1px solid rgba(216,255,104,.35);
      background:rgba(216,255,104,.06);
      color:var(--yellow);
      padding:5px 9px;
      font:11px var(--mono);
      letter-spacing:.8px;
    }
    .terminal-lines{display:grid;gap:8px;margin-top:14px}
    .terminal-line-item{border-left:2px solid var(--green);background:rgba(0,0,0,.32);padding:8px 10px;font:12px/1.55 var(--mono);color:rgba(234,255,245,.74)}
    .terminal-line-item strong{color:var(--yellow);font-weight:400}
    .terminal-line-item::before{content:"> ";color:var(--green)}

    .timeline{position:relative;padding-left:26px}
    .timeline::before{content:"";position:absolute;left:7px;top:3px;bottom:5px;width:1px;background:linear-gradient(var(--green),transparent)}
    .event{position:relative;margin-bottom:18px}
    .event::before{content:"";position:absolute;left:-23px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green)}
    .event time{display:block;color:var(--yellow);font:12px var(--mono);margin-bottom:4px}
    .event strong{display:block;color:var(--green);font-size:.82rem;margin-bottom:4px}
    .event p{font:13px/1.65 var(--mono);color:rgba(234,255,245,.68)}

    .meter{margin-top:14px}
    .meter-row{display:flex;justify-content:space-between;font:12px var(--mono);color:rgba(234,255,245,.78);margin-bottom:6px}
    .track{height:7px;border:1px solid rgba(0,255,123,.22);background:rgba(255,255,255,.05);overflow:hidden}
    .fill{height:100%;width:var(--value);background:linear-gradient(90deg,var(--green),var(--yellow),var(--red));transform-origin:left;animation:grow .9s ease both}
    @keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}

    .project-status{display:inline-flex;align-items:center;gap:7px;font:11px var(--mono);letter-spacing:1px;margin-bottom:10px;color:var(--yellow)}
    .project-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 9px currentColor}

    .ctf-dashboard{
      border:1px solid var(--line);
      border-radius:8px;
      background:var(--panel);
      box-shadow:var(--shadow);
      overflow:hidden;
      position:relative;
    }
    .ctf-dashboard::before{
      content:"";
      position:absolute;
      inset:0;
      pointer-events:none;
      background:linear-gradient(120deg,transparent,rgba(0,255,123,.08),transparent);
      transform:translateX(-100%);
      animation:sweep 7s linear infinite;
    }
    @keyframes sweep{0%,45%{transform:translateX(-100%)}70%,100%{transform:translateX(100%)}}
    .ctf-tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid rgba(0,255,123,.18);padding:0 16px;background:rgba(0,0,0,.18)}
    .ctf-tab-btn{
      border:0;
      background:transparent;
      color:rgba(234,255,245,.58);
      padding:15px 14px 13px;
      font:700 .66rem var(--mono);
      letter-spacing:1.6px;
      border-bottom:2px solid transparent;
    }
    .ctf-tab-btn:hover,.ctf-tab-btn.active{color:var(--green);border-bottom-color:var(--green);background:rgba(0,255,123,.06)}
    .ctf-pane{display:none;padding:24px;position:relative;z-index:1}
    .ctf-pane.active{display:block}
    .ctf-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
    .ctf-live{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;font:12px var(--mono);color:var(--muted)}
    .ctf-source{display:flex;align-items:center;gap:8px}
    .ctf-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}
    .ctf-stat{border:1px solid rgba(0,255,123,.24);background:rgba(0,20,10,.46);padding:15px;text-align:center;border-radius:6px;position:relative;overflow:hidden;animation:riseIn .42s ease both}
    .ctf-stat:nth-child(2){animation-delay:.06s}.ctf-stat:nth-child(3){animation-delay:.12s}.ctf-stat:nth-child(4){animation-delay:.18s}
    .ctf-stat::after{content:"";position:absolute;left:-35%;top:0;width:30%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);transform:skewX(-18deg);animation:shine 4.8s ease-in-out infinite}
    @keyframes riseIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
    @keyframes shine{0%,60%{left:-35%}78%,100%{left:110%}}
    .ctf-num{display:block;color:var(--green);font-size:1.85rem;font-weight:900;text-shadow:0 0 16px rgba(0,255,123,.5)}
    .ctf-label{margin-top:5px;color:rgba(234,255,245,.60);font:11px var(--mono);letter-spacing:1.3px}
    .ctf-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .ctf-profile-grid{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:stretch;margin-bottom:16px}
    .ctf-avatar-frame{
      border:1px solid rgba(57,255,136,.42);
      background:rgba(0,0,0,.55);
      min-height:220px;
      display:grid;
      place-items:center;
      position:relative;
      overflow:hidden;
    }
    .ctf-avatar-frame::after{
      content:"PROFILE IMAGE";
      position:absolute;
      left:10px;
      bottom:8px;
      color:var(--yellow);
      font:11px var(--mono);
      letter-spacing:1.4px;
    }
    .ctf-avatar-frame img{width:100%;height:100%;object-fit:cover;filter:contrast(1.15) saturate(.95)}
    .kv{border-left:2px solid var(--yellow);padding:9px 11px;background:rgba(0,0,0,.28)}
    .kv span{display:block;color:var(--muted);font:11px var(--mono);margin-bottom:4px}
    .kv strong{color:var(--text);font:13px var(--mono)}
    .badge-frame{width:100%;height:190px;border:0;border-radius:6px;background:#111}
    .status-line{margin-top:10px;color:var(--muted);font:12px var(--mono)}
    .ctf-feed{display:grid;gap:10px}
    .ctf-feed-item{display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:start;border-left:3px solid var(--yellow);background:rgba(0,0,0,.34);padding:12px 14px;border-radius:0 6px 6px 0;animation:tabIn .32s ease both}
    .ctf-feed-item:nth-child(2){animation-delay:.06s}.ctf-feed-item:nth-child(3){animation-delay:.12s}
    .ctf-feed-item span{color:var(--yellow);font:11px var(--mono)}
    .ctf-feed-item strong{display:block;color:var(--green);font-size:.76rem;margin-bottom:4px}
    .ctf-feed-item p{font:12px/1.55 var(--mono);color:rgba(234,255,245,.68)}
    .ctf-lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
    .ctf-latest{margin-top:10px;margin-bottom:12px}
    .ctf-latest::before{
      content:"LATEST";
      display:block;
      margin-bottom:6px;
      color:var(--red);
      font:11px var(--mono);
      letter-spacing:1.6px;
      text-shadow:0 0 10px rgba(255,77,109,.42);
    }
    .ctf-list{display:grid;gap:8px;margin-top:10px}
    .ctf-list-item{
      border-left:2px solid var(--green);
      background:rgba(0,0,0,.34);
      padding:9px 11px;
      font:12px/1.55 var(--mono);
      color:rgba(234,255,245,.74);
    }
    .ctf-list-item strong{display:block;color:var(--yellow);font-weight:400;margin-bottom:2px}
    .ctf-list-item span{color:var(--muted)}
    .ctf-latest-item{
      border-left-color:var(--red);
      background:linear-gradient(90deg,rgba(255,77,109,.18),rgba(0,0,0,.42));
      box-shadow:inset 0 0 18px rgba(255,77,109,.06);
    }
    .ctf-latest-item strong{color:var(--green)}
    .ctf-badge-item{display:grid;grid-template-columns:42px 1fr;gap:10px;align-items:center}
    .ctf-badge-img{width:42px;height:42px;object-fit:contain;filter:contrast(1.1) saturate(.95)}

    .writeups{display:grid;gap:10px;margin-top:16px}
    .writeup{border-left:3px solid var(--green);background:rgba(0,0,0,.38);padding:12px 14px;border-radius:0 6px 6px 0}
    .writeup h4{color:var(--green);font-size:.78rem;margin-bottom:4px}
    .writeup p{font:12px/1.55 var(--mono);color:rgba(234,255,245,.68)}
    .writeup small{display:block;margin-top:6px;color:var(--yellow);font:11px var(--mono)}
    .ctf-boot-console .terminal-body{min-height:360px;padding:24px;font-size:14px}
    .boot-line,.boot-cursor{
      opacity:0;
      transform:translateY(6px);
      animation:bootLine .28s ease forwards;
    }
    .boot-line:nth-child(1){animation-delay:.10s}
    .boot-line:nth-child(2){animation-delay:.45s}
    .boot-line:nth-child(3){animation-delay:.80s}
    .boot-line:nth-child(4){animation-delay:1.15s}
    .boot-line:nth-child(5){animation-delay:1.50s}
    .boot-line:nth-child(6){animation-delay:1.85s}
    .boot-line:nth-child(7){animation-delay:2.20s;color:var(--yellow)}
    .boot-cursor{animation-delay:2.60s;color:var(--green)}
    @keyframes bootLine{to{opacity:1;transform:translateY(0)}}

    .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
    footer{padding:34px 0 42px;text-align:center;border-top:1px solid rgba(0,255,123,.16);color:var(--muted);font:12px var(--mono)}
    .footer-brand{color:var(--green);font-family:var(--display);font-weight:900;letter-spacing:4px;margin-bottom:8px}

    #toast{
      position:fixed;
      right:18px;
      bottom:18px;
      z-index:60;
      transform:translateY(18px);
      opacity:0;
      pointer-events:none;
      border:1px solid rgba(0,255,123,.45);
      background:rgba(0,0,0,.86);
      color:var(--green);
      padding:12px 14px;
      font:12px var(--mono);
      transition:.2s ease;
    }
    #toast.show{opacity:1;transform:translateY(0)}
    .retro-intro{
      position:fixed;
      inset:0;
      z-index:90;
      display:grid;
      place-items:center;
      overflow:hidden;
      background:
        radial-gradient(circle at center,rgba(57,255,136,.22),transparent 28%),
        linear-gradient(180deg,#050000,#010503 60%,#000);
      transition:opacity .42s ease,visibility .42s ease;
    }
    .retro-intro.done{opacity:0;visibility:hidden}
    .retro-grid{
      position:absolute;
      inset:auto -20% -12% -20%;
      height:54%;
      background:
        linear-gradient(rgba(216,255,104,.35) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,77,109,.28) 1px,transparent 1px);
      background-size:100% 28px,64px 100%;
      transform:perspective(360px) rotateX(62deg);
      transform-origin:center bottom;
      animation:retroGrid 1.2s linear infinite;
    }
    .retro-title{
      position:relative;
      text-align:center;
      color:var(--green);
      text-shadow:5px 0 var(--red),-3px 0 var(--yellow),0 0 34px rgba(57,255,136,.65);
      animation:retroTitle 1.45s ease both;
    }
    .retro-title span{display:block;font:900 clamp(3rem,10vw,7rem) var(--display);letter-spacing:10px}
    .retro-title small{display:block;margin-top:8px;color:var(--yellow);font:13px var(--mono);letter-spacing:4px}
    @keyframes retroGrid{from{background-position:0 0,0 0}to{background-position:0 28px,64px 0}}
    @keyframes retroTitle{
      0%{opacity:0;transform:scale(.88) translateY(18px);filter:blur(8px)}
      30%{opacity:1;filter:blur(0)}
      72%{transform:scale(1)}
      100%{opacity:1;transform:scale(1.04)}
    }
    @media (max-width:900px){
      .hero-grid,.grid-2,.grid-3,.ctf-grid,.ctf-profile-grid,.ctf-lists,.contact-grid,.landing-strip{grid-template-columns:1fr}
      .section-head{display:block}
      .section-note{text-align:left;margin-top:8px}
      .nav-status{display:none}
      .nav-links{overflow-x:auto}
      .nav-links a{font-size:.58rem;padding-left:8px;padding-right:8px}
      .ctf-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
      h1{letter-spacing:4px}
    }
    @media (max-width:520px){
      .shell{width:min(100% - 22px,1180px)}
      .brand{font-size:.82rem;letter-spacing:2px}
      .tab-content{padding:16px}
      .ctf-pane{padding:16px}
      .ctf-meta{grid-template-columns:1fr}
      .ctf-feed-item{grid-template-columns:1fr}
      .hero-actions .btn{width:100%}
    }