/* ============================================
   半岛体育 - 军事作战指挥室主题样式
   Color System:
   - Primary: #0D1117 (深空黑)
   - Accent: #2EA043 (战术绿)
   - Alert: #F85149 (警戒红)
   - Text: #C9D1D9 (科技灰)
   - Link: #2EA043 (战术绿)
   ============================================ */

/* === 干扰标签隐藏 === */
.bd-b-1,.bd-b-2,.bd-b-3,.bd-b-4,.bd-b-5,.bd-b-6,.bd-b-7,.bd-b-8,.bd-b-9,.bd-b-10,
.bd-b-11,.bd-b-12,.bd-b-13,.bd-b-14,.bd-b-15,.bd-b-16,.bd-b-17,.bd-b-18,.bd-b-19,.bd-b-20,
.command-1,.command-2,.command-3,.command-4,.command-5,.command-6,.command-7,.command-8,.command-9,.command-10,
.command-11,.command-12,.command-13,.command-14,.command-15,.command-16,.command-17,.command-18,.command-19,.command-20{display:none}

/* === Reset & Base === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{
  font-family:'Source Han Sans CN','Noto Sans SC','Roboto Mono',monospace;
  background:#0D1117;
  color:#C9D1D9;
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased
}
a{color:#2EA043;text-decoration:none;transition:color .2s}
a:hover{color:#3bd458}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5,h6{font-family:'Roboto Mono','Source Han Sans CN',monospace;color:#e6edf3;line-height:1.3}

/* === Utility === */
.container{max-width:1440px;margin:0 auto;padding:0 20px}
.section-tag{
  font-family:'Roboto Mono',monospace;
  font-size:.75rem;
  color:#2EA043;
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:8px;
  display:block
}
.section-title{font-size:1.8rem;margin-bottom:1rem;position:relative;padding-left:16px;border-left:3px solid #2EA043}
.hud-border{border:1px solid rgba(46,160,67,.3);position:relative}
.hud-border::before,.hud-border::after{
  content:'';position:absolute;width:12px;height:12px;border-color:#2EA043
}
.hud-border::before{top:-1px;left:-1px;border-top:2px solid;border-left:2px solid}
.hud-border::after{bottom:-1px;right:-1px;border-bottom:2px solid;border-right:2px solid}
.btn-primary{
  display:inline-block;
  padding:12px 32px;
  background:transparent;
  border:2px solid #2EA043;
  color:#2EA043;
  font-family:'Roboto Mono',monospace;
  font-size:.9rem;
  letter-spacing:2px;
  text-transform:uppercase;
  cursor:pointer;
  transition:all .3s;
  position:relative;
  overflow:hidden
}
.btn-primary:hover{background:#2EA043;color:#0D1117}
.btn-primary::before{
  content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(46,160,67,.2),transparent);
  transition:left .5s
}
.btn-primary:hover::before{left:100%}
.btn-alert{border-color:#F85149;color:#F85149}
.btn-alert:hover{background:#F85149;color:#0D1117}

/* === Grid Lines Background === */
.grid-bg{
  background-image:
    linear-gradient(rgba(46,160,67,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(46,160,67,.05) 1px,transparent 1px);
  background-size:40px 40px
}

/* === Navigation === */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(13,17,23,.85);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(46,160,67,.15);
  transition:background .3s
}
.nav:hover{background:rgba(13,17,23,.95)}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  max-width:1440px;margin:0 auto;padding:0 20px;height:64px
}
.nav-logo{
  font-family:'Roboto Mono',monospace;
  font-size:1.2rem;font-weight:700;
  color:#2EA043;letter-spacing:2px;
  display:flex;align-items:center;gap:8px
}
.nav-logo .logo-icon{
  width:32px;height:32px;
  border:2px solid #2EA043;
  border-radius:4px;
  display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:1rem
}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none}
.nav-links a{
  padding:8px 14px;font-size:.82rem;
  color:#C9D1D9;letter-spacing:1px;
  transition:all .2s;border-radius:2px
}
.nav-links a:hover,.nav-links a.active{color:#2EA043;background:rgba(46,160,67,.08)}
.nav-links .highlight a{
  border:1px solid #2EA043;color:#2EA043;
  animation:pulse-border 2s infinite
}
@keyframes pulse-border{
  0%,100%{border-color:#2EA043}
  50%{border-color:rgba(46,160,67,.3)}
}
.nav-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.nav-toggle span{width:24px;height:2px;background:#2EA043;transition:all .3s}

/* === Hero Section === */
.hero{
  position:relative;height:100vh;min-height:600px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden
}
.hero-bg{
  position:absolute;inset:0;
  background:url('../images/hero-bg.webp') center/cover no-repeat;
  filter:brightness(.4)
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(13,17,23,.6) 0%,rgba(13,17,23,.9) 100%)
}
.hero-content{position:relative;z-index:2;text-align:center;padding:0 20px}
.hero-content h1{font-size:2.8rem;margin-bottom:1rem;letter-spacing:4px}
.hero-content h1 span{color:#2EA043}
.hero-content p{font-size:1.1rem;max-width:700px;margin:0 auto 2rem;opacity:.85}

/* === Radar Animation === */
.radar-container{
  width:200px;height:200px;margin:0 auto 2rem;position:relative
}
.radar-circle{
  position:absolute;inset:0;
  border:1px solid rgba(46,160,67,.3);
  border-radius:50%
}
.radar-circle:nth-child(2){inset:25%}
.radar-circle:nth-child(3){inset:45%}
.radar-sweep{
  position:absolute;top:50%;left:50%;width:50%;height:2px;
  background:linear-gradient(90deg,#2EA043,transparent);
  transform-origin:left center;
  animation:radar-spin 3s linear infinite
}
@keyframes radar-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.radar-dot{
  position:absolute;width:6px;height:6px;
  background:#2EA043;border-radius:50%;
  animation:radar-blink 2s infinite
}
@keyframes radar-blink{0%,100%{opacity:1}50%{opacity:.2}}

/* === Intel Cards (Module 2) === */
.intel-section{padding:80px 0}
.intel-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:2rem}
.intel-card{
  background:rgba(13,17,23,.8);
  border:1px solid rgba(46,160,67,.2);
  padding:24px;position:relative;
  transition:all .3s
}
.intel-card:hover{border-color:#2EA043;transform:translateY(-4px)}
.intel-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#2EA043,transparent)
}
.intel-card .match-tag{
  font-family:'Roboto Mono',monospace;font-size:.7rem;
  color:#2EA043;letter-spacing:2px;margin-bottom:12px
}
.intel-card .teams{font-size:1.2rem;font-weight:700;margin-bottom:8px}
.intel-card .teams .vs{color:#F85149;margin:0 8px;font-size:.9rem}
.intel-card .match-time{font-size:.8rem;opacity:.6;margin-bottom:16px}
.win-bar{
  display:flex;height:8px;border-radius:1px;overflow:hidden;margin:12px 0;
  background:rgba(255,255,255,.05)
}
.win-bar .home{background:#2EA043}
.win-bar .draw{background:#C9D1D9}
.win-bar .away{background:#F85149}
.win-labels{display:flex;justify-content:space-between;font-size:.75rem;font-family:'Roboto Mono',monospace}
.key-intel{
  margin-top:12px;padding-top:12px;
  border-top:1px solid rgba(46,160,67,.1);
  font-size:.85rem;opacity:.8
}
.key-intel .label{color:#2EA043;font-size:.7rem;letter-spacing:1px;margin-bottom:4px}

/* === Tactical Room Entry (Module 3) === */
.tactical-entry{
  padding:100px 0;text-align:center;
  position:relative;overflow:hidden
}
.tactical-entry .radar-big{
  width:300px;height:300px;margin:0 auto 2rem;
  position:relative;opacity:.6
}
.tactical-entry h2{font-size:2rem;letter-spacing:6px;margin-bottom:.5rem}
.tactical-entry .sub{font-size:1rem;opacity:.7;margin-bottom:2rem}
.btn-access{
  display:inline-block;padding:16px 48px;
  border:2px solid #2EA043;color:#2EA043;
  font-family:'Roboto Mono',monospace;font-size:1rem;
  letter-spacing:3px;position:relative;
  overflow:hidden;cursor:pointer;
  transition:all .3s;
  animation:glow-border 2s infinite alternate
}
@keyframes glow-border{
  from{box-shadow:0 0 10px rgba(46,160,67,.2)}
  to{box-shadow:0 0 30px rgba(46,160,67,.4)}
}
.btn-access:hover{background:#2EA043;color:#0D1117}

/* === Ticker (Module 4) === */
.ticker-section{
  padding:16px 0;
  background:rgba(46,160,67,.05);
  border-top:1px solid rgba(46,160,67,.15);
  border-bottom:1px solid rgba(46,160,67,.15);
  overflow:hidden
}
.ticker-wrap{
  display:flex;white-space:nowrap;
  animation:ticker-scroll 40s linear infinite
}
@keyframes ticker-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker-item{
  display:inline-block;padding:0 40px;
  font-family:'Roboto Mono',monospace;font-size:.82rem
}
.ticker-item .time{color:#2EA043;margin-right:8px}
.ticker-item .tag{color:#F85149;font-weight:700;margin-right:8px}
.ticker-item .status{opacity:.5;margin-left:8px}

/* === Arsenal / Tools (Module 5) === */
.arsenal-section{padding:80px 0}
.tools-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:20px;margin-top:2rem
}
.tool-card{
  background:rgba(13,17,23,.6);
  border:1px solid rgba(46,160,67,.15);
  padding:32px 20px;text-align:center;
  transition:all .3s;cursor:pointer
}
.tool-card:hover{border-color:#2EA043;background:rgba(46,160,67,.05)}
.tool-card .icon{
  font-size:2rem;margin-bottom:12px;
  color:#2EA043;font-family:'Roboto Mono',monospace
}
.tool-card .name{font-size:.9rem;letter-spacing:1px}

/* === Classified Dossiers (Module 6) === */
.dossiers-section{padding:80px 0}
.dossier-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:24px;margin-top:2rem}
.dossier-card{
  background:rgba(13,17,23,.7);
  border:1px solid rgba(46,160,67,.15);
  overflow:hidden;transition:all .3s
}
.dossier-card:hover{border-color:#2EA043;transform:translateY(-4px)}
.dossier-card img{width:100%;height:200px;object-fit:cover;filter:brightness(.7)}
.dossier-card .info{padding:20px}
.dossier-card .classification{
  font-family:'Roboto Mono',monospace;font-size:.7rem;
  color:#2EA043;letter-spacing:2px;margin-bottom:8px
}
.dossier-card h3{font-size:1rem;margin-bottom:8px}
.dossier-card .meta{font-size:.78rem;opacity:.5}

/* === Field Commanders (Module 7) === */
.commanders-section{padding:80px 0}
.commanders-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:2rem}
.commander-card{
  background:rgba(13,17,23,.7);
  border:1px solid rgba(46,160,67,.15);
  padding:24px;text-align:center;
  transition:all .3s
}
.commander-card:hover{border-color:#2EA043}
.commander-card img{
  width:120px;height:120px;border-radius:50%;
  object-fit:cover;margin:0 auto 16px;
  border:2px solid rgba(46,160,67,.3);
  filter:grayscale(30%)
}
.commander-card .codename{
  font-family:'Roboto Mono',monospace;
  color:#2EA043;font-size:.8rem;letter-spacing:2px;margin-bottom:4px
}
.commander-card h3{font-size:1.1rem;margin-bottom:8px}
.commander-card p{font-size:.85rem;opacity:.7;line-height:1.6}

/* === Tech Alliance (Module 8) === */
.tech-section{padding:80px 0}
.tech-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:20px;margin-top:2rem
}
.tech-item{
  background:rgba(13,17,23,.5);
  border:1px solid rgba(46,160,67,.1);
  padding:24px;text-align:center;
  font-family:'Roboto Mono',monospace;
  font-size:.85rem;letter-spacing:1px;
  transition:all .3s
}
.tech-item:hover{border-color:#2EA043}

/* === Commendation (Module 9) === */
.award-section{padding:80px 0;text-align:center}
.award-badge{
  max-width:240px;margin:2rem auto;
  filter:drop-shadow(0 0 20px rgba(46,160,67,.3))
}
.award-text{font-size:.9rem;opacity:.7;max-width:500px;margin:0 auto}

/* === Mobile Command (Module 10) === */
.mobile-section{padding:80px 0}
.mobile-inner{
  display:grid;grid-template-columns:1fr 1fr;
  gap:40px;align-items:center
}
.mobile-inner img{max-width:300px;margin:0 auto;filter:drop-shadow(0 0 30px rgba(46,160,67,.2))}
.mobile-info h2{font-size:1.6rem;margin-bottom:1rem}
.mobile-info p{margin-bottom:1.5rem;opacity:.8}
.download-btns{display:flex;gap:12px;flex-wrap:wrap}
.download-btn{
  padding:12px 24px;border:1px solid rgba(46,160,67,.3);
  font-family:'Roboto Mono',monospace;font-size:.85rem;
  color:#C9D1D9;transition:all .3s
}
.download-btn:hover{border-color:#2EA043;color:#2EA043}

/* === Footer === */
.footer{
  background:#080b10;
  border-top:1px solid rgba(46,160,67,.15);
  padding:60px 0 0
}
.footer-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:40px;max-width:1440px;margin:0 auto;padding:0 20px
}
.footer-col h4{
  font-size:.85rem;color:#2EA043;
  letter-spacing:2px;margin-bottom:16px;
  font-family:'Roboto Mono',monospace
}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:10px}
.footer-col a{color:#8b949e;font-size:.85rem;transition:color .2s}
.footer-col a:hover{color:#2EA043}
.footer-bottom{
  margin-top:40px;padding:20px;
  border-top:1px solid rgba(46,160,67,.1);
  text-align:center;font-size:.78rem;
  color:#8b949e;max-width:1440px;margin-left:auto;margin-right:auto
}
.footer-bottom a{color:#8b949e}
.footer-bottom a:hover{color:#2EA043}
.footer-award{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:8px;font-size:.72rem;color:#C9D1D9;opacity:.7
}
.footer-award img{width:20px;height:20px;display:inline-block}

/* === Breadcrumb === */
.breadcrumb{
  padding:80px 0 16px;
  font-size:.8rem;font-family:'Roboto Mono',monospace
}
.breadcrumb a{color:#8b949e}
.breadcrumb a:hover{color:#2EA043}
.breadcrumb .sep{margin:0 8px;color:#30363d}
.breadcrumb .current{color:#2EA043}

/* === Inner Page Content === */
.page-header{
  padding:40px 0;text-align:center;
  border-bottom:1px solid rgba(46,160,67,.15);
  margin-bottom:40px
}
.page-header h1{font-size:2rem;letter-spacing:3px;margin-bottom:.5rem}
.page-header p{opacity:.6;font-size:.9rem}
.content-area{
  max-width:1000px;margin:0 auto;padding:0 20px 80px;
  line-height:1.9
}
.content-area p{margin-bottom:1.5rem}
.content-area h2{
  font-size:1.4rem;margin:2.5rem 0 1rem;
  padding-left:12px;border-left:3px solid #2EA043
}
.content-area h3{font-size:1.15rem;margin:2rem 0 .8rem;color:#2EA043}
.content-area blockquote{
  border-left:3px solid #2EA043;
  padding:16px 20px;margin:1.5rem 0;
  background:rgba(46,160,67,.05);
  font-style:italic
}
.content-area ul,.content-area ol{margin:1rem 0 1.5rem 1.5rem}
.content-area li{margin-bottom:.5rem}
.data-table{
  width:100%;border-collapse:collapse;margin:1.5rem 0;
  font-size:.85rem
}
.data-table th,.data-table td{
  padding:12px 16px;text-align:left;
  border:1px solid rgba(46,160,67,.15)
}
.data-table th{
  background:rgba(46,160,67,.1);
  color:#2EA043;font-family:'Roboto Mono',monospace;
  letter-spacing:1px;font-size:.78rem
}
.data-table tr:hover{background:rgba(46,160,67,.03)}

/* === Tactical Room Page === */
.tactical-page{padding-top:80px}
.tactical-layout{
  display:grid;grid-template-columns:280px 1fr 300px;
  gap:20px;min-height:calc(100vh - 200px);padding:20px
}
.tactical-panel{
  background:rgba(13,17,23,.8);
  border:1px solid rgba(46,160,67,.2);
  padding:20px;overflow-y:auto
}
.tactical-panel h3{
  font-size:.85rem;color:#2EA043;
  letter-spacing:2px;margin-bottom:16px;
  font-family:'Roboto Mono',monospace
}
.tactical-main{
  background:rgba(13,17,23,.5);
  border:1px solid rgba(46,160,67,.2);
  position:relative;display:flex;
  align-items:center;justify-content:center;
  overflow:hidden
}
.tactical-main img{width:100%;height:100%;object-fit:cover;opacity:.7}
.form-group{margin-bottom:16px}
.form-group label{
  display:block;font-size:.78rem;
  color:#8b949e;margin-bottom:6px;
  font-family:'Roboto Mono',monospace;letter-spacing:1px
}
.form-group select,.form-group input{
  width:100%;padding:8px 12px;
  background:rgba(13,17,23,.8);
  border:1px solid rgba(46,160,67,.2);
  color:#C9D1D9;font-size:.85rem;
  font-family:'Roboto Mono',monospace
}
.form-group select:focus,.form-group input:focus{
  outline:none;border-color:#2EA043
}
.result-block{
  background:rgba(46,160,67,.05);
  border:1px solid rgba(46,160,67,.15);
  padding:16px;margin-bottom:16px
}
.result-block h4{
  font-size:.78rem;color:#2EA043;
  letter-spacing:2px;margin-bottom:8px;
  font-family:'Roboto Mono',monospace
}
.result-block .value{font-size:1.6rem;font-weight:700}
.result-block .desc{font-size:.82rem;opacity:.6;margin-top:4px}

/* === Prediction Cards === */
.prediction-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:24px;margin-top:2rem
}
.prediction-card{
  background:rgba(13,17,23,.7);
  border:1px solid rgba(46,160,67,.15);
  padding:24px;transition:all .3s
}
.prediction-card:hover{border-color:#2EA043;transform:translateY(-2px)}
.prediction-card .league{
  font-family:'Roboto Mono',monospace;font-size:.7rem;
  color:#F85149;letter-spacing:2px;margin-bottom:12px
}
.prediction-card .matchup{font-size:1.1rem;font-weight:700;margin-bottom:4px}
.prediction-card .datetime{font-size:.8rem;opacity:.5;margin-bottom:16px}
.prediction-card .prediction-label{
  font-size:.72rem;color:#2EA043;letter-spacing:1px;
  font-family:'Roboto Mono',monospace;margin-bottom:8px
}

/* === Responsive === */
@media(max-width:1024px){
  .tactical-layout{grid-template-columns:1fr;grid-template-rows:auto 400px auto}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .mobile-inner{grid-template-columns:1fr}
  .hero-content h1{font-size:2rem}
}
@media(max-width:768px){
  .nav-links{
    display:none;position:fixed;
    top:64px;left:0;right:0;bottom:0;
    background:rgba(13,17,23,.98);
    flex-direction:column;align-items:center;
    justify-content:center;gap:16px
  }
  .nav-links.active{display:flex}
  .nav-toggle{display:flex}
  .hero-content h1{font-size:1.6rem;letter-spacing:2px}
  .hero-content p{font-size:.9rem}
  .section-title{font-size:1.4rem}
  .intel-grid{grid-template-columns:1fr}
  .dossier-list{grid-template-columns:1fr}
  .commanders-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .tools-grid{grid-template-columns:repeat(2,1fr)}
  .container{padding:0 16px}
  .prediction-grid{grid-template-columns:1fr}
}
@media(max-width:360px){
  html{font-size:14px}
  .nav-logo{font-size:1rem}
  .hero-content h1{font-size:1.3rem}
  .tools-grid{grid-template-columns:1fr}
  .tech-grid{grid-template-columns:repeat(2,1fr)}
}

/* === Scanline Effect === */
.scanline{
  position:fixed;top:0;left:0;right:0;bottom:0;
  pointer-events:none;z-index:9999;
  background:repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0,0,0,.03) 2px,
    rgba(0,0,0,.03) 4px
  );
  opacity:.3
}

/* === Animations === */
@keyframes fadeInUp{
  from{opacity:0;transform:translateY(30px)}
  to{opacity:1;transform:translateY(0)}
}
.animate-in{animation:fadeInUp .6s ease forwards;opacity:0}
.delay-1{animation-delay:.1s}
.delay-2{animation-delay:.2s}
.delay-3{animation-delay:.3s}
.delay-4{animation-delay:.4s}

/* === Scrollbar === */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:#0D1117}
::-webkit-scrollbar-thumb{background:rgba(46,160,67,.3);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#2EA043}