/*
 * TRADEDARK — «Арканная мастерская».
 * Глобальный визуальный слой. Он не меняет разметку, размеры сетки или поведение
 * компонентов и подключается после локальных стилей страниц.
 */
:root {
    --td-ink: #050814;
    --td-panel: rgba(7, 9, 17, 0.88);
    --td-panel-solid: #090c16;
    --td-panel-soft: rgba(12, 13, 23, 0.78);
    --td-copper: #d96818;
    --td-amber: #f2a43a;
    --td-amber-light: #ffc876;
    --td-violet: #7047a8;
    --td-blue: #247dcc;
    --td-ivory: #eee6d8;
    --td-muted: #9ca5b3;
    --td-line: rgba(217, 104, 24, 0.38);
    --td-line-cool: rgba(112, 71, 168, 0.38);
    --td-shadow: 0 14px 35px rgba(0, 0, 0, 0.34);
}

body {
    color: var(--td-ivory);
    font-family: "Inter", "Segoe UI", system-ui, sans-serif;
}

main.container {
    position: relative;
}

main h1,
main h2,
main h3,
main .h1,
main .h2,
main .h3 {
    color: var(--td-amber-light);
}

main h1,
main h2,
main .h1,
main .h2 {
    font-family: "Cinzel", Georgia, serif;
    letter-spacing: 0.025em;
    text-shadow: 0 2px 16px rgba(217, 104, 24, 0.14);
}

main a:not(.btn):not(.nav-link):not(.page-link) {
    color: var(--td-amber-light);
}

main a:not(.btn):not(.nav-link):not(.page-link):hover {
    color: #ffe0aa;
}

main .text-warning { color: var(--td-amber-light) !important; }
main .text-info { color: #70baff !important; }
main .text-primary { color: #76b5ed !important; }
main .text-light { color: var(--td-ivory) !important; }
main .text-white-50,
main .text-secondary { color: var(--td-muted) !important; }
main .border-warning { border-color: rgba(242, 164, 58, 0.62) !important; }
main .border-secondary { border-color: rgba(130, 125, 142, 0.3) !important; }
main .border-info { border-color: rgba(36, 125, 204, 0.58) !important; }

/* Панели и карточки */
main .card,
main .accordion-item,
main .list-group-item,
main .offcanvas {
    color: var(--td-ivory);
    border: 1px solid var(--td-line) !important;
    background:
        radial-gradient(circle at 100% 0, rgba(112, 71, 168, 0.1), transparent 36%),
        linear-gradient(145deg, rgba(7, 9, 17, 0.94), rgba(10, 11, 20, 0.86)) !important;
    box-shadow: var(--td-shadow);
}

main .card {
    border-radius: 12px;
    overflow: hidden;
}

main .card-header {
    color: var(--td-amber-light) !important;
    border-bottom: 1px solid rgba(217, 104, 24, 0.34) !important;
    background:
        linear-gradient(90deg, rgba(217, 104, 24, 0.17), rgba(112, 71, 168, 0.11) 58%, rgba(36, 125, 204, 0.08)) !important;
    font-weight: 700;
}

main .card-footer {
    border-top-color: rgba(217, 104, 24, 0.28) !important;
    background: rgba(3, 5, 11, 0.42) !important;
}

main .card-img-top {
    background: radial-gradient(circle, rgba(217, 104, 24, 0.09), transparent 66%);
}

/* Старые информационные оболочки без класса card */
main .rounded-4.shadow-lg {
    border: 1px solid var(--td-line);
    background:
        radial-gradient(circle at 100% 0, rgba(112, 71, 168, 0.1), transparent 36%),
        linear-gradient(145deg, rgba(7, 9, 17, 0.93), rgba(10, 11, 20, 0.84)) !important;
    box-shadow: var(--td-shadow) !important;
}

main .rounded-3.border.bg-dark,
main .bg-dark.bg-opacity-50,
main .bg-dark.bg-opacity-75 {
    border-color: rgba(217, 104, 24, 0.3) !important;
    background:
        radial-gradient(circle at 100% 0, rgba(112, 71, 168, 0.08), transparent 40%),
        rgba(7, 9, 17, 0.82) !important;
}

/* Кнопки */
main .btn,
.modal .btn {
    border-radius: 8px;
    font-weight: 650;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

main .btn:hover:not(:disabled),
.modal .btn:hover:not(:disabled) {
    transform: translateY(-1px);
}

main .btn-warning,
.modal .btn-warning,
main .btn-primary,
.modal .btn-primary {
    color: #180b03 !important;
    border-color: #f7ad55 !important;
    background: linear-gradient(180deg, #f7983e 0%, #d86117 100%) !important;
    box-shadow: inset 0 1px rgba(255, 244, 223, 0.3), 0 6px 16px rgba(217, 104, 24, 0.2);
}

main .btn-warning:hover,
.modal .btn-warning:hover,
main .btn-primary:hover,
.modal .btn-primary:hover {
    border-color: #ffd08a !important;
    background: linear-gradient(180deg, #ffae58 0%, #e56d1b 100%) !important;
}

main .btn-outline-warning,
.modal .btn-outline-warning,
main .btn-outline-primary,
.modal .btn-outline-primary,
main .btn-outline-dark {
    color: var(--td-amber-light) !important;
    border-color: rgba(217, 104, 24, 0.72) !important;
    background: rgba(7, 9, 16, 0.78) !important;
}

main .btn-outline-warning:hover,
.modal .btn-outline-warning:hover,
main .btn-outline-primary:hover,
.modal .btn-outline-primary:hover,
main .btn-outline-dark:hover {
    color: #160a03 !important;
    border-color: var(--td-amber-light) !important;
    background: var(--td-amber) !important;
}

main .btn-secondary,
.modal .btn-secondary,
main .btn-outline-secondary,
.modal .btn-outline-secondary {
    color: #d5d1dc !important;
    border-color: rgba(156, 165, 179, 0.45) !important;
    background: linear-gradient(180deg, rgba(65, 65, 78, 0.9), rgba(38, 38, 49, 0.92)) !important;
}

main .btn-success,
.modal .btn-success,
main .btn-outline-success {
    color: #e9fff3 !important;
    border-color: rgba(63, 186, 121, 0.7) !important;
    background: linear-gradient(180deg, #268759, #145b3a) !important;
}

main .btn-danger,
.modal .btn-danger,
main .btn-outline-danger {
    color: #fff0ef !important;
    border-color: rgba(222, 88, 79, 0.76) !important;
    background: linear-gradient(180deg, #a83f38, #6e2421) !important;
}

main .btn-info,
.modal .btn-info,
main .btn-outline-info {
    color: #edf8ff !important;
    border-color: rgba(60, 149, 218, 0.72) !important;
    background: linear-gradient(180deg, #2e79b4, #20517f) !important;
}

main .btn:disabled,
main .btn.disabled,
.modal .btn:disabled {
    opacity: .52;
    transform: none;
    box-shadow: none;
}

/* Поля и элементы ввода */
main .form-control,
main .form-select,
main .input-group-text,
.modal .form-control,
.modal .form-select,
.modal .input-group-text {
    color: var(--td-ivory) !important;
    border-color: rgba(112, 105, 128, 0.55) !important;
    background-color: rgba(5, 7, 14, 0.88) !important;
    border-radius: 8px;
}

main .form-control::placeholder,
.modal .form-control::placeholder {
    color: #757d8b;
    opacity: 1;
}

main .form-control:focus,
main .form-select:focus,
.modal .form-control:focus,
.modal .form-select:focus {
    border-color: var(--td-copper) !important;
    background-color: rgba(5, 7, 14, 0.96) !important;
    box-shadow: 0 0 0 .2rem rgba(217, 104, 24, 0.16) !important;
}

main .form-control:disabled,
main .form-select:disabled {
    color: #808694 !important;
    background-color: rgba(25, 26, 34, 0.84) !important;
}

main .input-group > .form-control:not(:last-child),
main .input-group > .form-select:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

main .input-group > .btn:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

main .form-check-input {
    border-color: rgba(217, 104, 24, 0.58);
    background-color: #090c16;
}

main .form-check-input:checked {
    border-color: var(--td-copper);
    background-color: var(--td-copper);
}

main .form-check-input:focus {
    box-shadow: 0 0 0 .2rem rgba(217, 104, 24, 0.16);
}

/* Таблицы */
main .table {
    --bs-table-color: var(--td-ivory);
    --bs-table-bg: transparent;
    --bs-table-border-color: rgba(128, 121, 142, 0.25);
    --bs-table-striped-color: var(--td-ivory);
    --bs-table-striped-bg: rgba(112, 71, 168, 0.055);
    --bs-table-hover-color: #fff4df;
    --bs-table-hover-bg: rgba(217, 104, 24, 0.085);
    color: var(--td-ivory) !important;
}

main .table thead th {
    color: var(--td-amber-light);
    border-bottom-color: rgba(217, 104, 24, 0.48);
    background: rgba(217, 104, 24, 0.08);
}

main .table-responsive {
    border-radius: 9px;
}

/* Модальные окна, выпадающие меню и уведомления */
.modal-content {
    color: var(--td-ivory) !important;
    border: 1px solid rgba(217, 104, 24, 0.55) !important;
    border-radius: 12px;
    background:
        radial-gradient(circle at 100% 0, rgba(112, 71, 168, 0.13), transparent 38%),
        linear-gradient(145deg, #090b15, #080a12) !important;
    box-shadow: 0 24px 65px rgba(0, 0, 0, 0.65);
}

.modal-header,
.modal-footer {
    border-color: rgba(217, 104, 24, 0.3) !important;
}

.modal-title { color: var(--td-amber-light) !important; }
.modal-backdrop.show { opacity: .72; }

.dropdown-menu {
    color: var(--td-ivory);
    border: 1px solid rgba(217, 104, 24, 0.4);
    background: rgba(7, 9, 16, 0.97);
    box-shadow: var(--td-shadow);
}

.dropdown-item { color: #ddd8cf; }
.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active {
    color: #fff3dc;
    background: rgba(217, 104, 24, 0.16);
}
.dropdown-divider { border-color: rgba(217, 104, 24, 0.25); }

main .alert {
    color: #e9e3dc !important;
    border-radius: 10px;
    background: rgba(8, 10, 18, 0.9) !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
}
main .alert-warning { border-color: rgba(242, 164, 58, .65) !important; }
main .alert-info { border-color: rgba(36, 125, 204, .65) !important; }
main .alert-success { border-color: rgba(49, 164, 105, .65) !important; }
main .alert-danger { border-color: rgba(202, 71, 66, .7) !important; }
main .alert-secondary { border-color: rgba(130, 130, 145, .5) !important; }

.toast,
.toast-message {
    color: var(--td-ivory) !important;
    border: 1px solid rgba(217, 104, 24, 0.55) !important;
    background: linear-gradient(135deg, rgba(22, 13, 19, .98), rgba(18, 13, 29, .98)) !important;
    box-shadow: var(--td-shadow) !important;
}

/* Навигационные компоненты */
main .nav-tabs {
    border-color: rgba(217, 104, 24, 0.34) !important;
}

main .nav-tabs .nav-link,
main .nav-pills .nav-link {
    color: #b9b5bd !important;
    border-color: transparent !important;
    background: transparent !important;
}

main .nav-tabs .nav-link:hover,
main .nav-pills .nav-link:hover {
    color: var(--td-amber-light) !important;
    border-color: rgba(217, 104, 24, 0.25) !important;
}

main .nav-tabs .nav-link.active,
main .nav-pills .nav-link.active {
    color: #170b04 !important;
    border-color: var(--td-amber) !important;
    background: linear-gradient(180deg, #f3a544, #d4671b) !important;
}

main .accordion-button {
    color: var(--td-ivory);
    background: rgba(7, 9, 16, 0.88);
    box-shadow: none;
}
main .accordion-button:not(.collapsed) {
    color: var(--td-amber-light);
    background: rgba(217, 104, 24, 0.1);
}
main .accordion-button::after { filter: invert(1) sepia(.5); }

main .page-link {
    color: var(--td-amber-light);
    border-color: rgba(217, 104, 24, .36);
    background: rgba(7, 9, 16, .9);
}
main .page-link:hover,
main .page-item.active .page-link {
    color: #170b04;
    border-color: var(--td-amber);
    background: var(--td-amber);
}
main .page-item.disabled .page-link {
    color: #6f7480;
    background: rgba(25, 26, 34, .9);
}

main .list-group-item {
    border-color: rgba(124, 117, 139, .28) !important;
    box-shadow: none;
}
main .list-group-item-action:hover,
main .list-group-item-action:focus {
    color: #fff1dc;
    background: rgba(217, 104, 24, .09) !important;
}

main .progress {
    background: rgba(3, 5, 10, .85);
    border: 1px solid rgba(128, 121, 142, .2);
}
main .progress-bar {
    background: linear-gradient(90deg, var(--td-copper), var(--td-amber));
}

/* Метки */
main .badge.bg-warning { color: #180b03 !important; background: var(--td-amber) !important; }
main .badge.bg-primary { background: #2f70aa !important; }
main .badge.bg-info { color: #fff !important; background: #286d9f !important; }
main .badge.bg-success { background: #23734b !important; }
main .badge.bg-danger { background: #8d3531 !important; }
main .badge.bg-secondary,
main .badge.bg-dark { background: #343440 !important; }

main .badge[style*="linear-gradient"] {
    color: #f1e9df !important;
    border: 1px solid rgba(112, 71, 168, .62);
    background: linear-gradient(135deg, #5b347f, #285d91) !important;
}

main .gradient-link {
    color: var(--td-amber-light) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor;
}

main .help-icon {
    color: #eee6d8;
    border: 1px solid rgba(112, 71, 168, .52);
    background: #3a3547 !important;
}
main .help-icon:hover {
    color: #180b03;
    border-color: var(--td-amber);
    background: var(--td-amber) !important;
}

/* Специальные страницы — только оформление существующих блоков */
main .case-card {
    border: 1px solid rgba(217, 104, 24, .44);
    border-radius: 14px;
    background:
        radial-gradient(circle at 8% 0, rgba(217, 104, 24, .11), transparent 32%),
        radial-gradient(circle at 94% 100%, rgba(112, 71, 168, .12), transparent 34%),
        rgba(6, 8, 15, .88);
    box-shadow: var(--td-shadow);
}

main .case-title {
    color: var(--td-amber-light);
    font-family: "Cinzel", Georgia, serif;
}

main .item {
    border: 1px solid rgba(112, 71, 168, .35);
    background: rgba(14, 14, 25, .78);
}

main .winning-frame {
    border-color: var(--td-amber);
    box-shadow: 0 0 18px rgba(242, 164, 58, .65), inset 0 0 10px rgba(242, 164, 58, .35);
}

main .btn-case {
    color: #170b04 !important;
    border: 1px solid #f7ad55;
    border-radius: 8px;
    background: linear-gradient(180deg, #f7983e 0%, #d86117 100%);
    box-shadow: 0 7px 18px rgba(217, 104, 24, .23);
}
main .btn-case:hover {
    color: #170b04 !important;
    background: linear-gradient(180deg, #ffae58 0%, #e56d1b 100%);
    box-shadow: 0 9px 22px rgba(217, 104, 24, .3);
}

main .shop-item .card,
main .program-card,
main .program-card-gradient {
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
main .shop-item .card:hover,
main .program-card:hover {
    border-color: rgba(242, 164, 58, .68) !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .42), 0 0 22px rgba(217, 104, 24, .08);
}

main .program-card-gradient::before {
    background: linear-gradient(135deg, var(--td-copper), var(--td-violet), var(--td-blue));
}

main .instruction-step,
main .program-section {
    border-left-color: var(--td-copper);
    background: rgba(217, 104, 24, .055);
}

main .subscription-info,
main .log-container,
main .result-card,
main .shop-result-card {
    border-color: rgba(112, 71, 168, .32) !important;
    background: rgba(5, 7, 14, .78) !important;
}

main #resultsContainer,
main #shopResultsContainer,
main #logContainer {
    border: 1px solid rgba(112, 71, 168, .3);
    background: rgba(5, 7, 14, .82) !important;
}

main .log-time,
main .result-card-user,
main .device-info-value,
main .result-card-planet span {
    color: var(--td-amber-light) !important;
}

main .device-info-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 0;
    margin-left: 0;
}

main .device-info-row {
    display: flex;
    align-items: baseline;
    gap: 4px;
    color: #b4c2e0;
    font-size: .9rem;
    line-height: 1.4;
    margin-left: 0;
    padding-left: 0;
}

main .device-info-icon {
    flex-shrink: 0;
    width: 16px;
    text-align: center;
}

main .device-info-label {
    flex-shrink: 0;
}

main .device-info-value {
    font-weight: 500;
    word-break: break-word;
}

main .result-card-planet {
    border-color: rgba(217, 104, 24, .34) !important;
    background: rgba(217, 104, 24, .08) !important;
}

main .avatar-thumb,
main #selectedAvatarPreview {
    border-color: rgba(217, 104, 24, .5) !important;
}

main hr { border-color: rgba(217, 104, 24, .24) !important; }

img[src*="item-finder-arcane.png"] {
    border: 2px solid rgba(217, 104, 24, .68);
    border-radius: 50% !important;
    background: #070a13;
    box-shadow: 0 0 16px rgba(217, 104, 24, .24), 0 0 22px rgba(74, 78, 190, .15);
}

.report-error-btn {
    padding-top: .72rem;
    padding-bottom: .72rem;
}

/* Баланс и рейтинг в верхнем меню */
.arcane-user-metrics {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin-right: .25rem;
}

.arcane-navbar .arcane-metric {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: .38rem;
    min-width: 82px;
    margin: 0 !important;
    padding: .48rem .62rem !important;
    border: 1px solid rgba(217, 104, 24, .34);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(217, 104, 24, .1), rgba(36, 125, 204, .08));
}

.arcane-navbar .arcane-rating {
    border-color: rgba(112, 71, 168, .42);
    background: linear-gradient(135deg, rgba(112, 71, 168, .12), rgba(36, 125, 204, .1));
}

.arcane-navbar .arcane-metric::after { display: none; }
.arcane-navbar .arcane-metric img { margin: 0; flex: 0 0 auto; }
.arcane-navbar .arcane-metric .metric-value {
    color: var(--td-amber-light);
    font-weight: 700;
    line-height: 1;
}
.arcane-navbar .arcane-rating .metric-value { color: #b9a1ea; }
.arcane-navbar .arcane-rating .rating_icon {
    filter: drop-shadow(0 0 5px rgba(112, 71, 168, .48));
}

/* Рамки аватаров по рейтингу */
.rating-avatar.rating-avatar-electric {
    border: 2px solid #68d5ff !important;
    animation: td-electric-avatar 1.65s steps(2, end) infinite;
}

.rating-avatar.rating-avatar-fire {
    border: 2px solid #ff9a35 !important;
    animation: td-fire-avatar 1.8s ease-in-out infinite;
}

@keyframes td-electric-avatar {
    0%, 100% {
        box-shadow: 0 0 4px #d8f7ff, 0 0 10px #38bdf8, 0 0 19px rgba(101, 65, 220, .68);
    }
    32% {
        box-shadow: -2px 1px 3px #fff, 1px -2px 12px #52d7ff, 0 0 24px rgba(107, 75, 255, .84);
    }
    58% {
        box-shadow: 2px -1px 5px #bff5ff, -2px 2px 9px #268dff, 0 0 16px rgba(100, 68, 220, .7);
    }
}

@keyframes td-fire-avatar {
    0%, 100% {
        box-shadow: 0 0 5px #ffd27c, 0 0 12px #ff8a2b, 0 0 21px rgba(204, 48, 18, .68);
    }
    45% {
        box-shadow: -1px -2px 7px #fff0ad, 2px 1px 17px #ff6b1a, 0 0 29px rgba(221, 44, 11, .82);
    }
    72% {
        box-shadow: 2px 0 5px #ffc75e, -2px -1px 13px #f14314, 0 0 23px rgba(255, 122, 24, .72);
    }
}

/* Последние победители */
.arcane-winner-prize-wrap {
    display: flex;
    flex: 0 0 48px;
    width: 48px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.arcane-winner-prize-image {
    display: block;
    flex: 0 0 auto;
    object-fit: contain;
    padding: 3px;
    border: 1px solid rgba(112, 71, 168, .38);
    border-radius: 9px;
    background: radial-gradient(circle, rgba(112, 71, 168, .16), rgba(5, 7, 14, .76));
    filter: drop-shadow(0 0 7px rgba(36, 125, 204, .2));
}

.arcane-winner-prize-quantity {
    margin-top: 3px;
    color: #ffb364;
    font-size: .7rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    text-shadow: 0 0 6px rgba(217, 104, 24, .42);
}

/* Пояснения к уже полученным призам */
.prize-delivery-note {
    width: fit-content;
    max-width: 100%;
    margin-top: .55rem;
    padding: .42rem .65rem;
    border: 1px solid rgba(112, 71, 168, .36);
    border-radius: 8px;
    color: #d9d3e3;
    background: rgba(9, 10, 19, .72);
    font-size: .78rem;
    line-height: 1.35;
}

.prize-delivery-note i { margin-right: .28rem; }
.prize-delivery-note-character {
    border-color: rgba(36, 125, 204, .5);
    color: #a9d8ff;
    background: rgba(36, 125, 204, .09);
}
.prize-delivery-note-reputation {
    border-color: rgba(217, 104, 24, .5);
    color: var(--td-amber-light);
    background: rgba(217, 104, 24, .08);
}

/* Полоса прокрутки */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(217, 104, 24, .72) rgba(5, 7, 14, .8);
}
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: rgba(5, 7, 14, .8); }
*::-webkit-scrollbar-thumb {
    border: 2px solid rgba(5, 7, 14, .8);
    border-radius: 10px;
    background: linear-gradient(var(--td-copper), var(--td-violet));
}

@media (max-width: 767.98px) {
    main h1,
    main .h1 { letter-spacing: .01em; }

    main .card,
    main .case-card { border-radius: 10px; }

    main .btn:hover:not(:disabled),
    .modal .btn:hover:not(:disabled) { transform: none; }

    .prize-delivery-note { width: 100%; }
}

@media (max-width: 991.98px) {
    .arcane-user-metrics {
        flex-direction: row !important;
        justify-content: flex-start;
        width: 100%;
        margin: .25rem 0 .4rem;
    }

    .arcane-navbar .arcane-metric,
    .arcane-navbar .arcane-balance {
        width: auto;
        margin: 0 !important;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    main .btn,
    main .card,
    main .program-card { transition: none !important; }
}