/*
Copyright (C) 2025 moregh (https://github.com/moregh/)
Licensed under AGPL License.
*/

/* Highlight war-eligible zkill cards */
.zkill-stats-card.war-eligible {
    border: 2px solid rgba(255, 71, 87, 0.4);
    box-shadow: 0 0 20px rgba(255, 71, 87, 0.2);
}

/* ============================
Modal & Card
============================ */
.zkill-modal-backdrop {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.85);
backdrop-filter: blur(12px);
z-index: 10000;
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
opacity: 0;
visibility: hidden;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
overflow-y: auto;
}
.zkill-modal-backdrop.show {
opacity: 1;
visibility: visible;
}

.zkill-stats-card {
background: linear-gradient(135deg,
rgba(10, 10, 10, 0.95) 0%,
rgba(15, 15, 20, 0.95) 50%,
rgba(10, 10, 10, 0.95) 100%);
backdrop-filter: blur(24px);
border: 2px solid var(--border-glow);
border-radius: 20px;
box-shadow:
0 25px 80px rgba(0, 0, 0, 0.5),
0 0 0 1px var(--white-1),
inset 0 1px 0 var(--white-2);
max-width: 900px;
width: 100%;
max-height: 90vh;
overflow: visible;
position: relative;
transform: scale(0.8) translateY(50px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.zkill-modal-backdrop.show .zkill-stats-card {
transform: scale(1) translateY(0);
}

/* ============================
Header
============================ */
.zkill-card-header {
padding: 1.5rem 2rem;
border-bottom: 1px solid var(--white-1);
display: flex;
align-items: center;
justify-content: flex-start;
background: linear-gradient(90deg,
rgba(0, 212, 255, 0.1) 0%,
rgba(74, 222, 128, 0.05) 50%,
rgba(0, 212, 255, 0.1) 100%);
position: relative;
}
.zkill-card-header::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 1px;
background: linear-gradient(90deg,
transparent,
rgba(0, 212, 255, 0.5),
rgba(74, 222, 128, 0.5),
transparent);
}

/* Floating controls in header (close/back) */
.zkill-header-controls {
position: absolute;
top: -15px;
right: -15px;
display: flex;
gap: 8px;
z-index: 10901;
pointer-events: none;
}

/* ============================
Entity (avatar, details, affiliations)
============================ */
.zkill-entity-avatar {
width: 60px;
height: 60px;
border-radius: var(--radius-large);
border: 2px solid var(--white-2);
object-fit: cover;
background: var(--gradient-highlight);
}

.zkill-entity-info {
display: flex;
align-items: center;
gap: 1rem;
flex: 1;
}

.zkill-entity-details {
display: flex;
flex-direction: column;
min-width: 0;
}

.zkill-entity-details h2 {
font-size: 1.4rem;
font-weight: 700;
color: var(--primary-color);
margin-bottom: 0.25rem;
display: flex;
align-items: center;
gap: 0.5rem;
white-space: nowrap;
}

.zkill-entity-type {
font-size: 0.9rem;
color: var(--text-secondary);
text-transform: capitalize;
}

/* Affiliations - horizontal by default */
.zkill-entity-affiliations {
display: flex;
gap: 1rem;
align-items: center;
margin-left: 2rem;
flex-shrink: 0;
}

.zkill-affiliation-item {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.75rem;
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
transition: all var(--transition-normal) ease;
white-space: nowrap;
}
.zkill-affiliation-item:hover {
background: var(--white-06);
border-color: var(--border-glow);
transform: translateY(-1px);
}

.zkill-affiliation-logo {
width: 32px;
height: 32px;
border-radius: var(--radius-small);
object-fit: cover;
border: 1px solid var(--white-1);
background: var(--gradient-highlight);
transition: opacity 0.3s ease;
flex-shrink: 0;
}
.zkill-affiliation-info {
display: flex;
flex-direction: column;
min-width: 0;
}
.zkill-affiliation-label {
font-size: 0.7rem;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 0.1rem;
}
.zkill-affiliation-link {
color: var(--primary-color);
text-decoration: none;
font-size: 0.85rem;
font-weight: 500;
transition: color var(--transition-normal) ease;
overflow: hidden;
text-overflow: ellipsis;
}
.zkill-affiliation-link:hover {
color: var(--primary-light);
text-decoration: underline;
}

/* ============================
Header Buttons (Close & Back)
============================ */
.zkill-close-btn,
.zkill-back-btn {
pointer-events: auto;
border-radius: 50%;
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
display: flex;
align-items: center;
justify-content: center;
font-weight: 600;
backdrop-filter: blur(8px);
}

.zkill-close-btn {
background: linear-gradient(135deg, rgba(248, 113, 113, 0.9), rgba(220, 38, 38, 0.9));
border: 2px solid rgba(248, 113, 113, 0.6);
color: white;
padding: 0;
font-size: 16px;
width: 36px;
height: 36px;
box-shadow: 0 4px 12px rgba(248, 113, 113, 0.3),
0 2px 4px rgba(0, 0, 0, 0.2);
}
.zkill-close-btn:hover {
background: linear-gradient(135deg, rgba(248, 113, 113, 1), rgba(220, 38, 38, 1));
border-color: rgba(248, 113, 113, 0.8);
transform: scale(1.1) rotate(90deg);
box-shadow: 0 6px 20px rgba(248, 113, 113, 0.5),
0 4px 8px rgba(0, 0, 0, 0.3);
}

.zkill-back-btn {
background: linear-gradient(135deg, rgba(0, 212, 255, 0.9), rgba(0, 153, 204, 0.9));
border: 2px solid rgba(0, 212, 255, 0.6);
color: white;
padding: 0;
font-size: 14px;
width: 32px;
height: 32px;
box-shadow: 0 4px 12px var(--border-glow),
0 2px 4px rgba(0, 0, 0, 0.2);
}
.zkill-back-btn:hover {
background: linear-gradient(135deg, rgba(0, 212, 255, 1), rgba(0, 153, 204, 1));
border-color: rgba(0, 212, 255, 0.8);
transform: scale(1.1) translateX(-2px);
box-shadow: 0 6px 20px rgba(0, 212, 255, 0.5),
0 4px 8px rgba(0, 0, 0, 0.3);
}

/* ============================
Card Content & Sections
============================ */
.zkill-card-content {
padding: 2rem;
max-height: calc(90vh - 120px);
overflow-y: auto;
}

.zkill-section {
margin-bottom: 2rem;
}

.zkill-section-title {
font-size: 1.2rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 1rem;
display: flex;
align-items: center;
gap: 0.5rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid var(--white-1);
}
.zkill-section-icon {
font-size: 1.1rem;
color: var(--primary-color);
}

/* ============================
Stats Grid
============================ */
.zkill-stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1rem;
margin-bottom: 2rem;
}

.zkill-stats-grid-single-row {
grid-template-columns: repeat(6, 1fr);
gap: 0.75rem;
}

.zkill-stat-item {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-large);
padding: 1.2rem;
text-align: center;
position: relative;
transition: all var(--transition-medium) ease;
overflow: hidden;
}
.zkill-stat-item::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: var(--gradient-primary);
opacity: 0.6;
}
.zkill-stat-item:hover {
transform: translateY(-2px);
background: var(--white-06);
border-color: var(--border-glow);
}
.zkill-stat-item-compact {
padding: 1rem 0.8rem;
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
}
.zkill-stat-value {
font-size: 1.8rem;
font-weight: 800;
color: var(--primary-color);
margin-bottom: 0.5rem;
display: block;
}
.zkill-stat-item-compact .zkill-stat-value {
font-size: 1.3rem;
margin-bottom: 0.4rem;
margin-top: auto;
}
.zkill-stat-label {
font-size: 0.9rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 500;
}
.zkill-stat-item-compact .zkill-stat-label {
font-size: 0.75rem;
margin-bottom: auto;
}
.zkill-stat-value-fleet {
color: #3498db;
}
.zkill-stat-value-solo {
color: #e74c3c;
}
.zkill-stat-value-gang {
color: #f39c12;
}
.zkill-stat-value-ops {
color: #9b59b6;
}
.zkill-stat-value-isk {
color: #f1c40f;
}
.zkill-stat-item.kills .zkill-stat-value { color: var(--secondary-color); }
.zkill-stat-item.losses .zkill-stat-value { color: var(--danger-color); }
.zkill-stat-item.efficiency .zkill-stat-value { color: var(--warning-color); }

/* ============================
Activity (timeline + grid)
============================ */
.zkill-activity-timeline {
display: flex;
gap: 1rem;
margin-bottom: 1rem;
}
.zkill-activity-period {
flex: 1;
background: var(--white-03);
border-radius: var(--radius-medium);
padding: 1rem;
text-align: center;
border-left: 3px solid var(--primary-color);
transition: all var(--transition-normal) ease;
}
.zkill-activity-period:hover {
background: var(--white-06);
transform: translateY(-1px);
}
.zkill-activity-period-label {
font-size: 0.8rem;
color: var(--text-secondary);
text-transform: uppercase;
margin-bottom: 0.5rem;
}
.zkill-activity-values {
display: flex;
justify-content: space-between;
gap: 0.5rem;
}
.zkill-activity-kills { color: var(--secondary-color); font-weight: 600; }
.zkill-activity-losses { color: var(--danger-color); font-weight: 600; }

/* Recent activity grid */
.zkill-activity-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 1rem;
margin-bottom: 1rem;
}
.zkill-activity-card {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-large);
padding: 1rem;
text-align: center;
transition: all var(--transition-medium) ease;
position: relative;
overflow: hidden;
}
.zkill-activity-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: var(--gradient-primary);
opacity: 0.6;
}
.zkill-activity-card:hover {
transform: translateY(-2px);
background: var(--white-06);
border-color: var(--border-glow);
}
.zkill-activity-icon {
font-size: 1.5rem;
margin-bottom: 0.5rem;
opacity: 0.8;
}
.zkill-activity-number {
font-size: 1.4rem;
font-weight: 700;
color: var(--primary-color);
margin-bottom: 0.25rem;
}
.zkill-activity-label {
font-size: 0.8rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
font-weight: 500;
}

/* ============================
Ships (compact grid)
============================ */
.zkill-ships-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 0.8rem;
margin-bottom: 1rem;
}
.zkill-ship-card {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
padding: 0.8rem;
border-left: 3px solid var(--primary-color);
transition: all var(--transition-normal) ease;
min-height: 60px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.8rem;
}
.zkill-ship-card:hover {
background: var(--white-06);
transform: translateY(-1px);
border-left-color: var(--secondary-color);
}
.zkill-ship-info {
display: flex;
align-items: center;
gap: 0.6rem;
flex: 1;
min-width: 0;
}
.zkill-ship-icon {
width: 32px;
height: 32px;
border-radius: var(--radius-small);
object-fit: cover;
border: 1px solid var(--white-1);
background: var(--gradient-highlight);
transition: opacity 0.3s ease;
flex-shrink: 0;
}
.zkill-ship-details {
display: flex;
flex-direction: column;
min-width: 0;
}
.zkill-ship-name {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
margin-bottom: 0.2rem;
line-height: 1.2;
}
.zkill-ship-group {
font-size: 0.75rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.zkill-ship-kills {
color: var(--secondary-color);
font-size: 0.8rem;
font-weight: 600;
flex-shrink: 0;
text-align: right;
}

/* ============================
Top Players (compact grid)
============================ */
.zkill-players-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 0.8rem;
margin-bottom: 1rem;
}
.zkill-player-card {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
padding: 0.8rem;
border-left: 3px solid var(--primary-color);
transition: all var(--transition-normal) ease;
display: flex;
align-items: center;
gap: 0.8rem;
cursor: pointer;
}
.zkill-player-card:hover {
background: var(--white-06);
transform: translateY(-1px);
border-left-color: var(--secondary-color);
}
.zkill-player-portrait {
width: 48px;
height: 48px;
border-radius: 50%;
object-fit: cover;
border: 2px solid var(--white-1);
background: var(--gradient-highlight);
transition: opacity 0.3s ease;
flex-shrink: 0;
}
.zkill-player-info {
display: flex;
flex-direction: column;
min-width: 0;
flex: 1;
}
.zkill-player-name {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
margin-bottom: 0.2rem;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.zkill-player-kills {
color: var(--secondary-color);
font-size: 0.75rem;
font-weight: 600;
}

/* ============================
Locations (compact grid + hidden legacy list)
============================ */
.zkill-locations-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
gap: 0.8rem;
margin-bottom: 1rem;
}
.zkill-location-card {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
padding: 0.8rem;
border-left: 3px solid var(--secondary-color);
transition: all var(--transition-normal) ease;
min-height: 60px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.zkill-location-card:hover {
background: var(--white-06);
transform: translateY(-1px);
border-left-color: var(--primary-color);
}
.zkill-location-name {
font-weight: 600;
color: var(--text-primary);
font-size: 0.9rem;
margin-bottom: 0.4rem;
line-height: 1.2;
}
.zkill-location-bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
}
.zkill-location-security {
padding: 0.15rem 0.4rem;
border-radius: 10px;
font-size: 0.7rem;
font-weight: 600;
flex-shrink: 0;
}
.zkill-location-security.sec-high {
background: rgba(74, 222, 128, 0.2);
color: #4ade80;
}
.zkill-location-security.sec-low {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
.zkill-location-security.sec-null {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.zkill-location-security.sec-wspace {
background: rgba(59, 130, 246, 0.2);
color: #3b82f6;
}
.zkill-location-security.sec-pochven {
background: rgba(168, 85, 247, 0.2);
color: #a855f7;
}
.zkill-location-security.sec-unknown {
background: rgba(128, 128, 128, 0.2);
color: var(--text-muted);
}
.zkill-location-kills {
color: var(--secondary-color);
font-size: 0.8rem;
font-weight: 600;
}
.zkill-location-stats {
display: flex;
gap: 1rem;
font-size: 0.9rem;
}

/* Detailed locations section */
.zkill-location-summary {
display: flex;
gap: 1.5rem;
margin-bottom: 1rem;
padding: 1rem;
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
}
.zkill-location-stat {
display: flex;
flex-direction: column;
gap: 0.3rem;
}
.zkill-location-stat-label {
font-size: 0.75rem;
color: var(--text-secondary);
text-transform: uppercase;
letter-spacing: 0.05em;
}
.zkill-location-stat-value {
font-size: 1.1rem;
font-weight: 600;
color: var(--secondary-color);
}
.zkill-locations-detail-list {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.zkill-location-detail-card {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
padding: 0.8rem 1rem;
transition: all var(--transition-normal) ease;
border-left: 3px solid transparent;
}
.zkill-location-detail-card:hover {
background: var(--white-06);
border-left-color: var(--primary-color);
}
.zkill-location-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.zkill-location-system-info {
display: flex;
align-items: center;
gap: 0.8rem;
flex: 1;
min-width: 0;
}
.zkill-location-system-name {
font-weight: 600;
color: var(--primary-color);
font-size: 0.95rem;
text-decoration: none;
transition: color var(--transition-normal) ease;
}
.zkill-location-system-name:hover {
color: var(--secondary-color);
}
.zkill-location-sec-badge {
padding: 0.2rem 0.5rem;
border-radius: 12px;
font-size: 0.75rem;
font-weight: 600;
flex-shrink: 0;
}
.zkill-location-sec-badge.sec-high {
background: rgba(74, 222, 128, 0.2);
color: #4ade80;
}
.zkill-location-sec-badge.sec-low {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
.zkill-location-sec-badge.sec-null {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.zkill-location-sec-badge.sec-wspace {
background: rgba(59, 130, 246, 0.2);
color: #3b82f6;
}
.zkill-location-sec-badge.sec-pochven {
background: rgba(168, 85, 247, 0.2);
color: #a855f7;
}
.zkill-location-sec-badge.sec-unknown {
background: rgba(128, 128, 128, 0.2);
color: var(--text-muted);
}
.zkill-location-kills-count {
color: var(--secondary-color);
font-size: 0.9rem;
font-weight: 600;
flex-shrink: 0;
}

/* ============================
Top 10 Combined Section
============================ */
.zkill-top10-section {
margin-top: 1rem;
margin-bottom: 1.5rem;
}
.zkill-top10-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem;
}
.zkill-top10-column {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-medium);
padding: 1rem;
display: flex;
flex-direction: column;
}
.zkill-top10-column-title {
font-size: 0.9rem;
font-weight: 600;
color: var(--text-primary);
margin: 0 0 0.8rem 0;
padding-bottom: 0.6rem;
border-bottom: 1px solid var(--white-1);
display: flex;
align-items: center;
gap: 0.5rem;
}
.zkill-top10-column-icon {
font-size: 1rem;
}
.zkill-top10-list {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.zkill-top10-item {
display: flex;
align-items: center;
gap: 0.6rem;
padding: 0.5rem;
background: var(--white-02);
border-radius: var(--radius-small);
transition: all var(--transition-normal) ease;
cursor: pointer;
}
.zkill-top10-item:hover {
background: var(--white-05);
transform: translateX(2px);
}
.zkill-top10-icon {
width: 32px;
height: 32px;
border-radius: var(--radius-small);
object-fit: cover;
background: var(--gradient-highlight);
flex-shrink: 0;
}
.zkill-top10-portrait {
width: 32px;
height: 32px;
border-radius: 50%;
object-fit: cover;
border: 1px solid var(--white-1);
flex-shrink: 0;
}
.zkill-top10-sec-badge {
padding: 0.2rem 0.5rem;
border-radius: 10px;
font-size: 0.7rem;
font-weight: 600;
flex-shrink: 0;
}
.zkill-top10-sec-badge.sec-high {
background: rgba(74, 222, 128, 0.2);
color: #4ade80;
}
.zkill-top10-sec-badge.sec-low {
background: rgba(251, 191, 36, 0.2);
color: #fbbf24;
}
.zkill-top10-sec-badge.sec-null {
background: rgba(239, 68, 68, 0.2);
color: #ef4444;
}
.zkill-top10-sec-badge.sec-wspace {
background: rgba(59, 130, 246, 0.2);
color: #3b82f6;
}
.zkill-top10-sec-badge.sec-pochven {
background: rgba(168, 85, 247, 0.2);
color: #a855f7;
}
.zkill-top10-sec-badge.sec-unknown {
background: rgba(128, 128, 128, 0.2);
color: var(--text-muted);
}
.zkill-top10-info {
display: flex;
flex-direction: column;
flex: 1;
min-width: 0;
}
.zkill-top10-name {
font-size: 0.85rem;
font-weight: 600;
color: var(--text-primary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.zkill-top10-link {
color: var(--primary-color);
text-decoration: none;
transition: color var(--transition-normal) ease;
}
.zkill-top10-link:hover {
color: var(--secondary-color);
}
.zkill-top10-value {
font-size: 0.75rem;
color: var(--text-secondary);
}
.zkill-top10-empty {
padding: 1.5rem;
text-align: center;
color: var(--text-muted);
font-size: 0.85rem;
font-style: italic;
}

/* ============================
Charts
============================ */
.zkill-charts-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
gap: 1.5rem;
margin-bottom: 0;
}

.zkill-chart-container {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-large);
padding: 1rem;
position: relative;
overflow: hidden;
text-align: center;
}
.zkill-chart-container::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: var(--gradient-primary);
opacity: 0.6;
}
.zkill-chart-title {
font-size: 0.9rem;
font-weight: 600;
color: var(--text-primary);
margin-bottom: 1rem;
text-align: center;
}
.zkill-chart {
width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
.zkill-chart-bar {
transition: all var(--transition-normal) ease;
cursor: pointer;
}
.zkill-chart-bar:hover { opacity: 0.8; stroke-width: 2; }
.zkill-chart-label { font-family: 'Inter', sans-serif; font-weight: 500; }

.zkill-pie-chart-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.zkill-pie-chart {
    display: block;
    margin: 0 auto;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.zkill-pie-slice {
    transition: all var(--transition-medium) ease;
    cursor: pointer;
}

.zkill-pie-slice:hover {
    opacity: 0.9;
    transform: scale(1.02);
    transform-origin: center;
}

.zkill-pie-legend {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
}

.zkill-pie-legend-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.zkill-pie-legend-color {
    width: 16px;
    height: 16px;
    border-radius: var(--radius-small);
    flex-shrink: 0;
}

.zkill-pie-legend-label {
    flex: 1;
    color: var(--text-primary);
}

.zkill-pie-legend-value {
    color: var(--text-secondary);
    font-weight: 600;
}

.zkill-charts-empty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 2rem;
color: var(--text-muted);
text-align: center;
}
.zkill-charts-empty .zkill-empty-icon { font-size: 2rem; margin-bottom: 0.5rem; opacity: 0.5; }
.zkill-charts-empty .zkill-empty-text { font-size: 0.9rem; color: var(--text-secondary); }

/* ============================
Members Dropdown
============================ */
.zkill-members-section {
margin-top: -2rem;
margin-bottom: 1rem;
}
.zkill-members-dropdown {
background: var(--white-03);
border: 1px solid var(--white-1);
border-radius: var(--radius-large);
overflow: hidden;
margin-top: 1rem;
}
.zkill-members-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 1rem 1.2rem;
background: var(--white-05);
cursor: pointer;
transition: all var(--transition-normal) ease;
border-bottom: 1px solid var(--white-1);
}
.zkill-members-header:hover { background: var(--white-08); }

.zkill-members-title {
font-size: 1rem;
font-weight: 600;
color: var(--text-primary);
display: flex;
align-items: center;
gap: 0.5rem;
}
.zkill-members-count {
background: var(--border-glow);
color: var(--primary-color);
padding: 0.2rem 0.6rem;
border-radius: var(--radius-large);
font-size: 0.8rem;
font-weight: 600;
}
.zkill-members-toggle {
font-size: 1.2rem;
color: var(--text-secondary);
transition: transform var(--transition-normal) ease;
}
.zkill-members-dropdown.expanded .zkill-members-toggle { transform: rotate(180deg); }

.zkill-members-list {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.zkill-members-dropdown.expanded .zkill-members-list {
max-height: 300px;
overflow-y: auto;
}
.zkill-members-content { padding: 0; }

.zkill-member-item {
display: flex;
align-items: center;
gap: 0.8rem;
padding: 0.8rem 1.2rem;
border-bottom: 1px solid var(--white-05);
cursor: pointer;
transition: all var(--transition-normal) ease;
}
.zkill-member-item:hover { background: var(--white-05); padding-left: 1.5rem; }
.zkill-member-item:last-child { border-bottom: none; }

.zkill-member-avatar {
width: 32px;
height: 32px;
border-radius: var(--radius-small);
object-fit: cover;
border: 1px solid var(--white-1);
background: var(--gradient-highlight);
transition: opacity 0.3s ease;
flex-shrink: 0;
}
.zkill-member-info { flex: 1; min-width: 0; }
.zkill-member-name {
font-size: 0.9rem;
font-weight: 500;
color: var(--text-primary);
margin-bottom: 0.2rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.zkill-member-details {
font-size: 0.75rem;
color: var(--text-secondary);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

/* ============================
Loading / Error / Empty states
============================ */
.zkill-loading {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 3rem;
gap: 1.5rem;
}
.zkill-loading-spinner-container {
position: relative;
width: 60px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
}

.zkill-error {
text-align: center;
padding: 2rem;
color: var(--danger-color);
}
.zkill-error-icon { font-size: 3rem; margin-bottom: 1rem; opacity: 0.7; }
.zkill-error-text { font-size: 1.1rem; margin-bottom: 0.5rem; }
.zkill-error-details { font-size: 0.9rem; color: var(--text-secondary); }

.zkill-empty {
text-align: center;
padding: 2rem;
color: var(--text-muted);
}
.zkill-empty-icon { font-size: 3rem; margin-bottom: 1rem; opacity: 0.5; }

/* ============================
Killmail Data Sections
============================ */
.zkill-kills-list {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.zkill-kill-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-medium);
    transition: all var(--transition-normal) ease;
}

.zkill-kill-item:hover {
    background: var(--white-05);
    border-color: var(--border-glow);
    transform: translateX(4px);
}

.zkill-kill-ship {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.zkill-kill-icon {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-small);
    background: var(--white-05);
    flex-shrink: 0;
}

.zkill-kill-ship-info {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.zkill-kill-ship-name {
    font-weight: 600;
    color: var(--text-primary);
    font-size: 0.9rem;
}

.zkill-kill-value {
    font-size: 0.85rem;
    color: rgba(0, 212, 255, 0.8);
    font-weight: 500;
}

.zkill-kill-details {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: flex-end;
    gap: 2rem;
    margin-left: 2rem;
}

.zkill-kill-meta {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(100px, auto) minmax(80px, auto);
    gap: 1.5rem;
    font-size: 0.85rem;
    color: var(--text-secondary);
    align-items: center;
}

.zkill-kill-system {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    color: var(--text-primary);
}

.zkill-kill-system-name::before {
    content: '📍 ';
    opacity: 0.5;
    font-size: 0.9em;
}

.zkill-kill-sec {
    font-weight: 700;
    padding: 0.25rem 0.6rem;
    border-radius: var(--radius-small);
    font-size: 0.8rem;
    line-height: 1;
    display: inline-block;
}

.zkill-kill-sec.sec-high {
    color: #4ade80 !important;
    background: rgba(74, 222, 128, 0.25) !important;
    border: 1px solid rgba(74, 222, 128, 0.5) !important;
}

.zkill-kill-sec.sec-low {
    color: #fbbf24 !important;
    background: rgba(251, 191, 36, 0.25) !important;
    border: 1px solid rgba(251, 191, 36, 0.5) !important;
}

.zkill-kill-sec.sec-null {
    color: #ef4444 !important;
    background: rgba(239, 68, 68, 0.25) !important;
    border: 1px solid rgba(239, 68, 68, 0.5) !important;
}

.zkill-kill-sec.sec-wspace {
    color: #3b82f6 !important;
    background: rgba(59, 130, 246, 0.25) !important;
    border: 1px solid rgba(59, 130, 246, 0.5) !important;
}

.zkill-kill-sec.sec-pochven {
    color: #a855f7 !important;
    background: rgba(168, 85, 247, 0.25) !important;
    border: 1px solid rgba(168, 85, 247, 0.5) !important;
}

.zkill-kill-sec.sec-unknown {
    color: var(--text-secondary) !important;
    background: var(--white-05) !important;
    border: 1px solid var(--white-1) !important;
}

.zkill-kill-attackers {
    color: var(--text-secondary);
    font-weight: 500;
    white-space: nowrap;
}

.zkill-kill-attackers::before {
    content: '👥 ';
    opacity: 0.6;
}

.zkill-kill-time {
    color: var(--text-tertiary);
    font-weight: 500;
    white-space: nowrap;
}

.zkill-kill-time::before {
    content: '🕐 ';
    opacity: 0.6;
}

.zkill-kill-link {
    padding: 0.5rem 1rem;
    background: var(--gradient-primary);
    color: white;
    text-decoration: none;
    border-radius: var(--radius-small);
    font-weight: 600;
    font-size: 0.85rem;
    transition: all var(--transition-normal) ease;
    white-space: nowrap;
}

.zkill-kill-link:hover {
    transform: translateX(2px);
    box-shadow: 0 2px 8px rgba(0, 212, 255, 0.4);
}

/* ============================
Responsive - Large -> Medium -> Small
============================ */

@media (max-width: 1024px) {
.zkill-entity-info { flex-wrap: wrap; gap: 0.75rem; }
.zkill-entity-affiliations {
margin-left: 0;
width: 100%;
justify-content: flex-start;
}
.zkill-threat-grid { grid-template-columns: auto 1fr; }
.zkill-threat-ship-sizes { grid-column: 1 / -1; margin-top: 0.5rem; }
.zkill-stats-row { grid-template-columns: 1fr; }
.zkill-stats-left { grid-template-columns: 1fr 1fr; }
.zkill-activity-summary { grid-template-columns: repeat(3, 1fr); }
.zkill-charts-row { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
/* Modal & card */
.zkill-modal-backdrop { padding: 1rem; }
.zkill-stats-card {
max-height: calc(95vh - 2rem);
border-radius: 16px;
margin: 1rem;
}
/* Header */
.zkill-header-controls { top: -12px; right: -12px; gap: 6px; }
.zkill-card-header { padding: 1rem 1.5rem; flex-direction: column; gap: 1rem; text-align: center; }

/* Buttons sizing */
.zkill-close-btn { width: 32px; height: 32px; font-size: 14px; }
.zkill-back-btn  { width: 28px; height: 28px; font-size: 12px; }

/* Content */
.zkill-card-content { padding: 1.5rem; }
.zkill-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
.zkill-stats-grid-single-row { grid-template-columns: repeat(3, 1fr); gap: 0.6rem; }
.zkill-entity-info { flex-direction: column; text-align: center; width: 100%; }
.zkill-entity-affiliations { flex-direction: column; gap: 0.5rem; margin-left: 0; width: 100%; }
.zkill-affiliation-item { justify-content: center; width: 100%; max-width: 280px; margin: 0 auto; }
.zkill-affiliation-logo { width: 28px; height: 28px; }
.zkill-affiliation-link { font-size: 0.8rem; }

/* Activity, ships & locations */
.zkill-activity-timeline { flex-direction: column; gap: 0.8rem; }
.zkill-activity-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
.zkill-ships-grid { grid-template-columns: 1fr; gap: 0.6rem; }
.zkill-ship-card { padding: 0.8rem; }
.zkill-players-grid { grid-template-columns: 1fr; gap: 0.6rem; }
.zkill-player-card { padding: 0.8rem; }
.zkill-location-card { padding: 0.8rem; }
.zkill-locations-grid { grid-template-columns: 1fr; gap: 0.6rem; }
.zkill-location-bottom { justify-content: center; }
.zkill-location-summary { flex-direction: column; gap: 0.8rem; padding: 0.8rem; }
.zkill-location-detail-card { padding: 0.8rem; }

/* Members */
.zkill-members-list { max-height: 0; }
.zkill-members-dropdown.expanded .zkill-members-list { max-height: 250px; }
.zkill-member-item { padding: 0.6rem 1rem; }
.zkill-member-avatar { width: 28px; height: 28px; }

/* Top 10 */
.zkill-top10-grid { grid-template-columns: 1fr; gap: 1rem; }
.zkill-top10-column { padding: 0.8rem; }

/* Charts */
.zkill-charts-grid { grid-template-columns: 1fr; gap: 1rem; }
.zkill-chart-container { padding: 0.8rem; }
.zkill-chart-title { font-size: 0.8rem; margin-bottom: 0.8rem; }

/* Header controls adjust */
.zkill-header-controls { top: -8px; right: -8px; gap: 6px; }
}
/* ============================
REORGANIZED LAYOUT - Tactical Intelligence First
============================ */

/* Tactical Overview - Critical at-a-glance info */
.zkill-tactical-overview {
    margin-bottom: 1.5rem;
}

.zkill-tactical-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 1rem;
}

.zkill-tactical-stat {
    background: var(--white-05);
    border: 2px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1rem;
    text-align: center;
    transition: all var(--transition-medium) ease;
    position: relative;
}

.zkill-tactical-stat.dangerous {
    border-color: rgba(248, 113, 113, 0.6);
    background: rgba(248, 113, 113, 0.1);
}

.zkill-tactical-stat.safe {
    border-color: rgba(74, 222, 128, 0.6);
    background: rgba(74, 222, 128, 0.1);
}

.zkill-tactical-stat.moderate {
    border-color: rgba(251, 191, 36, 0.6);
    background: rgba(251, 191, 36, 0.1);
}

.zkill-tactical-stat.high {
    border-color: rgba(74, 222, 128, 0.6);
    background: rgba(74, 222, 128, 0.1);
}

.zkill-tactical-stat.low {
    border-color: rgba(248, 113, 113, 0.6);
    background: rgba(248, 113, 113, 0.1);
}

.zkill-tactical-stat.fleet {
    border-color: rgba(139, 92, 246, 0.6);
    background: rgba(139, 92, 246, 0.1);
}

.zkill-tactical-stat.solo {
    border-color: rgba(255, 71, 87, 0.6);
    background: rgba(255, 71, 87, 0.1);
}

.zkill-tactical-stat.mixed {
    border-color: rgba(0, 212, 255, 0.6);
    background: rgba(0, 212, 255, 0.1);
}

.zkill-tactical-icon {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    opacity: 0.9;
}

.zkill-tactical-value {
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
}

.zkill-tactical-label {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 500;
}

/* Playstyle Tags Section */
.zkill-playstyle-tags {
    margin-bottom: 1rem;
    padding: 0;
}

.zkill-tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
}

/* Threat Assessment - Risk profile prominence */
.zkill-threat-assessment {
    margin-bottom: 1.5rem;
}

.zkill-threat-grid {
    display: grid;
    grid-template-columns: auto 1.2fr 1fr;
    gap: 1.5rem;
    align-items: start;
}

.zkill-risk-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.5rem;
    border-radius: var(--radius-large);
    background: var(--white-05);
    border: 2px solid var(--white-1);
    min-width: 140px;
}

.zkill-risk-indicator.high {
    border-color: rgba(248, 113, 113, 0.8);
    background: rgba(248, 113, 113, 0.15);
    box-shadow: 0 0 20px rgba(248, 113, 113, 0.3);
}

.zkill-risk-indicator.low {
    border-color: rgba(74, 222, 128, 0.8);
    background: rgba(74, 222, 128, 0.15);
    box-shadow: 0 0 20px rgba(74, 222, 128, 0.3);
}

.zkill-risk-indicator.moderate {
    border-color: rgba(251, 191, 36, 0.8);
    background: rgba(251, 191, 36, 0.15);
    box-shadow: 0 0 20px rgba(251, 191, 36, 0.3);
}

.zkill-risk-icon {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.zkill-risk-level {
    font-size: 1rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
}

.zkill-risk-space {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.zkill-threat-details {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.zkill-threat-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem;
    background: var(--white-03);
    border-radius: var(--radius-medium);
}

.zkill-threat-label {
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.zkill-threat-value {
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.9rem;
}

.zkill-threat-value.increasing { color: var(--secondary-color); }
.zkill-threat-value.decreasing { color: var(--danger-color); }
.zkill-threat-value.stable { color: var(--warning-color); }

.zkill-threat-ship-sizes {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 200px;
}

.zkill-threat-subtitle {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
}

.zkill-specialization-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.75rem;
    background: linear-gradient(135deg, var(--white-05), var(--white-02));
    border: 1px solid var(--white-1);
    border-radius: var(--radius-medium);
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.zkill-spec-icon {
    font-size: 1rem;
}

.zkill-spec-text {
    color: var(--text-secondary);
}

.zkill-size-breakdown {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zkill-pref-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zkill-pref-bar {
    flex: 1;
    height: 20px;
    background: var(--white-05);
    border-radius: var(--radius-small);
    overflow: hidden;
    border: 1px solid var(--white-1);
}

.zkill-pref-fill {
    height: 100%;
    transition: width 0.3s ease;
    background: linear-gradient(90deg, var(--accent-primary), var(--accent-secondary));
}

.zkill-pref-fill.size-pod {
    background: linear-gradient(90deg, #95a5a6, #7f8c8d);
}

.zkill-pref-fill.size-shuttle {
    background: linear-gradient(90deg, #bdc3c7, #95a5a6);
}

.zkill-pref-fill.size-small {
    background: linear-gradient(90deg, #3498db, #2980b9);
}

.zkill-pref-fill.size-medium {
    background: linear-gradient(90deg, #9b59b6, #8e44ad);
}

.zkill-pref-fill.size-large {
    background: linear-gradient(90deg, #e67e22, #d35400);
}

.zkill-pref-fill.size-capital {
    background: linear-gradient(90deg, #e74c3c, #c0392b);
}

.zkill-pref-fill.size-supercapital {
    background: linear-gradient(90deg, #8e44ad, #6c3483);
}

.zkill-pref-info {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 120px;
}

.zkill-pref-category {
    font-size: 0.8rem;
    color: var(--text-primary);
    font-weight: 500;
}

.zkill-pref-percent {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-left: auto;
}

.zkill-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.65rem;
    border-radius: var(--radius-medium);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
    transition: all var(--transition-normal) ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.zkill-tag:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.zkill-tag-solo {
    background: linear-gradient(135deg, #e74c3c, #c0392b);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-solo-small {
    background: linear-gradient(135deg, #e67e22, #d35400);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-small-gang {
    background: linear-gradient(135deg, #f39c12, #e67e22);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-fleet-fc,
.zkill-tag-fleet {
    background: linear-gradient(135deg, #3498db, #2980b9);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-adaptable {
    background: linear-gradient(135deg, #9b59b6, #8e44ad);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-blob {
    background: linear-gradient(135deg, #34495e, #2c3e50);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-hvt-hunter {
    background: linear-gradient(135deg, #16a085, #1abc9c);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-multi-ship {
    background: linear-gradient(135deg, #27ae60, #229954);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-specialist {
    background: linear-gradient(135deg, #8e44ad, #71368a);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-capital {
    background: #f1c40f;
    background: linear-gradient(135deg, #f1c40f, #f39c12);
    color: #1a1a1a;
    border: 1px solid rgba(255, 215, 0, 0.4);
    font-weight: 600;
}

.zkill-tag-capital-hunter {
    background: #e74c3c;
    background: linear-gradient(135deg, #e74c3c, #9b59b6);
    color: white;
    border: 1px solid var(--white-3);
}

.zkill-tag-industrial-hunter {
    background: linear-gradient(135deg, #f39c12, #d35400);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-gate-camper {
    background: linear-gradient(135deg, #34495e, #2c3e50);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-blops {
    background: linear-gradient(135deg, #1a1a1a, #2c003e);
    color: white;
    border: 1px solid rgba(138, 43, 226, 0.4);
}

.zkill-tag-cyno {
    background: linear-gradient(135deg, #e74c3c, #c0392b);
    color: white;
    border: 1px solid var(--white-2);
}

.zkill-tag-capital-pilot {
    background: #f1c40f;
    background: linear-gradient(135deg, #f1c40f, #f39c12);
    color: #1a1a1a;
    border: 1px solid rgba(255, 215, 0, 0.4);
    font-weight: 600;
}

/* Activity Patterns */
.zkill-activity-patterns {
    margin-bottom: 1rem;
}

.zkill-patterns-layout {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.zkill-pattern-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.zkill-pattern-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    transition: all var(--transition-normal) ease;
}

.zkill-pattern-item:hover {
    background: var(--white-06);
    transform: translateY(-1px);
}

.zkill-pattern-icon {
    font-size: 1.5rem;
    opacity: 0.8;
}

.zkill-pattern-icon.trend-increasing { color: var(--secondary-color); }
.zkill-pattern-icon.trend-decreasing { color: var(--danger-color); }
.zkill-pattern-icon.trend-stable { color: var(--warning-color); }

.zkill-pattern-info {
    display: flex;
    flex-direction: column;
}

.zkill-pattern-value {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.1rem;
}

.zkill-pattern-label {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Combined Stats and Charts Section */
.zkill-stats-charts-combined {
    margin-bottom: 1.5rem;
}

.zkill-stats-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    align-items: start;
}

.zkill-stats-left {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    grid-auto-rows: min-content;
}

.zkill-activity-summary {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.zkill-charts-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.zkill-detail-group {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1.2rem;
    position: relative;
    overflow: hidden;
}

.zkill-detail-group::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    opacity: 0.6;
}

.zkill-detail-group.kills::before {
    background: var(--gradient-secondary);
}

.zkill-detail-group.losses::before {
    background: var(--gradient-danger);
}

.zkill-detail-header {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 1rem;
    text-align: center;
}

.zkill-detail-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--white-05);
}

.zkill-detail-item:last-child {
    border-bottom: none;
}

.zkill-detail-label {
    font-size: 0.85rem;
    color: var(--text-secondary);
}

.zkill-detail-value {
    font-size: 0.9rem;
    color: var(--text-primary);
    font-weight: 600;
}

/* ============================
Enhanced Analysis Sections
============================ */
/* Ship Analysis */
.zkill-analysis-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.zkill-analysis-card {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1.2rem;
    position: relative;
    overflow: hidden;
}

.zkill-analysis-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-primary);
    opacity: 0.6;
}

.zkill-analysis-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.zkill-analysis-title {
    font-size: 0.9rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.zkill-analysis-icon {
    font-size: 1.2rem;
    opacity: 0.8;
}

.zkill-specialization .zkill-spec-type {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.25rem;
}

.zkill-specialization .zkill-spec-focus {
    font-size: 0.9rem;
    color: var(--text-primary);
    margin-bottom: 0.5rem;
}

.zkill-specialization .zkill-spec-description {
    font-size: 0.8rem;
    color: var(--text-secondary);
    line-height: 1.4;
}

.zkill-diversity-score {
    font-size: 2rem;
    font-weight: 800;
    color: var(--secondary-color);
    margin-bottom: 0.25rem;
}

.zkill-diversity-label {
    font-size: 0.9rem;
    color: var(--text-primary);
    margin-bottom: 0.25rem;
}

.zkill-diversity-info {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

/* Breakdowns */
.zkill-breakdowns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    margin-top: 1.5rem;
}

.zkill-breakdown-section {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-medium);
    padding: 1rem;
}

.zkill-breakdown-title {
    font-size: 0.9rem;
    color: var(--text-primary);
    margin-bottom: 1rem;
    text-align: center;
    font-weight: 600;
}

.zkill-breakdown-item {
    display: grid;
    grid-template-columns: 1fr 2fr auto;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.zkill-breakdown-item:last-child {
    margin-bottom: 0;
}

.zkill-breakdown-label {
    font-size: 0.8rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.zkill-breakdown-bar {
    background: var(--white-1);
    border-radius: 10px;
    height: 8px;
    overflow: hidden;
}

.zkill-breakdown-fill {
    height: 100%;
    background: var(--gradient-primary);
    border-radius: 10px;
    transition: width 0.3s ease;
}

.zkill-breakdown-fill.tech-t1 { background: linear-gradient(90deg, #4ade80, #22c55e); }
.zkill-breakdown-fill.tech-t2 { background: linear-gradient(90deg, #f59e0b, #d97706); }
.zkill-breakdown-fill.tech-faction { background: linear-gradient(90deg, #8b5cf6, #7c3aed); }
.zkill-breakdown-fill.tech-t3 { background: linear-gradient(90deg, #ef4444, #dc2626); }

/* Ship size specific colors */
.zkill-breakdown-fill[style*="width"]:not([class*="tech-"]) { background: var(--gradient-primary); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Small")) .zkill-breakdown-fill { background: linear-gradient(90deg, #10b981, #059669); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Medium")) .zkill-breakdown-fill { background: linear-gradient(90deg, #3b82f6, #2563eb); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Large")) .zkill-breakdown-fill { background: linear-gradient(90deg, #f59e0b, #d97706); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Capital")) .zkill-breakdown-fill { background: linear-gradient(90deg, #ef4444, #dc2626); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Industrial")) .zkill-breakdown-fill { background: linear-gradient(90deg, #6b7280, #4b5563); }
.zkill-breakdown-item:has(.zkill-breakdown-label:contains("Pod")) .zkill-breakdown-fill { background: linear-gradient(90deg, #8b5cf6, #7c3aed); }

.zkill-breakdown-value {
    font-size: 0.8rem;
    color: var(--primary-color);
    font-weight: 600;
    text-align: right;
}

/* Combat Style */
.zkill-combat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.zkill-combat-card {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1rem;
    text-align: center;
    transition: all var(--transition-medium) ease;
    position: relative;
    overflow: hidden;
}

.zkill-combat-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-secondary);
    opacity: 0.6;
}

.zkill-combat-card:hover {
    transform: translateY(-2px);
    background: var(--white-06);
    border-color: rgba(74, 222, 128, 0.3);
}

.zkill-combat-icon {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    opacity: 0.8;
}

.zkill-combat-label {
    font-size: 0.8rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    font-weight: 500;
}

.zkill-combat-value {
    font-size: 0.9rem;
    color: var(--text-primary);
    font-weight: 600;
}

/* Activity Insights */
.zkill-insights-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.zkill-insight-card {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1rem;
    text-align: center;
    transition: all var(--transition-medium) ease;
    position: relative;
    overflow: hidden;
}

.zkill-insight-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-warning);
    opacity: 0.6;
}

.zkill-insight-card:hover {
    transform: translateY(-2px);
    background: var(--white-06);
    border-color: rgba(251, 191, 36, 0.3);
}

.zkill-insight-icon {
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    opacity: 0.8;
}

.zkill-insight-icon.trend-increasing { color: var(--secondary-color); }
.zkill-insight-icon.trend-decreasing { color: var(--danger-color); }
.zkill-insight-icon.trend-stable { color: var(--warning-color); }

.zkill-insight-label {
    font-size: 0.8rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    font-weight: 500;
}

.zkill-insight-value {
    font-size: 0.9rem;
    color: var(--text-primary);
    font-weight: 600;
}

/* Security Preference */
.zkill-security-profile {
    background: var(--white-03);
    border: 1px solid var(--white-1);
    border-radius: var(--radius-large);
    padding: 1.2rem;
}

.zkill-security-summary {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--white-1);
}

.zkill-security-primary, .zkill-security-risk {
    font-size: 0.9rem;
    color: var(--text-secondary);
}

.zkill-security-primary strong, .zkill-security-risk strong {
    color: var(--primary-color);
}

.zkill-security-breakdown {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.zkill-security-item {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 1rem;
}

.zkill-security-space {
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.25rem 0.6rem;
    border-radius: var(--radius-small);
    min-width: 70px;
    text-align: center;
}

.zkill-security-space.highsec {
    background: rgba(74, 222, 128, 0.2);
    color: var(--secondary-color);
}

.zkill-security-space.lowsec {
    background: rgba(251, 191, 36, 0.2);
    color: var(--warning-color);
}

.zkill-security-space.nullsec {
    background: rgba(248, 113, 113, 0.2);
    color: var(--danger-color);
}

.zkill-security-space.w-space {
    background: rgba(139, 92, 246, 0.2);
    color: #8b5cf6;
}

.zkill-security-bar {
    background: var(--white-1);
    border-radius: 10px;
    height: 8px;
    overflow: hidden;
    flex: 1;
}

.zkill-security-fill {
    height: 100%;
    border-radius: 10px;
    transition: width 0.3s ease;
}

.zkill-security-fill.highsec { background: linear-gradient(90deg, #4ade80, #22c55e); }
.zkill-security-fill.lowsec { background: linear-gradient(90deg, #fbbf24, #f59e0b); }
.zkill-security-fill.nullsec { background: linear-gradient(90deg, #f87171, #ef4444); }
.zkill-security-fill.w-space { background: linear-gradient(90deg, #8b5cf6, #7c3aed); }

.zkill-security-percentage {
    font-size: 0.8rem;
    color: var(--primary-color);
    font-weight: 600;
    min-width: 35px;
    text-align: right;
}

.zkill-security-kills {
    font-size: 0.75rem;
    color: var(--text-secondary);
    min-width: 60px;
    text-align: right;
}

/* Small screens */
@media (max-width: 480px) {
.zkill-modal-backdrop { padding: 0.5rem; }
.zkill-stats-card { margin: 0.5rem; max-height: calc(95vh - 1rem); }
.zkill-header-controls { top: -8px; right: -8px; gap: 4px; }
.zkill-close-btn { width: 28px; height: 28px; font-size: 12px; }
.zkill-back-btn { width: 24px; height: 24px; font-size: 10px; }
.zkill-stats-grid { grid-template-columns: 1fr; }
.zkill-stats-grid-single-row { grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
.zkill-entity-avatar { width: 48px; height: 48px; }
.zkill-entity-details h2 { font-size: 1.2rem; flex-direction: column; gap: 0.25rem; }

.zkill-activity-grid { grid-template-columns: 1fr; }
.zkill-activity-card { padding: 0.8rem; }
.zkill-activity-number { font-size: 1.2rem; }
.zkill-activity-icon { font-size: 1.3rem; }

.zkill-ship-card { padding: 0.6rem; min-height: 50px; }
.zkill-ship-name { font-size: 0.85rem; }
.zkill-ship-group { font-size: 0.7rem; }
.zkill-ship-icon { width: 28px; height: 28px; }
.zkill-player-card { padding: 0.6rem; min-height: 50px; }
.zkill-player-portrait { width: 40px; height: 40px; }
.zkill-player-name { font-size: 0.85rem; }
.zkill-player-kills { font-size: 0.7rem; }
.zkill-location-card { padding: 0.6rem; min-height: 50px; }
.zkill-location-name { font-size: 0.9rem; }
.zkill-location-security { padding: 0.15rem 0.4rem; font-size: 0.7rem; border-radius: 10px; }
.zkill-location-summary { padding: 0.6rem; gap: 0.6rem; }
.zkill-location-stat-label { font-size: 0.7rem; }
.zkill-location-stat-value { font-size: 1rem; }
.zkill-location-detail-card { padding: 0.6rem 0.8rem; }
.zkill-location-system-name { font-size: 0.85rem; }
.zkill-location-sec-badge { font-size: 0.7rem; padding: 0.15rem 0.4rem; }
.zkill-location-kills-count { font-size: 0.8rem; }

.zkill-affiliation-item { padding: 0.4rem 0.6rem; max-width: 240px; }
.zkill-affiliation-logo { width: 24px; height: 24px; }
.zkill-affiliation-link { font-size: 0.75rem; }
.zkill-affiliation-label { font-size: 0.65rem; }

.zkill-chart { width: 100%; height: 150px; }
.zkill-chart-container { padding: 0.6rem; }

.zkill-top10-grid { gap: 0.8rem; }
.zkill-top10-column { padding: 0.6rem; }
.zkill-top10-column-title { font-size: 0.85rem; }
.zkill-top10-item { padding: 0.4rem; gap: 0.5rem; }
.zkill-top10-icon { width: 28px; height: 28px; }
.zkill-top10-portrait { width: 28px; height: 28px; }
.zkill-top10-name { font-size: 0.8rem; }
.zkill-top10-value { font-size: 0.7rem; }

.zkill-kill-item { flex-direction: column; align-items: stretch; gap: 0.75rem; }
.zkill-kill-link { text-align: center; }

/* Reorganized layout mobile */
.zkill-tactical-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
.zkill-tactical-stat { padding: 0.8rem; }
.zkill-tactical-value { font-size: 1.2rem; }

.zkill-threat-grid { grid-template-columns: 1fr; gap: 1rem; text-align: center; }
.zkill-risk-indicator { min-width: auto; padding: 1rem; }

.zkill-prefs-layout { grid-template-columns: 1fr; gap: 1rem; }
.zkill-pattern-summary { grid-template-columns: 1fr; gap: 0.8rem; }
.zkill-pattern-item { padding: 0.8rem; }

.zkill-stats-row { grid-template-columns: 1fr; gap: 1rem; }
.zkill-stats-left { grid-template-columns: 1fr; }
.zkill-detail-group { padding: 1rem; }
.zkill-activity-summary { grid-template-columns: 1fr; gap: 0.8rem; }
.zkill-charts-row { grid-template-columns: 1fr; }

/* Enhanced sections mobile */
.zkill-analysis-grid { grid-template-columns: 1fr; gap: 0.8rem; }
.zkill-analysis-card { padding: 1rem; }
.zkill-breakdowns { grid-template-columns: 1fr; gap: 1rem; }
.zkill-combat-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
.zkill-insights-grid { grid-template-columns: repeat(2, 1fr); gap: 0.8rem; }
.zkill-security-summary { flex-direction: column; gap: 0.5rem; }
.zkill-security-item { grid-template-columns: auto 1fr auto; gap: 0.5rem; }
.zkill-security-kills { display: none; }
}