/* ================================================================
   SHADOWSKINGS — FACTION COMMAND CENTER
   SHADOWMERE COMMAND THEME
   ================================================================ */


/* ================================================================
   ROOT PANEL
   ================================================================ */

#factions-panel,
.factions-panel {

    --fc-black:
        #070609;

    --fc-deep:
        #0b0910;

    --fc-panel:
        #100c15;

    --fc-panel-2:
        #15101b;

    --fc-panel-3:
        #1b1422;

    --fc-border:
        #30243a;

    --fc-border-light:
        #49365a;

    --fc-purple:
        #7e3fb0;

    --fc-purple-bright:
        #a95bdd;

    --fc-purple-dark:
        #3d1b58;

    --fc-purple-glow:
        rgba(139, 62, 190, .32);

    --fc-gold:
        #c8a85a;

    --fc-gold-bright:
        #e5c86e;

    --fc-gold-dark:
        #705824;

    --fc-red:
        #8d3038;

    --fc-red-bright:
        #c64b55;

    --fc-text:
        #e8e0ed;

    --fc-text-soft:
        #aaa0b4;

    --fc-text-dim:
        #766b7e;

    --fc-green:
        #63b879;

    box-sizing: border-box;

    width: 100%;
    min-height: 100%;

    color:
        var(--fc-text);

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(99, 42, 139, .13),
            transparent 42%
        ),
        linear-gradient(
            180deg,
            #0a080c 0%,
            #070609 100%
        );

    font-family:
        "Cinzel",
        "Trajan Pro",
        Georgia,
        serif;

    overflow:
        hidden;
}


/* ================================================================
   GLOBAL BOX SIZING
   ================================================================ */

#factions-panel *,
#factions-panel *::before,
#factions-panel *::after {

    box-sizing:
        border-box;
}


/* ================================================================
   HEADER
   ================================================================ */

#factions-panel .fc-header {

    position:
        relative;

    display:
        flex;

    align-items:
        center;

    min-height:
        112px;

    padding:
        18px 28px;

    background:
        linear-gradient(
            180deg,
            rgba(28, 19, 35, .98),
            rgba(11, 8, 14, .98)
        );

    border-top:
        1px solid rgba(173, 91, 220, .25);

    border-bottom:
        1px solid var(--fc-border);

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .5);

    overflow:
        hidden;
}


/* top ornamental line */

#factions-panel .fc-header::before {

    content:
        "";

    position:
        absolute;

    left:
        28px;

    right:
        28px;

    top:
        6px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--fc-purple),
            var(--fc-gold),
            var(--fc-purple),
            transparent
        );

    opacity:
        .65;
}


/* bottom glow */

#factions-panel .fc-header::after {

    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        0;

    height:
        2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(126, 63, 176, .45),
            rgba(200, 168, 90, .5),
            rgba(126, 63, 176, .45),
            transparent
        );
}


/* ================================================================
   BRAND
   ================================================================ */

#factions-panel .fc-brand {

    flex:
        1;

    min-width:
        280px;

    padding-right:
        28px;
}


#factions-panel .fc-brand-kicker {

    color:
        var(--fc-purple-bright);

    font-size:
        11px;

    font-weight:
        800;

    letter-spacing:
        4px;

    margin-bottom:
        3px;

    text-shadow:
        0 0 14px rgba(169, 91, 221, .35);
}


#factions-panel .fc-brand-title {

    color:
        #f4edf7;

    font-size:
        clamp(25px, 2.3vw, 38px);

    font-weight:
        900;

    line-height:
        1;

    letter-spacing:
        2px;

    text-transform:
        uppercase;

    text-shadow:
        0 2px 0 #000,
        0 0 18px rgba(255, 255, 255, .08);
}


#factions-panel .fc-brand-subtitle {

    margin-top:
        7px;

    color:
        var(--fc-gold);

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        3px;

    text-transform:
        uppercase;
}


/* ================================================================
   HEADER IDENTITY
   ================================================================ */

#factions-panel .fc-header-identity {

    display:
        flex;

    align-items:
        center;

    gap:
        13px;

    min-width:
        290px;

    max-width:
        420px;

    padding:
        8px 18px;

    border-left:
        1px solid var(--fc-border);

    border-right:
        1px solid var(--fc-border);

    background:
        rgba(5, 4, 7, .34);
}


#factions-panel .fc-header-crest {

    position:
        relative;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 64px;

    width:
        64px;

    height:
        64px;

    border:
        1px solid var(--fc-border-light);

    background:
        radial-gradient(
            circle,
            rgba(126, 63, 176, .24),
            rgba(7, 6, 9, .95)
        );

    box-shadow:
        inset 0 0 18px rgba(0, 0, 0, .75),
        0 0 15px rgba(126, 63, 176, .12);
}


#factions-panel .fc-header-crest::before,
#factions-panel .fc-header-crest::after {

    content:
        "";

    position:
        absolute;

    width:
        7px;

    height:
        7px;

    border-color:
        var(--fc-gold);

    opacity:
        .75;
}


#factions-panel .fc-header-crest::before {

    top:
        -1px;

    left:
        -1px;

    border-top:
        1px solid;

    border-left:
        1px solid;
}


#factions-panel .fc-header-crest::after {

    right:
        -1px;

    bottom:
        -1px;

    border-right:
        1px solid;

    border-bottom:
        1px solid;
}


#factions-panel .fc-crest-placeholder {

    color:
        var(--fc-purple-bright);

    font-size:
        17px;

    font-weight:
        900;

    letter-spacing:
        1px;
}


#factions-panel .fc-header-label {

    color:
        var(--fc-text-dim);

    font-size:
        9px;

    letter-spacing:
        2px;

    font-weight:
        700;
}


#factions-panel .fc-header-name {

    margin-top:
        3px;

    color:
        #f4e9f7;

    font-size:
        18px;

    font-weight:
        900;

    letter-spacing:
        .7px;
}


#factions-panel .fc-header-motto {

    margin-top:
        3px;

    color:
        var(--fc-text-soft);

    font-size:
        10px;

    line-height:
        1.35;

    font-style:
        italic;
}


/* ================================================================
   CLOSE BUTTON
   ================================================================ */

#factions-panel .fc-close {

    position:
        relative;

    z-index:
        2;

    flex:
        0 0 42px;

    width:
        42px;

    height:
        42px;

    margin-left:
        18px;

    border:
        1px solid var(--fc-border-light);

    border-radius:
        3px;

    background:
        linear-gradient(
            180deg,
            #19121f,
            #0c0910
        );

    color:
        #d8cce0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        28px;

    line-height:
        36px;

    cursor:
        pointer;

    transition:
        .18s ease;
}


#factions-panel .fc-close:hover {

    color:
        #fff;

    border-color:
        var(--fc-purple-bright);

    background:
        #21132b;

    box-shadow:
        0 0 16px rgba(126, 63, 176, .3);
}


/* ================================================================
   MAIN NAVIGATION
   ================================================================ */

#factions-panel .fc-tabs {

    display:
        flex;

    align-items:
        stretch;

    gap:
        5px;

    min-height:
        49px;

    padding:
        6px 12px;

    background:
        linear-gradient(
            180deg,
            #100c15,
            #0b0910
        );

    border-bottom:
        1px solid var(--fc-border);

    overflow-x:
        auto;

    scrollbar-width:
        thin;

    scrollbar-color:
        var(--fc-purple-dark)
        transparent;
}


#factions-panel .faction-tab {

    position:
        relative;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        7px;

    flex:
        0 0 auto;

    min-width:
        92px;

    padding:
        9px 14px;

    border:
        1px solid #2a2032;

    border-radius:
        3px;

    background:
        linear-gradient(
            180deg,
            #17111d,
            #0e0a13
        );

    color:
        #95889e;

    font-family:
        inherit;

    font-size:
        10px;

    font-weight:
        800;

    letter-spacing:
        .7px;

    text-transform:
        uppercase;

    cursor:
        pointer;

    transition:
        all .18s ease;
}


#factions-panel .faction-tab:hover {

    color:
        #e9dff0;

    border-color:
        #59436b;

    background:
        linear-gradient(
            180deg,
            #21162a,
            #120d18
        );
}


#factions-panel .faction-tab.active {

    color:
        #fff;

    border-color:
        #8c4bb3;

    background:
        linear-gradient(
            180deg,
            #432058,
            #24122f
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 0 14px rgba(126, 63, 176, .2);
}


#factions-panel .faction-tab.active::after {

    content:
        "";

    position:
        absolute;

    left:
        12px;

    right:
        12px;

    bottom:
        -7px;

    height:
        2px;

    background:
        var(--fc-purple-bright);

    box-shadow:
        0 0 10px var(--fc-purple);
}


#factions-panel .faction-tab-throne {

    border-color:
        rgba(200, 168, 90, .45);
}


#factions-panel .faction-tab-throne:hover,
#factions-panel .faction-tab-throne.active {

    border-color:
        var(--fc-gold);

    color:
        var(--fc-gold-bright);

    background:
        linear-gradient(
            180deg,
            #382c18,
            #191209
        );

    box-shadow:
        0 0 15px rgba(200, 168, 90, .14);
}


#factions-panel .faction-tab-create {

    margin-left:
        auto;

    border-color:
        rgba(126, 63, 176, .45);

    color:
        #c79de0;
}


#factions-panel .tab-glyph {

    color:
        var(--fc-purple-bright);

    font-family:
        Georgia,
        serif;

    font-size:
        13px;

    line-height:
        1;
}


#factions-panel .faction-tab-throne .tab-glyph {

    color:
        var(--fc-gold-bright);
}


/* ================================================================
   IDENTITY STRIP
   ================================================================ */

#factions-panel .fc-identity-strip {

    display:
        flex;

    align-items:
        stretch;

    min-height:
        83px;

    border-bottom:
        1px solid var(--fc-border);

    background:
        linear-gradient(
            90deg,
            rgba(15, 10, 19, .98),
            rgba(10, 8, 13, .98)
        );
}


#factions-panel .fc-identity-description {

    flex:
        1;

    min-width:
        300px;

    padding:
        15px 24px;
}


#factions-panel .fc-identity-label {

    color:
        var(--fc-purple-bright);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        2px;
}


#factions-panel .fc-description {

    max-width:
        760px;

    margin-top:
        5px;

    color:
        #9d919f;

    font-family:
        Arial,
        sans-serif;

    font-size:
        11px;

    line-height:
        1.45;
}


#factions-panel .fc-identity-stats {

    display:
        grid;

    grid-template-columns:
        repeat(4, minmax(105px, 1fr));

    width:
        50%;

    border-left:
        1px solid var(--fc-border);
}


#factions-panel .fc-stat {

    display:
        flex;

    flex-direction:
        column;

    justify-content:
        center;

    padding:
        10px 15px;

    border-right:
        1px solid rgba(48, 36, 58, .65);
}


#factions-panel .fc-stat span {

    color:
        var(--fc-text-dim);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1.5px;
}


#factions-panel .fc-stat strong {

    margin-top:
        5px;

    color:
        #e8ddec;

    font-size:
        12px;

    font-weight:
        900;

    white-space:
        nowrap;

    overflow:
        hidden;

    text-overflow:
        ellipsis;
}


#factions-panel .fc-stat strong:first-letter {

    color:
        var(--fc-gold);
}


/* ================================================================
   CONTENT
   ================================================================ */

#factions-panel .fc-content {

    position:
        relative;

    min-height:
        0;

    padding:
        20px 22px 24px;

    background:
        radial-gradient(
            ellipse at 50% 0%,
            rgba(126, 63, 176, .055),
            transparent 55%
        );
}


#factions-panel .fc-section-heading {

    display:
        flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    margin-bottom:
        15px;

    padding:
        0 3px;
}


#factions-panel .fc-kicker {

    color:
        var(--fc-purple-bright);

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        2.5px;
}


#factions-panel .fc-title {

    position:
        relative;

    margin:
        4px 0 0;

    padding-left:
        12px;

    color:
        #f2e9f4;

    font-size:
        24px;

    font-weight:
        900;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-title::before {

    content:
        "";

    position:
        absolute;

    left:
        0;

    top:
        3px;

    bottom:
        3px;

    width:
        3px;

    background:
        linear-gradient(
            180deg,
            var(--fc-purple-bright),
            var(--fc-purple-dark)
        );

    box-shadow:
        0 0 8px rgba(169, 91, 221, .35);
}


#factions-panel .fc-network {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1.2px;

    text-transform:
        uppercase;
}


#factions-panel .fc-network-dot {

    display:
        inline-block;

    width:
        6px;

    height:
        6px;

    border-radius:
        50%;

    background:
        var(--fc-green);

    box-shadow:
        0 0 8px rgba(99, 184, 121, .75);
}


/* ================================================================
   DYNAMIC AREA
   ================================================================ */

#factions-panel .fc-dynamic {

    width:
        100%;

    min-width:
        0;
}


/* ================================================================
   GENERAL GRID
   ================================================================ */

#factions-panel .fc-grid {

    display:
        grid;

    width:
        100%;

    min-width:
        0;

    grid-template-columns:
        repeat(12, minmax(0, 1fr));

    gap:
        12px;
}


#factions-panel .fc-grid > .fc-card {

    width:
        100%;

    min-width:
        0;

    box-sizing:
        border-box;
}


#factions-panel .span-12 {

    grid-column:
        span 12 !important;
}


#factions-panel .span-8 {

    grid-column:
        span 8 !important;
}


#factions-panel .span-7 {

    grid-column:
        span 7 !important;
}


#factions-panel .span-6 {

    grid-column:
        span 6 !important;
}


#factions-panel .span-5 {

    grid-column:
        span 5 !important;
}


#factions-panel .span-4 {

    grid-column:
        span 4 !important;
}


/* ================================================================
   CARDS
   ================================================================ */

#factions-panel .fc-card {

    position:
        relative;

    min-width:
        0;

    overflow:
        hidden;

    border:
        1px solid var(--fc-border);

    background:
        linear-gradient(
            145deg,
            rgba(24, 17, 30, .98),
            rgba(10, 8, 13, .98)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.025),
        0 8px 22px rgba(0,0,0,.25);
}


#factions-panel .fc-card::before {

    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    width:
        70px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            var(--fc-purple),
            transparent
        );
}


#factions-panel .fc-card::after {

    content:
        "";

    position:
        absolute;

    right:
        0;

    bottom:
        0;

    width:
        55px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(200,168,90,.55)
        );
}


#factions-panel .fc-card-head {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    min-height:
        52px;

    padding:
        11px 15px;

    border-bottom:
        1px solid rgba(48,36,58,.8);

    background:
        linear-gradient(
            180deg,
            rgba(35,24,43,.65),
            rgba(16,11,21,.65)
        );
}


#factions-panel .fc-card-title {

    color:
        #e9dff0;

    font-size:
        12px;

    font-weight:
        900;

    letter-spacing:
        .8px;

    text-transform:
        uppercase;
}


#factions-panel .fc-card-subtitle {

    margin-top:
        3px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.3;
}


#factions-panel .fc-card-body {

    padding:
        14px;
}


/* ================================================================
   HOUSE COMMAND — MAIN FEATURE
   ================================================================ */

#factions-panel .fc-house-command {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        285px;

    gap:
        14px;
}


/* ================================================================
   HOUSE GRID
   ================================================================ */

#factions-panel .fc-house-list {

    display:
        grid;

    grid-template-columns:
        repeat(6, minmax(0, 1fr));

    gap:
        6px;

    max-height:
        none;

    overflow:
        visible;
}


#factions-panel .fc-house-item {

    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        0;

    min-height:
        88px;

    padding:
        7px 4px 6px;

    border:
        1px solid #2b2133;

    background:
        linear-gradient(
            145deg,
            #17111d,
            #0c0910
        );

    color:
        var(--fc-text-soft);

    font-family:
        inherit;

    cursor:
        pointer;

    transition:
        .16s ease;

    overflow:
        hidden;
}


#factions-panel .fc-house-item::before {

    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        50%;

    width:
        0;

    height:
        1px;

    background:
        var(--fc-purple-bright);

    transform:
        translateX(-50%);

    transition:
        .16s ease;
}


#factions-panel .fc-house-item:hover {

    transform:
        translateY(-1px);

    border-color:
        #634674;

    background:
        linear-gradient(
            145deg,
            #21152a,
            #100b15
        );

    box-shadow:
        0 5px 14px rgba(0,0,0,.45),
        0 0 12px rgba(126,63,176,.1);
}


#factions-panel .fc-house-item:hover::before {

    width:
        70%;
}


#factions-panel .fc-house-item.selected {

    border-color:
        var(--fc-gold);

    background:
        linear-gradient(
            145deg,
            #2b2115,
            #130e0a
        );

    box-shadow:
        inset 0 0 18px rgba(200,168,90,.06),
        0 0 13px rgba(200,168,90,.12);
}


#factions-panel .fc-house-item.selected::before {

    width:
        70%;

    background:
        var(--fc-gold);
}


/* ================================================================
   HOUSE SIGIL
   ================================================================ */

#factions-panel .fc-house-sigil {

    display:
        block;

    width:
        43px;

    height:
        43px;

    object-fit:
        contain;

    object-position:
        center;

    margin-bottom:
        5px;

    filter:
        drop-shadow(
            0 2px 4px rgba(0,0,0,.8)
        );

    transition:
        transform .16s ease,
        filter .16s ease;
}


#factions-panel .fc-house-item:hover .fc-house-sigil {

    transform:
        scale(1.05);

    filter:
        drop-shadow(
            0 0 7px rgba(126,63,176,.35)
        );
}


#factions-panel .fc-house-item.selected .fc-house-sigil {

    filter:
        drop-shadow(
            0 0 8px rgba(200,168,90,.3)
        );
}


#factions-panel .fc-house-name {

    width:
        100%;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        #b9acbf;

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        .2px;

    text-align:
        center;
}


#factions-panel .fc-house-item.selected .fc-house-name {

    color:
        var(--fc-gold-bright);
}


/* ================================================================
   HOUSE SEARCH
   ================================================================ */

#factions-panel .fc-house-search {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    margin-bottom:
        9px;
}


#factions-panel .fc-house-search input {

    flex:
        1;

    min-width:
        0;

    height:
        34px;

    padding:
        0 10px;

    border:
        1px solid #34273e;

    background:
        #09070c;

    color:
        #e8dfeb;

    font-family:
        Arial,
        sans-serif;

    font-size:
        10px;

    outline:
        none;
}


#factions-panel .fc-house-search input:focus {

    border-color:
        var(--fc-purple);

    box-shadow:
        0 0 10px rgba(126,63,176,.14);
}


#factions-panel .fc-house-search input::placeholder {

    color:
        #5d5362;
}


/* ================================================================
   HOUSE DETAIL PANEL
   ================================================================ */

#factions-panel .fc-house-detail {

    min-width:
        0;

    border:
        1px solid var(--fc-border);

    background:
        radial-gradient(
            circle at 50% 10%,
            rgba(126,63,176,.13),
            transparent 48%
        ),
        #0c0910;
}


#factions-panel .fc-house-detail-header {

    text-align:
        center;

    padding:
        18px 14px 13px;

    border-bottom:
        1px solid var(--fc-border);
}


#factions-panel .fc-house-detail-sigil {
    width: 92px;
    height: 92px;
    object-fit: contain;
    margin: 0 auto 8px;

    filter:
        drop-shadow(
            0 0 13px rgba(126,63,176,.25)
        );
}

/* LARGE SELECTED HOUSE SIGIL */
#factions-panel .fc-selected-house-sigil {
    display: block;

    width: 120px;
    height: 120px;

    object-fit: contain;

    margin: 16px auto;

    filter:
        drop-shadow(
            0 0 13px rgba(126,63,176,.25)
        );
}

#factions-panel .fc-house-detail-name {

    color:
        #eee5f1;

    font-size:
        18px;

    font-weight:
        900;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-house-detail-subtitle {

    margin-top:
        4px;

    color:
        var(--fc-purple-bright);

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        2px;

    text-transform:
        uppercase;
}


/* ================================================================
   HOUSE DETAIL STATS
   ================================================================ */

#factions-panel .fc-house-detail-stats {

    display:
        grid;

    grid-template-columns:
        repeat(2, 1fr);

    border-bottom:
        1px solid var(--fc-border);
}


#factions-panel .fc-house-detail-stat {

    padding:
        10px;

    text-align:
        center;

    border-right:
        1px solid rgba(48,36,58,.7);

    border-bottom:
        1px solid rgba(48,36,58,.7);
}


#factions-panel .fc-house-detail-stat:nth-child(2n) {

    border-right:
        0;
}


#factions-panel .fc-house-detail-stat-label {

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


#factions-panel .fc-house-detail-stat-value {

    margin-top:
        3px;

    color:
        #ddd1e3;

    font-size:
        11px;

    font-weight:
        900;
}


/* ================================================================
   HOUSE COMMAND ROSTER
   ================================================================ */

#factions-panel .fc-house-command-list {

    display:
        grid;

    gap:
        5px;

    padding:
        10px;
}


#factions-panel .fc-command-row {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    min-height:
        34px;

    padding:
        5px 7px;

    border:
        1px solid #29202f;

    background:
        rgba(255,255,255,.015);
}


#factions-panel .fc-command-rank {

    flex:
        0 0 24px;

    color:
        var(--fc-purple-bright);

    font-size:
        10px;

    text-align:
        center;
}


#factions-panel .fc-command-name {

    flex:
        1;

    min-width:
        0;

    color:
        #c9bdce;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;

    overflow:
        hidden;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


#factions-panel .fc-command-role {

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    letter-spacing:
        .5px;

    text-transform:
        uppercase;
}


/* ================================================================
   PAGINATION
   ================================================================ */

#factions-panel .fc-pagination {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        5px;

    margin-top:
        10px;
}


#factions-panel .fc-pagination button,
#factions-panel .fc-page-btn {

    min-width:
        28px;

    height:
        28px;

    padding:
        0 8px;

    border:
        1px solid #34273e;

    background:
        #100c15;

    color:
        #8f8298;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    cursor:
        pointer;
}


#factions-panel .fc-pagination button:hover,
#factions-panel .fc-page-btn:hover {

    border-color:
        var(--fc-purple);

    color:
        #e4d9e8;
}


#factions-panel .fc-pagination button.active,
#factions-panel .fc-page-btn.active {

    border-color:
        var(--fc-gold);

    background:
        #251b0e;

    color:
        var(--fc-gold-bright);
}


/* ================================================================
   BUTTONS
   ================================================================ */

#factions-panel .fc-btn {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        34px;

    padding:
        0 13px;

    border:
        1px solid #493657;

    border-radius:
        2px;

    background:
        linear-gradient(
            180deg,
            #21152a,
            #110c16
        );

    color:
        #cbbbd2;

    font-family:
        inherit;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .7px;

    cursor:
        pointer;

    transition:
        .16s ease;
}


#factions-panel .fc-btn:hover {

    border-color:
        var(--fc-purple-bright);

    color:
        #fff;

    background:
        linear-gradient(
            180deg,
            #382047,
            #170e20
        );

    box-shadow:
        0 0 12px rgba(126,63,176,.15);
}


#factions-panel .fc-btn.primary {

    border-color:
        #8150a0;

    background:
        linear-gradient(
            180deg,
            #5a2d75,
            #321743
        );

    color:
        #f5eaf8;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.07);
}


#factions-panel .fc-btn.primary:hover {

    border-color:
        #bb6fe7;

    background:
        linear-gradient(
            180deg,
            #713c92,
            #412052
        );
}


#factions-panel .fc-btn.danger {

    border-color:
        rgba(141,48,56,.7);

    color:
        #d77b81;

    background:
        linear-gradient(
            180deg,
            #2b1116,
            #13090c
        );
}


#factions-panel .fc-btn.danger:hover {

    border-color:
        var(--fc-red-bright);

    color:
        #f4b5b9;
}


/* ================================================================
   MINI BUTTONS
   ================================================================ */

#factions-panel .fc-mini-btn {

    min-width:
        48px;

    height:
        24px;

    padding:
        0 7px;

    border:
        1px solid #3c2d48;

    background:
        #120d17;

    color:
        #a992b0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        900;

    cursor:
        pointer;
}


#factions-panel .fc-mini-btn:hover {

    border-color:
        var(--fc-purple);

    color:
        #eee3f1;

    background:
        #1e1426;
}


/* ================================================================
   ACTION ROW
   ================================================================ */

#factions-panel .fc-action-row {

    display:
        flex;

    align-items:
        center;

    flex-wrap:
        wrap;

    gap:
        7px;

    margin-top:
        12px;
}


/* ================================================================
   ROSTER
   ================================================================ */

#factions-panel .fc-roster {

    display:
        grid;

    gap:
        6px;
}


#factions-panel .fc-member {

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    padding:
        8px;

    border:
        1px solid #2a2031;

    background:
        rgba(255,255,255,.015);
}


#factions-panel .fc-member-index {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 28px;

    width:
        28px;

    height:
        28px;

    border:
        1px solid #493657;

    color:
        var(--fc-purple-bright);

    font-size:
        10px;
}


#factions-panel .fc-member-name {

    color:
        #d5c9da;

    font-family:
        Arial,
        sans-serif;

    font-size:
        10px;

    font-weight:
        800;
}


#factions-panel .fc-member-role {

    margin-top:
        2px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    letter-spacing:
        1px;
}


/* ================================================================
   RANK BOX
   ================================================================ */

#factions-panel .fc-rank-box {

    padding:
        11px 12px;

    border:
        1px solid #30243a;

    background:
        linear-gradient(
            145deg,
            #17111d,
            #0c0910
        );
}


#factions-panel .fc-rank-box.active {

    border-color:
        rgba(126,63,176,.65);

    background:
        linear-gradient(
            145deg,
            #21152b,
            #0e0913
        );

    box-shadow:
        inset 3px 0 0 var(--fc-purple);
}


#factions-panel .fc-rank-label {

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.5px;
}


#factions-panel .fc-rank-name {

    margin-top:
        4px;

    color:
        #ded2e3;

    font-size:
        12px;

    font-weight:
        900;
}


/* ================================================================
   HIERARCHY
   ================================================================ */

#factions-panel .fc-hierarchy {

    display:
        grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap:
        8px;
}


/* ================================================================
   ELECTIONS
   ================================================================ */

#factions-panel .fc-election-card {

    padding:
        11px;

    border:
        1px solid #30243a;

    background:
        #0d0a11;
}


#factions-panel .fc-election-title {

    color:
        var(--fc-purple-bright);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        900;

    letter-spacing:
        1.5px;
}


#factions-panel .fc-election-status {

    margin-top:
        5px;

    color:
        #c9bdcf;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.55;
}


#factions-panel .fc-vote-line {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        65px
        auto;

    align-items:
        center;

    gap:
        8px;

    min-height:
        35px;

    padding:
        5px 8px;

    border-bottom:
        1px solid rgba(48,36,58,.6);
}


#factions-panel .fc-vote-name {

    color:
        #cfc3d4;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    overflow:
        hidden;

    white-space:
        nowrap;

    text-overflow:
        ellipsis;
}


#factions-panel .fc-vote-count {

    color:
        #8d8192;

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;
}


#factions-panel .fc-vote-result {

    color:
        var(--fc-gold);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        900;

    letter-spacing:
        1px;
}


/* ================================================================
   TABLE
   ================================================================ */

#factions-panel .fc-table {

    width:
        100%;

    border-collapse:
        collapse;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;
}


#factions-panel .fc-table th {

    padding:
        9px;

    border-bottom:
        1px solid var(--fc-border-light);

    color:
        var(--fc-purple-bright);

    text-align:
        left;

    font-size:
        7px;

    letter-spacing:
        1.2px;

    text-transform:
        uppercase;
}


#factions-panel .fc-table td {

    padding:
        9px;

    border-bottom:
        1px solid rgba(48,36,58,.6);

    color:
        #b9aebd;
}


#factions-panel .fc-table tr:hover td {

    background:
        rgba(126,63,176,.045);
}


/* ================================================================
   CREATE FACTION
   ================================================================ */

#factions-panel .fc-create-note {

    padding:
        10px;

    border:
        1px solid #33263d;

    background:
        rgba(126,63,176,.045);

    color:
        #9e92a5;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.5;
}


#factions-panel .fc-create-note strong {

    color:
        #d5c3dc;
}


#factions-panel .fc-form-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        11px;

    margin-top:
        13px;
}


#factions-panel .fc-field {

    min-width:
        0;
}


#factions-panel .fc-field.full {

    grid-column:
        1 / -1;
}


#factions-panel .fc-field label {

    display:
        block;

    margin-bottom:
        5px;

    color:
        #9a8da0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-field input,
#factions-panel .fc-field textarea,
#factions-panel .fc-field select {

    width:
        100%;

    border:
        1px solid #34273e;

    background:
        #09070c;

    color:
        #ddd3e0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        10px;

    outline:
        none;

    transition:
        .15s ease;
}


#factions-panel .fc-field input,
#factions-panel .fc-field select {

    height:
        35px;

    padding:
        0 10px;
}


#factions-panel .fc-field textarea {

    min-height:
        90px;

    padding:
        9px 10px;

    resize:
        vertical;
}


#factions-panel .fc-field input:focus,
#factions-panel .fc-field textarea:focus,
#factions-panel .fc-field select:focus {

    border-color:
        var(--fc-purple);

    box-shadow:
        0 0 10px rgba(126,63,176,.12);
}


/* ================================================================
   MESSAGE
   ================================================================ */

#factions-panel .fc-message {

    min-height:
        17px;

    margin-top:
        8px;

    color:
        var(--fc-green);

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;
}


#factions-panel .fc-message.error {

    color:
        var(--fc-red-bright);
}


/* ================================================================
   EMPTY / ERROR STATES
   ================================================================ */

#factions-panel .fc-state {

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        260px;

    padding:
        35px;

    border:
        1px solid var(--fc-border);

    background:
        radial-gradient(
            circle at 50% 35%,
            rgba(126,63,176,.09),
            transparent 50%
        ),
        #0c0910;

    text-align:
        center;
}


#factions-panel .fc-state-mark {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        62px;

    height:
        62px;

    border:
        1px solid var(--fc-border-light);

    color:
        var(--fc-purple-bright);

    font-size:
        16px;

    font-weight:
        900;

    box-shadow:
        inset 0 0 20px rgba(126,63,176,.08);
}


#factions-panel .fc-state-title {

    margin-top:
        14px;

    color:
        #e4d9e8;

    font-size:
        15px;

    font-weight:
        900;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-state-text {

    max-width:
        520px;

    margin-top:
        7px;

    color:
        #847987;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.5;
}


/* ================================================================
   EMPTY CARD
   ================================================================ */

#factions-panel .fc-empty {

    padding:
        28px 15px;

    border:
        1px dashed #33263d;

    text-align:
        center;

    background:
        rgba(255,255,255,.01);
}


#factions-panel .fc-empty-title {

    color:
        var(--fc-purple-bright);

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        1.5px;
}


#factions-panel .fc-empty-text {

    margin-top:
        6px;

    color:
        #766c7c;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.45;
}


/* ================================================================
   LOADING
   ================================================================ */

#factions-panel .fc-loading {

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        300px;

    border:
        1px solid var(--fc-border);

    background:
        radial-gradient(
            circle,
            rgba(126,63,176,.09),
            transparent 50%
        ),
        #0b080f;
}


#factions-panel .fc-loading-mark {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        64px;

    height:
        64px;

    border:
        1px solid var(--fc-purple-dark);

    color:
        var(--fc-purple-bright);

    font-size:
        16px;

    font-weight:
        900;

    animation:
        fcPulse 2s infinite;
}


#factions-panel .fc-loading-title {

    margin-top:
        15px;

    color:
        #d8cddd;

    font-size:
        11px;

    font-weight:
        900;

    letter-spacing:
        1.5px;
}


#factions-panel .fc-loading-text {

    margin-top:
        5px;

    color:
        #675d6d;

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;
}
/* ================================================================
   FOOTER
   ================================================================ */

#factions-panel .fc-footer {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    min-height:
        49px;

    padding:
        7px 14px;

    border-top:
        1px solid var(--fc-border);

    background:
        linear-gradient(
            180deg,
            #110c16,
            #09070c
        );

    box-shadow:
        0 -8px 25px rgba(0,0,0,.25);
}


#factions-panel .fc-footer-brand {

    display:
        flex;

    align-items:
        center;

    gap:
        7px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    font-weight:
        800;

    letter-spacing:
        1.2px;

    text-transform:
        uppercase;
}


#factions-panel .fc-footer-chain {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    color:
        #746979;

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1px;
}


#factions-panel .fc-footer-chain i {

    color:
        var(--fc-gold);

    font-style:
        normal;
}


#factions-panel .fc-footer-actions {

    display:
        flex;

    align-items:
        center;

    gap:
        6px;
}


#factions-panel .fc-footer-btn {

    min-height:
        30px;

    padding:
        0 11px;

    border:
        1px solid #33263d;

    background:
        #120d17;

    color:
        #95889e;

    font-family:
        inherit;

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .7px;

    cursor:
        pointer;

    transition:
        .16s ease;
}


#factions-panel .fc-footer-btn:hover {

    border-color:
        var(--fc-purple);

    color:
        #e8ddec;

    background:
        #1c1324;
}


#factions-panel .fc-footer-throne {

    border-color:
        rgba(200,168,90,.35);

    color:
        #c9aa60;
}


#factions-panel .fc-footer-throne:hover {

    border-color:
        var(--fc-gold);

    color:
        var(--fc-gold-bright);

    background:
        #21170c;
}


/* ================================================================
   HOUSE / FACTION STATUS
   ================================================================ */

#factions-panel .fc-status-line {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    letter-spacing:
        .8px;
}


#factions-panel .fc-status-value {

    color:
        #d7cbdc;

    font-weight:
        800;
}


#factions-panel .fc-status-value.gold {

    color:
        var(--fc-gold-bright);
}


#factions-panel .fc-status-value.purple {

    color:
        var(--fc-purple-bright);
}


/* ================================================================
   COMMAND PANELS
   ================================================================ */

#factions-panel .fc-command-panel {

    padding:
        13px;

    border:
        1px solid var(--fc-border);

    background:
        linear-gradient(
            145deg,
            rgba(25,18,31,.95),
            rgba(11,8,14,.98)
        );
}


#factions-panel .fc-command-panel-title {

    color:
        #ddd2e4;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-command-panel-description {

    margin-top:
        4px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    line-height:
        1.45;
}


/* ================================================================
   DIPLOMACY
   ================================================================ */

#factions-panel .fc-diplomacy-list {

    display:
        grid;

    gap:
        7px;
}


#factions-panel .fc-diplomacy-row {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        auto;

    align-items:
        center;

    gap:
        10px;

    padding:
        9px;

    border:
        1px solid #2b2133;

    background:
        rgba(255,255,255,.012);
}


#factions-panel .fc-diplomacy-name {

    color:
        #d1c5d7;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    font-weight:
        800;
}


#factions-panel .fc-diplomacy-status {

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        .8px;

    text-transform:
        uppercase;
}


#factions-panel .fc-diplomacy-status.hostile {

    color:
        var(--fc-red-bright);
}


#factions-panel .fc-diplomacy-status.allied {

    color:
        var(--fc-green);
}


#factions-panel .fc-diplomacy-status.neutral {

    color:
        var(--fc-gold);
}


/* ================================================================
   COMMUNICATION
   ================================================================ */

#factions-panel .fc-chat {

    display:
        grid;

    grid-template-rows:
        minmax(180px, 1fr)
        auto;

    min-height:
        300px;

    border:
        1px solid var(--fc-border);

    background:
        #09070c;
}


#factions-panel .fc-chat-messages {

    overflow-y:
        auto;

    padding:
        10px;
}


#factions-panel .fc-chat-message {

    padding:
        7px 8px;

    border-bottom:
        1px solid rgba(48,36,58,.45);
}


#factions-panel .fc-chat-author {

    color:
        var(--fc-purple-bright);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    font-weight:
        900;
}


#factions-panel .fc-chat-text {

    margin-top:
        3px;

    color:
        #b8acbd;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    line-height:
        1.4;
}


#factions-panel .fc-chat-compose {

    display:
        flex;

    gap:
        6px;

    padding:
        8px;

    border-top:
        1px solid var(--fc-border);
}


#factions-panel .fc-chat-compose input {

    flex:
        1;

    min-width:
        0;

    height:
        32px;

    padding:
        0 9px;

    border:
        1px solid #34273e;

    background:
        #0c0910;

    color:
        #ddd3e0;

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    outline:
        none;
}


/* ================================================================
   WARLORD
   ================================================================ */

#factions-panel .fc-warlord {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        220px;

    gap:
        12px;
}


#factions-panel .fc-warlord-profile {

    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    padding:
        12px;

    border:
        1px solid var(--fc-border);

    background:
        #0d0a11;
}


#factions-panel .fc-warlord-mark {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 58px;

    width:
        58px;

    height:
        58px;

    border:
        1px solid var(--fc-border-light);

    color:
        var(--fc-gold-bright);

    background:
        radial-gradient(
            circle,
            rgba(200,168,90,.12),
            transparent 65%
        );
}


#factions-panel .fc-warlord-name {

    color:
        #e5d9e9;

    font-size:
        14px;

    font-weight:
        900;

    letter-spacing:
        .8px;
}


#factions-panel .fc-warlord-title {

    margin-top:
        3px;

    color:
        var(--fc-gold);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.2px;

    text-transform:
        uppercase;
}


/* ================================================================
   CREATE / FORM ACTIONS
   ================================================================ */

#factions-panel .fc-create-actions {

    display:
        flex;

    align-items:
        center;

    justify-content:
        flex-end;

    gap:
        8px;

    margin-top:
        14px;

    padding-top:
        12px;

    border-top:
        1px solid rgba(48,36,58,.65);
}


#factions-panel .fc-create-message {

    min-height:
        17px;

    margin-top:
        8px;

    color:
        var(--fc-green);

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    font-weight:
        700;
}


#factions-panel .fc-create-message.error {

    color:
        var(--fc-red-bright);
}


/* ================================================================
   FACTION LIST
   ================================================================ */

#factions-panel .fc-faction-list {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        8px;
}


#factions-panel .fc-faction-item {

    position:
        relative;

    min-width:
        0;

    padding:
        12px;

    border:
        1px solid #2d2235;

    background:
        linear-gradient(
            145deg,
            #17111d,
            #0d0a11
        );

    cursor:
        pointer;

    transition:
        .16s ease;
}


#factions-panel .fc-faction-item:hover {

    border-color:
        #61456f;

    background:
        linear-gradient(
            145deg,
            #21152a,
            #100b15
        );

    transform:
        translateY(-1px);
}


#factions-panel .fc-faction-item.active {

    border-color:
        var(--fc-gold);

    box-shadow:
        0 0 14px rgba(200,168,90,.08);
}


#factions-panel .fc-faction-name {

    color:
        #ded3e3;

    font-size:
        12px;

    font-weight:
        900;

    letter-spacing:
        .7px;

    text-transform:
        uppercase;
}


#factions-panel .fc-faction-motto {

    margin-top:
        4px;

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        8px;

    line-height:
        1.4;
}


#factions-panel .fc-faction-meta {

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        10px;

    margin-top:
        9px;

    color:
        #8d8291;

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    letter-spacing:
        .6px;

    text-transform:
        uppercase;
}


/* ================================================================
   PROFILE / DETAIL
   ================================================================ */

#factions-panel .fc-profile-header {

    display:
        flex;

    align-items:
        center;

    gap:
        13px;

    padding:
        13px;

    border:
        1px solid var(--fc-border);

    background:
        linear-gradient(
            145deg,
            #1b1322,
            #0d0a11
        );
}


#factions-panel .fc-profile-crest {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 72px;

    width:
        72px;

    height:
        72px;

    border:
        1px solid var(--fc-border-light);

    background:
        radial-gradient(
            circle,
            rgba(126,63,176,.18),
            rgba(8,6,10,.95)
        );
}


#factions-panel .fc-profile-name {

    color:
        #eee6f1;

    font-size:
        17px;

    font-weight:
        900;

    letter-spacing:
        1px;

    text-transform:
        uppercase;
}


#factions-panel .fc-profile-motto {

    margin-top:
        4px;

    color:
        var(--fc-text-soft);

    font-family:
        Arial,
        sans-serif;

    font-size:
        9px;

    font-style:
        italic;
}


/* ================================================================
   SEPARATORS
   ================================================================ */

#factions-panel .fc-divider {

    width:
        100%;

    height:
        1px;

    margin:
        12px 0;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--fc-border),
            transparent
        );
}


/* ================================================================
   TOOLTIP / SMALL LABEL
   ================================================================ */

#factions-panel .fc-label {

    color:
        var(--fc-text-dim);

    font-family:
        Arial,
        sans-serif;

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        1.2px;

    text-transform:
        uppercase;
}


/* ================================================================
   PULSE
   ================================================================ */

@keyframes fcPulse {

    0%,
    100% {

        opacity:
            .55;

        box-shadow:
            0 0 0 rgba(126,63,176,0);
    }

    50% {

        opacity:
            1;

        box-shadow:
            0 0 22px rgba(126,63,176,.25);
    }
}


/* ================================================================
   RESPONSIVE — MEDIUM
   ================================================================ */

@media (max-width: 1100px) {

    #factions-panel .fc-house-command {

        grid-template-columns:
            1fr;
    }

    #factions-panel .fc-house-detail {

        display:
            grid;

        grid-template-columns:
            230px
            1fr;
    }

    #factions-panel .fc-house-detail-header {

        border-right:
            1px solid var(--fc-border);

        border-bottom:
            0;
    }

    #factions-panel .fc-house-detail-stats {

        grid-template-columns:
            repeat(4, 1fr);
    }

    #factions-panel .fc-house-detail-stat {

        border-bottom:
            0;
    }

    #factions-panel .fc-identity-stats {

        width:
            55%;
    }

    #factions-panel .fc-warlord {

        grid-template-columns:
            1fr;
    }
}


/* ================================================================
   RESPONSIVE — TABLET
   ================================================================ */

@media (max-width: 850px) {

    #factions-panel .fc-header {

        flex-wrap:
            wrap;

        gap:
            12px;
    }

    #factions-panel .fc-brand {

        min-width:
            100%;

        padding-right:
            50px;
    }

    #factions-panel .fc-header-identity {

        flex:
            1;

        min-width:
            0;

        max-width:
            none;
    }

    #factions-panel .fc-close {

        position:
            absolute;

        top:
            18px;

        right:
            18px;

        margin-left:
            0;
    }

    #factions-panel .fc-identity-strip {

        flex-direction:
            column;
    }

    #factions-panel .fc-identity-description {

        min-width:
            0;
    }

    #factions-panel .fc-identity-stats {

        width:
            100%;

        border-left:
            0;

        border-top:
            1px solid var(--fc-border);
    }

    #factions-panel .fc-house-list {

        grid-template-columns:
            repeat(5, minmax(0, 1fr));
    }

    #factions-panel .fc-faction-list {

        grid-template-columns:
            1fr;
    }

    #factions-panel .fc-footer-chain {

        display:
            none;
    }
}


/* ================================================================
   RESPONSIVE — MOBILE
   ================================================================ */

@media (max-width: 600px) {

    #factions-panel .fc-header {

        padding:
            16px;
    }

    #factions-panel .fc-brand-title {

        font-size:
            23px;
    }

    #factions-panel .fc-header-identity {

        width:
            100%;
    }

    #factions-panel .fc-tabs {

        padding:
            5px;

        gap:
            4px;
    }

    #factions-panel .faction-tab {

        min-width:
            82px;

        padding:
            8px 9px;

        font-size:
            8px;
    }

    #factions-panel .fc-identity-stats {

        grid-template-columns:
            repeat(2, 1fr);
    }

    #factions-panel .fc-content {

        padding:
            14px 10px;
    }

    #factions-panel .fc-section-heading {

        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            8px;
    }

    #factions-panel .fc-grid {

        grid-template-columns:
            1fr;
    }

    #factions-panel .span-12,
    #factions-panel .span-8,
    #factions-panel .span-7,
    #factions-panel .span-6,
    #factions-panel .span-5,
    #factions-panel .span-4 {

        grid-column:
            span 1 !important;
    }

    #factions-panel .fc-house-list {

        grid-template-columns:
            repeat(4, minmax(0, 1fr));
    }

    #factions-panel .fc-house-item {

        min-height:
            78px;
    }

    #factions-panel .fc-house-sigil {

        width:
            35px;

        height:
            35px;
    }

    #factions-panel .fc-house-detail {

        display:
            block;
    }

    #factions-panel .fc-house-detail-header {

        border-right:
            0;

        border-bottom:
            1px solid var(--fc-border);
    }

    #factions-panel .fc-house-detail-stats {

        grid-template-columns:
            repeat(2, 1fr);
    }

    #factions-panel .fc-vote-line {

        grid-template-columns:
            minmax(0, 1fr)
            auto;

        gap:
            5px;
    }

    #factions-panel .fc-vote-result {

        display:
            none;
    }

    #factions-panel .fc-form-grid {

        grid-template-columns:
            1fr;
    }

    #factions-panel .fc-field.full {

        grid-column:
            auto;
    }

    #factions-panel .fc-footer {

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            8px;

        padding:
            9px;
    }

    #factions-panel .fc-footer-actions {

        width:
            100%;
    }

    #factions-panel .fc-footer-btn {

        flex:
            1;
    }
}


/* ================================================================
   VERY SMALL
   ================================================================ */

@media (max-width: 420px) {

    #factions-panel .fc-house-list {

        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    #factions-panel .fc-house-sigil {

        width:
            32px;

        height:
            32px;
    }

    #factions-panel .fc-header-crest {

        flex-basis:
            50px;

        width:
            50px;

        height:
            50px;
    }

    #factions-panel .fc-header-name {

        font-size:
            15px;
    }
}

/* ======================================================================
   HOUSE FACTION SLOTS
   ====================================================================== */

#factions-panel .fc-house-faction-roster {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#factions-panel .fc-house-faction-slot {
    min-height: 68px;
}

#factions-panel .fc-house-faction-sigil {
    width: 46px;
    height: 46px;
    min-width: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

#factions-panel .fc-house-faction-sigil img {
    width: 100%;
    height: 100%;

    display: block;
    object-fit: contain;
}

#factions-panel .fc-house-faction-slot.is-empty {
    opacity: 0.58;
}

#factions-panel .fc-house-faction-sigil.is-empty {
    font-size: 24px;
    font-weight: 400;
}