/* Blackout Estate — Capital-inspired rules layout v17 */
:root{
  --cap-bg:#031926;
  --cap-panel:#071d2b;
  --cap-panel-2:#0a2334;
  --cap-line:rgba(53,176,232,.20);
  --cap-blue:#0eaaf5;
  --cap-blue-soft:#78c9ee;
  --cap-text:#f1f7fb;
  --cap-copy:#91bdd7;
}
html{background:var(--cap-bg)}
body{
  font-family:Inter,Arial,sans-serif;
  background:
    radial-gradient(circle at 37% 8%,rgba(0,153,222,.14),transparent 32%),
    linear-gradient(rgba(64,183,232,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(64,183,232,.045) 1px,transparent 1px),
    #031926;
  background-size:auto,64px 64px,64px 64px;
  color:var(--cap-text);
}
body:before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.18),transparent 18%,transparent 82%,rgba(0,0,0,.28)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0 1px,transparent 1px 5px);
}
.wrap{max-width:1280px;padding:28px 34px 90px}
.top-actions{margin:0 0 18px}.admin-link{font-size:13px;padding:11px 16px;border-radius:10px;background:rgba(4,25,38,.84)}
.hero{padding:4px 0 44px}
.badge{font-size:12px;padding:9px 14px;letter-spacing:.11em;background:linear-gradient(90deg,#074566,#06354f)}
.hero h1{font-size:64px;line-height:1.02;margin:18px 0 20px;letter-spacing:-.055em}
.hero h1 span{font-size:56px;color:#08aef6}
.hero p{max-width:630px;font-size:16px;line-height:1.8;color:#96c6e3}
.stats{gap:12px;margin-top:42px}
.stat{font-size:13px;padding:10px 15px;box-shadow:none;background:linear-gradient(90deg,rgba(8,174,246,.13),rgba(8,174,246,.035));border-color:rgba(24,170,238,.22);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px))}
.stat.gold{background:linear-gradient(90deg,rgba(255,192,50,.13),rgba(255,192,50,.03))}
.search-panel{margin:0 0 34px;padding:13px 15px;border-radius:10px;box-shadow:none;background:rgba(3,20,31,.80)}
.search-row input{padding:13px 15px;border-radius:8px;font-size:14px;font-weight:700}
.layout{grid-template-columns:220px minmax(0,1fr);gap:54px;align-items:start}
.nav{top:18px;padding:14px;border-radius:6px;border:1px solid rgba(26,157,218,.24);border-left:2px solid #0eaaf5;background:rgba(3,18,28,.88);box-shadow:none}
.nav h3{font-size:11px;margin:2px 4px 14px;padding-bottom:12px;border-bottom:1px solid rgba(81,177,222,.15);letter-spacing:.15em}
#nav.nav a{grid-template-columns:19px 22px minmax(0,1fr);gap:8px;min-height:43px;margin:7px 0;padding:10px 11px;border-radius:8px;border:1px solid rgba(126,194,224,.10);border-left:1px solid rgba(126,194,224,.10);background:rgba(255,255,255,.025);color:#a9c4d5;box-shadow:none;transform:none}
#nav.nav a .nav-icon{width:19px;height:19px;border:0;background:transparent;color:#6cbde5;font-size:12px;box-shadow:none}
#nav.nav a .nav-num{font-size:11px;color:#72c5eb;min-width:18px}
#nav.nav a b{font-size:13px;font-weight:800;color:#acc4d3}
#nav.nav a:hover{
  transform:none!important;
  color:#fff!important;
  border-color:rgba(14,170,245,.45)!important;
  border-left-color:#0eaaf5!important;
  background:linear-gradient(90deg,rgba(14,170,245,.16),rgba(14,170,245,.055))!important;
  box-shadow:inset 2px 0 0 #0eaaf5,0 0 18px rgba(8,143,205,.08)!important;
}
#nav.nav a.active:not(:hover){
  border-color:rgba(var(--active-section-rgb,21,174,234),.42)!important;
  border-left-color:var(--active-section-accent,#15aeea)!important;
  background:linear-gradient(90deg,rgba(var(--active-section-rgb,21,174,234),.12),rgba(var(--active-section-rgb,21,174,234),.035))!important;
  box-shadow:inset 2px 0 0 var(--active-section-accent,#15aeea)!important;
}
#nav.nav a:hover .nav-icon,#nav.nav a.active .nav-icon{background:transparent!important;color:var(--section-accent,#0eaaf5)!important;box-shadow:none!important;border:0!important}
#nav.nav a:hover .nav-num,#nav.nav a:hover b{color:#eaf8ff!important}
.notice-box{margin-bottom:50px;padding:18px 22px;border-radius:9px;font-size:15px;line-height:1.7;background:linear-gradient(90deg,rgba(8,174,246,.10),rgba(8,174,246,.025));border-color:rgba(31,184,255,.28)}
.section{margin-bottom:54px}
.section-head{min-height:128px;padding:27px 32px;grid-template-columns:46px 1fr;gap:18px;background:linear-gradient(90deg,rgba(var(--section-accent-rgb),.16),rgba(var(--section-accent-rgb),.035));border-color:rgba(var(--section-accent-rgb),.28);border-left:3px solid var(--section-accent);clip-path:polygon(0 0,98.5% 0,100% 12%,100% 100%,0 100%)}
.section-head:after{right:18px;top:9px;font-size:88px;color:rgba(var(--section-accent-rgb),.07)}
.icon{width:42px;height:42px;background:rgba(var(--section-accent-rgb),.13);color:var(--section-accent);font-size:16px}
.kicker{font-size:10px;color:var(--section-accent);letter-spacing:.15em}
.section-head h2{font-size:29px;line-height:1.15;margin:5px 0 7px}
.section-head p{font-size:15px;line-height:1.65;max-width:690px;color:#9ab8cc}
.rule{grid-template-columns:55px 1fr;gap:18px;padding:22px 10px 22px 0;border-bottom:1px solid rgba(123,191,222,.10);border-left:2px solid transparent;border-radius:0;transition:background .17s ease,border-color .17s ease,box-shadow .17s ease}
.rule::before{display:none}
.rule:hover,.rule:focus-within{
  transform:none;
  padding-left:0;
  border-left-color:var(--section-accent);
  background:linear-gradient(90deg,rgba(var(--section-accent-rgb),.105),rgba(var(--section-accent-rgb),.025) 68%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.012),inset 0 -1px 0 rgba(255,255,255,.01);
}
.num{margin-left:8px;padding:6px 8px;font-size:11px;border-radius:3px;background:rgba(var(--section-accent-rgb),.08);border-color:rgba(var(--section-accent-rgb),.16);color:var(--section-accent);box-shadow:none!important}
.rule:hover .num{background:rgba(var(--section-accent-rgb),.12);border-color:rgba(var(--section-accent-rgb),.26);color:var(--section-accent);box-shadow:none}
.rule h3{font-size:15px;line-height:1.35;margin:0 0 7px;font-weight:800;letter-spacing:-.01em;text-shadow:none!important}
.rule p,.rule li{font-size:14px;line-height:1.75;color:#96c8e7}
.rule p{margin:0 0 10px}
.tag{font-size:9px;padding:3px 7px;border-radius:2px;margin-left:7px;letter-spacing:.08em;background:rgba(97,160,197,.12);color:#a6d5ee;border:1px solid rgba(120,188,225,.15)}
.tag.red{background:rgba(255,186,35,.12);color:#ffc13a;border-color:rgba(255,191,56,.22)}
.tag.green{background:rgba(71,184,240,.10);color:#8fd8f7;border-color:rgba(71,184,240,.18)}
.footer{font-size:12px;color:#668da5}
/* admin gets the same restrained visual language */
.admin-shell{max-width:1280px;padding:28px 34px 90px}
.panel{border-radius:9px;background:rgba(3,18,28,.86);border-color:rgba(39,164,223,.18);box-shadow:none}
.btn{border-radius:8px;font-size:13px;padding:10px 14px;background:rgba(7,37,54,.76)}
.btn.primary{background:#07577f;border-color:#0eaaf5}
.list-item{border-radius:8px;background:rgba(255,255,255,.025)}
.section-list-item:hover,.section-list-item.active,.rule-list-item:hover,.rule-list-item.active{transform:none!important;background:linear-gradient(90deg,rgba(14,170,245,.13),rgba(14,170,245,.035))!important;box-shadow:inset 2px 0 0 #0eaaf5!important}
@media(max-width:900px){.wrap{padding:22px 18px 70px}.hero h1{font-size:48px}.hero h1 span{font-size:44px}.layout{gap:24px}.section-head{padding:24px}.rule{grid-template-columns:1fr}.num{margin-left:0}}

/* v18: displayed icons are decorative and cannot be selected, dragged, or copied */
.icon,
.nav-icon,
.section-list-icon,
.badge-icon,
.stat-icon,
.notice-icon,
.rule-icon,
[class*="-icon"]:not(input):not(textarea):not([contenteditable="true"]) {
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  user-drag: none !important;
  cursor: default;
}

.icon::selection,
.nav-icon::selection,
.section-list-icon::selection,
[class*="-icon"]::selection {
  background: transparent;
}

/* v20: Gang structure feature */
.gang-structure{margin:28px 0 34px;padding:0 0 4px}
.gang-structure-label{display:flex;align-items:center;gap:10px;margin:0 0 20px;color:#d984ff;font-size:11px;font-weight:900;letter-spacing:.22em;text-transform:uppercase}
.gang-structure-label>span{width:34px;height:1px;background:linear-gradient(90deg,rgba(143,73,212,.14),rgba(143,73,212,.72))}
.gang-structure-label b{padding:7px 13px;background:linear-gradient(90deg,rgba(111,49,152,.26),rgba(72,37,99,.14));border:1px solid rgba(168,84,227,.24);clip-path:polygon(0 0,92% 0,100% 28%,100% 100%,0 100%)}
.gang-tier-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.gang-tier-card{position:relative;min-height:224px;padding:24px 24px 20px;background:linear-gradient(135deg,rgba(20,20,42,.92),rgba(12,18,31,.96));border:1px solid rgba(157,83,214,.26);border-left:3px solid #a148d0;clip-path:polygon(0 0,96.5% 0,100% 7%,100% 100%,0 100%);transition:background .2s ease,border-color .2s ease,transform .2s ease}
.gang-tier-card:hover{background:linear-gradient(135deg,rgba(30,25,54,.95),rgba(13,20,34,.98));border-color:rgba(180,95,235,.38);transform:translateY(-1px)}
.gang-tier-card.gold{border-color:rgba(230,176,41,.27);border-left-color:#d6a500;background:linear-gradient(135deg,rgba(31,28,39,.94),rgba(18,20,31,.97))}
.gang-tier-card.gold:hover{background:linear-gradient(135deg,rgba(39,34,44,.96),rgba(20,22,34,.98));border-color:rgba(235,187,58,.39)}
.gang-tier-top{display:flex;align-items:center;gap:13px;color:#a7c8ef;font-size:13px}
.gang-tier-pill{padding:5px 10px;background:rgba(132,55,181,.28);border:1px solid rgba(168,84,227,.33);color:#e08dff;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.gang-tier-card.gold .gang-tier-pill{background:rgba(186,133,0,.23);border-color:rgba(222,173,31,.34);color:#ffd253}
.gang-tier-card h3{margin:14px 0 14px;color:#fff;font-size:20px;line-height:1.2}
.gang-tier-card ul{list-style:none;padding:0;margin:0;display:grid;gap:9px;color:#a9c9f1;font-size:14px;line-height:1.55}
.gang-tier-card li{position:relative;padding-left:18px}
.gang-tier-card li::before{content:'–';position:absolute;left:2px;color:#b45be8}
.gang-tier-card.gold li::before{color:#e6b123}
@media(max-width:760px){.gang-tier-grid{grid-template-columns:1fr}.gang-tier-card{min-height:auto}}


.nav-icon i,
.section-head .icon i{
  display:inline-block;
  line-height:1;
  font-size:.95em;
}