:root{
    --fm-bg:#0b0f10;
    --fm-bg-2:#0d1213;
    --fm-surface:#111718;
    --fm-surface-2:#151c1d;
    --fm-border:rgba(210,220,215,.12);
    --fm-border-strong:rgba(210,220,215,.22);
    --fm-text:#f3f5f2;
    --fm-soft:#cbd1cd;
    --fm-muted:#9ba39f;
    --fm-green:#76d564;
    --fm-green-2:#94e783;
    --fm-shadow:0 24px 70px rgba(0,0,0,.34);
    --fm-header-h:72px;
}

html{min-height:100%;background:var(--fm-bg)}
body{
    min-height:100vh;
    margin:0;
    background:linear-gradient(180deg,#0b0f10 0%,#0d1213 100%);
    color:var(--fm-text);
    font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    text-rendering:optimizeLegibility
}
a{color:var(--fm-green)}
body.fm-nav-open{overflow:hidden}

[data-layout-header]:empty{
    display:block;
    min-height:var(--fm-header-h);
    background:#0b0f10;
    border-bottom:1px solid var(--fm-border)
}
[data-layout-footer]:empty{display:block;min-height:240px}

/* Header */
.fm-header{
    position:sticky;
    top:0;
    z-index:1000
}
.fm-nav{
    min-height:var(--fm-header-h);
    background:linear-gradient(180deg,rgba(11,15,16,.98),rgba(8,12,13,.97));
    border-bottom:1px solid var(--fm-border);
    box-shadow:0 8px 24px rgba(0,0,0,.24);
    backdrop-filter:blur(18px) saturate(140%);
    -webkit-backdrop-filter:blur(18px) saturate(140%)
}
.fm-nav__inner{
    min-height:var(--fm-header-h);
    display:flex;
    align-items:center;
    gap:2rem
}
.fm-brand{
    display:inline-flex;
    align-items:center;
    gap:.66rem;
    color:#fff;
    text-decoration:none;
    flex:0 0 auto
}
.fm-brand:hover{color:#fff}
.fm-brand__mark{
    width:43px;
    height:43px;
    object-fit:contain;
    filter:drop-shadow(0 7px 14px rgba(0,0,0,.25))
}
.fm-brand__text{
    display:inline-flex;
    align-items:baseline;
    font-size:1.52rem;
    line-height:1;
    font-weight:800;
    letter-spacing:-.045em
}
.fm-brand__fantasy{color:#fff}
.fm-brand__mate{color:var(--fm-green)}
.fm-nav__content{
    display:flex;
    align-items:center;
    min-width:0;
    flex:1
}
.fm-nav__list{
    display:flex;
    align-items:center;
    gap:.18rem;
    margin:0;
    padding:0;
    list-style:none
}
.fm-nav__item{position:relative}
.fm-nav__link{
    display:inline-flex;
    align-items:center;
    gap:.45rem;
    min-height:42px;
    padding:.64rem .82rem;
    color:#bcc7d5;
    background:transparent;
    border:0;
    border-radius:5px;
    font:inherit;
    font-size:.91rem;
    font-weight:700;
    line-height:1;
    text-decoration:none;
    cursor:pointer;
    transition:color .16s ease,background-color .16s ease,transform .16s ease
}
.fm-nav__link:hover,
.fm-nav__link:focus-visible,
.fm-nav__link.is-active,
.fm-nav__item.is-open>.fm-nav__link{
    color:#fff;
    background:rgba(255,255,255,.045);
    outline:none
}
.fm-nav__link.is-active::after{
    content:"";
    position:absolute;
    right:.82rem;
    bottom:.19rem;
    left:.82rem;
    height:2px;
    border-radius:999px;
    background:var(--fm-green);
    box-shadow:none
}
.fm-nav__trigger svg{
    width:10px;
    height:7px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    transition:transform .16s ease
}
.fm-nav__item.is-open .fm-nav__trigger svg{transform:rotate(180deg)}
.fm-nav__actions{
    display:flex;
    align-items:center;
    gap:.65rem;
    margin-left:auto
}
.fm-nav__signin{
    padding:.6rem .7rem;
    color:#c2ccd9;
    font-size:.88rem;
    font-weight:700;
    text-decoration:none;
    border-radius:9px
}
.fm-nav__signin:hover{color:#fff;background:rgba(255,255,255,.05)}
.fm-nav__premium{
    padding:.62rem 1.02rem;
    color:#0b0f10;
    background:var(--fm-green);
    border-radius:5px;
    box-shadow:none;
    font-size:.86rem;
    font-weight:850;
    text-decoration:none;
    transition:background .16s ease,transform .16s ease,box-shadow .16s ease
}
.fm-nav__premium:hover,
.fm-nav__premium.is-active{
    color:#0b0f10;
    background:var(--fm-green-2);
    transform:translateY(-1px);
    box-shadow:none
}

/* Dropdown */
.fm-dropdown{
    position:absolute;
    top:100%;
    left:0;
    width:min(390px,calc(100vw - 2rem));
    padding:.72rem;
    color:var(--fm-text);
    background:linear-gradient(180deg,rgba(21,28,29,.99),rgba(13,18,19,.99));
    border:1px solid var(--fm-border-strong);
    border-radius:8px;
    box-shadow:var(--fm-shadow);
    opacity:0;
    visibility:hidden;
    transform:translateY(-6px) scale(.985);
    transform-origin:top left;
    transition:opacity .16s ease,transform .16s ease,visibility .16s linear;
    pointer-events:none
}
.fm-dropdown::before{
    content:"";
    position:absolute;
    display:none
}
.fm-nav__item.is-open>.fm-dropdown{
    opacity:1;
    visibility:visible;
    transform:translateY(0) scale(1);
    pointer-events:auto
}
.fm-dropdown--models{
    display:grid;
    width:min(570px,calc(100vw - 2rem));
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.65rem
}
.fm-dropdown--right{right:0;left:auto;transform-origin:top right}
.fm-dropdown__section{
    min-width:0;
    padding:.8rem;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:14px
}
.fm-dropdown__eyebrow{
    color:var(--fm-green);
    font-size:.69rem;
    font-weight:850;
    letter-spacing:.13em;
    text-transform:uppercase
}
.fm-dropdown__section h2{
    margin:.35rem 0 .2rem;
    color:#fff;
    font-size:.98rem;
    font-weight:780
}
.fm-dropdown__section p{
    margin:0 0 .7rem;
    color:var(--fm-muted);
    font-size:.78rem;
    line-height:1.45
}
.fm-dropdown__featured{
    display:flex;
    align-items:center;
    gap:.75rem;
    padding:.72rem;
    color:var(--fm-soft);
    text-decoration:none;
    border:1px solid transparent;
    border-radius:12px;
    transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease
}
.fm-dropdown__featured:hover,
.fm-dropdown__featured.is-active{
    color:#fff;
    background:rgba(118,213,100,.085);
    border-color:rgba(118,213,100,.24);
    transform:translateY(-1px)
}
.fm-dropdown__badge{
    display:grid;
    width:36px;
    height:36px;
    flex:0 0 36px;
    place-items:center;
    color:var(--fm-green);
    background:rgba(118,213,100,.07);
    border:1px solid rgba(118,213,100,.28);
    border-radius:5px;
    font-size:.66rem;
    font-weight:900
}
.fm-dropdown__featured>span:last-child{
    display:flex;
    min-width:0;
    flex-direction:column;
    gap:.08rem
}
.fm-dropdown__featured strong{
    color:inherit;
    font-size:.89rem;
    font-weight:780
}
.fm-dropdown__featured small{
    color:var(--fm-muted);
    font-size:.75rem;
    line-height:1.35
}
.fm-dropdown__chips{
    display:flex;
    flex-wrap:wrap;
    gap:.36rem;
    padding:.42rem .72rem .12rem
}
.fm-dropdown__chips a{
    min-width:38px;
    padding:.38rem .55rem;
    color:#b9c4d2;
    text-align:center;
    text-decoration:none;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.07);
    border-radius:8px;
    font-size:.72rem;
    font-weight:850
}
.fm-dropdown__chips a:hover,
.fm-dropdown__chips a.is-active{
    color:#0b0f10;
    background:var(--fm-green);
    border-color:var(--fm-green)
}
.fm-dropdown__plain-links{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.45rem;
    margin-top:.45rem
}
.fm-dropdown__plain-links a{
    padding:.6rem .7rem;
    color:#aab6c5;
    text-align:center;
    text-decoration:none;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.06);
    border-radius:5px;
    font-size:.78rem;
    font-weight:700
}
.fm-dropdown__plain-links a:hover,
.fm-dropdown__plain-links a.is-active{
    color:#fff;
    border-color:rgba(118,213,100,.22);
    background:rgba(118,213,100,.07)
}
.fm-dropdown__coming-soon{
    display:flex;
    align-items:center;
    gap:.7rem;
    margin-top:.55rem;
    padding:.66rem .72rem;
    color:#8793a5;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.06);
    border-radius:5px;
    font-size:.73rem
}
.fm-dropdown__coming-soon span{
    margin-right:auto;
    color:var(--fm-green);
    font-size:.63rem;
    font-weight:850;
    letter-spacing:.1em;
    text-transform:uppercase
}
.fm-dropdown__coming-soon strong{font-weight:700}

/* Mobile */
.fm-nav-toggle{
    display:none;
    width:43px;
    height:40px;
    margin-left:auto;
    padding:0;
    background:rgba(255,255,255,.025);
    border:1px solid var(--fm-border-strong);
    border-radius:10px
}
.fm-nav-toggle span{
    display:block;
    width:18px;
    height:2px;
    margin:4px auto;
    background:#fff;
    border-radius:99px;
    transition:transform .18s ease,opacity .18s ease
}
.fm-nav-toggle.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.fm-nav-toggle.is-open span:nth-child(2){opacity:0}
.fm-nav-toggle.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Shared cards */
.fm-panel,.fm-card{
    background:rgba(13,27,45,.76);
    border:1px solid var(--fm-border);
    border-radius:22px;
    box-shadow:0 20px 44px rgba(0,0,0,.28);
    backdrop-filter:blur(16px)
}
.fm-panel{padding:28px}
.fm-card{padding:26px}
.fm-kicker,.fm-panel-title,.fm-card-label{
    color:var(--fm-green);
    font-size:.73rem;
    font-weight:850;
    letter-spacing:.12em;
    text-transform:uppercase
}
.text-secondary,.fm-card p{color:var(--fm-muted)!important}


.fm-data-source-link {
    color: var(--fm-green);
    font-weight: 750;
    text-decoration: none;
}
.fm-data-source-link:hover {
    color: #fff;
}

/* Footer */
.fm-footer{
    color:var(--fm-muted);
    background:#080c0d;
    border-top:1px solid var(--fm-border)
}
.fm-footer__grid{
    display:grid;
    grid-template-columns:minmax(260px,1.5fr) repeat(4,minmax(120px,.62fr));
    gap:clamp(2rem,5vw,5rem);
    padding:3.5rem 0 2.8rem
}
.fm-brand--footer .fm-brand__mark{width:40px;height:40px}
.fm-footer__brand-block{max-width:390px}
.fm-footer__brand-block p{
    margin:1rem 0 0;
    color:#8e9aac;
    font-size:.89rem;
    line-height:1.7
}
.fm-footer__column{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:.55rem
}
.fm-footer__column h2{
    margin:0 0 .4rem;
    color:#fff;
    font-size:.75rem;
    font-weight:850;
    letter-spacing:.11em;
    text-transform:uppercase
}
.fm-footer__column a{
    color:#a0a8a4;
    font-size:.85rem;
    text-decoration:none
}
.fm-footer__column a:hover{color:var(--fm-green)}
.fm-footer__bottom{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:1.5rem;
    padding:1.15rem 0 1.35rem;
    color:#747c78;
    border-top:1px solid rgba(210,220,215,.10);
    font-size:.77rem
}
.fm-footer__data-note{
    max-width:760px;
    text-align:right;
    line-height:1.55
}
.fm-footer__data-note a{
    color:#a0a8a4;
    font-weight:750;
    text-decoration:none
}
.fm-footer__data-note a:hover{color:var(--fm-green)}

@media(max-width:1199.98px){
    .fm-nav__inner{
        flex-wrap:wrap;
        gap:0;
        padding-top:.58rem;
        padding-bottom:.58rem
    }
    .fm-nav-toggle{display:block}
    .fm-nav__content{
        display:none;
        width:100%;
        flex-basis:100%;
        max-height:calc(100vh - var(--fm-header-h));
        overflow-y:auto;
        padding:.75rem 0 .3rem
    }
    .fm-nav__content.is-open{display:block}
    .fm-nav__list{
        display:block
    }
    .fm-nav__link{
        width:100%;
        justify-content:space-between;
        padding:.76rem .8rem
    }
    .fm-nav__link.is-active::after{
        top:.72rem;
        right:auto;
        bottom:.72rem;
        left:0;
        width:3px;
        height:auto
    }
    .fm-dropdown,
    .fm-dropdown--models,
    .fm-dropdown--right{
        position:static;
        display:none;
        width:100%;
        margin:.15rem 0 .5rem;
        opacity:1;
        visibility:visible;
        transform:none;
        pointer-events:auto;
        border:0;
        box-shadow:none
    }
    .fm-nav__item.is-open>.fm-dropdown{display:grid}
    .fm-dropdown--models{grid-template-columns:1fr}
    .fm-nav__actions{
        margin:.6rem 0 0;
        padding:.75rem 0 .15rem;
        border-top:1px solid var(--fm-border)
    }
    .fm-nav__signin,.fm-nav__premium{
        flex:1;
        text-align:center
    }
}
@media(max-width:767.98px){
    :root{--fm-header-h:68px}
    .fm-brand__mark{width:39px;height:39px}
    .fm-brand__text{font-size:1.35rem}
    .fm-footer__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:2rem 1.5rem;
        padding:3rem 0 2.5rem
    }
    .fm-footer__brand-block{grid-column:1/-1}
    .fm-footer__bottom{flex-direction:column}
    .fm-footer__data-note{text-align:left}
}
@media(max-width:480px){
    .fm-dropdown__featured small{display:none}
    .fm-footer__grid{grid-template-columns:1fr}
    .fm-footer__brand-block{grid-column:auto}
}
@media (min-width: 1800px) {
    html {
        font-size: 17px;
    }
}

@media (min-width: 2200px) {
    html {
        font-size: 18px;
    }
}
/* Fantasy Mate scrollbars */
* {
    scrollbar-width: thin;
    scrollbar-color: #3f9138 #090d0e;
}

*::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

*::-webkit-scrollbar-track {
    background: #090d0e;
    border: 1px solid rgba(118, 213, 100, .08);
}

*::-webkit-scrollbar-thumb {
    min-width: 42px;
    min-height: 42px;
    border: 3px solid #090d0e;
    border-radius: 999px;
    background: #3f9138;
}

*::-webkit-scrollbar-thumb:hover {
    background: #76d564;
}

*::-webkit-scrollbar-corner {
    background: #090d0e;
}
