/* Превью дизайна Valor — стили поверх отрендеренного макета */
html,body{margin:0;padding:0}
body{background:#050403;color:#F1E9DC;-webkit-font-smoothing:antialiased}
.vs-stage{display:flex;justify-content:center;min-width:1440px}
.vs-mobile .vs-stage{min-width:0}
body{font-family:'PT Sans',sans-serif}
a{color:#E8CF96;text-decoration:none}
a:hover{color:#F6E2B4}
.vs-hide{display:none !important}

/* ---------- текстуры (задуманы дизайнером, в Design не применились) ---------- */
.vs-root{background:linear-gradient(rgba(14,11,9,.45),rgba(14,11,9,.45)),url(tex-body.png) rgb(14,11,9) !important;background-size:100% 100%,512px !important}
.vs-root header,.vs-root footer{background-image:url(tex-panel.png),linear-gradient(#1C150F,#0A0806) !important;background-size:256px,100% !important;border-color:#6B5530 !important;box-shadow:0 1px 0 #000,0 2px 0 rgba(201,164,92,.25)}
.vs-root footer{box-shadow:0 -1px 0 #000,0 -2px 0 rgba(201,164,92,.18)}
.vs-root [style*="background: rgb(31, 24, 18)"],
.vs-root [style*="background: rgb(23, 18, 14)"],
.vs-root [style*="linear-gradient(rgb(36, 27, 19)"]{background-image:url(tex-panel.png),linear-gradient(#2A2018,#17120E) !important;background-size:256px,100% !important}
.vs-root a[style*="rgb(200, 50, 30)"],.vs-root button[style*="rgb(200, 50, 30)"]{background-image:url(tex-button.png),linear-gradient(#C8321E,#8E1A0E 50%,#5C0E07) !important;background-size:256px,100% !important;transition:filter .15s}
.vs-root a[style*="rgb(200, 50, 30)"]:hover,.vs-root button[style*="rgb(200, 50, 30)"]:hover{filter:brightness(1.18) drop-shadow(0 0 8px rgba(255,209,0,.35))}
.vs-root a[style*="rgb(200, 50, 30)"]:active,.vs-root button[style*="rgb(200, 50, 30)"]:active{filter:brightness(.85)}
.vs-root [style*="linear-gradient(rgb(46, 36, 26)"]{background-image:url(tex-button.png),linear-gradient(#3A2D20,#17120E) !important;background-size:256px,100% !important}
.vs-root [style*="linear-gradient(rgb(46, 36, 26)"]:hover{border-color:#C9A45C !important;color:#FFD100 !important}
.vs-root nav a:hover,.vs-root footer a:hover{color:#FFD100 !important}

/* ---------- слоты изображений ---------- */
/* --img задаётся ниже для каждого слота; если файла нет, видна заглушка filler.jpg */
.vs-slot{position:relative;background:var(--img) center/cover no-repeat,linear-gradient(rgba(14,11,9,.45),rgba(14,11,9,.45)),url(filler.jpg) center/cover no-repeat,rgb(42,32,24) !important;color:transparent !important;border-color:#6B5530 !important;border-style:solid !important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.55)}
.vs-root .vs-hero{background:linear-gradient(90deg,#0E0B09 0%,#0E0B09 24%,rgba(14,11,9,.85) 40%,rgba(14,11,9,.3) 60%,rgba(14,11,9,0) 78%),linear-gradient(0deg,#0E0B09 0%,rgba(14,11,9,0) 20%),linear-gradient(180deg,rgba(14,11,9,.6) 0%,rgba(14,11,9,0) 18%),var(--img) right center/cover no-repeat,url(filler.jpg) right 30%/62% auto no-repeat,#0E0B09 !important}
.vs-root .vs-hero-m{background:linear-gradient(180deg,rgba(14,11,9,.35) 0%,rgba(14,11,9,0) 14%,rgba(14,11,9,0) 30%,rgba(14,11,9,.85) 50%,#0E0B09 60%),var(--img) 72% 0/auto 330px no-repeat,url(filler.jpg) 50% 0/auto 330px no-repeat,#0E0B09 !important}
.vs-root .vs-hero-m>.vs-tag{left:16px;top:16px}
.vs-root .vs-banner{position:relative;background:linear-gradient(90deg,rgba(14,11,9,.97) 0%,rgba(14,11,9,.9) 28%,rgba(14,11,9,.5) 58%,rgba(14,11,9,.2) 100%),linear-gradient(0deg,#0E0B09 0%,rgba(14,11,9,0) 50%),var(--img) center 38%/cover no-repeat,url(filler.jpg) right 30%/55% auto no-repeat,#0E0B09 !important}
.vs-root .vs-cta{position:relative;background:radial-gradient(ellipse at 50% 55%,rgba(18,13,9,.62) 0%,rgba(18,13,9,.9) 75%),linear-gradient(rgba(18,13,9,.2),rgba(18,13,9,.2)),var(--img) center/cover no-repeat,url(filler.jpg) center/cover no-repeat,#17120E !important}
.vs-root.vs-loginbg{background:linear-gradient(rgba(14,11,9,.55),rgba(14,11,9,.9)),var(--img) center/cover no-repeat,linear-gradient(rgba(14,11,9,.5),rgba(14,11,9,.5)),url(filler.jpg) center/cover no-repeat,#0E0B09 !important}

.vs-root .vs-icon{position:relative;overflow:visible;background:var(--img) center/cover no-repeat,radial-gradient(circle at 35% 30%,rgb(74,54,32),rgb(18,13,9) 75%) !important}
.vs-icon.vs-has-img>svg{display:none}
.vs-icon.vs-has-img{box-shadow:inset 0 0 0 1px rgba(0,0,0,.8),inset 0 0 10px rgba(0,0,0,.6),0 0 0 1px #000 !important}

/* метки слотов (переключаются в панели) */
.vs-tag{display:none}
.vs-tags-on .vs-tag{display:inline-flex;position:absolute;left:8px;top:8px;z-index:6;align-items:center;padding:3px 8px;font:700 11px/1.3 'PT Sans',sans-serif;letter-spacing:.3px;color:#FFD100 !important;background:rgba(10,8,6,.85);border:1px dashed #C9A45C;border-radius:3px;white-space:nowrap;text-shadow:none;max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis}
.vs-tags-on .vs-tag::before{content:"\270E\00a0"}
.vs-tags-on .vs-tag.is-ok{border-style:solid;border-color:#4E7F4A;color:#8FD08A !important}
.vs-tags-on .vs-tag.is-missing::after{content:"\00a0· нет картинки";color:#C9A45C;font-weight:400}
.vs-tags-on .vs-tag:hover{background:#1F1812}
.vs-root .vs-hero>.vs-tag,.vs-root .vs-banner>.vs-tag,.vs-root .vs-cta>.vs-tag{left:16px;top:16px}
.vs-root.vs-loginbg>.vs-tag{left:16px;top:100px}
.vs-tags-on .vs-icon>.vs-tag{left:50%;top:-22px;bottom:auto;transform:translateX(-50%);max-width:none;font-size:10px;padding:2px 6px}

/* ---------- расы ---------- */
.vs-races{display:flex !important;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;scrollbar-color:#6B5530 #17120E;scrollbar-width:thin}
.vs-races>.vs-race-card{flex:0 0 calc((100% - 80px) / 5);scroll-snap-align:start}
.vs-races-mobile{overflow-x:auto !important;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:thin;scrollbar-color:#6B5530 #17120E}
.vs-races-mobile>.vs-race-card{scroll-snap-align:start}
.vs-race-card[hidden]{display:none !important}
.vs-race-card{transition:border-color .15s,transform .15s}
.vs-race-card:hover{border-color:#C9A45C !important}
.vs-race-tab{cursor:pointer;user-select:none;transition:background .15s,border-color .15s,color .15s}
.vs-race-img{color:transparent !important}

/* ---------- панель превью ---------- */
#vs-panel{position:fixed;right:16px;bottom:16px;z-index:99999;display:flex;align-items:center;gap:8px;padding:8px 10px;background:rgba(10,8,6,.95);border:1px solid #6B5530;border-radius:6px;box-shadow:0 10px 30px rgba(0,0,0,.7);font:13px/1.2 'PT Sans',sans-serif;color:#E8CF96}
#vs-panel b{flex-shrink:0;white-space:nowrap;padding-right:2px;font-family:Forum,serif;font-weight:400;font-size:15px;letter-spacing:3px;color:#FFD100}
#vs-panel select,#vs-panel a,#vs-panel button{font:inherit;color:#F1E9DC;background:#1F1812;border:1px solid #3A2E22;border-radius:4px;padding:6px 9px;cursor:pointer}
#vs-panel a:hover,#vs-panel button:hover,#vs-panel select:hover{border-color:#C9A45C;color:#FFD100}
#vs-panel button[aria-pressed="true"]{border-color:#C9A45C;color:#FFD100}
#vs-panel.is-min>*:not([data-c]){display:none}
#vs-panel.is-min [data-c]{padding:6px 10px}
.vs-mobile #vs-panel{left:8px;right:8px;bottom:8px;flex-wrap:wrap;justify-content:center}

/* изображения слотов */
[data-slot="hero-main"]{--img:url("../img/hero-main.jpg")}
[data-slot="news-main"]{--img:url("../img/news-main.jpg")}
[data-slot="cta-join"]{--img:url("../img/cta-join.jpg")}
[data-slot="cat-update"]{--img:url("../img/cat-update.jpg")}
[data-slot="cat-event"]{--img:url("../img/cat-event.jpg")}
[data-slot="cat-launcher"]{--img:url("../img/cat-launcher.jpg")}
[data-slot="cat-sale"]{--img:url("../img/cat-sale.jpg")}
[data-slot="cat-maintenance"]{--img:url("../img/cat-maintenance.jpg")}
[data-slot="article-guide"]{--img:url("../img/article-guide.jpg")}
[data-slot="article-story"]{--img:url("../img/article-story.jpg")}
[data-slot="article-compare"]{--img:url("../img/article-compare.jpg")}
[data-slot="article-tale"]{--img:url("../img/article-tale.jpg")}
[data-slot="banner-start"]{--img:url("../img/banner-start.jpg")}
[data-slot="banner-ladder"]{--img:url("../img/banner-ladder.jpg")}
[data-slot="banner-news"]{--img:url("../img/banner-news.jpg")}
[data-slot="banner-about"]{--img:url("../img/banner-about.jpg")}
[data-slot="banner-roadmap"]{--img:url("../img/banner-roadmap.jpg")}
[data-slot="banner-faq"]{--img:url("../img/banner-faq.jpg")}
[data-slot="banner-login"]{--img:url("../img/banner-login.jpg")}
[data-slot="icon-hardcore"]{--img:url("../img/icon-hardcore.jpg")}
[data-slot="icon-content"]{--img:url("../img/icon-content.jpg")}
[data-slot="icon-stable"]{--img:url("../img/icon-stable.jpg")}
[data-slot="icon-community"]{--img:url("../img/icon-community.jpg")}
[data-slot="icon-races"]{--img:url("../img/icon-races.jpg")}
[data-slot="icon-bots"]{--img:url("../img/icon-bots.jpg")}
[data-slot="icon-guilds"]{--img:url("../img/icon-guilds.jpg")}
[data-slot="icon-reforge"]{--img:url("../img/icon-reforge.jpg")}
[data-slot="slide-mogushan"]{--img:url("../img/slide-mogushan.jpg")}
[data-slot="slide-battlepass"]{--img:url("../img/slide-battlepass.jpg")}
[data-slot="slide-mythic"]{--img:url("../img/slide-mythic.jpg")}
[data-slot="slide-event"]{--img:url("../img/slide-event.jpg")}
[data-slot="side-news"]{--img:url("../img/side-news.jpg")}
[data-slot="side-community"]{--img:url("../img/side-community.jpg")}
[data-slot="side-discord"]{--img:url("../img/side-discord.jpg")}
[data-slot="side-faq"]{--img:url("../img/side-faq.jpg")}
[data-slot="feat-bots"]{--img:url("../img/feat-bots.jpg")}
[data-slot="bg-top"]{--img:url("../img/bg-top.jpg")}
[data-slot="bg-tile"]{--img:url("../img/bg-tile.jpg")}
[data-slot="logo"]{--img:url("../img/logo.png")}
[data-slot="emblem"]{--img:url("../img/emblem.png")}
[data-slot="og-image"]{--img:url("../img/og-image.jpg")}
[data-slot="armory-hero"]{--img:url("../img/armory-hero.jpg")}
[data-slot="armory-char-bg"]{--img:url("../img/armory-char-bg.jpg")}
[data-slot="rewards-hero"]{--img:url("../img/rewards-hero.jpg")}
[data-slot="fame-hero"]{--img:url("../img/fame-hero.jpg")}
[data-slot="chronicle-hero"]{--img:url("../img/chronicle-hero.jpg")}
[data-slot="guilds-hero"]{--img:url("../img/guilds-hero.jpg")}
[data-slot="chronicle-stone"]{--img:url("../img/chronicle-stone.jpg")}
[data-slot="guides-hero"]{--img:url("../img/guides-hero.jpg")}
[data-slot="guide-start-cover"]{--img:url("../img/guide-start-cover.jpg")}
[data-slot="guide-bots-cover"]{--img:url("../img/guide-bots-cover.jpg")}
[data-slot="guide-mythic-cover"]{--img:url("../img/guide-mythic-cover.jpg")}
[data-slot="guide-reforge-cover"]{--img:url("../img/guide-reforge-cover.jpg")}
[data-slot="guide-transmog-cover"]{--img:url("../img/guide-transmog-cover.jpg")}
[data-slot="guide-battlepass-cover"]{--img:url("../img/guide-battlepass-cover.jpg")}
[data-slot="guide-wednesday-cover"]{--img:url("../img/guide-wednesday-cover.jpg")}
[data-slot="guide-mogushan-cover"]{--img:url("../img/guide-mogushan-cover.jpg")}
[data-slot="guide-relic-cover"]{--img:url("../img/guide-relic-cover.jpg")}
[data-slot="guide-start-north"]{--img:url("../img/guide-start-north.jpg")}
[data-slot="guide-bots-scene"]{--img:url("../img/guide-bots-scene.jpg")}
[data-slot="guide-relic-keeper"]{--img:url("../img/guide-relic-keeper.jpg")}
[data-slot="changelog-hero"]{--img:url("../img/changelog-hero.jpg")}
[data-slot="legal-hero"]{--img:url("../img/legal-hero.jpg")}
[data-slot="contacts-hero"]{--img:url("../img/contacts-hero.jpg")}
[data-slot="races-hero"]{--img:url("../img/races-hero.jpg")}
[data-slot="races-stage"]{--img:url("../img/races-stage.jpg")}
[data-slot="dungeons-hero"]{--img:url("../img/dungeons-hero.jpg")}
[data-slot="guide-naxxramas-cover"]{--img:url("../img/guide-naxxramas-cover.jpg")}
[data-slot="guide-obsidian-cover"]{--img:url("../img/guide-obsidian-cover.jpg")}
[data-slot="guide-eye-cover"]{--img:url("../img/guide-eye-cover.jpg")}
[data-slot="guide-archavon-cover"]{--img:url("../img/guide-archavon-cover.jpg")}
[data-slot="guide-ulduar-cover"]{--img:url("../img/guide-ulduar-cover.jpg")}
[data-slot="guide-toc-cover"]{--img:url("../img/guide-toc-cover.jpg")}
[data-slot="guide-onyxia-cover"]{--img:url("../img/guide-onyxia-cover.jpg")}
[data-slot="guide-icc-cover"]{--img:url("../img/guide-icc-cover.jpg")}
[data-slot="guide-ruby-cover"]{--img:url("../img/guide-ruby-cover.jpg")}
[data-slot="shop-hero"]{--img:url("../img/shop-hero.jpg")}
[data-slot="world-hero"]{--img:url("../img/world-hero.jpg")}
[data-slot="world-calendar-hero"]{--img:url("../img/world-calendar-hero.jpg")}