/* Atlas — entity page: alliance / corporation / faction (builds on ../styles.css for the shared chrome). */

[hidden] { display: none !important; }

#mainWrapper { overflow-y: auto; }

#entWrap { padding: 16px 18px 26px; font-size: 1em; display: flex; flex-direction: column; gap: 14px; }

/* shared panel block (same as the other Atlas pages) */
.panel { background-color: var(--backgroundColor); border: 1px solid var(--borderColor31); padding: 12px 14px 14px; min-width: 0; }
.panelTitle { margin: 0 0 10px; font-family: 'Shentox Medium', 'Segoe UI', sans-serif; font-size: 0.8571em; letter-spacing: 2px; color: var(--themeColor); font-weight: normal; }
.panelList { display: flex; flex-direction: column; font-size: 1em; }
.panelEmpty { color: var(--textColor2); font-size: 0.8929em; padding: 8px 0; }
.thead, .trow { display: grid; align-items: center; gap: 10px; padding: 5px 0; }
.trow { border-top: 1px solid #d2d2d20a; }
.thead { font-size: 0.7143em; letter-spacing: 1.5px; color: var(--textColor2); padding-bottom: 4px; }
.tag { font-size: 0.7143em; letter-spacing: 1px; padding: 2px 7px; border: 1px solid var(--borderColor31); color: var(--textColor); text-align: center; text-transform: uppercase; }
.tag-ihub { border-color: #7d6b3c; color: #c0a060; }
.tag-tcu  { border-color: #4a7d8a; color: #7ec3d8; }
.barGroup { display: flex; gap: 3px; }
.barBtn { background: none; border: 1px solid var(--borderColor31); padding: 6px 13px; font-family: inherit; font-size: 0.8929em; color: var(--textColor2); cursor: pointer; text-decoration: none; white-space: nowrap; }
.barBtn:hover { color: var(--textColor); }
.dim { color: var(--textColor2); font-size: 0.8571em; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.ent { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.ent .entName { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--textColor); }
.ent a { color: var(--themeColor); text-decoration: none; }
.ent a:hover { text-decoration: underline; }
.elogo { flex-shrink: 0; border-radius: 2px; background-color: #d2d2d208; }
.swatch { display: inline-block; width: 10px; height: 10px; border: 1px solid #00000080; vertical-align: -1px; flex-shrink: 0; }
.hot  { color: #f06000; }
.warm { color: #e0b040; }
.up { color: #48f0c0; }
.down { color: #f06000; }
.secBadge { width: 36px; text-align: center; font-size: 0.7857em; color: #151515; flex-shrink: 0; font-family: 'Shentox SemiBold', 'Segoe UI', sans-serif; padding: 1px 0; display: inline-block; }
.mapBtn { justify-self: start; display: inline-flex; align-items: center; justify-content: center; width: 1.7em; height: 1.7em; border: 1px solid var(--borderColor31); }
.mapBtn svg { width: 1.05em; height: 1.05em; stroke: var(--ghost); fill: none; stroke-width: 1.6; }
.mapBtn:hover { border-color: var(--textColor2); }
.mapBtn:hover svg { stroke: var(--ghostActive); }
.tabRow { display: flex; gap: 3px; font-size: 0.8929em; flex-wrap: wrap; }
.pane { padding-top: 12px; }

/* 1. hero band (emblem · name · kind · place) then three sections, as on the system page */
#infoHead { display: block; }
.hero { display: flex; align-items: center; gap: 18px; padding: 8px 0 12px; border-bottom: 1px solid var(--borderColor31); }
.hero .whoImg { flex: 0 0 auto; }
.whoImg { position: relative; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; }
.whoImg .elogo { border-radius: 4px; }
/* occupied system: original owner's emblem faded behind, occupier's in front */
.whoPair { position: relative; display: block; width: 64px; height: 64px; }
.whoPair .elogo { position: absolute; top: 0; left: 0; }
.whoPair .elogo:first-child { transform: translate(-16px, -10px) scale(0.75); opacity: 0.45; filter: grayscale(0.6); }
.whoPair .elogo:last-child { transform: translate(8px, -2px); box-shadow: 0 0 0 2px #1a1a1a; }
.heroText { flex: 1 1 auto; min-width: 0; }
.heroName { font-family: 'Shentox Medium', 'Segoe UI', sans-serif; font-size: 1.2857em; color: var(--themeColor); letter-spacing: 1px; display: flex; align-items: baseline; gap: 10px; }
.heroName a { color: inherit; text-decoration: none; }
.heroName a:hover { text-decoration: underline; }
.heroUni { display: inline-flex; align-self: center; margin-right: 2px; color: var(--textColor2); }
.heroUni:hover { color: var(--themeColor); text-decoration: none !important; }
.heroUni svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.heroSec { font-size: 0.8889em; }
.heroTrue { font-size: 0.7222em; color: var(--textColor2); letter-spacing: 0; font-family: 'Shentox Regular', 'Segoe UI', sans-serif; }
.heroSub { margin-top: 4px; }
.heroWho { color: var(--fc, var(--themeColor)); }
.heroPlace { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; color: var(--textColor); white-space: nowrap; }
.heroCrumb { display: flex; align-items: center; }
.heroCrumb a { color: var(--themeColor); text-decoration: none; }
.heroCrumb a:hover { text-decoration: underline; }
.heroCrumb .sep { color: var(--textColor2); margin: 0 6px; }
.heroCrumb .tag-occ { margin-left: 12px; }
.tag-occ { margin-left: 8px; border-color: #7d6b3c; color: #e0b040; }
#infoHead .tag { padding: 2px 7px; }
/* three equal sections (a third each). When the tile shrinks they give way in order: the holder section
   first (down to 220px of content), then the activity boxes, and the system list last — none of them
   ever goes below its content. The rule between two sections has 32px of air on each side. */
.heroBody { display: flex; align-items: stretch; padding-top: 4px; }
.iCol { min-width: 0; flex: 1 1 33.333%; }
.heroBody .facts { flex-shrink: 0.001; min-width: max-content; padding-right: 32px; }
.heroBody .kpis  { flex-shrink: 1;     min-width: max-content; padding: 0 32px; border-left: 1px solid var(--borderColor31); }
.heroBody .extra { flex-shrink: 1000;  min-width: 252px;       padding-left: 32px; border-left: 1px solid var(--borderColor31); }
/* fact rows: key · dotted leader · right-aligned value, no borders */
.iRow, .iHead { display: flex; align-items: center; gap: 10px; padding: 4px 0; }
.iHead { justify-content: space-between; padding-top: 6px; font-size: 0.7857em; letter-spacing: 1.5px; text-transform: uppercase; color: var(--themeColor); }
.iRow .iL { color: var(--textColor2); flex: 0 0 auto; white-space: nowrap; }
.iRow .iDots { flex: 1 1 18px; min-width: 18px; height: 3px; margin: 0 2px; background: radial-gradient(circle, #d2d2d259 0.9px, transparent 1.3px) left center / 5px 3px repeat-x; }
.iRow .iV { color: var(--textColor); white-space: nowrap; font-variant-numeric: tabular-nums; display: flex; align-items: center; justify-content: flex-end; gap: 4px; text-align: right; }
.iRow .iV b { font-weight: normal; color: var(--themeColor); }
.iRow .iV a { color: var(--themeColor); text-decoration: none; }
.iRow .iV a:hover { text-decoration: underline; }
.iRow .ent { display: inline-flex; align-items: center; gap: 5px; }
/* activity boxes: 2 × 2, every box as wide as the widest; 1 h strongest → 7 d faded */
.kpiGrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 12px; padding-top: 6px; }   /* 2 × 2, every box as wide as the widest */
.kpi { padding: 6px 10px 7px; border: 1px solid var(--borderColor31); background-color: #d2d2d204; white-space: nowrap; }
.kpiL { font-size: 0.7857em; letter-spacing: 1.5px; text-transform: uppercase; color: var(--textColor2); }
.kpiMain { margin-top: 2px; font-variant-numeric: tabular-nums; }
.kpiMain .a1 { font-family: 'Shentox Bold', 'Segoe UI', sans-serif; color: var(--themeColor); }
.kpiU { font-size: 0.7857em; color: var(--textColor2); margin-left: 5px; letter-spacing: 0.5px; }
.partial { cursor: help; }                                          /* a period longer than the history so far (title tells since when) */
.kpiRest { display: flex; gap: 14px; margin-top: 2px; color: var(--textColor); font-variant-numeric: tabular-nums; }
.kpiRest .a7 { opacity: 0.75; }
.icoLink { display: inline-flex; vertical-align: middle; margin-left: 6px; color: var(--textColor); }
.icoLink:hover { color: var(--themeColor); }
.icoLink .ico { display: block; }
.extra .score { margin: 8px 0 6px; }
.extra .chip { width: 12px; height: 12px; }
.struct, .camp { display: flex; align-items: center; gap: 10px; font-size: 0.9286em; padding: 4px 0; border-top: 1px solid #d2d2d20a; }
.struct .stType { color: var(--textColor); }
.struct .stAdm { color: var(--textColor2); }
.struct .stAdm b { font-weight: normal; color: var(--themeColor); }
.struct .stVuln, .camp .timer { margin-left: auto; white-space: nowrap; }
.holderLine { margin-top: 8px; color: var(--textColor2); font-size: 0.8571em; }
.holderLine a { color: var(--textColor); text-decoration: none; }
.holderLine a:hover { color: var(--themeColor); }
.incursion { margin-top: 8px; padding: 6px 10px; border: 1px solid #6a3a3a; color: #f0a0a0; font-size: 0.8571em; }
.st-uncontested { color: var(--textColor2); }
.st-contested  { border-color: #7d6b3c; color: #e0b040; }
.st-vulnerable { border-color: #8a3a2a; color: #f06000; }
.st-captured   { border-color: #4a7d8a; color: #7ec3d8; }


.heroSub .swatch { margin-right: 6px; }
.heroLinks { display: flex; gap: 3px; }
.heroMeta { color: var(--textColor2); font-size: 0.8571em; text-align: right; }

/* 2. two tiles */
#twoTiles { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mapHead { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.mapHead .panelTitle { margin: 0; flex: 1 1 auto; }
#panelMap { display: flex; flex-direction: column; }
#entMapWrap { position: relative; flex: 1 1 auto; min-height: 340px; border: 1px solid var(--borderColor31); background-color: #151515; overflow: hidden; }
#entMap { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: grab; outline: none; }
#entMap:active { cursor: grabbing; }
#entTip { position: absolute; z-index: 5; pointer-events: none; background-color: #0d0d0df2; border: 1px solid var(--borderColor31); padding: 6px 10px; color: var(--textColor); font-size: 0.8571em; white-space: nowrap; }
#entTip b { font-weight: normal; color: var(--themeColor); }
#listRegions { max-height: 380px; overflow-y: auto; }
.trow.rg, .thead.rg { grid-template-columns: 26px minmax(120px, 1fr) minmax(140px, 1.4fr) 60px 60px; }
.trow.rg .rn a { color: var(--themeColor); text-decoration: none; }
.trow.rg .rn a:hover { text-decoration: underline; }
.share { display: flex; align-items: center; gap: 8px; }
.shareWrap { flex: 1 1 auto; height: 7px; background-color: #d2d2d20d; }
.shareBar { display: block; height: 100%; }
.shareTxt { font-size: 0.8571em; color: var(--textColor2); white-space: nowrap; font-variant-numeric: tabular-nums; }

/* 3. tabs */
.trow.sy, .thead.sy { grid-template-columns: 26px 36px minmax(120px, 1.1fr) minmax(110px, 1fr) minmax(110px, 1fr) 60px 110px minmax(140px, 1fr) 90px; }
.trow.sy .sys a { color: var(--themeColor); text-decoration: none; }
.trow.sy .sys a:hover { text-decoration: underline; }
.structs { display: flex; gap: 4px; }
.trow.hi, .thead.hi { grid-template-columns: 90px 70px minmax(120px, 1fr) minmax(110px, 1fr) minmax(200px, 1.4fr); }
.trow.hi .when { color: var(--textColor2); font-size: 0.8571em; white-space: nowrap; cursor: help; }
.trow.ca, .thead.ca { grid-template-columns: minmax(120px, 1fr) minmax(110px, 1fr) 120px minmax(160px, 1.2fr) 90px 90px; }
.trow.cp, .thead.cp { grid-template-columns: minmax(200px, 1fr) 90px 90px 90px; }
.trow.mv, .thead.mv { grid-template-columns: 90px 60px minmax(180px, 1.2fr) 80px minmax(200px, 1.4fr); }
.trow.mvc, .thead.mvc { grid-template-columns: 90px 0 minmax(180px, 1.2fr) 80px minmax(160px, 1fr) minmax(160px, 1fr); }
.mHead { display: flex; justify-content: space-between; gap: 10px; font-size: 0.7143em; letter-spacing: 1.5px; color: var(--textColor); padding: 6px 0; }
.mHead .dim { letter-spacing: 0.5px; font-size: 1.2em; }
.mChart { width: 100%; height: auto; display: block; background-color: #151515; border: 1px solid var(--borderColor31); margin-bottom: 14px; }
.mChart .grid { stroke: #2a2a2a; stroke-width: 1; vector-effect: non-scaling-stroke; }
.mChart .tick { fill: var(--textColor2); font-size: 10px; }
.mChart .line { fill: none; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.mChart .area { opacity: 0.12; }
.mChart .pt { fill: transparent; }
.mChart .pt:hover { fill: currentColor; }
.trow.fw, .thead.fw { grid-template-columns: 26px 36px minmax(120px, 1.1fr) minmax(110px, 1fr) minmax(140px, 1fr) 90px 110px; }
.stBar { display: flex; align-items: center; gap: 6px; }
.stBarWrap { flex: 1 1 auto; height: 6px; background-color: #d2d2d20d; }
.stBarFill { display: block; height: 100%; }
.st-uncontested { color: var(--textColor2); }
.st-contested  { border-color: #7d6b3c; color: #e0b040; }
.st-vulnerable { border-color: #8a3a2a; color: #f06000; }
.st-captured   { border-color: #4a7d8a; color: #7ec3d8; }
.fwStats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px 12px; padding: 4px 0 12px; }
.regGroup { padding: 10px 0 4px; font-size: 0.7857em; letter-spacing: 1.5px; text-transform: uppercase; color: var(--themeColor); }
.desc { color: var(--textColor); line-height: 1.5; white-space: pre-line; max-width: 80em; }

@media (max-width: 1100px) {
    .heroBody { flex-wrap: wrap; }
    .heroBody .facts, .heroBody .kpis { flex-basis: 50%; }
    .heroBody .kpis { padding-right: 0; }
    .heroBody .extra { flex-basis: 100%; border-left: 0; padding-left: 0; padding-top: 10px; }
    #twoTiles { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .heroBody .iCol { flex-basis: 100%; min-width: 0; padding: 0; border-left: 0; }
    .heroBody .kpis, .heroBody .extra { padding-top: 10px; }
    .hero { flex-wrap: wrap; }
    .heroPlace { align-items: flex-start; }
}
/* systems held over time (History tab): stepped chart, hover line and tip */
#heldBox { padding: 0 0 4px; }
.hWrap { position: relative; }
.hChart { cursor: pointer; margin-bottom: 6px; }
.hChart .hBg { fill: transparent; }
.hChart .hCur { stroke: #d2d2d2; stroke-width: 1; vector-effect: non-scaling-stroke; pointer-events: none; }
.hTip { position: absolute; pointer-events: none; background-color: #0d0d0d; border: 1px solid var(--borderColor31); padding: 6px 10px; font-size: 0.8571em; color: var(--textColor); white-space: nowrap; z-index: 2; }
.hTip b { color: var(--themeColor); }
.hNote { font-size: 0.7857em; color: var(--textColor2); padding: 0 0 10px; }

/* Phase 7: the past -- the corporation's alliance ribbon, the alliance's corporations chart and tables */
.rbWrap { position: relative; margin-bottom: 10px; }
.ribbon { width: 100%; height: 62px; display: block; }
.ribbon .rb rect { stroke: #151515; stroke-width: 1; vector-effect: non-scaling-stroke; }
.ribbon .rb:hover rect { stroke: #d2d2d2; }
.ribbon .rbLbl { font-size: 11px; pointer-events: none; }
.ribbon .tick { fill: var(--textColor2); font-size: 10px; }
.ribbon .grid { stroke: #2a2a2a; stroke-width: 1; vector-effect: non-scaling-stroke; }
.trow.ap, .thead.ap { grid-template-columns: 100px 100px 90px minmax(220px, 1.6fr) minmax(100px, 1fr); }
.trow.ap .ent { display: inline-flex; align-items: center; gap: 6px; }
.trow.ap .swatch { width: 10px; height: 10px; display: inline-block; }
.gap { font-style: italic; }
.tag-closed { border-color: #4a4a4a; color: var(--textColor2); margin-left: 6px; }
.trow.fm, .thead.fm { grid-template-columns: minmax(200px, 1.4fr) 100px 100px 90px minmax(200px, 1.2fr); }
.trow.mv .num, .thead.mv .num { text-align: right; }
.chipRow { display: flex; gap: 6px; padding: 0 0 8px; }
.chip { background: none; border: 1px solid var(--borderColor31); color: var(--textColor2); font-family: inherit; font-size: 0.7857em; letter-spacing: 0.5px; padding: 2px 9px 4px; cursor: pointer; }
.chip:hover { color: var(--textColor); }
.chip.chip-on { color: var(--textColor); box-shadow: inset 0 -2px 0 #d2d2d2; }
.hChart.noClick { cursor: crosshair; }
#corpChartBox { margin-bottom: 14px; }
@media (max-width: 900px) {
    .trow.ap, .thead.ap { grid-template-columns: 90px 90px 80px minmax(160px, 1.4fr); }
    .trow.ap > :nth-child(5), .thead.ap > :nth-child(5) { display: none; }
    .trow.fm, .thead.fm { grid-template-columns: minmax(160px, 1.4fr) 90px 90px minmax(140px, 1fr); }
    .trow.fm > :nth-child(4), .thead.fm > :nth-child(4) { display: none; }
}