/* ============================================================
   黑料51 | MILITARY ARCHIVE DOSSIER SYSTEM
   Classification: INTERNAL // 内部资料
   Stylesheet v5.1.0
   ============================================================ */

/* ---------- ROOT TOKENS ---------- */
:root{
  --olive:#3d4f1c;
  --olive-dk:#2a3a10;
  --olive-black:#1a1a0a;
  --bg:#2a2a1a;
  --bg-2:#232313;
  --khaki:#d4a373;
  --khaki-dk:#b88654;
  --orange:#ff8c00;
  --silver:#c0c0c0;
  --silver-dk:#8a8a7a;
  --classified:#8b0000;
  --paper:#e8e2c8;
  --paper-2:#d8d0b0;
  --ink:#1a1a0a;
  --line:rgba(212,163,115,.25);
  --line-strong:rgba(212,163,115,.45);
  --green-glow:rgba(255,140,0,.15);
  --mono:"Courier New","STFangsong",ui-monospace,monospace;
}

/* ---------- RESET ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--mono);
  background-color:var(--bg);
  color:var(--paper);
  line-height:1.65;
  font-size:15px;
  min-height:100vh;
  background-image:
    /* topographic contour lines */
    radial-gradient(ellipse 1200px 600px at 20% 10%, rgba(212,163,115,.05), transparent 60%),
    radial-gradient(ellipse 900px 500px at 80% 80%, rgba(61,79,28,.18), transparent 60%),
    repeating-radial-gradient(circle at 15% 25%,
      transparent 0 38px,
      rgba(212,163,115,.04) 38px 39px,
      transparent 39px 78px,
      rgba(212,163,115,.025) 78px 80px),
    repeating-radial-gradient(circle at 75% 60%,
      transparent 0 52px,
      rgba(212,163,115,.035) 52px 53px,
      transparent 53px 104px,
      rgba(212,163,115,.02) 104px 106px),
    repeating-radial-gradient(circle at 50% 90%,
      transparent 0 30px,
      rgba(192,192,192,.025) 30px 31px,
      transparent 31px 64px),
    linear-gradient(180deg, #2a2a1a 0%, #1f1f10 100%);
  background-attachment:fixed;
}
/* faint grid overlay like survey map */
body::before{
  content:"";
  position:fixed;inset:0;
  background-image:
    linear-gradient(rgba(212,163,115,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,163,115,.04) 1px, transparent 1px);
  background-size:60px 60px;
  pointer-events:none;
  z-index:0;
}
/* scanline / film grain */
body::after{
  content:"";
  position:fixed;inset:0;
  background:repeating-linear-gradient(0deg,
    rgba(0,0,0,.06) 0 1px,
    transparent 1px 3px);
  pointer-events:none;
  z-index:1;
  opacity:.5;
  mix-blend-mode:multiply;
}

a{color:var(--khaki);text-decoration:none}
a:hover{color:var(--orange);text-decoration:underline;text-underline-offset:3px}
img{max-width:100%}

/* ---------- LAYOUT WRAP ---------- */
.wrap{
  position:relative;
  z-index:2;
  max-width:1240px;
  margin:0 auto;
  padding:0 22px 60px;
}

/* ---------- TOP CLASSIFIED BAR ---------- */
.classified-bar{
  position:relative;z-index:5;
  background:repeating-linear-gradient(45deg,
    #8b0000 0 14px, #6a0000 14px 28px);
  color:#fff;
  font-size:12px;
  letter-spacing:3px;
  text-align:center;
  padding:5px 0;
  border-bottom:2px solid #1a1a0a;
  font-weight:bold;
  text-shadow:0 1px 0 rgba(0,0,0,.5);
}
.classified-bar span{margin:0 14px}

/* ---------- HEADER ---------- */
.site-header{
  position:relative;z-index:4;
  background:linear-gradient(180deg,#1f1f0e 0%,#2a2a1a 100%);
  border-bottom:3px double var(--khaki);
  padding:18px 0 14px;
  overflow:hidden;
}
.header-inner{
  max-width:1240px;margin:0 auto;padding:0 22px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:14px}
.brand-mark{
  width:54px;height:54px;
  border:2px solid var(--khaki);
  border-radius:50%;
  display:grid;place-items:center;
  color:var(--khaki);
  font-weight:bold;font-size:13px;
  position:relative;
  background:radial-gradient(circle at 30% 30%, #3d4f1c, #1a1a0a);
  box-shadow:inset 0 0 10px rgba(0,0,0,.6), 0 0 0 4px rgba(212,163,115,.08);
  letter-spacing:0;
}
.brand-mark::before{
  content:"";position:absolute;inset:5px;border-radius:50%;
  border:1px dashed rgba(212,163,115,.5);
}
.brand-text .name{
  font-size:24px;font-weight:bold;color:var(--paper);
  letter-spacing:4px;
}
.brand-text .sub{
  font-size:11px;color:var(--khaki);letter-spacing:2px;
  text-transform:uppercase;
}
.header-meta{
  text-align:right;font-size:11px;color:var(--silver-dk);
  letter-spacing:1px;line-height:1.9;
}
.header-meta .v{color:var(--khaki)}

/* stamp in header corner */
.corner-stamp{
  position:absolute;
  top:8px;right:-30px;
  transform:rotate(14deg);
  pointer-events:none;
}

/* ---------- NAV ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  background:linear-gradient(180deg,#3d4f1c,#2a3a10);
  border-top:1px solid var(--khaki-dk);
  border-bottom:2px solid #1a1a0a;
  box-shadow:0 4px 18px rgba(0,0,0,.5);
}
.nav-inner{
  max-width:1240px;margin:0 auto;padding:0 22px;
  display:flex;flex-wrap:wrap;gap:2px;
}
.nav a{
  color:var(--paper);
  padding:13px 18px;
  font-size:13px;
  letter-spacing:2px;
  border-right:1px solid rgba(212,163,115,.18);
  position:relative;
  transition:background .15s,color .15s;
  text-transform:none;
}
.nav a:hover{
  background:rgba(255,140,0,.12);
  color:var(--orange);
  text-decoration:none;
}
.nav a.active{
  background:var(--olive-black);
  color:var(--orange);
  box-shadow:inset 0 -3px 0 var(--orange);
}
.nav a .nav-id{
  display:block;font-size:9px;color:var(--khaki);
  letter-spacing:1px;margin-top:2px;
}

/* ---------- PAGE TITLE BLOCK ---------- */
.page-head{
  margin:30px 0 26px;
  position:relative;
  border:1px solid var(--line-strong);
  background:
    linear-gradient(135deg, rgba(61,79,28,.35), rgba(26,26,10,.6));
  padding:22px 26px;
}
.page-head::before{
  content:"";position:absolute;top:0;left:0;width:8px;height:100%;
  background:var(--orange);
}
.page-head h1{
  font-size:26px;color:var(--paper);letter-spacing:3px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.page-head .code{
  font-size:11px;color:var(--khaki);letter-spacing:2px;
  margin-top:8px;text-transform:uppercase;
}
.page-head .crumb{font-size:11px;color:var(--silver-dk);margin-top:6px}
.breadcrumb{color:var(--silver-dk)}
.breadcrumb a{color:var(--khaki)}

/* ---------- SECTION TITLE ---------- */
.sec-title{
  display:flex;align-items:center;gap:12px;
  margin:34px 0 18px;
  color:var(--khaki);
  font-size:16px;letter-spacing:3px;
  text-transform:uppercase;
}
.sec-title::before{
  content:"";width:14px;height:14px;
  background:var(--orange);
  clip-path:polygon(0 0, 100% 0, 100% 70%, 70% 100%, 0 100%);
  flex:0 0 auto;
}
.sec-title .line{
  flex:1;height:1px;
  background:linear-gradient(90deg,var(--line-strong),transparent);
}
.sec-title .tag{
  font-size:10px;color:var(--silver-dk);
  border:1px solid var(--silver-dk);
  padding:2px 8px;letter-spacing:1px;
}

/* ---------- GRID HELPERS ---------- */
.grid{display:grid;gap:20px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-auto{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}

/* ---------- FILE FOLDER CARD ---------- */
.folder{
  position:relative;
  background:linear-gradient(160deg,#d4a373 0%,#b88654 100%);
  color:var(--ink);
  border:1px solid #6a4a24;
  border-radius:3px 3px 4px 4px;
  padding:18px 18px 16px;
  box-shadow:
    0 6px 16px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -2px 8px rgba(0,0,0,.15);
  transition:transform .18s, box-shadow .18s;
  overflow:hidden;
}
.folder::before{
  /* folder tab */
  content:"";
  position:absolute;top:-1px;left:18px;
  width:84px;height:14px;
  background:#b88654;
  border:1px solid #6a4a24;
  border-bottom:none;
  border-radius:4px 4px 0 0;
  transform:translateY(-13px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
}
.folder:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.3);
}
.folder .folder-no{
  font-size:10px;letter-spacing:2px;color:#5a3a14;
  border-bottom:1px dashed #6a4a24;padding-bottom:6px;margin-bottom:10px;
  display:flex;justify-content:space-between;
}
.folder h3{
  font-size:16px;color:var(--ink);letter-spacing:1px;
  margin-bottom:8px;font-weight:bold;
}
.folder p{
  font-size:13px;color:#3a2a10;line-height:1.6;
  margin-bottom:12px;
}
.folder .folder-foot{
  display:flex;justify-content:space-between;align-items:center;
  font-size:11px;color:#4a3010;letter-spacing:1px;
  border-top:1px dashed #6a4a24;padding-top:8px;
}

/* paper variant */
.folder.paper{
  background:linear-gradient(160deg,#e8e2c8 0%,#d8d0b0 100%);
  border-color:#9a8a5a;
}
.folder.paper::before{background:#c8be8a;border-color:#9a8a5a}

/* dark dossier variant */
.folder.dark{
  background:linear-gradient(160deg,#3d4f1c 0%,#2a3a10 100%);
  color:var(--paper);
  border-color:#1a1a0a;
}
.folder.dark::before{background:#2a3a10;border-color:#1a1a0a}
.folder.dark .folder-no{color:var(--khaki);border-color:var(--line)}
.folder.dark h3{color:var(--paper)}
.folder.dark p{color:var(--silver)}
.folder.dark .folder-foot{color:var(--khaki);border-color:var(--line)}

/* ---------- CLASSIFICATION BADGES ---------- */
.badge{
  display:inline-block;
  font-size:10px;font-weight:bold;letter-spacing:2px;
  padding:2px 8px;
  border:1px solid;
  text-transform:uppercase;
  background:rgba(0,0,0,.25);
}
.badge-public{color:#7ec850;border-color:#7ec850;background:rgba(126,200,80,.1)}
.badge-internal{color:#d4a373;border-color:#d4a373;background:rgba(212,163,115,.12)}
.badge-secret{color:#ff8c00;border-color:#ff8c00;background:rgba(255,140,0,.12)}
.badge-top{color:#ff3b3b;border-color:#ff3b3b;background:rgba(255,59,59,.15);animation:pulse-badge 2.4s infinite}
@keyframes pulse-badge{
  0%,100%{box-shadow:0 0 0 0 rgba(255,59,59,.4)}
  50%{box-shadow:0 0 0 4px rgba(255,59,59,0)}
}

/* ---------- RUBBER STAMP ---------- */
.stamp{
  display:inline-block;
  border:3px double currentColor;
  color:var(--classified);
  padding:6px 16px;
  font-weight:bold;letter-spacing:3px;
  font-size:14px;
  transform:rotate(-9deg);
  opacity:.85;
  text-transform:uppercase;
  position:relative;
  background:rgba(139,0,0,.04);
}
.stamp::after{
  content:"";position:absolute;inset:-2px;
  background:repeating-linear-gradient(0deg,
    transparent 0 2px,
    rgba(139,0,0,.08) 2px 3px);
  pointer-events:none;
}
.stamp.orange{color:var(--orange)}
.stamp.khaki{color:var(--khaki)}
.stamp.rot-r{transform:rotate(7deg)}
.stamp.sm{font-size:11px;padding:3px 10px;border-width:2px}

/* floating stamp on cards */
.float-stamp{
  position:absolute;top:10px;right:-6px;
  z-index:3;opacity:.7;
  pointer-events:none;
}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);
  font-size:13px;letter-spacing:2px;
  padding:10px 20px;
  border:1px solid var(--khaki);
  background:linear-gradient(180deg,rgba(61,79,28,.6),rgba(26,26,10,.7));
  color:var(--paper);
  cursor:pointer;
  position:relative;
  transition:all .15s;
  text-transform:uppercase;
}
.btn::before{
  content:"▶";font-size:10px;color:var(--orange);
}
.btn:hover{
  background:var(--orange);color:var(--ink);
  border-color:var(--orange);text-decoration:none;
}
.btn:hover::before{color:var(--ink)}
.btn.ghost{background:transparent}
.btn.ghost::before{content:"//"}

/* ---------- FEATURED DOSSIER ---------- */
.feature{
  position:relative;
  display:grid;grid-template-columns:1.1fr 1fr;gap:0;
  border:1px solid var(--line-strong);
  background:linear-gradient(135deg,rgba(61,79,28,.4),rgba(26,26,10,.7));
  margin-bottom:30px;
  overflow:hidden;
}
.feature-left{padding:30px 32px;position:relative}
.feature-left::before{
  content:"";position:absolute;left:0;top:0;width:6px;height:100%;
  background:var(--classified);
}
.feature h2{
  font-size:24px;color:var(--paper);letter-spacing:2px;margin-bottom:10px;
}
.feature .lead{color:var(--khaki);font-size:13px;margin-bottom:16px;line-height:1.8}
.feature .field{
  display:flex;gap:14px;font-size:12px;color:var(--silver);
  margin:8px 0;border-bottom:1px dotted var(--line);padding-bottom:8px;
}
.feature .field .k{color:var(--khaki);min-width:90px;letter-spacing:1px}
.feature .field .v{color:var(--paper)}
.feature-right{
  background:
    repeating-linear-gradient(45deg,
      rgba(212,163,115,.06) 0 10px,
      transparent 10px 20px),
    linear-gradient(160deg,#2a3a10,#1a1a0a);
  padding:30px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  position:relative;
  border-left:1px solid var(--line);
}
.feature-right .seal{
  width:160px;height:160px;border-radius:50%;
  border:3px double var(--khaki);
  display:grid;place-items:center;text-align:center;
  color:var(--khaki);font-size:11px;letter-spacing:2px;
  position:relative;
  background:radial-gradient(circle at 35% 35%, rgba(61,79,28,.5), rgba(26,26,10,.9));
  box-shadow:inset 0 0 20px rgba(0,0,0,.7), 0 0 0 6px rgba(212,163,115,.06);
  line-height:1.5;
}
.feature-right .seal::before{
  content:"";position:absolute;inset:10px;border-radius:50%;
  border:1px dashed rgba(212,163,115,.4);
}
.feature-right .seal .big{
  font-size:30px;color:var(--orange);font-weight:bold;letter-spacing:0;
  display:block;margin:6px 0;
}
.feature-right .seal-note{
  margin-top:18px;font-size:11px;color:var(--silver-dk);letter-spacing:1px;
  text-align:center;max-width:220px;
}

/* ---------- STATS ---------- */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
}
.stat{
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(61,79,28,.3),rgba(26,26,10,.5));
  padding:18px;
  position:relative;
  text-align:center;
}
.stat::before{
  content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:3px;
  background:var(--orange);
}
.stat .num{
  font-size:30px;font-weight:bold;color:var(--khaki);letter-spacing:1px;
  text-shadow:0 0 12px rgba(212,163,115,.3);
}
.stat .lbl{font-size:11px;color:var(--silver);letter-spacing:2px;margin-top:6px}
.stat .delta{font-size:10px;color:var(--orange);margin-top:4px}

/* ---------- LIST ROWS (dossier table) ---------- */
.dossier-list{
  border:1px solid var(--line);
  background:rgba(26,26,10,.5);
}
.dossier-row{
  display:grid;
  grid-template-columns:90px 1fr 130px 110px 90px;
  gap:14px;align-items:center;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
  font-size:13px;
  transition:background .15s;
}
.dossier-row:last-child{border-bottom:none}
.dossier-row:hover{background:rgba(255,140,0,.06)}
.dossier-row .no{color:var(--khaki);font-size:11px;letter-spacing:1px}
.dossier-row .ttl{color:var(--paper)}
.dossier-row .ttl small{display:block;color:var(--silver-dk);font-size:11px;margin-top:2px}
.dossier-row .date{color:var(--silver);font-size:11px}
.dossier-row .cat{color:var(--khaki);font-size:11px;letter-spacing:1px}
.dossier-row .act{
  font-size:11px;color:var(--orange);text-align:right;letter-spacing:1px;
}
.dossier-row.head{
  background:rgba(61,79,28,.4);
  color:var(--khaki);font-size:10px;letter-spacing:2px;
  text-transform:uppercase;
}
.dossier-row.head>*{color:var(--khaki)!important}

/* ---------- ENTRY / BRIEFING ITEM ---------- */
.entry{
  position:relative;
  border-left:3px solid var(--khaki-dk);
  padding:14px 18px 14px 22px;
  margin-bottom:14px;
  background:linear-gradient(90deg,rgba(26,26,10,.6),rgba(26,26,10,.2));
}
.entry.high{border-left-color:var(--classified)}
.entry.med{border-left-color:var(--orange)}
.entry.low{border-left-color:var(--silver-dk)}
.entry .time{
  font-size:11px;color:var(--orange);letter-spacing:2px;
  display:flex;align-items:center;gap:10px;margin-bottom:6px;
}
.entry .time .pri{
  border:1px solid;padding:1px 6px;font-size:9px;
}
.entry .time .pri.high{color:var(--classified);border-color:var(--classified)}
.entry .time .pri.med{color:var(--orange);border-color:var(--orange)}
.entry .time .pri.low{color:var(--silver);border-color:var(--silver-dk)}
.entry h4{font-size:15px;color:var(--paper);margin-bottom:6px;letter-spacing:1px}
.entry p{font-size:13px;color:var(--silver);line-height:1.7}
.entry .ref{font-size:10px;color:var(--khaki);margin-top:8px;letter-spacing:1px}

/* ---------- TIMELINE ---------- */
.timeline{position:relative;padding-left:30px}
.timeline::before{
  content:"";position:absolute;left:8px;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--orange),var(--khaki-dk),transparent);
}
.tl-item{position:relative;padding-bottom:24px}
.tl-item::before{
  content:"";position:absolute;left:-30px;top:4px;
  width:18px;height:18px;border-radius:50%;
  background:var(--bg);
  border:2px solid var(--orange);
  box-shadow:0 0 0 3px rgba(255,140,0,.15);
}
.tl-item .tl-date{font-size:11px;color:var(--orange);letter-spacing:2px}
.tl-item h4{font-size:15px;color:var(--paper);margin:4px 0 6px}
.tl-item p{font-size:13px;color:var(--silver)}

/* ---------- EVIDENCE CHAIN ---------- */
.chain{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.chain .node{
  flex:1;min-width:140px;
  border:1px solid var(--line-strong);
  background:rgba(61,79,28,.25);
  padding:12px;position:relative;
}
.chain .node .n{
  position:absolute;top:-10px;left:10px;
  background:var(--olive-black);color:var(--orange);
  font-size:10px;padding:1px 8px;border:1px solid var(--orange);letter-spacing:1px;
}
.chain .node h5{font-size:13px;color:var(--paper);margin:4px 0}
.chain .node p{font-size:11px;color:var(--silver)}
.chain .arrow{
  display:grid;place-items:center;color:var(--orange);font-size:18px;
  flex:0 0 auto;
}

/* ---------- SEARCH BAR ---------- */
.search-bar{
  display:flex;gap:0;
  border:1px solid var(--khaki);
  background:rgba(26,26,10,.6);
  margin-bottom:18px;
}
.search-bar input{
  flex:1;background:transparent;border:none;outline:none;
  color:var(--paper);font-family:var(--mono);font-size:14px;
  padding:12px 16px;letter-spacing:1px;
}
.search-bar input::placeholder{color:var(--silver-dk)}
.search-bar button{
  border:none;background:var(--orange);color:var(--ink);
  font-family:var(--mono);font-weight:bold;letter-spacing:2px;
  padding:0 22px;cursor:pointer;font-size:13px;
}
.search-bar button:hover{background:#ffa030}

/* ---------- FILTER CHIPS ---------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.chip{
  font-size:11px;letter-spacing:1px;
  padding:6px 12px;border:1px solid var(--silver-dk);
  color:var(--silver);cursor:pointer;
  background:rgba(26,26,10,.4);
  transition:all .15s;
}
.chip:hover{border-color:var(--orange);color:var(--orange)}
.chip.on{
  background:var(--orange);color:var(--ink);
  border-color:var(--orange);font-weight:bold;
}

/* ---------- RANK LIST ---------- */
.rank-item{
  display:grid;grid-template-columns:48px 1fr auto;gap:16px;align-items:center;
  padding:14px 18px;border-bottom:1px solid var(--line);
  background:rgba(26,26,10,.4);
  transition:background .15s;
}
.rank-item:hover{background:rgba(255,140,0,.06)}
.rank-no{
  width:42px;height:42px;display:grid;place-items:center;
  font-size:18px;font-weight:bold;color:var(--khaki);
  border:2px solid var(--khaki-dk);
  background:rgba(26,26,10,.6);
}
.rank-item:nth-child(1) .rank-no{color:var(--classified);border-color:var(--classified);background:rgba(139,0,0,.15)}
.rank-item:nth-child(2) .rank-no{color:var(--orange);border-color:var(--orange)}
.rank-item:nth-child(3) .rank-no{color:#cd7f32;border-color:#cd7f32}
.rank-info h4{font-size:14px;color:var(--paper);letter-spacing:1px}
.rank-info .meta{font-size:11px;color:var(--silver-dk);margin-top:3px}
.rank-meta{text-align:right;font-size:11px;color:var(--khaki);letter-spacing:1px}
.rank-meta .count{font-size:18px;color:var(--orange);font-weight:bold;display:block}
.rank-meta .trend{font-size:10px;margin-top:2px}
.trend.up{color:#7ec850}
.trend.down{color:#ff5b5b}
.trend.flat{color:var(--silver-dk)}

/* ---------- FORM ---------- */
.form-card{
  border:1px solid var(--line-strong);
  background:linear-gradient(160deg,rgba(61,79,28,.3),rgba(26,26,10,.6));
  padding:28px 30px;position:relative;
}
.form-card::before{
  content:"CONFIDENTIAL";
  position:absolute;top:14px;right:18px;
  font-size:10px;letter-spacing:3px;color:var(--classified);
  border:2px solid var(--classified);padding:3px 10px;
  transform:rotate(8deg);opacity:.6;
}
.field-group{margin-bottom:18px}
.field-group label{
  display:block;font-size:11px;color:var(--khaki);
  letter-spacing:2px;margin-bottom:6px;text-transform:uppercase;
}
.field-group label .req{color:var(--classified)}
.field-group input,
.field-group select,
.field-group textarea{
  width:100%;background:rgba(26,26,10,.6);
  border:1px solid var(--silver-dk);color:var(--paper);
  font-family:var(--mono);font-size:13px;
  padding:11px 14px;outline:none;letter-spacing:1px;
  transition:border .15s;
}
.field-group input:focus,
.field-group select:focus,
.field-group textarea:focus{border-color:var(--orange)}
.field-group textarea{resize:vertical;min-height:120px}
.field-group .hint{font-size:10px;color:var(--silver-dk);margin-top:4px;letter-spacing:1px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* ---------- REWARD TIERS ---------- */
.tier{
  border:1px solid var(--line-strong);
  background:rgba(26,26,10,.5);
  padding:20px;position:relative;text-align:center;
}
.tier.t1{border-color:#7ec850}
.tier.t2{border-color:var(--orange)}
.tier.t3{border-color:var(--classified)}
.tier .lvl{
  position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  background:var(--bg);padding:2px 14px;font-size:11px;letter-spacing:2px;
}
.tier.t1 .lvl{color:#7ec850;border:1px solid #7ec850}
.tier.t2 .lvl{color:var(--orange);border:1px solid var(--orange)}
.tier.t3 .lvl{color:var(--classified);border:1px solid var(--classified)}
.tier .reward{font-size:26px;color:var(--khaki);font-weight:bold;margin:14px 0 6px}
.tier .desc{font-size:12px;color:var(--silver);line-height:1.7}

/* ---------- CALENDAR ---------- */
.cal{
  display:grid;grid-template-columns:repeat(7,1fr);gap:4px;
}
.cal .dow{
  text-align:center;font-size:10px;color:var(--khaki);
  letter-spacing:1px;padding:6px 0;border-bottom:1px solid var(--line);
}
.cal .day{
  aspect-ratio:1;display:grid;place-items:center;
  font-size:12px;color:var(--silver);
  border:1px solid transparent;
  background:rgba(26,26,10,.3);
  position:relative;cursor:pointer;transition:all .15s;
}
.cal .day:hover{border-color:var(--orange);color:var(--orange)}
.cal .day.has::after{
  content:"";position:absolute;bottom:3px;left:50%;transform:translateX(-50%);
  width:5px;height:5px;background:var(--orange);border-radius:50%;
}
.cal .day.today{color:var(--orange);border-color:var(--orange);font-weight:bold}
.cal .day.muted{color:#555;opacity:.5}
.cal .day.active{background:var(--orange);color:var(--ink);font-weight:bold}

/* ---------- PAGER ---------- */
.pager{display:flex;gap:6px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.pager a{
  min-width:36px;height:36px;display:grid;place-items:center;
  border:1px solid var(--silver-dk);color:var(--silver);
  font-size:12px;padding:0 10px;letter-spacing:1px;
}
.pager a:hover{border-color:var(--orange);color:var(--orange);text-decoration:none}
.pager a.on{background:var(--orange);color:var(--ink);border-color:var(--orange);font-weight:bold}

/* ---------- FOOTER ---------- */
.site-footer{
  position:relative;z-index:3;
  margin-top:60px;
  background:linear-gradient(180deg,#1a1a0a,#0f0f05);
  border-top:3px double var(--khaki);
  padding:34px 0 20px;
  color:var(--silver-dk);font-size:12px;
}
.footer-inner{
  max-width:1240px;margin:0 auto;padding:0 22px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;
}
.footer-inner h5{
  color:var(--khaki);letter-spacing:2px;font-size:12px;
  margin-bottom:12px;text-transform:uppercase;
  border-bottom:1px solid var(--line);padding-bottom:6px;
}
.footer-inner ul{list-style:none}
.footer-inner li{margin-bottom:6px;font-size:11px;letter-spacing:1px}
.footer-inner a{color:var(--silver)}
.footer-inner a:hover{color:var(--orange)}
.footer-disclaimer{
  max-width:1240px;margin:24px auto 0;padding:16px 22px;
  border-top:1px dashed var(--line);
  font-size:10px;color:var(--silver-dk);letter-spacing:1px;line-height:1.7;
  text-align:center;
}
.footer-bottom{
  max-width:1240px;margin:0 auto;padding:10px 22px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-size:10px;color:#5a5a4a;letter-spacing:1px;
}

/* ---------- ALERT / NOTICE ---------- */
.notice{
  display:flex;gap:12px;align-items:flex-start;
  border:1px solid var(--orange);
  background:rgba(255,140,0,.08);
  padding:14px 18px;margin-bottom:20px;
  font-size:12px;color:var(--paper);
  border-left:4px solid var(--orange);
}
.notice .ic{
  flex:0 0 auto;width:22px;height:22px;border:1px solid var(--orange);
  color:var(--orange);display:grid;place-items:center;font-size:12px;font-weight:bold;
}
.notice.danger{border-color:var(--classified);background:rgba(139,0,0,.1);border-left-color:var(--classified)}
.notice.danger .ic{border-color:var(--classified);color:var(--classified)}

/* ---------- TAGS ---------- */
.tag-line{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tag{
  font-size:10px;color:var(--khaki);
  border:1px solid var(--line-strong);padding:2px 7px;letter-spacing:1px;
}
.tag:hover{color:var(--orange);border-color:var(--orange);text-decoration:none}

/* ---------- CHART BAR (css) ---------- */
.bar-chart{display:flex;flex-direction:column;gap:10px}
.bar-row{display:grid;grid-template-columns:110px 1fr 60px;gap:12px;align-items:center;font-size:12px}
.bar-row .lbl{color:var(--silver);letter-spacing:1px}
.bar-row .track{height:14px;background:rgba(26,26,10,.6);border:1px solid var(--line);position:relative}
.bar-row .fill{height:100%;background:linear-gradient(90deg,var(--olive),var(--orange));position:relative}
.bar-row .fill::after{
  content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(90deg,
    rgba(0,0,0,.15) 0 4px, transparent 4px 8px);
}
.bar-row .val{color:var(--orange);text-align:right;font-weight:bold}

/* ---------- METAL PANEL ---------- */
.metal{
  background:
    linear-gradient(180deg,rgba(192,192,192,.12),rgba(192,192,192,.02)),
    linear-gradient(180deg,#2a2a1a,#1a1a0a);
  border:1px solid var(--silver-dk);
  border-top-color:rgba(255,255,255,.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 4px 14px rgba(0,0,0,.4);
}

/* ---------- MISC ---------- */
.center{text-align:center}
.muted{color:var(--silver-dk)}
.khaki{color:var(--khaki)}
.orange{color:var(--orange)}
.mt0{margin-top:0}.mt20{margin-top:20px}.mt30{margin-top:30px}
.mb0{margin-bottom:0}
.flex{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
.divider{
  height:1px;background:linear-gradient(90deg,transparent,var(--line-strong),transparent);
  margin:26px 0;
}
.kv{display:grid;grid-template-columns:120px 1fr;gap:8px;font-size:12px;margin-bottom:6px}
.kv .k{color:var(--khaki);letter-spacing:1px}
.kv .v{color:var(--paper)}

/* ---------- HERO STRIP ---------- */
.hero{
  position:relative;
  border:1px solid var(--line-strong);
  background:
    repeating-linear-gradient(135deg,
      rgba(212,163,115,.04) 0 14px,
      transparent 14px 28px),
    linear-gradient(135deg,rgba(61,79,28,.5),rgba(26,26,10,.85));
  padding:40px 36px;margin-bottom:30px;overflow:hidden;
}
.hero::before{
  content:"TOP SECRET";
  position:absolute;top:24px;right:30px;
  color:var(--classified);border:3px double var(--classified);
  padding:6px 18px;font-size:13px;letter-spacing:4px;font-weight:bold;
  transform:rotate(8deg);opacity:.55;
}
.hero h1{
  font-size:34px;color:var(--paper);letter-spacing:4px;margin-bottom:12px;
  text-shadow:0 2px 8px rgba(0,0,0,.6);
}
.hero p{color:var(--khaki);font-size:14px;max-width:640px;line-height:1.9}
.hero .hero-meta{margin-top:20px;display:flex;gap:24px;flex-wrap:wrap;font-size:11px;color:var(--silver-dk);letter-spacing:2px}
.hero .hero-meta b{color:var(--orange)}

/* ---------- DECORATIVE CORNERS ---------- */
.corners{position:relative}
.corners::before,.corners::after{
  content:"";position:absolute;width:18px;height:18px;border:2px solid var(--khaki);
}
.corners::before{top:-1px;left:-1px;border-right:none;border-bottom:none}
.corners::after{bottom:-1px;right:-1px;border-left:none;border-top:none}

/* ---------- RESPONSIVE ---------- */
@media (max-width:980px){
  .feature{grid-template-columns:1fr}
  .feature-right{border-left:none;border-top:1px solid var(--line)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .footer-inner{grid-template-columns:1fr 1fr}
  .dossier-row{grid-template-columns:70px 1fr 90px;gap:10px}
  .dossier-row .cat,.dossier-row .act{display:none}
}
@media (max-width:680px){
  .grid-2,.grid-3,.grid-4,.grid-auto{grid-template-columns:1fr}
  .nav-inner{padding:0 12px}
  .nav a{padding:11px 12px;font-size:12px;letter-spacing:1px}
  .nav a .nav-id{display:none}
  .header-inner{flex-direction:column;align-items:flex-start;gap:10px}
  .header-meta{text-align:left}
  .hero{padding:28px 20px}
  .hero h1{font-size:24px;letter-spacing:2px}
  .page-head h1{font-size:20px}
  .form-row{grid-template-columns:1fr}
  .dossier-row{grid-template-columns:1fr;gap:4px;padding:12px}
  .rank-item{grid-template-columns:36px 1fr;gap:10px}
  .rank-meta{grid-column:1/-1;text-align:left}
  .footer-inner{grid-template-columns:1fr}
  .stat .num{font-size:24px}
  .form-card{padding:20px 18px}
}