/* ==========================================================================
   NOVIBET CONTENT STYLES — Dark Theme
   Стили для всех элементов контента внутри .nv-article__body
   Gutenberg blocks + classic HTML elements
   ========================================================================== */

/* ==========================================================================
   HEADINGS
   ========================================================================== */

.nv-article__body h1 {
    font-size: 2rem;
    font-weight: 700;
    color: var(--nv-text);
    line-height: 1.25;
    margin: 2.5rem 0 1rem;
}

.nv-article__body h2 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--nv-text);
    line-height: 1.3;
    margin: 2.5rem 0 0.85rem;
}

.nv-article__body h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--nv-text);
    line-height: 1.35;
    margin: 2rem 0 0.75rem;
}

.nv-article__body h4 {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--nv-text);
    line-height: 1.4;
    margin: 1.75rem 0 0.65rem;
}

.nv-article__body h5 {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--nv-text);
    line-height: 1.45;
    margin: 1.5rem 0 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.nv-article__body h6 {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--nv-text-secondary);
    line-height: 1.5;
    margin: 1.25rem 0 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* First heading after article start — no top margin */
.nv-article__body > h2:first-child,
.nv-article__body > h3:first-child {
    margin-top: 0;
}

/* ==========================================================================
   PARAGRAPHS & INLINE
   ========================================================================== */

.nv-article__body p {
    margin: 0 0 1.15rem;
    color: var(--nv-text-secondary);
    font-size: 0.935rem;
    line-height: 1.75;
}

/* Lead / intro paragraph */
.nv-article__body .is-style-nv-lead,
.nv-article__body .nv-lead {
    font-size: 1.1rem;
    color: #b8bcc5;
    line-height: 1.7;
    margin-bottom: 1.5rem;
}

.nv-article__body strong,
.nv-article__body b {
    color: var(--nv-text);
    font-weight: 600;
}

.nv-article__body em,
.nv-article__body i {
    font-style: italic;
}

.nv-article__body u {
    text-decoration-color: var(--nv-accent);
    text-underline-offset: 3px;
}

.nv-article__body s,
.nv-article__body del {
    color: var(--nv-text-secondary);
}

.nv-article__body mark {
    background: rgba(41, 168, 172, 0.15);
    color: var(--nv-text);
    padding: 0.1em 0.3em;
    border-radius: 3px;
}

.nv-article__body small {
    font-size: 0.82rem;
    color: var(--nv-text-secondary);
}

.nv-article__body abbr[title] {
    text-decoration: underline dotted var(--nv-accent);
    cursor: help;
}

.nv-article__body sup,
.nv-article__body sub {
    font-size: 0.75em;
}

/* ==========================================================================
   LINKS
   ========================================================================== */

.nv-article__body a {
    color: var(--nv-accent);
    text-decoration: underline;
    text-decoration-color: rgba(41, 168, 172, 0.4);
    text-underline-offset: 2px;
    transition: color var(--nv-transition), text-decoration-color var(--nv-transition);
}

.nv-article__body a:hover {
    color: var(--nv-accent-hover);
    text-decoration-color: var(--nv-accent-hover);
}

/* External link indicator */
.nv-article__body a[target="_blank"]::after {
    content: '\2009\2197';
    font-size: 0.75em;
    vertical-align: super;
    text-decoration: none;
    display: inline;
}

/* Don't show arrow on buttons/CTA links */
.nv-cta-block a[target="_blank"]::after,
.nv-article__body .wp-block-button__link[target="_blank"]::after {
    content: none;
}

/* ==========================================================================
   LISTS
   ========================================================================== */

.nv-article__body ul,
.nv-article__body ol {
    margin: 0 0 1.25rem;
    padding-left: 1.5rem;
    color: var(--nv-text-secondary);
    font-size: 0.935rem;
    line-height: 1.75;
}

.nv-article__body ul {
    list-style: none;
    padding-left: 0;
}

.nv-article__body ul > li {
    position: relative;
    padding-left: 1.4rem;
    margin-bottom: 0.4rem;
}

.nv-article__body ul > li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.6em;
    width: 6px;
    height: 6px;
    background: var(--nv-accent);
    border-radius: 50%;
}

.nv-article__body ol > li {
    margin-bottom: 0.4rem;
}

.nv-article__body ol > li::marker {
    color: var(--nv-accent);
    font-weight: 600;
}

/* Nested lists */
.nv-article__body ul ul,
.nv-article__body ol ol,
.nv-article__body ul ol,
.nv-article__body ol ul {
    margin: 0.4rem 0 0.4rem 0;
}

.nv-article__body ul ul > li::before {
    background: transparent;
    border: 1.5px solid var(--nv-accent);
}

/* ==========================================================================
   BLOCKQUOTE
   ========================================================================== */

.nv-article__body blockquote,
.nv-article__body .wp-block-quote {
    margin: 1.5rem 0;
    padding: 1.25rem 1.5rem;
    border-left: 4px solid var(--nv-accent);
    background: var(--nv-input-bg);
    border-radius: 0 var(--nv-radius-sm) var(--nv-radius-sm) 0;
    quotes: none;
}

.nv-article__body blockquote::before,
.nv-article__body blockquote::after,
.nv-article__body .wp-block-quote::before,
.nv-article__body .wp-block-quote::after {
    content: none;
    display: none;
}

.nv-article__body blockquote p,
.nv-article__body .wp-block-quote p {
    color: #b8bcc5;
    font-size: 1rem;
    font-style: italic;
    margin-bottom: 0.5rem;
}

.nv-article__body blockquote p:last-child,
.nv-article__body .wp-block-quote p:last-child {
    margin-bottom: 0;
}

.nv-article__body blockquote cite,
.nv-article__body .wp-block-quote cite {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.82rem;
    color: var(--nv-text-secondary);
    font-style: normal;
}

.nv-article__body blockquote cite::before {
    content: '— ';
}

/* ==========================================================================
   PULLQUOTE
   ========================================================================== */

.nv-article__body .wp-block-pullquote {
    margin: 2rem 0;
    padding: 1.5rem 2rem;
    border-top: 3px solid var(--nv-accent);
    border-bottom: 3px solid var(--nv-accent);
    border-left: none;
    background: transparent;
    text-align: center;
    border-radius: 0;
    quotes: none;
}

.nv-article__body .wp-block-pullquote::before,
.nv-article__body .wp-block-pullquote::after {
    content: none;
    display: none;
}

.nv-article__body .wp-block-pullquote blockquote {
    border-left: none;
    background: transparent;
    padding: 0;
    margin: 0;
    quotes: none;
}

.nv-article__body .wp-block-pullquote blockquote::before,
.nv-article__body .wp-block-pullquote blockquote::after {
    content: none;
    display: none;
}

.nv-article__body .wp-block-pullquote p {
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--nv-text);
    font-style: italic;
}

.nv-article__body .wp-block-pullquote cite {
    color: var(--nv-text-secondary);
    font-size: 0.85rem;
}

/* ==========================================================================
   TABLES
   ========================================================================== */

.nv-article__body table,
.nv-article__body .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5rem 0;
    background: var(--nv-input-bg);
    font-size: 0.875rem;
    border: none;
}

.nv-article__body .wp-block-table {
    margin: 1.5rem 0;
    overflow: hidden;
    border-radius: var(--nv-radius-sm);
    background: var(--nv-input-bg);
}

.nv-article__body .wp-block-table table {
    margin: 0;
    border-radius: 0;
}

.nv-article__body table th,
.nv-article__body .wp-block-table th {
    background: var(--nv-input-bg);
    color: var(--nv-text);
    font-weight: 600;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.75rem 1rem;
    text-align: left;
    border: none;
    border-bottom: 2px solid var(--nv-border);
}

.nv-article__body table td,
.nv-article__body .wp-block-table td {
    padding: 0.7rem 1rem;
    color: var(--nv-text-secondary);
    border: none;
    border-bottom: 1px solid var(--nv-border);
}

.nv-article__body table tr:last-child td {
    border-bottom: none;
}

/* Striped table */
.nv-article__body .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.02);
}

.nv-article__body .wp-block-table figcaption {
    font-size: 0.78rem;
    color: var(--nv-text-secondary);
    text-align: center;
    margin-top: 0.5rem;
}

/* ==========================================================================
   IMAGES & FIGURES
   ========================================================================== */

.nv-article__body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--nv-radius-sm);
}

.nv-article__body .wp-block-image {
    margin: 1.5rem 0;
}

.nv-article__body .wp-block-image img {
    display: block;
}

.nv-article__body .wp-block-image.aligncenter {
    text-align: center;
}

.nv-article__body .wp-block-image.aligncenter img {
    width: 100%;
    max-width: 100%;
}

.nv-article__body .wp-block-image.alignleft {
    float: left;
    margin: 0.5rem 1.5rem 1rem 0;
    max-width: 50%;
}

.nv-article__body .wp-block-image.alignright {
    float: right;
    margin: 0.5rem 0 1rem 1.5rem;
    max-width: 50%;
}

.nv-article__body figure {
    margin: 0;
}

.nv-article__body figcaption,
.nv-article__body .wp-block-image figcaption {
    font-size: 0.78rem;
    color: var(--nv-text-secondary);
    text-align: center;
    margin-top: 0.5rem;
    line-height: 1.4;
}

/* ==========================================================================
   COLUMNS
   ========================================================================== */

.nv-article__body .wp-block-columns {
    display: flex;
    gap: 1.5rem;
    margin: 1.5rem 0;
}

.nv-article__body .wp-block-column {
    flex: 1;
    min-width: 0;
}

@media (max-width: 768px) {
    .nv-article__body .wp-block-columns {
        flex-direction: column;
    }
}

/* ==========================================================================
   DETAILS / FAQ (Accordion)
   ========================================================================== */

.nv-article__body details,
.nv-article__body .wp-block-details {
    margin: 0.5rem 0;
    background: var(--nv-input-bg);
    border: 1px solid var(--nv-border);
    border-radius: var(--nv-radius-sm);
    overflow: hidden;
}

.nv-article__body details summary,
.nv-article__body .wp-block-details summary {
    padding: 0.9rem 1.25rem;
    font-weight: 600;
    font-size: 0.935rem;
    color: var(--nv-text);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: background var(--nv-transition);
    list-style: none;
}

.nv-article__body details summary::-webkit-details-marker {
    display: none;
}

.nv-article__body details summary::after {
    content: '+';
    font-size: 1.2rem;
    font-weight: 400;
    color: var(--nv-accent);
    transition: transform var(--nv-transition);
    flex-shrink: 0;
    margin-left: 1rem;
}

.nv-article__body details[open] summary::after {
    content: '−';
}

.nv-article__body details summary:hover {
    background: rgba(255, 255, 255, 0.03);
}

.nv-article__body details > *:not(summary) {
    padding: 0 1.25rem;
}

.nv-article__body details > p:last-child {
    padding-bottom: 1rem;
}

/* FAQ wrapper */
.nv-article__body .nv-faq {
    margin: 1.5rem 0;
}

.nv-article__body .nv-faq details {
    margin: 0;
    border-radius: 0;
    border-bottom: none;
}

.nv-article__body .nv-faq details:first-child {
    border-radius: var(--nv-radius-sm) var(--nv-radius-sm) 0 0;
}

.nv-article__body .nv-faq details:last-child {
    border-radius: 0 0 var(--nv-radius-sm) var(--nv-radius-sm);
    border-bottom: 1px solid var(--nv-border);
}

/* ==========================================================================
   CODE
   ========================================================================== */

.nv-article__body code {
    background: var(--nv-input-bg);
    color: var(--nv-accent);
    padding: 0.15em 0.45em;
    border-radius: 4px;
    font-size: 0.85em;
    font-family: 'SF Mono', 'Fira Code', Consolas, monospace;
}

.nv-article__body pre,
.nv-article__body .wp-block-code {
    margin: 1.5rem 0;
    padding: 1.25rem;
    background: var(--nv-input-bg);
    border: 1px solid var(--nv-border);
    border-radius: var(--nv-radius-sm);
    overflow-x: auto;
}

.nv-article__body pre code,
.nv-article__body .wp-block-code code {
    background: transparent;
    padding: 0;
    font-size: 0.84rem;
    line-height: 1.65;
    color: var(--nv-text-secondary);
}

/* ==========================================================================
   SEPARATOR / DIVIDER
   ========================================================================== */

.nv-article__body hr,
.nv-article__body .wp-block-separator {
    margin: 2rem 0;
    border: none;
    border-top: 1px solid var(--nv-border);
}

.nv-article__body .wp-block-separator.is-style-wide {
    border-top-width: 2px;
}

.nv-article__body .wp-block-separator.is-style-dots {
    border: none;
    text-align: center;
}

.nv-article__body .wp-block-separator.is-style-dots::before {
    content: '···';
    color: var(--nv-text-muted);
    font-size: 1.5rem;
    letter-spacing: 1rem;
}

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

.nv-article__body .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 1.5rem 0;
}

.nv-article__body .wp-block-button__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1.5rem;
    border-radius: var(--nv-radius-sm);
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none;
    transition: all var(--nv-transition);
    cursor: pointer;
    border: none;
    background: var(--nv-accent);
    color: #ffffff;
}

.nv-article__body .wp-block-button__link:hover {
    background: var(--nv-accent-hover);
    box-shadow: 0 4px 20px var(--nv-accent-glow);
    color: #ffffff;
    border-bottom: none;
}

/* Outline style */
.nv-article__body .wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    border: 2px solid var(--nv-accent);
    color: var(--nv-accent);
}

.nv-article__body .wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: var(--nv-accent);
    color: #ffffff;
}

/* ==========================================================================
   CALLOUT / NOTICE BOXES
   Custom blocks using <div class="nv-callout nv-callout--{type}">
   ========================================================================== */

.nv-article__body .nv-callout {
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border-radius: var(--nv-radius-sm);
    border-left: 4px solid;
    font-size: 0.9rem;
    line-height: 1.65;
}

.nv-article__body .nv-callout p {
    margin: 0 0 0.5rem;
    color: inherit;
}

.nv-article__body .nv-callout p:last-child {
    margin-bottom: 0;
}

.nv-article__body .nv-callout__title {
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* Info */
.nv-callout--info {
    background: rgba(59, 130, 246, 0.05);
    border-color: rgba(59, 130, 246, 0.5);
    color: var(--nv-text-secondary);
}

.nv-callout--info .nv-callout__title {
    color: #7ba8e6;
}

/* Warning */
.nv-callout--warning {
    background: rgba(245, 166, 35, 0.05);
    border-color: rgba(245, 166, 35, 0.5);
    color: var(--nv-text-secondary);
}

.nv-callout--warning .nv-callout__title {
    color: #d4a44a;
}

/* Tip / Success */
.nv-callout--tip {
    background: rgba(0, 212, 170, 0.04);
    border-color: rgba(0, 212, 170, 0.5);
    color: var(--nv-text-secondary);
}

.nv-callout--tip .nv-callout__title {
    color: var(--nv-accent);
}

/* Danger */
.nv-callout--danger {
    background: rgba(255, 71, 87, 0.05);
    border-color: rgba(255, 71, 87, 0.5);
    color: var(--nv-text-secondary);
}

.nv-callout--danger .nv-callout__title {
    color: #e06570;
}

/* ==========================================================================
   COVER IMAGE
   ========================================================================== */

.nv-article__body .wp-block-cover {
    margin: 1.5rem 0;
    border-radius: var(--nv-radius);
    overflow: hidden;
    min-height: 250px;
}

/* ==========================================================================
   GROUP / BOX
   ========================================================================== */

.nv-article__body .wp-block-group {
    margin: 1.5rem 0;
}

.nv-article__body .wp-block-group.has-background {
    padding: 1.25rem 1.5rem;
    border-radius: var(--nv-radius-sm);
}

/* ==========================================================================
   GALLERY
   ========================================================================== */

.nv-article__body .wp-block-gallery {
    margin: 1.5rem 0;
    gap: 0.75rem;
}

.nv-article__body .wp-block-gallery .wp-block-image img {
    border-radius: var(--nv-radius-sm);
}

/* ==========================================================================
   EMBED / VIDEO
   ========================================================================== */

.nv-article__body .wp-block-embed {
    margin: 1.5rem 0;
}

.nv-article__body .wp-block-embed__wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: var(--nv-radius-sm);
}

.nv-article__body .wp-block-embed__wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 768px) {
    .nv-article__body h1 { font-size: 1.6rem; }
    .nv-article__body h2 { font-size: 1.3rem; }
    .nv-article__body h3 { font-size: 1.1rem; }
    .nv-article__body h4 { font-size: 1rem; }

    .nv-article__body .wp-block-image.alignleft,
    .nv-article__body .wp-block-image.alignright {
        float: none;
        max-width: 100%;
        margin: 1rem 0;
    }

    .nv-article__body table {
        font-size: 0.8rem;
    }

    .nv-article__body table th,
    .nv-article__body table td {
        padding: 0.5rem 0.65rem;
    }

    .nv-article__body .wp-block-pullquote p {
        font-size: 1.05rem;
    }
}

@media (min-width: 769px) {
    .nv-article__body h2 {
        margin-top: 3.5rem;
    }
}

/* Light theme overrides removed — site uses dark theme natively */

/* ==========================================================================
   CTA BLOCKS (affiliate only)
   ========================================================================== */

.nv-cta-block {
    background: rgba(41, 168, 172, 0.06);
    border: 1.5px solid rgba(41, 168, 172, 0.25);
    border-radius: var(--nv-radius-sm, 6px);
    padding: 2.25rem 2.5rem;
    margin: 2.5rem 0;
    text-align: center;
}

.nv-article__body .nv-cta-block__title,
.nv-cta-block .nv-cta-block__title {
    color: var(--nv-text);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    line-height: 1.25;
}

.nv-article__body .nv-cta-block__text,
.nv-cta-block .nv-cta-block__text {
    color: var(--nv-text-secondary);
    font-size: 1.1rem;
    font-weight: 400;
    margin: 0 0 1.5rem;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.65;
    max-width: 600px;
}

.nv-cta-block .wp-block-buttons {
    justify-content: center;
    margin: 0;
}

.nv-article__body .nv-cta-block .wp-block-button__link,
.nv-cta-block .wp-block-button__link {
    font-size: 1.05rem;
    padding: 0.85rem 2.5rem;
    min-height: 48px;
}

/* Gradient button (logo colors) + shine animation */
.nv-btn-shine {
    background: linear-gradient(135deg, #00B2C7, #00D58D) !important;
    color: #fff !important;
    position: relative;
    overflow: hidden;
    border: none !important;
}

.nv-btn-shine:hover {
    background: linear-gradient(135deg, #00c4da, #00e89a) !important;
    color: #fff !important;
    box-shadow: 0 4px 24px rgba(0, 213, 141, 0.3) !important;
}

@keyframes nv-shine {
    0% { left: -75%; }
    100% { left: 125%; }
}

.nv-btn-shine::after {
    content: '';
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.3),
        transparent
    );
    transform: skewX(-20deg);
    animation: nv-shine 3s ease-in-out infinite;
    pointer-events: none;
}

/* Light theme CTA overrides removed — dark theme natively */

/* ==========================================================================
   DEMO CONTAINER (iframe)
   ========================================================================== */

.nv-demo-container {
    aspect-ratio: 16 / 9;
    max-width: 100%;
    min-height: 450px;
    margin: 1.5rem 0;
    background: var(--nv-input-bg);
    border: 1px solid var(--nv-border);
    border-radius: var(--nv-radius-sm, 6px);
    overflow: hidden;
}

.nv-demo-container iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

@media (max-width: 768px) {
    .nv-demo-container {
        min-height: 300px;
    }
}

/* ==========================================================================
   DEMO OVERLAY (lazy-load + bonus card)
   ========================================================================== */

.nv-demo-overlay {
    position: absolute;
    inset: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(18, 21, 27, 0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    border-radius: var(--nv-radius-sm, 6px);
    transition: opacity 0.35s ease;
}

.nv-demo-overlay--hidden {
    opacity: 0;
    pointer-events: none;
}

.nv-demo-overlay__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    padding: 1.5rem;
    width: 100%;
    max-width: 400px;
}

/* Play button — uses existing .nv-btn-shine gradient + animation */
.nv-demo-overlay__play {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 2rem;
    border-radius: var(--nv-radius-sm, 8px);
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
    min-height: 48px;
    border: none;
    /* .nv-btn-shine provides background, color, ::after shine */
}

.nv-demo-overlay__play svg {
    flex-shrink: 0;
}

/* Bonus card */
.nv-demo-overlay__bonus {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.65rem;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(245, 197, 24, 0.35);
    border-radius: var(--nv-radius-sm, 8px);
    background: rgba(245, 197, 24, 0.06);
    width: 100%;
    text-align: center;
}

.nv-demo-overlay__bonus-text {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--nv-gold);
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.4;
}

.nv-demo-overlay__bonus-text svg {
    flex-shrink: 0;
    color: var(--nv-gold);
}

.nv-demo-overlay__bonus-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.55rem 1.6rem;
    background: var(--nv-gold);
    color: #ffffff !important;
    border-radius: var(--nv-radius-sm, 8px);
    font-weight: 700;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
    min-height: 40px;
    transition: background var(--nv-transition), box-shadow var(--nv-transition);
}

.nv-demo-overlay__bonus-btn:hover {
    background: var(--nv-gold-hover);
    color: #ffffff !important;
    box-shadow: 0 4px 20px rgba(245, 197, 24, 0.2);
}

/* Fullscreen button — always dark bg, SVG icon via background-image */
.nv-demo-fs {
    position: absolute;
    bottom: 8px;
    right: 8px;
    z-index: 10;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background-color: rgba(18, 21, 27, 0.85);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8 2H3C2.73478 2 2.48043 2.10536 2.29289 2.29289C2.10536 2.48043 2 2.73478 2 3V8C2 8.26522 2.10536 8.51957 2.29289 8.70711C2.48043 8.89464 2.73478 9 3 9C3.26522 9 3.51957 8.89464 3.70711 8.70711C3.89464 8.51957 4 8.26522 4 8V4H8C8.26522 4 8.51957 3.89464 8.70711 3.70711C8.89464 3.51957 9 3.26522 9 3C9 2.73478 8.89464 2.48043 8.70711 2.29289C8.51957 2.10536 8.26522 2 8 2V2ZM8 20H4V16C4 15.7348 3.89464 15.4804 3.70711 15.2929C3.51957 15.1054 3.26522 15 3 15C2.73478 15 2.48043 15.1054 2.29289 15.2929C2.10536 15.4804 2 15.7348 2 16V21C2 21.2652 2.10536 21.5196 2.29289 21.7071C2.48043 21.8946 2.73478 22 3 22H8C8.26522 22 8.51957 21.8946 8.70711 21.7071C8.89464 21.5196 9 21.2652 9 21C9 20.7348 8.89464 20.4804 8.70711 20.2929C8.51957 20.1054 8.26522 20 8 20V20ZM21 2H16C15.7348 2 15.4804 2.10536 15.2929 2.29289C15.1054 2.48043 15 2.73478 15 3C15 3.26522 15.1054 3.51957 15.2929 3.70711C15.4804 3.89464 15.7348 4 16 4H20V8C20 8.26522 20.1054 8.51957 20.2929 8.70711C20.4804 8.89464 20.7348 9 21 9C21.2652 9 21.5196 8.89464 21.7071 8.70711C21.8946 8.51957 22 8.26522 22 8V3C22 2.73478 21.8946 2.48043 21.7071 2.29289C21.5196 2.10536 21.2652 2 21 2V2ZM21 15C20.7348 15 20.4804 15.1054 20.2929 15.2929C20.1054 15.4804 20 15.7348 20 16V20H16C15.7348 20 15.4804 20.1054 15.2929 20.2929C15.1054 20.4804 15 20.7348 15 21C15 21.2652 15.1054 21.5196 15.2929 21.7071C15.4804 21.8946 15.7348 22 16 22H21C21.2652 22 21.5196 21.8946 21.7071 21.7071C21.8946 21.5196 22 21.2652 22 21V16C22 15.7348 21.8946 15.4804 21.7071 15.2929C21.5196 15.1054 21.2652 15 21 15Z' fill='%2300D4AA'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 26px 26px;
    border: 1px solid rgba(0, 212, 170, 0.3);
    cursor: pointer;
    transition: background-color var(--nv-transition), border-color var(--nv-transition);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.nv-demo-fs:hover {
    background-color: rgba(18, 21, 27, 0.95);
    border-color: rgba(0, 212, 170, 0.6);
}

/* Fullscreen active — make container fill screen */
.nv-demo-container:fullscreen,
.nv-demo-container:-webkit-full-screen {
    background: #000;
    border-radius: 0;
    border: none;
}

.nv-demo-container:fullscreen .nv-demo-fs,
.nv-demo-container:-webkit-full-screen .nv-demo-fs {
    bottom: 16px;
    right: 16px;
}

/* CSS fullscreen fallback (iOS Safari, mobile browsers without Fullscreen API) */
.nv-demo-fs--active {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    aspect-ratio: auto !important;
    background: #000 !important;
}

.nv-demo-fs--active .nv-demo-fs {
    bottom: 16px;
    right: 16px;
}

/* Light theme demo overrides removed — dark theme natively */

/* Mobile responsive */
@media (max-width: 768px) {
    .nv-demo-overlay__content {
        padding: 1rem;
        max-width: 280px;
    }

    .nv-demo-overlay__play {
        font-size: 0.9rem;
        padding: 0.75rem 1.5rem;
        width: 100%;
    }

    .nv-demo-overlay__bonus {
        padding: 0.85rem 1rem;
    }

    .nv-demo-overlay__bonus-text {
        font-size: 0.75rem;
    }

    .nv-demo-overlay__bonus-btn {
        font-size: 0.75rem;
        padding: 0.5rem 1.25rem;
        width: 100%;
    }
}