@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cinzel+Decorative:wght@400;700&family=EB+Garamond:ital,wght@0,400;0,500;1,400&family=Fira+Code:wght@400;500&display=swap');

:root {
    --clr-bg:           #0b0a09;
    --clr-surface:      #1a1612;
    --clr-panel:        #211d17;
    --clr-border:       #7a5c2e;
    --clr-gold:         #c8a84b;
    --clr-gold-bright:  #f0c060;
    --clr-gold-dim:     #8a6d30;
    --clr-amber:        #d4881e;
    --clr-text:         #d4c4a0;
    --clr-text-muted:   #8a7a5a;
    --clr-code-bg:      #160f08;
    --clr-shadow:       0 4px 24px rgba(0,0,0,0.8);
    --clr-glow:         0 0 6px rgba(200,168,75,0.15);
}

[data-md-color-scheme="slate"] {
    --md-default-bg-color:        var(--clr-bg);
    --md-default-fg-color:        var(--clr-text);
    --md-default-fg-color--light: var(--clr-text-muted);
    --md-primary-fg-color:        var(--clr-bg);
    --md-primary-bg-color:        var(--clr-gold);
    --md-accent-fg-color:         var(--clr-gold-bright);
    --md-typeset-a-color:         var(--clr-gold);
    --md-code-bg-color:           var(--clr-code-bg);
    --md-code-fg-color:           #d4b896;
}

[data-md-color-scheme="default"] {
    --clr-bg:           #f5f0e8;
    --clr-surface:      #ede4d0;
    --clr-panel:        #e0d4b8;
    --clr-border:       #b89a60;
    --clr-gold:         #7a5c1e;
    --clr-gold-bright:  #5a3e0e;
    --clr-gold-dim:     #a07840;
    --clr-amber:        #8b4a00;
    --clr-text:         #2a1f0e;
    --clr-text-muted:   #6b5530;
    --clr-code-bg:      #ede4d0;
    --clr-shadow:       0 4px 24px rgba(0,0,0,0.12);
    --clr-glow:         0 0 6px rgba(120,90,30,0.15);
    --md-default-bg-color:        var(--clr-bg);
    --md-default-fg-color:        var(--clr-text);
    --md-default-fg-color--light: var(--clr-text-muted);
    --md-primary-fg-color:        var(--clr-bg);
    --md-primary-bg-color:        var(--clr-gold);
    --md-accent-fg-color:         var(--clr-gold-bright);
    --md-typeset-a-color:         var(--clr-gold);
    --md-code-bg-color:           var(--clr-code-bg);
    --md-code-fg-color:           #5a3e0e;
}

body {
    background-color: var(--clr-bg);
    background-image:
        radial-gradient(ellipse at 20% 0%, rgba(80,50,10,0.15) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 100%, rgba(60,30,5,0.12) 0%, transparent 60%),
        url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    font-family: 'EB Garamond', Georgia, serif;
}

[data-md-color-scheme="default"] body {
    background-image:
        radial-gradient(ellipse at 20% 0%, rgba(180,140,60,0.08) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 100%, rgba(160,120,40,0.06) 0%, transparent 60%),
        url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
}

.md-typeset {
    font-family: 'EB Garamond', Georgia, serif;
    font-size: 0.9rem;
    line-height: 1.65;
    color: var(--clr-text);
}

.md-header {
    background: linear-gradient(180deg, #0d0b09 0%, #1a1510 100%);
    border-bottom: 1px solid var(--clr-border);
    box-shadow: 0 1px 8px rgba(0,0,0,0.6);
}

[data-md-color-scheme="default"] .md-header {
    background: linear-gradient(180deg, #e8dcc4 0%, #ddd0b0 100%);
}

.md-header__title {
    font-family: 'Cinzel Decorative', 'Cinzel', serif;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: 0.08em;
    color: var(--clr-gold) !important;
    text-shadow: 0 0 10px rgba(200,168,75,0.2), 0 2px 4px rgba(0,0,0,0.8);
}

[data-md-color-scheme="default"] .md-header__title {
    text-shadow: 0 1px 2px rgba(255,255,255,0.5);
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
    filter: drop-shadow(0 0 3px rgba(200,168,75,0.3));
}

.md-search__form {
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-radius: 3px;
}

.md-search__form:focus-within {
    border-color: var(--clr-gold-dim);
    box-shadow: 0 0 8px rgba(200,168,75,0.2);
}

.md-search__input {
    font-family: 'EB Garamond', serif;
    color: var(--clr-text);
}

.md-search__input::placeholder {
    color: var(--clr-text-muted);
}

.md-nav {
    font-family: 'EB Garamond', Georgia, serif;
}

.md-sidebar {
    background: var(--clr-bg);
}

.md-nav__title {
    font-family: 'Cinzel', serif;
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--clr-gold) !important;
    border-bottom: none;
    padding-bottom: 0.4rem;
    margin-bottom: 0.4rem;
}

.md-nav--primary .md-nav__title {
    background: var(--md-default-bg-color);
    box-shadow: 0 0 0.3rem 0.3rem var(--md-default-bg-color);
    position: sticky;
    top: 0;
    z-index: 1;
}

.md-nav__link {
    color: var(--clr-text-muted) !important;
    transition: color 0.2s, padding-left 0.2s;
    font-size: 0.95rem;
}

.md-nav__link:hover,
.md-nav__link:focus {
    color: var(--clr-gold) !important;
    padding-left: 0.25rem;
}

.md-nav__link--active {
    color: var(--clr-gold-bright) !important;
    font-weight: 600;
}

.md-nav--secondary .md-nav__title {
    font-family: 'Cinzel', serif;
    color: var(--clr-gold-dim) !important;
    font-size: 0.7rem;
    letter-spacing: 0.12em;
}

.md-nav--secondary .md-nav__link {
    font-size: 0.88rem;
}

.md-main {
    background: var(--clr-bg);
}

.md-content {
    background: transparent;
}

.md-content__inner {
    padding: 2rem 2.5rem;
}

.md-content__button {
    color: var(--clr-gold-dim);
    opacity: 0.6;
    transition: opacity 0.2s, color 0.2s;
    position: relative;
    z-index: 1;
}

.md-content__button:hover {
    opacity: 1;
    color: var(--clr-gold);
}

.md-typeset h1 {
    font-family: 'Cinzel Decorative', 'Cinzel', serif;
    font-weight: 700;
    font-size: 1.6rem;
    color: var(--clr-gold-bright);
    text-shadow: 0 0 12px rgba(200,168,75,0.15), 0 2px 4px rgba(0,0,0,0.9);
    letter-spacing: 0.04em;
    border-bottom: none;
    padding-bottom: 0.6rem;
    margin-bottom: 1.5rem;
}

[data-md-color-scheme="default"] .md-typeset h1 {
    text-shadow: 0 1px 3px rgba(255,255,255,0.6);
}

.md-typeset h2 {
    font-family: 'Cinzel', serif;
    font-weight: 600;
    font-size: 1.2rem;
    color: var(--clr-gold);
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--clr-border);
    padding-bottom: 0.4rem;
    margin-top: 2.5rem;
}

.md-typeset h3 {
    font-family: 'Cinzel', serif;
    font-weight: 600;
    font-size: 1rem;
    color: var(--clr-amber);
    letter-spacing: 0.02em;
    margin-top: 2rem;
}

.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
    font-family: 'Cinzel', serif;
    color: var(--clr-text);
}

.md-typeset a {
    color: var(--clr-gold);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: color 0.2s, border-color 0.2s;
}

.md-typeset a:hover {
    color: var(--clr-gold-bright);
    border-bottom-color: var(--clr-gold-dim);
    text-shadow: 0 0 6px rgba(200,168,75,0.15);
}

.md-typeset table:not([class]) {
    border: 1px solid var(--clr-border);
    border-radius: 3px;
    overflow: hidden;
    box-shadow: var(--clr-shadow);
    background: var(--clr-surface);
}

.md-typeset table:not([class]) th {
    background: var(--clr-panel);
    color: var(--clr-gold);
    font-family: 'Cinzel', serif;
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--clr-border);
    padding: 0.65rem 1rem;
}

.md-typeset table:not([class]) td {
    border-color: var(--clr-border);
    padding: 0.55rem 1rem;
    color: var(--clr-text);
}

.md-typeset table:not([class]) tr:nth-child(even) {
    background: rgba(255,255,255,0.02);
}

.md-typeset table:not([class]) tr:hover td {
    background: rgba(200,168,75,0.05);
}

.md-typeset code {
    background: var(--clr-code-bg);
    color: #c8a06a;
    border: 1px solid var(--clr-border);
    border-radius: 2px;
    font-family: 'Fira Code', monospace;
    font-size: 0.88em;
    padding: 0.05em 0.35em;
}

[data-md-color-scheme="default"] .md-typeset code {
    color: var(--clr-amber);
}

.md-typeset pre > code {
    background: var(--clr-code-bg);
    border: 1px solid var(--clr-border);
    box-shadow: inset 0 2px 12px rgba(0,0,0,0.5);
}

.highlight {
    background: var(--clr-code-bg) !important;
    border: 1px solid var(--clr-border);
    border-radius: 3px;
}

.md-typeset .admonition,
.md-typeset details {
    background: var(--clr-surface);
    border-color: var(--clr-border);
    border-radius: 3px;
    box-shadow: var(--clr-shadow);
}

.md-typeset .admonition-title,
.md-typeset summary {
    font-family: 'Cinzel', serif;
    font-size: 0.85rem;
    letter-spacing: 0.06em;
    background: var(--clr-panel);
}

.md-typeset .note > .admonition-title    { color: var(--clr-gold);   border-color: var(--clr-gold-dim); }
.md-typeset .warning > .admonition-title { color: var(--clr-amber);  border-color: var(--clr-amber); }
.md-typeset .danger > .admonition-title  { color: #c0392b;           border-color: #c0392b; }
.md-typeset .tip > .admonition-title     { color: #6aaa64;           border-color: #4a8a44; }

.md-footer {
    background: var(--clr-bg);
    border-top: 1px solid var(--clr-border);
}

.md-footer-meta {
    background: var(--clr-bg);
}

[data-md-color-scheme="default"] .md-footer,
[data-md-color-scheme="default"] .md-footer-meta {
    background: #ddd0b0;
}

.md-footer__title {
    font-family: 'Cinzel', serif;
    color: var(--clr-gold-dim);
}

.md-footer__link:hover .md-footer__title {
    color: var(--clr-gold);
}

.md-top {
    background: var(--clr-panel);
    border: 1px solid var(--clr-border);
    color: var(--clr-gold);
    font-family: 'Cinzel', serif;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    box-shadow: var(--clr-shadow);
}

.md-top:hover {
    background: var(--clr-surface);
    color: var(--clr-gold-bright);
    box-shadow: var(--clr-glow), var(--clr-shadow);
}

.md-typeset .tabbed-labels > label {
    font-family: 'Cinzel', serif;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    color: var(--clr-text-muted);
    border-bottom: 2px solid transparent;
}

.md-typeset .tabbed-labels > label:hover {
    color: var(--clr-gold);
}

.md-typeset [data-md-component="tabbed-labels"] > .tabbed-input:checked ~ label,
.md-typeset .tabbed-labels > .tabbed-input:checked + label {
    color: var(--clr-gold);
    border-bottom-color: var(--clr-gold);
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--clr-bg);
}

::-webkit-scrollbar-thumb {
    background: var(--clr-border);
    border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--clr-gold-dim);
}

::selection {
    background: rgba(200,168,75,0.25);
    color: var(--clr-gold-bright);
}

[data-md-color-scheme="default"] ::selection {
    background: rgba(120,90,30,0.2);
}

.md-typeset hr {
    border: none;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--clr-border) 30%, var(--clr-gold-dim) 50%, var(--clr-border) 70%, transparent 100%);
    margin: 2rem 0;
    position: relative;
    overflow: visible;
}

.md-typeset hr::after {
    content: '✦';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--clr-bg);
    color: var(--clr-gold-dim);
    padding: 0 0.5rem;
    font-size: 0.8rem;
    text-shadow: 0 0 4px rgba(200,168,75,0.25);
}

.md-typeset kbd {
    background: var(--clr-panel);
    border: 1px solid var(--clr-border);
    color: var(--clr-text);
    box-shadow: 0 2px 0 var(--clr-border);
    font-family: 'Fira Code', monospace;
}

.md-typeset blockquote {
    border-left: 3px solid var(--clr-gold-dim);
    background: var(--clr-surface);
    color: var(--clr-text-muted);
    padding: 0.8rem 1.2rem;
    font-style: italic;
    font-family: 'EB Garamond', serif;
}

.md-typeset dt {
    font-family: 'Cinzel', serif;
    font-size: 0.9rem;
    color: var(--clr-gold);
    letter-spacing: 0.04em;
    margin-top: 1rem;
}