/* Shared design tokens ported from the Nuxt theme. preferences.js applies
   supported ek_theme cookie values before first paint. Interactive styles
   below use these tokens, including color-mix() for translucent accents. */

:root {
    /* Brand colors */
    --color-brand-primary: #3b82f6;
    --color-brand-primary-hover: #2563eb;
    --color-brand-secondary: #10b981;
    --color-brand-accent: #00aaff;

    /* Text Colors */
    --color-text-primary: #ffffff;
    --color-text-secondary: #9ca3af;
    --color-text-tertiary: #6b7280;
    --color-text-muted: var(--color-text-tertiary);
    --color-text-inverse: #111827;

    /* Background Colors */
    --color-bg-primary: #111827;
    --color-bg-secondary: rgba(26, 26, 26, 0.8);
    --color-bg-tertiary: #1f2937;
    --color-bg-hover: rgba(45, 45, 45, 0.6);

    /* Border Colors */
    --color-border-light: rgba(75, 85, 99, 0.2);
    --color-border-medium: #374151;
    --color-border-dark: #4b5563;
    --color-border-focus: #3b82f6;
    --color-border-focus-light: rgba(59, 130, 246, 0.1);
    --color-border: #2d3748;
    --color-border-alpha: var(--color-border-light);

    /* Surface Colors */
    --color-surface-alpha: rgba(26, 26, 26, 0.5);
    --color-surface-hover: #374151;
    --color-surface-dark-alpha-85: rgba(26, 32, 44, 0.85);

    /* Overlay Colors */
    --color-overlay-dark: rgba(26, 26, 26, 0.4);
    --color-overlay: rgba(0, 0, 0, 0.5);

    /* Gray Scale */
    --color-gray-50: var(--color-text-primary);
    --color-gray-100: var(--color-text-primary);
    --color-gray-200: var(--color-text-primary);
    --color-gray-300: var(--color-text-primary);
    --color-gray-400: var(--color-text-secondary);
    --color-gray-500: var(--color-text-secondary);
    --color-gray-600: var(--color-text-tertiary);
    --color-gray-700: var(--color-border-medium);
    --color-gray-800: var(--color-bg-tertiary);
    --color-gray-900: var(--color-bg-primary);

    /* Status Colors */
    --color-success: #10b981;
    --color-warning: #f59e0b;
    --color-error: #ef4444;
    --color-danger: #ef4444;
    --color-info: #3b82f6;

    /* EVE Security Status Colors */
    --color-highsec: #2f75fe;
    --color-lowsec: #f9a825;
    --color-nullsec: #d32f2f;

    /* Kill/Loss Colors */
    --color-loss-bg: rgba(80, 0, 0, 0.6);
    --color-loss-hover: rgba(90, 0, 0, 0.65);
    --color-loss-border: rgba(139, 46, 46, 0.8);

    /* Content-specific Colors — mapped to custom Tailwind utilities via @theme */
    --color-isk-value: #4ade80;         /* ISK amounts — text-isk */
    --color-npc-text: #fcd34d;          /* NPC names — text-npc */
    --color-selection-bg: #3b82f6;      /* ::selection background */
    --color-selection-text: #ffffff;    /* ::selection text */

    /* Spacing Scale */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;

    /* Typography */
    --text-2xs: 0.65rem;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;

    /* Font Weights */
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;

    /* Border Radius */
    --radius-sm: 0.125rem;
    --radius-base: 0.25rem;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.3);
    --shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 2px 0 rgba(0, 0, 0, 0.12);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.2), 0 4px 6px -2px rgba(0, 0, 0, 0.1);

    /* Z-Index Scale */
    --z-dropdown: 10;
    --z-sticky: 20;
    --z-header: 30;
    --z-modal: 40;
    --z-popover: 50;
    --z-overlay: 70;
    --z-maximum: 9999;

    /* Layout */
    --max-width-content: 85rem;
    --max-width-inner: 84rem;

    /* Scrollbar */
    --scrollbar-width: 10px;
    --scrollbar-border-radius: 8px;
    --scrollbar-thumb-color: var(--color-brand-primary);
}

/* Body & HTML - Base structure and background */

html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Exo 2', 'Exo 2 Fallback', 'Exo 2 Roboto Fallback', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 1em;
    color: var(--color-text-primary);
}

html {
    background-color: black !important;
    /* Set via style.setProperty by the background picker / domain scripts */
    --site-bg: image-set(url('/assets/b0ed33ec1b2da5ae/backgrounds/bg2.avif') type('image/avif'), url('/assets/b0ed33ec1b2da5ae/backgrounds/bg2.webp') type('image/webp'));
    position: relative;
    min-height: 100%;
    overflow-y: auto;
}

/* Fixed-position background layer. Visually identical to
   background-attachment: fixed, but that property forces Chrome to repaint
   the full viewport image on every scroll frame (fixed-attachment backgrounds
   can't live on the GPU scroll layer), which flickers under rapid scrolling —
   a position:fixed layer is composited once instead. */
html::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    background-image: var(--site-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    pointer-events: none;
}


body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;
    z-index: 1;
    background-color: transparent;
    padding-right: 0 !important;
}


/* Fix for mobile - no horizontal scrolling */
@media (max-width: 767px) {
    html,
    body {
        max-width: 100vw;
    }
}

/* Layout System - Content container and structural patterns */

/*
 * --content-alpha-scale multiplies the opacity of both panel layers, letting a
 * custom killboard dial how much of its background image shows through. It is
 * a scale rather than a raw alpha so the unset default (1) reproduces the two
 * hand-tuned values below exactly; the layout sets it inline on .content and
 * .inner-content inherits it.
 */

/* Content Container */
.content {
    position: relative;
    z-index: 2;
    max-width: var(--max-width-content);
    background-color: color-mix(in srgb, var(--theme-surface-primary, #0f0f0f) calc(85% * var(--content-alpha-scale, 1)), transparent) !important;
    padding: 0 5px 0 5px;
    width: 100%;
    box-sizing: border-box;
    min-height: 100vh;
    height: auto;
    overflow: visible;
    display: flex;
    flex-direction: column;
    margin: 0 auto;

    /* Edge fade effect */
    -webkit-mask: linear-gradient(
        to right,
        transparent 0px,
        black 40px,
        black calc(100% - 40px),
        transparent 100%
    );
    mask: linear-gradient(
        to right,
        transparent 0px,
        black 40px,
        black calc(100% - 40px),
        transparent 100%
    );
}

/* Transparent-banner mode: a killboard with no banner image that still wants
   a header block.

   Two layers paint the panel, and both have to give way or the bleed only half
   works — .inner-content carries its own near-opaque black and is what
   produced a hard horizontal line under the header.

   The geometry both ramps are pinned to: the header strip is 160px tall
   (pt-20 + a 4rem logo + pb-4) and .main-content adds 24px, so the first panel
   starts 184px down. The fade therefore has to be *finished* by ~180px — a few
   px clear of that panel — and run the same 40px the left and right edges fade
   over, so it opens at 140px.

   It takes both layers to draw that. .inner-content begins where the strip
   ends, 160px down, so it can only cover the last 20px; .content spans the
   whole page and covers the full 140–180px. Anything that finishes lower than
   the panel keeps fading behind it, which is what made earlier attempts look
   like a smudge rather than an edge. */
.content--bleed {
    background-color: transparent !important;
    background-image: linear-gradient(
        to bottom,
        transparent 0,
        transparent 8.75rem,
        color-mix(in srgb, var(--theme-surface-primary, #0f0f0f) calc(85% * var(--content-alpha-scale, 1)), transparent) 11.25rem
    );
}

.content--bleed .inner-content {
    background: linear-gradient(
        to bottom,
        transparent 0,
        color-mix(in srgb, var(--theme-surface-primary, #000) calc(90% * var(--content-alpha-scale, 1)), transparent) 20px
    );
}

/* Persistent blur layer. Standalone fixed <div> (not a pseudo-element on a
   transitioning parent) so it paints continuously across navigations without
   requiring a named view-transition group — a named group would render on top
   of the root snapshot and blur the whole page during the crossfade. */
.content-blur {
    position: fixed;
    inset: 0;
    z-index: 1;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    pointer-events: none;
    -webkit-mask: linear-gradient(
        to right,
        transparent 0px,
        black 60px,
        black calc(100% - 60px),
        transparent 100%
    );
    mask: linear-gradient(
        to right,
        transparent 0px,
        black 60px,
        black calc(100% - 60px),
        transparent 100%
    );
    max-width: var(--max-width-content);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}

.inner-content {
    max-width: var(--max-width-inner);
    margin: 0 auto;
    height: auto;
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    overflow: visible;
    padding: 0 5px 0 5px;
    background: color-mix(in srgb, var(--theme-surface-primary, #000) calc(90% * var(--content-alpha-scale, 1)), transparent);
    box-sizing: border-box;
    position: relative;

    /* Inner edge fade */
    -webkit-mask: linear-gradient(
        to right,
        transparent 0px,
        black 40px,
        black calc(100% - 40px),
        transparent 100%
    );
    mask: linear-gradient(
        to right,
        transparent 0px,
        black 40px,
        black calc(100% - 40px),
        transparent 100%
    );
}

.main-content {
    flex: 1;
    padding: 4.5rem 3rem 1.25rem 3rem;
    width: 100%;
    overflow: visible;
    box-sizing: border-box;
}

/* Shared hero atmosphere. Route headers have different content needs (plain
   page title, entity identity, killmail summary, account banner), but they all
   sit on the same subtle brand wash and contour motif. */
.hero-surface {
    position: relative;
    isolation: isolate;
}

.hero-surface::before,
.hero-surface::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.hero-surface::before {
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(circle at 0 0, color-mix(in srgb, var(--color-brand-primary) 10%, transparent), transparent 44%),
        radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--color-brand-secondary) 6%, transparent), transparent 40%);
}

.hero-surface::after {
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    background: radial-gradient(circle at calc(100% - 9rem) 2rem,
        transparent 0, transparent calc(8rem - 1px),
        rgba(255, 255, 255, 0.035) 8rem, transparent calc(8rem + 1px),
        transparent calc(10.75rem - 1px), rgba(255, 255, 255, 0.025) 10.75rem,
        transparent calc(10.75rem + 1px), transparent calc(13.5rem - 1px),
        rgba(255, 255, 255, 0.018) 13.5rem, transparent calc(13.5rem + 1px));
}

/* Responsive */
@media (min-width: 768px) {
    .inner-content {
        padding-right: 25px;
        padding-left: 25px;
    }
}

@media (max-width: 767px) {
    .content,
    .inner-content {
        -webkit-mask: none;
        mask: none;
    }

    .content {
        padding: 0;
    }

    /* Disable the fixed backdrop-filter overlay on mobile —
       iOS Safari bug: backdrop-filter + pointer-events:none still
       intercepts touch events on <button> elements */
    .content-blur {
        display: none;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    /* Kill ALL fixed/absolute backdrop-filter on mobile —
       iOS Safari compositing bug intercepts touch events even
       through pointer-events:none and sometimes display:none */
    *,
    *::before,
    *::after {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    .inner-content {
        padding: 0;
    }

    .main-content {
        padding: 3.25rem 0.5rem 1.25rem 0.5rem;
    }
}

/* Footer positioning — bottom padding clears the fixed news ticker */
.site-footer {
    margin-bottom: 0;
    padding-bottom: 2rem;
    width: 100%;
    box-sizing: border-box;
    margin-top: auto !important;
}

/* Exo 2 — geometric/tech font similar to EVE's Shentox */
@font-face {
    font-family: 'Exo 2';
    src: url('/assets/b0ed33ec1b2da5ae/fonts/Exo2-Variable.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* Latin (including combining marks), punctuation and symbols cover the interface and most pilot names.
   Other scripts still use the complete original font above. */
@font-face {
    font-family: 'Exo 2';
    src: url('/assets/b0ed33ec1b2da5ae/fonts/Exo2-Latin-v1.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-036F, U+2000-23FF;
}

/* Match Arial's average Latin width to Exo 2 at weight 400 (97.0577%).
   Exo 2's 999/201/0 vertical metrics are divided by that adjustment.
   This keeps wrapped metadata and normal line boxes closer during the swap. */
@font-face {
    font-family: 'Exo 2 Fallback';
    src: local('Arial');
    size-adjust: 97.0577%;
    ascent-override: 102.9285%;
    descent-override: 20.7093%;
    line-gap-override: 0%;
}

/* Android normally provides Roboto rather than Arial. */
@font-face {
    font-family: 'Exo 2 Roboto Fallback';
    src: local('Roboto');
    size-adjust: 99.3148%;
    ascent-override: 100.5893%;
    descent-override: 20.2387%;
    line-gap-override: 0%;
}

/* Go shell. Measurements follow Navbar.vue, Footer.vue and PageHeader.vue. */
* { box-sizing:border-box; scrollbar-width:thin; scrollbar-color:var(--scrollbar-thumb-color) transparent; }
::-webkit-scrollbar { width:var(--scrollbar-width); }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background-color:var(--scrollbar-thumb-color); border-radius:var(--scrollbar-border-radius); }
html { color-scheme:dark; scrollbar-gutter:stable; scrollbar-width:thin; scroll-behavior:smooth; }
body { -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; line-height:1.5; }
/* The body is a flex column. A fixed 100% height lets its masked children
   shrink to one viewport, clipping long killlists during page scroll. */
body { height:auto; }
.content,.inner-content { flex-shrink:0; }
:where(h1,h2,h3,p) { margin:0; }
a { color:inherit; text-decoration:none; }
button,input,select,summary { font:inherit; }
input,textarea { caret-color:var(--color-brand-primary); }
button { color:inherit; border:0; background:none; cursor:pointer; }
button,a,summary { touch-action:manipulation; }
summary { cursor:pointer; list-style:none; }
summary::-webkit-details-marker { display:none; }
input,select { color:inherit; accent-color:var(--color-brand-primary); }
:focus-visible { outline:2px solid var(--color-brand-primary); outline-offset:3px; }
::selection { background:color-mix(in srgb,var(--color-selection-bg) 40%,transparent); color:var(--color-selection-text); }
.icon { width:18px; height:18px; flex:none; vertical-align:middle; }
.glass-panel { border-radius:8px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.navbar { position:fixed; inset:0 0 auto; height:64px; z-index:50; display:flex; justify-content:center; }
.nav-backdrop { position:absolute; inset:0; width:100%; max-width:var(--max-width-content); margin:auto; background:linear-gradient(color-mix(in srgb,var(--theme-surface-primary,#000) 60%,transparent),color-mix(in srgb,var(--theme-surface-primary,#000) 33.333%,transparent),transparent); backdrop-filter:blur(2px); mask-image:linear-gradient(to right,transparent,black 15%,black 85%,transparent); }
.navbar.scrolled .nav-backdrop { background:color-mix(in srgb,var(--theme-surface-primary,#000) 73.333%,transparent); backdrop-filter:blur(24px); }
.nav-inner { position:relative; width:100%; max-width:80rem; margin:auto; padding:0 16px; display:flex; align-items:center; justify-content:space-between; height:100%; }
.nav-left { display:flex; flex:none; align-items:center; gap:4px; }
.nav-search { display:flex; flex:1; min-width:0; justify-content:center; margin:0 8px; }
.desktop-links,.desktop-actions { display:flex; align-items:center; flex-shrink:0; gap:4px; }
.desktop-actions { gap:2px; }
.nav-button { display:flex; height:40px; align-items:center; gap:8px; border-radius:8px; padding:0 12px; font-size:16px; font-weight:500; color:color-mix(in srgb,var(--color-text-primary) 80.000%,transparent); white-space:nowrap; }
.nav-button .icon:last-child:not(:first-child) { width:14px; height:14px; opacity:.6; }
.nav-button:hover,.icon-button:hover,details[open]>summary { background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); }
.nav-dropdown.info-dropdown[open]>summary { background:transparent; color:color-mix(in srgb,var(--color-text-primary) 60.000%,transparent); }
.nav-dropdown.info-dropdown[open]>summary:hover { background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); }
.icon-button { display:flex; align-items:center; justify-content:center; width:36px; height:40px; border-radius:8px; color:color-mix(in srgb,var(--color-text-primary) 60.000%,transparent); }
.search-trigger { display:flex; align-items:center; justify-content:center; gap:12px; height:40px; width:40px; flex-shrink:0; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); border-radius:8px; color:var(--color-text-secondary); font-size:16px; }
.search-trigger:hover { color:var(--color-brand-primary); border-color:color-mix(in srgb,var(--color-text-primary) 14.902%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); }
.search-trigger span { flex:1; text-align:left; }
.search-trigger span,.search-trigger kbd,.home-link span,.secondary-link { display:none; }
kbd { font-family:inherit; font-size:12px; font-weight:500; padding:0 4px; min-width:20px; height:20px; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:2px; background:color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); }
.nav-dropdown { position:relative; }
.dropdown-panel { position:absolute; top:calc(100% + 8px); left:0; padding:8px; min-width:220px; max-height:calc(100dvh - 88px); overflow:auto; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:12px; background-color:rgba(20,20,20,.9); background-image:radial-gradient(circle at 12% 0%,color-mix(in srgb,var(--color-brand-primary) 9%,transparent),transparent 34%),radial-gradient(circle at 88% 100%,rgba(99,102,241,.07),transparent 38%); backdrop-filter:blur(24px); box-shadow:0 20px 60px #0009; }
.dropdown-panel.align-right { left:auto; right:0; }
.mega-menu { position:fixed; top:64px; left:50%; transform:translateX(-50%); width:min(calc(var(--max-width-inner) - 5rem),calc(100vw - 3rem)); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; padding:20px; }
.explore-menu { width:480px; }
.explore-menu .menu-group { display:grid; grid-template-columns:1fr 1fr; }
.explore-menu h3 { display:none; }
.explore-menu .menu-link { padding:10px 12px; font-size:16px; }
.mega-menu .menu-group { padding:0 8px; }
.mega-menu .menu-group h3 { border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); padding:0 4px 8px; margin-bottom:4px; color:color-mix(in srgb,var(--color-brand-primary) 80%,transparent); letter-spacing:.15em; }
.mega-menu .menu-link { padding:2px 8px; line-height:20px; }
.menu-group h3,.background-picker h3 { padding:8px 12px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.14em; color:var(--color-text-secondary); }
.menu-link { display:flex; align-items:center; gap:10px; width:100%; padding:8px 12px; border-radius:8px; font-size:14px; color:var(--color-text-secondary); text-align:left; }
.menu-link .icon { width:16px; height:16px; color:color-mix(in srgb,var(--color-brand-primary) 70%,transparent); }
.menu-link:hover { background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); }
.background-picker,.login-panel { width:288px; padding:16px; }
.dropdown-panel h2,.login-panel h2 { font-size:16px; font-weight:500; color:var(--color-text-primary); }
.dropdown-panel p { font-size:12px; color:var(--color-text-secondary); }
.background-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.background-grid button { padding:0; overflow:hidden; border:2px solid transparent; border-radius:8px; aspect-ratio:16/9; }
.background-grid button:hover { border-color:color-mix(in srgb,var(--color-text-primary) 20.000%,transparent); }
.background-grid button[aria-pressed=true] { border-color:var(--color-brand-primary); }
.background-grid img { width:100%; height:100%; object-fit:cover; }
.login-form { display:grid; gap:12px; margin-top:16px; }
.login-form label { display:flex; align-items:center; gap:8px; color:var(--color-text-primary); font-size:14px; }
.login-form input { width:16px; height:16px; }
.login-form select { margin-left:auto; background:var(--theme-surface-primary,#171717); border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:4px; }
.sso-button { padding:0; }
.sso-button img { display:block; width:100%; height:auto; }
.login-form .login-error { color:var(--color-error); }
.mobile-navigation { display:none; }
.mobile-navigation:not([open]) .mobile-panel { display:none; }
.page-header { display:flex; gap:12px; padding:20px; position:relative; overflow:hidden; }
.page-header>div { position:relative; z-index:1; }
.page-header-icon { width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:8px; border:1px solid color-mix(in srgb,var(--color-brand-primary) 15%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); color:var(--color-brand-primary); }
.page-header h1 { font-size:20px; font-weight:700; }
.page-header p { margin-top:6px; font-size:16px; color:var(--color-text-secondary); }
.page-header .eyebrow { margin:0; font-size:12px; letter-spacing:.16em; color:color-mix(in srgb,var(--color-brand-primary) 70%,transparent); }
.return-link { display:inline-block; margin-top:16px; color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); }
.info-page { width:100%; }
.info-page>.page-header { margin-bottom:16px; }
.info-page .page-header p { font-size:14px; line-height:1.625; }
.info-panel { padding:24px; }
.info-sections { display:grid; gap:32px; }
.info-sections h2 { margin-bottom:12px; color:var(--color-text-primary); font-size:24px; line-height:1.33; font-weight:700; }
.info-sections p { color:var(--color-text-primary); line-height:1.625; }
.info-sections p a { color:var(--color-brand-accent); font-weight:500; }
.info-sections p a:hover { text-decoration:underline; opacity:.9; }
.info-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; padding-top:16px; }
.info-action { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 24px; border-radius:8px; font-size:14px; font-weight:500; color:#fff; }
.info-action .icon { width:20px; height:20px; }
.info-action-discord { background:#5865f2; }
.info-action-discord:hover { background:#4752c4; }
.info-action-github { background:#374151; }
.info-action-github:hover { background:#4b5563; }
.donate-page { color:var(--color-text-secondary); }
.donate-intro,.donate-thanks { text-align:center; line-height:1.625; }
.donate-intro { margin-bottom:16px; }
.donate-note { margin-bottom:38px; padding:8px 16px; border-left:4px solid var(--color-brand-primary); border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.donate-note p { font-size:14px; line-height:1.625; color:var(--color-text-primary); }
.donate-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-bottom:32px; }
.donate-option { display:flex; flex-direction:column; align-items:center; min-height:278px; padding:24px; border:1px solid #374151; border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.donate-option:hover { border-color:color-mix(in srgb,var(--color-brand-primary) 50%,transparent); }
.donate-option>.icon { width:16px; height:16px; margin-bottom:16px; color:color-mix(in srgb,var(--color-brand-primary) 75%,var(--color-text-primary)); }
.donate-option h2 { margin-bottom:8px; color:var(--color-text-primary); font-size:20px; font-weight:600; }
.donate-option p { flex:1; margin-bottom:16px; text-align:center; color:var(--color-text-secondary); font-size:14px; line-height:1.625; }
.donate-option a { display:block; width:100%; padding:12px 16px; border-radius:8px; background:var(--color-brand-primary-hover); text-align:center; color:var(--color-text-primary); font-size:14px; font-weight:500; }
.donate-option a:hover { background:var(--color-brand-primary); }
.donate-option a.donate-kofi { background:#db2777; }
.donate-option a.donate-kofi:hover { background:#ec4899; }
.faq-panel { padding:8px; }
.faq-item + .faq-item { border-top:1px solid #37415180; }
.faq-item summary { display:flex; justify-content:space-between; align-items:center; gap:12px; width:100%; padding:20px 12px; text-align:left; }
.faq-item summary:hover { background:color-mix(in srgb,var(--color-text-primary) 1.961%,transparent); }
.faq-question { display:flex; align-items:center; gap:12px; min-width:0; color:var(--color-text-primary); font-size:18px; font-weight:500; }
.faq-question>.icon { width:20px; height:20px; color:color-mix(in srgb,var(--color-brand-primary) 75%,var(--color-text-primary)); }
.faq-item summary>.icon { width:20px; height:20px; color:var(--color-text-secondary); transition:transform .2s; }
.faq-item[open] summary>.icon { transform:rotate(180deg); }
.faq-answer { padding:0 12px 20px 44px; color:var(--color-text-primary); line-height:1.625; }
.faq-answer p + p { margin-top:12px; }
.faq-answer a { color:var(--color-brand-primary); font-weight:500; }
.faq-answer a:hover { text-decoration:underline; opacity:.9; }
.categories-page { width:100%; }
.categories-header { margin-bottom:24px; background:linear-gradient(90deg,#080a0ff0 0%,#080a0fe6 52%,#080a0fd5 100%),url('/assets/b0ed33ec1b2da5ae/category-header.webp') center/cover; }
.categories-header .eyebrow { margin:0; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.16em; }
.categories-header h1 { margin-top:2px; }
.categories-header>div { min-width:0; flex:1; }
.categories-header>div>p:not(.eyebrow) { max-width:48rem; font-size:14px; line-height:1.625; }
.categories-meta { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; padding-top:12px; border-top:1px solid color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); font-size:12px; color:var(--color-text-secondary); }
.categories-meta span { padding:6px 10px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:4px; background:color-mix(in srgb,var(--theme-surface-primary,#000) 20.000%,transparent); }
.categories-meta strong { color:var(--color-text-primary); }
.category-search { position:relative; max-width:36rem; margin-bottom:30px; }
.category-search>.icon { position:absolute; top:50%; left:12px; transform:translateY(-50%); width:14px; height:14px; color:var(--color-text-secondary); }
.category-search input { width:100%; padding:10px 12px 10px 36px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; outline:none; background:color-mix(in srgb,var(--color-text-primary) 3.137%,transparent); color:var(--color-text-primary); font-size:14px; }
.category-search input::placeholder { color:var(--color-text-secondary); }
.category-search input:focus { border-color:color-mix(in srgb,var(--color-brand-primary) 40%,transparent); }
.category-groups { display:grid; gap:28px; }
.category-group-heading { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.category-group-heading img { width:40px; height:40px; object-fit:cover; border-radius:8px; background:var(--theme-surface-primary,#111827); box-shadow:0 0 0 1px color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); }
.category-group-title { display:flex; align-items:center; gap:8px; }
.category-group-title .icon { width:14px; height:14px; color:var(--color-brand-primary); }
.category-group-title h2 { color:var(--color-text-primary); font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.14em; }
.category-group-count { color:var(--color-text-secondary); font-size:11px; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.category-card { display:flex; flex-direction:column; gap:12px; padding:16px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 1.961%,transparent); }
.category-card:hover { border-color:color-mix(in srgb,var(--color-brand-primary) 20%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 3%,transparent); }
.category-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.category-card h3 { color:var(--color-text-primary); font-size:14px; font-weight:600; }
.category-card:hover h3 { color:color-mix(in srgb,var(--color-brand-primary) 45%,var(--color-text-primary)); }
.category-card code { color:color-mix(in srgb,var(--color-brand-primary) 70%,transparent); font-size:11px; }
.category-card-head>span { flex:none; color:var(--color-text-secondary); font-size:12px; font-variant-numeric:tabular-nums; }
.category-card>p { flex:1; color:var(--color-text-secondary); font-size:12px; line-height:1.625; }
.category-actions { display:flex; flex-wrap:wrap; gap:8px; }
.category-actions a { padding:6px 10px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.137%,transparent); color:var(--color-text-primary); font-size:12px; }
.category-actions a:hover { border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); color:var(--color-text-primary); }
.category-actions a.category-advanced { border-color:color-mix(in srgb,var(--color-brand-primary) 20%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 40%,var(--color-text-primary)); }
.category-actions a.category-advanced:hover { background:color-mix(in srgb,var(--color-brand-primary) 14%,transparent); }
.category-empty { padding:32px; text-align:center; color:var(--color-text-secondary); font-size:14px; }
.categories-page [hidden] { display:none!important; }
.tools-page { width:100%; }
.tools-header { margin-bottom:24px; }
.tools-header .eyebrow { margin:0; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.16em; }
.tools-header h1 { margin-top:2px; }
.tools-header>div>p:not(.eyebrow) { font-size:14px; line-height:1.625; }
.tools-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.tool-card { display:flex; flex-direction:column; gap:8px; padding:16px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 1.961%,transparent); }
.tool-card:hover { border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 4%,transparent); }
.tool-card>div { display:flex; align-items:center; gap:8px; }
.tool-card .icon { width:20px; height:20px; color:color-mix(in srgb,var(--color-brand-primary) 70%,transparent); }
.tool-card:hover .icon { color:var(--color-brand-primary); }
.tool-card h2 { color:var(--color-text-primary); font-size:16px; font-weight:600; }
.tool-card p { color:var(--color-text-secondary); font-size:16px; }
.tool-card:hover p { color:var(--color-text-primary); }
.scan-header { margin-bottom:16px; }
.scan-header .eyebrow { margin:0; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.16em; }
.scan-header h1 { margin-top:2px; }
.scan-header>div>p:not(.eyebrow) { max-width:48rem; font-size:14px; line-height:1.625; }
.docs-page { width:100%; }
.docs-page [hidden] { display:none!important; }
.docs-header { display:flex; gap:12px; margin-bottom:24px; }
.docs-header .eyebrow { margin:0; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.16em; }
.docs-header h1 { margin-top:2px; }
.docs-header-main { min-width:0; flex:1; }
.docs-header-main>p:not(.eyebrow) { max-width:48rem; font-size:14px; line-height:1.625; }
.docs-try-label { display:inline-flex; padding:2px 6px; border:1px solid color-mix(in srgb,var(--color-brand-primary) 20%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); color:var(--color-brand-primary); font-size:10px; font-weight:500; }
.docs-header-meta { flex:none; align-self:flex-start; display:flex; flex-direction:column; align-items:flex-end; margin-left:auto; color:var(--color-text-secondary); font-size:12px; text-align:right; }
.docs-header-meta a { color:color-mix(in srgb,var(--color-brand-primary) 80%,transparent); font-family:monospace; }
.docs-header-meta a:hover { color:var(--color-brand-primary); }
.docs-loading { padding:32px; text-align:center; color:var(--color-text-secondary); font-size:14px; }
.docs-error { display:grid; gap:8px; padding:24px; border:1px solid color-mix(in srgb,var(--color-error) 20.000%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-error) 5.098%,transparent); color:#fca5a5; font-size:14px; }
.docs-error span { font-size:12px; }
.docs-error button { justify-self:start; padding:6px 12px; border:1px solid color-mix(in srgb,var(--color-error) 30.196%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-error) 20.000%,transparent); color:#fecaca; font-size:12px; }
.docs-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:24px; }
.docs-sidebar { position:sticky; top:16px; align-self:start; max-height:calc(100vh - 32px); overflow:auto; }
.docs-search { position:relative; display:block; }
.docs-search .icon { position:absolute; left:10px; top:50%; transform:translateY(-50%); width:12px; height:12px; color:var(--color-text-secondary); pointer-events:none; }
.docs-search input { width:100%; padding:7px 10px 7px 28px; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; outline:none; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-primary); font-size:12px; }
.docs-search input::placeholder { color:var(--color-text-secondary); }
.docs-search input:focus,.docs-input:focus,.docs-body-input:focus { border-color:color-mix(in srgb,var(--color-brand-primary) 40%,transparent); }
.docs-count { padding:16px 8px 4px; color:var(--color-text-secondary); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.docs-nav-group { margin-bottom:2px; }
.docs-nav-group>summary { display:flex; align-items:center; gap:6px; padding:7px 8px; border-radius:4px; color:var(--color-text-primary); font-size:12px; font-weight:500; }
.docs-nav-group>summary:before { content:'›'; color:var(--color-text-secondary); font-size:14px; line-height:1; }
.docs-nav-group[open]>summary:before { transform:rotate(90deg); }
.docs-nav-group[open]>summary { background:transparent; }
.docs-nav-group>summary:hover { background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-primary); }
.docs-nav-group>summary span { margin-left:auto; color:var(--color-text-secondary); font-family:monospace; font-size:10px; }
.docs-nav-tags { margin:2px 0 4px 12px; padding-left:8px; border-left:1px solid color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); }
.docs-nav-tags button { display:flex; justify-content:space-between; align-items:center; gap:8px; width:100%; padding:4px 8px; border-radius:4px; color:var(--color-text-secondary); font-size:12px; text-align:left; }
.docs-nav-tags button:hover,.docs-nav-tags button.active { background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 45%,var(--color-text-primary)); }
.docs-nav-tags button span { margin-left:auto; color:var(--color-text-secondary); font-family:monospace; font-size:10px; }
.docs-content { min-width:0; }
.docs-group { margin-bottom:40px; }
.docs-group>h2 { margin-bottom:32px; padding-bottom:8px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); color:var(--color-text-primary); font-size:24px; font-weight:700; }
.docs-tag { margin-bottom:32px; scroll-margin-top:16px; }
.docs-tag>h3 { color:var(--color-text-primary); font-size:18px; font-weight:600; text-transform:capitalize; }
.docs-tag-description { margin:4px 0 12px; color:var(--color-text-secondary); font-size:12px; }
.docs-endpoint-list { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.docs-endpoint { border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 1.961%,transparent); }
.docs-endpoint:hover { background:color-mix(in srgb,var(--color-text-primary) 3.137%,transparent); }
.docs-endpoint[open]>summary { background:transparent; }
.docs-endpoint-summary { display:flex; align-items:flex-start; gap:12px; padding:16px; text-align:left; }
.docs-method { flex:none; margin-top:2px; padding:2px 8px; border:1px solid; border-radius:4px; font-family:monospace; font-size:10px; font-weight:600; }
.method-get { border-color:color-mix(in srgb,var(--color-brand-secondary) 20.000%,transparent); background:color-mix(in srgb,var(--color-brand-secondary) 10.196%,transparent); color:var(--color-brand-secondary); }
.method-post { border-color:color-mix(in srgb,var(--color-brand-primary) 20.000%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 10.196%,transparent); color:var(--color-brand-primary); }
.method-put { border-color:#f59e0b33; background:#f59e0b1a; color:#fbbf24; }
.method-patch { border-color:#8b5cf633; background:#8b5cf61a; color:#a78bfa; }
.method-delete { border-color:color-mix(in srgb,var(--color-error) 20.000%,transparent); background:color-mix(in srgb,var(--color-error) 10.196%,transparent); color:var(--color-error); }
.docs-endpoint-title { flex:1; min-width:0; }
.docs-endpoint-path { display:block; overflow:hidden; color:var(--color-text-primary); font-family:monospace; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.docs-path-param { color:var(--color-brand-primary); }
.docs-endpoint-summary-text { display:block; margin-top:2px; color:var(--color-text-secondary); font-size:12px; }
.docs-chevron { color:var(--color-text-secondary); font-size:18px; line-height:1; }
.docs-endpoint[open] .docs-chevron { transform:rotate(180deg); }
.docs-endpoint-body { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; padding:16px; border-top:1px solid color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); }
.docs-description { color:var(--color-text-primary); font-size:14px; line-height:1.625; white-space:pre-wrap; }
.docs-returns { display:flex; align-items:center; gap:8px; font-size:12px; }
.docs-returns>span,.docs-endpoint-body h4 { color:var(--color-text-secondary); font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; }
.docs-returns code { padding:2px 6px; border:1px solid color-mix(in srgb,var(--color-brand-secondary) 14.902%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-brand-secondary) 5.882%,transparent); color:#6ee7b7; }
.docs-params,.docs-body-section,.docs-request { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.docs-param-row { display:grid; grid-template-columns:160px minmax(0,1fr); align-items:start; gap:12px; }
.docs-param-label { color:var(--color-text-primary); font-size:12px; }
.docs-param-label code { color:var(--color-brand-primary); }
.docs-param-label small { display:block; margin-top:2px; color:var(--color-text-secondary); font-size:10px; }
.docs-required { margin-left:3px; color:var(--color-error); }
.docs-param-field { position:relative; }
.docs-input,.docs-body-input { width:100%; padding:6px 10px; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; outline:none; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-primary); font-size:12px; }
.docs-input::placeholder { color:var(--color-text-secondary); }
.docs-param-description { margin-top:4px; color:var(--color-text-secondary); font-size:10px; }
.docs-entity-results { position:absolute; z-index:20; top:100%; left:0; right:0; padding:4px; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; background:var(--theme-surface-primary,#171717); box-shadow:0 12px 30px #0009; }
.docs-entity-results button { display:block; width:100%; padding:6px 8px; color:var(--color-text-primary); font-size:12px; text-align:left; }
.docs-entity-results button:hover { background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-primary); }
.docs-body-field { display:flex; flex-wrap:wrap; gap:6px; align-items:baseline; color:var(--color-text-secondary); font-size:10px; }
.docs-body-field code { color:var(--color-text-primary); }
.docs-body-input { min-height:150px; padding:8px 12px; background:color-mix(in srgb,var(--theme-surface-primary,#000) 40.000%,transparent); font-family:monospace; resize:vertical; }
.docs-request-url { display:block; padding:8px 12px; overflow-wrap:anywhere; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; background:color-mix(in srgb,var(--theme-surface-primary,#000) 40.000%,transparent); color:var(--color-text-primary); font-family:monospace; font-size:11px; }
.docs-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.docs-actions button { padding:6px 12px; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-primary); font-size:12px; font-weight:500; }
.docs-actions button:hover { background:color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
.docs-actions .docs-run { border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 20%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 40%,var(--color-text-primary)); }
.docs-actions .docs-run:hover { background:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); }
.docs-actions button:disabled { opacity:.5; cursor:wait; }
.docs-request-error { padding:8px 12px; border:1px solid color-mix(in srgb,var(--color-error) 20.000%,transparent); border-radius:6px; background:color-mix(in srgb,var(--color-error) 7.843%,transparent); color:#fca5a5; font-size:12px; }
.docs-response-heading { display:flex; align-items:center; gap:12px; margin-bottom:8px; color:var(--color-text-secondary); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.docs-response-heading strong { padding:2px 6px; border-radius:4px; font-family:monospace; }
.docs-response-heading strong.success { background:color-mix(in srgb,var(--color-brand-secondary) 10.196%,transparent); color:var(--color-brand-secondary); }
.docs-response-heading strong.failure { background:color-mix(in srgb,var(--color-error) 10.196%,transparent); color:var(--color-error); }
.docs-response-text { max-height:24rem; margin:0; padding:8px 12px; overflow:auto; overflow-wrap:anywhere; border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:6px; background:color-mix(in srgb,var(--theme-surface-primary,#000) 40.000%,transparent); color:var(--color-text-primary); font-family:monospace; font-size:11px; white-space:pre-wrap; }
.docs-empty { padding:24px; color:var(--color-text-secondary); text-align:center; font-size:12px; }
@media(max-width:1023px) { .docs-layout { grid-template-columns:minmax(0,1fr); } .docs-sidebar { position:static; max-height:none; } }
@media(max-width:639px) { .docs-header-meta { display:none!important; } .docs-param-row { grid-template-columns:1fr; gap:4px; } }
@media(max-width:1023px) { .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:1023px) { .tools-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:639px) { .tools-grid { grid-template-columns:1fr; } }
@media(max-width:767px) { .category-grid { grid-template-columns:1fr; } }
@media(max-width:767px) { .info-panel { padding:20px; } .donate-options { grid-template-columns:1fr; } }
.site-footer { padding:32px 8px 12px; font-size:16px; }
.footer-project { display:grid; align-items:center; gap:12px; padding:16px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px 8px 0 0; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.footer-project>a { display:flex; justify-content:center; align-items:center; gap:12px; color:var(--color-text-primary); }
.footer-project strong { font-weight:500; }
.footer-project>a>span { border-left:1px solid color-mix(in srgb,var(--color-text-primary) 12.157%,transparent); padding-left:12px; font-size:14px; color:var(--color-text-secondary); }
.footer-project p { text-align:center; color:var(--color-text-secondary); font-size:14px; }
.footer-project p a { color:var(--color-text-primary); }
.site-footer a:hover { color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); }
.community-links { display:flex; flex-wrap:wrap; justify-content:center; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-top:0; border-radius:0 0 8px 8px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); padding:16px 8px; }
.community-links a { display:flex; align-items:center; justify-content:center; gap:8px; padding:8px 12px; font-size:14px; color:var(--color-text-secondary); width:50%; min-width:0; }
.community-links span { white-space:nowrap; }
.community-links img { width:18px; height:18px; object-fit:contain; filter:grayscale(1); opacity:.7; }
.community-links a:hover img { filter:none; opacity:1; }
.background-controls { position:fixed; bottom:16px; left:16px; display:flex; gap:8px; z-index:9999; }
.floating-button { width:36px; height:36px; display:flex; align-items:center; justify-content:center; background:color-mix(in srgb,var(--theme-surface-primary,#000) 53.333%,transparent); color:var(--color-text-secondary); border-radius:8px; }
.floating-button .icon { width:16px; height:16px; }
.floating-button:hover { color:var(--color-brand-primary); background:color-mix(in srgb,var(--theme-surface-primary,#000) 73.333%,transparent); }
.floating-button[aria-pressed=true] { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); }
.powered-badge { position:fixed; bottom:16px; right:16px; z-index:9999; display:flex; align-items:center; height:36px; border-radius:8px; background:color-mix(in srgb,var(--theme-surface-primary,#000) 53.333%,transparent); color:var(--color-text-secondary); overflow:hidden; }
.powered-badge-icon { display:flex; align-items:center; justify-content:center; width:36px; height:36px; font-size:13px; font-weight:800; }
.powered-badge-text { max-width:0; opacity:0; white-space:nowrap; font-size:12px; transition:max-width .25s,opacity .25s,padding .25s; }
.powered-badge:hover .powered-badge-text,.powered-badge:focus-visible .powered-badge-text { max-width:180px; opacity:1; padding-right:12px; }
.content,.content-blur,.navbar { transition:opacity .6s; }
.background-view .content,.background-view .content-blur,.background-view .navbar { opacity:0; pointer-events:none; }
.skip-link { position:fixed; left:16px; top:-100px; z-index:10000; padding:8px 16px; background:var(--theme-surface-primary,#111827); }
.skip-link:focus { top:8px; }
dialog { color:white; background:var(--theme-surface-primary,#101010); border:1px solid color-mix(in srgb,var(--color-text-primary) 12.157%,transparent); border-radius:12px; padding:0; width:min(680px,calc(100vw - 24px)); max-height:80dvh; box-shadow:0 30px 90px #000b; }
dialog::backdrop { background:#0009; backdrop-filter:blur(8px); }
.dialog-heading { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
.dialog-heading h2 { font-size:16px; font-weight:500; color:var(--color-text-primary); }
/* Spotlight follows Nuxt's shared typography: fine 12/16, xs 14/20, sm 16/24. */
.spotlight-open { overflow:hidden; }
#search-dialog { width:min(672px,calc(100vw - 32px)); margin:15vh auto 0; max-height:calc(85dvh - 16px); background:linear-gradient(var(--color-bg-secondary),var(--color-bg-secondary)),var(--color-bg-primary); border-color:color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); box-shadow:0 25px 50px -12px #0009; overflow:hidden; }
#search-dialog[open] { display:flex; flex-direction:column; }
#search-dialog::backdrop { background:#0009; backdrop-filter:blur(4px); }
.spotlight-heading { display:flex; align-items:center; gap:12px; flex:none; padding:16px 20px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); }
.spotlight-field { display:flex; align-items:center; gap:12px; flex:1; min-width:0; color:var(--color-text-secondary); }
.spotlight-field>.icon { width:18px; height:18px; flex:none; }
.spotlight-field input { flex:1; min-width:0; padding:0; border:0; outline:0; background:none; color:var(--color-text-primary); font:inherit; font-size:1rem; line-height:1.5rem; }
.spotlight-field:focus-within { outline:2px solid var(--color-brand-primary); outline-offset:6px; border-radius:4px; }
.spotlight-field input::placeholder { color:var(--color-text-secondary); }
.spotlight-field input::-webkit-search-cancel-button { display:none; }
.spotlight-heading kbd,.spotlight-footer kbd { border:1px solid color-mix(in srgb,var(--color-text-primary) 10.196%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); color:var(--color-text-secondary); font:inherit; font-size:.75rem; line-height:1rem; }
.spotlight-heading kbd { flex:none; padding:2px 6px; }
.spotlight-heading button { display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex:none; padding:0; border:0; border-radius:6px; background:none; color:var(--color-text-secondary); cursor:pointer; }
.spotlight-heading button:hover { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); }
.spotlight-heading button>.icon { width:14px; height:14px; }
.spotlight-heading .spotlight-back,.spotlight-clear[hidden] { display:none; }
#search-results { min-height:0; padding:0; overflow:auto; overscroll-behavior:contain; }
.spotlight-default { padding:20px; }
.spotlight-default>section { margin-bottom:20px; }
.spotlight-default h3,.spotlight-group h3 { display:flex; align-items:center; gap:6px; margin:0 0 8px; padding:0 8px 8px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); font-size:.75rem; line-height:1rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.spotlight-actions { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; }
.spotlight-actions a { display:flex; flex-direction:column; align-items:center; gap:8px; padding:12px 8px; border-radius:6px; color:var(--color-text-secondary); font-size:.875rem; line-height:1.25rem; }
.spotlight-actions .icon { width:20px; height:20px; }
.spotlight-actions a:hover,.spotlight-tools a:hover,.spotlight-recent:hover { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 8%,transparent); }
.spotlight-default-columns { display:flex; gap:24px; }
.spotlight-default-columns>section { flex:1; min-width:0; }
.spotlight-tools { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
.spotlight-tools a { display:flex; flex-direction:column; align-items:center; gap:6px; padding:8px 4px; border-radius:6px; color:var(--color-text-secondary); font-size:.75rem; line-height:1rem; }
.spotlight-tools img { width:16px; height:16px; object-fit:contain; filter:grayscale(1); opacity:.6; }
.spotlight-recent { display:flex; align-items:center; border-radius:6px; color:var(--color-text-secondary); }
.spotlight-recent button { border:0; background:none; color:inherit; cursor:pointer; }
.spotlight-recent-select { display:flex; align-items:center; gap:8px; flex:1; min-width:0; padding:6px 8px; text-align:left; font:inherit; font-size:1rem; line-height:1.5rem; }
.spotlight-recent-select span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.spotlight-recent-select .icon { width:16px; height:16px; flex:none; opacity:.4; }
.spotlight-recent-remove { display:flex; align-items:center; padding:6px; opacity:0; }
.spotlight-recent-remove .icon { width:14px; height:14px; }
.spotlight-recent:hover .spotlight-recent-remove,.spotlight-recent:focus-within .spotlight-recent-remove { opacity:1; }
.spotlight-message { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:48px 16px; color:var(--color-text-secondary); text-align:center; }
.spotlight-message>.icon { width:30px; height:30px; margin-bottom:8px; opacity:.4; }
.spotlight-message p { margin:0; font-size:1rem; line-height:1.5rem; }
.spotlight-message small { color:var(--color-text-secondary); font-size:.875rem; line-height:1.25rem; }
.spotlight-message:has(use[href*="loader"]) { flex-direction:row; gap:8px; }
.spotlight-message:has(use[href*="loader"])>.icon { width:18px; height:18px; margin:0; opacity:1; animation:spin 1s linear infinite; }
.spotlight-results { padding:12px; }
.spotlight-filters { display:flex; flex-wrap:wrap; gap:6px; margin:0 4px 12px; }
.spotlight-filters button { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:999px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); color:var(--color-text-secondary); font:inherit; font-size:.75rem; line-height:1rem; font-weight:500; cursor:pointer; }
.spotlight-filters .icon,.spotlight-group h3 .icon { width:12px; height:12px; }
.spotlight-filters button[aria-pressed=true] { border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); background:color-mix(in srgb,var(--color-brand-primary) 15%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); }
.spotlight-groups { display:grid; gap:12px; }
.spotlight-group h3 { margin-bottom:4px; padding-bottom:6px; }
.spotlight-result { display:flex; align-items:center; gap:12px; padding:6px 8px; margin-top:1px; border-radius:6px; color:var(--color-text-secondary); }
.spotlight-result:hover { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); }
.spotlight-result[aria-selected=true] { background:color-mix(in srgb,var(--color-brand-primary) 15%,transparent); color:var(--color-text-primary); }
.spotlight-image { display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex:none; overflow:hidden; border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.spotlight-image img { display:block; width:32px; height:32px; object-fit:cover; }
.spotlight-image>.icon { width:14px; height:14px; }
.spotlight-name { flex:1; min-width:0; }
.spotlight-name strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:1rem; line-height:1.5rem; font-weight:500; }
.spotlight-name small { display:block; color:var(--color-text-secondary); font-size:.875rem; line-height:1.25rem; }
.spotlight-type { flex:none; color:var(--color-text-secondary); font-size:.75rem; line-height:1rem; text-transform:capitalize; }
.spotlight-result>.icon { width:14px; height:14px; flex:none; opacity:.3; }
.spotlight-view-all { display:flex; align-items:center; justify-content:center; gap:8px; margin:12px 8px 0; padding:10px; border:1px solid color-mix(in srgb,var(--color-brand-primary) 10%,transparent); border-radius:8px; color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); font-size:.875rem; line-height:1.25rem; font-weight:500; }
.spotlight-view-all>.icon { width:14px; height:14px; }
.spotlight-footer { display:flex; align-items:center; justify-content:center; flex:none; gap:20px; padding:12px 20px; border-top:1px solid color-mix(in srgb,var(--color-text-primary) 5.882%,transparent); color:var(--color-text-secondary); font-size:.875rem; line-height:1.25rem; }
.spotlight-footer>span { display:flex; align-items:center; gap:6px; }
.spotlight-footer kbd { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 4px; }
.spotlight-actions a,.spotlight-tools a,.spotlight-recent,.spotlight-result,.spotlight-filters button,.spotlight-view-all,.spotlight-heading button { transition:color .15s,background-color .15s,border-color .15s; }
.spotlight-filters button:hover { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); border-color:color-mix(in srgb,var(--color-brand-primary) 20%,transparent); }
.spotlight-view-all:hover { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); }
#search-dialog :focus-visible { outline:2px solid var(--color-brand-primary); outline-offset:2px; }
#search-dialog input:focus-visible { outline:none; }
@media(max-width:767px) {
  #search-dialog { width:100%; height:100dvh; max-width:none; max-height:none; margin:0; border:0; border-radius:0; background:var(--theme-surface-primary,#030712); }
  .spotlight-heading { padding:12px 16px; border-color:color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
  .spotlight-field { gap:8px; padding:8px 12px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
  .spotlight-field>.icon { width:16px; height:16px; }
  .spotlight-heading .spotlight-back { display:flex; color:var(--color-text-secondary); }
  .spotlight-heading .spotlight-back>.icon { width:20px; height:20px; }
  .spotlight-heading kbd,.spotlight-heading .spotlight-close,.spotlight-footer { display:none; }
  .spotlight-heading .spotlight-clear { width:18px; height:18px; }
  #search-results { flex:1; }
  .spotlight-actions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .spotlight-actions a { flex-direction:row; gap:12px; padding:12px 16px; font-size:1rem; line-height:1.5rem; }
  .spotlight-actions .icon { width:18px; height:18px; flex:none; }
  .spotlight-default-columns { flex-direction:column; gap:20px; }
  .spotlight-tools { gap:8px; }
  .spotlight-recent-select { min-height:44px; padding-top:10px; padding-bottom:10px; }
  .spotlight-heading button,.spotlight-heading .spotlight-clear,.spotlight-recent-remove { min-width:44px; min-height:44px; justify-content:center; }
  .spotlight-filters button { min-height:36px; padding:6px 10px; }
  .spotlight-recent-remove { opacity:1; }
}

/* Shared killboard widgets. Their markup is also used by HTML fragments. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.navigation-progress { position:fixed; inset:0 0 auto; z-index:10010; height:3px; overflow:hidden; pointer-events:none; background:color-mix(in srgb,var(--color-brand-primary) 12%,transparent); }
.navigation-progress[hidden] { display:none!important; }
.navigation-progress>span { display:block; width:35%; height:100%; background:var(--color-brand-primary); box-shadow:0 0 8px var(--color-brand-primary); animation:navigation-progress-slide 1.2s ease-in-out infinite; }
.navigation-pending { outline:1px solid var(--color-brand-primary); outline-offset:2px; animation:navigation-source-pulse 1s ease-in-out infinite alternate; }
@keyframes navigation-progress-slide { from { transform:translateX(-35%); } to { transform:translateX(300%); } }
@keyframes navigation-source-pulse { from { outline-color:color-mix(in srgb,var(--color-brand-primary) 35%,transparent); } to { outline-color:var(--color-brand-primary); } }
@media(prefers-reduced-motion:reduce) { .navigation-progress>span { width:100%; } }
.homepage { display:grid; gap:0; }
.home-grid { display:grid; grid-template-columns:250px minmax(0,1fr); gap:16px; align-items:start; }
.home-kills { grid-column:2; grid-row:1; min-width:0; }
.home-top-list { grid-column:1; grid-row:1; min-width:0; }
.kills-page>h1 { margin:0 0 16px; color:var(--color-text-primary); font-size:20px; line-height:28px; font-weight:700; }
.kills-grid { display:grid; grid-template-columns:250px minmax(0,1fr); gap:16px; align-items:start; }
.kills-top-panel { grid-column:1; grid-row:1; min-width:0; }
.kills-list-panel { grid-column:2; grid-row:1; min-width:0; }
.kills-valuable { margin-bottom:24px; padding:12px; }
.kills-mobile-tabs { display:none; }
.valuable { margin-bottom:24px; padding:12px; }
.valuable-tabs { display:flex; gap:4px; margin-bottom:12px; }
.valuable-tab { border-radius:6px; padding:6px 12px; color:var(--color-text-secondary); font-size:14px; font-weight:500; line-height:20px; transition:color .15s,background .15s; }
.valuable-tab:hover { color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 4%,transparent); }
.valuable-tab.active { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); }
.valuable-tab .tab-short { display:none; }
.valuable-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:8px; }
.valuable-grid.compact { grid-template-columns:repeat(4,minmax(0,1fr)); }
.valuable-card { position:relative; display:block; min-width:0; aspect-ratio:1; overflow:hidden; border:1px solid #ffffff0a; border-radius:8px; background:#0006; }
.valuable-card:hover { border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); }
.valuable-ship { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:8px; transition:transform .3s; }
.valuable-card:hover .valuable-ship { transform:scale(1.1); }
.valuable-shade { position:absolute; inset:auto 0 0; height:66%; background:linear-gradient(transparent,#0008,#000e); pointer-events:none; }
.valuable-isk { position:absolute; top:6px; right:6px; border-radius:4px; padding:2px 6px; background:#0009; color:var(--color-isk-value); font-size:12px; font-weight:600; }
.valuable-labels { position:absolute; inset:auto 10px 10px; display:grid; gap:2px; min-width:0; }
.valuable-labels>* { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; line-height:1.2; }
.valuable-labels strong { color:#fff; font-size:14px; font-weight:600; }
.valuable-labels span { font-size:12px; color:#d1d5dbdd; }
.valuable-labels span:last-child { color:#9ca3afcc; }
.valuable-empty { padding:32px 0; text-align:center; color:var(--color-text-secondary); font-size:14px; }
.top-box { margin-bottom:16px; padding:8px; }
.top-box h2 { margin:0 4px 4px; padding-bottom:8px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); font-size:12px; line-height:16px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.top-box-entries { display:grid; gap:1px; }
.top-box-entry { position:relative; display:flex; align-items:center; gap:8px; min-width:0; min-height:32px; overflow:hidden; border-radius:6px; padding:4px 8px; color:var(--color-text-secondary); transition:color .15s,background .15s; }
.top-accent { position:absolute; inset:0 auto 0 0; width:3px; height:100%; }
.top-box-entry:hover { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); }
.top-rank { width:16px; flex:none; text-align:right; font-size:12px; line-height:16px; }
.top-image { width:24px; height:24px; flex:none; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.top-image img { width:100%; height:100%; object-fit:cover; }
.top-image .icon { width:13px; height:13px; }
.top-name { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--color-text-primary); font-size:14px; line-height:20px; }
.top-count { flex:none; font-size:12px; line-height:16px; font-variant-numeric:tabular-nums; }
.top-footer { padding:6px 8px 0; color:var(--color-text-secondary); font-size:12px; line-height:16px; }
.top-box-loading .top-image,.top-skeleton-line,.top-skeleton-count { border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 7.059%,transparent); animation:top-box-pulse 1.5s ease-in-out infinite alternate; }
.top-skeleton-line,.top-skeleton-count { height:12px; }
.top-skeleton-count { width:36px; }
.top-box-retry { display:block; width:100%; padding:18px 8px; color:var(--color-brand-primary); font-size:12px; text-align:center; }
.top-box-retry:hover { background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); }
@keyframes top-box-pulse { to { opacity:.4; } }
.kill-list { min-width:0; padding:8px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.kill-toolbar { display:grid; grid-template-columns:1fr 1fr 1fr; align-items:center; gap:8px; margin-bottom:8px; }
.kill-toolbar-left { display:flex; align-items:center; gap:8px; min-width:0; }
.kill-live-dot { width:8px; height:8px; flex:none; border-radius:50%; background:var(--color-error); }
.kill-live-dot.connected { background:var(--color-success); }
.new-kills { flex:none; border-radius:999px; padding:2px 8px; background:color-mix(in srgb,var(--color-brand-primary) 20%,transparent); color:var(--color-brand-primary); font-size:12px; font-weight:600; }
.kill-limits { display:flex; align-items:center; gap:2px; }
.kill-limit,.kill-filter-trigger { border-radius:4px; padding:4px 8px; color:var(--color-text-secondary); font-size:14px; font-weight:500; }
.kill-limit:hover,.kill-filter-trigger:hover { color:color-mix(in srgb,var(--color-brand-primary) 55%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 4%,transparent); }
.kill-limit.active,.kill-filter-trigger[aria-expanded=true] { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 10%,transparent); }
.kill-filter-trigger { display:flex; align-items:center; padding:4px 6px; }
.kill-filter-trigger .icon { width:14px; height:14px; }
.kill-day-heading { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:center; color:var(--color-text-primary); font-size:14px; font-weight:500; }
.kill-pager { display:flex; align-items:center; justify-content:flex-end; gap:3px; color:var(--color-text-primary); font-size:14px; }
.kill-pager button { display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:4px; color:var(--color-text-secondary); font-size:20px; }
.kill-pager button:hover:not(:disabled) { background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); color:var(--color-brand-primary); }
.kill-pager button:disabled { opacity:.3; cursor:default; }
.kill-pager span { padding:0 8px; white-space:nowrap; }
.kill-pager .kill-page-number { width:auto; min-width:28px; padding:0 7px; font-size:14px; font-weight:500; }
.kill-pager .kill-page-number.active { color:color-mix(in srgb,var(--color-brand-primary) 65%,var(--color-text-primary)); background:color-mix(in srgb,var(--color-brand-primary) 15%,transparent); }
.kill-pager .kill-page-ellipsis { color:var(--color-text-secondary); padding:0 2px; }
.kill-bottom-pager { display:flex; justify-content:flex-end; margin-top:8px; }
.kill-empty { padding:48px 0; text-align:center; color:var(--color-text-secondary); font-size:14px; }
.kill-filter-panel { margin-bottom:8px; padding:12px; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:8px; color:var(--color-text-secondary); font-size:12px; }
.kill-filter-panel[hidden] { display:none; }
.kill-filter-searches { display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px; }
.kill-filter-search { position:relative; flex:1; min-width:160px; }
.kill-filter-search label { display:block; margin-bottom:4px; color:var(--color-text-secondary); font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.kill-filter-input-wrap { display:flex; align-items:center; border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.kill-filter-input-wrap:focus-within { border-color:color-mix(in srgb,var(--color-brand-primary) 40%,transparent); }
.kill-filter-input-wrap input { width:100%; min-width:0; padding:6px 8px; border:0; outline:0; background:transparent; color:var(--color-text-primary); font-size:12px; }
.kill-filter-input-wrap input::placeholder { color:var(--color-text-secondary); }
.kill-filter-input-wrap button { padding:2px 8px; color:var(--color-text-secondary); font-size:16px; }
.kill-filter-input-wrap button:hover { color:var(--color-error); }
.kill-filter-suggestions { position:absolute; z-index:30; top:100%; left:0; right:0; max-height:224px; overflow:auto; margin-top:4px; border:1px solid color-mix(in srgb,var(--color-text-primary) 12.157%,transparent); border-radius:6px; background:var(--theme-surface-primary,#0f1115); box-shadow:0 12px 30px #0009; }
.kill-filter-suggestions[hidden] { display:none; }
.kill-filter-suggestions button { display:block; width:100%; overflow:hidden; padding:7px 10px; text-align:left; color:var(--color-text-primary); font-size:12px; white-space:nowrap; text-overflow:ellipsis; }
.kill-filter-suggestions button:hover { background:color-mix(in srgb,var(--color-brand-primary) 15%,transparent); }
.kill-filter-options { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:12px; }
.kill-filter-options button { border:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); border-radius:4px; padding:4px 8px; color:var(--color-text-secondary); font-size:12px; font-weight:500; }
.kill-filter-options button:hover { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 4%,transparent); }
.kill-filter-options button[aria-pressed=true] { color:var(--color-brand-primary); background:color-mix(in srgb,var(--color-brand-primary) 15%,transparent); border-color:color-mix(in srgb,var(--color-brand-primary) 30%,transparent); }
.kill-filter-options .kill-filter-clear-all { margin-left:auto; border:0; font-size:10px; }
.kill-filter-options .kill-filter-clear-all:hover { color:var(--color-error); }
.kill-head,.kill-row { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,2.5fr) minmax(0,2.5fr) minmax(0,1.2fr) minmax(0,1fr); gap:12px; }
.kill-head { padding:6px 8px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); color:var(--color-text-secondary); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.kill-head span:last-child { text-align:right; }
.kill-row { position:relative; align-items:center; min-width:0; padding:6px 8px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 3.137%,transparent); transition:background .15s; }
.kill-row.alternate { background:color-mix(in srgb,var(--color-text-primary) 1.961%,transparent); }
.kill-row:hover { background:color-mix(in srgb,var(--color-brand-primary) 6%,transparent); }
.kill-row-overlay { position:absolute; inset:0; z-index:0; }
.kill-row>div { position:relative; z-index:1; min-width:0; pointer-events:none; }
.kill-row a:not(.kill-row-overlay) { pointer-events:auto; }
.kill-row:hover .kill-ship-copy>a,
.kill-row a:not(.kill-row-overlay):is(:hover,:focus-visible) { color:var(--color-brand-primary); }
.kill-ship,.kill-identity,.kill-location { display:flex; align-items:center; gap:10px; min-width:0; }
.kill-portrait { width:40px; height:40px; flex:none; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:4px; background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.kill-portrait img { width:100%; height:100%; object-fit:cover; }
.kill-image-empty { color:var(--color-text-secondary); }
.kill-image-empty .icon { width:16px; height:16px; }
.kill-ship-copy,.kill-identity-copy,.kill-location>div { display:grid; min-width:0; line-height:1.25; }
.kill-ship-copy>* ,.kill-identity-copy>* ,.kill-location>div>* { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.kill-ship-copy>a,.kill-ship-copy>span:first-child,.identity-primary { color:var(--color-text-primary); font-size:14px; line-height:20px; }
.kill-ship-group,.kill-identity-copy>a:not(.identity-primary),.kill-region { color:var(--color-text-secondary); font-size:12px; line-height:16px; }
.kill-ship-isk { color:color-mix(in srgb,var(--color-isk-value) 70%,transparent); font-size:12px; line-height:16px; font-variant-numeric:tabular-nums; }
.kill-mobile-summary,.kill-mobile-location,.kill-mobile-isk { display:none; }
.kill-identity-badges { display:grid; gap:2px; flex:none; }
.kill-identity-badges a,.kill-identity-badges img { display:block; width:19px; height:19px; border-radius:2px; }
.kill-identity-badges a { background:color-mix(in srgb,var(--color-text-primary) 3.922%,transparent); }
.identity-primary.npc { color:color-mix(in srgb,var(--color-npc-text) 80%,transparent); }
.kill-location-icon { width:24px; height:24px; flex:none; }
.kill-location-icon img { width:100%; height:100%; border-radius:4px; }
.image-fallback { display:flex; width:100%; height:100%; align-items:center; justify-content:center; color:var(--color-text-secondary); font-size:16px; line-height:1; }
.kill-location>div>span { font-size:12px; line-height:16px; }
.kill-location>div>span>a { color:var(--color-text-primary); }
.kill-location em,.kill-mobile-location em { font-style:normal; font-weight:500; font-variant-numeric:tabular-nums; }
.security-high { color:color-mix(in srgb,var(--color-highsec) 75%,var(--color-text-primary)); }.security-low { color:var(--color-lowsec); }.security-null { color:color-mix(in srgb,var(--color-nullsec) 75%,var(--color-text-primary)); }.security-unknown { color:var(--color-text-secondary); }
.kill-details { display:grid; gap:3px; justify-items:end; font-size:14px; color:var(--color-text-primary); font-variant-numeric:tabular-nums; }
.kill-attacker-count { display:flex; align-items:center; gap:4px; color:var(--color-text-secondary); font-size:12px; }
.kill-attacker-count .icon { width:12px; height:12px; }
.kill-day-divider { display:flex; align-items:center; gap:12px; padding:8px; color:var(--color-text-secondary); font-size:12px; text-transform:uppercase; letter-spacing:.07em; }
.kill-day-divider span { flex:1; height:1px; background:color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
.kill-day-divider strong { font-weight:500; }
@media(max-width:1023px) { .valuable-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:767px) {
  .home-grid { grid-template-columns:minmax(0,1fr); }
  .home-kills,.home-top-list { grid-column:1; grid-row:auto; }
  .kills-grid { display:block; }
  .kills-mobile-tabs { display:flex; margin-bottom:16px; border-bottom:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
  .kills-mobile-tabs button { display:flex; flex:1; align-items:center; justify-content:center; gap:8px; padding:12px 4px; border-bottom:2px solid transparent; color:var(--color-text-secondary); font-size:14px; font-weight:500; }
  .kills-mobile-tabs button:hover { color:var(--color-brand-primary); }
  .kills-mobile-tabs button[aria-selected=true] { color:var(--color-text-primary); border-color:var(--color-brand-primary); }
  .kills-mobile-tabs .icon { width:16px; height:16px; }
  .kills-page :is(.kills-valuable-panel,.kills-top-panel,.kills-list-panel) { display:none; }
  .kills-page[data-tab=kills] .kills-list-panel,.kills-page[data-tab=top] .kills-top-panel,.kills-page[data-tab=valuable] .kills-valuable-panel { display:block; }
  .valuable-grid.kills-valuable-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .valuable-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .valuable-card-secondary { display:none; }
  .valuable-tab .tab-long { display:none; }.valuable-tab .tab-short { display:inline; }
  .kill-toolbar { grid-template-columns:auto minmax(0,1fr); }
  .kill-day-heading { min-width:0; justify-self:stretch; }.kill-toolbar>.kill-pager { grid-column:1/-1; justify-content:center; }
  .kill-head,.kill-identity,.kill-location { display:none; }
  .kill-row { grid-template-columns:minmax(0,1fr) auto; gap:10px; padding:8px; }
  .kill-ship-group,.kill-ship-isk,.kill-attacker-count { display:none; }
  .kill-mobile-summary,.kill-mobile-location,.kill-mobile-isk { display:block; font-size:12px; line-height:16px; color:var(--color-text-secondary); }
  .kill-mobile-isk { color:color-mix(in srgb,var(--color-isk-value) 80%,transparent); margin-bottom:12px; }
}
@media(max-width:639px) { .valuable-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.valuable-grid.kills-valuable-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.valuable-labels { inset:auto 6px 6px; } }
@media(min-width:640px) { .community-links a { width:33.333%; } }
@media(min-width:768px) { .site-footer { padding-left:40px; padding-right:40px; } .footer-project { grid-template-columns:1fr 1fr; gap:24px; } .footer-project>a { justify-content:flex-start; } .footer-project p { text-align:right; } .community-links a { width:25%; } .community-links span { font-size:12px; } }
@media(min-width:1024px) { .home-link span { display:inline; } .nav-search { margin:0 16px; } .search-trigger { width:100%; max-width:448px; justify-content:flex-start; padding:0 16px; } .search-trigger span { display:block; } .community-links a { width:20%; } }
@media(min-width:1280px) { .search-trigger kbd { display:block; } .search-trigger kbd+kbd { margin-left:-10px; } .community-links { flex-wrap:nowrap; padding-left:12px; padding-right:12px; } .community-links a { width:auto; flex:1; gap:6px; padding-left:4px; padding-right:4px; } }
@media(min-width:1536px) { .secondary-link { display:flex; } .nav-search { margin:0 24px; } }
@media(max-width:1023px) { .mega-menu { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:767px) {
 .navbar { height:48px; }
 .nav-inner { padding:0 12px; gap:8px; }
 .nav-left { flex:none; }
 .nav-search { flex:1; margin:0; }
 .nav-backdrop { mask:none; background:linear-gradient(color-mix(in srgb,var(--theme-surface-primary,#000) 73.333%,transparent),color-mix(in srgb,var(--theme-surface-primary,#000) 40%,transparent),transparent); }
 .home-link { width:32px; height:32px; padding:0; justify-content:center; }
 .desktop-links,.desktop-actions { display:none; }
 .search-trigger { height:32px; width:100%; padding:0 12px; justify-content:flex-start; border-radius:6px; font-size:14px; gap:8px; }
 .search-trigger span { display:block; }
 .search-trigger .icon { width:16px; height:16px; }
 .mobile-navigation { display:block; }
 .mobile-panel { position:fixed; inset:0; z-index:60; overflow:auto; background:color-mix(in srgb,var(--theme-surface-primary,#050505) 98%,transparent); padding:12px 16px 64px; }
 .mobile-title { display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; font-weight:700; }
 .mobile-section { border-top:1px solid color-mix(in srgb,var(--color-text-primary) 7.843%,transparent); }
 .mobile-section>summary { display:flex; justify-content:space-between; align-items:center; padding:14px 12px; font-size:16px; }
 .mobile-section .menu-group { padding-left:8px; }
 .mobile-section .login-form { padding:0 12px 16px; }
 .mobile-section h2,.mobile-section>p { padding:8px 12px; }
 .mobile-section .sso-button { max-width:270px; }
 .site-footer { padding-bottom:64px; }
 .dialog-footer span { display:none; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

@media(min-width:1280px) { .mega-menu { grid-template-columns:repeat(6,minmax(0,1fr)); } }

.mobile-menu-open { overflow:hidden; }
.mobile-menu-open .background-controls,.mobile-menu-open .powered-badge { visibility:hidden; }
.kill-submit-toasts{position:fixed;z-index:10000;bottom:16px;left:50%;display:flex;flex-direction:column;gap:8px;max-width:calc(100vw - 32px);transform:translateX(-50%);pointer-events:none}.kill-submit-toast{padding:10px 16px;border:1px solid color-mix(in srgb,var(--color-brand-primary) 30.196%,transparent);border-radius:8px;background:color-mix(in srgb,var(--color-brand-primary) 10.196%,transparent);backdrop-filter:blur(12px);box-shadow:0 12px 24px #0006;color:#93c5fd;font:inherit;font-size:14px;white-space:normal;overflow-wrap:anywhere;cursor:pointer;pointer-events:auto}.kill-submit-toast.success{border-color:color-mix(in srgb,var(--color-success) 30.196%,transparent);background:color-mix(in srgb,var(--color-success) 10.196%,transparent);color:#86efac}.kill-submit-toast.error{border-color:color-mix(in srgb,var(--color-error) 30.196%,transparent);background:color-mix(in srgb,var(--color-error) 10.196%,transparent);color:#fca5a5}
.kill-ready-toasts{position:fixed;top:64px;right:16px;z-index:10000;display:flex;flex-direction:column;gap:8px;width:288px;max-width:calc(100vw - 32px);pointer-events:none}.kill-ready-toast{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border:1px solid color-mix(in srgb,var(--color-brand-primary) 30.196%,transparent);border-radius:12px;background:color-mix(in srgb,var(--theme-surface-primary,#000) 86.667%,transparent);backdrop-filter:blur(12px);box-shadow:0 12px 28px #0009;text-align:left;font:inherit;cursor:pointer;pointer-events:auto}.kill-ready-toast:hover{background:color-mix(in srgb,var(--color-brand-primary) 10.196%,transparent)}.kill-ready-toast>img{width:48px;height:48px;flex:none;overflow:hidden;border-radius:6px;background:color-mix(in srgb,var(--theme-surface-primary,#000) 40.000%,transparent)}.kill-ready-toast>span{flex:1;min-width:0}.kill-ready-toast b,.kill-ready-toast strong,.kill-ready-toast small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kill-ready-toast b{margin-bottom:2px;color:var(--color-brand-primary);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.kill-ready-toast strong{color:var(--color-text-primary);font-size:14px;font-weight:400}.kill-ready-toast small{color:var(--color-text-secondary);font-size:11px}.kill-ready-toast small em{color:var(--color-success);font-style:normal}.kill-ready-toast>i{color:var(--color-text-secondary);font-style:normal}

/* Touch targets can grow without changing the desktop data density. */
@media(pointer:coarse),(max-width:767px) {
  .kill-limit,.kill-filter-trigger,.kill-pager button,.valuable-tab { min-width:44px; min-height:44px; }
  .advanced-search :is([data-advanced-option],[data-advanced-collapse],[data-advanced-clear],[data-advanced-view],[data-saved-toggle]) { min-height:44px; }
}
@media(max-width:767px) {
  .navbar .search-trigger,.navbar .home-link,.navbar .icon-button { min-height:44px; }
  .navbar .home-link,.navbar .icon-button { min-width:44px; }
}

.advanced-search input::placeholder { color:var(--color-text-secondary); opacity:1; }
.advanced-search input:focus-visible { outline:2px solid var(--color-brand-primary); outline-offset:3px; }