@charset "UTF-8";

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.btb-app {
    --app-bg: #0b1821;
    --app-bg2: #10232e;
    --app-card: #122631;
    --app-card2: #0c1c25;

    --app-gold: #b4854d;
    --app-gold-light: #d0a46c;
    --app-gold-dark: #6f4d2d;

    --app-text: #c9c4ba;
    --app-muted: #87969a;
    --app-blue: #7898a7;

    width: calc(100% - 8px);
    max-width: 760px;

    margin: 8px auto 12px;
    padding: 16px;

    box-sizing: border-box;

    color: var(--app-text);

    font-family: Georgia, "Times New Roman", serif;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(75,115,138,.14),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #10232e 0%,
            #09151d 100%
        );

    border: 1px solid rgba(180,133,77,.55);

box-shadow: none;

}

.btb-app *,
.btb-app *:before,
.btb-app *:after {
    box-sizing: border-box;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-main-title {
    margin: 2px 0 5px;

    color: var(--app-gold-light);

    font-size: 22px;
    font-weight: normal;
    letter-spacing: 4px;
    text-align: center;
    text-transform: uppercase;

    text-shadow: 0 1px 2px #000;
}

.app-main-subtitle {
    color: var(--app-muted);

    font-size: 10px;
    font-style: italic;
    letter-spacing: 1.1px;
    text-align: center;
}

.app-main-line {
    width: 72%;
    height: 1px;

    margin: 17px auto 20px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--app-gold-dark),
            var(--app-gold-light),
            var(--app-gold-dark),
            transparent
        );
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-note {
    margin-bottom: 20px;
    padding: 14px 17px;

    color: #adb7b7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.62;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.96),
            rgba(10,27,36,.98)
        );

    border-left: 2px solid rgba(120,152,167,.58);
    border-top: 1px solid rgba(180,133,77,.17);
    border-right: 1px solid rgba(180,133,77,.17);
    border-bottom: 1px solid rgba(180,133,77,.17);
}

.app-note-row {
    position: relative;

    margin-bottom: 7px;
    padding-left: 15px;
}

.app-note-row:last-child {
    margin-bottom: 0;
}

.app-note-row:before {
    content: "\2726";

    position: absolute;
    left: 0;
    top: 1px;

    color: var(--app-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}

.app-note b {
    color: var(--app-gold-light);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-topic-name {
    margin-bottom: 20px;
    padding: 10px 14px;

    color: #9eabad;

    font-size: 9px;
    font-style: italic;
    text-align: center;

    background: rgba(0,0,0,.16);

    border-top: 1px solid rgba(180,133,77,.20);
    border-bottom: 1px solid rgba(180,133,77,.20);
}

.app-topic-name b {
    color: var(--app-gold-light);
    font-style: normal;
}


/* =========================================================
   &#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-images {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;

    margin-bottom: 8px;
}

.app-image {
    width: 200px;
    height: 115px;
    flex: 0 0 200px;

    overflow: hidden;

    background: #08151c;

    border: 1px solid rgba(180,133,77,.27);
}

.app-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    filter:
        saturate(.82)
        brightness(.82)
        contrast(1.03);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-appearance {
    margin-bottom: 19px;

    color: #8d9ea3;

    font-size: 9px;
    font-style: italic;
    letter-spacing: 1px;
    text-align: center;
}

.app-appearance b {
    color: var(--app-gold-light);
    font-style: normal;
}


/* =========================================================
   &#65533;&#65533;&#65533;
   ========================================================= */

.app-namebox {
    margin-bottom: 10px;
    padding: 14px 15px;

    text-align: center;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.08),
            rgba(180,133,77,.13),
            rgba(180,133,77,.08),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.28);
    border-bottom: 1px solid rgba(180,133,77,.28);
}

.app-name-en {
    color: var(--app-gold-light);

    font-size: 20px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
}

.app-name-ru {
    margin-top: 4px;

    color: #93a2a5;

    font-size: 10px;
    font-style: italic;
    letter-spacing: .8px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-info {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;

    margin-bottom: 20px;

    overflow: hidden;

    background: rgba(180,133,77,.12);

    border: 1px solid rgba(180,133,77,.24);
}

.app-info-row,
.app-info-wide,
.app-info-row-wide {
    min-width: 0;

    padding: 10px 12px;

    color: #aeb8b7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.55;

    background:
        linear-gradient(
            180deg,
            rgba(18,39,50,.98),
            rgba(10,27,36,.98)
        );
}

.app-info-wide,
.app-info-row-wide {
    grid-column: 1 / -1;
}

.app-label {
    color: #d0ccc3;
    font-weight: bold;
}

.app-value {
    color: #8fa1a5;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-section {
    margin-top: 12px;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.96),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.24);

    box-shadow:
        inset 0 0 18px rgba(0,0,0,.15);
}

.app-section-title {
    padding: 8px 10px;

    color: var(--app-gold-light);

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.6px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.19);

    border-bottom: 1px solid rgba(180,133,77,.19);
}

.app-section-body {
    padding: 14px 16px;

    color: #b5bab7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.68;
    text-align: justify;
}

.app-section-body p {
    margin: 0 0 11px;
}

.app-section-body p:last-child {
    margin-bottom: 0;
}

.app-section-body b {
    color: #d0ccc3;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-list-row {
    position: relative;

    margin-bottom: 8px;
    padding-left: 15px;
}

.app-list-row:last-child {
    margin-bottom: 0;
}

.app-list-row:before {
    content: "\2726";

    position: absolute;

    left: 0;
    top: 1px;

    color: var(--app-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-hint {
    margin-top: 9px;
    padding: 9px 11px;

    color: #7f9196;

    font-size: 9px;
    font-style: italic;
    line-height: 1.55;

    background: rgba(0,0,0,.16);

    border-left: 2px solid rgba(120,152,167,.40);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-form-divider {
    margin: 27px 0 18px;
    padding: 10px;

    color: var(--app-gold-light);

    font-size: 14px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.10),
            rgba(180,133,77,.16),
            rgba(180,133,77,.10),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.30);
    border-bottom: 1px solid rgba(180,133,77,.30);
}

.app-form {
    padding: 15px;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.96),
            rgba(9,25,33,.98)
        );

    border: 1px solid rgba(180,133,77,.28);

    box-shadow:
        inset 0 0 22px rgba(0,0,0,.18);
}

.app-form-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.app-form-section {
    grid-column: 1 / -1;

    margin: 7px 0 0;
    padding: 7px 10px;

    color: var(--app-gold-light);

    font-size: 9px;
    font-weight: bold;
    letter-spacing: 1.4px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.16);

    border-top: 1px solid rgba(180,133,77,.17);
    border-bottom: 1px solid rgba(180,133,77,.17);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-field {
    min-width: 0;
}

.app-field-wide {
    grid-column: 1 / -1;
}

.app-field-label {
    margin-bottom: 4px;

    color: #bda580;

    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: bold;
    line-height: 1.4;
}

.app-field-label span {
    color: #718994;

    font-weight: normal;
    font-style: italic;
}

.btb-app .app-input,
.btb-app .app-select,
.btb-app .app-textarea {
    display: block;

    width: 100%;

    margin: 0;
    padding: 8px 10px;

    box-sizing: border-box;

    color: #ccd1ce !important;
    -webkit-text-fill-color: #ccd1ce;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.45;

    background:
        linear-gradient(
            180deg,
            rgba(27,53,65,.97),
            rgba(17,39,49,.98)
        ) !important;

    border: 1px solid rgba(120,152,167,.25) !important;
    border-radius: 0 !important;

    outline: none !important;

    box-shadow:
        inset 0 0 10px rgba(0,0,0,.13);

    transition:
        border-color .2s ease,
        background .2s ease;
}

.btb-app .app-input,
.btb-app .app-select {
    height: 35px;
}

.btb-app .app-textarea {
    min-height: 130px;

    resize: vertical;
}

.btb-app .app-textarea-short {
    min-height: 75px;
}

.btb-app .app-input:focus,
.btb-app .app-select:focus,
.btb-app .app-textarea:focus {
    border-color: rgba(180,133,77,.52) !important;

    background:
        linear-gradient(
            180deg,
            rgba(31,59,72,.98),
            rgba(19,43,54,.99)
        ) !important;
}

.btb-app .app-input::placeholder,
.btb-app .app-textarea::placeholder {
    color: #71868d !important;
    -webkit-text-fill-color: #71868d;

    opacity: 1;
}

.btb-app .app-select option {
    color: #c9cecb;

    background: #132c37;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-copy-wrap {
    margin-top: 16px;
    padding-top: 15px;

    text-align: center;

    border-top: 1px solid rgba(180,133,77,.18);
}

.btb-copy-button {
    min-width: 300px;

    padding: 11px 22px;

    cursor: pointer;

    color: var(--app-gold-light) !important;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.2px;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.15),
            rgba(13,31,40,.97)
        ) !important;

    border: 1px solid rgba(180,133,77,.48) !important;
    border-radius: 0 !important;

    box-shadow:
        inset 0 -2px 0 rgba(180,133,77,.18),
        0 2px 6px rgba(0,0,0,.18);

    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease,
        transform .1s ease;
}

.btb-copy-button:hover {
    color: #e0b477 !important;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.23),
            rgba(16,37,47,.99)
        ) !important;

    border-color: rgba(208,164,108,.72) !important;
}

.btb-copy-button:active {
    transform: translateY(1px);
}

.btb-copy-button.app-copy-success {
    color: #dfc18f !important;

    border-color: rgba(208,164,108,.72) !important;
}

.app-copy-caption {
    margin-top: 7px;

    color: #71858b;

    font-size: 8.5px;
    font-style: italic;
    line-height: 1.45;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-footer {
    margin-top: 20px;
    padding-top: 12px;

    color: #73868b;

    font-size: 9px;
    font-style: italic;
    line-height: 1.55;
    text-align: center;

    border-top: 1px solid rgba(180,133,77,.22);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533; &#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.app-form,
.app-field,
.app-field-label,
.app-copy-caption {
    text-transform: none !important;
}

.app-field-label {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 10px !important;
    font-weight: normal !important;
    letter-spacing: .15px !important;
}

.app-field-label span {
    font-family: Arial, sans-serif !important;
    font-size: 9px !important;
    text-transform: none !important;
}

.btb-app .app-input,
.btb-app .app-select,
.btb-app .app-textarea,
.btb-app .app-select option {
    font-family: Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: normal !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

.btb-app .app-input::placeholder,
.btb-app .app-textarea::placeholder {
    font-family: Arial, sans-serif !important;
    text-transform: none !important;
}

/* =========================================================
   SAFE HTML &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;, &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; iframe.
   ========================================================= */

/* =========================================================
   BACK TO BLACK &#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;
   ========================================================= */

.btb-template {
    --btb-bg: #0b1821;
    --btb-bg2: #10232e;
    --btb-card: #122631;
    --btb-card2: #0c1c25;

    --btb-gold: #b4854d;
    --btb-gold-light: #d0a46c;
    --btb-gold-dark: #6f4d2d;

    --btb-text: #c9c4ba;
    --btb-body: #b9bcb7;
    --btb-muted: #87969a;
    --btb-blue: #7898a7;

    width: calc(100% - 8px);
    max-width: 760px;

    margin: 8px auto 12px;
    padding: 16px;

    box-sizing: border-box;

    color: var(--btb-text);
    font-family: Georgia, "Times New Roman", serif;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(75,115,138,.14),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #10232e 0%,
            #09151d 100%
        );

    border: 1px solid rgba(180,133,77,.55);

    /* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;. */
    box-shadow: none;
}

.btb-template *,
.btb-template *:before,
.btb-template *:after {
    box-sizing: border-box;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-template-title {
    margin: 2px 0 5px;

    color: var(--btb-gold-light);

    font-size: 24px;
    font-weight: normal;
    line-height: 1.2;
    letter-spacing: 4.5px;
    text-align: center;
    text-transform: uppercase;

    text-shadow: 0 1px 2px #000;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-template-subtitle {
    color: var(--btb-muted);

    font-size: 9.5px;
    font-style: italic;
    line-height: 1.45;
    letter-spacing: 1.1px;
    text-align: center;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-template-line {
    width: 72%;
    height: 1px;

    margin: 17px auto 20px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--btb-gold-dark),
            var(--btb-gold-light),
            var(--btb-gold-dark),
            transparent
        );
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-body-text {
    color: var(--btb-body);

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.62;
}

.btb-body-text b {
    color: #d2cec5;
}

.btb-body-text i {
    color: var(--btb-blue);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#1192;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-panel {
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.97),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.27);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; / &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533; */

.btb-note {
    color: #aeb7b8;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.62;

    background: rgba(0,0,0,.17);

    border: 1px solid rgba(180,133,77,.22);
}

.btb-note b {
    color: var(--btb-gold-light);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-section {
    margin-top: 25px;
}

.btb-section:first-of-type {
    margin-top: 0;
}

.btb-section-title {
    margin-bottom: 10px;
    padding: 7px 10px;

    color: var(--btb-gold-light);

    font-size: 12px;
    font-weight: bold;
    line-height: 1.35;
    letter-spacing: 2.2px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.11),
            rgba(180,133,77,.18),
            rgba(180,133,77,.11),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.34);
    border-bottom: 1px solid rgba(180,133,77,.34);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-caption {
    color: var(--btb-muted);

    font-size: 9.5px;
    font-style: italic;
    line-height: 1.5;
    text-align: center;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-template-footer {
    margin-top: 20px;
    padding-top: 11px;

    color: #78888e;

    font-size: 9px;
    font-style: italic;
    line-height: 1.5;
    text-align: center;

    border-top: 1px solid rgba(180,133,77,.22);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-template a {
    color: var(--btb-gold-light);
}

.btb-template a:hover {
    color: #e0b477;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.race-main-subtitle {
    margin-bottom: 16px;
    letter-spacing: 1.3px;
}

.race-line {
    margin: 0 auto 17px;
}

.race-intro {
    margin-bottom: 22px;
    padding: 13px 17px;

    text-align: justify;
}

.race-intro-note {
    display: block;

    margin-top: 8px;

    color: var(--btb-muted);

    font-family: Georgia, serif;
    font-style: italic;
}

.race-section-title {
    margin-bottom: 12px;
}

.race-section-note {
    max-width: 720px;

    margin: -2px auto 13px;
}

.race-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;
}

.race-card {
    min-width: 0;
}

.race-image {
    position: relative;

    width: 100%;
    height: 115px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #132b38,
            #0a1820
        );

    border-bottom: 1px solid rgba(180,133,77,.25);
}

.race-image:after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 55%;

    pointer-events: none;

    background:
        linear-gradient(
            to top,
            rgba(7,18,24,.88),
            transparent
        );
}

.race-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    filter:
        saturate(.72)
        contrast(.95)
        brightness(.78);
}

.race-name {
    position: relative;

    margin-top: -26px;
    padding: 0 10px 9px;

    z-index: 2;

    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1.7px;
    text-align: center;
    text-transform: uppercase;

    text-shadow:
        0 1px 2px #000,
        0 0 5px #000;
}

.race-text {
    padding: 10px 12px 12px;

    text-align: justify;
}

.race-subtype {
    margin-top: 8px;
    padding-top: 7px;

    border-top: 1px solid rgba(180,133,77,.15);
}

.race-subtype:first-child {
    margin-top: 0;
    padding-top: 0;

    border-top: 0;
}

.race-subtype-title {
    color: var(--btb-gold-light);

    font-family: Georgia, serif;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: .7px;
}

.race-card-wide {
    grid-column: 1 / -1;
}

.race-card-wide .race-image {
    height: 135px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.plot-main-title {
    margin-bottom: 7px;
}

.plot-main-subtitle {
    margin-top: 8px;

    line-height: 1.55;
    letter-spacing: .7px;
}

.plot-main-line {
    margin: 18px auto 23px;
}

.plot-box {
    padding: 15px 17px;

    text-align: justify;
}

.plot-box p {
    margin: 0 0 11px;
}

.plot-box p:last-child {
    margin-bottom: 0;
}

.plot-sides {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 11px;

    margin-top: 11px;
}

.plot-side-title {
    padding: 9px 10px;

    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1.4px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.2);

    border-bottom: 1px solid rgba(180,133,77,.22);
}

.plot-side-subtitle {
    padding: 6px 9px;

    border-bottom: 1px solid rgba(180,133,77,.12);
}

.plot-side-text {
    padding: 12px 13px;

    text-align: justify;
}

.plot-conflict {
    margin-top: 11px;
    padding: 13px 16px;

    text-align: justify;

    border-left: 2px solid rgba(120,152,167,.6);
}

.plot-conflict i {
    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
    line-height: 1.55;
}

.plot-question {
    text-align: center;
}

.plot-news {
    margin-top: 29px;
}

.plot-news-title {
    margin-bottom: 5px;

    color: var(--btb-gold-light);

    font-size: 14px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;
}

.plot-news-subtitle {
    margin-bottom: 13px;

    letter-spacing: .7px;
}

.plot-news-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 9px;
}

.plot-news-item {
    position: relative;

    padding: 11px 12px 11px 25px;

    color: #b1b8b7;

    font-family: Arial, sans-serif;
    font-size: 9.5px;
    line-height: 1.58;
    text-align: justify;

    background:
        linear-gradient(
            180deg,
            rgba(18,38,49,.93),
            rgba(9,25,33,.96)
        );

    border: 1px solid rgba(180,133,77,.20);
}

.plot-news-item:before {
    content: "\2726";

    position: absolute;

    left: 10px;
    top: 11px;

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}

.plot-news-item b {
    color: #d0ccc3;
}

.plot-news-spoiler {
    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.60),
            rgba(9,25,33,.52)
        );

    border-top: 1px solid rgba(180,133,77,.28);
    border-bottom: 1px solid rgba(180,133,77,.28);
}

.plot-news-spoiler summary {
    position: relative;

    display: block;

    padding: 14px 45px 13px;

    cursor: pointer;
    list-style: none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.05),
            rgba(180,133,77,.09),
            rgba(180,133,77,.05),
            transparent
        );

    transition: background .2s ease;
}

.plot-news-spoiler summary::-webkit-details-marker {
    display: none;
}

.plot-news-spoiler summary::marker {
    display: none;
    content: "";
}

.plot-news-spoiler summary:hover {
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.09),
            rgba(180,133,77,.14),
            rgba(180,133,77,.09),
            transparent
        );
}

.plot-news-spoiler summary:after {
    content: "+";

    position: absolute;

    right: 16px;
    top: 50%;

    transform: translateY(-50%);

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 17px;
}

.plot-news-spoiler[open] summary:after {
    content: "-";
}

.plot-news-spoiler[open] summary {
    margin-bottom: 13px;

    border-bottom: 1px solid rgba(180,133,77,.17);
}

.plot-news-spoiler .plot-news-title {
    margin-bottom: 4px;
}

.plot-news-spoiler .plot-news-subtitle {
    margin-bottom: 0;
}

.plot-news-spoiler .plot-news-grid {
    padding: 0 13px 13px;
}


/* =========================================================
   FAQ &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.faq-main-subtitle {
    margin-bottom: 16px;
    letter-spacing: 1.3px;
}

.faq-main-line {
    margin: 0 auto 19px;
}

.faq-tab-control {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.faq-tab-labels {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 7px;
}

.faq-tab {
    display: block;

    padding: 11px 14px;

    cursor: pointer;

    color: var(--btb-muted);

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.6px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(18,39,50,.96),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.24);

    transition:
        color .2s ease,
        border-color .2s ease,
        background .2s ease;
}

.faq-tab:hover {
    color: var(--btb-body);

    border-color: rgba(180,133,77,.42);
}

#faq-tab-questions:checked ~ .faq-tab-labels label[for="faq-tab-questions"],
#faq-tab-rules:checked ~ .faq-tab-labels label[for="faq-tab-rules"] {
    color: var(--btb-gold-light);

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.14),
            rgba(13,31,40,.98)
        );

    border-color: rgba(180,133,77,.55);

    box-shadow: inset 0 -2px 0 rgba(180,133,77,.18);
}

.faq-panels {
    margin-top: 20px;
}

.faq-panel {
    display: none;
}

#faq-tab-questions:checked ~ .faq-panels .faq-panel-questions,
#faq-tab-rules:checked ~ .faq-panels .faq-panel-rules {
    display: block;
}

.faq-section {
    margin-top: 24px;
}

.faq-section:first-child {
    margin-top: 0;
}

.faq-item {
    padding: 13px 15px 14px;

    border-top: 1px solid rgba(180,133,77,.15);
}

.faq-item:first-child,
.rule-item:first-child {
    border-top: 0;
}

.faq-question {
    margin-bottom: 6px;

    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: .5px;
}

.faq-question:before {
    content: "&#65533; ";

    color: var(--btb-gold-dark);
}

.faq-answer,
.rule-text {
    text-align: justify;
}

.faq-link {
    color: var(--btb-gold-light) !important;
    text-decoration: none !important;
}

.faq-link:hover {
    color: #e0b477 !important;
    text-decoration: underline !important;
}

.rule-item {
    display: grid;

    grid-template-columns: 34px minmax(0, 1fr);

    gap: 10px;

    padding: 12px 15px;

    border-top: 1px solid rgba(180,133,77,.15);
}

.rule-number {
    display: flex;

    align-items: flex-start;
    justify-content: center;

    padding-top: 1px;

    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
    font-weight: bold;
}

.rule-number:after {
    content: ".";
}

.rules-note {
    margin-top: 10px;
    padding: 10px 13px;

    background: rgba(0,0,0,.15);

    border-top: 1px solid rgba(180,133,77,.18);
    border-bottom: 1px solid rgba(180,133,77,.18);
}

.faq-final {
    margin-top: 25px;
    padding: 16px 20px;

    text-align: center;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.07),
            rgba(0,0,0,.15)
        );

    border-top: 1px solid rgba(180,133,77,.35);
    border-bottom: 1px solid rgba(180,133,77,.35);
}

.faq-final-title {
    color: var(--btb-gold-light);

    font-size: 12px;
    font-weight: bold;
    letter-spacing: .5px;
}

.faq-final-text {
    margin-top: 5px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-faces-subtitle {
    margin-bottom: 16px;
    letter-spacing: 1.4px;
}

.ap-faces-line {
    margin: 0 auto 16px;
}

.ap-faces-note {
    margin: 0 0 18px;
    padding: 11px 15px;

    text-align: center;
}

.ap-faces-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(0, 1fr);

    gap: 11px;

    align-items: start;
}

.ap-column {
    min-width: 0;
}

.ap-column-title {
    margin: 0 0 8px;
    padding: 7px 8px;

    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            rgba(111,77,45,.16),
            rgba(180,133,77,.12),
            rgba(111,77,45,.16)
        );

    border-top: 1px solid rgba(180,133,77,.4);
    border-bottom: 1px solid rgba(180,133,77,.4);
}

.ap-group {
    margin-bottom: 9px;
}

.ap-group:last-child {
    margin-bottom: 0;
}

.ap-group-letter {
    padding: 5px 7px;

    color: #bda580;

    font-size: 9px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.22);

    border-bottom: 1px solid rgba(180,133,77,.24);
}

.ap-list {
    height: auto;
    overflow: visible;

padding: 8px 9px;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.55;
}

.ap-person {
    padding: 3px 0;

    border-bottom: 1px solid rgba(255,255,255,.04);
}

.ap-person:last-child {
    border-bottom: 0;
}

.ap-face {
    color: #d2d3ce;
}

.ap-character {
    color: #8599a3;
}

.ap-person .dash {
    margin: 0 4px;

    color: var(--btb-gold-dark);
}

.ap-character-link {
    color: var(--btb-gold-light) !important;
    text-decoration: none !important;
}

.ap-character-link:hover {
    color: #e0b477 !important;
    text-decoration: underline !important;
}

.ap-registry {
    margin-bottom: 10px;
}

.ap-registry:last-child {
    margin-bottom: 0;
}

.ap-registry-title {
    padding: 6px;

    color: #bda580;

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.22);

    border-bottom: 1px solid rgba(180,133,77,.25);
}

.ap-registry-list {
    height: auto;
    overflow: visible;

padding: 8px 10px;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.55;
}

.ap-letter {
    margin: 8px 0 3px;

    color: var(--btb-gold-light);

    font-family: Georgia, serif;
    font-size: 9px;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.ap-letter:first-child {
    margin-top: 0;
}

.ap-name {
    padding: 2px 0;

    color: #bbc1c0;

    border-bottom: 1px solid rgba(255,255,255,.035);
}

.ap-name span {
    color: var(--btb-blue);
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;
   ========================================================= */

@media screen and (max-width: 700px) {

    .btb-template {
        padding: 13px;
    }

    .race-grid,
    .plot-sides,
    .plot-news-grid,
    .faq-tab-labels,
    .ap-faces-grid {
        grid-template-columns: 1fr;
    }

    .race-card-wide {
        grid-column: auto;
    }

    .race-image,
    .race-card-wide .race-image {
        height: 140px;
    }

    .plot-box,
    .plot-side-text,
    .plot-conflict,
    .plot-news-item,
    .faq-answer,
    .rule-text {
        text-align: left;
    }

    .plot-news-spoiler summary {
        padding-left: 20px;
        padding-right: 40px;
    }

    .faq-item,
    .rule-item {
        padding: 12px;
    }

    .rule-item {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: 7px;
    }
}

/* =========================================================
   &#65533;&#65533;&#65533; / &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   &#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533; .btb-* &#65533;&#65533;&#65533;&#65533;.
   ========================================================= */

.press-main-subtitle {
    margin-bottom: 17px;
    letter-spacing: 1.2px;
}

.press-main-line {
    margin: 0 auto 24px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.press-section {
    margin-top: 28px;
}

.press-section:first-of-type {
    margin-top: 0;
}

.press-section-title {
    margin-bottom: 5px;

    color: var(--btb-gold-light);

    font-size: 14px;
    font-weight: bold;
    line-height: 1.35;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;
}

.press-section-subtitle {
    margin-bottom: 14px;
    letter-spacing: .6px;
}

.press-section-line {
    width: 82%;
    height: 1px;

    margin: 0 auto 14px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.32),
            transparent
        );
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.press-publications {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 10px;
}

.press-publication-wide {
    grid-column: 1 / -1;
}

.press-publication-name {
    padding: 8px 10px;

    color: var(--btb-gold-light);

    font-size: 10px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 1.7px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.20);

    border-bottom: 1px solid rgba(180,133,77,.20);
}

.press-publication-text {
    padding: 11px 13px 13px;

    text-align: justify;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533; */

.press-news-wrap {
    margin-top: 4px;
    padding: 13px;

    background: rgba(0,0,0,.12);

    border: 1px solid rgba(180,133,77,.22);
}

.press-tab-control {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.press-tabs {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 6px;

    margin-bottom: 11px;
}

.press-tab {
    display: flex;

    min-height: 39px;

    align-items: center;
    justify-content: center;

    padding: 7px 8px;

    cursor: pointer;

    color: #7f8e92;

    font-size: 9px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: 1.1px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(20,42,53,.72),
            rgba(9,24,32,.92)
        );

    border: 1px solid rgba(180,133,77,.20);

    transition:
        color .2s ease,
        border-color .2s ease,
        background .2s ease;
}

.press-tab:hover {
    color: var(--btb-gold-light);

    border-color: rgba(180,133,77,.48);
}

#press-daily:checked ~ .press-tabs label[for="press-daily"],
#press-quibbler:checked ~ .press-tabs label[for="press-quibbler"],
#press-witch:checked ~ .press-tabs label[for="press-witch"] {
    color: var(--btb-gold-light);

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.14),
            rgba(13,31,40,.96)
        );

    border-color: rgba(180,133,77,.55);
    border-bottom-color: var(--btb-gold);
}

.press-panel {
    display: none;
}

#press-daily:checked ~ .press-panels .press-panel-daily,
#press-quibbler:checked ~ .press-panels .press-panel-quibbler,
#press-witch:checked ~ .press-panels .press-panel-witch {
    display: block;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.press-news-head {
    margin-bottom: 8px;
    padding: 10px 12px;

    text-align: center;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.09),
            rgba(180,133,77,.13),
            rgba(180,133,77,.09),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.24);
    border-bottom: 1px solid rgba(180,133,77,.24);
}

.press-news-name {
    color: var(--btb-gold-light);

    font-size: 12px;
    font-weight: bold;
    line-height: 1.35;
    letter-spacing: 2px;
    text-align: center;
    text-transform: uppercase;
}

.press-news-tagline {
    margin-top: 3px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.press-articles {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 8px;
}

.press-article {
    position: relative;

    padding: 12px 13px 12px 26px;

    text-align: justify;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.95),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.19);
}

.press-article:before {
    content: "\2726";

    position: absolute;

    top: 12px;
    left: 10px;

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}

.press-article-title {
    display: block;

    margin-bottom: 5px;

    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 10.5px;
    font-weight: bold;
    line-height: 1.4;
}

.press-article-wide {
    grid-column: 1 / -1;
}


/* &#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.press-how {
    margin-top: 28px;
}

.press-how-title {
    margin-bottom: 10px;
    padding: 7px 10px;

    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 1.4px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.12),
            rgba(180,133,77,.18),
            rgba(180,133,77,.12),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.32);
    border-bottom: 1px solid rgba(180,133,77,.32);
}

.press-how-box {
    padding: 13px 15px;
}

.press-how-item {
    position: relative;

    margin-bottom: 7px;
    padding-left: 15px;
}

.press-how-item:last-child {
    margin-bottom: 0;
}

.press-how-item:before {
    content: "\2726";

    position: absolute;

    left: 0;
    top: 1px;

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

@media screen and (max-width: 700px) {

    .press-publications,
    .press-articles,
    .press-tabs {
        grid-template-columns: 1fr;
    }

    .press-publication-wide,
    .press-article-wide {
        grid-column: auto;
    }

    .press-publication-text,
    .press-article {
        text-align: left;
    }
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.btb-template .btb-template-line {
    display: block !important;

    width: 72% !important;
    height: 1px !important;
    min-height: 1px !important;

    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--btb-gold-dark),
            var(--btb-gold-light),
            var(--btb-gold-dark),
            transparent
        ) !important;

    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

/* =========================================================
   BACK TO BLACK &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; / &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; ASCII &#65533; CSS + hex escapes, &#65533;&#65533;&#65533;&#65533;&#65533; RusFF &#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   HTML-entities &#65533;&#65533;&#65533;&#65533;&#65533; &#65291; &#65533; &#10022; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;.
   ========================================================= */

/* &#65533;&#65533;&#65533;&#65533;&#65533;: &#65533;&#65533;&#65533;&#65533; / &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.plot-news-spoiler summary:after {
    content: "+" !important;
}

.plot-news-spoiler[open] summary:after {
    content: "-" !important;
}

/* &#65533;&#65533;&#65533;&#65533;&#65533;: &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.plot-news-item:before {
    content: "\2726" !important;
}

/* FAQ: &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.faq-question:before {
    content: "\2022" !important;
    display: inline-block;
    margin-right: 5px;
    color: var(--btb-gold-dark);
}

/* &#65533;&#65533;&#65533;: &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.press-article:before,
.press-how-item:before {
    content: "\2726" !important;
}

/* &#65533;&#65533;&#65533;&#65533;: &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.race-text ul {
    margin: 6px 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.race-text li {
    position: relative;
    margin: 2px 0 !important;
    padding: 0 0 0 13px !important;
    list-style: none !important;
}

.race-text li:before {
    content: "\2022" !important;

    position: absolute;
    left: 2px;
    top: 0;

    color: var(--btb-gold);
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-style: normal;
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */




/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */





/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.pb-head {
    margin-bottom: 9px;
    padding: 7px 10px;

    color: var(--btb-gold-light);

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.7px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.11),
            rgba(180,133,77,.17),
            rgba(180,133,77,.11),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.30);
    border-bottom: 1px solid rgba(180,133,77,.30);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.pb-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1px;

    overflow: hidden;

    background: rgba(180,133,77,.12);

    border: 1px solid rgba(180,133,77,.25);
}

.pb-family {
    position: relative;

    min-width: 0;

    padding: 10px 13px;

    color: #adb6b7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.45;

    background:
        linear-gradient(
            180deg,
            rgba(18,39,50,.98),
            rgba(10,27,36,.98)
        );
}

.pb-family-en {
    color: #d2cec5;

    font-family: Georgia, "Times New Roman", serif;
    font-weight: bold;
}

.pb-family-dash {
    margin: 0 5px;

    color: var(--btb-gold-dark);
}

.pb-family-ru {
    color: #8fa0a4;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; / &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.pb-family-dead {
    opacity: .58;
}

.pb-family-dead .pb-family-en,
.pb-family-dead .pb-family-ru,
.pb-family-dead .pb-family-dash {
    text-decoration: line-through;
    text-decoration-color: rgba(180,133,77,.7);
}

.pb-star {
    margin-left: 3px;

    color: var(--btb-gold-light);

    font-family: Georgia, serif;

    text-decoration: none !important;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.pb-note {
    margin-top: 18px;
    padding: 13px 15px;

    color: #9ca8aa;

    font-family: Arial, sans-serif;
    font-size: 9.5px;
    line-height: 1.6;

    background: rgba(0,0,0,.17);

    border-left: 2px solid rgba(120,152,167,.58);
    border-top: 1px solid rgba(180,133,77,.14);
    border-right: 1px solid rgba(180,133,77,.14);
    border-bottom: 1px solid rgba(180,133,77,.14);
}

.pb-note-row + .pb-note-row {
    margin-top: 5px;
}

.pb-note-mark {
    margin-right: 5px;

    color: var(--btb-gold-light);

    font-family: Georgia, serif;
    font-weight: bold;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

@media screen and (max-width: 650px) {


    .pb-grid {
        grid-template-columns: 1fr;
    }
}

/* ========================================================= */

.pb-subtitle {
    letter-spacing: 1.2px;
}

.pb-family {
    line-height: 1.45;
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */




/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */



.vac-main-note {
    max-width: 690px;

    margin: 11px auto 0;

    color: #aab4b5;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.55;
    text-align: center;
}

.vac-main-note b {
    color: var(--btb-gold-light);
}



/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-tab-control {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-tabs {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;

    margin-bottom: 13px;
}

.vac-tab {
    display: flex;

    min-height: 38px;

    align-items: center;
    justify-content: center;

    padding: 7px 8px;

    cursor: pointer;

    color: #819095 !important;

    font-size: 9px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: .8px;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(20,42,53,.74),
            rgba(9,24,32,.92)
        );

    border: 1px solid rgba(180,133,77,.20);

    transition:
        color .2s ease,
        border-color .2s ease,
        background .2s ease;
}

.vac-tab:hover {
    color: var(--btb-gold-light) !important;

    border-color: rgba(180,133,77,.45);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

#vac-hogwarts:checked ~ .vac-tabs label[for="vac-hogwarts"],
#vac-ministry:checked ~ .vac-tabs label[for="vac-ministry"],
#vac-wizengamot:checked ~ .vac-tabs label[for="vac-wizengamot"],
#vac-mungo:checked ~ .vac-tabs label[for="vac-mungo"],
#vac-gringotts:checked ~ .vac-tabs label[for="vac-gringotts"],
#vac-media:checked ~ .vac-tabs label[for="vac-media"],
#vac-sport:checked ~ .vac-tabs label[for="vac-sport"],
#vac-britain:checked ~ .vac-tabs label[for="vac-britain"] {
    color: var(--btb-gold-light) !important;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.14),
            rgba(13,31,40,.96)
        );

    border-color: rgba(180,133,77,.54);

    box-shadow:
        inset 0 -2px 0 rgba(180,133,77,.55);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.vac-tab-link:hover {
    color: var(--btb-gold-light) !important;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.10),
            rgba(13,31,40,.96)
        );
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-panel {
    display: none;
}

#vac-hogwarts:checked ~ .vac-panels .vac-panel-hogwarts,
#vac-ministry:checked ~ .vac-panels .vac-panel-ministry,
#vac-wizengamot:checked ~ .vac-panels .vac-panel-wizengamot,
#vac-mungo:checked ~ .vac-panels .vac-panel-mungo,
#vac-gringotts:checked ~ .vac-panels .vac-panel-gringotts,
#vac-media:checked ~ .vac-panels .vac-panel-media,
#vac-sport:checked ~ .vac-panels .vac-panel-sport,
#vac-britain:checked ~ .vac-panels .vac-panel-britain {
    display: block;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-panel-head {
    margin-bottom: 12px;
    padding: 13px 12px 11px;

    text-align: center;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.08),
            rgba(180,133,77,.13),
            rgba(180,133,77,.08),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.27);
    border-bottom: 1px solid rgba(180,133,77,.27);
}

.vac-panel-title {
    color: var(--btb-gold-light);

    font-size: 14px;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.vac-panel-subtitle {
    margin-top: 4px;

    color: var(--btb-muted);

    font-size: 9px;
    font-style: italic;
    letter-spacing: .5px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-group {
    margin-top: 10px;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.96),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.24);

    box-shadow:
        inset 0 0 18px rgba(0,0,0,.15);
}

.vac-group-title {
    padding: 8px 10px;

    color: var(--btb-gold-light);

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.4px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.19);

    border-bottom: 1px solid rgba(180,133,77,.19);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 1px;

    background: rgba(180,133,77,.10);
}

.vac-row {
    min-width: 0;

    padding: 8px 10px;

    color: #b7bbb7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.5;

    background:
        linear-gradient(
            180deg,
            rgba(14,35,45,.98),
            rgba(11,30,39,.98)
        );
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.vac-row-wide {
    grid-column: 1 / -1;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.vac-role {
    color: #d0ccc3;

    font-weight: bold;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.vac-free {
    color: #819298;

    font-style: italic;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-row a {
    color: var(--btb-gold-light) !important;

    text-decoration: none !important;
}

.vac-row a:hover {
    color: #e0b477 !important;

    text-decoration: underline !important;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.vac-footer {
    margin-top: 20px;
    padding: 15px 18px;

    text-align: center;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.07),
            rgba(0,0,0,.14)
        );

    border-top: 1px solid rgba(180,133,77,.32);
    border-bottom: 1px solid rgba(180,133,77,.32);
}

.vac-footer-title {
    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
}

.vac-footer-text {
    max-width: 700px;

    margin: 6px auto 0;

    color: var(--btb-muted);

    font-size: 9px;
    font-style: italic;
    line-height: 1.55;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

@media screen and (max-width: 650px) {


    .vac-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vac-grid {
        grid-template-columns: 1fr;
    }

    .vac-row-wide {
        grid-column: auto;
    }
}

/* ========================================================= */

.vac-main-subtitle {
    line-height: 1.5;
    letter-spacing: .9px;
}

.vac-main-line {
    margin: 18px auto 20px;
}

/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */
.vac-panel-subtitle {
    font-size: 9.5px;
}

.vac-row {
    font-size: 10px;
}

.vac-footer-text {
    font-size: 9.5px;
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */




/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */





/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-tab-control {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-tabs {
    display: grid;

    grid-template-columns: 1fr 1fr;
    gap: 6px;

    margin-bottom: 12px;
}

.ap-org-tab {
    display: flex;

    min-height: 42px;

    align-items: center;
    justify-content: center;

    padding: 8px 12px;

    cursor: pointer;

    color: #7f8d91;

    font-size: 10px;
    font-weight: bold;
    line-height: 1.35;
    letter-spacing: 1.2px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(20,42,53,.75),
            rgba(9,24,32,.9)
        );

    border: 1px solid rgba(180,133,77,.22);

    transition:
        color .2s ease,
        border-color .2s ease,
        background .2s ease;
}

.ap-org-tab:hover {
    color: var(--btb-gold-light);

    border-color: rgba(180,133,77,.48);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

#ap-org-lrp:checked ~ .ap-org-tabs label[for="ap-org-lrp"],
#ap-org-oom:checked ~ .ap-org-tabs label[for="ap-org-oom"] {
    color: var(--btb-gold-light);

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.15),
            rgba(13,31,40,.95)
        );

    border-color: rgba(180,133,77,.55);

    box-shadow:
        inset 0 -2px 0 rgba(180,133,77,.55);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-panel {
    display: none;
}

#ap-org-lrp:checked ~ .ap-org-panels .ap-org-panel-lrp {
    display: grid;
}

#ap-org-oom:checked ~ .ap-org-panels .ap-org-panel-oom {
    display: grid;
}

.ap-org-panel {
    grid-template-columns:
        minmax(0, 1fr)
        210px;

    gap: 11px;

    align-items: start;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-content {
    min-width: 0;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.97),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.28);

    box-shadow:
        inset 0 0 20px rgba(0,0,0,.2);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-heading {
    padding: 16px 15px 12px;

    text-align: center;

    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.18),
            rgba(0,0,0,0)
        );

    border-bottom: 1px solid rgba(180,133,77,.18);
}

.ap-org-name {
    color: var(--btb-gold-light);

    font-size: 16px;
    font-weight: bold;
    letter-spacing: 2px;
    text-transform: uppercase;

    text-shadow: 0 1px 2px #000;
}

.ap-org-slogan {
    margin-top: 4px;

    color: var(--btb-muted);

    font-size: 10px;
    font-style: italic;
    letter-spacing: .5px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-quote {
    margin: 13px 15px 3px;
    padding: 9px 12px;

    color: #aeb5b5;

    font-size: 10px;
    font-style: italic;
    line-height: 1.5;
    text-align: right;

    background: rgba(0,0,0,.17);

    border-left: 2px solid rgba(120,152,167,.65);
}

.ap-org-quote u {
    text-decoration-color: rgba(180,133,77,.6);
    text-underline-offset: 2px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-text {
    padding: 12px 15px 16px;

    color: #b9bcb7;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.62;
    text-align: justify;
}

.ap-org-text p {
    margin: 0 0 10px;
}

.ap-org-text p:last-child {
    margin-bottom: 0;
}

.ap-org-text b {
    color: #d2cec5;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-subtitle {
    margin: 17px 0 12px;
    padding: 7px 10px;

    color: var(--btb-gold-light);

    font-family: Georgia, serif;
    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.8px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.13),
            rgba(180,133,77,.17),
            rgba(180,133,77,.13),
            transparent
        );

    border-top: 1px solid rgba(180,133,77,.22);
    border-bottom: 1px solid rgba(180,133,77,.22);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-idea {
    position: relative;

    margin-bottom: 8px;
    padding-left: 15px;
}

.ap-org-idea:last-child {
    margin-bottom: 0;
}

.ap-org-idea:before {
    content: "\2726";

    position: absolute;

    left: 0;
    top: 1px;

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}

.ap-org-idea b {
    color: var(--btb-gold-light);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-image {
    position: relative;

    height: 220px;

    margin: 12px 15px 3px;

    overflow: hidden;

    background: #09151d;

    border: 1px solid rgba(180,133,77,.22);
}

.ap-org-image:after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 50%;

    pointer-events: none;

    background:
        linear-gradient(
            to top,
            rgba(6,16,22,.72),
            transparent
        );
}

.ap-org-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    filter:
        saturate(.72)
        brightness(.75)
        contrast(.95);
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-members {
    min-width: 0;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            rgba(19,42,53,.97),
            rgba(10,27,36,.98)
        );

    border: 1px solid rgba(180,133,77,.28);
}

.ap-org-members-title {
    padding: 9px 8px;

    color: var(--btb-gold-light);

    font-size: 10px;
    font-weight: bold;
    letter-spacing: 1.6px;
    text-align: center;
    text-transform: uppercase;

    background: rgba(0,0,0,.22);

    border-bottom: 1px solid rgba(180,133,77,.22);
}

.ap-org-members-list {
    height: auto;
    overflow: visible;

padding: 7px;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-member {
    display: block;

    margin-bottom: 5px;
    padding: 7px 8px;

    color: #aebabc !important;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.35;
    text-decoration: none !important;

    background: rgba(0,0,0,.14);

    border-left: 2px solid rgba(120,152,167,.3);
    border-bottom: 1px solid rgba(255,255,255,.035);

    transition:
        color .2s ease,
        border-color .2s ease,
        background .2s ease;
}

.ap-member:hover {
    color: var(--btb-gold-light) !important;

    background: rgba(180,133,77,.08);

    border-left-color: var(--btb-gold);
}

.ap-member:last-child {
    margin-bottom: 0;
}


/* &#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533; */

.ap-member-empty {
    padding: 16px 8px;

    color: #687b82;

    font-family: Georgia, serif;
    font-size: 9px;
    font-style: italic;
    line-height: 1.5;
    text-align: center;
}


/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */



/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

@media screen and (max-width: 700px) {


    .ap-org-tabs {
        grid-template-columns: 1fr;
    }

    #ap-org-lrp:checked ~ .ap-org-panels .ap-org-panel-lrp,
    #ap-org-oom:checked ~ .ap-org-panels .ap-org-panel-oom {
        grid-template-columns: 1fr;
    }
.ap-org-image {
        height: 170px;
    }
}

.ap-org-main-subtitle {
    margin-bottom: 16px;
    letter-spacing: 1.4px;
}

.ap-org-line {
    margin: 0 auto 18px;
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.ap-org-idea:before {
    content: "\2726" !important;
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   &#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;, &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;, &#65533;&#65533;&#65533;&#65533;&#65533;, &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533; &#65533;&#65533; .btb-*
   ========================================================= */


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-cover {
    position: relative;

    height: 220px;

    margin-bottom: 18px;

    overflow: hidden;

    background: #071219;

    border: 1px solid rgba(180,133,77,.36);

    box-shadow: none;
}

.guest-cover img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    filter:
        saturate(.78)
        brightness(.70)
        contrast(1.02);
}

.guest-cover:after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(4,12,17,.10) 20%,
            rgba(5,15,21,.35) 60%,
            rgba(5,15,21,.88) 100%
        );

    pointer-events: none;
}

.guest-cover-text {
    position: absolute;

    z-index: 2;

    left: 25px;
    right: 25px;
    bottom: 22px;

    text-align: center;
}

.guest-cover-title {
    color: var(--btb-gold-light);

    font-size: 25px;
    font-weight: normal;
    line-height: 1.2;
    letter-spacing: 6px;
    text-transform: uppercase;

    text-shadow:
        0 1px 2px #000,
        0 0 10px rgba(0,0,0,.65);
}

.guest-cover-subtitle {
    margin-top: 5px;

    color: #9eaaac;

    font-size: 9.5px;
    font-style: italic;
    line-height: 1.4;
    letter-spacing: 1.4px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-welcome {
    margin-bottom: 18px;
    padding: 14px 17px;

    text-align: justify;

    border-left: 2px solid rgba(120,152,167,.58);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-links-title {
    margin-bottom: 8px;
}

.guest-links {
    display: grid;

    grid-template-columns: repeat(3, minmax(0,1fr));

    gap: 6px;

    margin-bottom: 20px;
}

.guest-link {
    display: flex;

    min-height: 38px;

    align-items: center;
    justify-content: center;

    padding: 7px 8px;

    color: #89999d !important;

    font-size: 9px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: .8px;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;

    background:
        linear-gradient(
            180deg,
            rgba(20,42,53,.76),
            rgba(9,24,32,.92)
        );

    border: 1px solid rgba(180,133,77,.22);
}

.guest-link:hover {
    color: var(--btb-gold-light) !important;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.10),
            rgba(9,24,32,.94)
        );

    border-color: rgba(180,133,77,.50);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-columns {
    display: grid;

    grid-template-columns: 1.12fr .88fr;

    gap: 11px;

    align-items: stretch;

    margin-bottom: 11px;
}

.guest-columns > .guest-card {
    display: flex;
    flex-direction: column;

    height: auto;
    min-height: 190px;
}

.guest-card {
    overflow: hidden;

    box-shadow: none;
}

.guest-card-title {
    padding: 8px 10px;

    color: var(--btb-gold-light);

    font-size: 10px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 1.5px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.12),
            rgba(180,133,77,.08),
            rgba(0,0,0,.12)
        );

    border-bottom: 1px solid rgba(180,133,77,.20);
}

.guest-card-body {
    flex: 1;
    min-height: 0;

    padding: 10px 13px;

    text-align: justify;
}

.guest-inline-link {
    color: var(--btb-gold-light) !important;
    text-decoration: none !important;
}

.guest-inline-link:hover {
    color: #e0b477 !important;
    text-decoration: underline !important;
}

.guest-rule {
    position: relative;

    margin-bottom: 5px;
    padding-left: 15px;
}

.guest-rule:last-child {
    margin-bottom: 0;
}

.guest-rule:before {
    content: "\2726";

    position: absolute;

    left: 0;
    top: 1px;

    color: var(--btb-gold-dark);

    font-family: Georgia, serif;
    font-size: 8px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-holds-list {
    flex: 1;
    min-height: 0;
    overflow: visible;

padding: 9px 15px;

    color: #b7bfbd;

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.55;
}

.guest-holds-list b {
    color: #d0d2ce;
}

.guest-holds-list a {
    color: var(--btb-gold-light) !important;
    font-weight: bold;
    text-decoration: none !important;
}

.guest-holds-list a:hover {
    color: #e0b477 !important;
    text-decoration: underline !important;
}

.guest-holds-list br {
    display: block;

    content: "";

    margin-bottom: 9px;
}

.guest-empty {
    padding: 20px 8px;

    color: #75878c;

    font-size: 9px;
    font-style: italic;
    text-align: center;
}

/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533; */

.guest-templates {
    margin-top: 11px;
}

.guest-section-title {
    margin-bottom: 10px;
}

.guest-code-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0,1fr));

    gap: 9px;
}

.guest-code-card {
    min-width: 0;

    overflow: hidden;

    box-shadow: none;
}

.guest-code-card-wide {
    grid-column: 1 / -1;
}

.guest-code-title {
    padding: 8px 9px;

    color: #c7aa78;

    font-size: 9px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 1.2px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.10),
            rgba(180,133,77,.07),
            rgba(0,0,0,.10)
        );

    border-bottom: 1px solid rgba(180,133,77,.18);
}

.guest-code {
    width: 100%;

    margin: 0;
    padding: 0;
}

.ap-guest textarea.guest-code-field {
    display: block !important;

    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;

    height: 112px !important;
    min-height: 112px !important;

    margin: 0 !important;
    padding: 13px 14px !important;

    resize: none !important;

    box-sizing: border-box !important;

    color: #d1d6d2 !important;
    -webkit-text-fill-color: #d1d6d2 !important;

    font-family: "Courier New", monospace !important;
    font-size: 10px !important;
    font-weight: normal !important;
    line-height: 1.55 !important;

    background:
        linear-gradient(
            180deg,
            rgba(29,58,71,.98),
            rgba(17,42,53,.98)
        ) !important;

    border: 0 !important;
    border-radius: 0 !important;

    outline: none !important;
    box-shadow: none !important;

    opacity: 1 !important;

    cursor: text;
}

.ap-guest textarea.guest-code-field:focus {
    background:
        linear-gradient(
            180deg,
            rgba(34,67,81,.99),
            rgba(20,48,60,.99)
        ) !important;
}

.ap-guest textarea.guest-code-field-mini {
    height: 72px !important;
    min-height: 72px !important;
}

.ap-guest textarea.guest-code-field-short {
    height: 104px !important;
    min-height: 104px !important;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-copy-button {
    display: block;

    width: calc(100% - 18px);

    margin: 8px auto 9px;
    padding: 7px 10px;

    cursor: pointer;

    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px;
    line-height: 1.3;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;

    background: #102936;

    border: 1px solid rgba(180,133,77,.42);
    border-radius: 3px;

    box-shadow: none;
}

.guest-copy-button:hover,
.guest-copy-success {
    color: #e5c28f;

    background: #173542;

    border-color: rgba(208,164,108,.68);
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.guest-question {
    margin-top: 18px;
    padding: 15px 18px;

    text-align: center;

    background:
        linear-gradient(
            180deg,
            rgba(180,133,77,.07),
            rgba(0,0,0,.14)
        );

    border-top: 1px solid rgba(180,133,77,.32);
    border-bottom: 1px solid rgba(180,133,77,.32);
}

.guest-question-title {
    color: var(--btb-gold-light);

    font-size: 11px;
    font-weight: bold;
}

.guest-question-text {
    margin-top: 5px;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

@media screen and (max-width:700px) {

    .guest-cover {
        height: 190px;
    }

    .guest-cover-title {
        font-size: 20px;
        letter-spacing: 4px;
    }

    .guest-links {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }

    .guest-columns,
    .guest-code-grid {
        grid-template-columns: 1fr;
    }

    .guest-code-card-wide {
        grid-column: auto;
    }

    .guest-welcome,
    .guest-card-body {
        text-align: left;
    }
.ap-guest textarea.guest-code-field {
        height: 120px !important;
        min-height: 120px !important;
    }

    .ap-guest textarea.guest-code-field-mini {
        height: 78px !important;
        min-height: 78px !important;
    }

    .ap-guest textarea.guest-code-field-short {
        height: 116px !important;
        min-height: 116px !important;
    }
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;
   ========================================================= */

.btb-news {
    margin-top: 8px;
}

.btb-news-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(220px, .75fr);
    gap: 11px;
    align-items: stretch;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-news-feed {
    overflow: hidden;
}

.btb-news-feed-title,
.btb-news-team-title {
    padding: 8px 10px;

    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 11px;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 1.7px;
    text-align: center;
    text-transform: uppercase;

    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.12),
            rgba(180,133,77,.08),
            rgba(0,0,0,.12)
        );

    border-bottom: 1px solid rgba(180,133,77,.20);
}

.btb-news-list {
    padding: 4px 13px 7px;
}

.btb-news-item {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 10px;

    padding: 11px 0;

    border-bottom: 1px solid rgba(180,133,77,.13);
}

.btb-news-item:last-child {
    border-bottom: 0;
}

.btb-news-date {
    padding-top: 2px;

    color: var(--btb-gold);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: .5px;
    text-align: center;
}

.btb-news-text {
    color: var(--btb-body);

    font-family: Arial, sans-serif;
    font-size: 10px;
    line-height: 1.58;
}

.btb-news-text b {
    color: #d3cec5;
}

.btb-news-text a {
    color: var(--btb-gold-light) !important;
    text-decoration: none !important;
}

.btb-news-text a:hover {
    text-decoration: underline !important;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-news-team {
    overflow: hidden;
}

.btb-news-team-subtitle {
    padding: 8px 12px 0;

    color: var(--btb-muted);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px;
    font-style: italic;
    line-height: 1.45;
    text-align: center;
}

.btb-news-people {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 13px;

    padding: 14px 10px 13px;
}

.btb-news-person {
    width: 74px;

    text-align: center;
}

.btb-news-avatar {
    position: relative;

    display: block;

    width: 58px;
    height: 58px;

    margin: 0 auto 6px;

    overflow: hidden;

    border: 1px solid rgba(180,133,77,.55);
    border-radius: 50%;

    background: #0b1821;

    box-shadow:
        0 0 0 3px rgba(180,133,77,.07);
}

.btb-news-avatar img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.btb-news-avatar:after {
    content: "";

    position: absolute;
    inset: 0;

    border-radius: 50%;

    box-shadow:
        inset 0 0 12px rgba(0,0,0,.45);

    pointer-events: none;
}

.btb-news-person-name {
    color: var(--btb-gold-light);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px;
    font-weight: bold;
    line-height: 1.3;
}

.btb-news-person-role {
    margin-top: 2px;

    color: var(--btb-muted);

    font-family: Arial, sans-serif;
    font-size: 8px;
    line-height: 1.3;
}


/* &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; */

.btb-news-status {
    margin-top: 11px;
    padding: 9px 13px;

    color: #87969a;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 9px;
    font-style: italic;
    line-height: 1.45;
    text-align: center;

    border-top: 1px solid rgba(180,133,77,.22);
    border-bottom: 1px solid rgba(180,133,77,.22);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(180,133,77,.06),
            transparent
        );
}


@media screen and (max-width:700px) {

    .btb-news-grid {
        grid-template-columns: 1fr;
    }

    .btb-news-person {
        width: 68px;
    }
}

/* =========================================================
   &#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533;&#65533; &#65533;&#65533;&#65533;&#65533;&#65533;&#65533; / NPC
   &#65533;&#65533;&#65533; [block=btb-character-card] ... [/block]
   ========================================================= */

.btb-character-card {
    --app-bg: #0b1821;
    --app-bg2: #10232e;
    --app-card: #122631;
    --app-card2: #0c1c25;

    --app-gold: #b4854d;
    --app-gold-light: #d0a46c;
    --app-gold-dark: #6f4d2d;

    --app-text: #c9c4ba;
    --app-muted: #87969a;
    --app-blue: #7898a7;

    display: block;
    width: 100%;
    max-width: 760px;

    margin: 4px auto 12px;
    padding: 16px;

    box-sizing: border-box;

    color: var(--app-text);
    font-family: Georgia, "Times New Roman", serif;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(75,115,138,.14),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #10232e 0%,
            #09151d 100%
        );

    border: 1px solid rgba(180,133,77,.55);
    box-shadow: none;
}

.btb-character-card *,
.btb-character-card *:before,
.btb-character-card *:after {
    box-sizing: border-box;
}


.post-content .btb-character-card p {
    margin: 0 0 11px;
    padding: 0;
    line-height: inherit;
    text-align: inherit;
}

.post-content .btb-character-card p:last-child {
    margin-bottom: 0;
}


.btb-character-card .app-footer {
    display: none !important;
}

@media screen and (max-width: 700px) {
    .btb-character-card {
        width: 100%;
        padding: 13px;
    }

    .btb-character-card .app-info {
        grid-template-columns: 1fr;
    }

    .btb-character-card .app-images {
        flex-wrap: wrap;
    }
}


.btb-template a,
.btb-template a:visited,
.btb-template a:hover,
.btb-template a:active,
.btb-template a:focus,
.btb-app a,
.btb-app a:visited,
.btb-app a:hover,
.btb-app a:active,
.btb-app a:focus {
    text-decoration: none !important;
}


.btb-template .grippie,
.btb-app .grippie,
.btb-character-card .grippie {
    display: none !important;
}

/* ������� ���������: ���������� ������
   <div class="ap-person"><b>���������</b><span class="dash">�</span><a href="...">��������</a></div>
*/
.ap-person > b {
    color: #d2d3ce;
    font-weight: bold;
}

.ap-person > a,
.ap-person > a:visited,
.ap-person > a:active,
.ap-person > a:focus {
    color: var(--btb-gold-light) !important;
    text-decoration: none !important;
}

.ap-person > a:hover {
    color: #e0b477 !important;
    text-decoration: none !important;
}


.btb-app {
    color-scheme: dark !important;
}

.btb-app .app-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;

    width: 100% !important;
    height: 35px !important;

    padding: 8px 30px 8px 10px !important;

    color: #ccd1ce !important;
    -webkit-text-fill-color: #ccd1ce !important;

    background-color: #132c37 !important;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23879aa1' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
        linear-gradient(180deg, #1b3541 0%, #112731 100%) !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: calc(100% - 10px) 50%, 0 0 !important;
    background-size: 10px 6px, 100% 100% !important;

    border: 1px solid rgba(120,152,167,.25) !important;
    border-radius: 0 !important;

    outline: none !important;
    box-shadow: inset 0 0 10px rgba(0,0,0,.13) !important;

    transition: none !important;
}

.btb-app .app-select:hover,
.btb-app .app-select:focus,
.btb-app .app-select:active {
    color: #ccd1ce !important;
    -webkit-text-fill-color: #ccd1ce !important;

    background-color: #132c37 !important;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23d0a46c' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
        linear-gradient(180deg, #1b3541 0%, #112731 100%) !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: calc(100% - 10px) 50%, 0 0 !important;
    background-size: 10px 6px, 100% 100% !important;

    border-color: rgba(180,133,77,.52) !important;

    transition: none !important;
}

.btb-app .app-select option {
    color: #ccd1ce !important;
    -webkit-text-fill-color: #ccd1ce !important;

    background: #132c37 !important;
    background-color: #132c37 !important;

    font-family: Arial, sans-serif !important;
    font-size: 10px !important;
    font-weight: normal !important;
}

.btb-app .app-select option:checked {
    color: #e0b477 !important;
    -webkit-text-fill-color: #e0b477 !important;

    background: #1b3541 !important;
    background-color: #1b3541 !important;
}

.btb-app .app-select::-ms-expand {
    display: none !important;
}


.btb-template .ap-list,
.btb-template .ap-registry-list,
.btb-template .ap-org-members-list,
.btb-template .guest-holds-list {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    scrollbar-width: auto !important;
}

.post-content .btb-character-card .app-image img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    object-fit: cover;
    object-position: center;
}