@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700;0,800;1,600&family=Space+Mono:wght@400;700&family=Work+Sans:wght@400;500;600;700&display=swap');

:root {
    color-scheme: dark;

    /* Master palette */
    --owya-ink: #241f1b;
    --owya-paper: #f6f1e8;
    --owya-paper-deep: #ede5d9;
    --owya-terra: #a94328;
    --owya-terra-hover: #87351f;
    --owya-night: #0d0c0b;
    --owya-night-soft: #171513;
    --owya-night-raised: #211e1b;
    --owya-light: #f6f1e8;
    --owya-light-muted: #c7beb4;
    --owya-light-quiet: #91877d;
    --owya-line-dark: rgba(246, 241, 232, 0.14);
    --owya-line-light: #c9bdae;
    --owya-accent-dark: #e08364;
    --owya-action: #b84b2e;
    --owya-focus: #4da3e6;
    --owya-success: #79c7a1;
    --owya-warning: #e8bb73;
    --owya-error: #ff9b91;

    /* Typography */
    --owya-font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --owya-font-body: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --owya-font-ui: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --owya-font-meta: 'Space Mono', Consolas, monospace;
    --owya-reading-width: 68ch;

    /* Spacing */
    --owya-space-1: 0.25rem;
    --owya-space-2: 0.5rem;
    --owya-space-3: 0.75rem;
    --owya-space-4: 1rem;
    --owya-space-5: 1.5rem;
    --owya-space-6: 2rem;
    --owya-space-7: 3rem;
    --owya-space-8: 4.5rem;

    /* Shape, border, elevation */
    --owya-radius-sm: 0.35rem;
    --owya-radius-md: 0.6rem;
    --owya-radius-lg: 0.85rem;
    --owya-radius-pill: 999px;
    --owya-border: 1px solid var(--owya-line-dark);
    --owya-shadow-sm: 0 4px 14px rgba(0, 0, 0, 0.16);
    --owya-shadow-md: 0 16px 42px rgba(0, 0, 0, 0.22);

    /* State and motion */
    --owya-transition-fast: 140ms ease;
    --owya-transition-standard: 220ms cubic-bezier(0.2, 0, 0, 1);
    --owya-breakpoint-compact: 48rem;
    --owya-breakpoint-wide: 75rem;
}

html { max-width: 100%; }

body[data-owya-mode] {
    min-width: 0;
    max-width: 100%;
    font-family: var(--owya-font-body);
    font-size: 1rem;
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    overflow-wrap: break-word;
}

body[data-owya-mode='academy'],
body[data-owya-mode='community'] {
    color-scheme: dark;
    --bg-dark: var(--owya-night);
    --bg-card: var(--owya-night-soft);
    --bg-card-hover: var(--owya-night-raised);
    --text-primary: var(--owya-light);
    --text-secondary: var(--owya-light-muted);
    --text-muted: var(--owya-light-quiet);
    --accent-primary: var(--owya-accent-dark);
    --accent-secondary: #eea087;
    --border-light: var(--owya-line-dark);
    --border-accent: rgba(224, 131, 100, 0.42);
    --gradient-terra: var(--owya-action);
    --gradient-glass: none;
    --font-heading: var(--owya-font-display);
    --font-body: var(--owya-font-body);
    --shadow-sm: var(--owya-shadow-sm);
    --shadow-md: var(--owya-shadow-md);
    --shadow-glow: none;
    --transition-fast: var(--owya-transition-fast);
    --transition-medium: var(--owya-transition-standard);
    background: var(--owya-night);
    color: var(--owya-light);
}

body[data-owya-mode='movement'],
body[data-owya-mode='workbook'],
body[data-owya-mode='certificate'] {
    color-scheme: light;
    --paper: var(--owya-paper);
    --paper-dark: var(--owya-paper-deep);
    --paper-darker: #e4dacb;
    --ink: var(--owya-ink);
    --ink-light: #655d55;
    --ink-muted: #7b7167;
    --border-paper: var(--owya-line-light);
    --border-paper-dark: #b7aa9a;
    --accent: var(--owya-terra);
    --accent-glow: rgba(169, 67, 40, 0.1);
    --accent-line: rgba(169, 67, 40, 0.55);
    --focus: #0b67b2;
    --bg-dark: var(--owya-paper);
    --bg-card: #fffdf9;
    --bg-card-hover: var(--owya-paper-deep);
    --text-primary: var(--owya-ink);
    --text-secondary: #655d55;
    --text-muted: #7b7167;
    --accent-primary: var(--owya-terra);
    --accent-secondary: var(--owya-terra-hover);
    --border-light: var(--owya-line-light);
    --border-accent: rgba(169, 67, 40, 0.55);
    --font-heading: var(--owya-font-display);
    --font-body: var(--owya-font-body);
    background: var(--owya-paper);
    color: var(--owya-ink);
}

body[data-owya-mode] h1,
body[data-owya-mode] h2 {
    font-family: var(--owya-font-display);
    letter-spacing: -0.018em;
    text-wrap: balance;
}

body[data-owya-mode] h3,
body[data-owya-mode] h4,
body[data-owya-mode] h5,
body[data-owya-mode] h6,
body[data-owya-mode] button,
body[data-owya-mode] input,
body[data-owya-mode] select,
body[data-owya-mode] textarea {
    font-family: var(--owya-font-ui);
}

body[data-owya-mode] p,
body[data-owya-mode] li { max-width: var(--owya-reading-width); }

body[data-owya-mode] :focus-visible {
    outline: 3px solid var(--owya-focus) !important;
    outline-offset: 3px;
}

body[data-owya-mode] ::selection {
    background: rgba(224, 131, 100, 0.32);
}

.navbar-brand,
.owya-wordmark,
.logo,
.logo-mark {
    font-family: var(--owya-font-display) !important;
    font-weight: 800 !important;
    letter-spacing: 0.055em !important;
    white-space: nowrap;
}

.navbar-brand .brand-arm,
.owya-wordmark .brand-arm,
.logo .brand-arm {
    margin-left: 0.55rem;
    font-family: var(--owya-font-meta) !important;
    font-size: 0.55em;
    font-weight: 400;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    opacity: 0.72;
}

body[data-owya-mode] .text-gradient,
body.page-sales .logo,
body.page-sales .hero h1 span {
    background: none !important;
    color: var(--accent-primary) !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
}

body[data-owya-mode] .btn,
body[data-owya-mode] .cta-button,
body[data-owya-mode] .nav-button,
body[data-owya-mode] .btn-pay {
    min-height: 2.75rem;
    border-radius: var(--owya-radius-md) !important;
    font-family: var(--owya-font-ui) !important;
    font-weight: 650;
    letter-spacing: 0.01em;
    box-shadow: none !important;
    transform: none;
    transition: color var(--owya-transition-fast), background var(--owya-transition-fast), border-color var(--owya-transition-fast);
}

body[data-owya-mode] .btn-primary,
body[data-owya-mode] .cta-button,
body[data-owya-mode] .nav-button,
body[data-owya-mode] .btn-pay {
    background: var(--owya-action) !important;
    border: 1px solid var(--owya-action) !important;
    color: #fff !important;
}

body[data-owya-mode] .btn-primary:hover,
body[data-owya-mode] .cta-button:hover,
body[data-owya-mode] .nav-button:hover,
body[data-owya-mode] .btn-pay:hover {
    background: var(--owya-terra-hover) !important;
    border-color: var(--owya-terra-hover) !important;
    color: #fff !important;
    transform: none !important;
}

body[data-owya-mode] .btn-secondary:hover { transform: none !important; }

body[data-owya-mode] .glass-card {
    background: var(--bg-card) !important;
    background-image: none !important;
    border-radius: var(--owya-radius-lg) !important;
    box-shadow: none;
    backdrop-filter: none;
}

body[data-owya-mode] .glass-card:hover {
    transform: none;
    border-color: var(--border-accent);
}

body[data-owya-mode] .form-control,
body[data-owya-mode] .form-group input,
body[data-owya-mode] .form-group textarea,
body[data-owya-mode] .form-group select {
    border-radius: var(--owya-radius-md) !important;
}

body[data-owya-mode='academy'] .navbar,
body[data-owya-mode='community'] .navbar {
    background: rgba(13, 12, 11, 0.94);
    border-bottom-color: var(--owya-line-dark);
}

body[data-owya-mode='movement'] .navbar {
    background: rgba(246, 241, 232, 0.94) !important;
    border-bottom-color: var(--owya-line-light) !important;
}

body.page-sales { background: var(--owya-night) !important; color: var(--owya-light) !important; }
body.page-sales nav,
body.page-sales footer { background: rgba(13, 12, 11, 0.96) !important; border-color: var(--owya-line-dark) !important; }
body.page-sales nav a,
body.page-sales footer { color: var(--owya-light-muted) !important; }
body.page-sales .hero { padding-block: clamp(4.5rem, 10vw, 8rem) !important; }
body.page-sales .hero p,
body.page-sales .problem-card p,
body.page-sales .feature-item p,
body.page-sales .testimonial-role,
body.page-sales .price-period,
body.page-sales .final-cta p { color: var(--owya-light-muted) !important; }
body.page-sales .problem,
body.page-sales .features,
body.page-sales .testimonials,
body.page-sales .final-cta { background: var(--owya-night-soft) !important; border-color: var(--owya-line-dark) !important; }
body.page-sales .problem-card,
body.page-sales .module-card,
body.page-sales .feature-item,
body.page-sales .testimonial,
body.page-sales .pricing-card,
body.page-sales .faq-item {
    background: var(--owya-night-soft) !important;
    background-image: none !important;
    border-color: var(--owya-line-dark) !important;
    border-radius: var(--owya-radius-lg) !important;
    box-shadow: none !important;
    transform: none !important;
}
body.page-sales .module-card:hover { background: var(--owya-night-raised) !important; border-color: var(--border-accent) !important; transform: none !important; }
body.page-sales .feature-icon { background: rgba(224, 131, 100, 0.12) !important; border-color: var(--border-accent) !important; }
body.page-sales .pricing-card::before { background: var(--owya-action) !important; }

body.page-checkout .checkout-container,
body.page-success .success-card { border-radius: var(--owya-radius-lg) !important; box-shadow: var(--owya-shadow-sm) !important; }
body.page-checkout .checkout-left { background: var(--owya-night-raised) !important; }
body.page-checkout .guarantee { border-color: rgba(232, 187, 115, 0.48) !important; background: rgba(232, 187, 115, 0.08) !important; }
body.page-checkout .guarantee svg path { fill: rgba(232, 187, 115, 0.2) !important; stroke: var(--owya-warning) !important; }

body.page-community .thread-card,
body.page-community .reply-card,
body.page-community .moderation-card,
body.page-community dialog { border-radius: var(--owya-radius-lg) !important; }

body[data-owya-mode='workbook'] {
    --ink: var(--owya-ink);
    --muted: #655d55;
    --paper: #fffdf9;
    --canvas: var(--owya-paper-deep);
    --line: var(--owya-line-light);
    --accent: var(--owya-terra);
    --accent-soft: #f4ded5;
    --safe: #315d50;
    --focus: #0b67b2;
    font-family: var(--owya-font-body) !important;
}
body[data-owya-mode='workbook'] h1,
body[data-owya-mode='workbook'] h2,
body[data-owya-mode='workbook'] .principle { font-family: var(--owya-font-display) !important; }
body[data-owya-mode='workbook'] .workbook { box-shadow: var(--owya-shadow-md) !important; }

body.page-certificate { font-family: var(--owya-font-body) !important; background: var(--owya-paper-deep) !important; color: var(--owya-ink) !important; }
body.page-certificate .cert-inner { background-color: #fffdf9; }
body.page-certificate h1,
body.page-certificate .student-name,
body.page-certificate .sig-line,
body.page-certificate .logo-mark { font-family: var(--owya-font-display) !important; }
body.page-certificate h1,
body.page-certificate .sig-line,
body.page-certificate .logo-mark { color: var(--owya-terra) !important; }
body.page-certificate .badge,
body.page-certificate .btn { background: var(--owya-action) !important; box-shadow: none !important; }

body.page-legal .legal-content h1 { color: var(--owya-ink); }

.academy-mobile-nav { display: none; }

@media (max-width: 48rem) {
    .container { padding-inline: 1rem; }
    body[data-owya-mode] .glass-card { padding: 1.25rem; }
    body.page-home .navbar .container { padding-inline: 1rem !important; }
    body.page-home .nav-actions { gap: 0.5rem !important; }
    body.page-home .nav-actions .nav-link { display: none; }
    body.page-home .navbar-brand .brand-arm { display: none; }
    body.page-sales nav .container { flex-direction: row !important; gap: 0.75rem !important; padding-inline: 1rem; }
    body.page-sales .sales-nav-actions { gap: 0.5rem !important; }
    body.page-sales .sales-nav-actions a { display: none; }
    body.page-sales .logo .brand-arm { display: none; }
    body.page-sales .nav-button { padding-inline: 1rem; }

    .academy-mobile-nav {
        position: fixed;
        inset: 0 0 auto;
        z-index: 140;
        min-height: 4rem;
        padding: 0.75rem 1rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        background: rgba(13, 12, 11, 0.97);
        border-bottom: 1px solid var(--owya-line-dark);
    }
    .academy-mobile-nav details { position: relative; }
    .academy-mobile-nav summary {
        min-height: 2.5rem;
        padding: 0.55rem 0.85rem;
        display: inline-flex;
        align-items: center;
        border: 1px solid var(--owya-line-dark);
        border-radius: var(--owya-radius-md);
        color: var(--owya-light);
        font-weight: 650;
        cursor: pointer;
        list-style: none;
    }
    .academy-mobile-nav summary::-webkit-details-marker { display: none; }
    .academy-mobile-nav .mobile-nav-panel {
        position: absolute;
        top: calc(100% + 0.75rem);
        right: 0;
        width: min(17rem, calc(100vw - 2rem));
        padding: 0.6rem;
        display: grid;
        gap: 0.25rem;
        background: var(--owya-night-soft);
        border: 1px solid var(--owya-line-dark);
        border-radius: var(--owya-radius-lg);
        box-shadow: var(--owya-shadow-md);
    }
    .academy-mobile-nav .mobile-nav-panel a {
        padding: 0.7rem 0.8rem;
        border-radius: var(--owya-radius-md);
        color: var(--owya-light-muted);
    }
    .academy-mobile-nav .mobile-nav-panel a:hover,
    .academy-mobile-nav .mobile-nav-panel a[aria-current='page'] {
        color: var(--owya-light);
        background: var(--owya-night-raised);
    }
    body.page-community .main-content { margin-top: 4rem; }
    body.page-course .reader-header { flex-direction: column; gap: 1rem; }
    body.page-course .reader-header #worksheetButton { align-self: flex-start; }
    body.page-course > .navbar { z-index: 150; }
    body.page-course .module-sidebar.mobile-open {
        position: fixed;
        inset: 4.5rem 0 0;
        z-index: 140;
        width: 100%;
        display: block !important;
        overflow-y: auto;
        border-right: 0;
        background: var(--owya-night-soft);
    }

    body.page-certificate { display: block; padding: 5rem 0.75rem 1rem; }
    body.page-certificate .controls { position: fixed; inset: 0 0 auto; padding: 0.75rem; justify-content: center; background: rgba(246, 241, 232, 0.96); z-index: 20; }
    body.page-certificate .cert-wrapper { width: 100%; height: auto; min-height: 57rem; padding: 0.5rem; }
    body.page-certificate .cert-inner { min-height: 56rem; padding: 4rem 1rem 2rem; border-width: 6px; justify-content: flex-start; }
    body.page-certificate h1,
    body.page-certificate h1 font { max-width: 100%; font-size: clamp(1.55rem, 8vw, 2.4rem); letter-spacing: 0.08em; overflow-wrap: anywhere; word-break: break-word; }
    body.page-certificate h2 { margin-bottom: 1.5rem; font-size: 0.85rem; }
    body.page-certificate .student-name { min-width: 0; width: 90%; font-size: clamp(1.7rem, 10vw, 2.8rem); }
    body.page-certificate .course-details { margin-bottom: 1rem; font-size: 0.95rem; }
    body.page-certificate .badge { position: static; flex: 0 0 auto; width: 64px; height: 64px; margin: 0.75rem auto 1.5rem; font-size: 0.62rem; }
    body.page-certificate .signatures { gap: 1rem; margin-top: auto; }
    body.page-certificate .sig-block { width: 48%; }
}

@media (max-width: 87.5rem) {
    body.page-home .handwritten-note { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

@media print {
    body.page-certificate { padding: 0; background: #fff !important; }
    body.page-certificate .cert-wrapper { width: 100%; height: 100%; min-height: 0; }
    body.page-certificate .cert-inner { min-height: 0; padding: 60px; border-width: 12px; justify-content: center; }
    body.page-certificate .badge { position: absolute; width: 100px; height: 100px; margin: 0; bottom: 40px; font-size: 0.8rem; }
}
