@import url('https://fonts.googleapis.com/css2?family=Bangers&family=Oswald:wght@400;600;700&family=Special+Elite&display=swap');

:root {
  --red:#e8102a;--yellow:#f5c518;--blue:#0a2d6e;
  --dark:#0d0d0d;--dark2:#0f0f1a;--dark3:#1a1a2e;
  --panel:#1a1a2e;--light:#f0ece0;--ink:#111;
  --green:#27ae60;--border:#2a2a2a;--text-dim:#888;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--dark);color:var(--light);font-family:'Oswald',sans-serif;overflow-x:hidden;
  cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Ccircle cx='10' cy='10' r='8' fill='%23e8102a' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") 10 10,crosshair}

body::before{content:'';position:fixed;inset:0;
  background-image:radial-gradient(circle,rgba(255,255,255,0.06) 1px,transparent 1px);
  background-size:12px 12px;pointer-events:none;z-index:0}
body::after{content:'';position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none;z-index:0;opacity:0.5}

.panel{border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);position:relative;z-index:1}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--red);border-bottom:5px solid var(--ink);
  display:flex;align-items:center;justify-content:space-between;padding:0 2rem;height:64px;box-shadow:0 5px 0 var(--ink)}
.nav-logo{font-family:'Bangers',cursive;font-size:2rem;letter-spacing:3px;color:var(--yellow);
  text-shadow:3px 3px 0 var(--ink);text-decoration:none;display:flex;align-items:center;gap:12px}
.nav-logo img{height:36px;object-fit:contain}
.nav-status{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,0.3);
  border:2px solid rgba(255,255,255,0.2);padding:4px 14px;border-radius:20px;
  font-size:0.75rem;letter-spacing:2px;font-weight:700;color:white;cursor:default}
.nav-status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);
  box-shadow:0 0 6px var(--green);animation:pulse 2s infinite}
.nav-status-dot.offline{background:var(--red);box-shadow:0 0 6px var(--red);animation:none}
.nav-links{display:flex;gap:1.5rem;list-style:none;align-items:center}
.nav-links a{color:#fff;text-decoration:none;font-weight:700;font-size:0.82rem;letter-spacing:2px;
  text-transform:uppercase;padding:4px 0;border-bottom:3px solid transparent;transition:border-color .2s,color .2s}
.nav-links a:hover{border-color:var(--yellow);color:var(--yellow)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}

/* ── BUTTONS ── */
.btn{display:inline-block;font-family:'Bangers',cursive;font-size:1.2rem;letter-spacing:3px;
  padding:.65rem 2rem;text-decoration:none;border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);
  transition:transform .15s,box-shadow .15s;cursor:pointer;text-align:center}
.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}
.btn-red{background:var(--red);color:#fff}
.btn-yellow{background:var(--yellow);color:var(--ink)}
.btn-blue{background:var(--blue);color:#fff}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,0.4);box-shadow:none}
.btn-ghost:hover{background:rgba(255,255,255,0.1);box-shadow:none}
.btn-sm{font-size:0.95rem;padding:.4rem 1.2rem;border-width:3px;box-shadow:3px 3px 0 var(--ink)}

/* ── ALERT BAR ── */
.alert-bar{background:var(--yellow);color:var(--ink);border-bottom:4px solid var(--ink);
  text-align:center;padding:.5rem 1rem;font-family:'Bangers',cursive;font-size:1.05rem;
  letter-spacing:2px;position:relative;z-index:99;margin-top:64px}
.alert-bar.online{background:var(--yellow)}
.alert-bar.offline{background:#333;color:#ff6b6b}

/* ── BANNER HERO ── */
.banner{width:100%;max-height:340px;object-fit:cover;object-position:center top;
  display:block;border-bottom:5px solid var(--ink);position:relative;z-index:1}
.banner-wrap{position:relative;z-index:1;overflow:hidden;background:#000}
.banner-wrap::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to bottom,transparent 40%,rgba(13,13,13,0.7) 100%)}

/* ── HERO SECTION ── */
#hero{min-height:85vh;display:flex;align-items:center;justify-content:center;flex-direction:column;
  text-align:center;padding:80px 2rem 4rem;position:relative;
  background:repeating-linear-gradient(-45deg,transparent,transparent 30px,rgba(232,16,42,0.04) 30px,rgba(232,16,42,0.04) 60px),
  radial-gradient(ellipse at 50% 50%,#1a0010 0%,#0d0d0d 70%);overflow:hidden}
#hero::before{content:'';position:absolute;inset:-50%;
  background:conic-gradient(from 0deg,transparent 0deg,transparent 10deg,rgba(245,197,24,0.03) 10deg,rgba(245,197,24,0.03) 20deg,transparent 20deg,transparent 30deg,rgba(245,197,24,0.03) 30deg,rgba(245,197,24,0.03) 40deg,transparent 40deg,transparent 50deg,rgba(245,197,24,0.03) 50deg,rgba(245,197,24,0.03) 60deg,transparent 60deg,transparent 70deg,rgba(245,197,24,0.03) 70deg,rgba(245,197,24,0.03) 80deg,transparent 80deg,transparent 90deg,rgba(245,197,24,0.03) 90deg,rgba(245,197,24,0.03) 360deg);
  animation:spin 80s linear infinite;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
.hero-eyebrow{font-family:'Special Elite',cursive;font-size:.9rem;letter-spacing:6px;color:var(--yellow);
  text-transform:uppercase;margin-bottom:1rem;animation:fadeDown .6s ease both}
.hero-title{font-family:'Bangers',cursive;font-size:clamp(5rem,14vw,11rem);line-height:0.9;color:#fff;
  text-shadow:6px 6px 0 var(--red),12px 12px 0 var(--ink);letter-spacing:4px;animation:fadeDown .7s .1s ease both}
.hero-title span{color:var(--yellow)}
.hero-subtitle{font-family:'Bangers',cursive;font-size:clamp(2rem,5vw,3.5rem);color:var(--red);
  text-shadow:3px 3px 0 var(--ink);letter-spacing:8px;margin-top:.5rem;animation:fadeDown .7s .2s ease both}
.hero-tagline{margin-top:1.5rem;max-width:560px;font-size:1rem;color:#ccc;line-height:1.6;animation:fadeDown .7s .3s ease both}
.hero-cta-row{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin-top:2.5rem;animation:fadeDown .7s .4s ease both}
.speech-bubble{position:relative;background:#fff;color:var(--ink);border:4px solid var(--ink);border-radius:20px;
  padding:.6rem 1.2rem;font-family:'Special Elite',cursive;font-size:.85rem;margin-top:2.5rem;display:inline-block;animation:fadeDown .7s .5s ease both}
.speech-bubble::after{content:'';position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);
  border:10px solid transparent;border-top:16px solid var(--ink)}
.speech-bubble::before{content:'';position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);
  border:8px solid transparent;border-top:14px solid #fff;z-index:1}
.scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.3rem;
  font-size:.7rem;letter-spacing:3px;color:#666;text-transform:uppercase}
.chevrons span{display:block;width:20px;height:20px;border-right:3px solid var(--red);border-bottom:3px solid var(--red);
  transform:rotate(45deg);animation:bounce 1.2s infinite}
.chevrons span:nth-child(2){animation-delay:.2s;margin-top:-10px}
@keyframes bounce{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
.onoma{position:absolute;font-family:'Bangers',cursive;opacity:0.04;pointer-events:none;user-select:none;letter-spacing:4px}
.onoma-1{font-size:12rem;top:5%;right:-2%;color:var(--yellow);transform:rotate(-15deg)}
.onoma-2{font-size:8rem;bottom:5%;left:-1%;color:var(--red);transform:rotate(10deg)}

/* ── TICKER ── */
#ticker{background:var(--red);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);
  padding:.6rem 0;overflow:hidden;white-space:nowrap;position:relative;z-index:1}
.ticker-track{display:inline-flex;animation:ticker 28s linear infinite;font-family:'Bangers',cursive;
  letter-spacing:3px;font-size:1rem;color:#fff}
.ticker-item{padding:0 2rem}
.ticker-star{color:var(--yellow)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── SECTIONS ── */
section{position:relative;z-index:1;padding:5rem 2rem}
.section-label{font-family:'Bangers',cursive;font-size:clamp(2.5rem,6vw,4rem);color:var(--yellow);
  text-shadow:3px 3px 0 var(--ink);letter-spacing:4px;text-align:center;margin-bottom:.3rem}
.section-rule{width:80px;height:6px;background:var(--red);border:2px solid var(--ink);margin:0 auto 2.5rem}

/* ── ABOUT ── */
#about{background:repeating-linear-gradient(90deg,transparent,transparent 28px,rgba(255,255,255,0.02) 28px,rgba(255,255,255,0.02) 30px),#0f0f1a}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;max-width:1100px;margin:0 auto}
.comic-card{background:var(--panel);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:2rem;position:relative;overflow:hidden}
.comic-card::before{content:attr(data-num);position:absolute;top:-10px;left:12px;font-family:'Bangers',cursive;font-size:7rem;color:rgba(255,255,255,0.04);line-height:1;pointer-events:none}
.comic-card h3{font-family:'Bangers',cursive;font-size:1.8rem;color:var(--yellow);text-shadow:2px 2px 0 var(--ink);letter-spacing:2px;margin-bottom:.8rem;border-bottom:3px solid var(--red);padding-bottom:.5rem}
.comic-card p{font-size:1.05rem;line-height:1.8;color:#bbb;font-weight:400}
.comic-card p+p{margin-top:.8rem}
.feature-full{grid-column:1/-1;background:linear-gradient(135deg,#1a0008 0%,var(--panel) 100%);display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.feature-icon-big{font-size:5rem;flex-shrink:0;filter:drop-shadow(3px 3px 0 var(--red))}
.zap{display:inline-block;background:var(--yellow);color:var(--ink);font-family:'Bangers',cursive;font-size:1.1rem;letter-spacing:2px;padding:.1rem .8rem;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);transform:rotate(-2deg);margin:0 .3rem}

/* ── STEPS ── */
#connect{background:#0d0d0d}
.steps-container{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:0}
.step{display:grid;grid-template-columns:80px 1fr;gap:0;position:relative}
.step:not(:last-child)::after{content:'';position:absolute;left:39px;top:80px;width:4px;height:calc(100% - 60px);
  background:repeating-linear-gradient(to bottom,var(--red) 0,var(--red) 10px,transparent 10px,transparent 20px)}
.step-num{width:70px;height:70px;border-radius:50%;background:var(--red);border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink);
  display:flex;align-items:center;justify-content:center;font-family:'Bangers',cursive;font-size:1.8rem;color:#fff;text-shadow:2px 2px 0 var(--ink);flex-shrink:0;margin-top:.5rem}
.step-body{background:var(--panel);border:4px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:1.5rem;margin:.5rem 0 2rem 1.2rem}
.step-body h3{font-family:'Bangers',cursive;font-size:1.5rem;color:var(--yellow);letter-spacing:2px;margin-bottom:.5rem}
.step-body p{font-size:1.05rem;line-height:1.8;color:#bbb;font-weight:400}
.step-body p+p{margin-top:.6rem}
.code-block{background:#000;border:3px solid var(--ink);padding:1rem 1.2rem;margin:.8rem 0;font-family:'Special Elite',cursive;font-size:.85rem;color:var(--yellow);position:relative;word-break:break-all}
.code-block .label{display:block;font-size:.7rem;color:#666;letter-spacing:2px;text-transform:uppercase;margin-bottom:.3rem;font-family:'Oswald',sans-serif}
.launch-options{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
.launch-option{background:#000;border:3px solid var(--ink);padding:1rem;text-align:center}
.launch-option h4{font-family:'Bangers',cursive;font-size:1.2rem;color:var(--yellow);letter-spacing:2px;margin-bottom:.4rem}
.launch-option p{font-size:.82rem;color:#888;line-height:1.5}

/* ── SERVER STATS ── */
#server{background:repeating-linear-gradient(90deg,transparent,transparent 28px,rgba(255,255,255,0.015) 28px,rgba(255,255,255,0.015) 30px),#0f0f1a}
.server-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;max-width:1100px;margin:0 auto}
.stat-card{background:var(--panel);padding:2rem 1.5rem;text-align:center;transition:transform .2s,box-shadow .2s}
.stat-card:hover{transform:translate(-3px,-3px);box-shadow:10px 10px 0 var(--ink)}
.stat-icon{font-size:2.5rem;display:block;margin-bottom:.5rem}
.stat-value{font-family:'Bangers',cursive;font-size:2.5rem;color:var(--yellow);text-shadow:2px 2px 0 var(--ink);letter-spacing:2px;line-height:1}
.stat-label{font-size:.75rem;letter-spacing:3px;text-transform:uppercase;color:#666;margin-top:.3rem}

/* ── FAQ ── */
.faq-list{max-width:860px;margin:0 auto}
.faq-item{border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);margin-bottom:1rem;background:var(--panel)}
.faq-q{width:100%;background:none;border:none;color:var(--light);font-family:'Bangers',cursive;font-size:1.3rem;letter-spacing:2px;
  padding:1.2rem 1.5rem;text-align:left;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
.faq-q span{color:var(--yellow);font-size:1.5rem;transition:transform .2s;display:inline-block}
.faq-a{display:none;padding:0 1.5rem 1.2rem;font-size:1.05rem;line-height:1.8;color:#bbb;border-top:2px dashed #333;font-weight:400}
.faq-item.open .faq-a{display:block}
.faq-item.open .faq-q span{transform:rotate(45deg)}

/* ── FORMS ── */
.page-wrap{padding-top:64px}
.form-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:6rem 2rem 3rem;
  background:repeating-linear-gradient(-45deg,transparent,transparent 30px,rgba(232,16,42,0.03) 30px,rgba(232,16,42,0.03) 60px),radial-gradient(ellipse at 50% 50%,#1a0010 0%,#0d0d0d 70%)}
.form-wrap{background:var(--panel);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);padding:2.5rem;width:100%;max-width:500px;position:relative}
.form-wrap::before{content:'';position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--red),var(--yellow),var(--blue))}
.form-title{font-family:'Bangers',cursive;font-size:2.5rem;letter-spacing:3px;color:#fff;margin-bottom:.3rem;text-shadow:3px 3px 0 var(--red)}
.form-subtitle{color:#666;font-size:.82rem;letter-spacing:1px;margin-bottom:1.8rem;font-weight:400}
.form-group{margin-bottom:1.2rem}
.form-label{display:block;font-size:.72rem;letter-spacing:2px;text-transform:uppercase;color:#666;font-weight:700;margin-bottom:.5rem}
.form-input{width:100%;background:#0d0d0d;border:3px solid var(--ink);border-left:5px solid var(--red);color:#fff;
  padding:.75rem 1rem;font-family:'Oswald',sans-serif;font-size:1rem;font-weight:600;outline:none;transition:border-color .2s}
.form-input:focus{border-color:#444;border-left-color:var(--yellow)}
select.form-input{cursor:pointer}select.form-input option{background:var(--panel)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-submit{width:100%;background:var(--red);border:4px solid var(--ink);color:#fff;padding:1rem;
  font-family:'Bangers',cursive;font-size:1.8rem;letter-spacing:4px;cursor:pointer;
  box-shadow:5px 5px 0 var(--ink);transition:transform .15s,box-shadow .15s;margin-top:.5rem}
.form-submit:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--ink)}
.form-link{text-align:center;margin-top:1rem;font-size:.85rem;color:#666;font-weight:400}
.form-link a{color:var(--yellow)}
.suffix-input{display:flex}
.suffix-input .form-input{border-right:none;flex:1}
.suffix-box{background:#000;border:3px solid var(--ink);border-left:none;padding:.75rem 1rem;
  color:#555;font-family:'Special Elite',cursive;font-size:.85rem;white-space:nowrap;display:flex;align-items:center}

/* ── ALERT ── */
.alert{padding:.9rem 1.2rem;margin-bottom:1.2rem;font-size:.88rem;font-weight:600;border-left:5px solid;font-family:'Oswald',sans-serif}
.alert-success{background:rgba(39,174,96,0.1);border-color:var(--green);color:#5dde8e}
.alert-error{background:rgba(232,16,42,0.1);border-color:var(--red);color:#ff6b6b}
.alert-info{background:rgba(10,45,110,0.2);border-color:#2980b9;color:#6ab0d4}

/* ── DASHBOARD ── */
.dash-page{padding-top:64px;min-height:100vh;
  background:repeating-linear-gradient(90deg,transparent,transparent 28px,rgba(255,255,255,0.015) 28px,rgba(255,255,255,0.015) 30px),#0f0f1a}
.dash-container{max-width:1100px;margin:0 auto;padding:2rem}
.dash-header-card{background:var(--panel);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);
  padding:1.5rem 2rem;margin-bottom:1.5rem;border-top:6px solid var(--red)}
.dash-label{font-size:.72rem;letter-spacing:3px;text-transform:uppercase;color:var(--yellow);font-weight:700;margin-bottom:.3rem}
.dash-title{font-family:'Bangers',cursive;font-size:2.5rem;letter-spacing:2px;color:#fff}
.dash-sub{color:#666;font-size:.88rem;font-weight:400;margin-top:.2rem}
.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.dash-card{background:var(--panel);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:2rem;position:relative}
.dash-card-label{font-size:.72rem;letter-spacing:3px;text-transform:uppercase;color:var(--yellow);font-weight:700;margin-bottom:.5rem}
.dash-card-title{font-family:'Bangers',cursive;font-size:2rem;letter-spacing:2px;color:#fff;margin-bottom:.3rem}
.dash-card-sub{color:#666;font-size:.82rem;font-weight:400;margin-bottom:1.5rem}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.info-box{background:#0d0d0d;border:2px solid var(--ink);padding:.8rem 1rem}
.info-box-label{font-size:.65rem;letter-spacing:2px;text-transform:uppercase;color:#555;font-weight:700;margin-bottom:.3rem}
.info-box-value{font-family:'Bangers',cursive;font-size:1.2rem;letter-spacing:1px;color:#fff}
.info-box-value.small{font-family:'Oswald',sans-serif;font-size:.9rem;color:#ccc;word-break:break-all}
.game-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(39,174,96,0.1);border:2px solid var(--green);
  color:var(--green);padding:3px 12px;font-size:.75rem;font-weight:700;letter-spacing:1px;margin-top:.5rem}
.stat-mini{background:#0d0d0d;border:2px solid var(--ink);padding:1rem;text-align:center}
.stat-mini-val{font-family:'Bangers',cursive;font-size:2rem;color:var(--yellow);letter-spacing:2px}
.stat-mini-label{font-size:.65rem;letter-spacing:2px;text-transform:uppercase;color:#555;margin-top:.2rem}
.dash-tabs{display:flex;border-bottom:3px solid var(--ink);margin-bottom:1.5rem;gap:0}
.dash-tab{padding:.8rem 1.5rem;font-family:'Bangers',cursive;font-size:1.1rem;letter-spacing:2px;
  color:#555;cursor:pointer;border-bottom:4px solid transparent;transition:all .15s;border-top:none;border-left:none;border-right:none;background:none}
.dash-tab.active{color:var(--yellow);border-bottom-color:var(--red)}
.dash-tab:hover{color:#ccc}
.dash-panel{display:none}.dash-panel.active{display:block}
.server-status-card{background:var(--panel);border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:2rem}
.server-online-badge{display:flex;align-items:center;gap:10px;font-family:'Bangers',cursive;font-size:2rem;letter-spacing:3px;margin-bottom:1rem}
.sdot{width:14px;height:14px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2s infinite}
.sdot.offline{background:var(--red);box-shadow:0 0 10px var(--red);animation:none}

/* ── ADMIN ── */
.admin-page{padding-top:64px;min-height:100vh;background:#0d0d0d}
.admin-container{max-width:1300px;margin:0 auto;padding:2rem}
.admin-stats-row{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-bottom:1.5rem}
.astat{background:var(--panel);border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:1.2rem;
  border-top:5px solid var(--red);text-align:center}
.astat-label{font-size:.65rem;letter-spacing:2px;text-transform:uppercase;color:#555;font-weight:700;margin-bottom:.3rem}
.astat-value{font-family:'Bangers',cursive;font-size:2rem;color:#fff;letter-spacing:2px}
.astat-value.green{color:var(--green)}.astat-value.gold{color:var(--yellow)}
.admin-layout{display:grid;grid-template-columns:190px 1fr;gap:1.5rem}
.admin-sidebar{background:var(--panel);border:4px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:1.2rem}
.admin-sidebar-title{font-family:'Bangers',cursive;font-size:1.3rem;letter-spacing:2px;color:var(--yellow);
  margin-bottom:1rem;padding-bottom:.8rem;border-bottom:3px solid var(--ink)}
.qcmd-sec{font-size:.65rem;letter-spacing:2px;text-transform:uppercase;color:#555;font-weight:700;margin:1rem 0 .4rem}
.qcmd-btn{display:block;width:100%;background:#0d0d0d;border:2px solid var(--ink);color:#ccc;
  padding:.7rem 1rem;font-family:'Oswald',sans-serif;font-size:.85rem;font-weight:600;text-align:left;
  cursor:pointer;margin-bottom:3px;transition:all .15s}
.qcmd-btn:hover{background:rgba(232,16,42,0.1);border-color:var(--red);color:#fff;padding-left:1.3rem}
.qcmd-disabled{padding:.5rem 1rem;font-size:.8rem;color:#333;border-left:2px solid #222;margin-bottom:2px;text-decoration:line-through}
.admin-tabs{display:flex;border-bottom:3px solid var(--ink);margin-bottom:1.2rem;flex-wrap:wrap}
.admin-tab{padding:.8rem 1.2rem;font-family:'Bangers',cursive;font-size:1.05rem;letter-spacing:2px;
  color:#555;cursor:pointer;border-bottom:4px solid transparent;transition:all .15s;background:none;border-top:none;border-left:none;border-right:none;white-space:nowrap}
.admin-tab.active{color:var(--yellow);border-bottom-color:var(--red)}
.admin-panel{display:none}.admin-panel.active{display:block}
.console-output{background:#000;border:3px solid var(--ink);padding:1rem;height:340px;overflow-y:auto;
  font-family:'Special Elite',cursive;font-size:.78rem;line-height:1.8;margin-bottom:.5rem}
.cline{color:#555}.cline.info{color:#7fb3d0}.cline.success{color:var(--green)}.cline.error{color:#ff6b6b}.cline.cmd{color:var(--yellow)}.cline.warn{color:#e67e22}
.console-input-wrap{display:flex;align-items:center}
.console-prompt{background:var(--panel);border:3px solid var(--ink);border-right:none;padding:.75rem 1rem;color:var(--red);font-family:'Special Elite',cursive}
.console-input{flex:1;background:var(--panel);border:3px solid var(--ink);border-right:none;color:#fff;
  padding:.75rem 1rem;font-family:'Special Elite',cursive;font-size:.85rem;outline:none}
.console-send{background:var(--red);border:3px solid var(--ink);color:#fff;padding:.75rem 1.2rem;
  font-family:'Bangers',cursive;font-size:1.1rem;letter-spacing:2px;cursor:pointer}
.console-send:hover{background:#c0000f}
.players-table{width:100%;border-collapse:collapse}
.players-table th{text-align:left;padding:.7rem 1rem;font-size:.65rem;letter-spacing:2px;text-transform:uppercase;
  color:#555;border-bottom:3px solid var(--ink);background:#000}
.players-table td{padding:.8rem 1rem;border-bottom:2px solid var(--ink);vertical-align:middle;font-size:.88rem}
.player-row:hover td{background:rgba(232,16,42,0.05)}
.pname{font-family:'Bangers',cursive;font-size:1.1rem;letter-spacing:1px;color:#fff}
.pactions{display:flex;gap:5px;flex-wrap:wrap}
.pact{background:#000;border:2px solid var(--ink);color:#888;padding:3px 10px;font-family:'Oswald',sans-serif;font-size:.75rem;font-weight:700;cursor:pointer;transition:all .15s;letter-spacing:1px}
.pact:hover{border-color:var(--red);color:#fff}
.pact.g:hover{border-color:var(--green);color:var(--green)}
.pact.b:hover{border-color:#2980b9;color:#6ab0d4}
.pact.y:hover{border-color:var(--yellow);color:var(--yellow)}
.badge-on{background:rgba(39,174,96,0.15);color:var(--green);padding:2px 8px;font-size:.7rem;font-weight:700;letter-spacing:1px;border:1px solid var(--green)}
.badge-off{background:rgba(232,16,42,0.15);color:#ff6b6b;padding:2px 8px;font-size:.7rem;font-weight:700;letter-spacing:1px;border:1px solid var(--red)}
.mem-bar-wrap{background:#000;height:6px;margin-top:6px;border:1px solid var(--ink)}
.mem-bar{height:100%;background:linear-gradient(90deg,var(--red),var(--yellow));transition:width .5s}
.result-box{padding:.8rem 1rem;font-size:.82rem;border-left:4px solid;font-family:'Special Elite',cursive;white-space:pre-wrap;margin-top:.8rem}
.result-box.ok{background:rgba(39,174,96,0.08);border-color:var(--green);color:#5dde8e}
.result-box.err{background:rgba(232,16,42,0.08);border-color:var(--red);color:#ff6b6b}
.empty-state{text-align:center;padding:3rem;color:#444;font-weight:400}
.refresh-btn{background:none;border:2px solid var(--ink);color:#555;padding:4px 12px;font-size:.75rem;
  cursor:pointer;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:1px;transition:all .15s}
.refresh-btn:hover{border-color:var(--red);color:#fff}
.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.card-head-title{font-family:'Bangers',cursive;font-size:1.5rem;letter-spacing:2px;color:var(--yellow)}

/* ── FOOTER ── */
footer{background:var(--red);border-top:6px solid var(--ink);padding:3rem 2rem 2rem;text-align:center;position:relative;z-index:1}
.footer-logo{font-family:'Bangers',cursive;font-size:3rem;color:var(--yellow);text-shadow:3px 3px 0 var(--ink);letter-spacing:4px}
.footer-tagline{font-family:'Special Elite',cursive;font-size:.85rem;color:rgba(255,255,255,0.7);margin:.5rem 0 1.5rem}
.footer-links{display:flex;justify-content:center;gap:2rem;flex-wrap:wrap;list-style:none;margin-bottom:2rem}
.footer-links a{color:#fff;text-decoration:none;font-size:.8rem;letter-spacing:2px;text-transform:uppercase;border-bottom:2px solid transparent;transition:border-color .2s}
.footer-links a:hover{border-color:var(--yellow)}
.footer-disclaimer{font-size:.72rem;color:rgba(0,0,0,0.4);max-width:640px;margin:0 auto;line-height:1.6;font-weight:400}

/* ── PAGE HERO ── */
.page-hero{background:var(--panel);border-bottom:5px solid var(--ink);padding:4rem 2rem;text-align:center;margin-top:64px}
.page-hero-title{font-family:'Bangers',cursive;font-size:4rem;letter-spacing:5px;color:#fff;text-shadow:4px 4px 0 var(--red)}
.page-hero-sub{color:#666;font-size:.88rem;margin-top:.5rem;letter-spacing:2px;font-weight:400;text-transform:uppercase}

/* ── SCROLL REVEAL ── */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#000}::-webkit-scrollbar-thumb{background:var(--red)}

/* ── RESPONSIVE ── */
@media(max-width:700px){.about-grid{grid-template-columns:1fr}.dash-grid{grid-template-columns:1fr}.admin-layout{grid-template-columns:1fr}.admin-stats-row{grid-template-columns:repeat(3,1fr)}.form-row{grid-template-columns:1fr}.launch-options{grid-template-columns:1fr}.nav-links{display:none}.info-grid{grid-template-columns:1fr}}

/* ── LOGO OVERRIDE ── */
.nav-logo {
  font-family: 'Bangers', cursive !important;
  font-size: 1.8rem !important;
  letter-spacing: 3px !important;
  color: white !important;
  text-shadow: 3px 3px 0 var(--ink), -1px -1px 0 var(--red) !important;
  text-decoration: none;
  white-space: nowrap;
}
.nav-logo span {
  color: var(--yellow) !important;
  text-shadow: 3px 3px 0 var(--ink) !important;
}

/* ── NAV STATUS PILL — inline in nav links ── */
.nav-links .nav-status {
  display: flex;
  align-items: center;
  gap: 7px;
  background: rgba(0,0,0,0.35);
  border: 2px solid rgba(255,255,255,0.2);
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 0.75rem;
  letter-spacing: 2px;
  font-weight: 700;
  color: white;
  white-space: nowrap;
}

/* ── LOGO — matches hero title style ── */
.nav-logo {
  font-family: 'Bangers', cursive !important;
  font-size: 1.6rem !important;
  letter-spacing: 2px !important;
  text-decoration: none !important;
  text-shadow: none !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.nav-logo .logo-marvel {
  color: white;
  text-shadow: 2px 2px 0 var(--red), 4px 4px 0 var(--ink);
}
.nav-logo .logo-heroes {
  color: var(--yellow);
  text-shadow: 2px 2px 0 var(--red), 4px 4px 0 var(--ink);
}
.nav-logo .logo-reborn {
  color: var(--red);
  text-shadow: 2px 2px 0 var(--ink);
}

/* ── HERO RAYS — more dramatic ── */
#hero::before {
  content: '';
  position: absolute;
  inset: -100%;
  background: repeating-conic-gradient(
    rgba(245,197,24,0.07) 0deg,
    rgba(245,197,24,0.07) 6deg,
    transparent 6deg,
    transparent 12deg
  );
  animation: spin 20s linear infinite !important;
  pointer-events: none;
}

/* Slow down rays */
#hero::before {
  animation: spin 120s linear infinite !important;
}

/* Remove black bar gap between nav and alert bar */
#hero, .alert-bar, #ticker {
  position: relative;
  z-index: 1;
}
nav + div, nav + .alert-bar {
  margin-top: 0 !important;
}

/* ── DASHBOARD FORM IMPROVEMENTS ── */
.dash-card .form-input {
  font-size: 1.1rem !important;
  padding: 1rem 1.2rem !important;
}
.dash-card .form-label {
  font-size: 0.8rem !important;
  letter-spacing: 2px !important;
  margin-bottom: 0.6rem !important;
}
.dash-card .form-group {
  margin-bottom: 1.4rem !important;
}

/* Fix suffix input alignment */
.suffix-input {
  display: flex !important;
  align-items: stretch !important;
}
.suffix-input .form-input {
  flex: 1 !important;
  min-width: 0 !important;
}
.suffix-box {
  background: #0d0d0d !important;
  border: 3px solid var(--ink) !important;
  border-left: none !important;
  padding: 1rem 1.2rem !important;
  color: #888 !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

/* Bigger info box values */
.info-box-value {
  font-family: 'Bangers', cursive !important;
  font-size: 1.4rem !important;
  letter-spacing: 1px !important;
  color: #fff !important;
}
.info-box-value.small {
  font-family: 'Oswald', sans-serif !important;
  font-size: 1rem !important;
  color: #ccc !important;
  word-break: break-all !important;
}
.info-box-label {
  font-size: 0.72rem !important;
  letter-spacing: 2px !important;
  margin-bottom: 0.4rem !important;
}
.info-box {
  padding: 1rem 1.2rem !important;
}

/* Bigger dash card text */
.dash-card-title {
  font-size: 2.2rem !important;
  margin-bottom: 0.5rem !important;
}
.dash-card-sub {
  font-size: 0.95rem !important;
  margin-bottom: 1.8rem !important;
}

/* Bigger form submit in dash */
.dash-card .form-submit {
  font-size: 1.6rem !important;
  padding: 1.1rem !important;
}

/* ── CLEAN FORM PAGES ── */
.clean-form-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 1.5rem 3rem;
  background: #0d0d0d;
}
.clean-form-card {
  background: #161622;
  border-radius: 16px;
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 480px;
  border: 1px solid rgba(255,255,255,0.08);
}
.clean-form-label {
  font-size: 0.72rem;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.clean-form-title {
  font-family: 'Oswald', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: white;
  margin-bottom: 0.5rem;
  letter-spacing: 0;
}
.clean-form-sub {
  font-size: 0.95rem;
  color: #888;
  line-height: 1.6;
  margin-bottom: 2rem;
  font-weight: 400;
}
.clean-form-group {
  margin-bottom: 1.2rem;
}
.clean-label {
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  color: white;
  margin-bottom: 0.5rem;
  letter-spacing: 0;
}
.clean-input {
  width: 100%;
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  color: white;
  padding: 0.9rem 1.1rem;
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  outline: none;
  transition: border-color 0.2s;
}
.clean-input:focus {
  border-color: rgba(255,255,255,0.3);
}
.clean-submit {
  width: 100%;
  background: linear-gradient(135deg, #ff6b6b, var(--red));
  border: none;
  border-radius: 50px;
  color: white;
  padding: 1rem;
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 3px;
  cursor: pointer;
  margin-top: 0.5rem;
  transition: opacity 0.2s, transform 0.1
cat >> /opt/mhportal/public/css/style.css << 'CSSEOF'

/* ── CLEAN FORM PAGES ── */
.clean-form-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 1.5rem 3rem;
  background: #0d0d0d;
}
.clean-form-card {
  background: #161622;
  border-radius: 16px;
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 480px;
  border: 1px solid rgba(255,255,255,0.08);
}
.clean-form-label {
  font-size: 0.72rem;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--red);
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.clean-form-title {
  font-family: 'Oswald', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: white;
  margin-bottom: 0.5rem;
  letter-spacing: 0;
}
.clean-form-sub {
  font-size: 0.95rem;
  color: #888;
  line-height: 1.6;
  margin-bottom: 2rem;
  font-weight: 400;
}
.clean-form-group {
  margin-bottom: 1.2rem;
}
.clean-label {
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  color: white;
  margin-bottom: 0.5rem;
  letter-spacing: 0;
}
.clean-input {
  width: 100%;
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  color: white;
  padding: 0.9rem 1.1rem;
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  outline: none;
  transition: border-color 0.2s;
}
.clean-input:focus {
  border-color: rgba(255,255,255,0.3);
}
.clean-submit {
  width: 100%;
  background: linear-gradient(135deg, #ff6b6b, var(--red));
  border: none;
  border-radius: 50px;
  color: white;
  padding: 1rem;
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 3px;
  cursor: pointer;
  margin-top: 0.5rem;
  transition: opacity 0.2s, transform 0.15s;
}
.clean-submit:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}
.clean-form-hint {
  text-align: center;
  margin-top: 1.2rem;
  font-size: 0.9rem;
  color: #666;
  font-weight: 400;
}
.clean-form-hint a {
  color: #aaa;
  text-decoration: underline;
}
.clean-form-disclaimer {
  margin-top: 2rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 0.75rem;
  color: #444;
  line-height: 1.6;
  font-weight: 400;
}

/* ══════════════════════════════════════
   CLEAN DARK THEME — Dashboard & Site
   ══════════════════════════════════════ */

/* Dashboard page */
.dash-page {
  background: #0d0d0d !important;
}
.dash-container {
  max-width: 1000px !important;
}

/* Header card */
.dash-header-card {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  border-top: 3px solid var(--red) !important;
}
.dash-label {
  font-size: 0.72rem !important;
  letter-spacing: 3px !important;
  color: var(--red) !important;
}
.dash-title {
  font-family: 'Oswald', sans-serif !important;
  font-size: 2.5rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}
.dash-sub {
  font-size: 0.95rem !important;
  color: #666 !important;
  font-weight: 400 !important;
}

/* Tabs */
.dash-tabs {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  margin-bottom: 1.5rem !important;
}
.dash-tab {
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  color: #555 !important;
  padding: 0.8rem 1.5rem !important;
}
.dash-tab.active {
  color: white !important;
  border-bottom-color: var(--red) !important;
}

/* Cards */
.dash-card {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 2rem !important;
}
.dash-card-label {
  font-size: 0.72rem !important;
  letter-spacing: 3px !important;
  color: var(--red) !important;
  margin-bottom: 0.4rem !important;
}
.dash-card-title {
  font-family: 'Oswald', sans-serif !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  color: white !important;
}
.dash-card-sub {
  color: #666 !important;
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  margin-bottom: 1.5rem !important;
}

/* Info boxes */
.info-box {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 10px !important;
  padding: 1rem 1.2rem !important;
}
.info-box-label {
  font-size: 0.7rem !important;
  letter-spacing: 2px !important;
  color: #555 !important;
  text-transform: uppercase !important;
  margin-bottom: 0.4rem !important;
}
.info-box-value {
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: white !important;
  letter-spacing: 0 !important;
}
.info-box-value.small {
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.9rem !important;
  color: #aaa !important;
  font-weight: 400 !important;
}

/* Forms inside dashboard */
.dash-card .form-input,
.dash-card .clean-input {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-left: 1px solid rgba(255,255,255,0.1) !important;
  border-radius: 10px !important;
  color: white !important;
  padding: 0.9rem 1.1rem !important;
  font-size: 1rem !important;
  font-family: 'Oswald', sans-serif !important;
}
.dash-card .form-input:focus {
  border-color: rgba(255,255,255,0.25) !important;
}
.dash-card .form-label {
  font-size: 0.9rem !important;
  letter-spacing: 0 !important;
  font-weight: 700 !important;
  color: white !important;
  text-transform: none !important;
}
.dash-card .btn-red,
.dash-card .form-submit {
  background: linear-gradient(135deg, #ff6b6b, var(--red)) !important;
  border: none !important;
  border-radius: 50px !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1rem !important;
  letter-spacing: 3px !important;
  box-shadow: none !important;
  padding: 0.9rem !important;
}

/* Suffix input */
.suffix-input .form-input {
  border-radius: 10px 0 0 10px !important;
}
.suffix-box {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-left: none !important;
  border-radius: 0 10px 10px 0 !important;
  color: #666 !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.95rem !important;
}

/* Server status */
.server-status-card {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.stat-mini {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 10px !important;
}
.stat-mini-val {
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
}
.stat-mini-label {
  font-size: 0.7rem !important;
  letter-spacing: 2px !important;
}
.game-badge {
  border-radius: 6px !important;
  font-size: 0.8rem !important;
}

/* Admin page clean */
.admin-page {
  background: #0d0d0d !important;
}
.admin-container {
  max-width: 1300px !important;
}
.astat {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  border-top: 3px solid var(--red) !important;
}
.admin-sidebar {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
.admin-sidebar-title {
  font-family: 'Oswald', sans-serif !important;
  color: white !important;
  font-size: 1.1rem !important;
}
.qcmd-btn {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  color: #aaa !important;
  font-family: 'Oswald', sans-serif !important;
}
.qcmd-btn:hover {
  background: rgba(232,16,42,0.1) !important;
  border-color: var(--red) !important;
  color: white !important;
  padding-left: 1rem !important;
}
.admin-tabs {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.admin-tab {
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.9rem !important;
}
.admin-tab.active {
  color: white !important;
  border-bottom-color: var(--red) !important;
}
.console-output {
  background: #0a0a0a !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 8px !important;
}
.console-input {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-right: none !important;
  border-radius: 8px 0 0 8px !important;
}
.console-prompt {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-right: none !important;
  border-radius: 8px 0 0 8px !important;
}
.console-send {
  background: var(--red) !important;
  border: none !important;
  border-radius: 0 8px 8px 0 !important;
}
.players-table th {
  background: #1e1e2e !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.players-table td {
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
}
.player-row:hover td {
  background: rgba(255,255,255,0.02) !important;
}
.pact {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 6px !important;
}
.result-box {
  border-radius: 8px !important;
}

/* About/server/faq sections cleaner text */
.comic-card {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.comic-card::before {
  display: none !important;
}
.comic-card h3 {
  color: white !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.4rem !important;
  text-shadow: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
.comic-card p {
  color: #aaa !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
}
.stat-card {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.stat-card:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: rgba(255,255,255,0.15) !important;
}
.stat-value {
  font-family: 'Oswald', sans-serif !important;
  text-shadow: none !important;
}
.faq-item {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  margin-bottom: 0.8rem !important;
}
.faq-q {
  font-family: 'Oswald', sans-serif !important;
  font-size: 1.1rem !important;
  letter-spacing: 0 !important;
  font-weight: 600 !important;
}
.faq-a {
  color: #888 !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
}
.step-body {
  background: #161622 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.step-body h3 {
  font-family: 'Oswald', sans-serif !important;
  color: white !important;
  letter-spacing: 0 !important;
}
.step-body p {
  color: #aaa !important;
  font-weight: 400 !important;
}
.code-block {
  background: #0a0a0a !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 8px !important;
}
.launch-option {
  background: #1e1e2e !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 10px !important;
}
.launch-option h4 {
  font-family: 'Oswald', sans-serif !important;
  letter-spacing: 0 !important;
}
.section-label {
  text-shadow: none !important;
  font-size: clamp(1.8rem, 4vw, 3rem) !important;
}
.page-hero {
  background: #161622 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 0 !important;
}
.page-hero-title {
  text-shadow: none !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 3rem !important;
}
.page-hero-sub {
  color: #666 !important;
}

/* ── CLEAN TABS ── */
.clean-tab {
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  color: #555;
  font-family: 'Oswald', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 0.8rem 1.5rem;
  cursor: pointer;
  transition: all 0.15s;
}
.clean-tab.active { color: white; border-bottom-color: var(--red); }
.clean-tab:hover { color: #ccc; }
.clean-panel { display: none; }
.clean-panel.active { display: block; }

/* ── CLEAN INFO BOXES ── */
.clean-info-box {
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 0.9rem 1.1rem;
}
.clean-info-label {
  font-size: 0.7rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #555;
  margin-bottom: 0.3rem;
  font-weight: 700;
}
.clean-info-value {
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: white;
}

/* ── CLEAN SUFFIX INPUT ── */
.clean-suffix-wrap {
  display: flex;
  align-items: stretch;
}
.clean-input-suffix {
  border-radius: 10px 0 0 10px !important;
  border-right: none !important;
  flex: 1;
}
.clean-suffix-box {
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-left: none;
  border-radius: 0 10px 10px 0;
  padding: 0.9rem 1.1rem;
  color: #666;
  font-family: 'Oswald', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  white-space: nowrap;
  display: flex;
  align-items: center;
}

/* ── CLEAN TABS FIX ── */
.clean-tab {
  background: none !important;
  border: none !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #555 !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.8rem 1.5rem !important;
  cursor: pointer !important;
  transition: all 0.15s !important;
  -webkit-appearance: none !important;
}
.clean-tab:hover { color: #ccc !important; }
.clean-tab.active { color: white !important; border-bottom: 3px solid var(--red) !important; }

.clean-tabs-bar {
  display: flex !important;
  gap: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  margin-bottom: 1.5rem !important;
  background: transparent !important;
  padding: 0 !important;
}
.clean-tabs-bar button {
  -webkit-appearance: none !important;
  appearance: none !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 3px solid transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #555 !important;
  font-family: 'Oswald', sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 0.8rem 1.8rem !important;
  cursor: pointer !important;
  margin-bottom: -1px !important;
}
.clean-tabs-bar button:hover { color: #ccc !important; }
.clean-tabs-bar button.active {
  color: white !important;
  border-bottom: 3px solid var(--red) !important;
}
