/* VIP FOYDA theme. Mobile viewport and game rules remain in their own modules. */
.knyaz-preview {
  --bg: #070b0b; --panel: #101918; --panel-hover: #172522;
  --cream: #f1f7f4; --text: #f1f7f4; --muted: #a5b9b1;
  --line: #9fc6b91c; --violet: #b5a5e9; --lime: #43edac;
  --brass: #f3ce73; --red: #ff8990; --kn-green: #43edac; --kn-gold: #f3ce73;
  background: radial-gradient(ellipse at 10% 0, #12332870, transparent 42%), #070b0b;
  color: var(--text); color-scheme: dark;
}
.knyaz-preview .ambient { background: radial-gradient(ellipse at 85% 20%, #1c5b4220, transparent 50%); opacity: .6; }
.knyaz-preview .wordmark { letter-spacing: 1px; font-size: 14px; gap: 11px; }
.knyaz-preview .brand-light { color: #cfddd5; font-weight: 650; }
.knyaz-preview .wordmark > span:last-child::after { content: none; }
.knyaz-preview .brand-mark { position: relative; flex-shrink: 0; width: 39px; height: 43px; border-radius: 11px; color: #43edac; font-size: 0; background: linear-gradient(150deg,#1a4633,#0b1a15); border: 1px solid #43edac4a; box-shadow: inset 0 1px #baffdf1c, 0 6px 18px #0004; }
.knyaz-preview .brand-mark::before { content: ''; position: absolute; inset: 9px 10px 12px; border: 1.5px solid #43edac; transform: rotate(45deg); border-radius: 3px; }
.knyaz-preview .brand-mark::after { content: 'K'; position: absolute; inset: 0; display: grid; place-items: center; font: 850 15px/1 'Manrope', system-ui; background: #101f1700; }
.knyaz-preview .nav-caption { color: #809b8e; font-size: 10px; letter-spacing: 1.4px; margin-top: 40px; }
.knyaz-preview .nav-item { color: #9ab0a7; min-height: 48px; }
.knyaz-preview .desktop-nav .nav-item.active { color: #70ffc1; background: linear-gradient(90deg,#43edac1c,#43edac05); box-shadow: inset 2px 0 #43edac; }
.knyaz-preview .nav-dot { background: #43edac; }
.knyaz-preview .sidebar-bottom { color: #98ada4; font-size: 11px; }
.knyaz-preview .sidebar-bottom p { color: #6e8a7d; }
.kn-club-symbol { color: #43edac; font-size: 21px; margin-right: 5px; }
.knyaz-preview .desktop-greeting { color: #dce9e2; font-weight: 750; font-size: 12px; letter-spacing: 1px; }
.knyaz-preview .desktop-greeting span { color: #6d9c86; font-size: 9px; margin-left: 10px; }
.knyaz-preview .avatar { border: 1px solid #43edac40; background: #173126; color: #c7ffe3; min-width: 44px; min-height: 44px; }
.knyaz-preview .mode-chip { color: #f3ce73; background: #322a172e; border-color: #f3ce7333; font-size: 10px; }
.knyaz-preview .bottom-nav { background: #09120ef5; border-color: #70ffc126; box-shadow: 0 -10px 30px #0003; }
.knyaz-preview .bottom-nav .nav-item { font-size: 10px; color: #97ada3; min-height: 48px; }
.knyaz-preview .bottom-nav .nav-item.active { color: #82ffcb; background: #43edac0c; }
.knyaz-preview .bottom-nav .nav-item.active svg { color: #43edac; filter: drop-shadow(0 0 7px #43edac45); }
.knyaz-preview .app-footer { color: #829b8f; font-size: 9px; gap: 15px; line-height: 1.5; }
.kn-brand-review { color: #99bdab; text-decoration: none; }
.kn-brand-review:hover { color: #84f3b9; text-decoration: underline; text-underline-offset: 4px; }
.kn-welcome { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 13px; color: #b7c9bf; font-size: 13px; }
.kn-welcome p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kn-welcome > span { color: #7f9d8d; flex-shrink: 0; font-size: 11px; }
.kn-hero { position: relative; isolation: isolate; overflow: hidden; border: 1px solid #43edac35; border-radius: 24px; min-height: 295px; background: #07110e; box-shadow: inset 0 1px #a8ffd716, 0 20px 44px #0004; }
.kn-hero-art { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.kn-hero::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#05100bf0 0%,#06100bc9 33%,#05110c2e 69%,transparent),linear-gradient(0deg,#04100b9e,transparent 60%); }
.kn-hero::after { content: ''; position: absolute; bottom: 0; left: 24px; width: 86px; height: 2px; background: #43edac; box-shadow: 0 0 18px #43edac80; }
.kn-hero-copy { position: relative; max-width: 75%; padding: 27px 22px 26px; }
.kn-club-label { display: inline-block; color: #a7e8c5; font-size: 9px; font-weight: 750; letter-spacing: 1.25px; }
.kn-hero h1 { margin: 25px 0 13px; font-size: clamp(29px,7.3vw,37px); line-height: 1.08; letter-spacing: -1.5px; font-weight: 850; }
.kn-hero h1 em { color: #79fbc1; font-style: normal; }
.kn-hero-copy > p { color: #bed0c5; max-width: 180px; font-size: 12px; line-height: 1.65; margin: 0 0 23px; }
.kn-hero-signature { position: absolute; right: 16px; bottom: 15px; color: #c7e9d766; font-size: 8px; letter-spacing: 2px; font-weight: 750; }
.knyaz-preview .button { min-height: 46px; font-size: 13px; font-weight: 750; border-radius: 12px; padding: 12px 16px; }
.knyaz-preview .button.kn-primary,.knyaz-preview .button.violet,.knyaz-preview .button.lime { color: #062117; background: linear-gradient(140deg,#74ffc4,#43edac); box-shadow: inset 0 1px #d5ffe975,0 5px 18px #0cd18f17; }
.knyaz-preview .button.soft { background: #43edac0e; color: #bcead3; border: 1px solid #43edac1f; }
.knyaz-preview .button.outline { border-color: #a6c5b82c; color: #deece4; background: #b9e9d305; }
.knyaz-preview .button:disabled { opacity: .65; transform: none; cursor: not-allowed; }
.knyaz-preview .icon-button { min-width: 44px; min-height: 44px; border-color: #9bc6b92e; color: #d7e8df; }
.knyaz-preview :is(.button,.icon-button,.nav-item,.hub-card,.game-cover,.tab-button,.suggestion,.feature-row):focus-visible { outline: 2px solid #9effd5; outline-offset: 4px; }
.knyaz-preview .balance-card { margin-top: 16px; padding: 19px 20px; border-radius: 19px; background: linear-gradient(125deg,#182c23,#0d1b15); color: #f0fff7; border: 1px solid #4d8c692f; box-shadow: inset 0 1px #b4ffd512; }
.knyaz-preview .balance-card::after { width: 155px; height: 155px; top: -36px; right: -22px; border-color: #43edac0d; box-shadow: 0 0 0 22px #43edac02,0 0 0 23px #43edac09; }
.knyaz-preview .balance-top { color: #a6c8b6; font-size: 12px; }
.knyaz-preview .balance-top svg { color: #6bdaa5; }
.knyaz-preview .balance-card .money { font-size: clamp(28px,7.4vw,34px); letter-spacing: -1px; margin-top: 10px; line-height: 1.1; overflow-wrap: anywhere; }
.knyaz-preview .money,.knyaz-preview .history-amount,.knyaz-preview .quota-count,.knyaz-preview .leader-points { font-variant-numeric: tabular-nums; }
.knyaz-preview .currency { font-size: 13px; color: #99b7a7; margin-left: 8px; }
.knyaz-preview .balance-caption { color: #99b5a7; font-size: 11px; margin-top: 7px; }
.knyaz-preview .balance-actions { margin-top: 16px; gap: 10px; }
.knyaz-preview .balance-actions .button { flex: 1; min-height: 40px; padding: 9px 10px; font-size: 12px; }
.knyaz-preview .balance-actions .button.dark { background: #2d5e443b; border: 1px solid #71c9952e; color: #d0f8df; }
.knyaz-preview .balance-card .button.outline { color: #bbd6c8; border-color: #a6c5b822; }
.knyaz-preview .section-heading { margin: 28px 0 14px; gap: 12px; }
.knyaz-preview .section-heading h2 { font-size: 20px; font-weight: 800; letter-spacing: -.65px; }
.knyaz-preview .text-action { color: #a1c6b2; font-size: 12px; }
.knyaz-preview .rewards-hub { gap: 12px; margin-bottom: 20px; }
.knyaz-preview .hub-card { --hub-accent: #43edac; display: flex; flex-direction: column; justify-content: flex-end; min-height: 236px; padding: 16px; border-radius: 19px; border: 1px solid #75b49b26; background: #091210; box-shadow: inset 0 1px #dbffea0a,0 8px 22px #0003; }
.knyaz-preview .hub-art { position: absolute; inset: 0; height: auto; z-index: 0; overflow: hidden; }
.knyaz-preview .hub-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,#09120fff 0%,#09120fed 19%,#09120f00 51%); pointer-events: none; }
.kn-feature-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 32%; opacity: 0; transition: opacity .25s; }
.kn-art-ready .kn-feature-art { opacity: 1; }
.knyaz-preview .hub-apk .kn-feature-art { height: calc(100% - 45px); object-fit: contain; object-position: center; }
.kn-art-ready > :not(.kn-feature-art) { visibility: hidden; }
.knyaz-preview .hub-art > .wheel-scene { top: 33px; left: 50%; transform: translateX(-50%) scale(.7); transform-origin: top center; }
.knyaz-preview .hub-art > .chest-scene { top: 35px; left: 50%; transform: translateX(-50%) scale(1); filter: drop-shadow(0 12px 10px #0006); }
.knyaz-preview .hub-phone { top: 35px; left: calc(50% - 26px); }
.knyaz-preview .hub-voucher-art { position: absolute; top: 19px; left: 50%; transform: translateX(-50%); margin: 0; }
.knyaz-preview .hub-copy { position: relative; z-index: 2; gap: 6px; width: 100%; max-width: 100%; padding-right: 6px; }
.knyaz-preview .hub-copy strong,.knyaz-preview .hub-voucher .hub-copy strong { font-size: 18px; font-weight: 850; line-height: 1.2; letter-spacing: -.5px; white-space: normal; }
.knyaz-preview .hub-copy small { font-size: 11px; line-height: 1.5; color: #a9c0b4; max-width: 145px; }
.knyaz-preview .hub-arrow { bottom: 16px; right: 13px; color: #61c494; z-index: 2; }
.knyaz-preview .hub-arrow svg { width: 13px; }
.knyaz-preview .hub-ready,.knyaz-preview .hub-badge { position: absolute; top: 12px; right: 12px; z-index: 3; width: auto; height: auto; padding: 5px 7px; border-radius: 6px; font-size: 8px; line-height: 1.2; letter-spacing: .6px; font-weight: 800; color: #d4ffe7; background: #103d2acf; border: 1px solid #43edac40; box-shadow: none; }
.knyaz-preview .hub-badge { color: #d8c58e; background: #232315cb; border-color: #c0ab632d; }
.knyaz-preview .ai-spotlight { display: flex; width: 100%; gap: 13px; margin-top: 16px; min-height: 145px; border-radius: 20px; padding: 20px 43px 20px 16px; text-align: left; background: radial-gradient(ellipse at 0% 0%,#3747673d,transparent 75%),linear-gradient(120deg,#152326,#121b1d); color: #e4edf8; border: 1px solid #829ece35; }
.kn-ai-mark { display: grid; place-items: center; width: 44px; height: 50px; flex: 0 0 44px; color: #bfcdff; border: 1px solid #bdc8ff36; border-radius: 14px; background: linear-gradient(140deg,#3a466340,#131b2440); box-shadow: inset 0 1px #dfe9ff19,0 6px 18px #0002; }
.kn-ai-mark svg { width: 28px; height: 28px; }
.knyaz-preview .ai-spotlight .eyebrow { color: #a7b8d8; font-size: 9px; letter-spacing: 1px; margin: 0 0 9px; }
.knyaz-preview .ai-spotlight h2 { color: #f0f3ff; font-size: 19px; line-height: 1.23; font-weight: 800; letter-spacing: -.55px; }
.knyaz-preview .ai-spotlight p { max-width: 270px; font-size: 11px; color: #a8b8c7; margin-top: 7px; line-height: 1.6; }
.knyaz-preview .ai-spotlight .spotlight-arrow { right: 8px; bottom: calc(50% - 22px); width: 36px; min-width: 36px; min-height: 44px; color: #b8cde3; border: 0; background: transparent; }
.knyaz-preview .page-top h1 { font-weight: 800; letter-spacing: -1.25px; font-size: 31px; line-height: 1.15; }
.knyaz-preview .page-top .eyebrow { color: #62c999; font-size: 10px; letter-spacing: 1.5px; }
.knyaz-preview .page-subtitle { color: #a5b9b1; font-size: 13px; line-height: 1.65; margin-top: 10px; }
.knyaz-preview .games-hero { border-color: #43edac35; min-height: 203px; padding: 23px; background: linear-gradient(90deg,#06100bf7,#08120cc9 42%,#05100b00 85%),url('/assets/knyaz/hero.webp') 65% 44% / cover,#09150f; }
.knyaz-preview .games-hero .eyebrow { font-size: 9px; max-width: 165px; color: #8de8b4; }
.knyaz-preview .games-hero h2 { font-size: 28px; font-weight: 850; max-width: 205px; line-height: 1.12; letter-spacing: -.8px; }
.knyaz-preview .games-hero-copy { color: #b3cbbb; font-size: 12px; line-height: 1.55; max-width: 178px; }
.knyaz-preview .game-grid { gap: 13px; }
.knyaz-preview .game-card.game-cover { border: 1px solid #b1e4cf29; border-radius: 18px; box-shadow: 0 8px 24px #0005,inset 0 1px #ffffff0c; }
.knyaz-preview .game-cover::after { background: linear-gradient(180deg,#040b090a,transparent 48%,#030b0840 63%,#030b09ed 100%); }
.knyaz-preview .game-cover-caption { gap: 9px; bottom: 15px; }
.knyaz-preview .game-cover-brand { color: #bbd4c5; font-size: 8px; letter-spacing: 2px; }
.knyaz-preview .game-cover-badge { font-size: 9px; padding: 6px 8px; background: #071810ac; border-color: #e3fff036; }
.knyaz-preview .pill { font-size: 11px; padding: 6px 9px; color: #b7cbbf; background: #85c9a70c; }
.knyaz-preview .pill.lime { color: #86edb8; background: #43edac10; }
.knyaz-preview .feature-list { border-color: #80b39827; background: #0d1813; border-radius: 19px; }
.knyaz-preview .feature-row { padding: 18px 16px; }
.knyaz-preview .feature-icon { width: 42px; height: 42px; border-radius: 13px; background: #1d3e2b69; color: #80dba8; }
.knyaz-preview .feature-icon.violet { background: #2830468c; color: #bbc6e6; }
.knyaz-preview .feature-icon.gold { background: #3b331e69; color: #e9cb81; }
.knyaz-preview .feature-copy { min-width: 0; }
.knyaz-preview .feature-copy strong { font-size: 13px; font-weight: 700; }
.knyaz-preview .feature-copy p { font-size: 12px; line-height: 1.5; }
.knyaz-preview .notice { font-size: 12px; line-height: 1.7; color: #adc5b6; background: #9cddbc06; border-color: #a8cfb71c; }
.knyaz-preview .notice.warn { color: #e8cf91; background: #d9b35e07; border-color: #d9b35e26; }
.knyaz-preview .notice.violet { color: #becde1; background: #9fb9ed08; border-color: #9fb9ed25; }
.knyaz-preview .empty-state { padding: 32px 20px; border-color: #93c1aa28; background: radial-gradient(ellipse at top,#35664612,transparent 80%); }
.knyaz-preview .empty-state h3 { font-size: 17px; color: #dfede5; font-weight: 750; }
.knyaz-preview .empty-state p { font-size: 12px; color: #a5b9b1; }
.knyaz-preview .empty-state svg { width: 34px; height: 34px; color: #83c9a5; }
.knyaz-preview .tabs { padding: 5px; border-radius: 14px; background: #0b1510; border-color: #86b69a23; }
.knyaz-preview .tab-button { min-height: 44px; font-size: 12px; font-weight: 650; }
.knyaz-preview .tab-button.active { background: #21413180; color: #bdffdb; box-shadow: inset 0 0 0 1px #43edac22; }
.knyaz-preview #view .admin-panel { padding: 23px 20px; border-color: #7cab9028; border-radius: 20px; background: radial-gradient(ellipse at top left,#3f775b16,transparent 75%),#0f1a14; }
.knyaz-preview #view .admin-panel h2 { font-size: 23px; font-weight: 800; letter-spacing: -.7px; }
.knyaz-preview #view .body-copy { font-size: 13px; line-height: 1.75; color: #abc2b3; }
.knyaz-preview .metric-card { background: linear-gradient(125deg,#15271b,#101b14); border-color: #84c9992e; }
.knyaz-preview .metric-card span { font-size: 12px; }
.knyaz-preview .metric-card strong { color: #b7f3cd; font-size: 30px; font-weight: 750; }
.knyaz-preview .referral-code { background: #0a150d; border-color: #91c49c29; }
.knyaz-preview .referral-code code { color: #afeec6; overflow-wrap: anywhere; }
.knyaz-preview .quota-card { background: linear-gradient(110deg,#1b2a28,#101c1a); border-color: #8ac5b62b; padding: 17px 18px; }
.knyaz-preview .quota-card strong { font-size: 14px; font-weight: 750; }
.knyaz-preview .quota-card p { font-size: 12px; line-height: 1.5; }
.knyaz-preview .quota-count { color: #b8d7e9; font-weight: 750; }
.knyaz-preview .quota-count small { color: #94aeb8; }
.knyaz-preview .ai-screen .quota-card { background: linear-gradient(110deg,#1b2832,#131f22); border-color: #94b4e032; }
.knyaz-preview .ai-screen .composer { background: #152322; border-color: #88bdac42; box-shadow: 0 8px 28px #0002; }
.knyaz-preview .ai-screen .composer:focus-within { border-color: #a4cfec; box-shadow: 0 0 0 2px #a4cfec13; }
.knyaz-preview .composer-hint { color: #a3b7b0; font-size: 11px; }
.knyaz-preview .attachment-button { color: #bccddd; min-height: 44px; font-size: 12px; }
.knyaz-preview .send-button { background: #80edc2; color: #092119; min-width: 44px; min-height: 44px; }
.knyaz-preview .chat-message { background: #111d19; border-color: #8db99f21; font-size: 14px; color: #e0ede6; }
.knyaz-preview .chat-message.user { background: #20342d; border-color: #8dd1b126; }
.knyaz-preview .chat-message .message-role { color: #afc6ed; font-size: 10px; }
.knyaz-preview .ai-welcome-icon { background: radial-gradient(circle at 25% 20%,#53708050,#172c29); border-color: #a3c3dc3a; color: #c5dcf5; }
.knyaz-preview .ai-welcome h2 { font-weight: 750; color: #e4edf7; }
.knyaz-preview .suggestion { font-size: 12px; color: #b8ccc4; min-height: 44px; background: #a9d5c006; border-color: #a5c7b823; }
.knyaz-preview .leader-row { background: #112017; border: 1px solid #81b48c24; border-radius: 14px; margin: 9px 0; padding: 16px 13px; gap: 11px; }
.knyaz-preview .leader-place { color: #b8caba; font-weight: 750; }
.knyaz-preview .leader-row:nth-of-type(-n+5) .leader-place { color: #f3ce73; }
.knyaz-preview .leader-avatar { background: #294a3277; color: #c0efce; width: 39px; height: 39px; }
.knyaz-preview .leader-copy { font-size: 13px; min-width: 0; overflow-wrap: anywhere; font-weight: 700; }
.knyaz-preview .leader-copy small { font-size: 11px; color: #a8bdac; font-weight: 450; }
.knyaz-preview .leader-points { color: #93e5af; font-size: 12px; flex-shrink: 0; }
.knyaz-preview .sheet { background: #101b17; border-color: #85bca038; box-shadow: 0 -18px 70px #0009; }
.knyaz-preview .sheet::backdrop { background: #020806d4; }
.knyaz-preview .sheet-header { background: #101b17fa; }
.knyaz-preview .sheet-header h2 { font-size: 22px; font-weight: 800; }
.knyaz-preview .sheet-header .icon-button { width: 44px; height: 44px; }
.knyaz-preview .sheet p.body-copy { color: #adc5b6; font-size: 13px; line-height: 1.75; }
.knyaz-preview .field > span { font-size: 12px; color: #c6d8cd; }
.knyaz-preview .field :is(input,textarea,select) { background: #09130e; border-color: #b7dac429; border-radius: 12px; min-height: 46px; }
.knyaz-preview .field :is(input,textarea,select):focus-visible { outline: 2px solid #75ebae; outline-offset: 2px; }
.knyaz-preview .profile-head { padding: 22px 18px; border-radius: 19px; border: 1px solid #69ad8529; background: linear-gradient(130deg,#203a29,#122016); }
.knyaz-preview .profile-head > div { min-width: 0; }
.knyaz-preview .profile-head h3 { font-size: 20px; font-weight: 800; overflow-wrap: anywhere; }
.knyaz-preview .profile-head p { font-size: 11px; line-height: 1.65; overflow-wrap: anywhere; }
.knyaz-preview .history-copy { min-width: 0; }
.knyaz-preview .history-copy strong { font-size: 13px; font-weight: 650; }
.knyaz-preview .history-copy p { font-size: 11px; line-height: 1.5; }
.knyaz-preview .history-amount { font-size: 13px; }
.knyaz-preview .support-thread { background: #14241a; border-color: #89c99c26; border-radius: 15px; }
.knyaz-preview .support-reply { background: #25433180; border-color: #75c89832; }
.knyaz-preview .box-choice { height: 180px; border-color: #95bc793d; background: linear-gradient(0deg,#0c1b1366,transparent 70%),url('/assets/knyaz/mystery.webp') center/cover,#0c1b13; color: #f3ce73; font-size: 11px; font-weight: 800; }
.knyaz-preview .box-choice .chest-scene { visibility: hidden; }
.kn-box-label { position: absolute; top: 12px; left: 12px; padding: 5px 7px; border: 1px solid #e7c46e32; border-radius: 6px; background: #08170ece; color: #ead492; line-height: 1.2; font-size: 10px; letter-spacing: .7px; }
.knyaz-preview .box-choice:disabled { opacity: .7; }
.knyaz-preview .apk-intro { position: relative; padding: 22px 95px 22px 20px; background: linear-gradient(120deg,#1a3028,#101e18); border-color: #67c99830; }
.knyaz-preview .apk-intro::after { content: ''; position: absolute; right: 0; top: 15px; width: 93px; height: 125px; background: url('/assets/knyaz/official-download.webp') center/contain no-repeat; mask-image: radial-gradient(ellipse,#000 36%,transparent 73%); pointer-events: none; }
.knyaz-preview .apk-intro .eyebrow { color: #8de7bb; }
.knyaz-preview .apk-intro h2 { font-size: 25px; font-weight: 800; line-height: 1.15; }
.knyaz-preview .apk-intro p:last-child { color: #afc6b8; font-size: 12px; }
.knyaz-preview .apk-provider { background: #122119; border-color: #8ac6a12a; }
.knyaz-preview .apk-provider small,.knyaz-preview .apk-description,.knyaz-preview .apk-catalog-note { color: #aec8b6; font-size: 12px; }
.knyaz-preview .apk-logo { background: #223d2c; color: #b7eac9; }
.knyaz-preview .apk-promo-link,.knyaz-preview .apk-link { color: #9de2bc; font-size: 12px; min-height: 44px; }
.knyaz-preview .vc { --vc-ink: #eaf5ee; --vc-muted: #a3bcb0; --vc-line: #98bca629; --vc-violet: #7adfa8; --vc-lime: #b8e6a1; }
.knyaz-preview .vb-head { padding-right: 83px; }
.knyaz-preview .vb-head .vc-test { position: static; display: inline-flex; margin-top: 12px; color: #f3ce73; background: #3b331650; border-color: #f3ce7340; }
.knyaz-preview .vb-head::after { content: ''; position: absolute; right: 0; top: 0; width: 90px; height: 110px; background: url('/assets/knyaz/voucher.webp') center/contain no-repeat; mask-image: linear-gradient(90deg,transparent,#000 20%); }
.knyaz-preview .vb-tabs { background: #0a150f; border-color: #8abd9b22; }
.knyaz-preview .vb-tab { min-height: 44px; font-size: 12px; color: #a9c1b1; }
.knyaz-preview .vb-tab.selected { background: #43edac12; color: #b4f9d3; box-shadow: inset 0 0 0 1px #43edac22; }
.knyaz-preview .vb-box { background: #112219; border-color: #81b7922c; }
.knyaz-preview .vb-box:disabled { opacity: .7; }
.knyaz-preview .vb-box-name { color: #e5f4e9; font-size: 13px; }
.knyaz-preview .vb-box-subtitle,.knyaz-preview .vb-box-action { font-size: 11px; color: #acc8b5; }
.knyaz-preview .vb-box-art:not(:has(.vb-box-cover)) { background: url('/assets/knyaz/voucher.webp') center/contain no-repeat; }
.knyaz-preview .vb-box-art:not(:has(.vb-box-cover)) > * { visibility: hidden; }
.knyaz-preview :is(.vc-start,.vc-generation,.vc-result) { background: radial-gradient(ellipse at top,#52816412,transparent),#101e16; border-color: #87bf982d; }
.knyaz-preview .vc-button { background: linear-gradient(140deg,#81f1ba,#45d99a); color: #082618; border-color: #81f1ba33; min-height: 44px; }
.knyaz-preview .vc-button-secondary { color: #b4dcc2; background: #91d5aa0c; border-color: #91d5aa29; }
.knyaz-preview .vc-coupon { background: #1c301b80; border-color: #e0c67d5c; }
.knyaz-preview .vc-code { color: #f4df9f; }
.knyaz-preview .vc-detail h4 { color: #b4d9bf; font-size: 12px; }
.knyaz-preview .vc-footnote { color: #a9bcaf; font-size: 11px; }
.knyaz-preview .vc-progress span { background: linear-gradient(90deg,#43edac,#cde798); box-shadow: 0 0 12px #43edac30; }
.knyaz-preview .vc-terms summary { color: #cde5d4; font-size: 13px; }
.knyaz-preview .sp-premium { color: #eaf6ee; }
.knyaz-preview .sp-stage::before { background: #43edac; }
.knyaz-preview .sp-wheel { background: #122c1d; box-shadow: inset 0 0 36px #06170c; }
.knyaz-preview .sp-heading h2 { font-weight: 850; }
.knyaz-preview .sp-description { color: #aec8b8; font-size: 13px; }
.knyaz-preview .sp-hub { background: radial-gradient(circle at 35% 20%,#335844,#0c1d13 75%); }
.knyaz-preview .sp-rim { background: conic-gradient(from 35deg,#e6ce92,#53633b 13%,#ba9a54 26%,#2a4932 39%,#efdca9 51%,#7e794b 66%,#22422f 82%,#dfc78b); box-shadow: 0 1px #e6cf93,inset 0 0 0 3px #123424,inset 0 0 0 5px #af965a,0 0 0 2px #254933; }
.knyaz-preview .sp-hub { box-shadow: 0 4px 14px #03120baa,inset 0 0 0 4px #1a3b26; }
.knyaz-preview .sp-spin-button { background: linear-gradient(120deg,#8af0bd,#43edac); color: #0a2518; box-shadow: 0 4px 0 #285b3e,0 10px 25px #43edac19; }
.knyaz-preview .sp-status { color: #b2c9bb; }
.knyaz-preview .sp-footnote { color: #a6beaf; font-size: 11px; }
.knyaz-preview .sp-odds summary { color: #c4ddc8; font-size: 12px; }
.knyaz-preview .sp-result { background: #152b1c; border-color: #afd98a3d; }
.knyaz-preview .sp-eyebrow { color: #e4c881; }
.knyaz-preview .sp-odds { border-color: #84b7922b; background: #0b1910; }
.knyaz-preview .entry-heading { font-weight: 800; }
.knyaz-preview .entry-heading em { color: #76f0b4; }
.knyaz-preview .entry-symbol { color: #8aefb8; background: linear-gradient(140deg,#224431,#122619); border-color: #80d89c36; }
.knyaz-preview .entry-description { color: #afc6b6; }
.knyaz-preview .entry-privacy { color: #a1b4a7; font-size: 11px; }
.knyaz-preview .desktop-story h2 { margin-top: 59px; font-size: 39px; font-weight: 800; letter-spacing: -1.7px; line-height: 1.15; }
.knyaz-preview .desktop-story h2 em { color: #77d69f; }
.knyaz-preview .desktop-story > p { color: #9fb7a7; font-size: 13px; line-height: 1.8; }
.knyaz-preview .story-index { color: #80a28d; font-size: 9px; }
.knyaz-preview .small-star { color: #9bd3ac; }
.kn-story-art { position: relative; margin: 28px -10px 10px; aspect-ratio: 1; }
.kn-story-art img { width: 100%; height: 100%; object-fit: contain; mask-image: radial-gradient(ellipse,#000 48%,transparent 73%); }
.kn-story-art > span { position: absolute; bottom: 13px; left: 0; right: 0; color: #b5d3bd; font-size: 9px; letter-spacing: 3px; line-height: 2; text-align: center; }
.kn-story-art strong { color: #81e3a4; font-size: 11px; }
.knyaz-preview .story-note { border-color: #84b38e27; margin-top: 8px; }
.knyaz-preview .story-note strong { color: #c4dccb; }
.knyaz-preview .story-note p { color: #93ad9b; font-size: 11px; }
.knyaz-preview .note-number { color: #71c98e; }
@media (hover:hover) and (pointer:fine) {
  .knyaz-preview .hub-card:hover { transform: translateY(-3px); border-color: #72dba681; box-shadow: 0 10px 30px #0005,0 0 0 1px #43edac13; }
  .knyaz-preview .feature-row:hover { background: #84dbaa07; }
  .knyaz-preview .kn-hero .button:hover { box-shadow: 0 6px 23px #43edac27; }
}
@media (min-width:1101px) {
  .knyaz-preview .app-layout { max-width: 1330px; grid-template-columns: 195px minmax(0,520px) minmax(230px,280px); gap: 45px; }
  .knyaz-preview .hub-card { min-height: 270px; padding: 19px; }
  .knyaz-preview .hub-copy strong { font-size: 21px; }
  .knyaz-preview .hub-copy small { max-width: 180px; font-size: 12px; }
  .kn-hero { min-height: 324px; }
  .kn-hero-copy { padding: 31px 27px; }
}
@media (max-width:900px) {
  .knyaz-preview .topbar { height: 78px; }
  .knyaz-preview .wordmark { font-size: 13px; }
  .knyaz-preview .page-top h1 { font-size: 29px; }
  .knyaz-preview .ai-screen .page-top h1 { font-size: 24px; }
  .knyaz-preview .ai-screen .page-subtitle { font-size: 12px; }
  .knyaz-preview .ai-screen .quota-card { padding: 11px 13px; }
  .knyaz-preview .ai-screen .quota-card p { font-size: 11px; }
  .knyaz-preview .ai-screen .quota-card strong { font-size: 12px; }
  .knyaz-preview .ai-screen .attachment-button { min-height: 40px; }
  .knyaz-preview .ai-screen .send-button { min-width: 44px; min-height: 44px; }
  /* Height and positioning still come from mobile-viewport.css. */
  .knyaz-preview[data-page='ai'] .topbar { height: 60px; flex-basis: 60px; }
  .keyboard-open .knyaz-preview[data-page='ai'] .topbar { height: 46px; flex-basis: 46px; }
  .keyboard-open .knyaz-preview .ai-screen .quota-card { padding: 7px 11px; }
}
@media (max-width:370px) {
  .kn-hero { min-height: 282px; }
  .kn-hero-copy { max-width: 84%; padding: 24px 17px; }
  .kn-hero h1 { font-size: 29px; letter-spacing: -1.2px; }
  .kn-club-label { font-size: 8px; letter-spacing: .7px; }
  .kn-hero-copy > p { max-width: 154px; font-size: 11px; }
  .knyaz-preview .hub-card { min-height: 220px; padding: 13px; }
  .knyaz-preview .hub-copy strong,.knyaz-preview .hub-voucher .hub-copy strong { font-size: 16px; }
  .knyaz-preview .hub-copy small { font-size: 11px; padding-right: 3px; }
  .knyaz-preview .hub-arrow { right: 9px; bottom: 12px; }
  .knyaz-preview .ai-spotlight { gap: 10px; padding-left: 13px; }
  .kn-ai-mark { width: 36px; height: 43px; flex-basis: 36px; }
  .knyaz-preview .ai-spotlight h2 { font-size: 17px; }
  .knyaz-preview .balance-card { padding: 18px; }
  .knyaz-preview .section-heading h2 { font-size: 18px; }
  .knyaz-preview .games-hero h2 { font-size: 24px; max-width: 175px; }
  .knyaz-preview .games-hero-copy { font-size: 11px; max-width: 155px; }
  .knyaz-preview .game-cover-badge { font-size: 8px; }
  .knyaz-preview .apk-intro { padding-right: 76px; }
  .knyaz-preview .apk-intro::after { width: 73px; }
  .knyaz-preview .apk-intro h2 { font-size: 22px; }
  .knyaz-preview .vb-grid { gap: 8px; }
  .knyaz-preview .vb-box { padding-left: 7px; padding-right: 7px; }
  .knyaz-preview .vb-box-name { font-size: 12px; }
}
@media (prefers-reduced-motion:reduce) {
  .knyaz-preview :is(.kn-feature-art,.hub-card,.button,.nav-item,.game-cover-image,.feature-row,.kn-hero) { transition: none; animation: none; }
  .knyaz-preview :is(.hub-card,.button):hover,.knyaz-preview :is(.hub-card,.button):active { transform: none; }
}

/* Brand catalog: platform controls remain visible while links are pending. */
.apk-provider .apk-provider-head { gap: 16px; align-items: center; }
.apk-provider .apk-logo { width: 112px; height: 64px; flex: 0 0 112px; padding: 8px; border-radius: 12px; background: #10171c; }
.apk-provider .apk-logo img { width: 100%; height: 100%; object-fit: contain; }
.apk-provider .apk-downloads { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.apk-provider .apk-platform, .apk-provider .apk-promo-link { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 58px; padding: 10px; }
.apk-provider .apk-promo-link { width: 100%; margin-top: 10px; }
.apk-platform-icon { display: inline-flex; flex: 0 0 23px; width: 23px; height: 23px; }
.apk-platform-icon svg { width: 23px; height: 23px; }
.apk-button-copy { display: flex; flex-direction: column; text-align: left; gap: 2px; }
.apk-button-copy strong { font-size: 13px; }
.apk-button-copy small { font-size: 10px; font-weight: 400; opacity: .7; }
.apk-provider button:disabled { opacity: .62; cursor: default; }

/* Wide brand artwork above platform links. */
.apk-provider { overflow: hidden; }
.apk-provider .apk-accessible-title { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.apk-provider .apk-provider-banner { display: grid; place-items: center; width: 100%; min-width: 0; aspect-ratio: 21 / 9; overflow: hidden; border-radius: 12px; background: #090e15; color: #fff; font-size: 25px; font-weight: 800; }
.apk-provider-banner img { display: block; width: 100%; height: 100%; object-fit: contain; }
.apk-provider .apk-downloads { margin-top: 12px; }
.apk-provider .apk-button-copy { min-width: 0; }
.apk-provider .apk-button-copy strong { white-space: normal; overflow-wrap: anywhere; }
.apk-provider .apk-promo-link { border: 1px solid #314c3e; border-radius: 12px; }
@media(max-width:420px) { .apk-provider { padding: 12px; } .apk-provider .apk-provider-banner { border-radius: 9px; } }