/* USKOBOT Core V2 — reusable visual design system. No demo/gallery styles. */
/* BUNDLED PRODUCTION STYLES: core.css */
/* USKOBOT Shared Components / Layout / Effects. Palette-neutral behavior and shared surfaces.
   Default Champagne variables are in obsidian-champagne.css. Optional palettes load after first paint. */
/* USKOBOT — Default / Obsidian Champagne.
   Sole critical stylesheet. Contains structure, standard components,
   Signature effects and Champagne tokens; NO non-default palette overrides.
   Source blocks are preserved for direct editing; no other CSS is required for default rendering. */


/* ===== Foundation & structural primitives ===== */
/* SOURCE STYLE BLOCK 00 */
/* --- TEMEL AYARLAR --- */
*{ margin: 0; padding: 0; box-sizing: border-box; }

body{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: #151d29;
    color: #eef3fa;
    height: 100vh;
    line-height: 1.6;
    overflow: hidden; /* Masaüstünde sayfa kaymasını engelle */
}

a{ text-decoration: none; color: inherit; transition: color 0.3s; }
ul{ list-style: none; }

/* --- LOGIN / REGISTER CONTAINER --- */
.auth-container{
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow-y: auto;
}

.login-card{
    width: 100%;
    max-width: 420px;
    background: #151d29;
    border-radius: 30px;
    padding: 50px 40px;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    position: relative;
    transition: transform 0.3s ease;
}

/* --- DASHBOARD CONTAINER --- */
.dashboard-container{
    display: flex;
    height: 100vh;
    width: 100%;
    position: relative; /* Mobil menü için referans */
}

/* --- SIDEBAR (SOL MENÜ) --- */
.sidebar{
    width: 270px;
    /* height: calc(100% - 20px); /* Margin değerlerini toplam yükseklikten düştük */
    background: #151d29;
    display: flex;
    flex-direction: column;
    padding: 30px 20px;
    /*margin: 10px; */
    z-index: 100;
    flex-shrink: 0;
    overflow: hidden; /* Hem yatay hem dikey kaydırmayı tamamen kapatır */
    box-sizing: border-box; /* Padding ve border'ı genişliğe dahil eder */
    box-shadow: 6px 0 10px -5px #080d15;
    transition: all 0.4s ease-in-out;
}

.brand{
    font-size: 24px;
    font-weight: 800;
    color: #b3c0d3;
    text-align: center;
    margin-bottom: 30px;
    text-shadow: 2px 2px 4px rgba(163,177,198,0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* Sidebar Linkleri */
.nav-item{
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 10px;
    margin-bottom: 10px;
    border-radius: 15px;
    color: #94a3b8;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Sadece sol sidebar butonlarının dikey boyutu */
.sidebar .nav-item{
    padding: 10px 10px;
    margin-bottom: 7px;
}

.nav-item:hover{ color: #b3c0d3; transform: translateX(5px); }

.nav-item.active{
    color: #b3c0d3;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.logout-btn{ margin-top: auto; color: #ff3b5c; }
.logout-btn:hover{ color: #d6304c; }

/* Mobil Menü Kapatma Butonu (Varsayılan Gizli) */
.menu-close-btn{ display: none; }

/* Mobil Menü Açma Butonu (Varsayılan Gizli) */
.mobile-toggle-btn{
    display: none; /* Masaüstünde gizli */
    position: fixed;
    top: 20px;
    left: 20px;
    z-index: 90;
    width: 50px;
    height: 50px;
    border-radius: 12px;
    border: none;
    background: #151d29;
    color: #b3c0d3;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* --- ANA İÇERİK (SAĞ TARAF) --- */
.main-content{
    flex-grow: 1;
    height: 100%;
    overflow-y: auto;
    padding:10px 40px;
}

/* Scrollbar Tasarımı */
.main-content::-webkit-scrollbar,
.sidebar::-webkit-scrollbar{ width: 8px; }
.main-content::-webkit-scrollbar-track,
.sidebar::-webkit-scrollbar-track{ background: #151d29; }
.main-content::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb{ background-color: #080d15; border-radius: 4px; }

.page-title{
    margin-bottom: 30px;
    font-size: 28px;
    font-weight: 700;
    color: #eef3fa;
}

/* --- KARTLAR --- */
.neu-panel-card{
    background: #151d29;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 9px 9px 16px #080d15, -9px -9px 16px #1e2937;
    margin-bottom: 30px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* --- NEUMORPHIC ELEMANLAR --- */
.neu-icon{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #151d29;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #b3c0d3;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    margin-bottom: 15px;
}

.neu-btn{
    width: 100%;
    padding: 15px;
    border: none;
    border-radius: 12px;
    background: #151d29;
    color: #eef3fa;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    transition: all 0.2s ease;
    display: flex;
    justify-content: center;
    align-items: center;
}
.neu-btn:active{ box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055); transform: translateY(0); }

/* --- INPUTLAR --- */
.form-group{ margin-bottom: 25px; position: relative; }
.neu-input{
    width: 100%;
    padding: 15px 20px;
    border: none;
    border-radius: 12px;
    background: #151d29;
    color: #eef3fa;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    outline: none;
}
.neu-input:focus{ box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055); }

/* --- TABLOLAR --- */
/* --- TABLOLAR --- */
.neu-table{
    width: 100%;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    table-layout: auto;
}

/* Daralmasını istediğimiz sütunlar */
.column-narrow{
    width: 1%;
    white-space: nowrap; 
}

/* Kalan alanı kaplayacak ve metni sarmalayacak sütun */
.column-main{
    width: auto;
    white-space: normal !important; /* td'deki nowrap değerini burada kırıyoruz */
    text-align: left !important;
}

.neu-table td b{
    display: block;
    word-break: break-word; 
    white-space: normal; /* Bold metnin aşağı kaymasını garanti eder */
}

.neu-table th{ 
    text-align: center; 
    padding: 15px; 
    color: #b3c0d3; 
    font-weight: 700; 
    border-bottom: 2px solid #080d15; 
    white-space: nowrap; 
}

/* Yanlış yazım düzeltildi: :first -> :first-child */
.neu-table th:first-child{ 
    text-align: left !important; 
}

.neu-table td{ 
    background: transparent !important; 
    padding: 15px; 
    color: #eef3fa; 
    border-bottom: 1px solid #2b3648; 
    /* Buradaki nowrap, column-main ile ezilmeli yoksa konu kısmı tek satırda kalır */
    white-space: nowrap; 
    overflow: hidden; 
}

.neu-table tr:hover{ 
    background-color: rgba(255, 191, 71, .045) !important; 
}

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

/* Yardımcı Sınıflar */
.text-success{ color: #34d399; font-weight: 600; }
.text-danger{ color: #ff3b5c; font-weight: 600; }

.version-text{ font-family: monospace; font-size: 1.2rem; color: #b3c0d3; }

.badge{ 
    padding: 5px 12px; 
    border-radius: 20px; 
    font-size: 12px; 
    font-weight: 700; 
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055); 
    display: inline-block; /* Hizalama için eklendi */
}



.badge.success{ color: #34d399; } 
.badge.warning{ color: #f5a623; } 
.badge.danger{ color: #ff3b5c; }
.text-center{ text-align: center; }

/* --- GRID SİSTEMİ (ÖZEL İSTEK) --- */
.grid-3{
    display: grid;
    gap: 30px;
    margin-bottom: 20px;
    /* Varsayılan (Masaüstü): Her zaman 3 kolon */
    grid-template-columns: repeat(3, 1fr);
}
.grid-4{
    display: grid;
    gap: 30px;
    margin-bottom: 30px;
    /* Varsayılan (Masaüstü): Her zaman 3 kolon */
    grid-template-columns: repeat(4, 1fr);
}


.grid-5{
    display: grid;
    gap: 30px;
    margin-bottom: 30px;
    /* Varsayılan (Masaüstü): Her zaman 3 kolon */
    grid-template-columns: repeat(5, 1fr);
}
/* --- MEDYA SORGULARI (RESPONSIVE) --- */

/* 992px altı MOBİL kabul edilecek */
@media (max-width: 992px){
    
    /* 1. Grid Mobilde Tek Kolon Olsun */
    .grid-3{
        grid-template-columns: 1fr;
    }

    /* 2. Menü Toggle Butonu Görünsün */
    .mobile-toggle-btn{
        display: flex;
    }

    /* 3. Sidebar Varsayılan Olarak Gizlensin ve Tam Ekran Olsun */
    .sidebar{
        position: fixed;
        top: 0;
        left: -100%; /* Ekran dışına it */
        width: 100vw; /* Tam Ekran Genişlik */
        height: 100vh; /* Tam Ekran Yükseklik */
        padding-top: 80px; /* Üstten boşluk bırak */
        align-items: center; /* Linkleri ortala */
        justify-content: center;
        background: #151d29; /* Opak arka plan */
    }

    /* 4. Sidebar Aktif Olduğunda (JS ile class eklenecek) */
    .sidebar.active{
        left: 0; /* Ekrana getir */
    }

    .sidebar .nav-item{
        width: 80%; /* Linkler geniş olsun */
        justify-content: center;
        font-size: 1.2rem; /* Yazılar büyüsün */
        padding: 20px;
        margin-bottom: 10px;
    }

    /* 5. Menü Kapatma Butonu Görünsün */
    .menu-close-btn{
        display: flex;
        position: absolute;
        top: 20px;
        right: 20px;
        width: 50px;
        height: 50px;
        border-radius: 12px;
        border: none;
        background: #151d29;
        color: #ff3b5c;
        box-shadow: 6px 6px 12px #080d15, -6px -6px 12px #1e2937;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    /* 6. Ana İçerik Padding Ayarı */
    .main-content{
        padding-top: 80px; /* Toggle butonu altında kalmasın */
    }
}
/* --- DESTEK SAYFASI ÖZEL GRID --- */
.grid-2-1{
    display: grid;
    grid-template-columns: 2fr 1fr; /* Sol 2 birim, Sağ 1 birim */
    gap: 30px;
    margin-bottom: 30px;
}

/* Mobil uyumluluk: Mobilde alt alta geçsin */
@media (max-width: 992px){
    .grid-2-1{
        grid-template-columns: 1fr;
    }
}

/* --- SSS (FAQ) STİLLERİ --- */
.faq-item{
    background: transparent;
    border-bottom: 1px solid #2b3648;
    padding: 15px 0;
}
.faq-item:last-child{ border-bottom: none; }

.faq-question{
    font-weight: 600;
    cursor: pointer;
    color: #eef3fa;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.faq-answer{
    margin-top: 10px;
    color: #b3c0d3;
    font-size: 0.9rem;
    display: none; /* JS veya CSS ile açılır yapılabilir, HTML5 details kullanacağız */
}

/* HTML5 Details/Summary için stil */
details > summary{
    list-style: none;
    outline: none;
}
details > summary::-webkit-details-marker{
    display: none;
}
details[open] > summary{
    color: #b3c0d3;
    margin-bottom: 10px;
}

/* --- YENİ ROZET RENKLERİ --- */
.badge.info{ color: #ffbf47; }       /* İnceleniyor - Mavi */
.badge.secondary{ color: #97a6bb; }  /* Kapatıldı - Gri */
/* Success (Yeşil) ve Warning (Turuncu) zaten vardı */

/* prestige-hub.css */
.prestige-hub{
    margin-top: 15px;
    padding: 25px;
    border-radius: 16px;
    background: #151d29;
}

.prestige-flex-wrapper{
    display: flex;
    gap: 25px;
    align-items: flex-start;
}

.progress-details-column{
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.progress-top-info{
    display: flex;
    justify-content: space-between;
}

.tier-name-label{
    font-weight: 800;
    color: #eef3fa;
    text-transform: capitalize;
}

.xp-help-link{
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: #94a3b8;
    margin-top: 5px;
    cursor: help;
}

.benefits-summary-column{
    min-width: 200px;
    padding-left: 20px;
    border-left: 1px solid #080d15;
}

.benefit-header{
    font-size: 12px;
    font-weight: 700;
    color: #eef3fa;
    margin-bottom: 10px;
    display: block;
}

.benefit-row{
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #b3c0d3;
    margin-bottom: 4px;
}

/* Progress Bar Custom */
.progress-track{
    height: 14px;
    background: #2b3648;
    border-radius: 20px;
    overflow: hidden;
}

.progress-fill-dynamic{
    height: 100%;
    transition: width 1s ease;
}

/* Loyalty Nav */
.loyalty-quick-nav{
    display: flex;
    gap: 12px;
    margin-top: 25px;
    overflow-x: auto;
}

.rank-nav-item{
    min-width: 100px;
    text-align: center;
    padding: 15px !important;
}

.rank-active{
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055) !important;
}

.tier-footer-summary{
    display: flex;
    justify-content: space-around;
    padding: 15px;
    background: #182332;
    border-radius: 12px;
    margin-top: 15px;
    text-align: center;
}

/* --- FarmLabs Gelişmiş Tablo Başlığı Stilleri --- */

/* Tablo Başlık Alanı Konteynırı (Opsiyonel: Tablonun üstüne başlık eklemek için) */
.table-header-title{
    color: var(--text-color);
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 20px;
    padding-left: 10px;
    border-left: 5px solid var(--success-color); /* FarmLabs Vurgu Rengi */
}

/* Tablo Genel Yapısı */
table{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 12px; /* Satırlar arası daha ferah boşluk */
    color: var(--text-color);
}

/* YENİLENMİŞ THEAD (BAŞLIK) STİLİ */
thead tr th{
    padding: 18px 15px;
    text-align: left;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #a1afc2; /* Daha profesyonel bir gri tonu */
    background: var(--bg-color);
    
    /* Hücre bazlı shadow yerine sadece alt sınır vualı */
    border-bottom: 2px solid rgba(163, 177, 198, 0.4); 
    position: relative;
}

/* Başlığa bütüncül bir derinlik katmak için ilk ve son hücreye özel dokunuş */
thead tr th:first-child{
    border-radius: 15px 0 0 15px;
}

thead tr th:last-child{
    border-radius: 0 15px 15px 0;
}

/* BAŞLIK ALTINA GÖLGELİ AYRIÇ (Seni tatmin edecek ana değişim) */
thead tr{
    /* Başlık satırını bir bütün olarak hafifçe içeri gömüyoruz */
    box-shadow: inset 4px 4px 8px var(--dark-shadow), 
                inset -4px -4px 8px var(--light-shadow);
}

/* TABLO İÇERİĞİ (TBODY) STİLLERİ */
tbody tr td{
    padding: 20px 15px;
    background: var(--bg-color);
    font-weight: 600;
    transition: all 0.3s ease;
    
    /* Satırların kart gibi görünmesi için shadow */
    box-shadow: 6px 6px 12px var(--dark-shadow), 
                -6px -6px 12px var(--light-shadow);
}

/* Satırların köşe yumuşatması */
tbody tr td:first-child{ border-radius: 15px 0 0 15px; }
tbody tr td:last-child{ border-radius: 0 15px 15px 0; }

/* Satır Hover Efekti: FarmLabs Prestige Hissiyatı */
tbody tr:hover td{
    transform: translateY(-2px);
    color: var(--primary-blue); /* Hoverda metin rengi değişimi */
    box-shadow: 8px 8px 16px var(--dark-shadow), 
                -8px -8px 16px var(--light-shadow);
}

/* Status İkonları İçin Küçük İyileştirme */
.status{
    padding: 5px 12px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    /* İkon arkasına hafif çukurluk */
    box-shadow: inset 2px 2px 5px var(--dark-shadow), 
                inset -2px -2px 5px var(--light-shadow);
}
.btn{
    display: inline-block;
    font-weight: 400;
    color: #ccd6e4;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: transparent;
    border: 0.0625rem solid transparent;
    padding: 0.55rem 0.95rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.55rem;
    transition: all 0.15s ease-in-out;
}

.btn:focus,
.btn.focus{
    outline: 0;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.btn-primary{
    color: #e4edf8;
    background-color: #192331;
    border-color: #192331;
    box-shadow: inset 0 1px 0 rgba(236, 240, 243, 0.15), 0 1px 1px rgba(38, 40, 51, 0.075);
}

.btn-primary:hover{
    background-color: #26354a;
}

.btn-pill{
    border-radius: 50rem !important;
}

.btn-icon-only{
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.btn-group{
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle){
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn:not(:first-child){
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -0.0625rem;
}

.dropdown-menu{
    position: absolute;
    z-index: 1000;
    display: none;
    min-width: 10rem;
    padding: 0.7rem 0;
    margin: 0.825rem 0 0;
    background-color: #192331;
    border: 0.0625rem solid #2b3648;
    border-radius: 0.55rem;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.dropdown-item{
    display: block;
    width: 100%;
    padding: 0.25rem 1.5rem;
    color: #ccd6e4;
}

.dropdown-item:hover{
    background-color: #e4edf8;
    color: #fff;
}
.form-control{
    display: block;
    width: 100%;
    height: calc(1.5em + 1.2rem + 0.0625rem);
    padding: 0.6rem 0.75rem;
    font-size: 1rem;
    color: #ccd6e4;
    background-color: #192331;
    border: 0.0625rem solid #2b3648;
    border-radius: 0.55rem;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    transition: all 0.3s ease-in-out;
}

.form-control:focus{
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    outline: 0;
}

.form-check{
    padding-left: 1.25rem;
}

.form-text{
    display: block;
    margin-top: 0.25rem;
}
.custom-range{
    width: 100%;
    height: 1rem;
    background-color: transparent;
    appearance: none;
}

.custom-range::-webkit-slider-runnable-track{
    width: 100%;
    height: 0.5rem;
    background-color: #192331;
    border-radius: 1rem;
    box-shadow: inset 0 0.25rem 0.25rem rgba(38, 40, 51, 0.1);
}

.custom-range::-webkit-slider-thumb{
    width: 1rem;
    height: 1rem;
    margin-top: -0.25rem;
    background-color: #192331;
    border-radius: 1rem;
    box-shadow: 0 0.1rem 0.25rem rgba(38, 40, 51, 0.1);
    appearance: none;
}
@keyframes spinner-border {
    to { transform: rotate(360deg); }
}

.spinner-border{
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: text-bottom;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border .75s linear infinite;
}

.spinner-border-sm{
    width: 1rem;
    height: 1rem;
    border-width: 0.2em;
}

/* --- FarmLabs Yuvarlak Toggle Switch --- */
.switch-container{
    display: inline-block;
    position: relative;
    width: 50px;
    height: 26px;
}

.switch-container input{
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-slider{
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #2b3648;
    transition: .4s;
    border-radius: 34px;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.switch-slider:before{
    position: absolute;
    content: "";
    height: 18px; width: 18px;
    left: 4px; bottom: 4px;
    background-color: #151d29;
    transition: .4s;
    border-radius: 50%;
    box-shadow: 2px 2px 5px #080d15;
}

input:checked + .switch-slider{
    background-color: #34d399; /* Aktif: Yeşil */
    box-shadow: inset 3px 3px 6px #00a67d, inset -3px -3px 6px #00eab3;
}

input:checked + .switch-slider:before{
    transform: translateX(24px);
    background-color: #ffffff;
}

/* 1366x768 ve altındaki ekranlar için */
@media screen and (min-width: 1025px) and (max-width: 1366px){
    .sidebar .nav-item{
        padding: 7px 10px;
        margin-bottom: 6px;
		border-radius:7px;
		font-size:10px;
    }
}

/* 1024x768 ve altındaki ekranlar için */
@media screen and (min-width: 993px) and (max-width: 1024px){
    .sidebar .nav-item{
        padding: 5px 8px;
        margin-bottom: 5px;
		border-radius:7px;
		font-size:10px;
    }
	.sidebar .nav-item svg{width:10px;height:10px;}
}

.sidebar nav{width:95%;}


/* Mobil uyumluluk için (Opsiyonel ama önerilir) */
@media (max-width: 1024px){
    .grid-4{
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px){
    .grid-4{
        grid-template-columns: repeat(1, 1fr);
    }
}
/* Neumorphic ve Genel Düzenlemeler */
.active-rank{ 
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055) !important; 
    transform: scale(0.98);
}

.shadow-inset{ 
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055); 
}

.rank-card-item:hover:not(.active-rank){ 
    transform: translateY(-3px); 
}

/* Dashboard Bileşenleri */
.dashboard-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
	width: 100%;
}


.header-actions{
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-updates-btn,
.header-settings-btn{
    width: 46px;
    height: 46px;
    padding: 0;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.header-updates-btn svg{
    width: 20px;
    height: 20px;
}

.header-updates-btn:hover{
    color: #ffbf47;
}


.loyalty-panel{
    padding: 25px;
    margin-bottom: 30px;
}

.loyalty-title{
    margin-bottom: 20px;
    color: #eef3fa;
}

.tier-display-card{
    padding: 20px;
    border-radius: 16px;
}

.tier-flex-container{
    display: flex;
    gap: 25px;
    align-items: center;
}

.xp-info-container{
    flex-grow: 1;
}

.xp-header{
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.xp-tier-name{
    font-weight: 800;
    color: #eef3fa;
}

.xp-values{
    font-size: 13px;
    color: #94a3b8;
}

.xp-current-bold{
    color: #eef3fa;
}

.benefits-sidebar{
    border-left: 1px solid #080d15;
    padding-left: 20px;
}

.benefits-title{
    font-size: 12px;
    font-weight: 700;
    color: #eef3fa;
}

.benefits-list{
    margin-top: 5px;
    font-size: 11px;
    color: #b3c0d3;
}
.loyalty-selector{
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
    gap: 15px;
	padding:20px 20px 0 20px !important;
	margin:10px 10px 0 10px !important;
}



.rank-card-inner{
    min-width: 110px;
    text-align: center;
    cursor: pointer;
    padding: 20px;
    transition: 0.3s;
}

.rank-card-label{
    font-size: 12px;
    margin-top: 10px;
    font-weight: 700;
    color: #b3c0d3;
}

.tier-details-bar{
    padding: 20px;
    background: #182332;
    border-radius: 12px;
}

.details-grid{
    display: flex;
    justify-content: space-around;
    text-align: center;
}

.det-label{
    display: block;
    color: #94a3b8;
    margin-bottom: 5px;
}

.stat-icon{
    margin: 0 auto 15px;
}

.stat-label{
    color: #94a3b8;
}

.stat-value-credit{ color: #34d399; }
.stat-value-standard{ color: #eef3fa; }
.stat-value-blue{ color: #ffbf47; }

.info-box{
    margin-top: 10px;
    border-left: 5px solid #ffbf47;
    background: rgba(255, 191, 71, 0.03);
}

.info-text{
    font-size: 14px;
    color: #b3c0d3;
}

/* Mağaza ve Paket Kartları */
.alert-card{
    margin-bottom: 20px;
}

.alert-success{ border-left: 5px solid #34d399; }
.alert-danger{ border-left: 5px solid #ff3b5c; }

.pkg-card{
    transition: 0.3s ease-out;
}

.pkg-card:hover{
    transform: translateY(-5px);
}

.pkg-icon{
    margin: 0 auto 20px;
    font-size: 32px;
}

.pkg-duration{
    color: #94a3b8;
    margin: 10px 0;
}

.pkg-price{
    color: #b3c0d3;
    margin: 15px 0;
}

/* Modallar */
.modal-overlay{
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal-content{
    width: 400px;
    padding: 30px;
}

.price-display{
    padding: 15px;
    border-radius: 12px;
    margin: 20px 0;
    text-align: center;
}

.price-value{
    font-size: 24px;
    color: #34d399;
}

.modal-footer{
    display: flex;
    gap: 10px;
}

.flex-1{
    flex: 1;
}

.btn-disabled{
    opacity: 0.5;
    cursor: not-allowed;
}



.neu-table th{
    text-align: left;
    color: #94a3b8;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    padding: 18px;
}

.neu-table td{
    padding: 15px 18px;
    vertical-align: middle;
}

.switch-container{
    position: relative;
    display: inline-block;
    width: 46px;
    height: 24px;
}

.switch-container input{ opacity: 0; width: 0; height: 0; }

.switch-slider{
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #151d29;
    transition: .4s;
    border-radius: 34px;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.switch-slider:before{
    position: absolute;
    content: "";
    height: 18px; width: 18px;
    left: 3px; bottom: 3px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
    box-shadow: 2px 2px 5px #080d15;
}

input:checked + .switch-slider{ background-color: #34d399; }
input:checked + .switch-slider:before{ transform: translateX(22px); }

/* Tooltip ve Modal */
.bootstrap-tooltip{
    position: absolute;
    display: none;
    background: #eef3fa;
    color: #fff;
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    z-index: 10000;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    transform: translateY(10px);
}

.bootstrap-tooltip.visible{ opacity: 1; transform: translateY(0); }

.bootstrap-tooltip::after{
    content: "";
    position: absolute;
    top: 100%; left: 50%;
    transform: translateX(-50%);
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #eef3fa transparent transparent transparent;
}

.modal-blur{
    background: rgba(3, 7, 13, .82);
    backdrop-filter: blur(5px);
}

.pkg-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-bottom: 25px;
}

.summary-box{
    padding: 20px;
    border-radius: 15px;
    background: #151d29;
    margin-bottom: 25px;
}

/* Finansal Sayfa Bileşenleri */
.balance-badge{
    padding: 10px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.balance-badge span{
    color: #94a3b8;
    font-size: 14px;
}

.balance-badge b{
    color: #34d399;
}

.esn-container{
    grid-column: span 1;
}

.esn-input{
    text-align: center;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.esn-info-box{
    margin-top: 25px;
    padding: 15px;
    border-radius: 12px;
    background: rgba(0, 200, 150, 0.05);
    text-align: center;
}

.esn-info-box small{
    color: #b3c0d3;
}

.trx-container{
    grid-column: span 2;
}

.trx-amount{
    font-weight: bold;
}

.trx-positive{ color: #34d399; }
.trx-negative{ color: #ff5b5b; }

.trx-date{
    color: #94a3b8;
    font-size: 12px;
}

.reseller-title{
    margin: 40px 0 20px;
}

.reseller-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.reseller-card{
    padding: 20px;
    text-decoration: none;
    transition: transform 0.3s ease;
}

.reseller-card:hover{
    transform: translateY(-3px);
}

.reseller-card h4{
    color: #eef3fa;
    margin: 0;
}

@keyframes slideIn {
    from { transform: translateX(20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}
/* İşlem Geçmişi Başlık Alanı */
.trx-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.btn-small{
    font-size: 12px;
    padding: 8px 15px;
    width: auto;
}

/* Header Konumlandırma Düzeltmesi */

.rank-info-text{
    text-align: center;
    margin-top: 8px;
}

.rank-card-label{
    font-weight: bold;
    margin-bottom: 2px;
    font-size: 14px;
}

.rank-exp-range{
    display: block;
    font-size: 10px;
    color: #94a3b8; /* Muted renk */
    letter-spacing: 0.5px;
-}

.exp-unit{
    font-size: 8px;
    font-weight: bold;
    opacity: 0.7;
}

/* Aktif rankta yazı rengi değişimi (opsiyonel) */
.active-rank .rank-exp-range{
    color: inherit;
    opacity: 0.9;
}
.stat-value-green{
    color: #34d399; /* Canlı yeşil */
    text-shadow: 1px 1px 2px rgba(0, 200, 150, 0.2);
}

.stat-value-muted{
    color: #94a3b8; /* Pasif gri */
    opacity: 0.6;
}
/* Header action ikonlari: her kosulda yan yana kalir. */
.dashboard-header > .header-actions{
    display: inline-flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap !important;
}

.dashboard-header > .header-actions > a.neu-btn.header-updates-btn,
.dashboard-header > .header-actions > a.neu-btn.header-settings-btn{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    flex: 0 0 46px !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
}


/* Header actions: cache busting fallback; keeps update/settings controls horizontal. */
.dashboard-header > .header-actions{
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    width: auto !important;
    min-width: 102px !important;
    white-space: nowrap !important;
}

.dashboard-header > .header-actions > .neu-btn{
    display: inline-flex !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* =========================================================
   SUNUCU AYARLARIM / CLOUD SETTINGS
   ========================================================= */
.cloud-settings-page{
    padding-bottom: 50px;
}

.cloud-intro{
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 24px 26px;
    margin-bottom: 22px;
    border-left: 5px solid #ffbf47;
}

.cloud-intro-icon{
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: #ffbf47;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-intro-copy h3{
    margin: 0 0 5px;
    color: #eef3fa;
    font-size: 18px;
}

.cloud-intro-copy p{
    margin: 0;
    color: #9ba9bf;
    font-size: 13px;
    line-height: 1.7;
}

.cloud-summary-grid{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.cloud-summary-card{
    margin: 0;
    padding: 20px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.cloud-summary-label{
    color: #94a3b8;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .45px;
}

.cloud-summary-card strong{
    color: #eef3fa;
    font-size: 21px;
    white-space: nowrap;
}

.cloud-flash{
    padding: 16px 18px;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
}

.cloud-flash-success{
    border-left: 5px solid #34d399;
}

.cloud-flash-success b{
    color: #34d399;
}

.cloud-flash-error{
    border-left: 5px solid #ff3b5c;
}

.cloud-flash-error b{
    color: #ff3b5c;
}

.cloud-character-list{
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.cloud-character-card{
    margin: 0;
    padding: 25px;
}

.cloud-character-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #26354a;
}

.cloud-character-identity{
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
}

.cloud-character-avatar{
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    color: #ffbf47;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-character-identity h3{
    margin: 0 0 4px;
    color: #eef3fa;
    font-size: 18px;
    overflow-wrap: anywhere;
}

.cloud-character-identity span{
    color: #94a3b8;
    font-size: 11px;
}

.cloud-danger-button,
.cloud-route-delete,
.cloud-cancel-button,
.cloud-confirm-delete{
    border: 0;
    outline: none;
    cursor: pointer;
    font-family: inherit;
    font-weight: 700;
    transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.cloud-danger-button{
    width: auto;
    padding: 10px 14px;
    border-radius: 11px;
    background: #151d29;
    color: #ff3b5c;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    white-space: nowrap;
}

.cloud-danger-button:hover,
.cloud-route-delete:hover{
    transform: translateY(-1px);
}

.cloud-danger-button:active,
.cloud-route-delete:active{
    transform: translateY(0);
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-character-metrics{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 20px 0 24px;
}

.cloud-metric-box{
    padding: 15px 16px;
    border-radius: 14px;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 12px;
}

.cloud-metric-box span{
    color: #94a3b8;
    font-size: 11px;
    font-weight: 700;
    grid-column: 1 / -1;
}

.cloud-metric-box b{
    color: #eef3fa;
    font-size: 14px;
}

.cloud-metric-box small{
    color: #ffbf47;
    font-size: 10px;
    text-align: right;
}

.cloud-route-section{
    margin-top: 5px;
}

.cloud-section-title{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.cloud-section-title h4{
    margin: 0 0 3px;
    color: #eef3fa;
    font-size: 14px;
}

.cloud-section-title p{
    margin: 0;
    color: #94a3b8;
    font-size: 11px;
}

.cloud-route-count{
    padding: 6px 10px;
    border-radius: 20px;
    color: #ffbf47;
    font-size: 10px;
    font-weight: 800;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    white-space: nowrap;
}

.cloud-route-table-wrap{
    overflow-x: auto;
    border-radius: 14px;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
    padding: 4px 14px;
}

.cloud-route-table{
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}

.cloud-route-table th{
    padding: 12px 10px;
    text-align: left;
    color: #94a3b8;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .45px;
    border-bottom: 1px solid #273447;
}

.cloud-route-table th:last-child,
.cloud-route-table td:last-child{
    text-align: right;
}

.cloud-route-table td{
    padding: 12px 10px;
    color: #b3c0d3;
    font-size: 12px;
    border-bottom: 1px solid rgba(190, 195, 207, .55);
}

.cloud-route-table tr:last-child td{
    border-bottom: 0;
}

.cloud-route-name{
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.cloud-route-name b{
    color: #eef3fa;
    overflow-wrap: anywhere;
}

.cloud-route-icon{
    width: 27px;
    height: 27px;
    min-width: 27px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffbf47;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.cloud-route-delete{
    padding: 7px 12px;
    border-radius: 9px;
    color: #ff3b5c;
    background: #151d29;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.cloud-route-empty{
    padding: 18px;
    border-radius: 12px;
    color: #94a3b8;
    font-size: 12px;
    text-align: center;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-empty-state{
    padding: 48px 25px;
    text-align: center;
}

.cloud-empty-icon{
    font-size: 42px;
    color: #ffbf47;
    margin-bottom: 12px;
}

.cloud-empty-state h3{
    color: #eef3fa;
    margin: 0 0 6px;
}

.cloud-empty-state p{
    color: #94a3b8;
    margin: 0;
    font-size: 13px;
}

.cloud-modal-overlay{
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(42, 47, 67, .48);
    backdrop-filter: blur(3px);
}

.cloud-modal-overlay.is-open{
    display: flex;
}

.cloud-modal-card{
    width: min(460px, 100%);
    padding: 28px;
    border-radius: 22px;
    background: #151d29;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    text-align: center;
}

.cloud-modal-warning{
    width: 54px;
    height: 54px;
    margin: 0 auto 14px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff3b5c;
    font-size: 25px;
    font-weight: 900;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-modal-card h3{
    color: #eef3fa;
    margin: 0 0 8px;
}

.cloud-modal-card > p{
    color: #b3c0d3;
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
}

.cloud-modal-note{
    margin: 18px 0;
    padding: 13px 14px;
    border-radius: 12px;
    color: #94a3b8;
    font-size: 11px;
    line-height: 1.6;
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.cloud-modal-actions{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cloud-cancel-button,
.cloud-confirm-delete{
    padding: 12px 14px;
    border-radius: 11px;
}

.cloud-cancel-button{
    color: #b3c0d3;
    background: #151d29;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.cloud-confirm-delete{
    color: #ffffff;
    background: #ff3b5c;
    box-shadow: 4px 4px 10px rgba(255, 59, 92, .25);
}

.cloud-confirm-delete:hover,
.cloud-cancel-button:hover{
    transform: translateY(-1px);
}

@media (max-width: 900px){
    .cloud-summary-grid,
.cloud-character-metrics{
        grid-template-columns: 1fr;
    }

    .cloud-character-header{
        align-items: flex-start;
        flex-direction: column;
    }

    .cloud-danger-button{
        width: 100%;
    }
}

@media (max-width: 600px){
    .cloud-intro{
        align-items: flex-start;
    }

    .cloud-intro-icon{
        width: 46px;
        height: 46px;
        min-width: 46px;
        font-size: 22px;
    }

    .cloud-character-card{
        padding: 18px;
    }

    .cloud-section-title{
        align-items: flex-start;
        flex-direction: column;
    }

    .cloud-modal-actions{
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   MOBILE RESPONSIVE LAYER - 2026-08
   Masaustu gorunumunu degistirmeden 992px ve altini duzenler.
   ========================================================= */

.mobile-sidebar-overlay{
    display: none;
}

.table-responsive{
    width: 100%;
    max-width: 100%;
}

@media (max-width: 992px){
    body{
        overflow: hidden;
    }

    body.mobile-menu-open{
        overflow: hidden;
    }

    .dashboard-container{
        width: 100%;
        height: 100dvh;
        min-height: 100vh;
    }

    .main-content{
        width: 100%;
        min-width: 0;
        height: 100dvh;
        padding: 10px 18px 28px;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .dashboard-header{
        position: relative;
        top: auto;
        z-index: auto;
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        min-height: 66px;
        padding: 10px 0 12px;
        margin-bottom: 12px;
        background: #151d29;
    }

    .dashboard-header .page-title{
        flex: 1 1 auto;
        min-width: 0;
        margin: 0;
        font-size: clamp(18px, 5vw, 24px);
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .dashboard-header > .header-actions{
        flex: 0 0 auto !important;
        min-width: 0 !important;
        gap: 8px !important;
    }

    .mobile-toggle-btn{
        display: inline-flex;
        position: static;
        flex: 0 0 46px;
        width: 46px;
        min-width: 46px;
        height: 46px;
        padding: 0;
        z-index: auto;
    }

    /* Sidebar mobilde soldan acilan drawer. */
    .sidebar{
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1200;
        width: min(286px, calc(100vw - 54px));
        max-width: 286px;
        height: 100dvh;
        min-height: 100vh;
        padding: 20px 16px 16px;
        align-items: stretch;
        justify-content: flex-start;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        transform: translateX(-105%);
        transition: transform 0.25s ease;
        box-shadow: 12px 0 28px rgba(61, 68, 104, 0.18);
    }

    .sidebar.active{
        left: 0;
        transform: translateX(0);
    }

    .sidebar .brand{
        justify-content: flex-start;
        padding-right: 54px;
        margin: 2px 4px 20px;
        font-size: 21px;
    }

    .sidebar > nav{
        width: 100% !important;
        min-height: 0;
        flex: 1 1 auto !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding-right: 4px;
    }

    .sidebar .nav-item{
        width: 100%;
        min-height: 46px;
        justify-content: flex-start;
        gap: 13px;
        padding: 11px 12px;
        margin-bottom: 7px;
        font-size: 0.95rem;
    }

    .sidebar .nav-item:hover{
        transform: none;
    }

    .sidebar .sidebar-footer{
        flex: 0 0 auto;
        width: 100%;
        transform: none !important;
        padding-top: 8px;
    }

    .sidebar .sidebar-footer .neu-panel-card{
        padding: 13px !important;
        margin-bottom: 10px !important;
    }

    .menu-close-btn{
        display: inline-flex;
        position: absolute;
        top: 18px;
        right: 16px;
        width: 42px;
        height: 42px;
        z-index: 2;
    }

    .mobile-sidebar-overlay{
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1190;
        background: rgba(35, 40, 65, 0.32);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.22s ease, visibility 0.22s ease;
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
    }

    .mobile-sidebar-overlay.active{
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    /* Kartlar ve formlar */
    .neu-panel-card{
        max-width: 100%;
    }

    .grid-3,
.grid-2-1{
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .grid-4,
.grid-5{
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px;
    }

    .pkg-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reseller-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .details-grid{
        flex-wrap: wrap;
        gap: 18px;
    }

    .details-grid > *{
        flex: 1 1 140px;
    }

    input,
select,
textarea,
button{
        max-width: 100%;
    }

    .form-group{
        min-width: 0;
        grid-column: 1 / -1 !important;
    }

    /* Tum mevcut neu-table tablolarini JS bu wrapper'a alir. */
    .table-responsive{
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        padding: 0 0 8px;
    }

    .table-responsive > .neu-table{
        width: 100%;
        min-width: 0;
        max-width: none;
        table-layout: auto;
    }

    .table-responsive > .neu-table th,
.table-responsive > .neu-table td{
        padding: 10px 9px;
        white-space: normal;
        overflow: visible;
        overflow-wrap: anywhere;
        word-break: normal;
    }

    .table-responsive > .neu-table .column-narrow{
        width: 1%;
        white-space: nowrap;
    }

    /* Inline width kullanan store/services modallarini da ezer. */
    .modal-overlay{
        padding: 12px;
    }

    .modal-content{
        width: min(480px, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px);
        max-height: calc(100dvh - 24px);
        overflow-y: auto;
        padding: 24px !important;
    }

    .modal-footer{
        flex-wrap: wrap;
    }

    .modal-footer > *{
        min-width: 0;
    }
}

@media (max-width: 600px){
    .main-content{
        padding: 8px 12px 24px;
    }

    .dashboard-header{
        gap: 8px;
        min-height: 62px;
        padding-top: 8px;
    }

    .dashboard-header .page-title{
        font-size: 19px;
    }

    .mobile-toggle-btn,
.dashboard-header > .header-actions > .neu-btn,
.dashboard-header > .header-actions > a.neu-btn.header-updates-btn,
.dashboard-header > .header-actions > a.neu-btn.header-settings-btn{
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        flex-basis: 42px !important;
    }

    .neu-panel-card{
        padding: 20px;
        border-radius: 16px;
        margin-bottom: 20px;
    }

    .grid-4,
.grid-5,
.pkg-grid,
.reseller-grid{
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 14px;
    }

    .loyalty-selector{
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
        padding: 12px 8px 0 !important;
        margin: 8px 0 0 !important;
    }

    .rank-card-inner{
        min-width: 0;
        padding: 14px 8px;
    }

    .tier-flex-container{
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }

    .benefits-sidebar{
        width: 100%;
        border-left: 0;
        border-top: 1px solid #080d15;
        padding: 14px 0 0;
    }

    .modal-footer{
        flex-direction: column;
    }

    .modal-footer .neu-btn,
.modal-footer button,
.modal-footer a{
        width: 100% !important;
    }

    .table-responsive > .neu-table{
        min-width: 0;
    }

    .table-responsive > .neu-table th,
.table-responsive > .neu-table td{
        padding: 9px 7px;
        font-size: 0.88rem;
    }
}

@media (max-width: 380px){
    .main-content{
        padding-left: 9px;
        padding-right: 9px;
    }

    .dashboard-header > .header-actions{
        gap: 6px !important;
    }

    .dashboard-header .page-title{
        font-size: 17px;
    }

    .loyalty-selector{
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 600px){
    .trx-header{
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .trx-header .neu-btn,
.trx-header .btn-small{
        width: 100%;
    }

    .balance-badge{
        width: 100%;
        justify-content: center;
    }

    .details-grid{
        flex-direction: column;
        align-items: stretch;
        text-align: left;
    }

    .details-grid > *{
        width: 100%;
        flex-basis: auto;
    }
}

/* =========================================================
   USKOBOT - MOBILE FINE TUNING
   Yalnizca mobil gorunumu etkiler.
   ========================================================= */
@media (max-width: 992px){
    /* Header sticky kalir; tum satir opak oldugu icin alttaki yazi gorunmez. */
    .dashboard-header{
        position: sticky !important;
        top: 0 !important;
        z-index: 110 !important;
        margin-left: -18px;
        margin-right: -18px;
        width: calc(100% + 36px);
        padding-left: 18px;
        padding-right: 18px;
        background: #151d29 !important;
        background-color: #151d29 !important;
        opacity: 1 !important;
        isolation: isolate;
        box-shadow: 0 8px 14px rgba(61, 68, 104, 0.08);
    }

    /* Mobilde balance kartlarinin ikisi de ayni genislikte olsun. */
    .grid-3 > .esn-container,
.grid-3 > .trx-container{
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .trx-container .table-responsive,
.esn-container,
.trx-container{
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    /* Mobil tablolarda yatay/dikey gereksiz boslugu azalt. */
    .table-responsive{
        padding-bottom: 3px;
    }

    .table-responsive > .neu-table th{
        padding: 7px 5px !important;
        line-height: 1.2;
    }

    .table-responsive > .neu-table td{
        padding: 6px 5px !important;
        line-height: 1.25;
    }
}

@media (max-width: 600px){
    /* Main-content 12px padding kullandigi icin sticky header kenarlara kadar kapanir. */
    .dashboard-header{
        margin-left: -12px;
        margin-right: -12px;
        width: calc(100% + 24px);
        padding-left: 12px;
        padding-right: 12px;
        padding-bottom: 9px;
    }

    /* Neu table: mobilde olabildigince kompakt. */
    .table-responsive > .neu-table th{
        padding: 5px 4px !important;
        font-size: 0.82rem;
    }

    .table-responsive > .neu-table td{
        padding: 4px 4px !important;
        font-size: 0.84rem;
        line-height: 1.2;
    }

    /* Tier karti: rozet solda, XP alani sagda. */
    .tier-display-card{
        padding: 14px;
    }

    .tier-flex-container{
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto auto;
        column-gap: 12px;
        row-gap: 12px;
        align-items: center !important;
    }

    .badge-container{
        grid-column: 1;
        grid-row: 1;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        align-self: center;
        min-width: 0;
    }

    .xp-info-container{
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        min-width: 0;
    }

    .xp-header{
        gap: 8px;
        min-width: 0;
    }

    .xp-values{
        white-space: nowrap;
    }

    /* Avantaj basligi + 3 bilgi ayni satir/griddedir. */
    .benefits-sidebar{
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100%;
        min-width: 0;
        display: grid !important;
        grid-template-columns: auto repeat(3, minmax(0, 1fr));
        align-items: center;
        gap: 7px;
        border-left: 0;
        border-top: 1px solid #080d15;
        padding: 10px 0 0;
    }

    .benefits-title{
        margin: 0;
        white-space: nowrap;
        font-size: 10px;
    }

    .benefits-list{
        display: contents;
        margin: 0;
    }

    .benefits-list > div{
        min-width: 0;
        margin: 0;
        font-size: 9.5px;
        line-height: 1.2;
        text-align: left;
        overflow-wrap: anywhere;
    }

    /* Balance kartlari inline span degerlerinden etkilenmesin. */
    .grid-3 > .neu-panel-card.esn-container,
.grid-3 > .neu-panel-card.trx-container{
        grid-column: 1 !important;
        justify-self: stretch;
        align-self: stretch;
        width: 100% !important;
    }
}

@media (max-width: 380px){
    /* 380px altinda main content 9px; sticky satir yine tam opak kaplar. */
    .dashboard-header{
        margin-left: -9px;
        margin-right: -9px;
        width: calc(100% + 18px);
        padding-left: 9px;
        padding-right: 9px;
    }

    .benefits-sidebar{
        gap: 5px;
    }

    .benefits-title{
        font-size: 9px;
    }

    .benefits-list > div{
        font-size: 8.8px;
    }
}

/* =========================================================
   USKOBOT - MOBILE ROUND 4
   Services + balance compact layout adjustments.
   ========================================================= */
@media (max-width: 992px){
    /* Mobilde istenen net ana icerik boslugu. */
    .main-content{
        padding: 0 12px 24px !important;
    }

    /* Sticky header ana icerigin iki kenarini tamamen kapatsin. */
    .dashboard-header{
        position: sticky !important;
        top: 0 !important;
        z-index: 110 !important;
        margin-left: -12px !important;
        margin-right: -12px !important;
        width: calc(100% + 24px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        background: #151d29 !important;
        background-color: #151d29 !important;
        opacity: 1 !important;
        isolation: isolate;
    }

    /* Dashboard disindaki tablo tier-flex'leri dikey/grid olmasin. */
    .neu-table .tier-flex-container{
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
        min-width: 0;
    }
}

@media (max-width: 600px){
    /* Ana icerik 380px altinda da ayni kalir. */
    .main-content{
        padding: 0 12px 24px !important;
    }

    .dashboard-header{
        margin-left: -12px !important;
        margin-right: -12px !important;
        width: calc(100% + 24px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* -----------------------------------------------------
       ACTIVE SERVICES
       Ust: ikon + hizmet bilgisi
       Alt: ikon hizasinda sure | oto-yenileme | sure uzat
       ----------------------------------------------------- */
    .active-services-table{
        display: block;
        width: 100% !important;
        min-width: 0 !important;
    }

    .active-services-table thead{
        display: none;
    }

    .active-services-table tbody{
        display: block;
        width: 100%;
    }

    .active-services-table .active-service-row{
        display: grid;
        grid-template-columns: minmax(92px, 1fr) 50px minmax(96px, auto);
        grid-template-rows: auto auto;
        gap: 8px 7px;
        width: 100%;
        padding: 10px 2px;
        border-bottom: 1px solid rgba(61, 68, 104, 0.10);
        align-items: center;
    }

    .active-services-table .active-service-row:last-child{
        border-bottom: 0;
    }

    .active-services-table .active-service-row > td{
        display: block;
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0;
    }

    .active-services-table .service-main-cell{
        grid-column: 1 / -1;
        grid-row: 1;
        text-align: left !important;
    }

    .active-services-table .service-main-cell .tier-flex-container{
        display: grid !important;
        grid-template-columns: 50px minmax(0, 1fr);
        align-items: center !important;
        gap: 10px !important;
    }

    .active-services-table .service-main-cell .neu-icon{
        width: 50px !important;
        height: 50px !important;
        min-width: 50px;
        margin: 0 !important;
    }

    /* Bitiş/gun bilgisi ikonun alt hizzasinda. */
    .active-services-table .service-expiry-cell{
        grid-column: 1;
        grid-row: 2;
        text-align: left !important;
        align-self: start;
    }

    .active-services-table .service-expiry-cell > div{
        align-items: flex-start;
    }

    .active-services-table .service-expiry-cell span{
        font-size: 11px !important;
        line-height: 1.15;
        white-space: nowrap;
    }

    .active-services-table .service-expiry-cell small{
        margin-top: 2px;
        font-size: 9px !important;
        line-height: 1.15;
    }

    /* Switch kendi gercek genisliginden fazlasini kaplamasin. */
    .active-services-table .service-renew-cell{
        grid-column: 2;
        grid-row: 2;
        width: 50px !important;
        min-width: 50px !important;
        max-width: 50px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        align-self: center;
    }

    .active-services-table .service-renew-cell .switch-container{
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        margin: 0;
    }

    /* Inline 10px 20px padding'i mobilde ezer. */
    .active-services-table .service-action-cell{
        grid-column: 3;
        grid-row: 2;
        justify-self: end;
        align-self: center;
        text-align: right !important;
    }

    .active-services-table .service-action-cell .neu-btn{
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 7px 8px !important;
        min-height: 34px;
        font-size: 10px !important;
        line-height: 1.05;
        white-space: nowrap;
        border-radius: 9px;
    }

    /* -----------------------------------------------------
       BALANCE - Son 5 Hareket
       Detayi daralt, tutar ve tarihi garanti alana yerlestir.
       ----------------------------------------------------- */
    .trx-container .table-responsive > .neu-table,
.trx-container > .neu-table{
        width: 100% !important;
        table-layout: fixed !important;
    }

    .trx-container .neu-table th,
.trx-container .neu-table td{
        padding: 4px 3px !important;
    }

    .trx-container .neu-table th:nth-child(1),
.trx-container .neu-table td:nth-child(1){
        width: 46% !important;
        text-align: left !important;
    }

    .trx-container .neu-table th:nth-child(2),
.trx-container .neu-table td:nth-child(2){
        width: 22% !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    .trx-container .neu-table th:nth-child(3),
.trx-container .neu-table td:nth-child(3){
        width: 32% !important;
        white-space: nowrap !important;
        text-align: right !important;
    }

    .trx-container .neu-table td:nth-child(1) > div{
        font-size: 11px !important;
        line-height: 1.15;
        overflow-wrap: anywhere;
    }

    .trx-container .neu-table td:nth-child(1) small{
        display: block;
        margin-top: 2px;
        font-size: 9px !important;
        line-height: 1.1;
    }

    .trx-container .neu-table td:nth-child(2) span{
        font-size: 11px !important;
    }

    .trx-container .neu-table td:nth-child(3){
        font-size: 10px !important;
        line-height: 1.1;
    }
}

@media (max-width: 380px){
    .main-content{
        padding: 0 12px 24px !important;
    }

    .dashboard-header{
        margin-left: -12px !important;
        margin-right: -12px !important;
        width: calc(100% + 24px) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .active-services-table .active-service-row{
        grid-template-columns: minmax(84px, 1fr) 46px minmax(90px, auto);
        gap: 7px 5px;
    }

    .active-services-table .service-renew-cell{
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
    }

    .active-services-table .service-action-cell .neu-btn{
        padding: 7px 6px !important;
        font-size: 9.5px !important;
    }

    .trx-container .neu-table th,
.trx-container .neu-table td{
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .trx-container .neu-table td:nth-child(3){
        font-size: 9.5px !important;
    }
}


/* =========================================================
   SERVICES + BALANCE LAYOUT FIX
   ========================================================= */

/* Oto Yenileme etiketi masaustunde tablo basligi yeterli oldugu icin gizli. */
.service-renew-label{
    display: none;
}

/* Balance / Son 5 Hareket tablosu desktopta kart disina tasmasin. */
.trx-container{
    min-width: 0;
    overflow: hidden;
}

.trx-container .table-responsive{
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.trx-container .neu-table{
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
}

.trx-container .neu-table th:nth-child(1),
.trx-container .neu-table td:nth-child(1){
    width: 56%;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.trx-container .neu-table th:nth-child(2),
.trx-container .neu-table td:nth-child(2){
    width: 18%;
    white-space: nowrap !important;
}

.trx-container .neu-table th:nth-child(3),
.trx-container .neu-table td:nth-child(3){
    width: 26%;
    white-space: nowrap !important;
}

@media (max-width: 992px){
    /*
       Services mobil 2x2:
       [ service-main-cell   ][ service-expiry-cell ]
       [ service-renew-cell  ][ service-action-cell ]
    */
    .active-services-table .active-service-row{
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto !important;
        column-gap: 10px !important;
        row-gap: 10px !important;
        align-items: center;
    }

    .active-services-table .service-main-cell{
        grid-column: 1 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        align-self: center;
    }

    .active-services-table .service-expiry-cell{
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        max-width: 132px;
        justify-self: end;
        align-self: center;
        text-align: right !important;
    }

    .active-services-table .service-expiry-cell > div{
        align-items: flex-end !important;
    }

    .active-services-table .service-expiry-cell span,
.active-services-table .service-expiry-cell small{
        text-align: right;
    }

    .active-services-table .service-renew-cell{
        grid-column: 1 !important;
        grid-row: 2 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
        gap: 9px;
        justify-self: start;
        text-align: left !important;
    }

    .active-services-table .service-renew-label{
        display: inline-block;
        color: #b3c0d3;
        font-size: 10px;
        font-weight: 800;
        white-space: nowrap;
    }

    .active-services-table .service-renew-cell .switch-container{
        flex: 0 0 46px;
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        margin: 0;
    }

    .active-services-table .service-action-cell{
        grid-column: 2 !important;
        grid-row: 2 !important;
        justify-self: end;
        align-self: center;
        text-align: right !important;
    }

    .active-services-table .service-action-cell .neu-btn{
        padding: 7px 8px !important;
        width: auto !important;
        min-width: 0 !important;
        white-space: nowrap;
    }

    /* Mobilde mevcut daha dar kolon dagilimini koru. */
    .trx-container .neu-table th:nth-child(1),
.trx-container .neu-table td:nth-child(1){
        width: 46% !important;
    }

    .trx-container .neu-table th:nth-child(2),
.trx-container .neu-table td:nth-child(2){
        width: 22% !important;
    }

    .trx-container .neu-table th:nth-child(3),
.trx-container .neu-table td:nth-child(3){
        width: 32% !important;
    }
}

@media (max-width: 380px){
    .active-services-table .active-service-row{
        column-gap: 7px !important;
    }

    .active-services-table .service-expiry-cell{
        max-width: 116px;
    }

    .active-services-table .service-renew-cell{
        gap: 6px;
    }

    .active-services-table .service-renew-label{
        font-size: 9.5px;
    }
}

/* =========================================================
   USKOBOT - MOBILE ROUND 7
   Index detaylari, services 50/50 ve support mobil duzeni.
   ========================================================= */
@media (max-width: 992px){
    /* INDEX: ilk detay tam satir, sonraki iki detay esit yarim satir. */
    .tier-details-bar .details-grid{
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px 12px !important;
        align-items: stretch;
        text-align: center !important;
    }

    .tier-details-bar .details-grid .det-item{
        width: 100% !important;
        min-width: 0;
        flex: none !important;
        text-align: center !important;
    }

    .tier-details-bar .details-grid .det-item:first-child{
        grid-column: 1 / -1 !important;
    }

    .tier-details-bar .details-grid .det-item:nth-child(n/**/+2){
        grid-column: auto !important;
    }

    /* SERVICES: tum 2x2 hucreler tam %50/%50. */
    .active-services-table .active-service-row{
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: auto auto !important;
        column-gap: 10px !important;
        row-gap: 10px !important;
    }

    .active-services-table .service-main-cell,
.active-services-table .service-expiry-cell,
.active-services-table .service-renew-cell,
.active-services-table .service-action-cell{
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    .active-services-table .service-expiry-cell{
        justify-self: stretch !important;
        text-align: right !important;
    }

    .active-services-table .service-expiry-cell span{
        font-size: 16px !important;
        line-height: 1.2;
    }

    .active-services-table .service-expiry-cell small{
        font-size: 14px !important;
        line-height: 1.25;
    }

    .active-services-table .service-renew-cell{
        justify-self: stretch !important;
    }

    .active-services-table .service-action-cell{
        justify-self: stretch !important;
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
    }

    /* SUPPORT: mobilde yatay tablo yerine okunabilir kart satirlari. */
    .support-toolbar{
        align-items: center !important;
    }

    .support-new-ticket-area .neu-panel-card{
        padding: 16px !important;
    }

    .support-new-ticket-area .grid-3{
        gap: 0 !important;
    }

    .support-new-ticket-area .form-group{
        margin-bottom: 16px !important;
    }

    .support-form-actions{
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px !important;
    }

    .support-form-actions .neu-btn{
        width: 100% !important;
        padding: 10px 8px !important;
    }

    .support-table-card{
        padding: 8px !important;
        overflow: visible !important;
    }

    .support-table-card.table-responsive,
.support-table-card .table-responsive{
        overflow: visible !important;
        padding-bottom: 0 !important;
    }

    .support-ticket-table{
        display: block !important;
        width: 100% !important;
        table-layout: auto !important;
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    .support-ticket-table thead{
        display: none !important;
    }

    .support-ticket-table tbody{
        display: grid !important;
        gap: 10px;
        width: 100%;
    }

    .support-ticket-table tr{
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px 10px;
        width: 100%;
        padding: 12px !important;
        border: 0 !important;
        border-radius: 12px;
        background: #151d29;
        box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
        box-sizing: border-box;
    }

    .support-ticket-table td{
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .support-ticket-table .support-ticket-subject{
        grid-column: 1 / -1;
        font-size: 14px;
        color: #eef3fa;
    }

    .support-ticket-table .support-ticket-id{
        grid-column: 1;
        color: #b3c0d3;
        font-size: 12px;
    }

    .support-ticket-table .support-ticket-priority{
        grid-column: 2;
        text-align: right !important;
    }

    .support-ticket-table .support-ticket-status{
        grid-column: 1;
        align-self: center;
        font-size: 12px;
    }

    .support-ticket-table .support-ticket-action{
        grid-column: 2;
        text-align: right !important;
    }

    .support-ticket-table .support-ticket-action .neu-btn{
        width: auto !important;
        min-width: 0 !important;
        padding: 6px 10px !important;
        font-size: 11px !important;
    }

    /* Bos destek tablosu satiri kart gridini bozmamali. */
    .support-ticket-table tr > td[colspan]{
        grid-column: 1 / -1;
        text-align: center !important;
        padding: 20px 8px !important;
    }
}

@media (max-width: 600px){
    /* Onceki flex mobile kuralini kesin olarak ez. */
    .tier-details-bar .details-grid{
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        text-align: center !important;
    }

    .tier-details-bar .details-grid > *{
        width: 100% !important;
        flex-basis: auto !important;
    }

    .support-toolbar .neu-btn,
.support-toolbar .btn-small{
        width: auto !important;
        align-self: flex-start;
        padding: 8px 12px !important;
    }
}

/* =========================================================
   GÜNCELLEME NOTLARI / KOZY TARZI KART GÖRÜNÜMÜ
   ========================================================= */
.updates-page-shell{
    width: min(100%, 980px);
    margin: 0 auto;
    padding: 2px 0 38px;
}

.updates-intro{
    margin: 0 4px 20px;
    text-align: center;
}

.updates-intro p{
    margin: 0;
    color: #9baabd;
    font-size: 14px;
    line-height: 1.65;
}

.updates-list{
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.update-note-card{
    background: #151d29;
    border: 1px solid rgba(108, 114, 147, 0.11);
    border-radius: 17px;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    overflow: hidden;
    transition: box-shadow .22s ease, border-color .22s ease, transform .22s ease, opacity .2s ease;
}

.update-note-card:hover{
    border-color: rgba(255, 191, 71, 0.16);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.update-note-card.hidden-update{
    display: none;
}

.update-note-header{
    width: 100%;
    min-height: 76px;
    padding: 17px 20px;
    border: 0;
    outline: 0;
    background: transparent;
    color: inherit;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    text-align: left;
    cursor: pointer;
    font: inherit;
}

.update-note-header:focus-visible{
    box-shadow: inset 0 0 0 2px rgba(255, 191, 71, 0.38);
}

.update-note-heading{
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.update-date{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #99a9be;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
}

.update-date svg{
    flex: 0 0 auto;
    color: #b3c0d3;
}

.update-note-title{
    display: block;
    color: #eef3fa;
    font-size: 15px;
    font-weight: 750;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.update-note-actions{
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.update-version-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 191, 71, 0.09);
    color: #ffbf47;
    border: 1px solid rgba(255, 191, 71, 0.13);
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.update-chevron{
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #99a9be;
    background: rgba(108, 114, 147, 0.055);
    transition: transform .24s ease, color .2s ease, background .2s ease;
}

.update-note-card:not(.collapsed) .update-chevron{
    transform: rotate(180deg);
    color: #ffbf47;
    background: rgba(255, 191, 71, 0.08);
}

.update-note-body{
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows .28s ease;
}

.update-note-card.collapsed .update-note-body{
    grid-template-rows: 0fr;
}

.update-note-body-inner{
    min-height: 0;
    overflow: hidden;
}

.update-note-body-inner::before{
    content: "";
    display: block;
    height: 1px;
    margin: 0 20px;
    background: rgba(108, 114, 147, 0.12);
}

.update-note-summary{
    margin: 17px 20px 0;
    color: #a8b5c7;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.65;
}

.update-note-changes{
    padding: 10px 20px 20px;
}

.update-note-changes p{
    margin: 0;
    padding: 7px 0;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #a9b7ca;
    font-size: 13.5px;
    line-height: 1.62;
}

.update-change-dot{
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    margin-top: 8px;
    border-radius: 50%;
    background: #ffbf47;
    box-shadow: 0 0 0 4px rgba(255, 191, 71, 0.07);
}

.update-change-row--tagged{
    gap: 9px !important;
}

.update-change-tag{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 82px;
    margin-top: 1px;
    padding: 3px 8px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: 0.15px;
    white-space: nowrap;
}

.update-change-tag--feature{
    color: #009b73;
    background: rgba(0, 200, 150, 0.11);
    border-color: rgba(0, 200, 150, 0.28);
}

.update-change-tag--fix{
    color: #e62f4f;
    background: rgba(255, 59, 92, 0.09);
    border-color: rgba(255, 59, 92, 0.25);
}

.update-change-tag--info{
    color: #c88a00;
    background: rgba(245, 166, 35, 0.12);
    border-color: rgba(245, 166, 35, 0.30);
}

.update-change-text{
    min-width: 0;
    flex: 1 1 auto;
}

.show-more-card{
    width: 100%;
    margin-top: 16px;
    min-height: 52px;
    padding: 0 18px;
    border: 1px solid rgba(108, 114, 147, 0.1);
    border-radius: 15px;
    background: #151d29;
    color: #a5b4ca;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 750;
    cursor: pointer;
    transition: color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.show-more-card:hover{
    color: #ffbf47;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .27), inset 0 1px 0 rgba(255, 255, 255, .025);
}

.show-more-card:active{
    transform: translateY(1px);
    box-shadow: inset 0 2px 7px rgba(1, 6, 13, .58), inset 0 0 0 1px rgba(148, 163, 184, .055);
}

.show-more-card svg{
    transition: transform .22s ease;
}

.show-more-card.expanded svg{
    transform: rotate(180deg);
}

.update-access-card,
.update-empty-card{
    display: flex;
    align-items: center;
    gap: 20px;
}

.update-access-icon{
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #151d29;
    box-shadow: inset 3px 3px 6px #101824, inset -3px -3px 6px #1c2939;
    font-size: 22px;
}

.update-access-card h3,
.update-empty-card h3{
    margin: 0 0 5px;
    color: #eef3fa;
}

.update-access-card p,
.update-empty-card p{
    margin: 0;
    color: #9baabd;
    font-size: 14px;
}

.update-access-button{
    width: auto;
    display: inline-flex;
    margin-top: 14px;
    padding: 10px 16px;
}

@media (max-width: 720px){
    .updates-page-shell{
        padding-bottom: 24px;
    }

    .updates-intro{
        margin-bottom: 14px;
        text-align: left;
    }

    .updates-list{
        gap: 11px;
    }

    .update-note-header{
        min-height: 70px;
        padding: 15px 14px;
        gap: 10px;
    }

    .update-note-title{
        font-size: 14px;
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .update-note-actions{
        gap: 6px;
    }

    .update-version-badge{
        padding: 5px 8px;
        font-size: 10px;
    }

    .update-chevron{
        width: 28px;
        height: 28px;
    }

    .update-note-body-inner::before{
        margin: 0 14px;
    }

    .update-note-summary{
        margin: 14px 14px 0;
        font-size: 13px;
    }

    .update-note-changes{
        padding: 8px 14px 16px;
    }

    .update-note-changes p{
        padding: 6px 0;
        font-size: 13px;
        gap: 9px;
    }

    .update-change-tag{
        min-width: 76px;
        padding: 3px 7px;
        font-size: 10px;
    }

    .update-access-card,
.update-empty-card{
        align-items: flex-start;
        padding: 22px;
    }
}




/* ================================================================
   USKOBOT DARK GOLD 2026 | Visual layer
   Reference: deep midnight surfaces, brushed borders, warm gold.
   Scope: cosmetic only; PHP actions, table data and JS are unchanged.
   ================================================================ */
:root{
  color-scheme: dark;
  --fx-bg: #090e16;
  --fx-sidebar: #0d141f;
  --fx-surface: #151e2b;
  --fx-surface-hover: #1b2635;
  --fx-surface-raised: #1e2a3a;
  --fx-line: #2a384a;
  --fx-line-soft: rgba(164,184,208,.12);
  --fx-text: #eef3fa;
  --fx-muted: #a0b0c3;
  --fx-gold: #ffbf47;
  --fx-gold-hot: #ffd47a;
  --fx-gold-dim: rgba(255,191,71,.12);
  --fx-green: #34d399;
  --dark-shadow: rgba(0,0,0,.43);
  --light-shadow: rgba(255,255,255,.025);
  --text-color: var(--fx-text);
  --success-color: var(--fx-gold);
  accent-color: var(--fx-gold);
}
html{ background: var(--fx-bg); }
body{
  font-family: "Inter", "Segoe UI", sans-serif;
  background: var(--fx-bg);
  color: var(--fx-text);
  letter-spacing: -.012em;
  -webkit-font-smoothing: antialiased;
}
::selection{ background: rgba(255,191,71,.29); color: #fff; }
:focus-visible{ outline: 2px solid var(--fx-gold); outline-offset: 3px; }
button,
input,
select,
textarea{ font: inherit; }
button,
a,
[role="button"]{ -webkit-tap-highlight-color: transparent; }
a:hover{ color: var(--fx-gold); }
.dashboard-container{
  background: radial-gradient(ellipse 1050px 700px at 67% -37%, rgba(255,191,71,.075), transparent 77%), var(--fx-bg);
}
.sidebar{
  width: 266px;
  padding: 26px 16px 20px;
  background: var(--fx-sidebar);
  border-right: 1px solid var(--fx-line-soft);
  box-shadow: 12px 0 40px rgba(0,0,0,.16);
}
.sidebar .brand{
  position: relative;
  justify-content: flex-start;
  font-size: 21px;
  font-weight: 800;
  letter-spacing: -.065em;
  margin: 3px 8px 30px;
  color: var(--fx-text);
  text-shadow: none;
}
.sidebar .brand .neu-icon{
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffda8c, #e99c25) !important;
  box-shadow: 0 4px 20px rgba(255, 171, 47, .2) !important;
  color: #1b160e;
  margin: 0 !important;
  font-size: 22px;
}
.sidebar .brand > span{ letter-spacing: -.045em !important; }
.sidebar .brand > span::after{
  content: "CONTROL CENTER"; display:block;
  color: #8995a6; letter-spacing: .25em;
  font-size: 9px; font-weight: 700; margin-top: 1px;
}
.sidebar nav{ min-height:0; overflow-y:auto !important; overflow-x:hidden !important; padding-right:3px; scrollbar-width:thin; }
.sidebar .nav-item{
  padding: 11px 12px;
  margin-bottom: 5px;
  gap: 13px;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: var(--fx-muted);
  font-size: 12.5px;
  font-weight: 600;
  box-shadow: none;
  transform: none;
  transition: color .2s, background .2s, border-color .2s;
}
.sidebar .nav-item svg{ flex: 0 0 19px; width:19px; height:19px; opacity:.85; }
.sidebar .nav-item:hover{ background: rgba(255,255,255,.045); color:var(--fx-text); border-color:var(--fx-line-soft); transform:none; }
.sidebar .nav-item.active{
  background: linear-gradient(90deg,rgba(255,191,71,.16),rgba(255,191,71,.045));
  border: 1px solid rgba(255,191,71,.22);
  box-shadow: inset 3px 0 0 var(--fx-gold);
  color: var(--fx-gold-hot);
}
.sidebar .nav-item.active svg{ opacity:1; }
.sidebar .nav-item.locked-feature{ opacity:.53; }
.sidebar-footer{ margin-top:auto; padding-top:16px; transform:none !important; border-top:1px solid var(--fx-line-soft); }
.sidebar-footer .neu-panel-card{
  margin:0 0 10px !important;
  padding:15px !important;
  background: rgba(255,255,255,.03);
  border: 1px solid var(--fx-line-soft);
  border-radius:12px;
  box-shadow:none !important;
}
.sidebar-footer .logout-btn{ margin-top:9px; }
.main-content{
  min-width:0;
  padding: 22px clamp(22px,3.1vw,48px) 38px;
  scrollbar-width:thin;
  scrollbar-color: #344153 transparent;
}
.main-content::-webkit-scrollbar,
.sidebar nav::-webkit-scrollbar{ width:7px; }
.main-content::-webkit-scrollbar-thumb,
.sidebar nav::-webkit-scrollbar-thumb{ background: #344153; border-radius:999px; }
.main-content::-webkit-scrollbar-track{ background:transparent; }
.dashboard-header{
  min-height:73px;
  margin:0 0 29px;
  padding:9px 0 18px;
  border-bottom:1px solid var(--fx-line-soft);
  gap:16px;
  background: transparent;
}
.page-title{
  margin:0;
  min-width:0;
  color:var(--fx-text);
  font-size:clamp(20px,2vw,27px);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:1.25;
}
.dashboard-header .page-title::before{
  content:"";
  display:inline-block;
  width:4px; height:21px;
  margin-right:12px;
  vertical-align:-3px;
  border-radius:4px;
  background:linear-gradient(#ffe09c,#eb9820);
  box-shadow:0 0 15px rgba(255,191,71,.22);
}
.header-actions > a.neu-btn,
.header-updates-btn,
.header-settings-btn{
  color:#c9d5e3;
  background: var(--fx-surface);
  border:1px solid var(--fx-line);
  border-radius:12px;
  box-shadow:none !important;
}
.header-actions > a.neu-btn:hover{ background:var(--fx-surface-hover); color:var(--fx-gold); border-color:rgba(255,191,71,.38); }
.neu-panel-card,
.login-card,
.update-note-card,
.cloud-modal-card{
  background:linear-gradient(157deg,#182231 0%,#131c29 100%);
  color:var(--fx-text);
  border:1px solid var(--fx-line-soft);
  border-radius:18px;
  box-shadow:0 11px 32px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.025);
}
.neu-panel-card{ padding:clamp(18px,2.2vw,27px); margin-bottom:22px; }
.neu-panel-card:hover{ border-color:rgba(164,184,208,.20); }
.neu-icon{
  background:rgba(255,191,71,.09);
  border:1px solid rgba(255,191,71,.15);
  border-radius:16px;
  color:var(--fx-gold);
  box-shadow:none;
}
.neu-btn,
.btn,
.btn-primary,
.show-more-card,
.cloud-cancel-button{
  border-radius:11px;
  border:1px solid var(--fx-line);
  background:var(--fx-surface-raised);
  color:var(--fx-text);
  box-shadow:none;
  transition:background .19s, color .19s, border-color .19s, transform .19s, box-shadow .19s;
}
.neu-btn:hover,
.btn:hover,
.show-more-card:hover{
  transform:translateY(-2px);
  background:#28364a;
  color:#fff;
  border-color:#526177;
  box-shadow:0 8px 20px rgba(0,0,0,.14);
}
.neu-btn:active,
.btn:active,
.show-more-card:active{ transform:translateY(0); box-shadow:inset 0 2px 7px rgba(0,0,0,.25); }
.btn-primary,
button[type="submit"].neu-btn,
.pkg-card .neu-btn,
.login-card form .neu-btn{
  background:linear-gradient(125deg,#ffda8c 0%,#ffbf47 56%,#ed9e27 100%);
  border-color:#ffc75e;
  color:#16130e;
  font-weight:800;
  box-shadow:0 5px 18px rgba(226,151,27,.14);
}
.btn-primary:hover,
button[type="submit"].neu-btn:hover,
.pkg-card .neu-btn:hover,
.login-card form .neu-btn:hover{
  background:linear-gradient(125deg,#ffe2a5,#ffc95f,#ffb844);
  color:#18130c;
  border-color:#ffe09c;
  box-shadow:0 9px 24px rgba(255,191,71,.24);
}
.btn-disabled,
button:disabled,
.neu-btn:disabled{ opacity:.48; cursor:not-allowed; box-shadow:none !important; transform:none !important; }
.neu-input,
.form-control,
select,
textarea{
  background:#0e1622;
  color:var(--fx-text);
  border:1px solid #334154;
  border-radius:11px;
  box-shadow:inset 0 1px 4px rgba(0,0,0,.18);
}
.neu-input::placeholder,
.form-control::placeholder,
textarea::placeholder,
input::placeholder{ color:#75849a; opacity:1; }
.neu-input:focus,
.form-control:focus,
select:focus,
textarea:focus{
  border-color:var(--fx-gold);
  background:#111b29;
  box-shadow:0 0 0 3px rgba(255,191,71,.14);
  outline:none;
}
.neu-table{ border-collapse:separate !important; border-spacing:0 6px !important; }
.neu-table th,
.neu-table thead th{
  color:#a4b2c5;
  background:transparent;
  font-weight:700;
  font-size:11px;
  letter-spacing:.075em;
  border-bottom:1px solid var(--fx-line) !important;
}
.neu-table td,
tbody tr td{ color:#dce6f2; border-color:var(--fx-line-soft); }
.neu-table tbody tr td{ background:rgba(255,255,255,.022) !important; }
.neu-table tbody tr:hover td{ background:rgba(255,191,71,.055) !important; }
.neu-table tbody tr td:first-child{ border-radius:10px 0 0 10px; }
.neu-table tbody tr td:last-child{ border-radius:0 10px 10px 0; }
.table-responsive{ scrollbar-color:#344153 transparent; }
.badge,
.status,
.update-version-badge{
  box-shadow:none;
  border:1px solid rgba(164,184,208,.14);
  background:rgba(255,255,255,.035);
}
.badge.success,
.text-success{ color:#46dfac; }
.badge.warning{ color:#ffca65; }
.badge.danger,
.text-danger{ color:#ff8092; }
.stat-value-credit,
.balance-badge b{ color:var(--fx-gold-hot); }
.stat-value-standard,
.xp-current-bold,
.xp-tier-name,
.tier-name-label{ color:var(--fx-text); }
.stat-value-blue,
.version-text{ color:var(--fx-gold); }
.stat-label,
.det-label,
.pkg-duration,
.info-text{ color:var(--fx-muted); }
.loyalty-panel{ position:relative; overflow:hidden; }
.loyalty-panel::before{
  content:""; pointer-events:none; position:absolute; top:-130px; right:-160px; width:440px; height:270px;
  background:radial-gradient(ellipse,rgba(255,191,71,.11),transparent 71%);
}
.loyalty-panel > *{ position:relative; z-index:1; }
.tier-display-card,
.tier-details-bar,
.summary-box,
.price-display,
.tier-footer-summary{
  border-radius:14px;
  border:1px solid var(--fx-line-soft);
  background:linear-gradient(145deg,#1d2837,#131d2b);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.tier-display-card[style]{ background-color:#182331 !important; }
.shadow-inset,
.active-rank,
.rank-active{ box-shadow:inset 0 1px 4px rgba(0,0,0,.25) !important; }
.rank-card-item{ border-radius:14px; }
.rank-card-item.active-rank,
.rank-card-item.rank-active{
  border:1px solid rgba(255,191,71,.55);
  background:linear-gradient(165deg,rgba(255,191,71,.14),#182231);
  box-shadow:0 0 0 1px rgba(255,191,71,.08) !important;
}
.rank-card-item:hover:not(.active-rank){ border-color:rgba(255,191,71,.3); }
.progress-track{ background:#0b1420; border:1px solid #303d4f; }
.progress-fill-dynamic{ border-radius:999px; }
.info-box{ border-left:3px solid var(--fx-gold); background:rgba(255,191,71,.04); }
.pkg-card:hover,
.reseller-card:hover{ border-color:rgba(255,191,71,.38); }
.price-value,
.pkg-price{ color:var(--fx-gold); }
.switch-slider{ background:#253347; box-shadow:inset 0 2px 6px rgba(0,0,0,.4); }
.switch-slider:before{ background:#b7c4d5; box-shadow:0 2px 7px rgba(0,0,0,.3); }
input:checked + .switch-slider{ background:var(--fx-gold); }
input:checked + .switch-slider:before{ background:#20190e; }
.dropdown-menu{ background:#1b2736; border-color:var(--fx-line); box-shadow:0 16px 35px rgba(0,0,0,.28); }
.dropdown-item{ color:var(--fx-text); }
.dropdown-item:hover{ background:#303a46; color:var(--fx-gold); }
.modal-blur,
.modal-overlay,
.cloud-modal-overlay{ backdrop-filter:blur(8px); }
.modal-overlay,
.cloud-modal-overlay{ background:rgba(3,7,13,.77); }
.cloud-modal-card{ box-shadow:0 25px 85px rgba(0,0,0,.6); }
.cloud-intro{ border-left:3px solid var(--fx-gold); }
.cloud-intro-icon,
.update-access-icon,
.cloud-modal-warning{ background:rgba(255,191,71,.07); border:1px solid rgba(255,191,71,.16); box-shadow:none; }
.cloud-route-empty,
.cloud-modal-note{ background:rgba(0,0,0,.10); box-shadow:none; border:1px dashed var(--fx-line); }
.cloud-route-delete{ background:rgba(251,77,101,.09); box-shadow:none; border:1px solid rgba(251,77,101,.16); }
.update-note-card{ border-radius:15px; box-shadow:0 7px 23px rgba(0,0,0,.12); }
.update-note-card:hover{ border-color:rgba(255,191,71,.32); box-shadow:0 10px 28px rgba(0,0,0,.22); }
.update-note-title{ color:var(--fx-text); }
.update-date,
.update-note-summary,
.update-access-card p,
.update-empty-card p{ color:var(--fx-muted); }
.update-chevron{ background:rgba(255,191,71,.08); color:var(--fx-gold); }
.show-more-card{ background:var(--fx-surface); color:var(--fx-muted); border:1px solid var(--fx-line); }
.show-more-card:hover{ color:var(--fx-gold); }
/* Auth has a slightly more dramatic spotlight without touching form actions. */
body:has(.auth-container){ overflow:auto; min-height:100dvh; }
.auth-container{
  position:relative;
  background:radial-gradient(ellipse 550px 400px at 50% 18%,rgba(255,191,71,.10),transparent 80%),
             radial-gradient(ellipse 400px 480px at 100% 100%,rgba(44,87,134,.1),transparent 80%), #090e16;
  padding:40px 16px;
}
.login-card{
  max-width:450px;
  padding:42px clamp(24px,6vw,42px);
  border:1px solid #324052;
  box-shadow:0 22px 85px rgba(0,0,0,.38);
  border-radius:23px;
}
.login-card .neu-icon{ background:linear-gradient(145deg,#ffda8b,#e9a438); color:#17130d; border:0; }
.login-card h2{ color:#f5f7fb; font-size:25px; letter-spacing:-.04em; }
.login-card form{ margin-top:5px; }
.login-card .form-group{ margin-bottom:19px; }
.login-card .neu-input{ min-height:51px; }
.login-card a{ transition: color .2s; }
.alert-danger{ background:rgba(255,96,116,.065); }
/* Screen sizes retain existing mobile table/card reshaping rules. */
@media (max-width:992px){
  .sidebar{ width:min(330px,88vw); height:100dvh; align-items:stretch; justify-content:initial; padding:25px 17px 18px; }
  .sidebar .nav-item{ width:100%; justify-content:flex-start; font-size:13px; padding:10px 13px; }
  .sidebar nav{ flex-grow:1; overflow-y:auto !important; }
  .sidebar .brand{ margin-right:44px; }
  .main-content{ padding:15px 18px 30px; }
  .dashboard-header{ min-height:65px; padding:7px 0 12px; margin-bottom:18px; background:transparent; }
  .dashboard-header .page-title{ color:var(--fx-text); font-size:clamp(17px,4vw,23px); }
  .dashboard-header .page-title::before{ display:none; }
  .mobile-toggle-btn,
.menu-close-btn{
    background:var(--fx-surface-raised);
    color:var(--fx-gold);
    border:1px solid var(--fx-line);
    box-shadow:0 7px 20px rgba(0,0,0,.25);
  }
  .mobile-sidebar-overlay{ background:rgba(0,0,0,.64); backdrop-filter:blur(3px); }
  .loyalty-selector{ margin:0 !important; padding:16px 0 0 !important; }
  .tier-flex-container{ align-items:flex-start; }
  .grid-3,
.grid-4,
.grid-5{ gap:14px; }
}
@media (max-width:600px){
  .main-content{ padding:12px 12px 27px; }
  .dashboard-header{ gap:9px; }
  .neu-panel-card{ padding:17px; margin-bottom:14px; border-radius:15px; }
  .login-card{ padding:35px 24px; }
  .sidebar{ padding-top:22px; }
  .sidebar .brand{ margin-bottom:20px; }
  .header-actions > a.neu-btn{ border-radius:10px; }
  .reseller-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .table-responsive{ overflow-x:auto; }
}


.sidebar .brand-highlight{ color:var(--fx-gold); }

/* Dashboard: present the real account metrics before the rank details. */
.fx-dashboard-banner{
  display:flex; align-items:center; justify-content:space-between; gap:22px;
  padding:25px 29px; margin:0 0 23px;
  border:1px solid rgba(255,191,71,.23); border-radius:17px;
  background:linear-gradient(105deg,rgba(255,191,71,.105),rgba(255,191,71,.015));
}
.fx-dashboard-banner h2{ color:#f6f7fb; font-size:19px; line-height:1.3; margin:2px 0 7px; letter-spacing:-.03em; }
.fx-dashboard-banner p:not(.fx-dashboard-kicker){ color:var(--fx-muted); font-size:12px; line-height:1.55; }
.fx-dashboard-kicker{ margin:0 0 5px; font-weight:800; font-size:10px; letter-spacing:.16em; color:var(--fx-gold); }
.fx-dashboard-banner-action{ display:inline-flex; gap:12px; align-items:center; width:auto; white-space:nowrap; padding:12px 19px; }
.fx-overview-cards{ gap:18px; margin-bottom:23px; }
.fx-overview-cards > .neu-panel-card{
  position:relative; display:flex; flex-direction:column; justify-content:center;
  text-align:left; min-height:148px; padding:24px 75px 24px 25px; margin-bottom:0;
}
.fx-overview-cards .neu-icon{ position:absolute; right:21px; top:21px; width:42px; height:42px; margin:0; font-size:19px; }
.fx-overview-cards .stat-label{ text-transform:uppercase; letter-spacing:.1em; font-size:10px; font-weight:750; margin-bottom:15px; }
.fx-overview-cards h2{ font-size:clamp(24px,2.4vw,29px); letter-spacing:-.045em; line-height:1.2; margin:0 0 6px; }
.fx-overview-cards small{ font-size:11px; }
@media (max-width:992px){ .fx-overview-cards{ gap:14px; } }
@media (max-width:600px){
 .fx-dashboard-banner{ padding:20px; align-items:flex-start; flex-direction:column; gap:15px; }
 .fx-dashboard-banner h2{ font-size:18px; }
 .fx-dashboard-banner-action{ padding:11px 16px; }
 .fx-overview-cards .neu-panel-card{ min-height:126px; padding:22px 72px 22px 21px; }
}


/* SOURCE STYLE BLOCK 01 */
/* USKOBOT • MATTE WORKSPACE 1.4 — GOLD / COMPACT SIDEBAR
   Presentation only. No external dependencies, no account or payment changes.
   Single fixed gold palette; no color picker or saved color selection. */
:root{
  color-scheme:dark;
  --mf-canvas:#0b111b; --mf-bg:#0b111b; --mf-sidebar:#0d1420;
  --mf-card:#151f2e; --mf-raised:#1d2b3f; --mf-input:#0d1624;
  --mf-line:#30435d; --mf-soft:#28384f; --mf-text:#f5f8ff;
  --mf-muted:#c1cfe2; --mf-dim:#a9bbd2;
  --mf-accent:#f2b84b; --mf-accent-hover:#ffd16f; --mf-accent-text:#ffd274;
  --mf-accent-ink:#161b25; --mf-accent-rgb:242,184,75;
  --mf-accent-soft:rgba(var(--mf-accent-rgb),.12);
  --mf-accent-line:rgba(var(--mf-accent-rgb),.48);
  --mf-focus:rgba(var(--mf-accent-rgb),.22);
  --mf-green:#4ce0a2; --mf-red:#ff8e9f;
  --fx-bg:var(--mf-bg); --fx-sidebar:var(--mf-sidebar); --fx-surface:var(--mf-card);
  --fx-surface-hover:var(--mf-raised); --fx-surface-raised:var(--mf-raised);
  --fx-line:var(--mf-line); --fx-line-soft:var(--mf-soft);
  --fx-text:var(--mf-text); --fx-muted:var(--mf-muted);
  --fx-gold:var(--mf-accent); --fx-gold-hot:var(--mf-accent-text); --fx-gold-dim:var(--mf-accent-soft);
  --fx-green:var(--mf-green); --text-color:var(--mf-text); --success-color:var(--mf-green);
  --primary-blue:var(--mf-accent); --dark-shadow:transparent; --light-shadow:transparent;
  accent-color:var(--mf-accent);
}
html{background:var(--mf-canvas);}
body.mf-theme{
  background:var(--mf-bg);margin:0;
  color:var(--mf-text); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  font-size:16px;line-height:1.5;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;
  height:100vh;height:100dvh;overflow:hidden;
}
.mf-theme ::selection{background:var(--mf-accent);color:var(--mf-accent-ink);}
.mf-theme *,
.mf-theme *::before,
.mf-theme *::after{box-sizing:border-box;}
.mf-theme :focus-visible{outline:2px solid var(--mf-accent-text);outline-offset:3px;}
.mf-theme a:hover{color:var(--mf-text);}
.mf-theme button{font-family:inherit;}
.mf-theme svg{flex-shrink:0;}
.mf-theme [hidden]{display:none !important;}
.mf-sr-only{position:absolute !important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.mf-skip-link{position:fixed;top:-70px;left:24px;z-index:10000;background:var(--mf-accent);padding:10px 18px;border-radius:6px;color:white;}
.mf-skip-link:focus{top:12px;}
/* One sidebar only. Use the recovered width for content, not another rail. */
.mf-theme .dashboard-container{
  margin:0;width:100%;height:100vh;height:100dvh;
  min-height:0;display:flex;gap:0;padding:0;overflow:hidden;background:var(--mf-bg);
  border:0;border-radius:0;box-shadow:none;
}
.mf-theme .sidebar{position:relative;inset:auto;width:224px;flex:0 0 224px;height:100%;padding:18px 11px 10px;border:0;border-right:1px solid var(--mf-soft);border-radius:0;background:var(--mf-sidebar) !important;box-shadow:none !important;overflow:hidden;transform:none;transition:none;}
.mf-theme .sidebar .brand{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin:0 7px 23px;font-size:15px;font-weight:650;letter-spacing:.02em;color:var(--mf-text);text-shadow:none;min-height:25px;}
.mf-theme .sidebar .brand > span::after{display:none;}
.mf-theme .sidebar .brand > span{letter-spacing:inherit !important;}
.mf-brand-mark{display:grid;place-items:center;width:25px;height:25px;border-radius:6px;background:var(--mf-accent);color:#fff;}
.mf-brand-caption{margin-left:auto;font-size:13px;color:var(--mf-dim);font-weight:400;}
.mf-nav-search{display:flex;align-items:center;gap:7px;min-height:31px;margin:0 1px 22px;padding:0 8px;background:var(--mf-input);border:1px solid var(--mf-line);border-radius:5px;color:var(--mf-dim);}
.mf-nav-search:focus-within{border-color:var(--mf-accent-line);}
.mf-nav-search input{font:inherit;font-size:14px;background:transparent;border:0;outline:0;color:var(--mf-text);padding:6px 0;width:100%;min-width:0;}
.mf-nav-search input::placeholder{color:var(--mf-muted);}
.mf-nav-search kbd{font:12px "Segoe UI",sans-serif;white-space:nowrap;background:var(--mf-raised);color:var(--mf-muted);padding:1px 3px;border-radius:3px;}
.mf-nav-label{display:block;color:var(--mf-muted);text-transform:none;font-weight:500;font-size:14px;letter-spacing:.01em;margin:0 10px 9px;}
.mf-theme .sidebar nav{flex:1 1 0;min-height:0;width:100%;overflow-y:auto !important;overflow-x:hidden !important;padding-right:0;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#4c6380 transparent;}
.mf-theme .sidebar nav .mf-nav-label{margin-top:12px;}
.mf-theme .sidebar .nav-item{padding:8px 9px;gap:9px;min-height:33px;margin:0 0 2px;background:transparent;color:var(--mf-muted);font-size:15px;font-weight:400;border:1px solid transparent;border-radius:5px;box-shadow:none !important;transform:none !important;transition:background .15s,color .15s;}
.mf-theme .sidebar .nav-item svg{width:14px;height:14px;flex-basis:14px;opacity:.8;stroke-width:1.6;}
.mf-theme .sidebar .nav-item.active{background:var(--mf-accent-soft);color:var(--mf-text);border:1px solid var(--mf-line);box-shadow:none;}
.mf-theme .sidebar .nav-item.active::before,
.mf-theme .sidebar .nav-item.active::after{display:none;}
.mf-theme .sidebar .nav-item.active svg{color:var(--mf-accent-text);opacity:1;}
.mf-theme .sidebar .nav-item:hover{background:var(--mf-raised);color:#fff;}
.mf-theme .sidebar .nav-item.locked-feature{opacity:.65;}
.mf-theme .sidebar-footer{flex:0 0 auto;margin-top:auto;padding-top:8px;border-top:1px solid var(--mf-soft);transform:none !important;}
.mf-sidebar-account{display:flex;align-items:center;gap:9px;padding:6px 5px 10px;min-width:0;}
.mf-small-avatar{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;color:#03100c;background:#4ce0a2;flex-shrink:0;}
.mf-sidebar-account > div{display:flex;flex-direction:column;min-width:0;flex:1;}
.mf-sidebar-account b{font-size:14px;line-height:1.4;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mf-sidebar-account small{font-size:13px;color:var(--mf-dim);}
.mf-theme .sidebar-footer .logout-btn{font-size:14px;color:var(--mf-muted) !important;min-height:30px;}
.mf-nav-empty{font-size:14px;color:var(--mf-muted);padding:12px 9px;}
/* Shared page header. */
.mf-theme .main-content{min-width:0;flex:1;height:100%;margin:0;padding:0 23px 18px;overflow:auto;scrollbar-width:thin;scrollbar-color:#4c6380 transparent;background:var(--mf-bg);}
.mf-theme .main-content::-webkit-scrollbar{width:5px;height:5px;}
.mf-theme .main-content::-webkit-scrollbar-thumb{background:#4c6380;border-radius:5px;}
.mf-theme .main-content::-webkit-scrollbar-track{background:transparent;}
.mf-theme .dashboard-header{position:relative;top:auto;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:99px;padding:17px 0 15px;margin:0;border:0;border-bottom:1px solid var(--mf-soft);background:var(--mf-bg);box-shadow:none;}
.mf-page-heading{flex:1;min-width:0;}
.mf-breadcrumb{display:flex;gap:7px;align-items:center;color:var(--mf-dim);font-size:13px;margin-bottom:6px;}
.mf-breadcrumb > span:last-child{color:var(--mf-muted);}
.mf-theme .page-title{font-size:28px;font-weight:550;letter-spacing:-.035em;line-height:1.2;margin:0;color:var(--mf-text);}
.mf-theme .dashboard-header .page-title::before{display:none;}
.mf-page-description{font-size:14px;color:var(--mf-muted);margin-top:5px;}
.mf-theme .header-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-shrink:0;}
.mf-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;padding:7px 10px;white-space:nowrap;font-size:14px;line-height:1.3;color:var(--mf-muted);border:1px solid var(--mf-line);border-radius:5px;background:var(--mf-card);font-weight:500;}
.mf-button:hover{background:var(--mf-raised);color:#fff;}
.mf-button-primary{color:#fff;background:var(--mf-accent);border-color:var(--mf-accent-line);}
.mf-button-primary:hover{color:#fff;background:var(--mf-accent-hover);}
.mf-theme .mobile-toggle-btn,
.mf-theme .menu-close-btn{background:var(--mf-card);color:var(--mf-muted);border:1px solid var(--mf-line);border-radius:6px;box-shadow:none;}
.mf-view-tabs{display:flex;align-items:center;gap:6px;padding:13px 0 14px;overflow:auto;scrollbar-width:none;}
.mf-view-tabs a{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:4px 9px;border:1px solid transparent;border-radius:5px;font-size:14px;color:var(--mf-muted);}
.mf-view-tabs a.is-active{color:var(--mf-text);background:var(--mf-raised);border-color:var(--mf-line);}
.mf-view-tabs a:hover{background:var(--mf-raised);color:var(--mf-text);}
.mf-view-tabs a > span{font-size:13px;color:var(--mf-muted);background:var(--mf-raised);padding:0 4px;border-radius:3px;}
/* Four compact account cards. */
.mf-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px;}
.mf-metric{display:flex;flex-direction:column;gap:4px;min-width:0;padding:13px 15px 12px;border:1px solid var(--mf-soft);border-radius:7px;background:var(--mf-card);transition:border-color .15s;}
.mf-metric:hover{border-color:var(--mf-accent-line);}
.mf-metric-label{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--mf-muted);}
.mf-metric-label svg{width:13px;height:13px;}
.mf-metric strong{font-size:32px;font-weight:500;line-height:1.35;letter-spacing:-.05em;color:var(--mf-text);white-space:nowrap;}
.mf-metric strong small{font-size:15px;font-weight:400;color:var(--mf-muted);letter-spacing:0;margin-left:5px;}
.mf-metric-caption{display:flex;align-items:center;gap:5px;flex-wrap:wrap;color:var(--mf-muted);font-size:13px;line-height:1.4;margin-top:1px;}
.mf-mini-tag{font-size:12px;color:var(--mf-accent-text);background:var(--mf-accent-soft);border:1px solid var(--mf-line);border-radius:3px;padding:1px 4px;}
.mf-positive{color:var(--mf-green) !important;}
.mf-dot{display:inline-block;vertical-align:middle;flex-shrink:0;width:5px;height:5px;border-radius:50%;background:#4ce0a2;}
.mf-dot-muted{background:var(--mf-dim);}
.mf-overview-layout{display:grid;grid-template-columns:minmax(0,1fr) 267px;gap:14px;align-items:start;}
.mf-primary-column,
.mf-secondary-column{display:flex;flex-direction:column;gap:14px;min-width:0;}
.mf-panel{padding:15px;background:var(--mf-card);border:1px solid var(--mf-soft);border-radius:7px;min-width:0;margin:0;}
.mf-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 13px;min-height:17px;}
.mf-panel-heading h3{margin:0;font-size:15px;font-weight:500;color:var(--mf-text);letter-spacing:-.01em;}
.mf-subtle-link{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--mf-muted);white-space:nowrap;}
.mf-subtle-link svg{width:12px;height:12px;}
.mf-subtle-link:hover{color:var(--mf-accent-text) !important;}
.mf-capacity-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:3px 0 12px;}
.mf-capacity-summary > div{display:flex;align-items:baseline;gap:7px;}
.mf-capacity-summary strong{font-size:34px;line-height:1;font-weight:500;letter-spacing:-.04em;}
.mf-capacity-summary span{font-size:14px;color:var(--mf-muted);}
.mf-capacity-summary p{font-size:14px;color:var(--mf-muted);}
.mf-capacity-summary p > span{padding:0 5px;color:var(--mf-dim);}
.mf-capacity-bars{height:45px;display:flex;align-items:stretch;gap:5px;overflow:hidden;margin-top:10px;}
.mf-capacity-bars > span{flex:1;min-width:0;background:var(--mf-raised);border-radius:2px;border:1px solid var(--mf-line);}
.mf-capacity-bars > span.is-used{background:#25bb7c;border-color:#46e4a3;}
.mf-chart-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:9px;color:var(--mf-muted);font-size:12px;}
.mf-chart-caption > span:first-child{display:flex;align-items:center;gap:5px;}
.mf-chart-caption .mf-dot-muted{margin-left:7px;}
/* Loyalty controls keep the original selectors and IDs for script.js. */
.mf-theme .loyalty-panel{position:relative;overflow:visible;background:var(--mf-card);}
.mf-theme .loyalty-panel::before,
.mf-theme .loyalty-panel::after{display:none;}
.mf-theme .tier-display-card{background:var(--mf-input) !important;border:1px solid var(--mf-soft);border-radius:5px;box-shadow:none !important;padding:12px;margin-bottom:12px;}
.mf-theme .tier-flex-container{gap:13px;}
.mf-theme .loyalty-panel .tier-flex-container{display:flex;align-items:center;gap:12px;}
.mf-theme .badge-container{width:42px;min-width:42px;display:grid;place-items:center;filter:none;}
.mf-theme .badge-container svg{width:42px;height:42px;filter:none;}
.mf-theme .xp-info-container{flex:1;min-width:0;}
.mf-theme .xp-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.mf-theme .xp-tier-name{font-size:14px;font-weight:500;color:var(--mf-text);}
.mf-theme .xp-values{font-size:13px;color:var(--mf-muted);}
.mf-theme .xp-current-bold{color:var(--mf-accent-text);font-weight:500;}
.mf-theme .progress-track{height:5px;border-radius:3px;background:var(--mf-accent-soft);border:0;box-shadow:none !important;overflow:hidden;}
.mf-theme .progress-fill-dynamic{height:100%;background:var(--mf-accent) !important;border-radius:3px;box-shadow:none;}
.mf-xp-caption{font-size:13px;color:var(--mf-muted);margin-top:7px;}
.mf-theme .loyalty-selector{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:0 0 12px;}
.mf-theme .rank-card-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:67px;padding:8px 3px;margin:0;background:var(--mf-input) !important;border:1px solid var(--mf-line) !important;border-radius:5px;box-shadow:none !important;transform:none !important;cursor:pointer;}
.mf-theme .rank-card-item:hover{background:var(--mf-raised) !important;border-color:var(--mf-accent-line) !important;}
.mf-theme .rank-card-item.active-rank{background:var(--mf-accent-soft) !important;border-color:var(--mf-accent-line) !important;box-shadow:none !important;}
.mf-theme .rank-card-item > svg{width:23px;height:23px;filter:none;}
.mf-theme .rank-info-text{text-align:center;}
.mf-theme .rank-card-label{display:block;font-size:13px;font-weight:500;color:var(--mf-text);margin:0;line-height:1.2;}
.mf-theme .rank-exp-range{display:block;font-size:12px;font-weight:400;color:var(--mf-muted);margin-top:3px;white-space:nowrap;}
.mf-theme .tier-details-bar{padding:10px 0 0;border:0;border-top:1px solid var(--mf-line);border-radius:0;background:transparent !important;box-shadow:none !important;}
.mf-theme .details-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.mf-theme .det-item{display:flex;flex-direction:column;gap:4px;text-align:left;}
.mf-theme .det-label{font-size:12px;color:var(--mf-muted);letter-spacing:0;text-transform:none;}
.mf-theme .det-item b{font-size:14px;font-weight:500;color:var(--mf-text);}
.mf-tag{display:inline-flex;align-items:center;gap:4px;font-size:12px;line-height:1.4;font-weight:400;padding:2px 5px;border-radius:3px;border:1px solid var(--mf-line);color:var(--mf-text);background:var(--mf-accent-soft);white-space:nowrap;}
.mf-tag-purple{background:var(--mf-accent-soft);color:var(--mf-accent-text);border-color:var(--mf-line);}
.mf-tag-green{background:rgba(76,224,162,.12);color:#4ce0a2;border-color:rgba(76,224,162,.38);}
.mf-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;min-height:16px;border:1px solid var(--mf-line);background:var(--mf-accent-soft);border-radius:3px;color:var(--mf-accent-text);font-size:13px;}
.mf-activity-list{margin-top:-4px;}
.mf-activity-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto 76px;align-items:center;gap:10px;min-height:51px;padding:9px 0;border-top:1px solid var(--mf-line);}
.mf-activity-row:first-child{border-top:0;}
.mf-activity-row:hover .mf-activity-description b{color:var(--mf-accent-text);}
.mf-activity-icon{display:grid;place-items:center;color:var(--mf-muted);}
.mf-activity-icon svg{width:15px;height:15px;}
.mf-activity-description{display:flex;flex-direction:column;gap:3px;min-width:0;}
.mf-activity-description b{font-size:14px;font-weight:450;color:var(--mf-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mf-activity-description small{font-size:12px;color:var(--mf-muted);}
.mf-activity-amount{text-align:right;font-size:14px;color:var(--mf-text);font-variant-numeric:tabular-nums;}
.mf-activity-amount small{display:block;font-size:12px;color:var(--mf-muted);margin-top:2px;}
.mf-icon-link{display:inline-flex;color:var(--mf-muted);}
.mf-icon-link svg{width:13px;height:13px;}
.mf-definition-list{display:flex;flex-direction:column;gap:0;}
.mf-definition-list > div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--mf-soft);}
.mf-definition-list > div:first-child{padding-top:0;}
.mf-definition-list > div:last-child{border-bottom:0;padding-bottom:0;}
.mf-definition-list dt{font-size:13px;color:var(--mf-muted);}
.mf-definition-list dd{font-size:14px;color:var(--mf-text);text-align:right;max-width:65%;overflow-wrap:anywhere;}
.mf-service-row{display:flex;align-items:center;gap:9px;padding:11px 0;border-bottom:1px solid var(--mf-line);}
.mf-service-row:first-child{padding-top:0;}
.mf-service-row:last-child{border-bottom:0;}
.mf-service-icon{display:grid;place-items:center;width:25px;height:25px;border:1px solid var(--mf-line);border-radius:5px;background:var(--mf-accent-soft);color:var(--mf-accent-text);}
.mf-service-icon svg{width:14px;height:14px;}
.mf-service-row > span:nth-child(2){min-width:0;flex:1;}
.mf-service-row b{display:block;font-size:14px;font-weight:450;color:var(--mf-text);overflow-wrap:anywhere;}
.mf-service-row small{display:block;font-size:12px;color:var(--mf-muted);margin-top:3px;}
.mf-panel-footer-link{display:flex;align-items:center;justify-content:space-between;gap:9px;color:var(--mf-muted);font-size:13px;border-top:1px solid var(--mf-line);padding-top:10px;margin-top:7px;}
.mf-panel-footer-link svg{width:12px;height:12px;}
.mf-quick-links{display:flex;flex-direction:column;}
.mf-quick-links > a{display:flex;align-items:center;gap:9px;color:var(--mf-text);font-size:14px;padding:10px 0;border-top:1px solid var(--mf-line);}
.mf-quick-links > a:first-child{padding-top:0;border-top:0;}
.mf-quick-links > a:last-child{padding-bottom:0;}
.mf-quick-links > a > span{flex:1;}
.mf-quick-links svg{width:13px;height:13px;color:var(--mf-accent-text);}
.mf-quick-links svg:last-child{width:11px;height:11px;}
.mf-helper-note{display:flex;align-items:flex-start;gap:9px;padding:2px 6px;color:var(--mf-muted);}
.mf-helper-note > svg{width:14px;height:14px;color:var(--mf-accent-text);margin-top:2px;}
.mf-helper-note p{font-size:13px;line-height:1.7;}
.mf-helper-note b{color:var(--mf-text);font-weight:500;}
.mf-workspace-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:19px 0 0;font-size:13px;color:var(--mf-muted);}
.mf-workspace-footer a{display:flex;align-items:center;gap:7px;}
.mf-workspace-footer svg{width:11px;height:11px;}
.mf-footer-dot{padding:0 5px;color:var(--mf-dim);}
.mf-empty-state{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:32px 15px;color:var(--mf-muted);font-size:14px;}
.mf-empty-state > svg{width:22px;height:22px;color:var(--mf-accent-text);}
.mf-empty-state b{font-weight:500;color:var(--mf-text);}
.mf-empty-small{padding:10px 0;}
/* Existing forms, tables, support, settings and package pages. */
.mf-theme :is(.neu-panel-card,.login-card,.update-note-card,.cloud-modal-card,.settings-card,.signal-online-card,.admin-ticket-inbox,.ticket-chat-window,.pay-modal-box){background:var(--mf-card) !important;color:var(--mf-text);border:1px solid var(--mf-line);border-radius:7px;box-shadow:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
.mf-theme .neu-panel-card{padding:18px;margin-bottom:14px;}
.mf-theme .neu-panel-card:hover{border-color:var(--mf-accent-line);}
.mf-theme :is(.neu-icon,.summary-box,.price-display,.tier-footer-summary){background:var(--mf-raised) !important;border:1px solid var(--mf-line);color:var(--mf-accent-text);border-radius:6px;box-shadow:none !important;}
.mf-theme .neu-icon{width:38px;height:38px;}
.mf-theme :is(.neu-btn,.btn,.show-more-card,.cloud-cancel-button){border:1px solid var(--mf-line);background:var(--mf-raised);color:var(--mf-text);border-radius:5px;box-shadow:none !important;padding:10px 13px;font-size:14px;font-weight:500;min-height:34px;transform:none !important;}
.mf-theme :is(.neu-btn,.btn,.show-more-card):hover{background:var(--mf-raised);color:#fff;border-color:var(--mf-accent-line);transform:none !important;}
.mf-theme :is(.btn-primary,button[type="submit"].neu-btn,.pkg-card .neu-btn,.login-card form .neu-btn){background:var(--mf-accent) !important;border-color:var(--mf-accent-line) !important;color:white !important;font-weight:500;box-shadow:none !important;}
.mf-theme :is(.btn-primary,button[type="submit"].neu-btn,.pkg-card .neu-btn,.login-card form .neu-btn):hover{background:var(--mf-accent-hover) !important;}
.mf-theme :is(button:disabled,.btn-disabled){opacity:.5;cursor:not-allowed;}
.mf-theme :is(.neu-input,.form-control,select,textarea){background:var(--mf-input) !important;color:var(--mf-text);border:1px solid var(--mf-line) !important;border-radius:5px;box-shadow:none !important;font-size:15px;min-height:39px;}
.mf-theme :is(.neu-input,.form-control,select,textarea):focus{border-color:var(--mf-accent-line) !important;box-shadow:0 0 0 2px var(--mf-focus) !important;transform:none !important;}
.mf-theme input::placeholder,
.mf-theme textarea::placeholder{color:var(--mf-muted);}
.mf-theme select option{background:var(--mf-input);color:var(--mf-text);}
.mf-theme :is(.text-primary,.stat-value-blue){color:var(--mf-accent-text) !important;}
.mf-theme :is(.text-success,.stat-value-green){color:var(--mf-green) !important;}
.mf-theme :is(.text-danger,.alert-danger){color:var(--mf-red) !important;}
.mf-theme .shadow-inset{box-shadow:none !important;}
.mf-theme .grid-3{gap:14px;}
.mf-theme .pkg-grid{gap:14px;}
.mf-theme :is(.modal-overlay,.cloud-modal-overlay,.pay-modal){background:rgba(2,7,14,.78);backdrop-filter:none;-webkit-backdrop-filter:none;}
.mf-theme :is(.cloud-modal-card,.pay-modal-box,.modal-content,.extend-modal-card){background:var(--mf-card) !important;border:1px solid var(--mf-accent-line);color:var(--mf-text);border-radius:9px;box-shadow:0 24px 80px #0008;}
.mf-theme .neu-table{border-collapse:collapse !important;border-spacing:0 !important;font-size:14px;}
.mf-theme .neu-table thead th{background:var(--mf-input) !important;border-color:var(--mf-line) !important;color:var(--mf-muted);font-size:13px;font-weight:500;text-transform:none;letter-spacing:0;padding:11px 12px !important;}
.mf-theme .neu-table tbody tr{box-shadow:none !important;}
.mf-theme .neu-table tbody tr td{background:transparent !important;color:var(--mf-text);border-bottom:1px solid var(--mf-line);border-radius:0 !important;padding:12px !important;}
.mf-theme .neu-table tbody tr:hover td{background:var(--mf-accent-soft) !important;}
.mf-theme .table-responsive{border-radius:6px;}
.mf-theme .ticket-msg-bubble{background:var(--mf-raised) !important;border:1px solid var(--mf-line);box-shadow:none;color:var(--mf-text);}
.mf-theme .ticket-msg.mine .ticket-msg-bubble{background:var(--mf-accent-soft) !important;border-color:var(--mf-accent-line);}
.mf-theme :is(.ticket-type-tab.active,.pay-amount.is-selected){background:var(--mf-accent-soft) !important;border-color:var(--mf-accent-line) !important;color:var(--mf-accent-text);}
.mf-theme .signal-online-table :is(th,td){border-color:var(--mf-line);background:transparent;color:var(--mf-text);}
.mf-theme :is(.twofa-qr,.twofa-qr img){background:#fff !important;} /* Keep actual QR contrast. */
/* Normalize inherited hard-coded blue-gray inline text, not status colors. */
.mf-theme :is(span,p,small,div,label)[style*="#94a3b8"],
.mf-theme :is(span,p,small,div,label)[style*="#b3c0d3"]{color:var(--mf-muted) !important;}
/* Auth views retain the real form, csrf inputs and action URLs. */
.mf-theme .auth-container{position:relative;min-height:100vh;min-height:100dvh;height:100%;display:flex;justify-content:center;align-items:center;padding:80px 22px 30px;background:transparent !important;overflow:auto;}
.mf-auth-brand{position:absolute;top:28px;left:35px;display:flex;align-items:center;gap:9px;color:#f5f8ff !important;}
.mf-auth-brand > svg{width:28px;height:28px;border-radius:6px;padding:5px;background:var(--mf-accent);color:#fff;}
.mf-auth-brand b{font-size:15px;font-weight:650;letter-spacing:.02em;}
.mf-auth-brand > span{padding-left:12px;margin-left:4px;border-left:1px solid #30435d;color:#c1cfe2;font-size:14px;}
.mf-theme .login-card{width:100%;max-width:390px;padding:30px;background:var(--mf-bg) !important;border:1px solid var(--mf-line);border-radius:10px;box-shadow:0 14px 45px rgba(0,0,0,.22) !important;}
.mf-theme .login-card::before,
.mf-theme .login-card::after{display:none;}
.mf-theme .login-card h2{font-size:23px;font-weight:500;letter-spacing:-.04em;color:var(--mf-text);}
.mf-theme .login-card p{font-size:14px;}
.mf-theme .login-card > .text-center{margin-bottom:23px !important;}
.mf-theme .login-card > .text-center > .neu-icon{margin-bottom:18px !important;width:39px;height:39px;border-radius:8px;background:var(--mf-accent-soft) !important;color:var(--mf-accent-text);border-color:var(--mf-accent-line);}
.mf-theme .login-card > .text-center > .neu-icon svg{width:22px;height:22px;}
.mf-theme .login-card .neu-input{height:42px;padding:11px 13px;font-size:15px;}
.mf-theme .login-card .form-group{margin-top:14px !important;}
.mf-theme .login-card .form-group:first-of-type{margin-top:0 !important;}
.mf-theme .login-card form .neu-btn{height:40px;margin-top:22px !important;border-radius:5px;}
.mf-theme .login-card > .text-center a{font-size:14px !important;}
.mf-theme.mf-payment-page{height:auto !important;overflow:auto !important;min-height:100vh;display:grid;place-items:center;}
.mf-theme.mf-payment-page .box{background:var(--mf-bg);color:var(--mf-text);border:1px solid var(--mf-line);border-radius:10px;box-shadow:none;}
.mf-theme.mf-payment-page .muted{color:var(--mf-muted);}
/* Desktop to drawer breakpoint matches the existing menu script. */
@media (min-width:1600px){.mf-theme .dashboard-container{max-width:none;margin:0;}.mf-overview-layout{grid-template-columns:minmax(0,1fr) 310px;}.mf-theme .main-content{padding-left:28px;padding-right:28px;}}
@media (min-width:993px) and (max-width:1150px){.mf-theme .dashboard-container{margin:0;width:100%;height:100dvh;}.mf-theme .sidebar{width:224px;flex-basis:224px;}.mf-theme .main-content{padding:0 17px 15px;}.mf-overview-layout{grid-template-columns:minmax(0,1fr) 220px;gap:10px;}.mf-metrics{gap:7px;}.mf-metric{padding:11px 10px;}.mf-metric strong{font-size:28px;}.mf-metric-label{font-size:13px;}.mf-metric-caption{font-size:12px;}.mf-capacity-bars{gap:3px;}}
@media (max-width:992px){
  body.mf-theme{background:var(--mf-bg);}
  .mf-theme .dashboard-container{margin:0;width:100%;height:100vh;height:100dvh;border:0;border-radius:0;box-shadow:none;}
  .mf-theme .main-content{padding:0 18px 18px;height:100vh;height:100dvh;width:100%;overflow-x:hidden;}
  .mf-theme .sidebar{position:fixed;inset:0 auto 0 0;width:263px;flex-basis:auto;height:100vh;height:100dvh;padding:20px 13px 14px;z-index:1300;transform:translateX(-100%);visibility:hidden;transition:transform .2s,visibility .2s;border-right:1px solid var(--mf-line);background:var(--mf-sidebar) !important;}
  .mf-theme .sidebar.active{transform:translateX(0);visibility:visible;}
  .mf-theme .sidebar .brand{margin-bottom:26px;padding-right:30px;}
  .mf-theme .sidebar .nav-item{min-height:43px;font-size:15px;}
  .mf-theme .sidebar .nav-item svg{width:17px;height:17px;flex-basis:17px;}
  .mf-theme .sidebar nav{overflow-y:auto !important;}
  .mf-theme .mobile-sidebar-overlay.active{display:block;position:fixed;inset:0;background:#0009;z-index:1200;backdrop-filter:none;}
  .mf-theme .dashboard-header{position:sticky;top:0;z-index:100;width:calc(100% + 36px);margin:0 -18px;padding:14px 18px;min-height:89px;background:var(--mf-bg) !important;border-bottom:1px solid var(--mf-line);}
  .mf-theme .dashboard-header .mobile-toggle-btn{display:flex;position:static;width:33px;height:33px;flex:0 0 33px;padding:7px;align-items:center;justify-content:center;}
  .mf-theme .menu-close-btn{display:flex;position:absolute;top:18px;right:12px;width:30px;height:30px;align-items:center;justify-content:center;}
  .mf-theme .page-title{font-size:26px;}
  .mf-page-description{font-size:14px;}
  .mf-breadcrumb{font-size:12px;}
  .mf-overview-layout{grid-template-columns:minmax(0,1fr) 240px;gap:12px;}
  .mf-theme .loyalty-selector{grid-template-columns:repeat(3,minmax(0,1fr));}
  .mf-theme .loyalty-panel .tier-flex-container{flex-direction:row;}
  .mf-theme .loyalty-panel .xp-info-container{width:auto;}
  .mf-theme .details-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .mf-theme .details-grid > *{grid-column:auto;}
  .mf-theme .auth-container{background:#0b111b !important;}
}
@media (max-width:700px){
  .mf-overview-layout{grid-template-columns:1fr;}
  .mf-secondary-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
  .mf-theme .loyalty-selector{grid-template-columns:repeat(6,minmax(0,1fr));}
  .mf-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .mf-account-link{max-width:100%;}
  .mf-metric{padding:12px;}
  .mf-metric strong{font-size:32px;}
  .mf-metric-label{font-size:14px;}
  .mf-metric-caption{font-size:13px;}
  .mf-theme .neu-panel-card{padding:16px;}
  .mf-theme .neu-table tbody tr{background:var(--mf-card) !important;border:1px solid var(--mf-line) !important;border-radius:6px;}
  .mf-theme .neu-table tbody tr td{border-bottom:0;}
}
@media (max-width:460px){
  .mf-theme .main-content{padding:0 12px 16px;}
  .mf-theme .dashboard-header{width:calc(100% + 24px);margin:0 -12px;padding:12px;gap:9px;min-height:82px;}
  .mf-theme .page-title{font-size:24px;}
  .mf-breadcrumb{font-size:12px;gap:5px;margin-bottom:5px;}
  .mf-page-description{display:none;}
  .mf-theme .header-actions{gap:0;}
  .mf-button{padding:7px 9px;font-size:14px;min-height:32px;}
  .mf-button svg{width:13px;height:13px;}
  .mf-view-tabs{gap:2px;padding:12px 0;}
  .mf-view-tabs a{padding:5px 7px;font-size:14px;}
  .mf-metric{padding:12px 11px;}
  .mf-metric strong{font-size:30px;}
  .mf-metric strong small{font-size:14px;}
  .mf-metric-caption{font-size:12px;}
  .mf-panel{padding:13px;}
  .mf-panel-heading h3{font-size:15px;}
  .mf-capacity-summary p{font-size:13px;}
  .mf-capacity-summary span{font-size:13px;}
  .mf-capacity-bars{gap:3px;height:39px;}
  .mf-chart-caption{font-size:12px;gap:5px;}
  .mf-chart-caption > span:last-child{text-align:right;max-width:46%;}
  .mf-theme .loyalty-selector{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
  .mf-theme .rank-card-item{display:flex;flex-direction:row;gap:8px;min-height:48px;padding:8px 5px;}
  .mf-theme .rank-info-text{text-align:left;}
  .mf-theme .rank-card-label{font-size:13px;}
  .mf-theme .rank-exp-range{font-size:12px;}
  .mf-theme .tier-display-card{padding:10px;}
  .mf-theme .loyalty-panel .tier-flex-container{gap:10px;}
  .mf-theme .xp-header{gap:6px;}
  .mf-theme .xp-tier-name{font-size:14px;}
  .mf-theme .xp-values{font-size:12px;}
  .mf-xp-caption{font-size:12px;}
  .mf-theme .details-grid{gap:8px;}
  .mf-theme .det-item b{font-size:13px;}
  .mf-theme .det-label{font-size:12px;}
  .mf-activity-row{grid-template-columns:18px minmax(0,1fr) auto;gap:8px;min-height:54px;}
  .mf-activity-row > .mf-tag{display:none;}
  .mf-activity-description b{font-size:14px;}
  .mf-activity-amount{font-size:14px;}
  .mf-secondary-column{display:flex;}
  .mf-definition-list dt,
.mf-definition-list dd{font-size:14px;}
  .mf-quick-links > a,
.mf-service-row b{font-size:14px;}
  .mf-service-row small,
.mf-panel-footer-link{font-size:13px;}
  .mf-workspace-footer{flex-direction:column;align-items:flex-start;gap:8px;font-size:13px;}
  .mf-theme .auth-container{padding:82px 18px 25px;align-items:safe center;}
  .mf-auth-brand{left:20px;top:24px;}
  .mf-theme .login-card{padding:25px;}
}

@media print{body.mf-theme{background:white;color:black;height:auto;overflow:visible;}.mf-theme .dashboard-container,
.mf-theme .main-content{display:block;height:auto;width:100%;overflow:visible;margin:0;padding:0;border:0;}.mf-theme .sidebar,
.mf-theme .header-actions,
.mf-view-tabs{display:none !important;}.mf-theme .mf-panel,
.mf-theme .mf-metric{background:white !important;color:black;border:1px solid #ccc;break-inside:avoid;}.mf-theme .mf-panel *,
.mf-theme .mf-metric *{color:black !important;}}
/* Final scoped reset of legacy spacing (the old base uses !important). */
.mf-theme .mf-dashboard .loyalty-panel{padding:15px;margin:0;}
.mf-theme .mf-dashboard .loyalty-selector{width:100%;padding:0 !important;margin:0 0 11px !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important;}
.mf-theme .mf-dashboard .loyalty-selector .rank-card-item{min-width:0;min-height:65px;padding:8px 3px;margin:0;border-radius:5px;}
.mf-theme .mf-dashboard .det-label{margin-bottom:0;}
.mf-theme .mf-dashboard .tier-details-bar{padding-top:10px;}
.mf-theme .mf-page-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 0;}
.mf-theme .mf-page-toolbar p{font-size:14px;color:var(--mf-muted);}
.mf-theme .sidebar .brand .neu-icon{width:27px !important;height:27px !important;border-radius:6px;background:var(--mf-accent) !important;color:white !important;box-shadow:none !important;}
.mf-theme .mf-fallback-toggle{position:relative;inset:auto;margin:10px 0;}
.mf-theme .grid-4{gap:14px;}
.mf-theme .pkg-card h3{font-size:18px;font-weight:550;}
.mf-theme .pkg-price{font-size:30px;font-weight:550;color:var(--mf-text);}
.mf-theme .pkg-duration{font-size:14px;color:var(--mf-muted);}
@media (max-width:992px){
  .mf-theme .dashboard-header{min-height:84px !important;padding:14px 18px !important;gap:12px !important;}
  .mf-theme .dashboard-header .mobile-toggle-btn{width:33px !important;height:33px !important;min-width:33px !important;min-height:33px !important;flex-basis:33px !important;}
  .mf-theme .mf-dashboard .loyalty-selector{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (min-width:461px) and (max-width:700px){.mf-theme .mf-dashboard .loyalty-selector{grid-template-columns:repeat(6,minmax(0,1fr)) !important;}}
@media (max-width:460px){
  .mf-theme .dashboard-header{min-height:78px !important;padding:12px !important;gap:9px !important;}
  .mf-theme .mf-dashboard .loyalty-panel{padding:13px;}
  .mf-theme .mf-dashboard .loyalty-selector .rank-card-item{min-height:49px;padding:8px 5px;}
  .mf-theme .mf-page-toolbar{align-items:flex-start;flex-direction:column;}
}

/* Readable text; compact sidebar spacing (1.4). */
body.mf-theme{font-size:16px;line-height:1.55;letter-spacing:0;}
.mf-theme .dashboard-container{max-width:none;}
.mf-theme .sidebar{padding:16px 10px 10px;}
.mf-theme .sidebar > :is(.brand,.mf-nav-search,.mf-nav-label){flex-shrink:0;}
.mf-theme .sidebar .brand{font-size:17px;gap:8px;margin:0 6px 14px;}
.mf-brand-mark{width:28px;height:28px;}
.mf-brand-caption{font-size:12px;}
.mf-nav-search{min-height:36px;padding:0 8px;margin-bottom:14px;gap:7px;}
.mf-nav-search input{font-size:14px;padding:6px 0;}
.mf-nav-search kbd{font-size:12px;}
.mf-nav-label{font-size:13px;margin-bottom:6px;color:var(--mf-muted);}
.mf-theme .sidebar .nav-item{font-size:15px;min-height:38px;padding:7px 8px;gap:8px;line-height:1.4;}
.mf-theme .sidebar .nav-item svg{width:18px;height:18px;flex-basis:18px;}
.mf-theme .sidebar .nav-item span{min-width:0;overflow-wrap:break-word;}
.mf-theme .sidebar-footer .logout-btn{font-size:14px;min-height:38px;margin-top:4px;}
.mf-sidebar-account{padding:8px 4px;}
.mf-sidebar-account b{font-size:14px;}
.mf-sidebar-account small{font-size:12px;}
.mf-small-avatar{width:32px;height:32px;}
.mf-theme .main-content{padding:0 24px 24px;}
.mf-theme .dashboard-header{min-height:116px;padding:22px 0;}
.mf-theme .page-title{font-size:28px;font-weight:600;line-height:1.25;}
.mf-breadcrumb{font-size:12px;}
.mf-page-description{font-size:14px;line-height:1.5;}
.mf-button{font-size:14px;min-height:42px;padding:10px 14px;}
.mf-view-tabs{gap:8px;padding:16px 0;}
.mf-view-tabs a{font-size:14px;padding:8px 12px;min-height:40px;}
.mf-view-tabs a > span{font-size:12px;}
.mf-metrics{gap:14px;margin-bottom:18px;}
.mf-metric{padding:18px;gap:6px;}
.mf-metric-label{font-size:14px;line-height:1.4;}
.mf-metric-label svg{width:16px;height:16px;}
.mf-metric strong{font-size:32px;line-height:1.25;letter-spacing:-.04em;white-space:normal;overflow-wrap:anywhere;}
.mf-metric strong small{display:inline-block;font-size:14px;letter-spacing:0;}
.mf-metric-caption{font-size:13px;line-height:1.5;}
.mf-mini-tag{font-size:12px;}
.mf-overview-layout{grid-template-columns:minmax(0,1fr) 296px;gap:18px;}
.mf-primary-column,
.mf-secondary-column{gap:18px;}
.mf-panel,
.mf-theme .mf-dashboard .loyalty-panel{padding:20px;}
.mf-panel-heading{margin-bottom:17px;gap:12px;flex-wrap:wrap;}
.mf-panel-heading h3{font-size:16px;font-weight:600;line-height:1.4;}
.mf-subtle-link{font-size:13px;min-height:28px;}
.mf-capacity-summary{flex-wrap:wrap;gap:8px;}
.mf-capacity-summary strong{font-size:34px;}
.mf-capacity-summary span,
.mf-capacity-summary p{font-size:13px;line-height:1.5;}
.mf-capacity-bars{height:50px;}
.mf-chart-caption{font-size:12px;line-height:1.5;flex-wrap:wrap;align-items:flex-start;}
.mf-chart-caption > span:last-child{max-width:none;text-align:left;}
.mf-theme .tier-display-card{padding:15px;}
.mf-theme .xp-header{flex-wrap:wrap;gap:8px;}
.mf-theme .xp-tier-name{font-size:15px;}
.mf-theme .xp-values,
.mf-xp-caption{font-size:13px;line-height:1.5;}
.mf-theme .progress-track{height:7px;}
.mf-theme .mf-dashboard .loyalty-selector{gap:8px;margin-bottom:16px !important;}
.mf-theme .mf-dashboard .loyalty-selector .rank-card-item{min-height:90px;padding:12px 5px;gap:8px;flex-direction:column;}
.mf-theme .rank-card-label{font-size:13px;line-height:1.4;}
.mf-theme .rank-exp-range{font-size:12px;line-height:1.4;}
.mf-theme .rank-card-item > svg{width:27px;height:27px;}
.mf-theme .rank-info-text{text-align:center;}
.mf-theme .det-label{font-size:12px;line-height:1.4;}
.mf-theme .det-item b{font-size:14px;line-height:1.5;overflow-wrap:break-word;}
.mf-theme .mf-dashboard .tier-details-bar{padding-top:16px;}
.mf-tag{font-size:12px;padding:3px 7px;}
.mf-count{font-size:12px;min-width:23px;min-height:23px;}
.mf-activity-row{grid-template-columns:24px minmax(0,1fr) auto 85px;gap:12px;min-height:74px;padding:13px 0;}
.mf-activity-description b{font-size:14px;line-height:1.5;font-weight:500;white-space:normal;overflow-wrap:anywhere;}
.mf-activity-description small,
.mf-activity-amount small{font-size:12px;line-height:1.5;}
.mf-activity-amount{font-size:15px;}
.mf-activity-icon svg,
.mf-icon-link svg{width:18px;height:18px;}
.mf-definition-list > div{padding:12px 0;}
.mf-definition-list dt{font-size:13px;}
.mf-definition-list dd{font-size:14px;}
.mf-service-row{padding:14px 0;}
.mf-service-icon{width:32px;height:32px;flex-shrink:0;}
.mf-service-row b{font-size:14px;line-height:1.5;}
.mf-service-row small{font-size:12px;line-height:1.5;}
.mf-panel-footer-link{font-size:13px;min-height:38px;}
.mf-quick-links > a{font-size:14px;line-height:1.5;min-height:44px;}
.mf-quick-links svg{width:16px;height:16px;}
.mf-helper-note p,
.mf-workspace-footer{font-size:13px;line-height:1.6;}
.mf-theme :is(.neu-input,.form-control,select,textarea){font-size:16px;min-height:44px;}
.mf-theme :is(.neu-btn,.btn,.show-more-card,.cloud-cancel-button){font-size:14px;min-height:44px;line-height:1.5;}
.mf-theme .neu-table{font-size:14px;line-height:1.6;}
.mf-theme .neu-table thead th{font-size:13px;}
.mf-theme .neu-table td small{font-size:12px;}
.mf-theme .mf-page-toolbar p{font-size:14px;}
.mf-theme .login-card form .neu-btn{height:auto;min-height:46px;}
.mf-theme .login-card :is(label,.auth-subtitle){font-size:14px !important;line-height:1.5;}
.mf-theme .login-card > .text-center a{font-size:14px !important;}
@media (min-width:993px) and (max-width:1279px){
  .mf-theme .sidebar{width:224px;flex-basis:224px;}
  .mf-theme .main-content{padding-left:20px;padding-right:20px;}
  .mf-overview-layout{grid-template-columns:minmax(0,1fr);}
  .mf-secondary-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
  .mf-helper-note{align-self:start;}
}
@media (min-width:993px) and (max-width:1150px){
  .mf-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mf-theme .dashboard-header{flex-wrap:wrap;}
  .mf-theme .header-actions{margin-left:auto;}
}
@media (max-width:992px){
  .mf-theme .dashboard-container{margin:0;width:100%;height:100dvh;}
  .mf-theme .main-content{padding:0 18px 22px;}
  .mf-theme .sidebar{width:min(280px,calc(100vw - 32px));padding:16px 12px 10px;}
  .mf-theme .sidebar .brand{padding-right:42px;}
  .mf-theme .sidebar .nav-item{min-height:44px;padding:10px 8px;}
  .mf-theme .sidebar-footer .logout-btn{min-height:44px;}
  .mf-theme .sidebar .mf-nav-search{min-height:40px;}
  .mf-theme .sidebar .mf-nav-search input{padding:8px 0;}
  .mf-theme .dashboard-header{width:calc(100% + 36px);margin:0 -18px;min-height:96px !important;}
  .mf-theme .dashboard-header .mobile-toggle-btn{width:42px !important;height:42px !important;min-width:42px !important;min-height:42px !important;flex-basis:42px !important;}
  .mf-theme .menu-close-btn{width:38px;height:38px;top:18px;right:12px;}
  .mf-theme .page-title{font-size:25px;}
  .mf-overview-layout{grid-template-columns:1fr;}
  .mf-secondary-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
  .mf-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mf-theme .mf-dashboard .loyalty-selector{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (max-width:600px){
  .mf-theme .main-content{padding:0 14px 20px;}
  .mf-theme .dashboard-header{width:calc(100% + 28px);margin:0 -14px;padding:14px !important;gap:10px !important;}
  .mf-theme .page-title{font-size:24px;}
  .mf-breadcrumb{font-size:12px;line-height:1.4;flex-wrap:wrap;gap:3px 6px;}
  .mf-page-description{display:none;}
  .mf-button{font-size:13px;min-height:42px;padding:10px;}
  .mf-button svg{width:16px;height:16px;}
  .mf-view-tabs{flex-wrap:wrap;gap:6px;padding:14px 0;}
  .mf-view-tabs a{font-size:13px;padding:8px 10px;}
  .mf-metrics{gap:10px;}
  .mf-metric{padding:14px 12px;}
  .mf-metric-label{font-size:13px;gap:5px;}
  .mf-metric strong{font-size:30px;}
  .mf-metric strong small{font-size:13px;}
  .mf-metric-caption{font-size:12px;}
  .mf-panel,
.mf-theme .mf-dashboard .loyalty-panel{padding:16px;}
  .mf-panel-heading h3{font-size:16px;}
  .mf-theme .tier-display-card{padding:12px;}
  .mf-theme .loyalty-panel .tier-flex-container{gap:10px;}
  .mf-theme .badge-container,
.mf-theme .badge-container svg{width:34px;min-width:34px;height:34px;}
  .mf-theme .xp-values,
.mf-xp-caption{font-size:12px;}
  .mf-theme .mf-dashboard .loyalty-selector .rank-card-item{min-height:84px;padding:10px 4px;}
  .mf-theme .details-grid{grid-template-columns:1fr;gap:10px;}
  .mf-theme .det-item{flex-direction:row;justify-content:space-between;align-items:baseline;gap:12px;}
  .mf-theme .det-item b{text-align:right;}
  .mf-theme .det-label{font-size:13px;}
  .mf-activity-row{grid-template-columns:20px minmax(0,1fr) auto;gap:10px;}
  .mf-activity-row > .mf-tag{display:none;}
  .mf-secondary-column{display:flex;}
  .mf-workspace-footer{flex-direction:column;align-items:flex-start;gap:8px;}
}
@media (max-width:360px){
  .mf-theme .page-title{font-size:22px;}
  .mf-theme .dashboard-header{gap:8px !important;}
  .mf-metrics{grid-template-columns:1fr;}
  .mf-button{padding:9px 8px;}
  .mf-activity-row{grid-template-columns:minmax(0,1fr) auto;}
  .mf-activity-icon{display:none;}
}
@media print{
  .mf-theme .dashboard-container,
.mf-theme .main-content{margin:0;padding:0;width:100%;height:auto;overflow:visible;}
}

/* Remaining legacy inline / !important text rules. */
.mf-theme .login-card p{font-size:14px !important;line-height:1.6;}
.mf-theme .active-services-table .service-renew-label{font-size:13px !important;line-height:1.5;white-space:normal;font-weight:500;}
.mf-theme .active-services-table .service-action-cell .neu-btn{font-size:13px !important;min-height:44px;padding:10px 12px !important;line-height:1.4;white-space:normal;}
.mf-theme .active-services-table .service-renew-cell{flex-wrap:wrap;}
.mf-theme :is(span,p,small,div,label)[style*="#94a3b8"],
.mf-theme :is(span,p,small,div,label)[style*="#b3c0d3"]{color:var(--mf-muted) !important;}
@media (max-width:600px){
  .mf-theme .mf-dashboard .tier-details-bar .details-grid{grid-template-columns:1fr !important;gap:12px !important;}
  .mf-theme .mf-dashboard .tier-details-bar .details-grid .det-item{grid-column:auto !important;text-align:left !important;}
  .mf-theme .active-services-table .service-main-cell{grid-column:1 / -1 !important;grid-row:1 !important;}
  .mf-theme .active-services-table .service-expiry-cell{grid-column:1 / -1 !important;grid-row:2 !important;}
  .mf-theme .active-services-table .service-expiry-cell > div{flex-direction:row !important;align-items:baseline !important;justify-content:space-between;gap:8px;flex-wrap:wrap;}
  .mf-theme .active-services-table .service-expiry-cell span{font-size:14px !important;line-height:1.5;}
  .mf-theme .active-services-table .service-expiry-cell small{font-size:13px !important;line-height:1.5;}
  .mf-theme .active-services-table .service-renew-cell{grid-column:1 !important;grid-row:3 !important;}
  .mf-theme .active-services-table .service-action-cell{grid-column:2 !important;grid-row:3 !important;}
}

/* 1.2 — Edge-to-edge viewport. Keep inner padding, never an outer gray frame. */
html{margin:0;min-height:100%;background:var(--mf-bg);}
body.mf-theme{margin:0;background:var(--mf-bg);}
.mf-theme .dashboard-container{
  width:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;
  height:100vh;height:100dvh;box-shadow:none;
}
.mf-theme .main-content{background:var(--mf-bg);}
.mf-theme .sidebar{border-right:1px solid var(--mf-line);}
.mf-theme .sidebar .brand{color:var(--mf-text);font-weight:750;}
.mf-theme .sidebar .nav-item{color:var(--mf-muted);font-weight:500;}
.mf-theme .sidebar .nav-item svg{opacity:1;}
.mf-theme .sidebar .nav-item:hover{background:var(--mf-raised);}
.mf-theme .sidebar .nav-item.active{
  background:var(--mf-accent-soft);color:var(--mf-accent-text);border-color:var(--mf-accent-line);
  box-shadow:inset 3px 0 0 var(--mf-accent) !important;font-weight:650;
}
.mf-theme .sidebar .nav-item.active svg{color:var(--mf-accent-text);}
.mf-theme .sidebar-footer .logout-btn{color:var(--mf-muted) !important;}
.mf-theme .sidebar-footer .logout-btn:hover{color:var(--mf-red) !important;}
.mf-brand-mark,
.mf-theme .sidebar .brand .neu-icon,
.mf-auth-brand > svg{
  background:var(--mf-accent) !important;color:var(--mf-accent-ink) !important;
}
.mf-theme .mf-button-primary,
.mf-theme .mf-button-primary:hover,
.mf-theme :is(.btn-primary,button[type="submit"].neu-btn,.pkg-card .neu-btn,.login-card form .neu-btn){
  color:var(--mf-accent-ink) !important;border-color:var(--mf-accent) !important;font-weight:650;
}
.mf-theme .mf-button-primary{background:var(--mf-accent);}
.mf-theme .mf-button-primary:hover{background:var(--mf-accent-hover);}
.mf-skip-link{color:var(--mf-accent-ink);}
.mf-theme .page-title{color:#f7faff;font-weight:700;}
.mf-page-description{color:var(--mf-muted);}
.mf-view-tabs a.is-active{
  color:var(--mf-accent-text);background:var(--mf-accent-soft);border-color:var(--mf-accent-line);font-weight:600;
}
.mf-metric{position:relative;border:1px solid var(--mf-line);border-top:2px solid var(--mf-accent-line);background:var(--mf-card);border-radius:9px;}
.mf-metric:first-child{background:linear-gradient(130deg,var(--mf-accent-soft),transparent 85%),var(--mf-card);}
.mf-metric-label{color:var(--mf-muted);font-weight:500;}
.mf-metric-label svg{color:var(--mf-accent-text);}
.mf-metric strong{font-weight:650;color:var(--mf-text);}
.mf-metric:first-child strong{color:var(--mf-accent-text);}
.mf-metric strong small{font-weight:400;color:var(--mf-muted);}
.mf-panel,
.mf-theme .mf-dashboard .loyalty-panel{border:1px solid var(--mf-line);border-radius:9px;background:var(--mf-card);}
.mf-panel-heading h3{color:var(--mf-text);}
.mf-capacity-bars > span{background:#203047;border-color:#314865;}
.mf-capacity-bars > span.is-used{background:linear-gradient(180deg,#42dba1,#1c9f70);border-color:#44d59c;}
.mf-dot{background:var(--mf-green);}
.mf-dot-muted{background:#52647e;}
.mf-theme .tier-display-card{background:var(--mf-input) !important;border-color:var(--mf-soft);}
.mf-theme .progress-track{background:var(--mf-raised);height:8px;}
.mf-theme .progress-fill-dynamic{background:var(--mf-accent) !important;}
.mf-theme .rank-card-item.active-rank{background:var(--mf-accent-soft) !important;border-color:var(--mf-accent) !important;}
.mf-theme .rank-card-item.active-rank .rank-card-label{color:var(--mf-accent-text);}
.mf-theme .rank-exp-range{color:var(--mf-muted);}
.mf-theme :is(.mf-tag-purple,.mf-mini-tag,.mf-count){color:var(--mf-accent-text);background:var(--mf-accent-soft);border-color:var(--mf-accent-line);}
.mf-theme :is(.mf-subtle-link,.mf-icon-link,.mf-panel-footer-link):hover{color:var(--mf-accent-text);}
.mf-theme .mf-quick-links > a:hover{color:var(--mf-accent-text);}
.mf-theme .neu-table thead th{background:var(--mf-input) !important;color:var(--mf-muted);}
.mf-theme .neu-table tbody tr:hover td{background:var(--mf-raised) !important;}
.mf-theme .auth-container{background:var(--mf-bg) !important;}
.mf-auth-brand{color:var(--mf-text) !important;}
.mf-auth-brand > span{color:var(--mf-muted);border-color:var(--mf-line);}
.mf-theme .login-card{background:var(--mf-card) !important;border:1px solid var(--mf-line);box-shadow:0 18px 60px #0003 !important;}
.mf-theme .login-card > .text-center > .neu-icon{background:var(--mf-accent-soft) !important;color:var(--mf-accent-text);border-color:var(--mf-accent-line);}
.mf-theme .login-card p{color:var(--mf-muted);}
.mf-theme .login-card a{color:var(--mf-accent-text);}
.mf-theme .login-card .neu-input{min-height:46px;}
/* Header access to the existing update notes page. */
.mf-theme .dashboard-header{flex-wrap:wrap;}
.mf-theme .mf-page-heading{flex:1 1 220px;}
.mf-theme .dashboard-header > .header-actions{
  margin-left:auto;gap:10px !important;min-width:0 !important;
}
.mf-theme .mf-updates-link{
  color:var(--mf-accent-text);background:var(--mf-accent-soft);
  border-color:var(--mf-accent-line);font-size:14px;min-height:44px;
}
.mf-theme .mf-updates-link svg{width:18px;height:18px;}
.mf-theme .mf-updates-link:hover,
.mf-theme .mf-updates-link[aria-current="page"]{
  color:var(--mf-accent-text);background:rgba(var(--mf-accent-rgb),.20);border-color:var(--mf-accent);
}
/* Account is last in DOM order, including on phones. Long names remain usable. */
.mf-theme .header-actions > .mf-account-link{display:inline-flex;min-width:0;max-width:16rem;}
.mf-theme .mf-account-link > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* On phones the actions wrap in the same reading order; labels stay readable. */
@media (max-width:700px){
  .mf-theme .mf-page-heading{flex:1 1 0;}
  .mf-theme .dashboard-header > .header-actions{
    flex:0 0 100%;width:100% !important;margin:2px 0 0;
    flex-wrap:wrap !important;gap:8px !important;
  }
  .mf-theme .header-actions > .mf-updates-link{flex:1 1 150px;min-width:0;white-space:normal;text-align:center;}
  .mf-theme .header-actions > .mf-account-link{flex:0 1 auto;max-width:100%;}
  .mf-theme .header-actions > .mf-button-primary{flex:0 0 auto;}
  .mf-theme .header-actions > .mf-button{font-size:14px;min-height:44px;padding:10px 12px;}
}
@media (max-width:600px){
  .mf-auth-brand{top:23px;left:20px;}
  .mf-auth-brand > span{display:none;}
}
@media print{
  html,
body.mf-theme{background:#fff;color:#000;}
  .mf-theme .dashboard-container,
.mf-theme .main-content{height:auto;overflow:visible;}
}

/* ---------------------------------------------------------
   1.5 - Support / active-service action label readability
   Keep short statuses and action labels on one line.
   Do not change other tables or functional PHP/JS behaviour.
   --------------------------------------------------------- */
.mf-theme .support-ticket-table td.support-ticket-status{
  min-width: 108px;
  white-space: nowrap !important;
  overflow: visible !important;
}
.mf-theme .support-ticket-table td.support-ticket-status > b{
  display: inline-block !important;
  max-width: none;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.mf-theme .support-ticket-table td.support-ticket-priority{min-width: 77px;}
.mf-theme .support-ticket-table td.support-ticket-action{min-width: 112px;white-space: nowrap !important;}
.mf-theme .support-ticket-table td.support-ticket-action .neu-btn{white-space:nowrap !important;word-break:normal !important;}
/* Long subject text is the flexible column; never squeeze short status labels. */
.mf-theme .support-ticket-table td.support-ticket-subject,
.mf-theme .support-ticket-table td.support-ticket-subject > b{
  white-space: normal !important;
  overflow-wrap: anywhere;
}
@media (min-width:993px){
  .mf-theme .support-table-card{overflow-x:auto !important;}
  .mf-theme .support-ticket-table{min-width: 640px;table-layout:auto !important;}
}
@media (max-width:992px){
  /* Existing mobile ticket cards still own their two-column layout. */
  .mf-theme .support-ticket-table td.support-ticket-priority,
.mf-theme .support-ticket-table td.support-ticket-status,
.mf-theme .support-ticket-table td.support-ticket-action{min-width:0 !important;width:auto !important;}
}
.mf-theme .active-services-table .service-action-cell .neu-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  flex-wrap:nowrap !important;
  width:max-content !important;
  max-width:100% !important;
  padding:10px 10px !important;
  font-size:13px !important;
  white-space:nowrap !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
/* Tiny devices: give the action its own row instead of clipping its label. */
@media (max-width:350px){
  .mf-theme .active-services-table .active-service-row{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .mf-theme .active-services-table .service-renew-cell{
    grid-column:1 !important;grid-row:3 !important;
  }
  .mf-theme .active-services-table .service-action-cell{
    grid-column:1 !important;grid-row:4 !important;
    justify-self:start !important;justify-content:flex-start !important;
  }
}

/* ---------------------------------------------------------
   1.6 - Sidebar search: focus belongs to the whole control.
   Avoid the global :focus-visible outline around only the
   inner text field; retain a clear accessible focus indicator.
   --------------------------------------------------------- */
.mf-theme .sidebar .mf-nav-search{
  transition: border-color .15s ease, box-shadow .15s ease;
}
.mf-theme .sidebar .mf-nav-search:focus-within{
  border-color: var(--mf-accent);
  box-shadow: 0 0 0 2px rgba(var(--mf-accent-rgb), .16);
}
.mf-theme .sidebar .mf-nav-search input,
.mf-theme .sidebar .mf-nav-search input:focus,
.mf-theme .sidebar .mf-nav-search input:focus-visible{
  border: 0 !important;
  outline: none !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}


/* ---------------------------------------------------------
   1.7 - ADMIN TICKET YONETIMI TAM GENISLIK
   support.php icindeki .admin-ticket-shell max-width:1100px
   sinirini yalnizca yonetim listesinin kendisinde gecersiz kil.
   Diger sayfalarin genisligini ve is mantigini degistirme.
   --------------------------------------------------------- */
body.mf-theme .main-content .admin-ticket-shell{
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}
body.mf-theme .main-content .admin-ticket-shell > .admin-ticket-inbox{
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
}


/* ===== Native Obsidian Champagne surfaces ===== */
/* SOURCE STYLE BLOCK 02 */
/*
 * USKOBOT — OBSIDIAN LUXURY
 * A visual-only overlay for the provided dashboard structure.
 * No backend, payment, authentication, or application changes.
 */

html{scroll-behavior:smooth;background:#090b0e;}
.mf-theme.obsidian-demo{
 font-family:Inter,"Segoe UI",Arial,sans-serif;
 background:#090b0e;color:var(--mf-text);letter-spacing:0;
 font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;
}
.mf-theme.obsidian-demo .dashboard-container{background:#090b0e;}
.mf-theme.obsidian-demo .sidebar{
 width:250px;flex-basis:250px;background:#0e1014 !important;
 padding:30px 17px 20px;border-right:1px solid #292a2e;
 box-shadow:10px 0 36px rgba(0,0,0,.13) !important;
}
.mf-theme.obsidian-demo .sidebar::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#ac8b5e6b,transparent);}
.mf-theme.obsidian-demo .sidebar .brand{
 margin:0 7px 34px;min-height:38px;letter-spacing:.16em !important;
 font-size:17px;font-weight:800;color:#f1ebdf;gap:12px;
}
.mf-theme.obsidian-demo .mf-brand-mark{
 width:36px;height:36px;border-radius:10px;
 background:linear-gradient(145deg,#e6c890,#b99560);
 color:#1e1710;box-shadow:0 4px 26px #cbaa7450,inset 0 1px 0 #f9e6bb;
}
.mf-theme.obsidian-demo .mf-brand-mark svg{width:20px;height:20px;stroke-width:2;}
.mf-theme.obsidian-demo .mf-brand-caption{
 font-weight:700;font-size:9px;letter-spacing:.14em;color:#c4a673;
 border:1px solid #6b5439;border-radius:3px;padding:2px 5px;
}
.mf-theme.obsidian-demo .mf-nav-search{
 height:40px;min-height:40px;margin:0 2px 29px;padding:0 12px;
 border-radius:10px;background:#0a0c10;border:1px solid #2a2d32;color:#aeb0b6;
 box-shadow:inset 2px 3px 9px rgba(0,0,0,.32),0 1px 0 rgba(255,255,255,.02);
}
.mf-theme.obsidian-demo .mf-nav-search input{font-size:12px;color:#d7d4cf;}
.mf-theme.obsidian-demo .mf-nav-search input::placeholder{color:#6d727a;}
.mf-theme.obsidian-demo .mf-nav-search kbd{background:#16191f;border:1px solid #35353a;border-radius:4px;color:#8e8c8b;font-size:10px;padding:2px 4px;}
.mf-theme.obsidian-demo .mf-nav-label{
 margin:0 13px 11px;font-size:10px;letter-spacing:.17em;text-transform:uppercase;
 font-weight:700;color:#74767c;
}
.mf-theme.obsidian-demo .sidebar nav .mf-nav-label{margin-top:30px;}
.mf-theme.obsidian-demo .sidebar nav{scrollbar-color:#41392f transparent;}
.mf-theme.obsidian-demo .sidebar .nav-item{
 min-height:41px;padding:10px 12px;margin:0 0 3px;gap:11px;
 border-radius:9px;font-weight:500;font-size:12.5px;color:#96989f;
 transition:background .18s,border-color .18s,color .18s;
}
.mf-theme.obsidian-demo .sidebar .nav-item svg{width:16px;height:16px;flex-basis:16px;opacity:.8;stroke-width:1.8;}
.mf-theme.obsidian-demo .sidebar .nav-item:hover{background:#1b1c20;color:#eee8db;}
.mf-theme.obsidian-demo .sidebar .nav-item.active{
 background:linear-gradient(90deg,rgba(201,171,121,.13),rgba(201,171,121,.035));
 color:#e9d5b4;border:1px solid #504436;box-shadow:inset 0 1px 0 #bda47717 !important;
}
.mf-theme.obsidian-demo .sidebar .nav-item.active::before{display:block;content:"";position:absolute;left:-17px;width:2px;height:22px;background:#cfaf7b;border-radius:0 3px 3px 0;}
.mf-theme.obsidian-demo .sidebar .nav-item.active svg{color:#d9b985;opacity:1;}
.mf-theme.obsidian-demo .sidebar-footer{padding-top:16px;border-top:1px solid #282a2e;}
.mf-theme.obsidian-demo .mf-sidebar-account{padding:5px 7px 15px;gap:11px;}
.mf-theme.obsidian-demo .mf-small-avatar{
 width:34px;height:34px;color:#f4dfb7;
 background:linear-gradient(145deg,#373024,#191714);border:1px solid #6b593b;
}
.mf-theme.obsidian-demo .mf-sidebar-account b{color:#e7e2d8;font-size:13px;font-weight:650;}
.mf-theme.obsidian-demo .mf-sidebar-account small{font-size:11px;color:#73767f;}
.mf-theme.obsidian-demo .mf-sidebar-account .mf-dot{margin-right:5px;}
.mf-theme.obsidian-demo .sidebar-footer .logout-btn{color:#a5a1a1 !important;}
.mf-theme.obsidian-demo .sidebar-footer .logout-btn:hover{color:#f1afaf !important;background:#241a1d;}
.mf-theme.obsidian-demo .main-content{
 padding:0 36px 24px;
 background:radial-gradient(circle at 56% -9%,rgba(174,143,103,.065),transparent 38%),#090b0e;
 scrollbar-color:#39332d transparent;
}
.mf-theme.obsidian-demo .dashboard-header{
 min-height:117px;align-items:center;padding:20px 0;margin:0 0 0;
 background:transparent;border-bottom:1px solid #232528;
}
.lux-heading-overline{display:block;font-weight:600;font-size:9px;letter-spacing:.22em;color:#8d7c64;margin:0 0 4px;}
.mf-theme.obsidian-demo .mf-breadcrumb{font-size:11px;gap:8px;color:#666c74;margin:0 0 4px;}
.mf-theme.obsidian-demo .mf-breadcrumb > span:last-child{color:#b4ac9e;}
.mf-theme.obsidian-demo .page-title{font-weight:630;color:#ece7df;font-size:29px;letter-spacing:-.047em;line-height:1.18;}
.mf-theme.obsidian-demo .mf-page-description{color:#83868b;font-size:12px;margin-top:6px;}
.mf-theme.obsidian-demo .header-actions{gap:9px;}
.mf-theme.obsidian-demo .mf-button{
 min-height:37px;border-radius:8px;padding:8px 13px;font-size:11.5px;
 border:1px solid #353438;color:#b7b5b3;background:#14171c;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.mf-theme.obsidian-demo .mf-button svg{width:14px;height:14px;}
.mf-theme.obsidian-demo .mf-button:hover{background:#232228;color:#eee2cd;border-color:#695840;}
.mf-theme.obsidian-demo .mf-button-primary{
 background:linear-gradient(135deg,#e2c590,#b99462);border-color:#c4a476;
 color:#1e1a16;font-weight:700;box-shadow:0 5px 25px #c4a47623,inset 0 1px 0 #ffe8ba;
}
.mf-theme.obsidian-demo .mf-button-primary:hover{background:linear-gradient(130deg,#f0d6a6,#d0ac78);color:#14100d;}
.lux-demo-pill{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;padding:6px 9px;
 font-size:9px;font-weight:700;letter-spacing:.10em;color:#d3b789;border:1px solid #6a533661;
 background:rgba(203,161,102,.06);border-radius:30px;margin-right:4px;}
.lux-demo-pill i{width:5px;height:5px;border-radius:50%;background:#d9b985;box-shadow:0 0 10px #cbb079aa;}
.mf-theme.obsidian-demo .mf-view-tabs{gap:7px;padding:14px 0 18px;}
.mf-theme.obsidian-demo .mf-view-tabs a{
 color:#8f9197;border:1px solid transparent;border-radius:7px;padding:7px 13px;font-size:12px;
 transition:background .15s,color .15s;
}
.mf-theme.obsidian-demo .mf-view-tabs a.is-active{background:#1b1b1c;border-color:#3e3932;color:#e6d0aa;}
.mf-theme.obsidian-demo .mf-view-tabs a:hover{background:#1a1d21;color:#f0e8db;}
.mf-theme.obsidian-demo .mf-view-tabs a > span{border-radius:4px;background:#2c2926;color:#d5b47d;padding:1px 5px;font-size:10px;}
/* Designed hero: metallic geometry rather than fantasy stock artwork. */
.lux-hero{
 min-height:257px;position:relative;overflow:hidden;isolation:isolate;
 display:grid;grid-template-columns:minmax(0,1fr) 40%;
 background:linear-gradient(115deg,#17191d 0%,#171719 42%,#181612 100%);
 border:1px solid #484036;border-radius:15px;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 17px 54px rgba(0,0,0,.32);
 margin:0 0 21px;
}
.lux-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
 background:radial-gradient(ellipse at 77% 46%,rgba(184,143,91,.15),transparent 42%),
 repeating-linear-gradient(105deg,transparent 0px,transparent 55px,rgba(255,255,255,.012) 56px,transparent 57px);
 opacity:.8;}
.lux-hero::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
 box-shadow:inset 0 0 0 1px rgba(244,214,164,.04);}
.lux-hero-copy{position:relative;z-index:2;padding:35px 36px 35px 38px;}
.lux-eyebrow{font-size:10px;letter-spacing:.19em;color:#c7a876;font-weight:700;display:flex;align-items:center;gap:9px;}
.lux-eyebrow-line{width:22px;height:1px;background:#d1aa71;}
.lux-eyebrow-sep{opacity:.45;}
.lux-hero h1{font-size:clamp(25px,2.7vw,38px);font-weight:550;letter-spacing:-.042em;line-height:1.23;margin:13px 0 9px;color:#f5f1e9;}
.lux-hero h1 em{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.025em;font-style:italic;color:#d9ba86;}
.lux-hero p{font-size:12px;color:#a6a4a3;max-width:460px;line-height:1.7;margin:0;}
.lux-hero-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:19px;}
.lux-hero-actions a{display:inline-flex;align-items:center;gap:15px;font-size:11px;font-weight:650;}
.lux-hero-primary{border-radius:7px;padding:11px 16px;background:linear-gradient(135deg,#dfc392,#b89664);color:#1c1813 !important;box-shadow:0 6px 24px #b8966435;}
.lux-hero-primary:hover{background:#f1d6a5;color:#15130f !important;}
.lux-hero-secondary{color:#d8c3a1 !important;}
.lux-hero-secondary:hover{color:white !important;}
.lux-art{position:relative;min-height:245px;overflow:hidden;}
.lux-art::before{content:"";position:absolute;inset:-24%;background:radial-gradient(circle,rgba(201,171,121,.17) 0%,rgba(201,171,121,.055) 27%,transparent 57%);}
.lux-art-grid{position:absolute;inset:0;opacity:.23;background-image:linear-gradient(#b5a08020 1px,transparent 1px),linear-gradient(90deg,#b5a08020 1px,transparent 1px);background-size:37px 37px;mask-image:radial-gradient(circle at 50% 50%,black,transparent 67%);}
.lux-orbit{position:absolute;border:1px solid rgba(218,182,128,.20);border-radius:50%;left:50%;top:49%;transform:translate(-50%,-50%);}
.lux-orbit-one{width:150px;height:150px;border-color:#e4c48b55;box-shadow:inset 0 0 50px #a8813d14;}
.lux-orbit-two{width:230px;height:230px;border-color:#e4c48b24;}
.lux-orbit-three{width:310px;height:310px;border-color:#e4c48b15;}
.lux-orbit-one::before,
.lux-orbit-two::before{content:"";position:absolute;background:#d7b37d;box-shadow:0 0 13px #debe8a; width:4px;height:4px;top:20px;left:21px;border-radius:50%;}
.lux-orbit-two::before{top:auto;left:auto;bottom:45px;right:24px;width:3px;height:3px;}
.lux-central-glyph{
 position:absolute;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-45deg);
 width:92px;height:92px;display:grid;place-items:center;border:1px solid #b08b52;
 border-radius:18px;background:linear-gradient(145deg,#463925,#201c19 60%,#111316);
 box-shadow:0 14px 60px #0009,inset 0 1px 0 #e1be8355,0 0 30px #b08b5227;
}
.lux-central-glyph span{font-size:49px;font-family:Georgia,serif;font-weight:600;color:#e4c68f;line-height:1;transform:rotate(45deg);text-shadow:0 1px 10px #cfa96644;}
.lux-central-glyph i{position:absolute;inset:9px;border:1px solid rgba(215,176,117,.19);border-radius:11px;}
.lux-art-caption{position:absolute;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:.25em;color:#9c7f5b;white-space:nowrap;}
.lux-art-caption-top{top:19px;}.lux-art-caption-bottom{bottom:19px;}.lux-art-caption-bottom b{font-weight:400;margin:0 4px;}
.lux-art-coord{position:absolute;right:16px;top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:center;color:#8d785b;font-size:8px;letter-spacing:.18em;white-space:nowrap;}
.lux-hero-index{position:absolute;bottom:14px;left:38px;font-size:9px;letter-spacing:.15em;color:#6e6560;}
/* Overview cards */
.mf-theme.obsidian-demo .mf-metrics{gap:13px;margin-bottom:17px;}
.mf-theme.obsidian-demo .mf-metric{
 position:relative;overflow:hidden;min-height:123px;gap:7px;
 padding:19px 19px 16px;border:1px solid #303035;border-radius:12px;
 background:linear-gradient(150deg,#191b20,#111419 75%);
 box-shadow:0 8px 24px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.024);
 transition:transform .2s,border-color .2s,background .2s;
}
.mf-theme.obsidian-demo .mf-metric::before{content:"";position:absolute;left:20px;top:0;height:1px;width:48px;background:linear-gradient(90deg,rgba(201,171,121,.6),transparent);}
.mf-theme.obsidian-demo .mf-metric:hover{border-color:#806947;transform:translateY(-2px);background:#1b1d21;}
.mf-theme.obsidian-demo .mf-metric:first-child{background:linear-gradient(128deg,#201d19,#151619 70%);border-color:#514432;}
.mf-theme.obsidian-demo .mf-metric-label{font-size:11px;font-weight:550;color:#929498;gap:8px;}
.mf-theme.obsidian-demo .mf-metric-label svg{width:15px;height:15px;color:#c8ab7d;}
.mf-theme.obsidian-demo .mf-metric strong{font-size:clamp(24px,2.25vw,33px);line-height:1.18;font-weight:550;color:#f1ece5;letter-spacing:-.045em;}
.mf-theme.obsidian-demo .mf-metric:first-child strong{color:#e4c595;}
.mf-theme.obsidian-demo .mf-metric strong small{color:#919297;font-size:12px;margin-left:6px;letter-spacing:0;}
.mf-theme.obsidian-demo .mf-metric-caption{font-size:11px;color:#81858a;}
.mf-theme.obsidian-demo .mf-mini-tag{font-size:10px;background:#352b1e;color:#d7b581;border:1px solid #675039;border-radius:4px;padding:2px 5px;}
.mf-theme.obsidian-demo .mf-positive{color:#74cda6 !important;}
.mf-theme.obsidian-demo .mf-dot{width:6px;height:6px;background:#69cba5;box-shadow:0 0 7px #69cba544;}
.mf-theme.obsidian-demo .mf-dot-muted{background:#42444b;box-shadow:none;}
/* Panels */
.mf-theme.obsidian-demo .mf-overview-layout{grid-template-columns:minmax(0,1fr) 280px;gap:17px;align-items:start;}
.mf-theme.obsidian-demo .mf-primary-column,
.mf-theme.obsidian-demo .mf-secondary-column{gap:17px;}
.mf-theme.obsidian-demo .mf-panel{
 border:1px solid #303135;border-radius:12px;
 background:linear-gradient(145deg,#15171b,#101217);
 padding:21px 22px;margin:0;
 box-shadow:0 8px 27px #0000001d,inset 0 1px 0 #ffffff05;
}
.mf-theme.obsidian-demo .mf-panel-heading{margin:0 0 20px;min-height:19px;}
.mf-theme.obsidian-demo .mf-panel-heading h3{color:#e8e3dc;font-size:14px;font-weight:640;letter-spacing:-.015em;}
.mf-theme.obsidian-demo .mf-subtle-link{color:#bda785;font-size:11px;gap:7px;}
.mf-theme.obsidian-demo .mf-subtle-link svg{width:13px;height:13px;}
.mf-theme.obsidian-demo .mf-capacity-summary{margin:2px 0 17px;}
.mf-theme.obsidian-demo .mf-capacity-summary strong{font-size:40px;color:#e8d2af;font-weight:530;}
.mf-theme.obsidian-demo .mf-capacity-summary span{font-size:12px;color:#b4b1a9;}
.mf-theme.obsidian-demo .mf-capacity-summary p{font-size:11px;color:#797e84;}
.mf-theme.obsidian-demo .mf-capacity-bars{height:43px;gap:5px;margin:10px 0;}
.mf-theme.obsidian-demo .mf-capacity-bars > span{border:1px solid #373330;background:#24252a;border-radius:4px;box-shadow:inset 0 1px 2px #0004;}
.mf-theme.obsidian-demo .mf-capacity-bars > span.is-used{border-color:#bd9b65;background:linear-gradient(180deg,#e1be83,#a87c49);box-shadow:0 0 12px #a9845044;}
.mf-theme.obsidian-demo .mf-chart-caption{color:#74787e;font-size:10px;margin-top:13px;}
.mf-theme.obsidian-demo .mf-chart-caption .mf-dot{background:#cfb184;box-shadow:none;}
.mf-theme.obsidian-demo .mf-chart-caption .mf-dot-muted{background:#414349;}
.mf-theme.obsidian-demo .loyalty-panel{overflow:hidden;background:linear-gradient(145deg,#15171b,#101217);}
.mf-theme.obsidian-demo .tier-display-card{padding:16px !important;border-radius:10px !important;background:linear-gradient(110deg,#1d1d1e,#17171a) !important;border:1px solid #454038 !important;margin-bottom:18px;}
.mf-theme.obsidian-demo .badge-container{width:56px;min-width:56px;}
.mf-theme.obsidian-demo .badge-container svg{width:51px;height:51px;filter:drop-shadow(0 0 8px #ba955737);}
.mf-theme.obsidian-demo .loyalty-panel .tier-flex-container{gap:18px;}
.mf-theme.obsidian-demo .xp-tier-name{font-size:12px;color:#e3dcd0;font-weight:650;}
.mf-theme.obsidian-demo .xp-values{font-size:12px;color:#b0aaa0;}
.mf-theme.obsidian-demo .xp-current-bold{color:#e2bb7b;font-size:18px;font-weight:640;}
.mf-theme.obsidian-demo .progress-track{height:6px;background:#373029;border-radius:30px;margin:10px 0 0;}
.mf-theme.obsidian-demo .progress-fill-dynamic{height:100%;background:linear-gradient(90deg,#92704b,#e8c68e) !important;box-shadow:0 0 14px #e8c68e44;border-radius:30px;}
.mf-theme.obsidian-demo .mf-xp-caption{font-size:11px;color:#948c82;margin-top:8px;}
.mf-theme.obsidian-demo .mf-tag{font-size:10px;line-height:1.3;letter-spacing:.02em;background:#28241f;border:1px solid #5c4d38;color:#dabb85;border-radius:5px;padding:4px 7px;}
.mf-theme.obsidian-demo .mf-count{background:#29231a;border-color:#4a3d2e;color:#dbb786;font-size:11px;border-radius:6px;min-height:19px;min-width:21px;}
.mf-theme.obsidian-demo .mf-dashboard .loyalty-selector{gap:8px !important;margin-bottom:18px !important;}
.mf-theme.obsidian-demo .mf-dashboard .loyalty-selector .rank-card-item{
 min-height:81px;border:1px solid #343438 !important;border-radius:9px;
 background:linear-gradient(155deg,#1c1d21,#14161a) !important;
 padding:11px 5px;gap:6px;transition:border-color .18s,transform .18s !important;
}
.mf-theme.obsidian-demo .loyalty-selector .rank-card-item:hover{transform:translateY(-2px) !important;border-color:#93734d !important;}
.mf-theme.obsidian-demo .loyalty-selector .rank-card-item.active-rank{background:linear-gradient(160deg,#2f281d,#1b1a19) !important;border-color:#b49462 !important;box-shadow:0 0 0 1px #b4946220,inset 0 1px 0 #d9b98533 !important;}
.mf-theme.obsidian-demo .rank-card-item > svg{width:25px;height:25px;}
.mf-theme.obsidian-demo .rank-card-label{color:#ccc9c3;font-size:11px;font-weight:650;}
.mf-theme.obsidian-demo .rank-exp-range{font-size:9px;color:#85848a;}
.mf-theme.obsidian-demo .tier-details-bar{padding:15px 0 0;border-top:1px solid #37332f;}
.mf-theme.obsidian-demo .det-label{font-size:10px;color:#8d8d91;}
.mf-theme.obsidian-demo .det-item b{font-size:12px;font-weight:650;color:#e9d5af;}
.mf-theme.obsidian-demo .mf-activity-row{grid-template-columns:28px minmax(0,1fr) auto 85px;gap:12px;min-height:65px;padding:12px 0;border-top-color:#2d2d32;}
.mf-theme.obsidian-demo .mf-activity-icon{width:28px;height:28px;border:1px solid #3a342c;border-radius:8px;background:#241f1a;color:#c1a074;}
.mf-theme.obsidian-demo .mf-activity-icon svg{width:14px;height:14px;}
.mf-theme.obsidian-demo .mf-activity-description b{font-size:11.5px;font-weight:550;color:#d4d3d0;}
.mf-theme.obsidian-demo .mf-activity-description small{font-size:10px;color:#747a82;}
.mf-theme.obsidian-demo .mf-activity-amount{font-size:11.5px;color:#e6d8c0;font-weight:620;}
.mf-theme.obsidian-demo .mf-activity-amount small{font-size:10px;color:#7c8085;}
.mf-theme.obsidian-demo .mf-icon-link{color:#bfa478;}
.mf-theme.obsidian-demo .mf-definition-list > div{border-color:#2e3034;padding:12px 0;}
.mf-theme.obsidian-demo .mf-definition-list dt{color:#898c92;font-size:11px;}
.mf-theme.obsidian-demo .mf-definition-list dd{color:#e7e3dc;font-size:11.5px;font-weight:600;}
.mf-theme.obsidian-demo .mf-service-row{padding:12px 0;border-color:#2e3034;gap:10px;}
.mf-theme.obsidian-demo .mf-service-icon{width:32px;height:32px;border:1px solid #4d4436;border-radius:9px;background:#2b251e;color:#d3b37f;}
.mf-theme.obsidian-demo .mf-service-icon svg{width:15px;height:15px;}
.mf-theme.obsidian-demo .mf-service-row b{font-size:11.5px;font-weight:620;color:#e2e0dc;}
.mf-theme.obsidian-demo .mf-service-row small{font-size:10px;color:#85868b;}
.mf-theme.obsidian-demo .mf-panel-footer-link{font-size:11px;color:#cbb084;border-color:#343438;padding-top:15px;margin-top:12px;}
.mf-theme.obsidian-demo .mf-quick-links > a{border-color:#2e3034;padding:13px 0;font-size:11.5px;color:#c7c6c3;}
.mf-theme.obsidian-demo .mf-quick-links svg{color:#c4a170;width:15px;height:15px;}
.mf-theme.obsidian-demo .mf-quick-links > a:hover,
.mf-theme.obsidian-demo .mf-service-row:hover{color:#e9c992;}
.mf-theme.obsidian-demo .mf-helper-note{padding:1px 8px 4px;color:#797d82;gap:9px;}
.mf-theme.obsidian-demo .mf-helper-note p{font-size:10.5px;line-height:1.8;}
.mf-theme.obsidian-demo .mf-helper-note b{font-weight:650;color:#c1b9ae;}
.mf-theme.obsidian-demo .mf-helper-note svg{color:#b99866;width:14px;height:14px;}
.mf-theme.obsidian-demo .mf-workspace-footer{
 display:flex;justify-content:space-between;align-items:center;border-top:1px solid #23252a;
 margin-top:24px;padding:22px 0 4px;font-size:10px;color:#7a7e84;
 letter-spacing:.03em;
}
.mf-theme.obsidian-demo .mf-workspace-footer > a{color:#ba9f74;}
.lux-toast{position:fixed;right:26px;bottom:26px;z-index:5000;display:flex;align-items:center;gap:10px;
 max-width:min(420px,calc(100vw - 30px));padding:13px 18px;border-radius:10px;
 font-size:12px;color:#e3dbc9;background:#202024;border:1px solid #62523b;
 box-shadow:0 20px 50px #0009;opacity:0;transform:translateY(12px);pointer-events:none;
 transition:opacity .2s,transform .2s;}
.lux-toast.visible{opacity:1;transform:translateY(0);}
.lux-toast-gem{color:#d8b883;font-size:20px;}
.lux-back-top{position:fixed;right:24px;bottom:23px;width:39px;height:39px;display:grid;place-items:center;
 opacity:0;pointer-events:none;transition:opacity .2s;background:#201c18;border:1px solid #9e7c50;
 color:#e6c794;font-size:19px;border-radius:9px;cursor:pointer;z-index:300;}
.lux-back-top.visible{opacity:1;pointer-events:auto;}
body:has(.lux-toast.visible) .lux-back-top{opacity:0;pointer-events:none;}
/* Responsive: fit the preserved information architecture. */
@media (min-width:1650px){
 .mf-theme.obsidian-demo .sidebar{width:270px;flex-basis:270px;padding-left:22px;padding-right:22px;}
 .mf-theme.obsidian-demo .main-content{padding:0 48px 30px;}
 .mf-theme.obsidian-demo .mf-overview-layout{grid-template-columns:minmax(0,1fr) 325px;}
 .lux-hero{min-height:275px;}
 .lux-hero-copy{padding:41px 43px;}
}
@media (min-width:993px) and (max-width:1300px){
 .mf-theme.obsidian-demo .sidebar{width:215px;flex-basis:215px;padding:24px 12px 14px;}
 .mf-theme.obsidian-demo .main-content{padding:0 20px 20px;}
 .mf-theme.obsidian-demo .mf-overview-layout{grid-template-columns:minmax(0,1fr) 235px;gap:12px;}
 .mf-theme.obsidian-demo .mf-metrics{gap:9px;}
 .mf-theme.obsidian-demo .mf-metric{padding:16px 12px;}
 .mf-theme.obsidian-demo .mf-metric strong{font-size:24px;}
 .lux-hero-copy{padding:28px;}
 .lux-hero{min-height:245px;grid-template-columns:minmax(0,1fr) 36%;}
 .lux-hero h1{font-size:27px;}
 .lux-demo-pill{display:none;}
 .mf-theme.obsidian-demo .mf-panel{padding:17px 16px;}
}
@media (max-width:992px){
 .mf-theme.obsidian-demo .sidebar{width:270px;flex-basis:auto;padding:29px 17px 17px;transform:translateX(-100%);transition:transform .22s,visibility .22s;z-index:1300;}
 .mf-theme.obsidian-demo .sidebar.active{transform:translateX(0);}
 .mf-theme.obsidian-demo .main-content{padding:0 21px 22px;width:100%;}
 .mf-theme.obsidian-demo .dashboard-header{position:sticky;top:0;z-index:100;min-height:90px !important;padding:14px 21px !important;margin:0 -21px;background:#0c0e11ee !important;backdrop-filter:blur(14px);border-color:#25262a;}
 .mf-theme.obsidian-demo .dashboard-header .mobile-toggle-btn{background:#1d1d21;border-color:#44403a;color:#d9c3a0;}
 .mf-theme.obsidian-demo .menu-close-btn{border-color:#493f33;background:#1e1c1a;color:#d7b784;}
 .mf-theme.obsidian-demo .sidebar nav .nav-item{min-height:42px;}
 .mf-theme.obsidian-demo .mf-overview-layout{grid-template-columns:minmax(0,1fr) 255px;gap:13px;}
 .lux-hero{min-height:235px;}
 .lux-hero-copy{padding:28px 24px;}
 .lux-hero h1{font-size:28px;}
 .mf-theme.obsidian-demo .mf-metrics{gap:9px;}
 .mf-theme.obsidian-demo .mf-metric{padding:14px 13px;min-height:111px;}
 .mf-theme.obsidian-demo .mf-metric strong{font-size:26px;}
}
@media (max-width:760px){
 .mf-theme.obsidian-demo .mf-overview-layout{grid-template-columns:1fr;}
 .mf-theme.obsidian-demo .mf-secondary-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 .mf-theme.obsidian-demo .mf-secondary-column .mf-helper-note{grid-column:1/-1;}
 .mf-theme.obsidian-demo .mf-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
 .lux-hero{grid-template-columns:minmax(0,1fr) 29%;min-height:255px;}
 .lux-hero-copy{padding:30px 24px;}
 .lux-hero h1{font-size:28px;}
 .lux-hero p{font-size:11px;}
 .lux-art{opacity:.54;min-height:0;}
 .lux-orbit-three{width:230px;height:230px;}.lux-orbit-two{width:180px;height:180px;}.lux-orbit-one{width:125px;height:125px;}
 .lux-central-glyph{width:70px;height:70px;}.lux-central-glyph span{font-size:38px;}
 .lux-art-caption,
.lux-art-coord{display:none;}
}
@media (max-width:520px){
 .mf-theme.obsidian-demo .main-content{padding:0 13px 18px;}
 .mf-theme.obsidian-demo .dashboard-header{margin:0 -13px;padding:12px 13px !important;gap:9px;min-height:79px !important;}
 .mf-theme.obsidian-demo .page-title{font-size:22px;}
 .mf-theme.obsidian-demo .mf-page-description,
.lux-heading-overline{display:none;}
 .mf-theme.obsidian-demo .mf-button{padding:8px 9px;min-height:33px;}
 .mf-theme.obsidian-demo .mf-updates-link{display:none;}
 .lux-demo-pill{display:none;}
 .mf-theme.obsidian-demo .mf-view-tabs{gap:3px;overflow-x:auto;}
 .mf-theme.obsidian-demo .mf-view-tabs a{padding:6px 9px;font-size:11px;}
 .lux-hero{display:block;min-height:auto;margin-bottom:15px;border-radius:12px;}
 .lux-hero-copy{padding:26px 21px 28px;}
 .lux-hero h1{font-size:26px;margin:14px 0 10px;}
 .lux-hero p{font-size:11.5px;max-width:290px;}
 .lux-eyebrow{font-size:8px;}
 .lux-hero-actions{gap:12px;}
 .lux-hero-actions a{font-size:10px;}
 .lux-art{position:absolute;right:-90px;top:0;bottom:0;width:280px;opacity:.17;}
 .lux-hero-index{display:none;}
 .mf-theme.obsidian-demo .mf-metrics{gap:9px;}
 .mf-theme.obsidian-demo .mf-metric{min-height:113px;padding:14px 12px;}
 .mf-theme.obsidian-demo .mf-metric strong{font-size:24px;}
 .mf-theme.obsidian-demo .mf-metric strong small{font-size:11px;}
 .mf-theme.obsidian-demo .mf-metric-label{font-size:10px;}
 .mf-theme.obsidian-demo .mf-metric-caption{font-size:10px;}
 .mf-theme.obsidian-demo .mf-panel{padding:16px 14px;}
 .mf-theme.obsidian-demo .mf-secondary-column{display:flex;flex-direction:column;}
 .mf-theme.obsidian-demo .mf-dashboard .loyalty-selector{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:7px !important;}
 .mf-theme.obsidian-demo .mf-dashboard .loyalty-selector .rank-card-item{min-height:66px;flex-direction:row;gap:7px;}
 .mf-theme.obsidian-demo .mf-activity-row{grid-template-columns:24px minmax(0,1fr) 75px;gap:8px;}
 .mf-theme.obsidian-demo .mf-activity-row > .mf-tag{display:none;}
 .mf-theme.obsidian-demo .mf-activity-description b{font-size:11px;}
 .mf-theme.obsidian-demo .mf-workspace-footer{align-items:flex-start;gap:8px;font-size:10px;}
 .lux-toast{right:15px;bottom:15px;}
}

/* Cross-width consistency corrections for the source stylesheet. */
.mf-theme.obsidian-demo .mf-view-tabs{flex-wrap:nowrap !important;white-space:nowrap;}
.mf-theme.obsidian-demo .mf-view-tabs > a{flex:0 0 auto;white-space:nowrap;}
@media (min-width:761px) and (max-width:1300px){
 .mf-theme.obsidian-demo .mf-secondary-column{display:flex !important;flex-direction:column !important;grid-template-columns:none !important;}
}
@media (max-width:992px){
 .mf-theme.obsidian-demo .sidebar:not(.active){transition:none !important;}
 .mf-theme.obsidian-demo .mobile-sidebar-overlay{display:none !important;}
 .mf-theme.obsidian-demo .mobile-sidebar-overlay.active{display:block !important;}
}


/* SOURCE STYLE BLOCK 03 */
/*
 * USKOBOT — OBSIDIAN LUXURY / ENHANCED
 * Visual-only layer for the original supplied dashboard markup.
 * Keep base CSS files unchanged; only motion, surfaces and theme presentation live here.
 */
:root{
  --lux-ease: cubic-bezier(.22,1,.36,1);
  --lux-fast: 180ms;
  --lux-medium: 340ms;
  --lux-gold: #c9aa77;
}

/* The original Obsidian theme remains the reference composition. */

body.mf-theme.obsidian-demo .main-content{
  background:
    radial-gradient(ellipse 68% 400px at 63% -13%,rgba(185,148,94,.10),transparent 70%),
    linear-gradient(145deg, #0b0d10 0%,#090b0e 48%,#0b0d0f 100%);
}
body.mf-theme.obsidian-demo .sidebar{
  background:
    linear-gradient(162deg, rgba(255,255,255,.025), transparent 45%),
    #0e1014 !important;
  box-shadow: 10px 0 44px rgba(0,0,0,.15) !important;
}

/* Subtle material texture: fixed, non-interactive, deliberately low contrast. */
body.mf-theme.obsidian-demo::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:9000;
  pointer-events:none;
  background-image:url("lux-fine-grain.png");
  opacity:.035;
  mix-blend-mode:screen;
}

/* Surface system: translucent edge lighting + pointer-following specular hotspot. */
body.mf-theme.obsidian-demo .lux-satin-surface{
  --lux-pointer-x: 50%;
  --lux-pointer-y: 0%;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  box-shadow:var(--lux-shadow),inset 0 1px 0 var(--lux-highlight);
  transition:
    background-color var(--lux-medium) ease,
    border-color var(--lux-medium) ease,
    box-shadow 400ms var(--lux-ease),
    transform 400ms var(--lux-ease);
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  background:
    radial-gradient(ellipse 82% 64% at 45% -40%, rgba(255,255,255,.065), transparent 85%),
    linear-gradient(145deg,var(--lux-surface-strong),var(--lux-surface) 80%);
  border:1px solid var(--lux-surface-border);
}
body.mf-theme.obsidian-demo .mf-metric:first-child.lux-satin-surface{
  background:linear-gradient(133deg,#28231c,#17191d 68%);
  border-color:#5b4c35;
}
body.mf-theme.obsidian-demo .lux-satin-surface::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  z-index:5;
  background:radial-gradient(420px circle at var(--lux-pointer-x) var(--lux-pointer-y),var(--lux-fx-color),transparent 62%);
  opacity:0;
  transition:opacity 440ms var(--lux-ease);
}
body.mf-theme.obsidian-demo .lux-satin-surface:hover::after{opacity:.9;}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover,
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover{
  border-color:rgba(200,166,118,.52);
  box-shadow:0 17px 44px rgba(0,0,0,.31),inset 0 1px 0 rgba(252,234,208,.09);
  transform:translateY(-2px);
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface::before{
  height:1px;
  left:19px;
  width:78px;
  background:linear-gradient(90deg,rgba(231,194,141,.7),transparent);
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface .mf-panel-heading h3,
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface .mf-capacity-summary,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface > *{position:relative;z-index:1;}
body.mf-theme.obsidian-demo .mf-metric strong,
body.mf-theme.obsidian-demo .mf-capacity-summary strong{font-variant-numeric:tabular-nums;}

/* Navigation: mechanical, light-touch, not gaming neon. */
body.mf-theme.obsidian-demo .sidebar .nav-item{
  transition:background 270ms var(--lux-ease), color 270ms var(--lux-ease),
    border-color 270ms var(--lux-ease),transform 270ms var(--lux-ease),box-shadow 270ms var(--lux-ease);
  position:relative;
}
body.mf-theme.obsidian-demo .sidebar .nav-item:hover{
  transform:translateX(2px) !important;
  background:linear-gradient(90deg,rgba(205,171,113,.07),rgba(255,255,255,.018));
  border-color:#494039;
}
body.mf-theme.obsidian-demo .sidebar .nav-item.active{
  background:linear-gradient(95deg,rgba(208,172,110,.16),rgba(205,172,112,.035) 82%);
  box-shadow:inset 0 1px 0 rgba(255,240,209,.06),0 4px 13px rgba(0,0,0,.13) !important;
}
body.mf-theme.obsidian-demo .sidebar .nav-item.active::before{
  box-shadow:0 0 13px rgba(234,190,130,.42);
}
body.mf-theme.obsidian-demo .sidebar .nav-item svg{
  transition:color 270ms var(--lux-ease),filter 270ms var(--lux-ease);
}
body.mf-theme.obsidian-demo .sidebar .nav-item:hover svg{filter:drop-shadow(0 0 5px rgba(201,171,121,.30));}
body.mf-theme.obsidian-demo .mf-nav-search:focus-within{
  border-color:rgba(208,173,119,.6);
  box-shadow:inset 0 2px 8px rgba(0,0,0,.14),0 0 0 3px rgba(208,173,119,.09);
  transition:border-color 240ms ease, box-shadow 240ms ease;
}

/* Metallic primary and responsive feedback in genuine existing controls. */
body.mf-theme.obsidian-demo .mf-button,
body.mf-theme.obsidian-demo .lux-hero-primary,
body.mf-theme.obsidian-demo .mf-view-tabs a,
body.mf-theme.obsidian-demo .rank-card-item{
  transition:background 260ms var(--lux-ease), color 260ms var(--lux-ease),
    border-color 260ms var(--lux-ease), box-shadow 300ms var(--lux-ease),transform 300ms var(--lux-ease) !important;
}
body.mf-theme.obsidian-demo .mf-button,
body.mf-theme.obsidian-demo .lux-hero-primary{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
body.mf-theme.obsidian-demo .mf-button::after,
body.mf-theme.obsidian-demo .lux-hero-primary::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 10%,rgba(255,255,255,.28) 48%,transparent 75%);
  transform:translateX(-155%);
  transition:transform 800ms var(--lux-ease);
}
body.mf-theme.obsidian-demo .mf-button:hover::after,
body.mf-theme.obsidian-demo .lux-hero-primary:hover::after{transform:translateX(155%);}
body.mf-theme.obsidian-demo .mf-button:hover,
body.mf-theme.obsidian-demo .lux-hero-primary:hover{transform:translateY(-2px);}
body.mf-theme.obsidian-demo .mf-button:active,
body.mf-theme.obsidian-demo .lux-hero-primary:active{transform:translateY(1px) scale(.992);}
body.mf-theme.obsidian-demo .mf-button-primary,
body.mf-theme.obsidian-demo .lux-hero-primary{
  background:linear-gradient(115deg,#e3c998 0%,#cbaa75 52%,#b18b56 100%);
  box-shadow:0 6px 24px rgba(175,127,66,.20),inset 0 1px 0 rgba(255,247,223,.55);
}
body.mf-theme.obsidian-demo .lux-hero{border-color:rgba(217,180,124,.43);}
body.mf-theme.obsidian-demo .lux-hero h1 em{text-shadow:0 6px 28px rgba(199,154,93,.09);}
body.mf-theme.obsidian-demo .lux-hero .lux-art::before{
  background:radial-gradient(circle,rgba(206,166,108,.20) 0%,rgba(201,171,121,.062) 29%,transparent 59%);
}
body.mf-theme.obsidian-demo .lux-orbit-one{animation:lux-orbit-clockwise 32s linear infinite;}
body.mf-theme.obsidian-demo .lux-orbit-two{animation:lux-orbit-counter 45s linear infinite;}
body.mf-theme.obsidian-demo .lux-central-glyph{
  box-shadow:0 14px 60px #0009,inset 0 1px 0 #e1be8355,0 0 30px #b08b5227;
  animation:lux-hero-float 7s ease-in-out infinite;
}
@keyframes lux-orbit-clockwise {to {transform:translate(-50%,-50%) rotate(360deg);}}
@keyframes lux-orbit-counter {to {transform:translate(-50%,-50%) rotate(-360deg);}}
@keyframes lux-hero-float {
  0%,100% {transform:translate(-50%,-50%) rotate(-45deg) translateY(0);}
  50% {transform:translate(-50%,-50%) rotate(-45deg) translateY(-4px);}
}

/* Existing capacity graph, XP progression and status marks. */
body.mf-theme.obsidian-demo .mf-capacity-bars > span,
body.mf-theme.obsidian-demo .progress-fill-dynamic{
  transition:background 340ms ease, box-shadow 340ms ease, border-color 340ms ease;
}
body.mf-theme.obsidian-demo .mf-capacity-bars > span.is-used{
  background:linear-gradient(180deg,#f0d3a0,#a7824e);
  box-shadow:inset 0 1px 0 #ffecbf55,0 0 12px rgba(213,170,105,.18);
}
body.mf-theme.obsidian-demo .mf-capacity-bars > span.is-used:hover{
  box-shadow:inset 0 1px 0 #fff0cc77,0 0 22px rgba(213,170,105,.29);
}
body.mf-theme.obsidian-demo .progress-fill-dynamic{
  background:linear-gradient(90deg,#9e7949,#efcca0) !important;
  box-shadow:0 0 15px rgba(228,184,119,.22);
}
body.mf-theme.obsidian-demo .mf-dot:not(.mf-dot-muted){animation:lux-status-glow 3.2s ease-in-out infinite;}
@keyframes lux-status-glow {
  0%,100% {box-shadow:0 0 4px rgba(102,205,159,.22);}
  50% {box-shadow:0 0 10px rgba(102,205,159,.47),0 0 0 4px rgba(102,205,159,.075);}
}

/* Data density preserved: only subtle hover transitions. */
body.mf-theme.obsidian-demo .mf-service-row,
body.mf-theme.obsidian-demo .mf-activity-row,
body.mf-theme.obsidian-demo .mf-definition-list > div,
body.mf-theme.obsidian-demo .mf-quick-links > a{
  transition:background-color 240ms var(--lux-ease),border-color 240ms var(--lux-ease),color 240ms var(--lux-ease);
}
body.mf-theme.obsidian-demo .mf-service-row:hover,
body.mf-theme.obsidian-demo .mf-activity-row:hover,
body.mf-theme.obsidian-demo .mf-quick-links > a:hover{
  background:rgba(199,165,113,.055);
}
body.mf-theme.obsidian-demo .loyalty-selector .rank-card-item:hover{
  box-shadow:0 11px 24px rgba(0,0,0,.17),inset 0 1px 0 rgba(254,233,201,.065) !important;
}
body.mf-theme.obsidian-demo .loyalty-selector .rank-card-item.active-rank{
  box-shadow:0 0 0 1px rgba(209,171,112,.13),0 11px 24px rgba(0,0,0,.17),inset 0 1px 0 rgba(254,233,201,.12) !important;
}

/* Theme control is independent from business data; no route or API changes. */
body.mf-theme.obsidian-demo .lux-theme-control{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:91px;
  min-height:37px;
  color:#c4bfb3;
  border:1px solid #4a4034;
  border-radius:8px;
  background:linear-gradient(160deg,#202027,#13161a);
  padding:7px 10px;
  cursor:pointer;
  box-shadow:inset 0 1px 0 #fff1d510;
  transition:transform 280ms var(--lux-ease),border-color 280ms var(--lux-ease),background 340ms ease;
  font-size:11px;
}
body.mf-theme.obsidian-demo .lux-theme-control:hover{transform:translateY(-1px);border-color:#9d7e50;}
body.mf-theme.obsidian-demo .lux-theme-control:active{transform:translateY(1px);}
body.mf-theme.obsidian-demo .lux-theme-control svg{width:14px;height:14px;stroke:currentColor;}
body.mf-theme.obsidian-demo .lux-theme-sun{display:none;}
body.mf-theme.obsidian-demo .lux-theme-thumb{
  position:relative;
  width:24px;height:13px;border-radius:99px;background:#37332e;border:1px solid #62513b;
}
body.mf-theme.obsidian-demo .lux-theme-thumb i{
  position:absolute;left:2px;top:2px;width:7px;height:7px;border-radius:50%;background:linear-gradient(130deg,#efd4a4,#ba965c);
  transition:transform 370ms var(--lux-ease);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-thumb i{transform:translateX(11px);}
body.mf-theme.obsidian-demo .mf-theme-transition,
body.mf-theme.obsidian-demo .sidebar,
body.mf-theme.obsidian-demo .main-content,
body.mf-theme.obsidian-demo .dashboard-header,
body.mf-theme.obsidian-demo .mf-panel,
body.mf-theme.obsidian-demo .mf-metric,
body.mf-theme.obsidian-demo .mf-button,
body.mf-theme.obsidian-demo .rank-card-item,
body.mf-theme.obsidian-demo .nav-item{
  transition-property:background,background-color,color,border-color,box-shadow,transform;
  transition-duration:450ms;
  transition-timing-function:var(--lux-ease);
}

/* On-scroll reveal uses class only when enhanced.js has enabled observer. */
body.lux-motion-ready .lux-reveal{opacity:0;transform:translateY(13px);}
body.lux-motion-ready .lux-reveal.lux-visible{
  opacity:1;transform:translateY(0);
  transition:opacity 660ms var(--lux-ease),transform 660ms var(--lux-ease),
    border-color 350ms ease,box-shadow 350ms ease,background-color 350ms ease;
}
body.lux-motion-ready .mf-panel.lux-reveal.lux-visible:hover{transform:translateY(-2px);}
body.mf-theme.obsidian-demo .lux-back-top{box-shadow:0 14px 35px rgba(0,0,0,.25);}

/* --------------------------------------------------------------
   LIGHT / PORCELAIN: complete component reskin of the same markup.
   The original hero intentionally stays dark as a contrasting product vignette.
   -------------------------------------------------------------- */
body[data-lux-theme="light"].mf-theme.obsidian-demo{
  color-scheme:light;
  --mf-canvas:#f6f3ed;--mf-bg:#f6f3ed;--mf-sidebar:#f0ede7;
  --mf-card:#fffdf9;--mf-raised:#f3efe7;--mf-input:#fffdfa;
  --mf-line:#d6d0c5;--mf-soft:#e6e0d5;--mf-text:#272724;
  --mf-muted:#777875;--mf-dim:#88847d;
  --mf-accent:#af8753;--mf-accent-hover:#c09a64;--mf-accent-text:#956d39;
  --mf-accent-ink:#fffdf9;--mf-accent-rgb:175,135,83;
  --mf-accent-soft:rgba(163,119,60,.105);--mf-accent-line:rgba(141,106,61,.3);
  --mf-green:#277a5b;--mf-red:#b55555;
  --lux-surface:#fffdfa;--lux-surface-strong:#ffffff;
  --lux-surface-soft:#f4f0e8;--lux-surface-border:#e0d9ce;
  --lux-highlight:rgba(255,255,255,.9);--lux-fx-color:rgba(188,146,79,.15);
  --lux-shadow:0 9px 30px rgba(70,49,20,.065);
  --lux-copy:#262623;--lux-subcopy:#77756f;
  background:#f6f3ed;color:#272724;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo::before{mix-blend-mode:multiply;opacity:.02;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .dashboard-container{background:#f6f3ed;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content{
  background:radial-gradient(ellipse at 62% -9%,rgba(184,144,82,.10),transparent 52%),#f6f3ed;
  scrollbar-color:#c9c1b5 transparent;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar{
  background:linear-gradient(170deg,#f6f3eb 0%,#efeae1 100%) !important;
  border-right-color:#ded7c9;
  box-shadow:5px 0 29px rgba(91,74,53,.035) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar::before{
  background:linear-gradient(90deg,transparent,#d1b787,transparent);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .brand,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-page-heading .page-title{color:#292724;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-brand-caption{color:#947040;border-color:#baa57f;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search{
  background:#fffdf9;border-color:#dcd4c7;box-shadow:inset 0 1px 3px rgba(89,72,50,.04);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search input{color:#302c26;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search input::placeholder{color:#9b948a;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search kbd{background:#f1ede4;color:#80776b;border-color:#e2dacc;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-label{color:#8a8275;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .nav-item{color:#696965;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .nav-item:hover{
  color:#292724;background:#e9e1d4;border-color:#d6c9b6;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .nav-item.active{
  color:#76552f;border-color:#d9c9b1;
  background:linear-gradient(95deg,rgba(176,136,83,.17),rgba(176,136,83,.055));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 4px 15px rgba(80,59,34,.045) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .nav-item.active svg{color:#9a784b;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar-footer{border-top-color:#dcd4c7;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-sidebar-account{color:#302a25;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-small-avatar{
  color:#604521;background:#e7ddcd;border:1px solid #b8a583;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-sidebar-account small{color:#89847b;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar-footer .logout-btn{color:#766b66 !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar-footer .logout-btn:hover{color:#a84e4c !important;background:#f4e6e3;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .dashboard-header{border-bottom-color:#dfd8ce;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-heading-overline{color:#9e7b4f;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-breadcrumb{color:#817e78;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-breadcrumb > span:last-child{color:#584e44;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-page-description{color:#77756f;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-button{
  background:#fffdf9;color:#58534d;border-color:#dcd4c8;
  box-shadow:0 2px 10px rgba(80,59,34,.035),inset 0 1px 0 #fff;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-button:hover{background:#f5eee3;color:#47341d;border-color:#bda787;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-button-primary,
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero-primary{
  background:linear-gradient(120deg,#d9bc8c,#b88d53);color:#201b15;border-color:#b68c56;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-control{
  color:#7e6040;background:linear-gradient(140deg,#fffdf9,#f2ebdf);
  border-color:#d7c5ad;box-shadow:inset 0 1px 0 #fff;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-sun{display:block;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-moon{display:none;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-thumb{background:#e2d6c4;border-color:#c6a879;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-demo-pill{color:#9e7544;border-color:#d2bd9d;background:#f6eee2;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-view-tabs a{color:#7b766e;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-view-tabs a:hover{background:#ebe3d6;color:#53422f;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-view-tabs a.is-active{
  color:#7e5d33;border-color:#d6c6af;background:#eee7dc;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-view-tabs a > span{background:#e5d9c6;color:#8c6637;}

/* Hero dark by design, independent of theme. */
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero{
  border-color:#ae906a;
  background:linear-gradient(112deg,#24221f,#16181b 55%,#211c16);
  box-shadow:0 18px 42px rgba(51,39,23,.16),inset 0 1px 0 rgba(255,255,255,.12);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero-copy h1{color:#fff9ef;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero-copy p{color:#c5bcb0;}

body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  background:linear-gradient(160deg,rgba(255,255,255,.99),rgba(252,249,243,.96));
  border-color:#ddd6cc;
  box-shadow:0 8px 26px rgba(73,54,27,.065),inset 0 1px 0 #fff;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric:first-child.lux-satin-surface{
  background:linear-gradient(125deg,#fffaf0,#f9f1e4);border-color:#d8c5a5;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover{
  border-color:#bea17a;box-shadow:0 14px 32px rgba(94,67,33,.105),inset 0 1px 0 #fff;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric-label,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric-caption{color:#787771;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric strong{color:#292724;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric:first-child strong{color:#906636;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric strong small{color:#868179;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric-label svg{color:#b28a56;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-mini-tag{
  background:#f0e4d1;color:#805d31;border-color:#d8c3a1;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-positive{color:#267b5d !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel-heading h3{color:#302b25;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-subtle-link{color:#927245;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-summary strong{color:#86613a;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-summary span{color:#77716a;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-summary p,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-chart-caption{color:#817e78;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-bars > span{
  border-color:#dfd8cd;background:#eeeae2;box-shadow:inset 0 1px 2px rgba(83,67,45,.06);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-bars > span.is-used{
  border-color:#bd9865;background:linear-gradient(180deg,#ead0a2,#b18750);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-chart-caption .mf-dot-muted{background:#b9b4ab;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .tier-display-card{
  background:linear-gradient(120deg,#fcf7ec,#f3eee5) !important;
  border-color:#d8c7ad !important;
  box-shadow:inset 0 1px 0 #fff;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .xp-tier-name{color:#3b3229;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .xp-values,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-xp-caption{color:#796f63;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .xp-current-bold{color:#9b6f39;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .progress-track{background:#e3d6c3;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-tag,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-count{
  background:#efe3d1;border-color:#d1b893;color:#906632;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-dashboard .loyalty-selector .rank-card-item{
  background:linear-gradient(150deg,#fffdfa,#f6f1e9) !important;
  border-color:#dfd8cc !important;box-shadow:inset 0 1px 0 #fff !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .loyalty-selector .rank-card-item:hover{
  border-color:#c9ab81 !important;box-shadow:0 9px 24px rgba(90,67,35,.085) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .loyalty-selector .rank-card-item.active-rank{
  background:linear-gradient(140deg,#f3e3c8,#faf5eb) !important;
  border-color:#b98b53 !important;
  box-shadow:inset 0 1px 0 #fff,0 8px 24px rgba(90,67,35,.075) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .rank-card-label,
body[data-lux-theme="light"].mf-theme.obsidian-demo .det-item b{color:#3d352a;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .rank-exp-range,
body[data-lux-theme="light"].mf-theme.obsidian-demo .det-label{color:#857e74;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .tier-details-bar{border-top-color:#e3dbd0;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-row,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-service-row,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-definition-list > div,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-quick-links > a{border-color:#e6dfd4;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-row:hover,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-service-row:hover,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-quick-links > a:hover{background:#f5ede1;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-icon,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-service-icon{
  background:#f3e8d7;border-color:#d7c3a6;color:#977246;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-description b,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-service-row b,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-definition-list dd{color:#302e2a;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-description small,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-service-row small,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-definition-list dt{color:#817b71;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-amount{color:#745633;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-activity-amount small{color:#817c73;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel-footer-link{border-color:#e0d8cd;color:#916d3f;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-quick-links > a{color:#58534c;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-quick-links svg{color:#9b7548;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-helper-note{color:#77736c;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-helper-note b{color:#4d463c;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-workspace-footer{border-top-color:#ddd7cb;color:#827d74;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-workspace-footer > a{color:#947044;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-toast{
  background:#fff9ef;color:#493826;border-color:#d5bc92;box-shadow:0 18px 36px rgba(87,58,29,.13);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-back-top{
  color:#79582d;background:#faf4e8;border-color:#c3a77f;
}

@media (max-width:992px){
  body[data-lux-theme="light"].mf-theme.obsidian-demo .dashboard-header{
    background:rgba(246,243,237,.94) !important;border-color:#dfd8ce;
  }
  body[data-lux-theme="light"].mf-theme.obsidian-demo .dashboard-header .mobile-toggle-btn,
body[data-lux-theme="light"].mf-theme.obsidian-demo .menu-close-btn{
    background:#fdfbf7;border-color:#d4c2a6;color:#785c3d;
  }
}
@media (max-width:700px){
  body.mf-theme.obsidian-demo .lux-theme-control{min-width:37px;width:37px;padding:8px;gap:0;}
  body.mf-theme.obsidian-demo .lux-theme-label,
body.mf-theme.obsidian-demo .lux-theme-thumb{display:none;}
}
@media (max-width:520px){
  body.mf-theme.obsidian-demo .lux-theme-control{min-width:33px;width:33px;min-height:33px;padding:7px;}
  body.mf-theme.obsidian-demo .header-actions{gap:5px;}
  body.mf-theme.obsidian-demo .mf-button{padding:8px;}
  body.mf-theme.obsidian-demo .mf-account-link{display:none;}
}

/* Light theme identity remains legible at the sidebar foot. */
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-sidebar-account b{color:#312b22;}


/* SOURCE STYLE BLOCK 04 */
/* USKOBOT — Obsidian Luxury: Motion Edition
   Source-faithful presentation overlay. Does not alter payment, auth or backend logic. */
:root{
  --lux-precision-ease:cubic-bezier(.22,1,.36,1);
}

body[data-lux-theme="light"].mf-theme.obsidian-demo{
  --lux-edge-start:rgba(164,117,61,.73);
  --lux-edge-mid:rgba(174,136,88,.29);
  --lux-edge-end:rgba(174,136,88,.04);
  --lux-surface-spot:rgba(168,121,60,.073);
  --lux-surface-core:rgba(193,142,75,.075);
  --lux-micropanel:rgba(99,76,44,.026);
  --lux-control-text:#71695e;
  --lux-control-border:rgba(134,99,53,.19);
  --lux-control-selected:#89673b;
  --lux-control-selected-bg:rgba(162,116,53,.13);
}
/* Deliberately flat unbroken perimeter. The first highlighted pixel begins at x=0. */
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  --lux-pointer-x:50%;--lux-pointer-y:50%;--lux-tilt-x:0deg;--lux-tilt-y:0deg;
  border:1px solid var(--lux-surface-border) !important;
  isolation:isolate;
  transform:perspective(1100px) rotateX(var(--lux-tilt-x)) rotateY(var(--lux-tilt-y)) translateY(0);
  will-change:auto;
  box-shadow:0 8px 26px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,239,207,.035);
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface::before{
  content:"";
  display:block !important;
  position:absolute !important;
  left:0 !important;right:0 !important;top:0 !important;
  width:100% !important;height:1px !important;
  background:linear-gradient(to right,var(--lux-edge-start) 0%,var(--lux-edge-mid) 48%,var(--lux-edge-end) 100%) !important;
  opacity:.82;
  z-index:6;
  pointer-events:none;
  transform:none !important;
  transition:opacity .4s ease,filter .4s ease;
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover::before{
  opacity:1;filter:brightness(1.18);
}
/* The light follows the actual cursor, not a fixed ceiling lamp. Two scales of specular reflection. */
body.mf-theme.obsidian-demo .lux-satin-surface::after{
  background:
    radial-gradient(200px 120px at var(--lux-pointer-x,50%) var(--lux-pointer-y,50%), var(--lux-surface-core),transparent 83%),
    radial-gradient(370px 260px at var(--lux-pointer-x,50%) var(--lux-pointer-y,50%), var(--lux-surface-spot),transparent 79%) !important;
  opacity:0 !important;
  transition:opacity .4s ease;
  z-index:7;
  border-radius:inherit;
  mix-blend-mode:screen;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-satin-surface::after{mix-blend-mode:multiply;}
body.mf-theme.obsidian-demo .lux-satin-surface.lux-illuminated::after{opacity:1 !important;}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover{
  transform:perspective(1100px) rotateX(var(--lux-tilt-x)) rotateY(var(--lux-tilt-y)) translateY(-3px) !important;
  box-shadow:0 23px 48px rgba(0,0,0,.25),0 3px 20px rgba(211,165,101,.07),inset 0 1px 0 rgba(252,234,208,.08) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover{
  box-shadow:0 17px 36px rgba(87,67,33,.13),0 3px 20px rgba(211,165,101,.06),inset 0 1px 0 #fff !important;
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover{transform:translateY(-2px);}
body.mf-theme.obsidian-demo .mf-metric .mf-metric-caption,
body.mf-theme.obsidian-demo .mf-metric .mf-metric-label,
body.mf-theme.obsidian-demo .mf-metric strong{position:relative;z-index:3;}

/* Motion toggle: tiny, purposeful switch placed next to original controls. */
body.mf-theme.obsidian-demo .lux-motion-toggle{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:37px;padding:7px 11px;color:#c7af8b;
  border:1px solid #4a4035;border-radius:8px;
  background:linear-gradient(155deg,#232222,#111419);
  font-size:11px;font-family:inherit;cursor:pointer;white-space:nowrap;
  box-shadow:inset 0 1px 0 #ffebc610;transition:border-color .25s,transform .25s var(--lux-precision-ease),background .3s;
}
body.mf-theme.obsidian-demo .lux-motion-toggle:hover{border-color:#b59565;transform:translateY(-1px);}
body.mf-theme.obsidian-demo .lux-motion-toggle svg{width:14px;height:14px;}
body.mf-theme.obsidian-demo .lux-motion-toggle i{width:5px;height:5px;border-radius:50%;background:#c9a76e;box-shadow:0 0 8px #c9a76e88;}
body.mf-theme.obsidian-demo .lux-motion-toggle[aria-pressed="false"]{color:#818083;border-color:#373536;}
body.mf-theme.obsidian-demo .lux-motion-toggle[aria-pressed="false"] i{background:#707176;box-shadow:none;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-motion-toggle{background:#fffaf1;border-color:#d8c5ac;color:#87673c;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-motion-toggle[aria-pressed="false"]{color:#8c8983;border-color:#ddd7ce;}

/* Session preview: an instrument cluster inside the ORIGINAL capacity panel. */
body.mf-theme.obsidian-demo .lux-scenario-studio{
  position:relative;z-index:2;
  display:flex;justify-content:space-between;align-items:center;
  gap:12px 18px;flex-wrap:wrap;
  padding:10px 13px;margin:2px 0 19px;
  background:linear-gradient(120deg,var(--lux-micropanel),transparent 85%);
  border:1px solid var(--lux-control-border);border-radius:10px;
}
.lux-scenario-intro{display:flex;align-items:center;gap:9px;min-width:176px;}
.lux-scenario-intro b{display:block;font-weight:700;letter-spacing:.14em;font-size:9px;color:var(--lux-control-selected);}
.lux-scenario-intro small{display:block;color:var(--lux-control-text);font-size:10px;margin-top:1px;}
.lux-scenario-icon{display:grid;place-items:center;width:26px;height:26px;flex:none;border:1px solid var(--lux-control-border);border-radius:7px;color:var(--lux-control-selected);font-size:14px;}
.lux-scenario-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;}
.lux-preset-group{display:flex;gap:3px;padding:3px;border:1px solid var(--lux-control-border);border-radius:8px;background:rgba(0,0,0,.07);}
body.mf-theme.obsidian-demo .lux-preset{
  min-width:32px;min-height:27px;padding:5px 8px;
  color:var(--lux-control-text);background:transparent;border:1px solid transparent;border-radius:5px;
  font-size:11px;font-weight:650;font-variant-numeric:tabular-nums;
  font-family:inherit;cursor:pointer;
  transition:color .25s,background .25s,border-color .25s,box-shadow .25s,transform .25s var(--lux-precision-ease);
}
body.mf-theme.obsidian-demo .lux-preset:hover{color:var(--mf-text);background:var(--lux-control-selected-bg);}
body.mf-theme.obsidian-demo .lux-preset[aria-pressed="true"]{
  color:var(--lux-control-selected);background:var(--lux-control-selected-bg);
  border-color:var(--lux-control-border);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
body.mf-theme.obsidian-demo .lux-preset:active{transform:scale(.94);}
.lux-scenario-custom{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--lux-control-border);border-radius:7px;padding:4px 7px;color:var(--lux-control-text);font-size:10px;}
.lux-scenario-custom:focus-within{border-color:var(--lux-control-selected);}
.lux-scenario-custom input{width:45px;min-width:0;border:0;outline:0;background:transparent;color:var(--mf-text);font:600 11px Inter,Arial,sans-serif;text-align:right;font-variant-numeric:tabular-nums;}
.lux-scenario-custom input::-webkit-inner-spin-button,
.lux-scenario-custom input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.lux-scenario-custom input{-moz-appearance:textfield;appearance:textfield;}
.lux-input-suffix{color:var(--mf-dim);}
body.mf-theme.obsidian-demo .mf-capacity-summary{margin-bottom:10px;}
body.mf-theme.obsidian-demo .mf-capacity-summary strong{
  min-width:1ch;display:inline-block; font-variant-numeric:tabular-nums;
  transition:color .3s ease;
}
body.mf-theme.obsidian-demo .lux-dynamic-capacity{display:flex;flex-wrap:wrap;}
body.mf-theme.obsidian-demo .lux-usage-detail{display:none;}
body.mf-theme.obsidian-demo .lux-precision-meter{
  display:flex;align-items:center;gap:12px;position:relative;z-index:2;
  margin:7px 0 2px;
}
body.mf-theme.obsidian-demo .lux-precision-meter > span{
  flex:none;display:inline-flex;gap:6px;align-items:center;
  color:var(--mf-dim);font-size:9px;letter-spacing:.12em;
}
body.mf-theme.obsidian-demo .lux-precision-meter b{color:var(--mf-text);font-weight:650;font-size:11px;letter-spacing:0;font-variant-numeric:tabular-nums;}
body.mf-theme.obsidian-demo .lux-meter-rail{min-width:10px;flex:1;height:3px;border-radius:10px;background:var(--lux-control-border);overflow:hidden;}
body.mf-theme.obsidian-demo .lux-meter-rail i{display:block;height:100%;width:0;background:linear-gradient(90deg,#a78049,#e8c88e);box-shadow:0 0 12px rgba(228,190,129,.36);border-radius:inherit;}
/* Each original bar represents 654 / 36 slots. Partial fill shows low values accurately. */
body.mf-theme.obsidian-demo .mf-capacity-bars > span{position:relative;overflow:hidden;}
body.mf-theme.obsidian-demo .mf-capacity-bars > span.is-partial{
  border-color:rgba(168,130,74,.52);
  background:var(--mf-raised) !important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.22) !important;
}
body.mf-theme.obsidian-demo .mf-capacity-bars > span.is-partial::after{
  content:"";position:absolute;inset:0 auto 0 0;width:var(--lux-fill,0%);
  background:linear-gradient(180deg,#f2d39d,#b08951);
  box-shadow:1px 0 9px #d7af7444;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-capacity-bars > span.is-partial{background:#eeeae2 !important;}
body.mf-theme.obsidian-demo .mf-capacity-panel.lux-capacity-full .mf-capacity-summary strong{color:var(--mf-accent-text);}
body.mf-theme.obsidian-demo .mf-capacity-panel.lux-capacity-full .lux-meter-rail i{background:linear-gradient(90deg,#ae7646,#ebaa75);}

/* The existing artwork gets an independent living technical layer. */
body.mf-theme.obsidian-demo .lux-hero{overflow:hidden;}
body.mf-theme.obsidian-demo .lux-art{
  --lux-grid-parallax-x:0px;--lux-grid-parallax-y:0px;
  --lux-glyph-parallax-x:0px;--lux-glyph-parallax-y:0px;
  --lux-art-mx:50%;--lux-art-my:50%;
  isolation:isolate;overflow:hidden;
}
body.mf-theme.obsidian-demo .lux-art-grid{
  z-index:0;inset:-16px !important;opacity:.31;
  background-size:36px 36px;
  transform:translate3d(var(--lux-grid-parallax-x),var(--lux-grid-parallax-y),0);
  animation:lux-grid-breathe 32s linear infinite;
  mask-image:radial-gradient(ellipse at 50% 50%,black 0%,rgba(0,0,0,.65) 44%,transparent 77%);
}
@keyframes lux-grid-breathe {
  0% {background-position:0 0;}
  100% {background-position:72px 72px;}
}
body.mf-theme.obsidian-demo .lux-art .lux-circuit-canvas{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  pointer-events:none;z-index:1;
  filter:drop-shadow(0 0 2px rgba(211,170,108,.24));
}
body.mf-theme.obsidian-demo .lux-art .lux-scan-ray{
  position:absolute;inset:-110% -30%;z-index:1;pointer-events:none;
  background:linear-gradient(110deg,transparent 48%,rgba(227,194,142,.11) 49.7%,rgba(248,223,180,.05) 50.1%,transparent 51%);
  transform:translate3d(-30%,0,0) rotate(-12deg);
  animation:lux-scan-travel 16s linear infinite;
  opacity:.9;
}
@keyframes lux-scan-travel {
  0% {transform:translate3d(-35%,0,0) rotate(-12deg)}
  100% {transform:translate3d(45%,0,0) rotate(-12deg)}
}
body.mf-theme.obsidian-demo .lux-art .lux-cursor-glow{
  position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(145px circle at var(--lux-art-mx) var(--lux-art-my),rgba(243,203,136,.14),transparent 88%);
  opacity:.18;transition:opacity .5s ease;
}
body.mf-theme.obsidian-demo .lux-hero:hover .lux-cursor-glow{opacity:1;}
body.mf-theme.obsidian-demo .lux-glyph-stage{
  position:absolute;inset:0;z-index:3;pointer-events:none;
  transform:translate3d(var(--lux-glyph-parallax-x),var(--lux-glyph-parallax-y),0);
}
body.mf-theme.obsidian-demo .lux-glyph-stage .lux-orbit{z-index:1;}
body.mf-theme.obsidian-demo .lux-glyph-stage .lux-central-glyph{z-index:2;}
body.mf-theme.obsidian-demo .lux-art-caption{z-index:4;}
body.mf-theme.obsidian-demo .lux-hero-primary{transform:translate3d(var(--lux-magnet-x,0px),var(--lux-magnet-y,0px),0);}
body.mf-theme.obsidian-demo .lux-hero-primary:hover{transform:translate3d(var(--lux-magnet-x,0px),calc(var(--lux-magnet-y,0px) - 2px),0);}

/* Make the 4-card dashboard responsive without changing composition. */
@media (max-width:1450px){
  body.mf-theme.obsidian-demo .lux-scenario-studio{align-items:flex-start;}
}
@media (max-width:1180px){
  body.mf-theme.obsidian-demo .lux-scenario-controls{flex:1 1 100%;}
}
@media (max-width:700px){
  body.mf-theme.obsidian-demo .lux-motion-toggle{width:35px;min-width:35px;padding:8px;}
  body.mf-theme.obsidian-demo .lux-motion-toggle span,
body.mf-theme.obsidian-demo .lux-motion-toggle i{display:none;}
  .lux-scenario-controls{gap:6px;}
  body.mf-theme.obsidian-demo .lux-scenario-studio{padding:10px;}
  body.mf-theme.obsidian-demo .lux-preset{min-width:29px;padding:5px 6px;}
  body.mf-theme.obsidian-demo .lux-scenario-intro{min-width:0;}
  body.mf-theme.obsidian-demo .lux-precision-meter{gap:7px;}
}
@media (max-width:430px){
  body.mf-theme.obsidian-demo .lux-scenario-controls{flex-wrap:wrap;}
  .lux-preset-group{flex:0 0 auto;}
  body.mf-theme.obsidian-demo .lux-preset{min-width:27px;padding:4px 5px;}
  body.mf-theme.obsidian-demo .lux-precision-meter > span{font-size:8px;letter-spacing:.04em;}
}
/* Accessibility: every effect may be disabled without disabling any control. */

body.lux-motion-off.mf-theme.obsidian-demo .lux-art-grid,
body.lux-motion-off.mf-theme.obsidian-demo .lux-scan-ray,
body.lux-motion-off.mf-theme.obsidian-demo .lux-central-glyph,
body.lux-motion-off.mf-theme.obsidian-demo .lux-orbit,
body.lux-motion-off.mf-theme.obsidian-demo .mf-dot{animation:none !important;}
body.lux-motion-off.mf-theme.obsidian-demo .lux-circuit-canvas{opacity:0;}
body.lux-motion-off.mf-theme.obsidian-demo .lux-satin-surface::after{opacity:0 !important;}
body.lux-motion-off.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover{transform:none !important;}
/* Final material calibration: hero scan is a whisper, not a spotlight fixture. */
body.mf-theme.obsidian-demo .lux-art .lux-scan-ray{
  background:linear-gradient(110deg,transparent 48.5%,rgba(227,194,142,.042) 49.85%,rgba(248,223,180,.027) 50.08%,transparent 50.8%);
  opacity:.50;
}
body.mf-theme.obsidian-demo .mf-button.mf-button-primary,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-button.mf-button-primary{color:#22190e !important;}
body.mf-theme.obsidian-demo .lux-scenario-custom input:focus-visible{outline:0;}
body.mf-theme.obsidian-demo .lux-preset:focus-visible,
body.mf-theme.obsidian-demo .lux-motion-toggle:focus-visible{outline:2px solid var(--mf-accent-text);outline-offset:2px;}


/* === Refined V2 / autonomous motion + a genuinely continuous rounded L-edge === */
/* The original straight top pseudo-edge is hidden, instead of being moved to x=0:
   x=0 clipped off the rounded corner and created a visual discontinuity. */
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface::before{
  display:none !important;
  content:none !important;
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  isolation:isolate;
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface > svg.lux-edge-trace{
  position:absolute !important;
  display:block !important;
  inset:0 !important;
  z-index:10 !important;
  width:100% !important;
  height:100% !important;
  pointer-events:none;
  overflow:visible;
  border-radius:inherit;
  opacity:.98;
}
body.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-static{
  stroke-width:1.55;
  stroke-linejoin:round;
  stroke-linecap:round;
  fill:none;
  vector-effect:non-scaling-stroke;
}
body.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-runner{
  stroke:#f5d9aa;
  stroke-width:2.3;
  stroke-dasharray:9 91;
  stroke-linecap:round;
  stroke-linejoin:round;
  fill:none;
  opacity:.88;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 3px rgba(238,196,132,.73));
  animation:lux-edge-run 4.8s linear infinite;
}
@keyframes lux-edge-run {from {stroke-dashoffset:109;}to {stroke-dashoffset:0;}}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-edge-trace .lux-edge-static{filter:brightness(.73);}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-edge-trace .lux-edge-runner{
  stroke:#ab7b3d;
  filter:drop-shadow(0 0 2px rgba(158,103,43,.38));
}
/* Autonomous, subdued moving metal reflection even without a mouse. */
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface > .lux-ambient-band{
  position:absolute !important;
  inset:-45% !important;
  display:block;
  z-index:2 !important;
  pointer-events:none;
  opacity:.8;
  background:linear-gradient(115deg,
     transparent 24%,
     rgba(236,204,151,0) 37%,
     rgba(236,204,151,.055) 45%,
     rgba(236,204,151,.10) 49%,
     rgba(236,204,151,.035) 53%,
     transparent 63%);
  transform:translateX(-90%) rotate(0.01deg);
  animation:lux-ambient-pass 7.8s cubic-bezier(.3,.05,.5,.98) infinite;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface > .lux-ambient-band{
  background:linear-gradient(115deg,transparent 24%,rgba(148,103,44,0) 37%,rgba(148,103,44,.06) 45%,rgba(148,103,44,.11) 49%,rgba(148,103,44,.04) 53%,transparent 63%);
}
@keyframes lux-ambient-pass {
  0%,12% {transform:translateX(-95%);opacity:0;}
  17% {opacity:1;}
  49% {opacity:1;}
  60%,100% {transform:translateX(95%);opacity:0;}
}
/* Hero: continuously scanning precision grid and orbited insignia, NOT hover gated. */
body.mf-theme.obsidian-demo .lux-art-grid{
  opacity:.61;
  background-image:
    linear-gradient(rgba(211,171,108,.18) 1px,transparent 1px),
    linear-gradient(90deg,rgba(211,171,108,.18) 1px,transparent 1px);
  background-size:36px 36px;
  animation:lux-grid-drift-v2 13s linear infinite !important;
  mask-image:radial-gradient(ellipse 75% 82% at 50% 50%,black 0%,rgba(0,0,0,.8) 55%,transparent 95%);
}
@keyframes lux-grid-drift-v2 {
  from {background-position:0px 0px;}
  to {background-position:144px 72px;}
}
body.mf-theme.obsidian-demo .lux-art .lux-scan-ray{
  opacity:.84 !important;
  background:linear-gradient(110deg,transparent 47.5%,rgba(228,190,134,.015) 48.6%,rgba(248,218,169,.13) 49.7%,rgba(249,218,163,.18) 50.15%,rgba(240,194,124,.02) 51.4%,transparent 52.8%) !important;
  animation:lux-scan-travel-v2 8s ease-in-out infinite !important;
}
@keyframes lux-scan-travel-v2 {
  0% {transform:translate3d(-36%,0,0) rotate(-12deg);}
  100% {transform:translate3d(52%,0,0) rotate(-12deg);}
}
body.mf-theme.obsidian-demo .lux-art::before{
  animation:lux-ambient-focus 7s ease-in-out infinite;
  transform-origin:55% 55%;
}
@keyframes lux-ambient-focus {
  0%,100% {transform:translate3d(-8px,2px,0) scale(.95);opacity:.68;}
  50% {transform:translate3d(12px,-8px,0) scale(1.16);opacity:1;}
}
body.mf-theme.obsidian-demo .lux-orbit-one{animation:lux-orbit-clockwise 13s linear infinite !important;}
body.mf-theme.obsidian-demo .lux-orbit-two{animation:lux-orbit-counter 19s linear infinite !important;}
body.mf-theme.obsidian-demo .lux-central-glyph{animation:lux-hero-float 4.5s ease-in-out infinite !important;}
body.mf-theme.obsidian-demo .lux-motion-toggle i{
  animation:lux-indicator-pulse 1.7s ease-in-out infinite;
}
@keyframes lux-indicator-pulse {
  0%,100% {box-shadow:0 0 0 0 rgba(216,175,110,.18),0 0 5px rgba(216,175,110,.45);}
  50% {box-shadow:0 0 0 5px rgba(216,175,110,0),0 0 13px rgba(216,175,110,.80);}
}
body.mf-theme.obsidian-demo .lux-motion-toggle[aria-pressed="true"]{
  border-color:rgba(223,181,116,.58);
  background:linear-gradient(145deg,rgba(91,69,43,.32),rgba(30,29,28,.9));
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-motion-toggle[aria-pressed="true"]{
  background:linear-gradient(145deg,#fff9ef,#efe3cd);
}
/* One switch controls every autonomous layer and interactive response. */
body.lux-motion-off.mf-theme.obsidian-demo .lux-edge-runner,
body.lux-motion-off.mf-theme.obsidian-demo .lux-ambient-band{
  animation:none !important;
  opacity:0 !important;
}
body.lux-motion-off.mf-theme.obsidian-demo .lux-art-grid,
body.lux-motion-off.mf-theme.obsidian-demo .lux-art .lux-scan-ray,
body.lux-motion-off.mf-theme.obsidian-demo .lux-orbit-one,
body.lux-motion-off.mf-theme.obsidian-demo .lux-orbit-two,
body.lux-motion-off.mf-theme.obsidian-demo .lux-central-glyph,
body.lux-motion-off.mf-theme.obsidian-demo .lux-art::before,
body.lux-motion-off.mf-theme.obsidian-demo .lux-motion-toggle i{
  animation:none !important;
}
body.lux-motion-off.mf-theme.obsidian-demo .lux-art .lux-scan-ray{opacity:0 !important;}
body.lux-motion-off.mf-theme.obsidian-demo .lux-art-grid{opacity:.32 !important;background-position:0 0 !important;}
body.lux-motion-off.mf-theme.obsidian-demo .lux-motion-toggle i{box-shadow:none !important;}
body.lux-motion-off.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover,
body.lux-motion-off.mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover{
  transform:none !important;
}
/* Explicit ON is allowed to override OS reduced-motion defaults. Initial default remains OFF. */
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-art-grid{animation:lux-grid-drift-v2 13s linear infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-art .lux-scan-ray{animation:lux-scan-travel-v2 8s ease-in-out infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-orbit-one{animation:lux-orbit-clockwise 13s linear infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-orbit-two{animation:lux-orbit-counter 19s linear infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-central-glyph{animation:lux-hero-float 4.5s ease-in-out infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-edge-runner{animation:lux-edge-run 4.8s linear infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-ambient-band{animation:lux-ambient-pass 7.8s cubic-bezier(.3,.05,.5,.98) infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-art::before{animation:lux-ambient-focus 7s ease-in-out infinite !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-motion-toggle i{animation:lux-indicator-pulse 1.7s ease-in-out infinite !important;}

/* ============================================================
   Part 3 — Soft comet / gradient artwork / precision sidebar
   Overrides only: the original dashboard and data are unchanged.
   ============================================================ */

/* The original L-edge stays geometrically accurate. The old hard dash is now
   just an invisible path for getPointAtLength() in the comet renderer. */
body.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-runner,
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-edge-trace .lux-edge-runner{
  animation:none !important;
  stroke:transparent !important;
  stroke-width:0 !important;
  opacity:0 !important;
}
body.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-static{
  stroke-width:1.2;
  opacity:.72;
  filter:drop-shadow(0 0 2px rgba(229,186,120,.13));
}
body.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-comet{
  pointer-events:none;
  mix-blend-mode:screen;
}
body.mf-theme.obsidian-demo .lux-comet-halo,
body.mf-theme.obsidian-demo .lux-comet-veil,
body.mf-theme.obsidian-demo .lux-comet-filament{pointer-events:none;}
body.mf-theme.obsidian-demo .lux-comet-filament{opacity:.78;}
body.mf-theme.obsidian-demo .lux-comet-core{filter:drop-shadow(0 0 2px rgba(255,236,196,.8));}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-edge-comet{
  mix-blend-mode:multiply;opacity:.85;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-edge-comet circle{
  fill:#a46d30;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-comet-core{
  fill:#5e3e1c;
}
body.lux-motion-off.mf-theme.obsidian-demo .lux-edge-trace .lux-edge-comet{opacity:0 !important;}

/* The artwork fades into the existing hero from the left rather than
   exposing the rectangular boundary of the separate art column. */
body.mf-theme.obsidian-demo .lux-art{
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,rgba(0,0,0,.04) 7%,rgba(0,0,0,.19) 16%,
    rgba(0,0,0,.48) 29%,rgba(0,0,0,.83) 43%,black 57%);
  mask-image:linear-gradient(90deg,
    transparent 0%,rgba(0,0,0,.04) 7%,rgba(0,0,0,.19) 16%,
    rgba(0,0,0,.48) 29%,rgba(0,0,0,.83) 43%,black 57%);
}
body.mf-theme.obsidian-demo .lux-art-grid{
  -webkit-mask-image:radial-gradient(ellipse 77% 82% at 54% 49%,black 0%,rgba(0,0,0,.82) 45%,transparent 99%);
  mask-image:radial-gradient(ellipse 77% 82% at 54% 49%,black 0%,rgba(0,0,0,.82) 45%,transparent 99%);
}
body.mf-theme.obsidian-demo .lux-art .lux-circuit-canvas{
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.20) 18%,black 48%,black 92%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.20) 18%,black 48%,black 92%,transparent 100%);
  filter:drop-shadow(0 0 4px rgba(211,170,108,.18));
}
body.mf-theme.obsidian-demo .lux-art .lux-scan-ray{
  filter:blur(12px);
  opacity:.55 !important;
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-art .lux-scan-ray{opacity:.55 !important;}
body.lux-motion-off.mf-theme.obsidian-demo .lux-art .lux-scan-ray{opacity:0 !important;}

/* Small autonomous glowing motes: no button or link obstruction. */
body.mf-theme.obsidian-demo > .lux-ambient-particles{
  position:fixed;inset:0;
  width:100vw;height:100vh;height:100dvh;
  pointer-events:none !important;
  z-index:1210;
  display:block;
  contain:strict;
  opacity:.84;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo > .lux-ambient-particles{opacity:.62;}
body.lux-motion-off.mf-theme.obsidian-demo > .lux-ambient-particles{opacity:0 !important;}

/* Sidebar: anodized graphite / warm machined edges. Zero new navigation. */
body.mf-theme.obsidian-demo .sidebar{
  border-right:1px solid rgba(199,165,113,.24) !important;
  background:
    radial-gradient(ellipse 130% 43% at -12% -2%,rgba(203,164,108,.14),transparent 69%),
    radial-gradient(ellipse 110% 30% at 100% 90%,rgba(133,100,59,.052),transparent 70%),
    linear-gradient(160deg,#131518 0%,#0d1014 48%,#101217 100%) !important;
  box-shadow:8px 0 35px rgba(0,0,0,.17),inset -1px 0 rgba(255,228,174,.035) !important;
}
body.mf-theme.obsidian-demo .sidebar::after{
  content:"";position:absolute;
  right:0;top:14px;bottom:14px;width:1px;
  background:linear-gradient(to bottom,transparent,rgba(237,199,140,.37) 12%,rgba(207,162,95,.12) 42%,transparent 87%);
  pointer-events:none;z-index:0;
}
body.mf-theme.obsidian-demo .sidebar .brand{
  margin-bottom:22px;
  padding:4px 2px 20px;
  border-bottom:1px solid rgba(207,170,115,.13);
  position:relative;
}
body.mf-theme.obsidian-demo .sidebar .brand::after{
  content:"";position:absolute;bottom:-1px;left:0;width:60%;height:1px;
  background:linear-gradient(90deg,rgba(245,207,150,.55),rgba(208,171,120,.12),transparent);
  pointer-events:none;
}
body.mf-theme.obsidian-demo .mf-brand-mark{
  position:relative;isolation:isolate;overflow:hidden;
  border:1px solid rgba(251,227,183,.36);
  border-radius:11px;
  background:linear-gradient(150deg,#f0d6ab 0%,#b88c52 53%,#674f35 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.51),inset 0 -1px 0 rgba(58,41,20,.52),0 3px 19px rgba(204,166,105,.23);
}
body.mf-theme.obsidian-demo .mf-brand-mark::after{
  content:"";position:absolute;inset:-45%;pointer-events:none;
  background:linear-gradient(108deg,transparent 42%,rgba(255,255,255,.49) 50%,transparent 57%);
  transform:translateX(-150%);
  animation:lux-brand-glint 9s cubic-bezier(.35,.05,.55,.95) infinite;
}
@keyframes lux-brand-glint {0%,58%{transform:translateX(-150%)}77%,100%{transform:translateX(150%)}}
body.mf-theme.obsidian-demo .mf-nav-search{
  position:relative;
  border:1px solid rgba(207,179,137,.21);
  background:linear-gradient(125deg,rgba(10,12,15,.92),rgba(25,24,23,.72));
  border-radius:10px;
  box-shadow:inset 0 2px 11px rgba(0,0,0,.33),inset 0 1px 0 rgba(255,255,255,.02),0 6px 17px rgba(0,0,0,.12);
  transition:box-shadow .3s,border-color .3s;
}
body.mf-theme.obsidian-demo .mf-nav-search:focus-within{
  border-color:rgba(231,197,141,.62);
  box-shadow:0 0 0 3px rgba(202,161,101,.085),inset 0 2px 11px rgba(0,0,0,.22);
}
body.mf-theme.obsidian-demo .sidebar nav .mf-nav-label{
  display:flex;align-items:center;gap:9px;
  letter-spacing:.185em;color:#a29481;
}
body.mf-theme.obsidian-demo .sidebar nav .mf-nav-label::before{
  content:"";width:10px;height:1px;flex:none;
  background:linear-gradient(90deg,rgba(231,197,141,.75),rgba(231,197,141,.15));
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item{
  position:relative;isolation:isolate;overflow:hidden;
  border:1px solid transparent;
  background:linear-gradient(90deg,rgba(255,255,255,.013),transparent 85%);
  border-radius:9px;
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(105deg,transparent 16%,rgba(246,217,169,.11) 47%,transparent 75%);
  transform:translateX(-145%);
  transition:transform 850ms cubic-bezier(.2,.68,.2,1);
  z-index:0;
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item:hover::after{transform:translateX(145%);}
body.mf-theme.obsidian-demo .sidebar nav .nav-item:hover{
  border-color:rgba(201,162,107,.25);
  background:linear-gradient(95deg,rgba(185,142,83,.11),rgba(255,255,255,.017));
  box-shadow:inset 0 1px 0 rgba(255,242,211,.025);
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  border-color:rgba(219,175,107,.36);
  background:linear-gradient(96deg,rgba(198,156,95,.22),rgba(198,156,95,.085) 54%,rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(245,211,161,.1),0 6px 21px rgba(0,0,0,.13) !important;
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item.active::before{
  content:"";display:block;position:absolute;left:0;top:8px;height:calc(100% - 16px);width:2px;
  background:linear-gradient(180deg,transparent,#f0c78a 30%,#e3ae68 72%,transparent);
  border-radius:0 4px 4px 0;
  box-shadow:0 0 12px rgba(235,190,124,.42);
  animation:lux-nav-beacon 5.5s ease-in-out infinite;
}
@keyframes lux-nav-beacon {0%,100%{opacity:.55}50%{opacity:1}}
body.mf-theme.obsidian-demo .sidebar nav .nav-item svg{
  transition:filter .35s var(--lux-precision-ease),transform .35s var(--lux-precision-ease),color .35s;
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item:hover svg{
  transform:translateY(-1px);filter:drop-shadow(0 0 6px rgba(221,183,124,.38));
}
body.mf-theme.obsidian-demo .sidebar-footer{
  padding-top:15px;border-top-color:rgba(204,170,119,.20);
}
body.mf-theme.obsidian-demo .mf-sidebar-account{
  border:1px solid rgba(205,169,114,.22);
  border-radius:12px;padding:11px 10px !important;margin:0 0 9px;
  background:
    radial-gradient(circle at 12% 0%,rgba(209,170,113,.095),transparent 58%),
    linear-gradient(125deg,rgba(255,255,255,.035),rgba(18,20,24,.27));
  box-shadow:inset 0 1px 0 rgba(255,240,209,.045),0 8px 22px rgba(0,0,0,.13);
}
body.mf-theme.obsidian-demo .mf-sidebar-account .mf-small-avatar{
  box-shadow:inset 0 1px 0 rgba(255,225,182,.16),0 0 12px rgba(202,161,99,.11);
}
body.mf-theme.obsidian-demo .sidebar-footer .logout-btn{
  border:1px solid transparent;border-radius:8px;
}
body.mf-theme.obsidian-demo .sidebar-footer .logout-btn:hover{border-color:rgba(194,112,111,.20);}

/* Light mode: metal becomes warm porcelain and antique brass, not inverted grey. */
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar{
  background:
    radial-gradient(ellipse 130% 44% at 0% -7%,rgba(181,138,77,.105),transparent 73%),
    linear-gradient(155deg,#f5f0e6,#eee8de 51%,#f3eee6) !important;
  border-right-color:rgba(158,119,69,.23) !important;
  box-shadow:7px 0 30px rgba(95,70,38,.09),inset -1px 0 rgba(255,255,255,.8) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar::after{
  background:linear-gradient(to bottom,transparent,rgba(155,105,48,.28) 14%,rgba(155,105,48,.08) 47%,transparent);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .brand{border-bottom-color:rgba(154,116,67,.20);}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar .brand::after{
  background:linear-gradient(to right,rgba(170,123,57,.47),transparent);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search{
  border-color:#d6c5ac;background:linear-gradient(120deg,#fffaf3,#f4eee5);
  box-shadow:inset 0 1px 4px rgba(92,65,31,.055),0 4px 14px rgba(93,67,33,.06);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .mf-nav-label{color:#8f7759;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item{
  color:#625c55;background:linear-gradient(90deg,rgba(128,89,44,.026),transparent 85%);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item:hover{
  color:#423226;border-color:rgba(155,115,63,.25);
  background:linear-gradient(90deg,rgba(172,128,69,.11),rgba(255,255,255,.16));
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  color:#604327;border-color:rgba(160,115,56,.34);
  background:linear-gradient(94deg,rgba(185,141,77,.19),rgba(193,155,94,.075) 76%,rgba(255,255,255,.40));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 5px 15px rgba(114,78,32,.055) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-sidebar-account{
  border-color:rgba(170,130,79,.28);
  background:linear-gradient(130deg,rgba(255,255,255,.73),rgba(225,209,185,.28));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 5px 18px rgba(94,65,31,.05);
}
body.lux-motion-off.mf-theme.obsidian-demo .mf-brand-mark::after,
body.lux-motion-off.mf-theme.obsidian-demo .sidebar nav .nav-item.active::before{animation:none !important;}
@media (max-width:992px){
  body.mf-theme.obsidian-demo .sidebar{box-shadow:14px 0 44px rgba(0,0,0,.28) !important;}
}


/* ============================================================
   Part 4 — Obsidian Luminous / micro-grain, 24 FPS glitter depth
   The original layout, numbers, navigation and business logic are untouched.
   ============================================================ */

/* Smooth dithered light texture avoids quantized color-band contours.
   The highlight follows the pointer as a diffuse reflection, not a hard lamp. */
body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero)::after{
  inset:auto !important;
  left:var(--lux-pointer-x, 50%) !important;
  top:var(--lux-pointer-y, 50%) !important;
  width:550px !important;
  height:550px !important;
  border-radius:50% !important;
  transform:translate3d(-50%,-50%,0) !important;
  background:url("lux-orbit-texture.png") center / 100% 100% no-repeat !important;
  filter:none !important;
  mix-blend-mode:screen !important;
  opacity:0 !important;
  transition:opacity .48s ease !important;
  pointer-events:none !important;
}
body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero).lux-illuminated::after{
  opacity:1 !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero)::after{
  background-image:url("lux-satin-texture.png") !important;
  mix-blend-mode:multiply !important;
}
body.mf-theme.obsidian-demo .lux-hero::after{
  background:radial-gradient(ellipse 350px 260px at var(--lux-pointer-x, 50%) var(--lux-pointer-y, 50%),rgba(223,185,121,.055) 0%,rgba(223,185,121,.037) 26%,rgba(223,185,121,.014) 54%,transparent 88%) !important;
  mix-blend-mode:normal !important;
}
body.lux-motion-off.mf-theme.obsidian-demo .lux-satin-surface::after{opacity:0 !important;}

/* The background has three optical planes. They are drawn at <=24 FPS in a
   single scheduler; surfaces remain above the far field and below the very
   sparse lens glitter. These canvases never intercept pointer events. */
body.mf-theme.obsidian-demo .main-content{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(ellipse 670px 450px at 80% 3%,rgba(142,106,62,.085),transparent 79%),
    radial-gradient(ellipse 380px 530px at 11% 75%,rgba(159,119,67,.037),transparent 80%),
    linear-gradient(150deg,#0b0d11,#090b0e 58%,#0d0f13) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content{
  background:
    radial-gradient(ellipse 720px 440px at 80% -5%,rgba(170,132,75,.07),transparent 80%),
    radial-gradient(ellipse 390px 540px at 10% 74%,rgba(162,126,73,.04),transparent 82%),
    linear-gradient(160deg,#f9f6ef,#f4f0e8 64%,#faf7f0) !important;
}
body.mf-theme.obsidian-demo .main-content > :not(.lux-depth-back):not(.lux-depth-front){
  position:relative;
  z-index:2;
}
body.mf-theme.obsidian-demo .main-content > .lux-depth-back,
body.mf-theme.obsidian-demo .main-content > .lux-depth-front{
  position:fixed;
  inset:0 0 0 var(--lux-sidebar-width,250px);
  display:block;
  width:calc(100vw - var(--lux-sidebar-width,250px));
  height:100vh;
  height:100dvh;
  pointer-events:none !important;
  contain:strict;
}
body.mf-theme.obsidian-demo .main-content > .lux-depth-back{z-index:0;opacity:.91;}
body.mf-theme.obsidian-demo .main-content > .lux-depth-front{z-index:5;opacity:.45;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-depth-back{opacity:.75;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.32;}
body.lux-motion-off.mf-theme.obsidian-demo .main-content > .lux-depth-back,
body.lux-motion-off.mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:0 !important;}

/* Raised optical instruments. Transparent fraction is deliberate: distant
   glitter remains behind the information surface, not on top of the text. */
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  box-shadow:0 17px 45px rgba(0,0,0,.34), 0 2px 13px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,240,209,.045);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface{
  background:linear-gradient(145deg,rgba(24,26,31,.95),rgba(13,16,21,.93) 74%) !important;
  border-color:rgba(174,157,133,.20) !important;
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:not(:first-child){
  background:linear-gradient(148deg,rgba(26,28,33,.96),rgba(13,16,21,.92) 80%) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface:not(:first-child){
  background:linear-gradient(140deg,rgba(255,255,255,.95),rgba(249,246,239,.91)) !important;
  border-color:rgba(118,91,56,.18) !important;
  box-shadow:0 18px 43px rgba(77,57,30,.105),0 2px 11px rgba(77,57,30,.04),inset 0 1px 0 rgba(255,255,255,.9) !important;
}

/* Real autonomous reflections on existing CTA buttons. Unlike the previous
   version these are timed keyframes; hover is not required to see them. */
@keyframes lux-button-luminous {
  0%,10% {transform:translate3d(-170%,0,0);opacity:0;}
  16% {opacity:.95;}
  31% {transform:translate3d(175%,0,0);opacity:.5;}
  35%,100% {transform:translate3d(175%,0,0);opacity:0;}
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .mf-button::after,
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-hero-primary::after{
  display:block !important;
  content:"" !important;
  position:absolute !important;
  z-index:4;
  inset:-2px !important;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(102deg,transparent 32%,rgba(255,249,223,.03) 39%,rgba(255,245,213,.30) 49%,rgba(255,250,226,.075) 57%,transparent 67%) !important;
  animation:lux-button-luminous 6.8s cubic-bezier(.2,.35,.3,.99) infinite !important;
  animation-delay:-1.9s;
  will-change:transform;
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .mf-updates-link::after{animation-delay:-4.1s !important;animation-duration:8.6s !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .lux-hero-primary::after{animation-delay:-3.6s !important;animation-duration:7.3s !important;}
body.mf-theme.obsidian-demo .mf-button > *,
body.mf-theme.obsidian-demo .lux-hero-primary > *{position:relative;z-index:6;}
body.lux-motion-off.mf-theme.obsidian-demo .mf-button::after,
body.lux-motion-off.mf-theme.obsidian-demo .lux-hero-primary::after{animation:none !important;opacity:0 !important;}

/* Ambient nav light: small timed sweeps across the metal, not a global
   mouse-only overlay. Selected tab receives its own slow breathing field. */
@keyframes lux-nav-luminous {
  0%,28% {transform:translate3d(-145%,0,0);opacity:0;}
  36% {opacity:.8;}
  52% {transform:translate3d(145%,0,0);opacity:.4;}
  57%,100% {transform:translate3d(145%,0,0);opacity:0;}
}
@keyframes lux-nav-active-breathe {
  0%,100% {box-shadow:inset 0 1px 0 rgba(255,246,225,.12),inset 0 0 12px rgba(217,173,109,.035),0 4px 17px rgba(0,0,0,.12);}
  50% {box-shadow:inset 0 1px 0 rgba(255,246,225,.23),inset 0 0 25px rgba(217,173,109,.13),0 6px 22px rgba(196,156,99,.085);}
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item > svg,
body.mf-theme.obsidian-demo .sidebar nav .nav-item > span{position:relative;z-index:2;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item::after{
  content:"" !important;
  display:block !important;
  background:linear-gradient(102deg,transparent 26%,rgba(252,228,182,.015) 38%,rgba(244,207,151,.16) 48%,rgba(247,226,184,.035) 60%,transparent 75%) !important;
  animation:lux-nav-luminous 11.5s cubic-bezier(.27,.44,.33,.95) infinite !important;
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item:nth-of-type(2n)::after{animation-delay:-4s !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item:nth-of-type(3n)::after{animation-delay:-7s !important;}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  animation:lux-nav-active-breathe 5.6s ease-in-out infinite !important;
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item.active::after{
  background:linear-gradient(108deg,transparent 23%,rgba(255,236,193,.08) 39%,rgba(253,216,157,.31) 49%,rgba(244,209,160,.06) 62%,transparent 78%) !important;
  animation-duration:5.3s !important;
}
body[data-lux-motion="on"].mf-theme.obsidian-demo .sidebar nav .nav-item.active svg{
  filter:drop-shadow(0 0 4px rgba(238,201,145,.28));
}
body.lux-motion-off.mf-theme.obsidian-demo .sidebar nav .nav-item::after,
body.lux-motion-off.mf-theme.obsidian-demo .sidebar nav .nav-item.active{animation:none !important;}
body.lux-motion-off.mf-theme.obsidian-demo .sidebar nav .nav-item::after{opacity:0 !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  color:#533b20;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item::after{
  background:linear-gradient(100deg,transparent 28%,rgba(171,120,56,.035) 41%,rgba(160,111,46,.16) 50%,transparent 73%) !important;
}

/* The hero artwork retains its feathered left mask; extra glimmer is supplied
   by the canvas behind it, so the left border never becomes a hard seam. */
body.mf-theme.obsidian-demo .lux-art-grid{
  -webkit-mask-image:radial-gradient(ellipse 85% 87% at 56% 50%,rgba(0,0,0,.95) 0%,rgba(0,0,0,.78) 37%,rgba(0,0,0,.25) 69%,transparent 100%);
  mask-image:radial-gradient(ellipse 85% 87% at 56% 50%,rgba(0,0,0,.95) 0%,rgba(0,0,0,.78) 37%,rgba(0,0,0,.25) 69%,transparent 100%);
}
@media (min-width:1451px){body.mf-theme.obsidian-demo{--lux-sidebar-width:270px;}}
@media (min-width:993px) and (max-width:1180px){body.mf-theme.obsidian-demo{--lux-sidebar-width:215px;}}
@media (max-width:992px){body.mf-theme.obsidian-demo{--lux-sidebar-width:0px;}}
@media (max-width:600px){
 body.mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.22;}
 body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero)::after{width:390px !important;height:390px !important;}
}


/* USKOBOT Luminous V4 — Performance Fix (visual layer only)
   Smaller specular, lower paint/compositing cost, greater STATIC surface depth.
   All existing markup and user data remain unchanged. */
body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero)::after{
  width: 320px !important;
  height: 320px !important;
  opacity: 0 !important;
  /* Existing micro-dithered specular texture is retained. */
  filter: none !important;
  transition: opacity 240ms ease !important;
}
body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero).lux-illuminated::after{
  opacity: .82 !important;
}
/* Backdrop blurs on every card force expensive compositing during glitter motion.
   Replace blur with layered, static shadows and illuminated bevels. */
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow:
    0 2px 3px rgba(0,0,0,.18),
    0 12px 30px rgba(0,0,0,.28),
    0 24px 55px rgba(0,0,0,.17),
    inset 0 1px 0 rgba(255,232,189,.085),
    inset 0 -1px 0 rgba(0,0,0,.13) !important;
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface{
  background: linear-gradient(145deg,rgba(29,31,37,.97),rgba(14,17,22,.96) 77%) !important;
  border-color: rgba(198,171,132,.26) !important;
}
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:not(:first-child){
  background: linear-gradient(145deg,rgba(31,33,39,.97),rgba(14,17,22,.96) 80%) !important;
}
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover{
  box-shadow:
    0 4px 9px rgba(0,0,0,.21),
    0 17px 40px rgba(0,0,0,.30),
    0 30px 62px rgba(0,0,0,.15),
    inset 0 1px 0 rgba(255,237,194,.13) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface{
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow:
    0 3px 7px rgba(75,56,31,.035),
    0 15px 32px rgba(75,56,31,.095),
    0 25px 45px rgba(75,56,31,.05),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface:not(:first-child){
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(250,247,240,.955)) !important;
  border-color:rgba(159,130,93,.24) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface:hover,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface:hover{
  box-shadow:
    0 4px 9px rgba(75,56,31,.045),
    0 20px 41px rgba(75,56,31,.115),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}
/* Visually separate the backdrop from the raised cards, without another canvas. */
body.mf-theme.obsidian-demo .main-content{
  background:
    radial-gradient(ellipse 660px 410px at 78% -5%,rgba(167,124,65,.092),transparent 78%),
    radial-gradient(ellipse 390px 520px at 8% 80%,rgba(149,111,59,.055),transparent 79%),
    linear-gradient(150deg,#080a0e,#0b0e13 58%,#080a0e) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content{
  background:
    radial-gradient(ellipse 620px 430px at 80% -5%,rgba(166,125,72,.07),transparent 79%),
    linear-gradient(150deg,#f6f3ec,#efebe3 58%,#f7f4ee) !important;
}
@media (max-width:600px){
  body.mf-theme.obsidian-demo .lux-satin-surface:not(.lux-hero)::after{
    width: 260px !important;
    height: 260px !important;
  }
}


/* ============================================================
   Part 5 — Volumetric Plexus Depth
   Premium automation-network field behind the instruments.
   ============================================================ */
body.mf-theme.obsidian-demo .main-content::before{
  content:"";position:fixed;inset:0 0 0 var(--lux-sidebar-width,250px);pointer-events:none;
  z-index:0;
  background:
    radial-gradient(ellipse 620px 420px at 76% 16%, color-mix(in srgb,var(--ps-glow-strong, rgba(217,173,109,.16)) 60%, transparent) 0%, transparent 72%),
    radial-gradient(ellipse 360px 260px at 18% 72%, color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.08)) 55%, transparent) 0%, transparent 78%);
  opacity:.82;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content::before{opacity:.58;}
body.lux-motion-off.mf-theme.obsidian-demo .main-content::before{opacity:.34;}
body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{
  position:fixed;inset:0 0 0 var(--lux-sidebar-width,250px);
  display:block;width:calc(100vw - var(--lux-sidebar-width,250px));height:100vh;height:100dvh;
  pointer-events:none !important;contain:strict;z-index:1;opacity:.92;
  filter:saturate(1.02);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-plexus-back{opacity:.68;}
body.lux-motion-off.mf-theme.obsidian-demo .main-content > .lux-plexus-back{opacity:0 !important;}
body.mf-theme.obsidian-demo .lux-hero,
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface,
body.mf-theme.obsidian-demo .tier-display-card.lux-satin-surface{
  box-shadow:
    0 1px 0 rgba(255,255,255,.02),
    0 18px 50px rgba(0,0,0,.34),
    0 26px 90px color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.08)) 24%, transparent);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-metric.lux-satin-surface,
body[data-lux-theme="light"].mf-theme.obsidian-demo .tier-display-card.lux-satin-surface{
  box-shadow:
    0 1px 0 rgba(255,255,255,.86),
    0 12px 26px rgba(52,39,21,.07),
    0 26px 70px color-mix(in srgb,var(--ps-glow, rgba(156,104,49,.06)) 20%, transparent);
}
@media (max-width:992px){
  body.mf-theme.obsidian-demo .main-content::before,
body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{inset:0; width:100vw;}
}

body.mf-theme.obsidian-demo .main-content > :not(.lux-depth-back):not(.lux-depth-front):not(.lux-plexus-back){position:relative;z-index:2;}
body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{position:fixed !important; left:var(--lux-sidebar-width,250px) !important; top:0 !important; right:0 !important; bottom:0 !important; z-index:1 !important;}
@media (max-width:992px){body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{left:0 !important;}}


/* ==============================================================
   Part 7 — Polished Clearcoat / high-gloss automotive finish
   The existing satin specular, feather comet, plexus and motion
   rendering are retained. This is a separate, cheap CSS layer.
   ============================================================== */

/* The comparison switch occupies the existing header controls; it does
   not change any data, navigation or palette UI. */
body.mf-theme.obsidian-demo .lux-polish-toggle{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:37px;min-width:69px;padding:7px 10px;white-space:nowrap;flex:0 0 auto;
  font-family:inherit;font-size:11px;font-weight:650;letter-spacing:.012em;
  color:#dec498;border:1px solid rgba(218,182,126,.34);border-radius:8px;
  background:linear-gradient(151deg,#29282b,#15171b 66%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.13),inset 0 -1px 0 rgba(0,0,0,.45),0 3px 14px rgba(0,0,0,.12);
  cursor:pointer;transition:border-color .2s,color .2s,box-shadow .24s;
}
body.mf-theme.obsidian-demo .lux-polish-toggle:hover{border-color:rgba(239,210,165,.65);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 3px 18px rgba(222,172,106,.12);}
body.mf-theme.obsidian-demo .lux-polish-toggle:focus-visible{outline:2px solid var(--ps-accent,#dcb77e);outline-offset:3px;}
body.mf-theme.obsidian-demo .lux-polish-toggle svg{width:14px;height:14px;flex:0 0 auto;}
body.mf-theme.obsidian-demo .lux-polish-toggle[aria-pressed="false"]{
  border-color:rgba(120,119,125,.27);color:#888d98;background:linear-gradient(145deg,#1b1e22,#111317);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-polish-toggle{
  color:var(--ps-text,#52483b);border-color:var(--ps-border,#d5c2a2);
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(238,232,220,.86));
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-polish-toggle[aria-pressed="false"]{color:#8c929d;}

/* New layer sits under real text and existing interactive descendants.
   No blur/backdrop-filter: the finish relies on reflections and contrast. */
body.mf-theme.obsidian-demo .lux-clearcoat{
  position:absolute;inset:0;display:block;overflow:hidden;border-radius:inherit;
  pointer-events:none !important;z-index:1;opacity:0;
  transition:opacity .42s ease;
  background:
    radial-gradient(ellipse 67% 89% at 13% -39%,rgba(255,255,255,.175) 0%,rgba(255,255,255,.042) 29%,rgba(255,255,255,0) 70%),
    radial-gradient(ellipse 28% 50% at 95% 106%,var(--ps-glow-strong,rgba(226,180,118,.10)),transparent 88%),
    linear-gradient(124deg,rgba(255,255,255,.065) 0%,rgba(255,255,255,.012) 28%,transparent 44%,rgba(255,255,255,.019) 73%,rgba(255,255,255,.075) 100%);
}
body.mf-theme.obsidian-demo.lux-polish-enabled .lux-clearcoat{opacity:1;}
body.mf-theme.obsidian-demo .lux-clearcoat::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.33),inset 1px 0 0 rgba(255,255,255,.12),inset -1px 0 0 rgba(255,255,255,.075),inset 0 -1px 0 rgba(0,0,0,.32);
  background:
    linear-gradient(112deg,rgba(255,255,255,.21) 0%,rgba(255,255,255,.025) 7%,transparent 24%) left top / 35% 52% no-repeat,
    linear-gradient(180deg,rgba(255,255,255,.07),transparent 82%) 0 0 / 100% 18% no-repeat;
}
/* A slim, high-intensity specular stripe crosses the clear-coat layer;
   transform-only compositor animation, staggered across existing metrics. */
body.mf-theme.obsidian-demo .lux-clearcoat::after{
  content:"";position:absolute;inset:-15% auto -15% 0;width:53%;height:130%;
  pointer-events:none;opacity:0;
  background:linear-gradient(111deg,
    transparent 19%,rgba(255,255,255,0) 32%,
    rgba(255,255,255,.025) 40%,
    rgba(255,255,255,.12) 46.5%,
    rgba(255,255,255,.29) 49.2%,
    rgba(255,255,255,.49) 50%,
    rgba(255,255,255,.24) 50.8%,
    rgba(255,255,255,.06) 54%,
    transparent 69%);
  transform:translate3d(-190%,0,0) skewX(-8deg);
  will-change:auto;
}
@keyframes lux-clearcoat-pass{
  0%,11%{transform:translate3d(-190%,0,0) skewX(-8deg);opacity:0;}
  17%{opacity:.86;}
  37%{transform:translate3d(270%,0,0) skewX(-8deg);opacity:.72;}
  42%,100%{transform:translate3d(270%,0,0) skewX(-8deg);opacity:0;}
}
body.mf-theme.obsidian-demo.lux-polish-enabled[data-lux-motion="on"]
  :is(.lux-hero,.mf-metric.lux-satin-surface) > .lux-clearcoat::after{
  animation:lux-clearcoat-pass 10.7s cubic-bezier(.2,.22,.24,1) infinite;
  will-change:transform;
}
body.mf-theme.obsidian-demo .lux-hero > .lux-clearcoat::after{animation-delay:-2.6s !important;animation-duration:11.8s !important;}
body.mf-theme.obsidian-demo .mf-metric:nth-child(1) > .lux-clearcoat::after{animation-delay:-4.7s !important;}
body.mf-theme.obsidian-demo .mf-metric:nth-child(2) > .lux-clearcoat::after{animation-delay:-7.3s !important;animation-duration:11.2s !important;}
body.mf-theme.obsidian-demo .mf-metric:nth-child(3) > .lux-clearcoat::after{animation-delay:-1.1s !important;}
body.mf-theme.obsidian-demo .mf-metric:nth-child(4) > .lux-clearcoat::after{animation-delay:-9.0s !important;animation-duration:12.4s !important;}
/* Panels and the inner membership card stay mostly static; a brief reflection
   occurs only on hover, avoiding unnecessary perpetual animations. */
body.mf-theme.obsidian-demo.lux-polish-enabled[data-lux-motion="on"]
  :is(.mf-panel.lux-satin-surface,.tier-display-card.lux-satin-surface):hover > .lux-clearcoat::after{
  animation:lux-clearcoat-pass 2.6s ease-out 1 both;
  will-change:transform;
}
/* Motion OFF pauses the traveling reflection but retains static clearcoat. */
body.mf-theme.obsidian-demo.lux-motion-off .lux-clearcoat::after{animation:none !important;opacity:0 !important;will-change:auto;}
body.mf-theme.obsidian-demo:not(.lux-polish-enabled) .lux-clearcoat{opacity:0 !important;}
body.mf-theme.obsidian-demo:not(.lux-polish-enabled) .lux-clearcoat::after{animation:none !important;will-change:auto;}

/* The hero's dark glass is the reference material: silver-white grazing
   illumination on one side, a controlled palette-color reflection on right. */
body.mf-theme.obsidian-demo .lux-hero > .lux-clearcoat{
  background:
    radial-gradient(ellipse 53% 115% at 8% -76%,rgba(255,255,255,.168),rgba(255,255,255,.048) 30%,transparent 72%),
    radial-gradient(ellipse 54% 75% at 93% 83%,var(--ps-glow-strong,rgba(231,184,118,.11)),transparent 76%),
    linear-gradient(119deg,rgba(255,255,255,.075),rgba(255,255,255,.010) 31%,transparent 47%,rgba(255,255,255,.032) 94%);
}
body.mf-theme.obsidian-demo.lux-polish-enabled .lux-hero{
  border-color:color-mix(in srgb,var(--ps-accent,#d9b985) 39%,var(--ps-border,#474037)) !important;
  box-shadow:0 18px 52px rgba(0,0,0,.38),0 34px 82px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.17) !important;
}
body.mf-theme.obsidian-demo.lux-polish-enabled .mf-metric.lux-satin-surface{
  box-shadow:0 9px 27px rgba(0,0,0,.23),0 21px 58px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.17) !important;
}
body.mf-theme.obsidian-demo.lux-polish-enabled :is(.mf-panel.lux-satin-surface,.tier-display-card.lux-satin-surface){
  box-shadow:0 14px 42px rgba(0,0,0,.28),0 29px 76px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.14) !important;
}
body.mf-theme.obsidian-demo.lux-polish-enabled .lux-central-glyph{
  box-shadow:inset 3px 4px 6px rgba(255,255,255,.23),inset -13px -14px 26px rgba(0,0,0,.47),0 15px 36px rgba(0,0,0,.24),0 0 26px var(--ps-glow-strong,rgba(231,183,117,.22)) !important;
}
body.mf-theme.obsidian-demo.lux-polish-enabled :is(.mf-button-primary,.lux-hero-primary){
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(0,0,0,.20),0 10px 28px var(--ps-glow,rgba(220,181,118,.18)) !important;
}
/* Prevent a bright white coat from washing out light themes. */
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-clearcoat{
  background:
    radial-gradient(ellipse 74% 85% at 11% -37%,rgba(255,255,255,.58),rgba(255,255,255,.07) 31%,transparent 75%),
    linear-gradient(127deg,rgba(255,255,255,.19),transparent 29%,rgba(80,95,116,.023) 85%,rgba(255,255,255,.20));
  opacity:0;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo.lux-polish-enabled .lux-clearcoat{opacity:.65;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-clearcoat::before{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 1px 0 0 rgba(255,255,255,.5),inset -1px 0 0 rgba(126,124,115,.08),inset 0 -1px 0 rgba(110,100,85,.11);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-clearcoat::after{opacity:.44;background:linear-gradient(111deg,transparent 22%,rgba(255,255,255,.04) 36%,rgba(255,255,255,.56) 49%,rgba(255,255,255,.86) 50%,rgba(255,255,255,.19) 53%,transparent 69%);}
body[data-lux-theme="light"].mf-theme.obsidian-demo.lux-polish-enabled .lux-hero,
body[data-lux-theme="light"].mf-theme.obsidian-demo.lux-polish-enabled :is(.mf-metric.lux-satin-surface,.mf-panel.lux-satin-surface){
  box-shadow:0 10px 29px rgba(38,42,50,.07),0 24px 65px rgba(60,71,84,.065),inset 0 1px 0 rgba(255,255,255,.98) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo.lux-polish-enabled .lux-hero{
  border-color:var(--ps-border,rgba(146,110,68,.22)) !important;
}
@media (max-width:992px){
  body.mf-theme.obsidian-demo .lux-polish-toggle{min-width:37px;width:37px;padding:7px;}
  body.mf-theme.obsidian-demo .lux-polish-toggle span{display:none;}
}



/* ============================================================
   Part 8 — Plexus Depth Boost v2
   Stronger volumetric haze, more readable plexus, richer glitter.
   ============================================================ */
body.mf-theme.obsidian-demo .main-content::before{
  background:
    radial-gradient(ellipse 760px 500px at 77% 15%, color-mix(in srgb,var(--ps-glow-strong, rgba(217,173,109,.18)) 72%, transparent) 0%, transparent 74%),
    radial-gradient(ellipse 420px 300px at 18% 70%, color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.11)) 62%, transparent) 0%, transparent 80%),
    radial-gradient(ellipse 520px 220px at 48% 86%, color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.06)) 45%, transparent) 0%, transparent 82%);
  opacity:.94;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content::before{opacity:.68;}
body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{
  opacity:1;
  filter:saturate(1.07) brightness(1.04);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-plexus-back{opacity:.82;}
body.mf-theme.obsidian-demo .main-content > .lux-depth-back{opacity:1 !important;}
body.mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.62 !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-depth-back{opacity:.84 !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.40 !important;}
body.mf-theme.obsidian-demo .lux-hero,
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface,
body.mf-theme.obsidian-demo .tier-display-card.lux-satin-surface{
  box-shadow:
    0 1px 0 rgba(255,255,255,.024),
    0 20px 55px rgba(0,0,0,.36),
    0 30px 105px color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.10)) 30%, transparent);
}


/* Cinematic Tech variant overrides */
body.mf-theme.obsidian-demo .main-content::before{opacity:.98 !important; background:
 radial-gradient(ellipse 820px 540px at 77% 14%, color-mix(in srgb,var(--ps-glow-strong, rgba(217,173,109,.19)) 78%, transparent) 0%, transparent 74%),
 radial-gradient(ellipse 460px 320px at 18% 70%, color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.12)) 66%, transparent) 0%, transparent 80%),
 radial-gradient(ellipse 610px 250px at 48% 86%, color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.08)) 55%, transparent) 0%, transparent 82%) !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content::before{opacity:.74 !important;}
body.mf-theme.obsidian-demo .main-content > .lux-plexus-back{opacity:1 !important; filter:saturate(1.11) brightness(1.06) !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-plexus-back{opacity:.88 !important;}
body.mf-theme.obsidian-demo .main-content > .lux-depth-back{opacity:1 !important;}
body.mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.74 !important;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .main-content > .lux-depth-front{opacity:.48 !important;}
body.mf-theme.obsidian-demo .lux-hero,
body.mf-theme.obsidian-demo .mf-panel.lux-satin-surface,
body.mf-theme.obsidian-demo .mf-metric.lux-satin-surface,
body.mf-theme.obsidian-demo .tier-display-card.lux-satin-surface{box-shadow:
 0 1px 0 rgba(255,255,255,.03),
 0 22px 60px rgba(0,0,0,.38),
 0 34px 116px color-mix(in srgb,var(--ps-glow, rgba(217,173,109,.12)) 34%, transparent) !important;}


/* ===== Signature materials and optics ===== */
/* SOURCE STYLE BLOCK 07 */

/* ============================================================
   Obsidian Signature V1 — luxury material & typography system
   ============================================================ */

body.mf-theme.obsidian-demo,
body.mf-theme.obsidian-demo button,
body.mf-theme.obsidian-demo input,
body.mf-theme.obsidian-demo select,
body.mf-theme.obsidian-demo textarea{font-feature-settings:"cv02" 1,"cv03" 1,"tnum" 1,"ss01" 1;}
body.mf-theme.obsidian-demo h1,
body.mf-theme.obsidian-demo h2,
body.mf-theme.obsidian-demo h3,
body.mf-theme.obsidian-demo .lux-heading,
body.mf-theme.obsidian-demo .mf-page-heading strong{
  letter-spacing:-.024em;
  font-weight:700;
}
body.mf-theme.obsidian-demo :is(.metric-value,.metric-trend strong,.mf-quick-stat strong,.tier-price,.capacity-value,.service-figure,.summary-value,.rank-card-value,.loyalty-points strong,.loyalty-panel strong){
  font-family:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  font-variant-numeric:tabular-nums slashed-zero;
  letter-spacing:-.02em;
}
body.mf-theme.obsidian-demo .dashboard-container{backdrop-filter:none;}

/* Sidebar */
body.mf-theme.obsidian-demo .sidebar{
  background:
    linear-gradient(180deg, rgba(17,18,23,.98), rgba(13,14,18,.98)),
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.05), transparent 18%);
  border-right:1px solid rgba(255,255,255,.055);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.03), 18px 0 40px rgba(0,0,0,.18);
}
body.mf-theme.obsidian-demo .sidebar::before{
  content:"";position:absolute;inset:0 0 auto 0;height:108px;pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
  opacity:.45;
}
body.mf-theme.obsidian-demo .brand{
  padding:14px 14px 16px;border:1px solid rgba(255,255,255,.065);border-radius:16px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 12px 30px rgba(0,0,0,.18);
}
body.mf-theme.obsidian-demo .brand > span:nth-child(2){letter-spacing:.14em;font-size:13px;font-weight:700;}
body.mf-theme.obsidian-demo .mf-brand-caption{
  border:1px solid rgba(239,217,180,.24);
  background:linear-gradient(180deg, rgba(244,221,184,.10), rgba(244,221,184,.03));
  color:#e9d7b7;
  font-size:10px; letter-spacing:.18em; text-transform:uppercase; font-weight:700;
  padding:3px 7px; border-radius:999px;
}
body.mf-theme.obsidian-demo .mf-nav-label{
  font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:#8f8a80; font-weight:700;
  margin:18px 8px 10px;
}
body.mf-theme.obsidian-demo .mf-nav-search{
  border-radius:14px; border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.014));
}
body.mf-theme.obsidian-demo .sidebar nav{padding-right:2px;}
body.mf-theme.obsidian-demo .sidebar nav .nav-item{
  min-height:46px; border-radius:14px; margin:2px 0; gap:11px;
  color:#d9d3c9; border:1px solid transparent; position:relative;
  transition:background .22s ease,border-color .22s ease,color .22s ease,transform .22s ease, box-shadow .22s ease;
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item svg{
  width:18px;height:18px; padding:8px; box-sizing:content-box;
  border-radius:12px; border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item:hover{
  transform:translateX(2px); color:#f4ecdd; border-color:rgba(255,255,255,.05);
  background:linear-gradient(90deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  color:#fff7ea; border-color:rgba(236,214,176,.22);
  background:linear-gradient(90deg, rgba(233,213,178,.10), rgba(255,255,255,.028));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 8px 24px rgba(0,0,0,.16);
}
body.mf-theme.obsidian-demo .sidebar nav .nav-item.active::before{
  content:""; position:absolute; left:-1px; top:8px; bottom:8px; width:2px; border-radius:3px;
  background:linear-gradient(180deg, rgba(246,225,192,.10), rgba(246,225,192,.92), rgba(246,225,192,.24));
  box-shadow:0 0 14px rgba(244,218,182,.28);
}
body.mf-theme.obsidian-demo .sidebar-footer{padding-top:10px;border-top:1px solid rgba(255,255,255,.05);}
body.mf-theme.obsidian-demo .mf-sidebar-account,
body.mf-theme.obsidian-demo .sidebar-footer .logout-btn{
  border-radius:14px !important; border:1px solid rgba(255,255,255,.06) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.012)) !important;
}

/* Header & controls */
body.mf-theme.obsidian-demo .dashboard-header{
  padding-bottom:18px; margin-bottom:10px; border-bottom:1px solid rgba(255,255,255,.055);
}
body.mf-theme.obsidian-demo .mf-page-heading h1,
body.mf-theme.obsidian-demo .mf-page-heading strong{
  font-size:clamp(24px, 2vw, 31px); line-height:1.02; color:#f5efe5;
}
body.mf-theme.obsidian-demo .mf-page-heading p{color:#b5ac9c; max-width:62ch;}
body.mf-theme.obsidian-demo .lux-demo-pill{
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  color:#d8d2c7;
}
body.mf-theme.obsidian-demo .lux-motion-toggle,
body.mf-theme.obsidian-demo .lux-theme-control{
  border-radius:999px;
  border:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.014));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 24px rgba(0,0,0,.16);
}
body.mf-theme.obsidian-demo .mf-button,
body.mf-theme.obsidian-demo .lux-hero-primary,
body.mf-theme.obsidian-demo .header-actions > a.neu-btn{
  border-radius:14px !important;
  min-height:40px;
  border-color:rgba(255,255,255,.07) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 10px 20px rgba(0,0,0,.16);
}
body.mf-theme.obsidian-demo .mf-button-primary,
body.mf-theme.obsidian-demo .lux-hero-primary{
  background:linear-gradient(145deg,#f0d9b1,#c99e63 56%,#a67843) !important;
  color:#1b140d !important;
  border-color:rgba(248,230,199,.52) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 12px 28px rgba(171,120,64,.28) !important;
}
body.mf-theme.obsidian-demo .mf-button:not(.mf-button-primary):hover,
body.mf-theme.obsidian-demo .lux-theme-control:hover,
body.mf-theme.obsidian-demo .lux-motion-toggle:hover{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)) !important;
  color:#f7f0e5;
}

/* Tabs */
body.mf-theme.obsidian-demo .mf-view-tabs{
  border:1px solid rgba(255,255,255,.05);
  background:linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.010));
  border-radius:16px; padding:6px; box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
body.mf-theme.obsidian-demo .mf-view-tabs a{
  border-radius:12px; color:#bfb5a7; padding-inline:14px;
}
body.mf-theme.obsidian-demo .mf-view-tabs a.is-active{
  background:linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.018));
  color:#f2e8d8; border:1px solid rgba(236,214,176,.15);
}

/* Signature surfaces */
body.mf-theme.obsidian-demo :is(.lux-hero,.mf-capacity-panel,#mf-loyalty,.mf-recent-panel,.mf-panel,.mf-metric,.tier-display-card,.mf-helper-note,.mf-sidebar-account){
  position:relative; overflow:hidden;
}
body.mf-theme.obsidian-demo :is(.lux-hero,.mf-panel.lux-satin-surface,.mf-metric.lux-satin-surface,.tier-display-card.lux-satin-surface){
  border:1px solid var(--sig-line) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    linear-gradient(180deg, rgba(8,9,12,.52), rgba(16,17,21,.12)),
    linear-gradient(180deg, rgba(21,23,29,.94), rgba(14,16,20,.96)) !important;
  box-shadow:var(--sig-shadow), inset 0 1px 0 rgba(255,255,255,.045) !important;
  border-radius:18px !important;
}
body.mf-theme.obsidian-demo :is(.lux-hero,.mf-panel.lux-satin-surface,.mf-metric.lux-satin-surface,.tier-display-card.lux-satin-surface)::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:var(--sig-shine); opacity:.52; mix-blend-mode:screen;
}
body.mf-theme.obsidian-demo :is(.lux-hero,.mf-panel.lux-satin-surface,.mf-metric.lux-satin-surface,.tier-display-card.lux-satin-surface)::after{
  content:""; position:absolute; inset:1px; border-radius:inherit; pointer-events:none;
  border:1px solid rgba(255,255,255,.035);
  mask:linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.05));
}
body.mf-theme.obsidian-demo .lux-hero{
  min-height:292px;
  background:
    linear-gradient(120deg, rgba(255,255,255,.05), rgba(255,255,255,0) 32%),
    radial-gradient(circle at 88% 18%, rgba(255,231,198,.12), transparent 20%),
    linear-gradient(180deg, rgba(25,26,31,.96), rgba(15,16,20,.98)) !important;
}
body.mf-theme.obsidian-demo .mf-capacity-panel,
body.mf-theme.obsidian-demo #mf-loyalty{
  border-color:rgba(236,214,176,.20) !important;
}
body.mf-theme.obsidian-demo .mf-recent-panel,
body.mf-theme.obsidian-demo .mf-secondary-column .mf-panel{
  background:
    linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.010)),
    linear-gradient(180deg, rgba(17,19,24,.96), rgba(12,13,17,.98)) !important;
}
body.mf-theme.obsidian-demo .mf-metric{
  min-height:136px;
}
body.mf-theme.obsidian-demo .mf-metric .metric-label,
body.mf-theme.obsidian-demo .lux-eyebrow,
body.mf-theme.obsidian-demo .lux-heading-overline,
body.mf-theme.obsidian-demo .mf-panel h2,
body.mf-theme.obsidian-demo .panel-heading small,
body.mf-theme.obsidian-demo .mf-helper-note strong{
  text-transform:uppercase; letter-spacing:.16em; font-size:11px; font-weight:700;
}
body.mf-theme.obsidian-demo .metric-label{color:#9d9588;}
body.mf-theme.obsidian-demo .metric-value{font-size:28px; color:#f8f0e2;}
body.mf-theme.obsidian-demo .metric-trend{color:#c9b99d;}
body.mf-theme.obsidian-demo .panel-heading h2,
body.mf-theme.obsidian-demo .lux-hero-copy h2,
body.mf-theme.obsidian-demo .lux-heading{color:#f6efe4;}
body.mf-theme.obsidian-demo .lux-hero-copy p,
body.mf-theme.obsidian-demo .mf-panel p,
body.mf-theme.obsidian-demo .mf-helper-note{color:#b6ac9d;}
body.mf-theme.obsidian-demo .lux-art-caption,
body.mf-theme.obsidian-demo .lux-art .lux-central-glyph span{color:#c8b590;}

/* Capacity & lists */
body.mf-theme.obsidian-demo :is(.mf-service-row,.mf-transaction-row,.mf-quick-links a,.rank-card-item,.tier-display-card){
  border-radius:14px !important; border:1px solid rgba(255,255,255,.05) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.026), rgba(255,255,255,.010)) !important;
}
body.mf-theme.obsidian-demo :is(.mf-service-row,.mf-transaction-row,.mf-quick-links a,.rank-card-item,.tier-display-card):hover{
  border-color:rgba(236,214,176,.17) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)) !important;
}
body.mf-theme.obsidian-demo .mf-progress-track{
  border:1px solid rgba(255,255,255,.05); background:rgba(255,255,255,.025);
}
body.mf-theme.obsidian-demo .mf-progress-fill{box-shadow:0 0 18px rgba(233,205,164,.25);}

/* Light theme tuning */
body[data-lux-theme="light"].mf-theme.obsidian-demo{
  --sig-text:#2d1c12; --sig-muted:#6d5949;
  background:linear-gradient(180deg,#f7f3ec,#efe7dc 42%,#f4ede4);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar{
  background:linear-gradient(180deg, rgba(248,243,235,.96), rgba(239,231,220,.96));
  border-right-color:rgba(84,61,39,.08);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.45), 16px 0 32px rgba(99,74,44,.05);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .brand,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-nav-search,
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item svg,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-sidebar-account,
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar-footer .logout-btn,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-view-tabs,
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-motion-toggle,
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-theme-control,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-button,
body[data-lux-theme="light"].mf-theme.obsidian-demo .header-actions > a.neu-btn{
  border-color:rgba(83,61,38,.10) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.38)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.78), 0 10px 18px rgba(96,72,40,.08);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sidebar nav .nav-item.active{
  color:#392514; border-color:rgba(156,110,58,.18);
  background:linear-gradient(90deg, rgba(223,190,144,.20), rgba(255,255,255,.55));
}
body[data-lux-theme="light"].mf-theme.obsidian-demo :is(.lux-hero,.mf-panel.lux-satin-surface,.mf-metric.lux-satin-surface,.tier-display-card.lux-satin-surface){
  border-color:rgba(109,82,53,.12) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.54)),
    linear-gradient(180deg, rgba(245,239,231,.96), rgba(235,226,214,.98)) !important;
  box-shadow:0 18px 38px rgba(102,77,44,.08), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .metric-label,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-page-heading p,
body[data-lux-theme="light"].mf-theme.obsidian-demo .lux-hero-copy p,
body[data-lux-theme="light"].mf-theme.obsidian-demo .mf-panel p{color:#715d4d;}

@media (max-width: 992px){
  body.mf-theme.obsidian-demo .brand{padding:12px 12px 14px;}
  body.mf-theme.obsidian-demo .sidebar nav .nav-item{min-height:44px;}
  body.mf-theme.obsidian-demo .dashboard-header{padding-bottom:14px;}
}



/* SOURCE STYLE BLOCK 08 */

/* USKOBOT — Obsidian Signature V1.1 / adaptive compact sidebar.
   Presentation-only corrections. No changes to navigation or business logic. */
@media (min-width:993px){
  body.mf-theme.obsidian-demo .sidebar{
    padding-top:18px !important;
    padding-bottom:12px !important;
    padding-left:13px !important;
    padding-right:13px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .brand{
    min-height:43px !important;
    height:43px !important;
    padding:4px 7px !important;
    margin:0 5px 12px !important;
    gap:8px !important;
    border-radius:12px !important;
    flex-shrink:0 !important;
  }
  body.mf-theme.obsidian-demo .sidebar .brand .mf-brand-mark{
    width:30px !important;
    height:30px !important;
    flex:0 0 30px !important;
    border-radius:9px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .brand > span:nth-child(2){
    font-size:12.5px !important;
    letter-spacing:.11em !important;
    white-space:nowrap;
  }
  body.mf-theme.obsidian-demo .sidebar .brand .mf-brand-caption{
    font-size:9px !important;
    letter-spacing:.1em !important;
    padding:2px 5px !important;
    flex-shrink:0;
  }
  body.mf-theme.obsidian-demo .sidebar .mf-nav-search{
    min-height:35px !important;
    height:35px !important;
    margin:0 2px 9px !important;
    padding:0 10px !important;
    border-radius:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .mf-nav-search input{
    font-size:12px !important;
    min-width:0;
  }
  body.mf-theme.obsidian-demo .sidebar > .mf-nav-label{
    font-size:9.5px !important;
    margin:9px 8px 6px !important;
    line-height:12px !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav{
    min-height:0 !important;
    overflow-y:auto !important;
    padding-right:2px !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav .mf-nav-label{
    margin:12px 8px 5px !important;
    font-size:9.5px !important;
    line-height:12px !important;
    min-height:12px;
  }
  body.mf-theme.obsidian-demo .sidebar nav .nav-item{
    min-height:43px !important;
    height:43px !important;
    padding:5px 9px !important;
    margin:1px 0 !important;
    gap:9px !important;
    border-radius:11px !important;
    font-size:12.4px !important;
    flex-shrink:0;
    line-height:1.28 !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav .nav-item svg{
    width:15px !important;
    height:15px !important;
    padding:5px !important;
    flex:0 0 15px !important;
    border-radius:8px !important;
    stroke-width:1.65;
  }
  body.mf-theme.obsidian-demo .sidebar-footer{
    padding-top:7px !important;
    flex-shrink:0 !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-sidebar-account{
    min-height:47px !important;
    height:47px !important;
    padding:7px 8px !important;
    margin-bottom:6px !important;
    gap:8px !important;
    border-radius:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-small-avatar{
    width:30px !important;
    height:30px !important;
    flex:0 0 30px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-sidebar-account > div{
    min-width:0;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-sidebar-account > div small{
    display:block;
    max-width:100%;
    font-size:10px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .logout-btn{
    min-height:35px !important;
    height:35px !important;
    padding:5px 9px !important;
    margin:0 !important;
    gap:9px !important;
    font-size:12.2px !important;
    border-radius:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .logout-btn svg{
    width:16px !important;
    height:16px !important;
    flex:0 0 16px !important;
  }
}
@media (min-width:993px) and (max-height:820px){
  body.mf-theme.obsidian-demo .sidebar{
    padding-top:11px !important;
    padding-bottom:9px !important;
    padding-left:11px !important;
    padding-right:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .brand{
    height:39px !important;
    min-height:39px !important;
    margin-bottom:7px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .brand .mf-brand-mark{
    width:28px !important;
    height:28px !important;
    flex-basis:28px !important;
  }
  body.mf-theme.obsidian-demo .sidebar .mf-nav-search{
    min-height:32px !important;
    height:32px !important;
    margin-bottom:5px !important;
  }
  body.mf-theme.obsidian-demo .sidebar > .mf-nav-label{
    margin:6px 8px 3px !important;
    font-size:9px !important;
    line-height:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav .mf-nav-label{
    margin:7px 8px 3px !important;
    font-size:9px !important;
    line-height:11px !important;
    min-height:11px !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav .nav-item{
    height:38px !important;
    min-height:38px !important;
    padding:4px 8px !important;
    margin:1px 0 !important;
    gap:8px !important;
    font-size:12px !important;
    border-radius:10px !important;
  }
  body.mf-theme.obsidian-demo .sidebar nav .nav-item svg{
    width:14px !important;
    height:14px !important;
    padding:4px !important;
    flex-basis:14px !important;
    border-radius:7px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer{
    padding-top:5px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-sidebar-account{
    height:42px !important;
    min-height:42px !important;
    padding:5px 8px !important;
    margin-bottom:4px !important;
    gap:7px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .mf-small-avatar{
    height:28px !important;
    width:28px !important;
    flex-basis:28px !important;
  }
  body.mf-theme.obsidian-demo .sidebar-footer .logout-btn{
    height:32px !important;
    min-height:32px !important;
    padding:4px 8px !important;
    font-size:11.8px !important;
  }
}




/* SOURCE STYLE BLOCK 09 */

/* V1.2 — navigation tabs and hero: exactly +4px separation. */
body.mf-theme.obsidian-demo .mf-view-tabs + .lux-hero{ margin-top:4px !important; }



/* SOURCE STYLE BLOCK 10 */

/* Obsidian Signature V1.3 — combined approved features: 01 + 02 + 03 */
body.mf-theme.obsidian-demo .lux-demo-pill.signature-combined{order:-1;}



/* SOURCE STYLE BLOCK 11 */



/* Each comparison variant changes one visual language experiment only. */
body.mf-theme.obsidian-demo [class^="sig-"]{ box-sizing: border-box; }



body.mf-theme.obsidian-demo .sig-etched-surface{ position:relative !important; }
body.mf-theme.obsidian-demo .sig-etched-overlay{
 position:absolute; inset:0; z-index:16; overflow:hidden; border-radius:inherit;
 pointer-events:none; display:block; opacity:.97;
}
body.mf-theme.obsidian-demo .sig-etched-overlay::before{
 content:""; position:absolute; inset:0; border-radius:inherit;
 background:
  repeating-linear-gradient(90deg,transparent 0px,transparent 9px, rgba(250,231,190,.19) 10px, transparent 11px) left 18px top 13px/152px 5px no-repeat,
  repeating-linear-gradient(0deg,transparent 0px,transparent 9px, rgba(232,218,186,.15) 10px, transparent 11px) right 12px top 38px/5px 112px no-repeat,
  linear-gradient(90deg,rgba(250,239,208,.27),transparent 26%,transparent 74%,rgba(244,229,194,.12)) top left / 100% 1px no-repeat,
  linear-gradient(180deg,rgba(244,226,194,.13),transparent 28%) top left / 1px 100% no-repeat,
  linear-gradient(90deg, transparent 0,rgba(253,236,202,.28) 20%,rgba(255,255,255,.08) 44%,transparent 78%) left 17px bottom 20px / 118px 1px no-repeat;
 opacity:.85;
}
body.mf-theme.obsidian-demo .sig-etched-overlay::after{
 content:attr(data-serial); position:absolute; right:16px; bottom:12px;
 font:600 9px/1 "Consolas","Courier New",monospace; letter-spacing:.19em;
 color:rgba(230,208,170,.48); text-shadow:0 1px 0 rgba(0,0,0,.8);
}
body.mf-theme.obsidian-demo .sig-etched-overlay .sig-etched-corner{
 display:block; position:absolute; left:14px; top:12px; width:7px;height:7px;
 border-top:1px solid rgba(250,226,190,.58); border-left:1px solid rgba(250,226,190,.58);
 filter:drop-shadow(0 0 2px rgba(246,214,165,.20));
}
body.mf-theme.obsidian-demo .sig-etched-overlay .sig-etched-rule{
 display:block;position:absolute;right:14px;bottom:14px;width:7px;height:7px;
 border-right:1px solid rgba(250,226,190,.38); border-bottom:1px solid rgba(250,226,190,.38);
}
body.mf-theme.obsidian-demo .mf-panel-heading h3{letter-spacing:.035em;}
body.mf-theme.obsidian-demo .mf-panel-heading h3::before{
 content:"⌁";font:400 15px/1 Georgia,serif;color:rgba(238,212,174,.64);margin-right:9px;
}
body.mf-theme.obsidian-demo .mf-metric.sig-etched-surface .sig-etched-overlay::after{bottom:10px;right:10px;opacity:.7;}
body.mf-theme.obsidian-demo .lux-hero.sig-etched-surface .sig-etched-overlay::after{bottom:12px;left:26px;right:auto;}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sig-etched-overlay{filter:invert(.72) sepia(.19);opacity:.64;}





/* SOURCE STYLE BLOCK 12 */



/* Each comparison variant changes one visual language experiment only. */
body.mf-theme.obsidian-demo [class^="sig-"]{ box-sizing: border-box; }



body.mf-theme.obsidian-demo .sig-optic-target{--sig-edge-x:79%;--sig-edge-y:3%;}
body.mf-theme.obsidian-demo .sig-optic-rim{
 display:block; position:absolute; z-index:16; inset:0;pointer-events:none;
 border:1.5px solid transparent; border-radius:inherit;
 background:
  radial-gradient(ellipse 240px 178px at var(--sig-edge-x,79%) var(--sig-edge-y,3%),
   rgba(255,255,255,.98) 0%,rgba(248,227,189,.84) 10%,rgba(244,204,147,.39) 30%,rgba(251,235,208,.10) 61%,transparent 78%),
  linear-gradient(115deg,rgba(245,225,192,.36),rgba(244,220,177,.06) 26%,transparent 60%,rgba(232,212,176,.12));
 -webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
 -webkit-mask-composite:xor;
 mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);
 mask-composite:exclude;
 filter:drop-shadow(0 0 6px rgba(240,206,152,.16));
 opacity:.85; transition:opacity .26s ease;
}
body.mf-theme.obsidian-demo .sig-optic-target:hover > .sig-optic-rim{
 opacity:1;
 border-width:2px;
 filter:drop-shadow(0 0 10px rgba(246,222,179,.27));
}
body.mf-theme.obsidian-demo .sig-optic-target > .sig-optic-flare{
 position:absolute;z-index:16;left:var(--sig-edge-x,79%);top:1px;
 width:118px;height:3px;transform:translate(-50%,-50%);
 border-radius:999px;pointer-events:none;opacity:.64;
 background:linear-gradient(90deg,transparent,rgba(238,214,174,.24),rgba(255,255,255,.93),rgba(238,214,174,.24),transparent);
 box-shadow:0 0 11px rgba(245,215,174,.28), 0 0 22px rgba(225,178,113,.12);
 transition:opacity .25s ease;
}
body.mf-theme.obsidian-demo .sig-optic-target:hover > .sig-optic-flare{opacity:1;}
body.mf-theme.obsidian-demo .sig-optic-target::before{
 box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
}
body[data-lux-theme="light"].mf-theme.obsidian-demo .sig-optic-rim{
 opacity:.72;
 filter:sepia(.12);
}


body[data-lux-motion="off"].mf-theme.obsidian-demo .sig-optic-rim,
body[data-lux-motion="off"].mf-theme.obsidian-demo .sig-optic-flare{opacity:.14 !important;transition:none !important;}





/* SOURCE STYLE BLOCK 13 */



/* Each comparison variant changes one visual language experiment only. */
body.mf-theme.obsidian-demo [class^="sig-"]{ box-sizing: border-box; }



@keyframes sig-sequence-rise {
 0%{transform:translate3d(0,17px,0) scale(.988);opacity:.16;filter:blur(3px);}
 68%{transform:translate3d(0,-1px,0) scale(1.002);opacity:1;filter:blur(0);}
 100%{transform:translate3d(0,0,0) scale(1);opacity:1;filter:blur(0);}
}
@keyframes sig-sequence-reveal{
 0%{transform:translate3d(-18px,0,0);opacity:0;filter:blur(2px);}
 100%{transform:translate3d(0,0,0);opacity:1;filter:blur(0);}
}
@keyframes sig-sequence-highlight {
 0% {opacity:0;transform:scaleX(.2);}
 48% {opacity:.8;}
 100%{opacity:0;transform:scaleX(1);}
}
body.sig-choreography-play[data-lux-motion="on"] .sig-stage{
 animation:sig-sequence-rise 790ms cubic-bezier(.17,.70,.24,1) both;
 animation-delay:var(--sig-delay,0ms);
 will-change:transform,opacity;
}
body.sig-choreography-play[data-lux-motion="on"] .sig-stage.sig-stage-side{
 animation-name:sig-sequence-reveal;
}
body.mf-theme.obsidian-demo .sig-replay{
 display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;min-height:32px;
 color:var(--ps-text,#eadac4);font-size:11px;font-weight:700;letter-spacing:.045em;
 padding:7px 10px;border-radius:13px;border:1px solid rgba(230,204,160,.23);
 background:linear-gradient(180deg,rgba(247,224,181,.095),rgba(240,209,166,.025));
 box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 5px 14px rgba(0,0,0,.12);
 cursor:pointer;white-space:nowrap;
}
body.mf-theme.obsidian-demo .sig-replay:hover{
 border-color:rgba(243,215,174,.52);background:rgba(243,215,174,.12);
}
body.mf-theme.obsidian-demo .sig-replay:focus-visible{outline:2px solid var(--ps-accent,#eac996);outline-offset:3px;}
body.mf-theme.obsidian-demo .sig-replay svg{width:13px;height:13px;}
body[data-lux-motion="off"].sig-choreography-play .sig-stage{animation:none!important;}

@media (max-width:1420px){body.mf-theme.obsidian-demo .sig-replay{font-size:0;width:30px;justify-content:center;padding:6px;}}


/* ===== Optical details and heartbeat ===== */
/* SOURCE STYLE BLOCK 14 */

/* USKOBOT — Signature Detail Studies. Purely decorative and opt-in. */
body.mf-theme.obsidian-demo .sd-deco{box-sizing:border-box;pointer-events:none;user-select:none;}
body.mf-theme.obsidian-demo .sd-host{position:relative;}
body.mf-theme.obsidian-demo .sd-deco svg{display:block;width:100%;height:100%;}



/* SOURCE STYLE BLOCK 15 */

/* B — Optical glint tracks, refined separators and calibrated button optics */
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn{
 position:relative;isolation:isolate;overflow:hidden;
 --sd-x:50%; --sd-y:50%;
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-button-glass{
 position:absolute;z-index:8;inset:0;border-radius:inherit;opacity:.55;
 background:
   radial-gradient(ellipse 58px 80px at var(--sd-x) 0%,rgba(255,255,255,.38),transparent 82%),
   linear-gradient(119deg,transparent 20%,rgba(255,255,255,.02) 37%,rgba(255,255,255,.17) 46%,rgba(255,255,255,.025) 54%,transparent 69%);
 transform:translateX(-56%);transition:transform .65s cubic-bezier(.16,.7,.24,1),opacity .35s ease;
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn:hover .sd-op-button-glass,
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn:focus-visible .sd-op-button-glass{
 transform:translateX(56%);opacity:1;
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-button-rim{
 position:absolute;z-index:9;top:1px;left:14px;right:14px;height:1px;
 background:linear-gradient(90deg,transparent,rgba(255,255,255,.76) 47%,rgba(243,207,152,.56),transparent);
 opacity:.55;filter:drop-shadow(0 0 4px rgba(255,255,255,.35));
 transition:opacity .2s ease;
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn:hover .sd-op-button-rim{opacity:1;}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn:active{transform:translateY(1px);}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-corner{
 position:absolute;z-index:19;top:7px;right:10px;width:18px;height:18px;opacity:.66;
 border-top:1px solid rgba(255,239,207,.76);border-right:1px solid rgba(255,239,207,.76);
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-corner::after{
 content:"";position:absolute;right:5px;top:5px;width:3px;height:3px;
 background:rgba(255,245,221,.86);transform:rotate(45deg);box-shadow:0 0 8px rgba(255,215,165,.45);
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-tracker{
 position:absolute;z-index:19;left:14px;right:14px;bottom:11px;height:5px;opacity:.62;
 background:
 linear-gradient(90deg,rgba(242,209,153,.5),rgba(255,255,255,.06) 30%,transparent 67%,rgba(249,226,177,.28)) left center/100% 1px no-repeat,
 repeating-linear-gradient(90deg,rgba(236,213,167,.65) 0 1px,transparent 1px 10px) right center/80px 5px no-repeat;
 transition:opacity .3s ease;
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-tracker::before{
 content:"";position:absolute;left:0;top:1px;width:3px;height:3px;background:rgba(255,226,173,.87);transform:rotate(45deg);
}
body.sd-study-optical.mf-theme.obsidian-demo .mf-metric:hover .sd-op-tracker{opacity:1;}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-divider{
 position:absolute;z-index:19;left:20px;right:20px;top:49px;height:1px;
 background:linear-gradient(90deg,rgba(248,222,175,.49),rgba(255,255,255,.13) 20%,transparent 75%,rgba(241,214,160,.42));
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-divider::before{
 content:"◆";font:8px Georgia,serif;position:absolute;left:24%;top:-5px;color:rgba(248,223,184,.8);
 text-shadow:0 0 5px rgba(239,187,118,.26);
}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-side-trace{
 position:absolute;z-index:18;left:13px;top:60px;bottom:27px;width:9px;
 background:
 repeating-linear-gradient(0deg,rgba(239,205,149,.47) 0 1px,transparent 1px 15px) center/5px 100% no-repeat,
 linear-gradient(180deg,transparent,rgba(250,221,172,.3) 20%,rgba(250,221,172,.3) 80%,transparent) left/1px 100% no-repeat;
 opacity:.5;
}
body.sd-study-optical.mf-theme.obsidian-demo .lux-hero .sd-op-side-trace{top:38px;bottom:35px;left:12px;}
body.sd-study-optical.mf-theme.obsidian-demo .lux-hero .sd-op-corner{top:17px;right:17px;width:26px;height:26px;}
body.sd-study-optical.mf-theme.obsidian-demo .mf-panel:hover .sd-op-divider{filter:drop-shadow(0 0 5px rgba(235,195,129,.30));}
body.sd-study-optical.mf-theme.obsidian-demo .mf-metric .sd-op-corner{right:12px;top:10px;}
body.sd-study-optical.mf-theme.obsidian-demo .sd-op-btn:focus-visible{outline:1px solid rgba(241,211,159,.85);outline-offset:3px;}
body[data-lux-motion="off"].sd-study-optical.mf-theme.obsidian-demo .sd-op-button-glass{transition:none!important;transform:none!important;}

@media (max-width:860px){body.sd-study-optical.mf-theme.obsidian-demo .sd-op-side-trace{display:none;}}


/* SOURCE STYLE BLOCK 16 */

/* Optical Plus — varied identity marks + count-up telemetry */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-code,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-rail,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-anchor{position:absolute;pointer-events:none;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-code{
  z-index:18; left:18px; bottom:11px; display:flex; align-items:center; gap:8px;
  color:rgba(227,205,170,.56); font:600 8px/1 Consolas,monospace; letter-spacing:.18em;
  text-transform:uppercase;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-code::before{
  content:""; width:16px; height:1px; background:linear-gradient(90deg, rgba(243,210,157,.75), transparent);
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-rail{
  z-index:18; left:20px; right:20px; top:48px; height:1px;
  background:linear-gradient(90deg, rgba(244,217,166,.45), rgba(255,255,255,.11) 24%, transparent 76%, rgba(244,217,166,.22));
  opacity:.8;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-rail::after{
  content:""; position:absolute; left:var(--sig-mark,28%); top:-2px; width:5px; height:5px; transform:rotate(45deg);
  background:rgba(248,224,183,.85); box-shadow:0 0 8px rgba(245,200,131,.25);
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner{
  z-index:18; top:8px; right:10px; width:34px; height:34px; opacity:.90;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="tri"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="tri"]::after,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="sq"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="sq"]::after,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="diamond"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="diamond"]::after,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="circle"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="circle"]::after,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="hex"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="hex"]::after,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="cross"]::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="cross"]::after{content:"";position:absolute;display:block;}
/* triangle */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="tri"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="tri"]::before{right:5px;top:6px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:9px solid rgba(251,232,200,.72);transform:rotate(90deg);filter:drop-shadow(0 0 5px rgba(241,193,120,.25));}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="tri"]::after{right:16px;top:16px;width:7px;height:1px;background:rgba(248,223,180,.5);transform:rotate(-45deg);}
/* square */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="sq"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="sq"]::before{right:6px;top:6px;width:8px;height:8px;border:1px solid rgba(251,232,200,.8); box-shadow:0 0 0 1px rgba(251,232,200,.15) inset;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="sq"]::after{right:10px;top:10px;width:2px;height:2px;background:rgba(251,232,200,.9);}
/* diamond */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="diamond"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="diamond"]::before{right:7px;top:7px;width:7px;height:7px;background:transparent;border:1px solid rgba(251,232,200,.84);transform:rotate(45deg);box-shadow:0 0 8px rgba(241,193,120,.18);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="diamond"]::after{right:10px;top:10px;width:1px;height:1px;background:rgba(251,232,200,.9);}
/* circle */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="circle"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="circle"]::before{right:5px;top:5px;width:10px;height:10px;border:1px solid rgba(251,232,200,.84);border-radius:50%;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="circle"]::after{right:9px;top:9px;width:2px;height:2px;border-radius:50%;background:rgba(251,232,200,.92);}
/* hex */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="hex"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="hex"]::before{right:4px;top:5px;width:12px;height:10px;background:rgba(0,0,0,0);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);border:1px solid rgba(251,232,200,.82);box-sizing:border-box;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="hex"]::after{right:10px;top:9px;width:2px;height:2px;background:rgba(251,232,200,.92);border-radius:50%;}
/* cross */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="cross"]{border-top:1px solid rgba(247,229,197,.52);border-right:1px solid rgba(247,229,197,.52);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="cross"]::before{right:6px;top:10px;width:10px;height:1px;background:rgba(251,232,200,.82); box-shadow:0 -4px 0 0 rgba(251,232,200,.12),0 4px 0 0 rgba(251,232,200,.12);}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner[data-shape="cross"]::after{right:10px;top:6px;width:1px;height:10px;background:rgba(251,232,200,.82); box-shadow:-4px 0 0 0 rgba(251,232,200,.12),4px 0 0 0 rgba(251,232,200,.12);}

body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark{
  z-index:2; opacity:.18; filter:drop-shadow(0 0 8px rgba(213,167,97,.10));
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark svg{overflow:visible; width:100%; height:100%;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark line,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark circle,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark rect,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark polygon,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark path{stroke:rgba(236,206,160,.74); fill:none; stroke-width:.85;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark .fillmark{fill:rgba(236,206,160,.5);stroke:none;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-corner{top:16px;right:16px;width:41px;height:41px;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-code{left:auto;right:58px;top:22px;bottom:auto;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-watermark{right:3.6%;top:14%;width:154px;height:116px;opacity:.26;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .mf-metric .sd-vm-code{bottom:12px;font-size:7px;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .mf-metric:hover .sd-vm-watermark{opacity:.34; transform:translateY(-1px); transition:opacity .35s ease, transform .35s ease;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .mf-panel .sd-vm-code{bottom:12px;left:22px;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .mf-panel:hover .sd-vm-rail{filter:drop-shadow(0 0 5px rgba(235,195,129,.28));}

body.sd-study-optical-plus.mf-theme.obsidian-demo .countup-target,
body.sd-study-optical-plus.mf-theme.obsidian-demo .countup-inline{display:inline-block; min-width:1ch;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .countup-live{ text-shadow:0 0 8px rgba(242,201,132,.16); }
body.sd-study-optical-plus.mf-theme.obsidian-demo .countup-pulse{ animation:countPulse .65s ease-out; }
@keyframes countPulse{0%{filter:brightness(1.28);}100%{filter:brightness(1);} }

body[data-lux-theme="light"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner,
body[data-lux-theme="light"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-code,
body[data-lux-theme="light"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-rail,
body[data-lux-theme="light"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark{filter:brightness(.56) sepia(.42);}

@media (max-width:860px){
  body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-watermark{display:none;}
  body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-code{display:none;}
}


/* SOURCE STYLE BLOCK 17 */

/* Kinetic Geometry — corrected, visible compositor-native micro-motion. */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark{
  opacity:.23;
  transition:opacity .55s ease;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner.sd-kine-corner{opacity:.50;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner.sd-kine-corner::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner.sd-kine-corner::after{opacity:.5;}
body.sd-study-optical-plus.mf-theme.obsidian-demo .lux-hero .sd-vm-watermark{
  opacity:.19;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .mf-metric:hover .sd-vm-watermark{
  opacity:.31;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark > svg{
  display:block;
  width:100%;height:100%;
  transform-box:view-box;
  transform-origin:50% 50%;
  backface-visibility:hidden;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark .sd-kine-registration{
  stroke:rgba(255,225,173,.48);
  fill:rgba(255,225,173,.29);
  stroke-width:1.4;
}
/* Static corner frame remains; only the interior emblem is animated. */
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner.sd-kine-corner::before,
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner.sd-kine-corner::after{
  display:none;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner .sd-kine-emblem{
  position:absolute;top:3px;right:3px;width:17px;height:17px;display:block;
  overflow:visible;transform-origin:center;transform-box:view-box;
  filter:drop-shadow(0 0 2px rgba(244,205,140,.16)); opacity:.5;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner .sd-kine-emblem *{
  fill:none;stroke:rgba(255,232,191,.42);stroke-width:1.25;
  stroke-linecap:round;stroke-linejoin:round;
}
body.sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner .sd-kine-emblem .sd-kine-dot{
  fill:rgba(255,232,191,.43);stroke:none;
}
body[data-lux-motion="off"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-watermark > svg,
body[data-lux-motion="off"].sd-study-optical-plus.mf-theme.obsidian-demo .sd-vm-corner .sd-kine-emblem{
  transform:none !important;opacity:1 !important;
}
/* Motion ON explicitly opts in; otherwise the base control inherits system reduce-motion. */




/* SOURCE STYLE BLOCK 06 */
/* USKOBOT Palette Studio V2 × original Obsidian Luxury Motion.
   This file is LAST in the cascade. The original HTML, V4 animation engine,
   typography and layout are not replaced. It only colors the existing objects.
   Default Champagne keeps the uploaded Obsidian materials pixel-identical. */

/* On champagne, use original CSS everywhere — no material replacement. */
body.mf-theme.obsidian-demo.ps-color-active {
  --mf-bg:var(--ps-bg);
  --mf-canvas:var(--ps-bg);
  --mf-sidebar:var(--ps-sidebar);
  --mf-card:var(--ps-surface);
  --mf-input:var(--ps-surface2);
  --mf-raised:var(--ps-surface2);
  --mf-line:var(--ps-border);
  --mf-soft:var(--ps-border-soft);
  --mf-text:var(--ps-text);
  --mf-muted:var(--ps-muted);
  --mf-dim:var(--ps-muted);
  --mf-accent:var(--ps-accent);
  --mf-accent-text:var(--ps-accent-text);
  --mf-accent-soft:var(--ps-accent-soft);
  --lux-surface:var(--ps-surface);
  --lux-surface-strong:var(--ps-surface2);
  --lux-surface-border:var(--ps-border);
  color:var(--ps-text);
  background-color:var(--ps-bg) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .dashboard-container {
  background:var(--ps-bg) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .main-content {
  background:
    radial-gradient(ellipse 660px 430px at 78% -3%,var(--ps-glow),transparent 75%),
    radial-gradient(ellipse 450px 480px at 5% 82%,var(--ps-accent-soft),transparent 80%),
    linear-gradient(152deg,var(--ps-bg),color-mix(in srgb,var(--ps-bg) 91%,var(--ps-sidebar))) !important;
  color:var(--ps-text);
}
body.mf-theme.obsidian-demo.ps-color-active .sidebar {
  background:
    radial-gradient(ellipse 85% 31% at 0% 0%,var(--ps-glow),transparent 80%),
    linear-gradient(145deg,var(--ps-sidebar),var(--ps-sidebar2)) !important;
  border-right-color:var(--ps-border) !important;
  color:var(--ps-text);
  box-shadow:6px 0 28px color-mix(in srgb,var(--ps-sidebar) 50%,transparent),inset -1px 0 var(--ps-border-soft) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .sidebar::after {
  background:linear-gradient(to bottom,transparent,var(--ps-glow-strong) 14%,var(--ps-border-soft) 48%,transparent 95%) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.mf-page-description,.mf-breadcrumb,.mf-breadcrumb a,.mf-nav-label,.mf-metric-label,.mf-metric-caption,.mf-chart-caption,.mf-subtle-link,.mf-xp-caption,.xp-values,.lux-scenario-intro small,.mf-workspace-footer) {
  color:var(--ps-muted) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.page-title,.mf-metric strong,.mf-panel-heading h3,.mf-service-row strong,.mf-sidebar-account b,.mf-breadcrumb>span:last-child) {
  color:var(--ps-text) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .dashboard-header {
  border-bottom-color:var(--ps-border-soft) !important;
  background:transparent !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-view-tabs {
  border-color:var(--ps-border-soft) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-view-tabs a {color:var(--ps-muted) !important;}
body.mf-theme.obsidian-demo.ps-color-active .mf-view-tabs a.is-active {
  color:var(--ps-accent-text) !important;
  border-color:var(--ps-border-soft) !important;
  background:var(--ps-accent-soft) !important;
}
/* Raised materials: preserve soft shadow, border glow and mouse sheen. */
body.mf-theme.obsidian-demo.ps-color-active :is(.mf-panel.lux-satin-surface,.mf-metric.lux-satin-surface,.tier-display-card.lux-satin-surface) {
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--ps-surface) 93%,var(--ps-accent) 7%),
    color-mix(in srgb,var(--ps-surface) 65%,var(--ps-bg) 35%)) !important;
  border-color:var(--ps-border) !important;
  box-shadow:
    0 2px 5px color-mix(in srgb,var(--ps-sidebar) 30%,transparent),
    0 15px 36px color-mix(in srgb,var(--ps-sidebar) 28%,transparent),
    0 24px 50px color-mix(in srgb,var(--ps-bg) 28%,transparent),
    inset 0 1px 0 var(--ps-border-soft) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-metric.lux-satin-surface:first-child {
  background:linear-gradient(148deg,
    color-mix(in srgb,var(--ps-surface) 83%,var(--ps-accent) 17%),
    color-mix(in srgb,var(--ps-surface) 45%,var(--ps-bg) 55%)) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-hero {
  background:
    radial-gradient(circle at 80% 46%,var(--ps-glow-strong),transparent 47%),
    linear-gradient(124deg,var(--ps-hero),var(--ps-hero2)) !important;
  border-color:var(--ps-border) !important;
  box-shadow:0 18px 53px color-mix(in srgb,var(--ps-sidebar) 35%,transparent),inset 0 1px 0 var(--ps-border-soft) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-hero h1 {color:var(--ps-text) !important;}
body.mf-theme.obsidian-demo.ps-color-active .lux-hero h1 em,
body.mf-theme.obsidian-demo.ps-color-active :is(.lux-eyebrow,.lux-heading-overline,.lux-art-caption,.lux-hero-secondary,.lux-art .lux-central-glyph span) {
  color:var(--ps-accent-text) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-hero p {color:var(--ps-muted) !important;}
body.mf-theme.obsidian-demo.ps-color-active .lux-hero-primary,
body.mf-theme.obsidian-demo.ps-color-active .mf-button-primary {
  background:linear-gradient(130deg,var(--ps-accent),color-mix(in srgb,var(--ps-accent) 70%,var(--ps-accent2))) !important;
  border-color:var(--ps-accent) !important;
  color:var(--ps-accent-ink) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-button:not(.mf-button-primary) {
  background:linear-gradient(145deg,var(--ps-surface),var(--ps-surface2)) !important;
  color:var(--ps-text) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.lux-motion-toggle,.lux-theme-control,.lux-preset,.lux-scenario-custom) {
  background:linear-gradient(140deg,var(--ps-surface),var(--ps-surface2)) !important;
  color:var(--ps-text) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-motion-toggle i,
body.mf-theme.obsidian-demo.ps-color-active .lux-demo-pill i {background:var(--ps-accent) !important;}
body.mf-theme.obsidian-demo.ps-color-active :is(.mf-nav-search,.mf-sidebar-account,.lux-scenario-studio) {
  background:linear-gradient(145deg,var(--ps-surface2),var(--ps-sidebar)) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .sidebar .nav-item {color:var(--ps-muted) !important;}
body.mf-theme.obsidian-demo.ps-color-active .sidebar .nav-item:hover {
  background:var(--ps-accent-soft) !important;
  color:var(--ps-text) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .sidebar .nav-item.active {
  background:linear-gradient(92deg,var(--ps-accent-soft),var(--ps-surface2)) !important;
  border-color:var(--ps-border) !important;
  color:var(--ps-text) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .sidebar .nav-item.active::before {
  background:linear-gradient(to bottom,transparent,var(--ps-accent2),var(--ps-accent),transparent) !important;
  box-shadow:0 0 12px var(--ps-glow-strong) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.lux-orbit,.lux-orbit-one,.lux-orbit-two,.lux-orbit-three) {
  border-color:var(--ps-glow-strong) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-art::before {
  background:radial-gradient(circle,var(--ps-glow-strong),var(--ps-glow) 25%,transparent 60%) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-art-grid {
  background-image:linear-gradient(var(--ps-glow) 1px,transparent 1px),linear-gradient(90deg,var(--ps-glow) 1px,transparent 1px) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-central-glyph {
  border-color:var(--ps-border) !important;
  background:linear-gradient(130deg,var(--ps-surface),var(--ps-surface2)) !important;
  box-shadow:0 0 29px var(--ps-glow-strong),inset 0 1px 0 var(--ps-border-soft) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-edge-trace stop {
  stop-color:var(--ps-accent) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-edge-trace .lux-comet-core {fill:var(--ps-accent2) !important;}
body.mf-theme.obsidian-demo.ps-color-active .lux-edge-trace .lux-edge-static {
  filter:drop-shadow(0 0 3px var(--ps-glow)) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-ambient-band {
  background:linear-gradient(115deg,transparent 22%,var(--ps-glow) 45%,var(--ps-glow-strong) 50%,transparent 63%) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.lux-meter-rail i,.progress-fill-dynamic,.mf-capacity-bars>span.is-used) {
  background:linear-gradient(180deg,var(--ps-accent2),var(--ps-accent)) !important;
  box-shadow:0 0 11px var(--ps-glow-strong) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-capacity-bars>span.is-partial::after {
  background:linear-gradient(180deg,var(--ps-accent2),var(--ps-accent)) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.mf-mini-tag,.lux-preset[aria-pressed="true"],.mf-tag,.mf-tag-purple) {
  color:var(--ps-accent-text) !important;
  background:var(--ps-accent-soft) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.mf-service-row,.mf-transaction-row,.mf-quick-links a,.rank-card-item,.tier-display-card) {
  border-color:var(--ps-border-soft) !important;
  color:var(--ps-text) !important;
}
body.mf-theme.obsidian-demo.ps-color-active :is(.rank-card-label,.xp-tier-name) {color:var(--ps-text) !important;}
body.mf-theme.obsidian-demo.ps-color-active :is(.xp-values,.rank-exp-range,.mf-xp-caption) {color:var(--ps-muted) !important;}
body.mf-theme.obsidian-demo.ps-color-active .mf-workspace-footer {border-color:var(--ps-border) !important;}
/* Avoid light background palettes inheriting dark glitter opacities or old metal text. */
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .mf-metric strong,
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .lux-hero h1,
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .page-title {color:var(--ps-text) !important;}
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .lux-hero {
  background:linear-gradient(122deg,color-mix(in srgb,var(--ps-bg) 91%,var(--ps-accent)),color-mix(in srgb,var(--ps-bg) 77%,var(--ps-sidebar))) !important;
}
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .lux-hero h1 em {color:var(--ps-accent-text) !important;}
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] .sidebar .mf-brand-mark {color:var(--ps-accent-ink) !important;}
body.mf-theme.obsidian-demo.ps-color-active[data-ps-mode="light"] :is(.mf-breadcrumb,.mf-nav-label,.mf-subtle-link) {color:var(--ps-muted) !important;}


/* Accent-ink follows contrast on CTA buttons and their nested labels/icons. */
body.mf-theme.obsidian-demo.ps-color-active .mf-button-primary,
body.mf-theme.obsidian-demo.ps-color-active .lux-hero-primary,
body.mf-theme.obsidian-demo.ps-color-active .mf-button-primary :is(span,svg,path),
body.mf-theme.obsidian-demo.ps-color-active .lux-hero-primary :is(span,svg,path) {
  color:var(--ps-accent-ink) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .mf-button-primary svg,
body.mf-theme.obsidian-demo.ps-color-active .lux-hero-primary svg {stroke:currentColor !important;}
body.mf-theme.obsidian-demo.ps-color-active .mf-brand-mark {
  background:linear-gradient(150deg,var(--ps-accent2),var(--ps-accent)) !important;
  color:var(--ps-accent-ink) !important;
  border-color:var(--ps-border) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-eyebrow-line,
body.mf-theme.obsidian-demo.ps-color-active .lux-art-caption::before {
  background:var(--ps-accent) !important;
}
body.mf-theme.obsidian-demo.ps-color-active .lux-scenario-icon,
body.mf-theme.obsidian-demo.ps-color-active .sidebar .nav-item.active svg,
body.mf-theme.obsidian-demo.ps-color-active .mf-metric-label svg {
  color:var(--ps-accent-text) !important;
}



body.ps-color-active.mf-theme.obsidian-demo .sig-optic-rim{
 background:
  radial-gradient(ellipse 240px 178px at var(--sig-edge-x,79%) var(--sig-edge-y,3%),
   rgba(255,255,255,.98) 0%,color-mix(in srgb,var(--ps-accent,#e9c998) 56%,white) 10%,
   color-mix(in srgb,var(--ps-accent,#e9c998) 40%,transparent) 32%,transparent 78%),
  linear-gradient(115deg,color-mix(in srgb,var(--ps-accent,#e9c998) 34%,transparent),transparent 45%);
}
body.ps-color-active.mf-theme.obsidian-demo .sig-optic-target > .sig-optic-flare{
 background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--ps-accent,#e9c998) 50%,transparent),
  white,color-mix(in srgb,var(--ps-accent,#e9c998) 58%,transparent),transparent);
}

/* Optional non-Champagne palette color/surface overrides (including light variants). */
body.mf-theme.obsidian-demo.ps-color-active .lux-polish-toggle[aria-pressed="true"]{
  color:var(--ps-text);border-color:var(--ps-border);
  background:linear-gradient(139deg,var(--ps-surface),var(--ps-surface2));
}


/* Reusable full-page atmosphere host; no showcase DOM dependency. */
[data-usk-atmosphere]{position:relative;isolation:isolate;min-height:100vh;}
[data-usk-atmosphere] > :is(.lux-depth-back,.lux-depth-front,.lux-plexus-back){position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}



/* ========================= USKOBOT LOGIN V4 =========================
   Production opt-in: all rules below scope to .usk-auth-main or data-usk-palette-atmosphere.
   Nothing from demo.css / demo.js is required or loaded.
*/
body:has(.usk-auth-main){height:auto;min-height:100dvh;overflow-x:hidden;overflow-y:auto}
body:has(.usk-auth-main) .dashboard-container{height:auto;min-height:100dvh;overflow:visible}
body:has(.usk-auth-main) .main-content.usk-auth-main{
    position:relative;z-index:2;width:100%;height:auto;min-height:100dvh;
    display:flex;align-items:center;justify-content:center;overflow:visible;
    background:transparent!important;isolation:auto;padding:0!important;
}
body:has(.usk-auth-main) .main-content.usk-auth-main::before,
body:has(.usk-auth-main) .main-content.usk-auth-main::after{content:none!important;display:none!important}
body:has(.usk-auth-main) .main-content.usk-auth-main > :not(.lux-depth-back):not(.lux-depth-front){position:relative;z-index:auto}
body:has(.usk-auth-main) .usk-auth-main .auth-container.usk-auth{
    display:flex;align-items:center;justify-content:center;overflow:visible;
    min-height:100dvh;height:auto;width:100%;max-width:none;
    padding:45px 30px;background:transparent!important;
}
body:has(.usk-auth-main) .usk-auth-layout{
    display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,410px);
    align-items:stretch;column-gap:32px;width:min(1200px,100%);margin:auto;
}
body:has(.usk-auth-main) .usk-auth-showcase{
    position:relative;min-height:565px;overflow:hidden;isolation:isolate;
    display:flex;flex-direction:column;justify-content:space-between;
    border:1px solid color-mix(in srgb,var(--ps-accent,#d7b079) 20%,transparent);
    border-radius:19px;padding:27px 31px 24px;
    background:radial-gradient(ellipse 66% 50% at 50% 44%,var(--ps-glow,rgba(215,176,121,.1)),transparent 86%),
               linear-gradient(145deg,color-mix(in srgb,var(--ps-surface,#1b1c20) 82%,transparent),color-mix(in srgb,var(--ps-bg,#0b0d10) 92%,transparent));
    box-shadow:0 22px 65px rgba(0,0,0,.18);
}
body:has(.usk-auth-main) .usk-auth-showcase-top,
body:has(.usk-auth-main) .usk-auth-showcase-copy,
body:has(.usk-auth-main) .usk-auth-showcase-foot{position:relative;z-index:4}
body:has(.usk-auth-main) .usk-auth-showcase-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
body:has(.usk-auth-main) .usk-auth-wordmark{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ps-text,#f1f0ec);font-size:15px;letter-spacing:.055em}
body:has(.usk-auth-main) .usk-auth-wordmark .usk-auth-mark{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--ps-border,rgba(215,176,121,.32));border-radius:9px;background:var(--ps-glow,rgba(215,176,121,.1));color:var(--ps-accent2,#f1d7a8);font:700 24px/1 Georgia,serif}
body:has(.usk-auth-main) .usk-auth-wordmark strong{font-weight:730;letter-spacing:.05em}
body:has(.usk-auth-main) .usk-auth-wordmark > span:last-child{font-size:10px;letter-spacing:.12em;color:var(--ps-muted,#b0afb1)}
body:has(.usk-auth-main) .usk-auth-micro,
body:has(.usk-auth-main) .usk-auth-overline,
body:has(.usk-auth-main) .usk-auth-showcase-foot,
body:has(.usk-auth-main) .usk-auth-card-meta,
body:has(.usk-auth-main) .usk-auth-card-foot{font:600 10px/1.6 Consolas,'Courier New',monospace;letter-spacing:.14em;color:var(--ps-muted,#b0afb1)}
body:has(.usk-auth-main) .usk-auth-showcase-copy{max-width:440px;pointer-events:none}
body:has(.usk-auth-main) .usk-auth-showcase-copy h1{font-size:clamp(32px,3.55vw,54px);line-height:1.13;letter-spacing:-.045em;color:var(--ps-text,#f1f0ec);margin:15px 0}
body:has(.usk-auth-main) .usk-auth-showcase-copy h1 em{font-style:normal;color:var(--ps-accent2,#f1d7a8)}
body:has(.usk-auth-main) .usk-auth-showcase-copy p{max-width:350px;color:var(--ps-muted,#b0afb1);font-size:14px}
body:has(.usk-auth-main) .usk-auth-showcase-foot i{color:var(--ps-accent,#d7b079);font-style:normal;margin:0 4px}
body:has(.usk-auth-main) .usk-auth-controller.usk-login-graphic-container{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
body:has(.usk-auth-main) .usk-auth-controller.usk-login-graphic-container::before{content:none!important}
body:has(.usk-auth-main) .usk-login-graphic-container #usk-login-logo-component{position:absolute;inset:0}
body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card{
    position:relative;min-width:0;width:100%;max-width:none;min-height:565px;
    border-radius:18px;padding:29px 29px 26px;
    display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;isolation:isolate;
    border:1px solid var(--ps-border,rgba(215,176,121,.34));
    background:linear-gradient(145deg,var(--ps-surface,#1b1c20),var(--ps-bg,#0b0d10))!important;
    box-shadow:0 22px 60px rgba(0,0,0,.31),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
body:has(.usk-auth-main) .usk-auth-card > :not(.lux-clearcoat):not(.sig-optic-rim):not(.sig-optic-flare):not(.sig-etched-overlay):not(.usk-login-card-edge){position:relative;z-index:3}
body:has(.usk-auth-main) .usk-auth-card-meta{min-height:31px;display:flex;justify-content:flex-end}
body:has(.usk-auth-main) .usk-auth-card-intro{text-align:center;padding-top:9px}
body:has(.usk-auth-main) .uskobot-login-logo{display:block;width:96px;height:76px;margin:0 auto 13px}
body:has(.usk-auth-main) .uskobot-login-logo picture,body:has(.usk-auth-main) .uskobot-login-logo img{display:block;width:100%;height:100%;object-fit:contain}
body:has(.usk-auth-main) .usk-auth-card-intro h2{font-size:28px!important;margin:8px 0 4px;color:var(--ps-text,#f1f0ec)}
body:has(.usk-auth-main) .usk-auth-card-intro h2 a{color:inherit;text-decoration:none}
body:has(.usk-auth-main) .usk-auth-card-intro p{margin:0;color:var(--ps-muted,#b0afb1)}
body:has(.usk-auth-main) .usk-auth-form{margin:20px 0 8px}
body:has(.usk-auth-main) .usk-auth-form .form-group{margin:0 0 14px!important}
body:has(.usk-auth-main) .usk-auth-form label{display:block;margin-bottom:7px;font-size:13px;font-weight:600;color:var(--ps-text,#f1f0ec)}
body:has(.usk-auth-main) .usk-auth-form input.neu-input{width:100%;height:45px;min-height:45px;border:1px solid var(--ps-border,#544d40);border-radius:8px;padding:0 13px;background:var(--ps-surface2,#111317);color:var(--ps-text,#f1f0ec);font-size:14px}
body:has(.usk-auth-main) .usk-auth-form input.neu-input:focus{outline:2px solid var(--ps-accent-soft,rgba(215,176,121,.22));outline-offset:0;border-color:var(--ps-accent,#d7b079)}
body:has(.usk-auth-main) .usk-auth-password-group{position:relative}
body:has(.usk-auth-main) .usk-auth-password-group > input{padding-right:49px!important}
body:has(.usk-auth-main) .usk-auth-password-toggle{position:absolute;right:5px;top:4px;bottom:4px;width:39px;display:grid;place-items:center;background:transparent;border:0;color:var(--ps-muted,#b0afb1);cursor:pointer;border-radius:6px}
body:has(.usk-auth-main) .usk-auth-password-toggle:hover{color:var(--ps-accent2,#f1d7a8)}
body:has(.usk-auth-main) .usk-password-eye{display:block;width:17px;height:12px;border:1.5px solid currentColor;border-radius:65% 25%;transform:rotate(45deg)}
body:has(.usk-auth-main) .usk-password-eye::after{content:"";position:absolute;left:5px;top:3px;width:5px;height:5px;border:1px solid currentColor;border-radius:50%}
body:has(.usk-auth-main) .usk-auth-password-toggle[aria-pressed="true"] .usk-password-eye::before{content:"";position:absolute;z-index:1;left:8px;top:-5px;height:23px;border-left:2px solid var(--ps-accent2,#f1d7a8);transform:rotate(-45deg)}
body:has(.usk-auth-main) .usk-auth-form button.usk-auth-submit{width:100%;height:46px;min-height:46px;margin:6px 0 0!important;display:flex;justify-content:center;align-items:center;gap:10px;font-size:14px;font-weight:700;border-radius:8px;cursor:pointer}
body:has(.usk-auth-main) .usk-auth-submit-arrow::before{content:'→';font-size:22px;line-height:1}
body:has(.usk-auth-main) .usk-auth-error{display:flex;gap:10px;padding:11px 13px;margin:10px 0;border:1px solid rgba(252,109,115,.4);border-radius:8px;background:rgba(126,30,40,.13);color:#ff9ba5;font-size:13px}
body:has(.usk-auth-main) .usk-auth-error-icon{font-size:16px;font-weight:800}
body:has(.usk-auth-main) .usk-auth-divider{display:flex;align-items:center;gap:12px;margin:17px 0 11px;color:var(--ps-muted,#b0afb1);font-size:10px;letter-spacing:.17em}
body:has(.usk-auth-main) .usk-auth-divider span{flex:1;height:1px;background:var(--ps-border,#544d40)}
body:has(.usk-auth-main) .usk-auth-links{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}
body:has(.usk-auth-main) .usk-auth-links a{text-decoration:none;color:var(--ps-muted,#b0afb1)}
body:has(.usk-auth-main) .usk-auth-links strong{color:var(--ps-accent2,#f1d7a8)}
body:has(.usk-auth-main) .usk-auth-discord-icon::before{content:'◈';margin-right:5px;color:var(--ps-accent2,#f1d7a8)}
body:has(.usk-auth-main) .usk-auth-card-foot{text-align:center;margin-top:14px;opacity:.78}
body:has(.usk-auth-main) .usk-auth-layout .usk-auth-card.sig-optic-target{--sig-edge-x:79%;--sig-edge-y:3%}
body:has(.usk-auth-main) .usk-auth-card > .lux-clearcoat{z-index:1}
body:has(.usk-auth-main) .usk-auth-card > .sig-optic-rim,
body:has(.usk-auth-main) .usk-auth-card > .sig-optic-flare{z-index:14}
body:has(.usk-auth-main) .usk-auth-card > .sig-etched-overlay{z-index:13}
body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-edge{z-index:12}
/* Login-only Depth Layer Composite. The fixed host paints behind the form
   and never inherits the dashboard's sidebar-offset canvas rules. */
body:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite]{
    position:fixed;inset:0;z-index:0;display:block;pointer-events:none;overflow:hidden;
    isolation:isolate;
    background:radial-gradient(ellipse 56% 62% at 76% 22%,var(--ps-glow,rgba(215,176,121,.13)),transparent 85%),
      radial-gradient(ellipse 44% 52% at 14% 76%,color-mix(in srgb,var(--ps-accent,#d7b079) 8%,transparent),transparent 82%),
      linear-gradient(155deg,var(--ps-bg,#0b0d10),color-mix(in srgb,var(--ps-bg,#0b0d10) 84%,#000) 62%,var(--ps-bg,#0b0d10));
}
body:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite] > canvas{
    position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;
    transform:none;mix-blend-mode:normal;filter:none;
}
body:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite] > .lux-depth-back{z-index:0;opacity:1}
body:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite] > .lux-plexus-back{z-index:1;opacity:1}
body:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite] > .lux-depth-front{z-index:2;opacity:1}
body[data-lux-theme="light"]:has(.usk-auth-main) .usk-login-atmosphere[data-usk-depth-composite] > canvas{
    opacity:.72;mix-blend-mode:multiply;
}
@media(max-width:940px){
  body:has(.usk-auth-main) .usk-auth-layout{max-width:530px;grid-template-columns:1fr;gap:22px}
  body:has(.usk-auth-main) .usk-auth-showcase{min-height:290px}
  body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card{min-height:500px}
  body:has(.usk-auth-main) .usk-auth-showcase-copy h1{font-size:37px}
  body:has(.usk-auth-main) .usk-auth-controller.usk-login-graphic-container{opacity:.65}
}
@media(max-width:550px){
  body:has(.usk-auth-main) .usk-auth-main .auth-container.usk-auth{padding:17px 12px 25px}
  body:has(.usk-auth-main) .usk-auth-showcase{padding:19px;min-height:245px;border-radius:14px}
  body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card{padding:23px 20px;min-height:510px;border-radius:14px}
  body:has(.usk-auth-main) .usk-auth-showcase-copy h1{font-size:31px}
  body:has(.usk-auth-main) .usk-auth-micro{display:none}
  body:has(.usk-auth-main) .usk-auth-showcase-foot{font-size:8px}
}

/* ORIGINAL LOGIN U ARTWORK — MOVED FROM INLINE PHP */

/* Source: approved logo.html — scoped graphic rules and original keyframes */
@media  (max-width:620px){}
#usk-login-logo-component .hero.signature > .landing-panel-art{
  position:absolute;inset:0;z-index:1;overflow:hidden;border-radius:inherit;
  pointer-events:none;isolation:isolate;--panel-art-x:66%;--panel-art-y:49%;
  --panel-mx:66%;--panel-my:46%;
}
#usk-login-logo-component .hero.signature > .landing-panel-art::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse 34% 68% at var(--panel-art-x) var(--panel-art-y),
   color-mix(in srgb,var(--gold) 14%,transparent) 0%,
   color-mix(in srgb,var(--gold) 7%,transparent) 38%,transparent 82%);
  animation:landing-art-halo-breathe 9s ease-in-out infinite alternate;
}
#usk-login-logo-component .hero.signature .landing-panel-art-grid{
  position:absolute;inset:-18px;z-index:0;opacity:.40;
  background-image:linear-gradient(color-mix(in srgb,var(--light) 9%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--light) 9%,transparent) 1px,transparent 1px);
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 40% 72% at 67% 52%,#000 0%,rgba(0,0,0,.64) 45%,transparent 100%);
  mask-image:radial-gradient(ellipse 40% 72% at 67% 52%,#000 0%,rgba(0,0,0,.64) 45%,transparent 100%);
  animation:landing-art-grid-drift 14s linear infinite;
}
#usk-login-logo-component .hero.signature .landing-panel-circuit{
  position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;
  pointer-events:none;opacity:.87;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 57% 90% at 65% 50%,#000 15%,transparent 95%);
  mask-image:radial-gradient(ellipse 57% 90% at 65% 50%,#000 15%,transparent 95%);
}
#usk-login-logo-component .hero.signature .landing-panel-cursor-glow{
  position:absolute;inset:0;z-index:2;
  background:radial-gradient(220px circle at var(--panel-mx) var(--panel-my),
    color-mix(in srgb,var(--light) 16%,transparent),color-mix(in srgb,var(--gold) 5%,transparent) 43%,transparent 84%);
  opacity:.42;transition:opacity .3s ease;
}
#usk-login-logo-component .hero.signature:hover .landing-panel-cursor-glow{opacity:.8;}
#usk-login-logo-component .hero.signature .landing-panel-glyph-stage{
  position:absolute;inset:0;z-index:3;transform:translate3d(var(--art-parallax-x,0px),var(--art-parallax-y,0px),0);
  opacity:.83;
}
#usk-login-logo-component .hero.signature .landing-panel-orbit{
  position:absolute;left:var(--panel-art-x);top:var(--panel-art-y);
  border:1px solid color-mix(in srgb,var(--light) 20%,transparent);border-radius:50%;
  transform:translate(-50%,-50%);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--gold) 14%,transparent));
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one{width:150px;height:150px;border-color:color-mix(in srgb,var(--light) 41%,transparent);box-shadow:inset 0 0 50px color-mix(in srgb,var(--gold) 9%,transparent);animation:landing-art-orbit-one 21s linear infinite;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-two{width:235px;height:235px;border-color:color-mix(in srgb,var(--gold) 29%,transparent);animation:landing-art-orbit-two 29s linear infinite;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-three{width:325px;height:325px;border-color:color-mix(in srgb,var(--gold) 16%,transparent);box-shadow:0 0 40px color-mix(in srgb,var(--gold) 4%,transparent);animation:landing-art-orbit-three 15s ease-in-out infinite;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one::before, #usk-login-logo-component .hero.signature .landing-panel-orbit-two::before{
  content:"";position:absolute;top:20px;left:21px;width:4px;height:4px;border-radius:50%;
  background:var(--light);box-shadow:0 0 12px 2px color-mix(in srgb,var(--gold) 60%,transparent);
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-two::before{top:auto;left:auto;right:26px;bottom:43px;width:3px;height:3px;}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph{
  position:absolute;left:var(--panel-art-x);top:var(--panel-art-y);width:94px;height:94px;
  display:grid;place-items:center;border-radius:18px;
  border:1px solid color-mix(in srgb,var(--light) 64%,transparent);
  background:linear-gradient(145deg,
    color-mix(in srgb,#473a28 78%,transparent),
    color-mix(in srgb,#201d1b 84%,transparent) 60%,
    color-mix(in srgb,#111419 88%,transparent));
  backdrop-filter:blur(10px) saturate(1.05);
  box-shadow:0 15px 52px rgba(0,0,0,.38),inset 0 1px 0 color-mix(in srgb,var(--light) 41%,transparent),0 0 32px color-mix(in srgb,var(--gold) 23%,transparent);
  transform:translate(-50%,-50%) rotate(-45deg);
  animation:landing-art-glyph-float 6.8s ease-in-out infinite;
}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph span{
  font:600 49px/1 Georgia,serif;color:var(--light);transform:rotate(45deg);
  text-shadow:0 1px 10px color-mix(in srgb,var(--gold) 28%,transparent);
}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph i{position:absolute;inset:9px;border:1px solid color-mix(in srgb,var(--light) 21%,transparent);border-radius:11px;}
@keyframes landing-art-halo-breathe{from{opacity:.50;transform:scale(.95)}to{opacity:1;transform:scale(1.09)}}
@keyframes landing-art-grid-drift{to{background-position:72px 72px;}}
@keyframes landing-art-orbit-one{to{transform:translate(-50%,-50%) rotate(360deg);}}
@keyframes landing-art-orbit-two{to{transform:translate(-50%,-50%) rotate(-360deg);}}
@keyframes landing-art-orbit-three{50%{transform:translate(-50%,-50%) scale(1.045);opacity:.72;}}
@keyframes landing-art-glyph-float{50%{transform:translate(-50%,-53%) rotate(-45deg);filter:brightness(1.12);}}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-art{opacity:.54;}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-circuit{mix-blend-mode:multiply;opacity:.6;}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-central-glyph{background:linear-gradient(145deg,rgba(222,210,187,.82),rgba(198,174,137,.78) 65%,rgba(184,158,118,.74));border-color:rgba(112,76,34,.5);backdrop-filter:blur(10px) saturate(1.05);box-shadow:0 12px 30px rgba(93,64,27,.16),inset 0 1px 0 #fff9;}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-central-glyph span{color:#65411f;text-shadow:0 1px 0 #fff7;}
@media   (max-width:900px){#usk-login-logo-component .hero.signature .landing-panel-art{--panel-art-x:71%;--panel-art-y:53%;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-three{width:240px;height:240px;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-two{width:180px;height:180px;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one{width:126px;height:126px;}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph{width:75px;height:75px;border-radius:15px;}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph span{font-size:40px;}}
@media   (max-width:620px){#usk-login-logo-component .hero.signature > .landing-panel-art{--panel-art-x:50%;--panel-art-y:58%;opacity:.43;}
#usk-login-logo-component .hero.signature .landing-panel-art-grid{opacity:.24;}
#usk-login-logo-component .hero.signature .landing-panel-circuit{opacity:.49;}}
body[data-lux-motion="off"] #usk-login-logo-component .landing-panel-art *, body[data-lux-motion="off"] #usk-login-logo-component .panel-metric-sheen::after{animation:none!important;}

#usk-login-logo-component .hero.signature > .landing-panel-art.lux-art{
  --panel-art-x:50%;--panel-art-y:50%;
  inset:0;z-index:1;opacity:1;pointer-events:none;
  -webkit-mask-image:none;mask-image:none;
}
#usk-login-logo-component .hero.signature .landing-panel-art-grid.lux-art-grid{
  opacity:.42;inset:0;background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
  mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
}
#usk-login-logo-component .hero.signature .landing-panel-circuit.lux-circuit-canvas{
  opacity:1;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
  mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
  filter:drop-shadow(0 0 4px color-mix(in srgb,var(--gold) 35%,transparent));
}
#usk-login-logo-component .hero.signature .landing-panel-glyph-stage.lux-glyph-stage{opacity:.88;}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph{
  box-shadow:inset 0 1px 0 rgba(255,245,221,.52),0 0 35px color-mix(in srgb,var(--gold) 20%,transparent),0 15px 40px rgba(0,0,0,.32);
}
#usk-login-logo-component .hero.signature .landing-art-caption{
  position:absolute;z-index:4;pointer-events:none;
  font:500 8px/1.4 Consolas,"SFMono-Regular",monospace;
  color:color-mix(in srgb,var(--light) 58%,var(--muted));
  letter-spacing:.12em;opacity:.48;white-space:nowrap;
}
#usk-login-logo-component .hero.signature .landing-art-caption-top{top:17%;left:51%;transform:translateX(-50%);}
#usk-login-logo-component .hero.signature .landing-art-caption-bottom{bottom:16%;left:50%;transform:translateX(-50%);}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-art.lux-art{opacity:.65;}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-circuit.lux-circuit-canvas{
  mix-blend-mode:multiply;opacity:.88;filter:none;
}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-art-caption{color:#78532c;opacity:.58;}
@media   (max-width:900px){#usk-login-logo-component .hero.signature > .landing-panel-art.lux-art{--panel-art-x:50%;--panel-art-y:50%;}
#usk-login-logo-component .hero.signature .landing-art-caption{font-size:7px;}}
@media   (max-width:620px){#usk-login-logo-component .hero.signature > .landing-panel-art.lux-art{--panel-art-x:50%;--panel-art-y:50%;opacity:.55;}
#usk-login-logo-component .hero.signature .landing-panel-art-grid.lux-art-grid{opacity:.22;}
#usk-login-logo-component .hero.signature .landing-panel-circuit.lux-circuit-canvas{opacity:.78;}
#usk-login-logo-component .hero.signature .landing-art-caption{display:none;}}
@media   (max-width:380px){#usk-login-logo-component .hero.signature .landing-panel-glyph-stage.lux-glyph-stage{opacity:.64;}}
#usk-login-logo-component .hero.signature .landing-panel-art-grid.lux-art-grid{
  opacity:.62;
  background-image:
    linear-gradient(color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px);
  background-size:36px 36px;
  animation:landing-art-grid-sweep 9s linear infinite;
}
@keyframes landing-art-grid-sweep{
  from{background-position:0 0;}
  to{background-position:144px 72px;}
}
#usk-login-logo-component .hero.signature .landing-panel-scan-ray.lux-scan-ray{
  position:absolute;inset:-15% -18%;z-index:2;pointer-events:none;
  background:linear-gradient(111deg,
    transparent 46.5%,
    color-mix(in srgb,var(--gold) 2%,transparent) 48.5%,
    color-mix(in srgb,var(--light) 23%,transparent) 49.8%,
    color-mix(in srgb,var(--light) 9%,transparent) 50.45%,
    transparent 53%);
  opacity:.66;filter:blur(11px);
  -webkit-mask-image:radial-gradient(ellipse 34% 68% at 50% 50%,#000 10%,transparent 100%);
  mask-image:radial-gradient(ellipse 34% 68% at 50% 50%,#000 10%,transparent 100%);
  animation:landing-art-scan-sweep 6.4s cubic-bezier(.42,0,.58,1) infinite;
}
@keyframes landing-art-scan-sweep{
  0%{transform:translate3d(-37%,0,0);opacity:0;}
  15%{opacity:.62;}
  63%{opacity:.79;}
  100%{transform:translate3d(47%,0,0);opacity:0;}
}
#usk-login-logo-component .hero.signature .landing-panel-cursor-glow.lux-cursor-glow::after{
  content:"";position:absolute;inset:8% 12%;pointer-events:none;
  background:radial-gradient(ellipse 32% 43% at 50% 50%,
    color-mix(in srgb,var(--light) 12%,transparent),
    color-mix(in srgb,var(--gold) 5%,transparent) 46%,transparent 85%);
  animation:landing-art-ambient-drift 5.8s ease-in-out infinite alternate;
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one.lux-orbit-one{
  animation:landing-art-orbit-one 10s linear infinite;
  border-color:color-mix(in srgb,var(--light) 46%,transparent);
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-two.lux-orbit-two{
  animation:landing-art-orbit-two 13s linear infinite;
  border-color:color-mix(in srgb,var(--gold) 40%,transparent);
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-three.lux-orbit-three{
  animation:landing-art-orbit-three 10s ease-in-out infinite;
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one::before, #usk-login-logo-component .hero.signature .landing-panel-orbit-two::before{
  width:6px;height:6px;background:var(--light);
  box-shadow:0 0 9px 2px color-mix(in srgb,var(--light) 62%,transparent),
             0 0 24px 5px color-mix(in srgb,var(--gold) 38%,transparent);
}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one::after, #usk-login-logo-component .hero.signature .landing-panel-orbit-two::after{
  content:"";position:absolute;inset:-2px;padding:2px;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 190deg,transparent 0deg 110deg,
    color-mix(in srgb,var(--gold) 13%,transparent) 145deg,
    color-mix(in srgb,var(--light) 79%,transparent) 162deg,
    color-mix(in srgb,var(--gold) 25%,transparent) 181deg,transparent 217deg 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  filter:drop-shadow(0 0 6px color-mix(in srgb,var(--gold) 50%,transparent));
}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph{
  animation:landing-art-glyph-float 4.5s ease-in-out infinite;
}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph::before{
  content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(128deg,transparent 35%,color-mix(in srgb,var(--light) 19%,transparent) 50%,transparent 65%);
  background-size:230% 100%;
  animation:landing-art-glyph-shine 5.5s ease-in-out infinite;
}
@keyframes landing-art-glyph-shine{
  0%,12%{background-position:145% 0;opacity:.15;}
  46%{opacity:1;}
  85%,100%{background-position:-100% 0;opacity:.15;}
}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph span{position:relative;z-index:1;}
body[data-palette-mode="light"] #usk-login-logo-component .hero.signature .landing-panel-scan-ray.lux-scan-ray{
  mix-blend-mode:multiply;opacity:.4;
}
@media   (max-width:620px){#usk-login-logo-component .hero.signature .landing-panel-art-grid.lux-art-grid{opacity:.37;}
#usk-login-logo-component .hero.signature .landing-panel-scan-ray.lux-scan-ray{opacity:.38;}
#usk-login-logo-component .hero.signature .landing-panel-orbit-one::before, #usk-login-logo-component .hero.signature .landing-panel-orbit-two::before{width:4px;height:4px;}}

@keyframes landing-art-ambient-drift{
  from{transform:translate3d(-15%,-8%,0) scale(.85);opacity:.35;}
  to{transform:translate3d(13%,8%,0) scale(1.16);opacity:.95;}
}
@media  (max-width:620px){#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-one{width:82px;height:82px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-two{width:108px;height:108px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-three{width:132px;height:132px}
#usk-login-logo-component .opening>.hero.signature>.landing-panel-art{opacity:.4}
#usk-login-logo-component .hero.signature .landing-art-caption{display:none}}
@media  (max-width:620px){#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-central-glyph{width:60px;height:60px;border-radius:12px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-central-glyph span{font-size:34px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-one{width:78px;height:78px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-two{width:100px;height:100px}
#usk-login-logo-component .opening .mobile-brand-stage .landing-panel-orbit-three{width:120px;height:120px}}

/* Integration-only: original Obsidian positioning, no separate card/background. */
body:has(.usk-auth-main) .usk-auth-showcase .usk-auth-controller.usk-login-graphic-container{
 background:none;mask-image:none;-webkit-mask-image:none;opacity:1;overflow:visible;
}
body:has(.usk-auth-main) .usk-auth-showcase .usk-auth-controller.usk-login-graphic-container::before{content:none;animation:none}
#usk-login-logo-component{position:absolute;inset:0;pointer-events:none;overflow:visible;--gold:#d7b079;--light:#f1d7a8;--muted:#b0afb1;isolation:isolate}
#usk-login-logo-component .hero.signature{position:absolute;inset:0;width:100%;height:100%;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;min-height:0}
#usk-login-logo-component .hero.signature>.landing-panel-art.lux-art{inset:0;opacity:1;pointer-events:none}
/* Preserve logo.html animation timing against the site's global .lux-* !important rules. */
#usk-login-logo-component .hero.signature .landing-panel-orbit-one.lux-orbit-one{animation:landing-art-orbit-one 10s linear infinite!important}
#usk-login-logo-component .hero.signature .landing-panel-orbit-two.lux-orbit-two{animation:landing-art-orbit-two 13s linear infinite!important}
#usk-login-logo-component .hero.signature .landing-panel-orbit-three.lux-orbit-three{animation:landing-art-orbit-three 10s ease-in-out infinite!important}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph{animation:landing-art-glyph-float 4.5s ease-in-out infinite!important}
#usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph::before{animation:landing-art-glyph-shine 5.5s ease-in-out infinite!important}
/* Match the removed theme picker's original header height without a phantom control. */
body:has(.usk-auth-main) .usk-auth-card .usk-auth-card-meta{min-height:35px}

/* The original site's small-screen showcase stacks copy above the graphics. */
@media(max-width:880px){#usk-login-logo-component .hero.signature>.landing-panel-art.lux-art{opacity:.42}}
@media(max-width:560px){#usk-login-logo-component .hero.signature>.landing-panel-art.lux-art{opacity:.30}}


/* LOGIN L-EDGE COMET — MOVED FROM INLINE PHP */

body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-edge {
 position:absolute;inset:0;width:100%;height:100%;z-index:12;
 display:block;overflow:hidden;border-radius:inherit;pointer-events:none;opacity:.98;
}
body:has(.usk-auth-main) .usk-auth-card .usk-login-card-edge .usk-login-edge-static{
 fill:none;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;
 vector-effect:non-scaling-stroke;opacity:.85;
}
body:has(.usk-auth-main) .usk-auth-card .usk-login-card-edge .usk-login-edge-route{
 fill:none;stroke:transparent;stroke-width:0;pointer-events:none;
}
body:has(.usk-auth-main) .usk-auth-card .usk-login-card-edge .usk-login-edge-comet{
 mix-blend-mode:screen;filter:drop-shadow(0 0 3px rgba(239,203,149,.35));
}
body:has(.usk-auth-main) .usk-auth-card:hover > .usk-login-card-edge,
body:has(.usk-auth-main) .usk-auth-card:focus-within > .usk-login-card-edge{opacity:1}
body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-edge,
body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-band,
body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-op-corner,
body:has(.usk-auth-main) .usk-auth-card > .usk-login-card-edge .usk-login-edge-comet circle{pointer-events:none}
body[data-lux-motion="off"].mf-theme.obsidian-demo .usk-auth-card .usk-login-edge-comet{opacity:0!important}

/* Only redundant logo caption/stamp decorations are suppressed. The U, 3 orbits, circuit canvas, scan and grid remain untouched. */
#usk-login-logo-component .landing-art-caption{display:none!important}


/* Edge SVG must match outer border-box, not the inner padding-box. */
body:has(.usk-auth-main) .usk-auth-card > svg.usk-login-card-edge{inset:-1px!important;width:calc(100% + 2px)!important;height:calc(100% + 2px)!important}


/* LOGIN V4 MOBILE LAYOUT — scoped; dashboard and desktop remain unchanged.
   The generic .lux-art 520px breakpoint pins every art panel to 280px;
   override it for the login artwork so its U + circuits align with the card. */
@media (max-width: 600px) {
  body:has(.usk-auth-main) .usk-auth-main .auth-container.usk-auth {
    padding: 12px 10px 18px;
  }
  body:has(.usk-auth-main) .usk-auth-layout {
    width: 100%; max-width: 500px; min-width: 0;
    grid-template-columns: minmax(0,1fr); gap: 12px;
  }
  body:has(.usk-auth-main) .usk-auth-showcase {
    min-height: 186px; height: 186px; padding: 14px 16px;
    border-radius: 14px;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy {
    width: 65%; max-width: 245px; min-width: 0;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy .usk-auth-overline {
    display: block; font-size: 8px; letter-spacing: .095em;
    white-space: normal; line-height: 1.4;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy h1 {
    font-size: clamp(21px, 6.25vw, 26px); line-height: 1.1;
    margin: 5px 0 0; letter-spacing: -.045em;
  }
  /* Duplicate copy is present inside the form; keep the actionable content visible first. */
  body:has(.usk-auth-main) .usk-auth-showcase-copy p,
  body:has(.usk-auth-main) .usk-auth-showcase-foot { display: none; }
  body:has(.usk-auth-main) .usk-auth-showcase .usk-auth-controller.usk-login-graphic-container {
    opacity: 1;
    -webkit-mask-image: linear-gradient(to right, transparent 26%, rgba(0,0,0,.28) 48%, #000 76%);
    mask-image: linear-gradient(to right, transparent 26%, rgba(0,0,0,.28) 48%, #000 76%);
  }
  #usk-login-logo-component .hero.signature > .landing-panel-art.lux-art {
    position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; max-width: none;
    opacity: 1; --panel-art-x: 79%; --panel-art-y: 55%;
  }
  #usk-login-logo-component .hero.signature .landing-panel-orbit-one.lux-orbit-one {
    width: 82px; height: 82px;
  }
  #usk-login-logo-component .hero.signature .landing-panel-orbit-two.lux-orbit-two {
    width: 117px; height: 117px;
  }
  #usk-login-logo-component .hero.signature .landing-panel-orbit-three.lux-orbit-three {
    width: 151px; height: 151px;
  }
  #usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph {
    width: 58px; height: 58px; border-radius: 12px;
  }
  #usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph span {
    font-size: 30px;
  }
  body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card {
    min-height: 0; height: auto; padding: 15px 16px 16px;
    justify-content: flex-start;
  }
  body:has(.usk-auth-main) .usk-auth-card .usk-auth-card-meta {
    min-height: 18px;
  }
  body:has(.usk-auth-main) .usk-auth-card-intro {padding-top: 0;}
  body:has(.usk-auth-main) .uskobot-login-logo {
    width: 76px; height: 58px; margin: 0 auto 8px;
  }
  body:has(.usk-auth-main) .usk-auth-card-intro h2 {font-size: 25px!important; margin: 5px 0 2px;}
  body:has(.usk-auth-main) .usk-auth-form {margin: 13px 0 6px;}
  body:has(.usk-auth-main) .usk-auth-divider {margin: 12px 0 9px;}
  body:has(.usk-auth-main) .usk-auth-card-foot {margin-top: 11px;}
}
@media (max-width: 360px) {
  body:has(.usk-auth-main) .usk-auth-showcase {min-height: 180px; height: 180px;}
  body:has(.usk-auth-main) .usk-auth-showcase-copy {width: 66%;}
  body:has(.usk-auth-main) .usk-auth-showcase-copy h1 {font-size: 21px;}
  body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card {padding-left: 14px; padding-right: 14px;}
}


/* Narrow tablets and landscape phones: same login-specific layout ownership. */
@media (min-width: 601px) and (max-width: 940px) {
  body:has(.usk-auth-main) .usk-auth-layout {gap: 18px;}
  body:has(.usk-auth-main) .usk-auth-showcase {
    min-height: 225px; height: 225px; padding: 18px 24px;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy {
    width: 58%; max-width: 265px;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy h1 {
    font-size: 31px; line-height: 1.1; margin: 7px 0 4px;
  }
  body:has(.usk-auth-main) .usk-auth-showcase-copy p {font-size: 12px;}
  body:has(.usk-auth-main) .usk-auth-showcase-foot {font-size: 8px;}
  body:has(.usk-auth-main) .usk-auth-showcase .usk-auth-controller.usk-login-graphic-container {
    opacity: 1;
    -webkit-mask-image: linear-gradient(to right, transparent 28%, rgba(0,0,0,.28) 47%, #000 73%);
    mask-image: linear-gradient(to right, transparent 28%, rgba(0,0,0,.28) 47%, #000 73%);
  }
  #usk-login-logo-component .hero.signature > .landing-panel-art.lux-art {
    position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0;
    opacity: 1; --panel-art-x: 79%; --panel-art-y: 51%;
  }
  #usk-login-logo-component .hero.signature .landing-panel-orbit-one.lux-orbit-one {width: 110px; height: 110px;}
  #usk-login-logo-component .hero.signature .landing-panel-orbit-two.lux-orbit-two {width: 155px; height: 155px;}
  #usk-login-logo-component .hero.signature .landing-panel-orbit-three.lux-orbit-three {width: 205px; height: 205px;}
  #usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph {width: 76px; height: 76px;}
  #usk-login-logo-component .hero.signature .landing-panel-central-glyph.lux-central-glyph span {font-size: 39px;}
  body:has(.usk-auth-main) .usk-auth-layout .login-card.usk-auth-card {
    min-height: 0; height: auto; padding: 20px 24px;
    justify-content: flex-start;
  }
  body:has(.usk-auth-main) .usk-auth-card .usk-auth-card-meta {min-height: 23px;}
  body:has(.usk-auth-main) .usk-auth-card-intro {padding-top: 0;}
  body:has(.usk-auth-main) .uskobot-login-logo {width: 82px; height: 62px; margin: 0 auto 10px;}
  body:has(.usk-auth-main) .usk-auth-form {margin: 15px 0 7px;}
  body:has(.usk-auth-main) .usk-auth-divider {margin: 15px 0 10px;}
}


/* ===== USKOBOT TWO-FACTOR VERIFY — production styles ===== */
/* Login 2FA: independent of demo classes and legacy auth-container rules. */
body:has(.usk-twofactor-page) {
  height:auto; min-height:100vh; min-height:100dvh;
  overflow-x:hidden; overflow-y:auto;
  background:var(--ps-bg,#0b0d10);color:var(--ps-text,#f1f0ec);
}
body:has(.usk-twofactor-page) .usk-twofactor-atmosphere[data-usk-depth-composite] {
  position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;isolation:isolate;
  background:
    radial-gradient(ellipse 56% 62% at 76% 22%,var(--ps-glow,rgba(215,176,121,.13)),transparent 85%),
    radial-gradient(ellipse 44% 52% at 14% 76%,color-mix(in srgb,var(--ps-accent,#d7b079) 8%,transparent),transparent 82%),
    linear-gradient(155deg,var(--ps-bg,#0b0d10),color-mix(in srgb,var(--ps-bg,#0b0d10) 84%,#000) 62%,var(--ps-bg,#0b0d10));
}
.usk-twofactor-atmosphere[data-usk-depth-composite] > canvas {
  position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;
  transform:none;mix-blend-mode:normal;filter:none;
}
.usk-twofactor-atmosphere[data-usk-depth-composite] > .lux-depth-back{z-index:0;opacity:1}
.usk-twofactor-atmosphere[data-usk-depth-composite] > .lux-plexus-back{z-index:1;opacity:1}
.usk-twofactor-atmosphere[data-usk-depth-composite] > .lux-depth-front{z-index:2;opacity:1}
body[data-lux-theme="light"] .usk-twofactor-atmosphere[data-usk-depth-composite] > canvas {opacity:.72;mix-blend-mode:multiply}
.usk-twofactor-page {position:relative;z-index:1;min-height:100vh;min-height:100dvh;
  display:grid;place-items:center;padding:32px 16px 40px;isolation:isolate;}
.usk-twofactor-layout{width:100%;max-width:468px;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:18px}
.usk-twofactor-brand{display:flex;align-items:center;justify-content:center;gap:10px;
  color:var(--ps-text,#f1f0ec);text-decoration:none;font-size:15px;font-weight:750;letter-spacing:.07em;}
.usk-twofactor-brand-mark{width:33px;height:33px;display:grid;place-items:center;
  background:var(--ps-accent-soft,rgba(215,176,121,.14));border:1px solid var(--ps-border,#544d40);
  border-radius:10px;color:var(--ps-accent2,#f1d7a8);font:700 24px/1 Georgia,serif;}
.usk-twofactor-brand-caption{color:var(--ps-muted,#b0afb1);font:600 9px/1.4 Consolas,monospace;letter-spacing:.12em;}
.usk-twofactor-card{position:relative;width:100%;min-width:0;padding:30px 32px 28px;
  border:1px solid var(--ps-border,#544d40);border-radius:18px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--ps-surface,#1b1c20) 92%,var(--ps-accent,#d7b079) 8%),var(--ps-surface,#1b1c20));
  color:var(--ps-text,#f1f0ec);box-shadow:0 24px 80px rgba(0,0,0,.25),inset 0 1px 0 color-mix(in srgb,var(--ps-accent2,#f1d7a8) 16%,transparent);
  overflow:hidden;}
.usk-twofactor-topline{display:flex;align-items:center;justify-content:space-between;gap:10px;
  color:var(--ps-muted,#b0afb1);font:600 10px/1.5 Consolas,monospace;letter-spacing:.14em;}
.usk-twofactor-status{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  border:1px solid color-mix(in srgb,#65c99c 30%,transparent);border-radius:20px;
  padding:5px 9px;background:rgba(64,169,113,.075);color:#80dfae;font-size:9px;letter-spacing:.10em;}
.usk-twofactor-status i{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.usk-twofactor-heading{text-align:center;margin:24px 0 22px}
.usk-twofactor-shield{width:48px;height:48px;margin:0 auto 14px;display:grid;place-items:center;
  border:1px solid var(--ps-border,#544d40);border-radius:12px;
  background:var(--ps-surface2,#111317);color:var(--ps-accent2,#f1d7a8);font-size:26px;line-height:1;}
.usk-twofactor-heading h1{font-size:clamp(21px,4.5vw,25px);line-height:1.2;letter-spacing:-.025em;margin:0 0 10px;color:var(--ps-text,#f1f0ec);font-weight:730;}
.usk-twofactor-heading p{font-size:13px;line-height:1.65;margin:0;color:var(--ps-muted,#b0afb1)}
.usk-twofactor-form{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0}
.usk-twofactor-label{display:block;margin:0 0 10px;font-size:12px;color:var(--ps-text,#f1f0ec);font-weight:660}
.usk-twofactor-fallback{display:block;width:100%;height:48px;border-radius:9px;
  background:var(--ps-surface2,#111317);border:1px solid var(--ps-border,#544d40);
  color:var(--ps-text,#f1f0ec);padding:0 12px;font-size:15px;text-align:center;}
.usk-twofactor-fallback:focus{outline:2px solid var(--ps-accent-soft,rgba(215,176,121,.2));border-color:var(--ps-accent,#d7b079)}
.usk-twofactor-otp:not([hidden]){display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;align-items:center;width:100%;}
.usk-twofactor-otp[hidden],.usk-twofactor-helper[hidden],.usk-twofactor-feedback[hidden],.usk-twofactor-mode[hidden]{display:none!important}
.usk-twofactor-otp input{display:block;width:100%;height:53px;min-width:0;margin:0;padding:0!important;
  border:1px solid var(--ps-border,#544d40);border-radius:10px;
  background:var(--ps-surface2,#111317);color:var(--ps-text,#f1f0ec);
  text-align:center;font:700 22px/1 Consolas,'SFMono-Regular',monospace;
  outline:0;appearance:none;caret-color:var(--ps-accent2,#f1d7a8);}
.usk-twofactor-otp input:focus{border-color:var(--ps-accent,#d7b079);box-shadow:0 0 0 2px var(--ps-accent-soft,rgba(215,176,121,.16))}
.usk-twofactor-helper{margin:9px 0 0;font-size:11px;line-height:1.5;color:var(--ps-muted,#b0afb1)}
.usk-twofactor-feedback{margin:9px 0 0;font-size:12px;color:#ff9ea5;line-height:1.45}
.usk-twofactor-error{margin:0 0 18px;padding:12px 14px;border:1px solid rgba(255,100,118,.34);
  border-radius:10px;color:#ff9ea5;background:rgba(176,48,59,.09);font-size:12px;line-height:1.55;}
.usk-twofactor-submit{width:100%;min-height:47px;margin:20px 0 0;padding:10px 14px;
  border:1px solid var(--ps-accent,#d7b079);border-radius:9px;
  background:var(--ps-accent,#d7b079);color:var(--ps-accent-ink,#241d15);
  font-size:13px;font-weight:740;cursor:pointer;}
.usk-twofactor-submit:hover{filter:brightness(1.06)}
.usk-twofactor-submit:focus-visible,.usk-twofactor-mode:focus-visible,.usk-twofactor-cancel:focus-visible{outline:2px solid var(--ps-accent2,#f1d7a8);outline-offset:3px}
.usk-twofactor-mode{align-self:center;margin:12px 0 0;padding:5px 9px;border:0;background:transparent;
  color:var(--ps-accent2,#f1d7a8);font-size:12px;font-weight:640;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.usk-twofactor-separator{display:flex;align-items:center;gap:12px;margin:21px 0 15px;
  font:600 9px/1.6 Consolas,monospace;letter-spacing:.16em;color:var(--ps-muted,#b0afb1);white-space:nowrap;}
.usk-twofactor-separator span{flex:1;height:1px;background:var(--ps-border-soft,var(--ps-border,#544d40));}
.usk-twofactor-recovery-note{font-size:11px;line-height:1.65;text-align:center;color:var(--ps-muted,#b0afb1);margin:0 0 17px;}
.usk-twofactor-cancel{display:block;text-align:center;color:var(--ps-muted,#b0afb1);font-size:12px;text-decoration:none;}
.usk-twofactor-cancel:hover{color:var(--ps-accent2,#f1d7a8);text-decoration:underline}
.usk-twofactor-footer{align-self:center;text-align:center;color:var(--ps-muted,#b0afb1);opacity:.7;
  font:600 9px/1.5 Consolas,monospace;letter-spacing:.16em}
@media(max-width:520px){
  .usk-twofactor-page{padding:18px 12px 24px}
  .usk-twofactor-layout{gap:13px}
  .usk-twofactor-card{padding:22px 18px 23px;border-radius:14px}
  .usk-twofactor-heading{margin:16px 0 17px}
  .usk-twofactor-heading p{font-size:12px}
  .usk-twofactor-otp:not([hidden]){gap:7px}
  .usk-twofactor-otp input{height:47px;font-size:20px}
}
@media(max-width:350px){
  .usk-twofactor-page{padding:14px 9px 20px}
  .usk-twofactor-card{padding:18px 12px 19px}
  .usk-twofactor-otp:not([hidden]){gap:5px}
  .usk-twofactor-otp input{height:42px;font-size:18px}
  .usk-twofactor-brand-caption{font-size:8px}
}


/* ===== SETTINGS PAGE — Core V2 shared-production presentation ===== */
/* Page-scoped: no changes to other Core V2 sections or common header. */
body:has(.usk-page-settings){--usk-st-bg:var(--mf-bg,#0b0d10);--usk-st-card:var(--mf-card,#181b1f);--usk-st-line:var(--mf-line,#544d40);--usk-st-accent:var(--mf-accent,#d7b079);--usk-st-accent-bright:var(--mf-accent-text,#f1d7a8);--usk-st-text:var(--mf-text,#f1f0ec);--usk-st-muted:var(--mf-muted,#b0afb1);}
.usk-page-settings{min-width:0;overflow-x:hidden;color:var(--usk-st-text);}
.usk-page-settings *{box-sizing:border-box;}
.usk-page-settings .settings-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start;margin-bottom:18px;}
.usk-page-settings .settings-stack{display:flex;flex-direction:column;gap:18px;min-width:0;}
.usk-page-settings :is(.settings-card,.twofa-card,.recovery-card,.usk-settings-referrals-table){position:relative;min-width:0;margin:0!important;padding:23px!important;background:var(--usk-st-card)!important;border:1px solid var(--usk-st-line)!important;border-radius:14px!important;box-shadow:0 12px 32px rgba(0,0,0,.13)!important;overflow:hidden;}
.usk-page-settings :is(.settings-card,.twofa-card,.recovery-card,.usk-settings-referrals-table)::before{content:"";position:absolute;top:0;left:24px;right:24px;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--usk-st-accent) 42%,transparent),transparent);pointer-events:none;}
.usk-page-settings .usk-settings-section-kicker{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 13px;line-height:1.4;font:650 10px/1.5 Consolas,"SFMono-Regular",monospace;letter-spacing:.115em;color:var(--usk-st-accent-bright);}
.usk-page-settings .usk-settings-section-kicker span+span{font-size:9px;color:var(--usk-st-muted);opacity:.7;}
.usk-page-settings .settings-title{margin:0 0 8px;color:var(--usk-st-text);font-size:18px;font-weight:720;line-height:1.3;letter-spacing:-.02em;}
.usk-page-settings .settings-subtitle{margin:0 0 19px;color:var(--usk-st-muted);font-size:12px;font-weight:450;line-height:1.65;}
.usk-page-settings .settings-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 20px;}
.usk-page-settings .settings-meta-item{min-width:0;padding:13px 14px;border:1px solid color-mix(in srgb,var(--usk-st-line) 75%,transparent);border-radius:10px;background:color-mix(in srgb,var(--usk-st-bg) 68%,var(--usk-st-card));box-shadow:none;}
.usk-page-settings .settings-meta-label{display:block;margin-bottom:6px;color:var(--usk-st-muted);font-size:10px;line-height:1.4;letter-spacing:.065em;font-weight:680;text-transform:uppercase;}
.usk-page-settings .settings-meta-value{display:block;min-width:0;color:var(--usk-st-text);font-size:13px;font-weight:650;overflow-wrap:anywhere;}
.usk-page-settings .settings-form .form-group,.usk-page-settings .twofa-details .form-group{margin-bottom:14px;}
.usk-page-settings .settings-form label,.usk-page-settings .twofa-setup label,.usk-page-settings .twofa-details label{display:block;margin:0 0 7px;font-size:11px;font-weight:650;color:var(--usk-st-muted);}
.usk-page-settings .neu-input{display:block;width:100%;min-width:0;min-height:43px;padding:10px 12px;border:1px solid var(--usk-st-line);border-radius:9px;background:var(--mf-input,#111317);color:var(--usk-st-text);box-shadow:none;outline:none;font-size:13px;}
.usk-page-settings .neu-input:focus{border-color:var(--usk-st-accent);outline:2px solid color-mix(in srgb,var(--usk-st-accent) 20%,transparent);outline-offset:1px;box-shadow:none;}
.usk-page-settings .password-help{margin:6px 0 0;color:var(--usk-st-muted);font-size:11px;line-height:1.6;}
.usk-page-settings .neu-btn{min-height:41px;padding:9px 15px;border:1px solid var(--usk-st-line);border-radius:9px;background:color-mix(in srgb,var(--usk-st-accent) 11%,var(--usk-st-card));color:var(--usk-st-accent-bright);font-size:12px;font-weight:690;line-height:1.35;cursor:pointer;white-space:normal;box-shadow:none;transition:background .18s,border-color .18s;}
.usk-page-settings .neu-btn:hover{border-color:var(--usk-st-accent);background:color-mix(in srgb,var(--usk-st-accent) 16%,var(--usk-st-card));}
.usk-page-settings .neu-btn:focus-visible,.usk-page-settings .usk-settings-link-button:focus-visible{outline:2px solid var(--usk-st-accent-bright);outline-offset:2px;}
.usk-page-settings .settings-form>.neu-btn{width:100%;margin-top:6px;}
.usk-page-settings .ref-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:10px;margin:0 0 20px;}
.usk-page-settings .ref-code-box{display:flex;align-items:center;min-width:0;min-height:44px;padding:10px 12px;border:1px solid var(--usk-st-line);border-radius:9px;background:var(--mf-input,#111317);color:var(--usk-st-text);font-size:13px;font-weight:750;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:none;}
.usk-page-settings .ref-code-row .neu-btn{width:auto;min-width:90px;max-width:none;padding:9px 14px;margin:0;}
.usk-page-settings .ref-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:18px 0;}
.usk-page-settings .ref-stat{min-width:0;padding:14px 6px;border:1px solid color-mix(in srgb,var(--usk-st-line) 75%,transparent);border-radius:9px;text-align:center;background:color-mix(in srgb,var(--usk-st-bg) 58%,var(--usk-st-card));}
.usk-page-settings .ref-stat strong{display:block;margin-bottom:4px;color:var(--usk-st-accent-bright);font-size:17px;line-height:1.3;font-weight:730;overflow-wrap:anywhere;}
.usk-page-settings .ref-stat span{display:block;color:var(--usk-st-muted);font-size:9px;font-weight:600;line-height:1.5;letter-spacing:.04em;text-transform:uppercase;}
.usk-page-settings .ref-info{margin:0;color:var(--usk-st-muted);font-size:12px;line-height:1.7;}
.usk-page-settings .ref-info b{color:var(--usk-st-text);}
.usk-page-settings .ref-valid,.usk-page-settings .ref-contribution{color:#4ce0a2;font-weight:680;}
.usk-page-settings .ref-wait{color:var(--usk-st-accent-bright);font-weight:680;}
.usk-page-settings .twofa-card{padding:23px!important;}
.usk-page-settings .twofa-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.usk-page-settings .twofa-head .settings-subtitle{margin-bottom:0;}
.usk-page-settings .twofa-status{display:inline-flex;align-items:center;flex:0 0 auto;gap:6px;padding:6px 9px;border:1px solid var(--usk-st-line);border-radius:999px;font-size:10px;font-weight:720;white-space:nowrap;letter-spacing:.03em;}
.usk-page-settings .twofa-status.on{color:#4ce0a2;border-color:rgba(76,224,162,.35);background:rgba(76,224,162,.07);}
.usk-page-settings .twofa-status.off{color:var(--usk-st-accent-bright);background:color-mix(in srgb,var(--usk-st-accent) 10%,transparent);}
.usk-page-settings .twofa-status.warn,.usk-page-settings .usk-settings-warning{color:#ff9ea5;}
.usk-page-settings .twofa-actions{margin-top:16px;}
.usk-page-settings .usk-settings-setup-action{display:flex;align-items:center;justify-content:space-between;gap:13px;}
.usk-page-settings .usk-settings-setup-action form{flex:0 0 auto;}
.usk-page-settings .twofa-setup{margin-top:18px;padding-top:18px;border-top:1px solid var(--usk-st-line);}
.usk-page-settings .twofa-setup-grid{display:grid;grid-template-columns:166px minmax(0,1fr);gap:18px;align-items:start;}
.usk-page-settings .twofa-qr{display:flex;align-items:center;justify-content:center;width:166px;min-height:166px;padding:5px;border-radius:12px;border:1px solid var(--usk-st-line);background:#fff;box-sizing:border-box;}
.usk-page-settings .twofa-qr :is(img,canvas){max-width:156px!important;max-height:156px!important;}
.usk-page-settings .usk-settings-qr-message{color:#707683;font-size:11px;text-align:center;line-height:1.5;}
.usk-page-settings .twofa-key{display:block;min-width:0;padding:10px 12px;margin:8px 0 12px;border:1px solid var(--usk-st-line);border-radius:9px;background:var(--mf-input,#111317);color:var(--usk-st-text);font:700 12px/1.6 Consolas,monospace;overflow-wrap:anywhere;}
.usk-page-settings .twofa-inline-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;}
.usk-page-settings .twofa-inline-form .neu-btn{min-width:92px;margin:0;}
.usk-page-settings .usk-settings-otp-single{text-align:center;letter-spacing:.12em;font-weight:750;}
.usk-page-settings .usk-settings-cancel-setup{margin-top:9px;}
.usk-page-settings .usk-settings-link-button{padding:4px 0;border:0;background:transparent;color:var(--usk-st-muted);font-size:11px;cursor:pointer;}
.usk-page-settings .twofa-details{margin-top:14px;padding-top:12px;border-top:1px solid var(--usk-st-line);}
.usk-page-settings .twofa-details summary{color:var(--usk-st-accent-bright);font-size:12px;font-weight:650;cursor:pointer;user-select:none;}
.usk-page-settings .twofa-details summary.twofa-danger{color:#ff9ea5;}
.usk-page-settings .twofa-details form{display:grid;gap:3px;margin-top:15px;}
.usk-page-settings .twofa-details .neu-btn{width:100%;}
.usk-page-settings .recovery-card{margin:0 0 18px!important;border-left:3px solid #4ce0a2!important;}
.usk-page-settings .recovery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:14px 0;}
.usk-page-settings .recovery-code{min-width:0;padding:10px 7px;border:1px solid var(--usk-st-line);border-radius:8px;background:var(--mf-input,#111317);color:var(--usk-st-text);text-align:center;font:700 12px/1.3 Consolas,monospace;overflow-wrap:anywhere;}
.usk-page-settings .usk-settings-alert{margin:0 0 18px!important;padding:14px 16px!important;}
.usk-page-settings .usk-settings-alert.is-success{border-left:3px solid #4ce0a2!important;}
.usk-page-settings .usk-settings-alert.is-error{border-left:3px solid #ff9ea5!important;}
.usk-page-settings .usk-settings-alert p{color:var(--usk-st-text);font-size:13px;}
.usk-page-settings .usk-settings-referrals-table{padding:0!important;}
.usk-page-settings .usk-settings-referrals-table>.usk-settings-section-kicker{padding:18px 23px 0;margin-bottom:5px;}
.usk-page-settings .usk-settings-table-heading{padding:0 23px 14px;}
.usk-page-settings .usk-settings-table-heading .settings-subtitle{margin:0;}
.usk-page-settings .settings-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;}
.usk-page-settings .neu-table{width:100%;border-collapse:collapse;table-layout:auto;background:transparent;}
.usk-page-settings .neu-table :is(th,td){padding:13px 14px;border-bottom:1px solid color-mix(in srgb,var(--usk-st-line) 60%,transparent);text-align:left;white-space:normal;vertical-align:middle;color:var(--usk-st-text);font-size:12px;}
.usk-page-settings .neu-table th{background:color-mix(in srgb,var(--usk-st-bg) 60%,var(--usk-st-card));color:var(--usk-st-muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;}
.usk-page-settings .neu-table td b{color:var(--usk-st-text);}
.usk-page-settings .neu-table .text-right{text-align:right;}
.usk-page-settings .neu-table .text-center{text-align:center;}
.usk-page-settings .usk-settings-table-empty{padding:26px 12px!important;color:var(--usk-st-muted)!important;}
@media(max-width:1160px){
 .usk-page-settings .settings-grid{grid-template-columns:minmax(0,1fr);}
 .usk-page-settings .settings-stack{gap:16px;}
 .usk-page-settings .ref-stats{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media(max-width:720px){
 .usk-page-settings .settings-grid{gap:14px;}
 .usk-page-settings :is(.settings-card,.twofa-card,.recovery-card){padding:17px!important;}
 .usk-page-settings .usk-settings-referrals-table>.usk-settings-section-kicker{padding:17px 17px 0;}
 .usk-page-settings .usk-settings-table-heading{padding:0 17px 12px;}
 .usk-page-settings .settings-meta{grid-template-columns:minmax(0,1fr);}
 .usk-page-settings .twofa-setup-grid{grid-template-columns:minmax(0,1fr);}
 .usk-page-settings .twofa-qr{margin:0 auto;}
 .usk-page-settings .ref-stats{grid-template-columns:repeat(2,minmax(0,1fr));}
 .usk-page-settings .recovery-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
 .usk-page-settings .neu-table{min-width:600px;}
}
@media(max-width:380px){
 .usk-page-settings .twofa-head{flex-wrap:wrap;}
 .usk-page-settings .usk-settings-setup-action{flex-wrap:wrap;}
 .usk-page-settings .twofa-inline-form{grid-template-columns:minmax(0,1fr);}
 .usk-page-settings .ref-code-row{grid-template-columns:minmax(0,1fr);}
 .usk-page-settings .ref-code-row .neu-btn{width:100%;}
}


/* ===== PANEL HEADING / PALETTE — REVISION =====
   Preserve the native overline / breadcrumb / h2 / description hierarchy.
   Inset Letterpress is TEXT treatment only; never a boxed heading.
   Remove only the repetitive personal-workspace description through JS.
*/
.dashboard-header .mf-page-heading{
  display:block;
  flex:1 1 auto;
  min-width:0;
  text-align:start;
}
.dashboard-header .mf-page-heading > .lux-heading-overline,
.dashboard-header .mf-page-heading > .mf-breadcrumb{
  display:revert !important;
}
.dashboard-header .mf-page-heading > .mf-breadcrumb{
  display:flex !important;
}
.dashboard-header .mf-page-heading > .mf-page-description{
  display:block;
}
.dashboard-header .mf-page-heading .page-title{
  display:block;
  width:auto;
  max-width:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  /* 04 / Inset Letterpress: recessed ink, without a card or container. */
  text-shadow:0 1px 1px rgba(0,0,0,.48),0 -1px 0 color-mix(in srgb,var(--ps-accent,#d7b079) 23%,transparent);
  color:var(--ps-text,var(--mf-text,#f1f0ec));
  font-size:clamp(22px,2.1vw,29px);
  line-height:1.18;
  font-weight:650;
  letter-spacing:-.04em;
  overflow-wrap:anywhere;
}
body[data-lux-theme="light"] .dashboard-header .mf-page-heading .page-title{
  text-shadow:0 1px 0 rgba(255,255,255,.70),0 -1px 1px rgba(52,42,31,.22);
}
/* Existing download, updates and account links remain present on every screen. */
body.mf-theme.obsidian-demo .dashboard-header .header-actions > .mf-updates-link{
  display:inline-flex !important;
}
body.mf-theme.obsidian-demo .dashboard-header .header-actions > .mf-account-link,
body.mf-theme.obsidian-demo .dashboard-header .header-actions > .mf-button-primary{
  display:inline-flex !important;
}
body.mf-theme.obsidian-demo .dashboard-header .header-actions > .usk-header-palette{
  display:inline-flex;
  align-self:center;
  flex:0 0 auto;
}
.usk-header-palette{position:relative;display:inline-flex;align-items:center;min-width:0;}
.usk-header-palette > .usk-palette-trigger{
  appearance:none;display:inline-flex;align-items:center;gap:8px;
  width:40px;min-width:40px;min-height:40px;padding:8px;
  justify-content:center;
  background:var(--ps-surface,var(--mf-card));
  border:1px solid var(--ps-border,var(--mf-line));
  border-radius:10px;color:var(--ps-text,var(--mf-text));
  font-family:inherit;font-weight:650;font-size:12px;line-height:1.2;white-space:nowrap;
  cursor:pointer;transition:border-color .18s ease,background .18s ease;
}
.usk-header-palette > .usk-palette-trigger:hover,
.usk-header-palette > .usk-palette-trigger[aria-expanded="true"]{
  border-color:var(--ps-accent,var(--mf-accent));
  background:var(--ps-surface2,var(--mf-raised));
}
.usk-palette-trigger:focus-visible,.usk-palette-option:focus-visible,.usk-palette-search:focus-visible{
  outline:2px solid var(--ps-accent,#D7B079);outline-offset:2px;
}
.usk-palette-trigger > .usk-palette-icon{width:17px;height:17px;flex:0 0 17px;object-fit:contain;}
.usk-palette-trigger .usk-palette-current{
  width:14px;height:14px;flex:0 0 14px;border-radius:50%;
  background:var(--ps-accent,#D7B079);border:1px solid rgba(255,255,255,.18);
  box-shadow:0 0 0 2px var(--ps-accent-soft,rgba(215,176,121,.12));
}
.usk-palette-panel{
  position:fixed;z-index:10050;width:min(388px,calc(100vw - 24px));
  max-height:min(540px,calc(100dvh - 24px));
  padding:14px;background:var(--ps-surface,#1B1C20);color:var(--ps-text,#F1F0EC);
  border:1px solid var(--ps-border,#383b3e);border-radius:16px;
  box-shadow:0 22px 70px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.07);
  overflow:hidden;display:flex;flex-direction:column;gap:10px;
}
.usk-palette-panel[hidden]{display:none !important;}
.usk-palette-menu-title{margin:0;font-size:14px;font-weight:750;line-height:1.35;}
.usk-palette-menu-hint{margin:0;font-size:11px;color:var(--ps-muted,#A6ADB7);line-height:1.45;}
.usk-palette-search{
  width:100%;min-height:36px;box-sizing:border-box;padding:7px 10px;
  border:1px solid var(--ps-border,#444);border-radius:9px;
  color:var(--ps-text,#eee);background:var(--ps-surface2,#222);
  font:inherit;font-size:12px;
}
.usk-palette-options{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  padding:3px 2px 3px 1px;min-height:0;
  scrollbar-width:thin;
}
.usk-palette-option{
  appearance:none;cursor:pointer;text-align:left;min-width:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;
  border:1px solid var(--ps-border-soft,#34383f);border-radius:11px;
  background:var(--ps-surface2,#24262a);color:var(--ps-text,#eee);
  padding:10px;font:inherit;
}
.usk-palette-option:hover,.usk-palette-option[aria-pressed="true"]{
  border-color:var(--ps-accent,#D7B079);
}
.usk-palette-option[aria-pressed="true"]{
  box-shadow:inset 0 0 0 1px var(--ps-accent-soft,rgba(215,176,121,.15));
}
.usk-palette-swatch-row{display:flex;gap:4px;width:100%;}
.usk-palette-swatch{width:23px;height:12px;border-radius:3px;border:1px solid rgba(125,125,125,.24);}
.usk-palette-option-name{font-size:11px;line-height:1.35;font-weight:700;overflow-wrap:anywhere;}
.usk-palette-option-meta{font-size:10px;color:var(--ps-muted,#A6ADB7);}
.usk-palette-empty{grid-column:1/-1;color:var(--ps-muted,#A6ADB7);font-size:12px;margin:8px 0;text-align:center;}
@media(max-width:520px){
  .dashboard-header .mf-page-heading .page-title{
    padding:0;font-size:22px;
  }
  body.mf-theme.obsidian-demo .dashboard-header > .header-actions{
    gap:7px !important;
  }
  .usk-header-palette > .usk-palette-trigger{min-height:40px;padding:8px 10px;}
  .usk-palette-panel{padding:12px;}
}

/* External SVG bulb control enhances the ORIGINAL checkbox; its change event
   and checked state remain native. Never insert SVG markup into CSS/JS. */
.dashboard-header .header-actions .usk-theme-bulb-control{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  gap:0;min-height:40px;width:40px;min-width:40px;padding:8px;
  box-sizing:border-box;flex:0 0 auto;
  border:1px solid var(--ps-border,var(--mf-line,#3b3f45));
  border-radius:12px;background:var(--ps-surface,var(--mf-card,#191d22));
  color:var(--ps-text,var(--mf-text,#ece7df));
  font-size:12px;font-weight:650;line-height:1.2;white-space:nowrap;
  cursor:pointer;isolation:isolate;
}
.dashboard-header .header-actions .usk-theme-bulb-control:hover{
  border-color:var(--ps-accent,#d7b079);
  background:var(--ps-surface2,var(--mf-raised,#272b31));
}
.dashboard-header .header-actions .usk-theme-bulb-control:has(input:focus-visible){
  outline:2px solid var(--ps-accent,#d7b079);outline-offset:2px;
}
.dashboard-header .header-actions .usk-theme-bulb-control > input[type="checkbox"][data-usk-palette-checkbox]{
  position:absolute;inset:0;width:100%;height:100%;margin:0;
  cursor:pointer;opacity:0;z-index:3;
}
.dashboard-header .header-actions .usk-theme-bulb-control > .usk-palette-track{display:none !important;}
.usk-theme-bulb-icon{width:19px;height:19px;display:inline-grid;place-items:center;flex:0 0 19px;pointer-events:none;position:relative;}
.usk-theme-bulb-icon > img{width:19px;height:19px;display:block;position:absolute;inset:0;object-fit:contain;}
.usk-theme-bulb-control .usk-theme-bulb-on{display:none;}
.usk-theme-bulb-control:has(input:checked) .usk-theme-bulb-off{display:none;}
.usk-theme-bulb-control:has(input:checked) .usk-theme-bulb-on{display:block;filter:drop-shadow(0 0 5px rgba(215,176,121,.42));}
/* Same external icon also supports existing demo-style theme button, if used. */
.dashboard-header .header-actions .lux-theme-control.usk-theme-bulb-button > svg{display:none !important;}
.dashboard-header .header-actions .lux-theme-control.usk-theme-bulb-button > .usk-theme-bulb-icon{order:-1;}
.lux-theme-control.usk-theme-bulb-button .usk-theme-bulb-on{display:none;}
.lux-theme-control.usk-theme-bulb-button[aria-pressed="true"] .usk-theme-bulb-on{display:block;filter:drop-shadow(0 0 5px rgba(215,176,121,.42));}
.lux-theme-control.usk-theme-bulb-button[aria-pressed="true"] .usk-theme-bulb-off{display:none;}
/* Native flat checkboxes matching the Signature component demo. */
input[type="checkbox"][aria-label$=" flat"]{
  appearance:auto;width:17px;height:17px;min-width:17px;margin:0;
  accent-color:var(--ps-accent,var(--mf-accent,#d7b079));
  vertical-align:middle;cursor:pointer;
}
input[type="checkbox"][aria-label$=" flat"]:focus-visible{
  outline:2px solid var(--ps-accent,#d7b079);outline-offset:3px;
}
input[type="checkbox"][aria-label$=" flat"]:disabled{cursor:not-allowed;opacity:.55;}
@media(max-width:520px){
  .dashboard-header .header-actions .usk-theme-bulb-control{min-width:40px;padding:8px;}
  .usk-theme-bulb-caption{display:none;}
}

/* PANEL THEME MODES — icon-only palette and bulb controls, no labels. */
.dashboard-header .header-actions .usk-theme-bulb-control{
  width:40px;min-width:40px;padding:8px;gap:0;font-size:0;
}
.dashboard-header .header-actions .usk-theme-bulb-control > :not(input):not(.usk-theme-bulb-icon){display:none!important;}
.dashboard-header .header-actions .lux-theme-control.usk-theme-bulb-button{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;min-width:40px;min-height:40px;padding:8px;gap:0;
}
.dashboard-header .header-actions .lux-theme-control.usk-theme-bulb-button > :not(.usk-theme-bulb-icon){display:none!important;}
.usk-header-palette > .usk-palette-trigger{
  width:40px;min-width:40px;min-height:40px;padding:8px;
  justify-content:center;gap:0;
}
.usk-header-palette > .usk-palette-trigger > :not(.usk-palette-icon){display:none!important;}
body[data-ps-mode="light"] .usk-theme-bulb-icon .usk-theme-bulb-on,
body[data-ps-mode="light"] .usk-header-palette .usk-palette-icon{filter:brightness(.83);}


/* LIVE INDEX — footer layout from index.php, scoped to this page. */
          /* Anamenü altbilgisi: üç içerik aynı satırda, fazladan satır olmadan. */
          .usk-page-index .mf-workspace-footer {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
            align-items: center;
            gap: 12px;
          }
          .usk-page-index .mf-workspace-footer > a { justify-self: end; }
          .usk-page-index .mf-workspace-footer .mf-crafted-with-love {
            justify-self: center;
            color: #ff4b5c;
            font-size: 14px;
            font-weight: 650;
            line-height: 1.6;
            white-space: nowrap;
            letter-spacing: .01em;
          }
          @media (max-width: 640px) {
            /* Telefonda mevcut iki satır düzenini koru; kalbi ilk satıra yerleştir. */
            .usk-page-index .mf-workspace-footer {
              position: relative;
              display: flex;
              flex-direction: column;
              align-items: flex-start;
            }
            .usk-page-index .mf-workspace-footer .mf-crafted-with-love {
              position: absolute;
              top: 19px;
              right: 0;
              font-size: 12px;
            }
          }
          @media (max-width: 360px) {
            .usk-page-index .mf-workspace-footer > span:first-child { font-size: 12px; }
            .usk-page-index .mf-workspace-footer .mf-crafted-with-love { font-size: 11px; }
          }
        

/* Live index hero microcopy: the mockup stylesheet has no rule for this PHP-only marker. */
.usk-page-index .sc-showcase-hero-foot {
  display:block;
  margin-top:13px;
  max-width:100%;
  color:var(--ps-muted,var(--mf-muted,#9f9b95));
  font-size:9px;
  font-weight:650;
  letter-spacing:.12em;
  line-height:1.5;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}

/* Live index: source-aligned Hero artwork and optical/kinetic metric identity.
   Scoped to the index; existing component effects retain their owners. */
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .lux-art.sig-stage-side{
  --sig-delay:280ms;
  pointer-events:none;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{
  width:100%;height:100%;display:block;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-overview-metrics > .mf-metric .sd-vm-code{
  bottom:23px;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-overview-metrics > .mf-metric .sd-op-tracker{
  bottom:9px;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-overview-metrics > .mf-metric .sd-vm-corner{
  z-index:14;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-overview-metrics > .mf-metric .sd-vm-watermark{
  pointer-events:none;
}

/* Source-matched index Hero artwork (logo(3).html). Scoped to the signed-in index. */
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art{
  position:absolute;inset:0;z-index:1;overflow:hidden;border-radius:inherit;
  pointer-events:none;isolation:isolate;--panel-art-x:66%;--panel-art-y:49%;
  --panel-mx:66%;--panel-my:46%;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse 34% 68% at var(--panel-art-x) var(--panel-art-y),
   color-mix(in srgb,var(--gold) 14%,transparent) 0%,
   color-mix(in srgb,var(--gold) 7%,transparent) 38%,transparent 82%);
  animation:landing-art-halo-breathe 9s ease-in-out infinite alternate;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid{
  position:absolute;inset:-18px;z-index:0;opacity:.40;
  background-image:linear-gradient(color-mix(in srgb,var(--light) 9%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--light) 9%,transparent) 1px,transparent 1px);
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 40% 72% at 67% 52%,#000 0%,rgba(0,0,0,.64) 45%,transparent 100%);
  mask-image:radial-gradient(ellipse 40% 72% at 67% 52%,#000 0%,rgba(0,0,0,.64) 45%,transparent 100%);
  animation:landing-art-grid-drift 14s linear infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit{
  position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;
  pointer-events:none;opacity:.87;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 57% 90% at 65% 50%,#000 15%,transparent 95%);
  mask-image:radial-gradient(ellipse 57% 90% at 65% 50%,#000 15%,transparent 95%);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-cursor-glow{
  position:absolute;inset:0;z-index:2;
  background:radial-gradient(220px circle at var(--panel-mx) var(--panel-my),
    color-mix(in srgb,var(--light) 16%,transparent),color-mix(in srgb,var(--gold) 5%,transparent) 43%,transparent 84%);
  opacity:.42;transition:opacity .3s ease;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero:hover .landing-panel-cursor-glow{opacity:.8;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-glyph-stage{
  position:absolute;inset:0;z-index:3;transform:translate3d(var(--art-parallax-x,0px),var(--art-parallax-y,0px),0);
  opacity:.83;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit{
  position:absolute;left:var(--panel-art-x);top:var(--panel-art-y);
  border:1px solid color-mix(in srgb,var(--light) 20%,transparent);border-radius:50%;
  transform:translate(-50%,-50%);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--gold) 14%,transparent));
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one{width:150px;height:150px;border-color:color-mix(in srgb,var(--light) 41%,transparent);box-shadow:inset 0 0 50px color-mix(in srgb,var(--gold) 9%,transparent);animation:landing-art-orbit-one 21s linear infinite;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two{width:235px;height:235px;border-color:color-mix(in srgb,var(--gold) 29%,transparent);animation:landing-art-orbit-two 29s linear infinite;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-three{width:325px;height:325px;border-color:color-mix(in srgb,var(--gold) 16%,transparent);box-shadow:0 0 40px color-mix(in srgb,var(--gold) 4%,transparent);animation:landing-art-orbit-three 15s ease-in-out infinite;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one::before,body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two::before{
  content:"";position:absolute;top:20px;left:21px;width:4px;height:4px;border-radius:50%;
  background:var(--light);box-shadow:0 0 12px 2px color-mix(in srgb,var(--gold) 60%,transparent);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two::before{top:auto;left:auto;right:26px;bottom:43px;width:3px;height:3px;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph{
  position:absolute;left:var(--panel-art-x);top:var(--panel-art-y);width:94px;height:94px;
  display:grid;place-items:center;border-radius:18px;
  border:1px solid color-mix(in srgb,var(--light) 64%,transparent);
  background:linear-gradient(145deg,
    color-mix(in srgb,#473a28 78%,transparent),
    color-mix(in srgb,#201d1b 84%,transparent) 60%,
    color-mix(in srgb,#111419 88%,transparent));
  backdrop-filter:blur(10px) saturate(1.05);
  box-shadow:0 15px 52px rgba(0,0,0,.38),inset 0 1px 0 color-mix(in srgb,var(--light) 41%,transparent),0 0 32px color-mix(in srgb,var(--gold) 23%,transparent);
  transform:translate(-50%,-50%) rotate(-45deg);
  animation:landing-art-glyph-float 6.8s ease-in-out infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph span{
  font:600 49px/1 Georgia,serif;color:var(--light);transform:rotate(45deg);
  text-shadow:0 1px 10px color-mix(in srgb,var(--gold) 28%,transparent);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph i{position:absolute;inset:9px;border:1px solid color-mix(in srgb,var(--light) 21%,transparent);border-radius:11px;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-art{opacity:.54;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-circuit{mix-blend-mode:multiply;opacity:.6;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-central-glyph{background:linear-gradient(145deg,rgba(222,210,187,.82),rgba(198,174,137,.78) 65%,rgba(184,158,118,.74));border-color:rgba(112,76,34,.5);backdrop-filter:blur(10px) saturate(1.05);box-shadow:0 12px 30px rgba(93,64,27,.16),inset 0 1px 0 #fff9;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-central-glyph span{color:#65411f;text-shadow:0 1px 0 #fff7;}
@media (max-width:900px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art{--panel-art-x:71%;--panel-art-y:53%;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-three{width:240px;height:240px;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two{width:180px;height:180px;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one{width:126px;height:126px;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph{width:75px;height:75px;border-radius:15px;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph span{font-size:40px;}
}
@media (max-width:620px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art{--panel-art-x:50%;--panel-art-y:58%;opacity:.43;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid{opacity:.24;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit{opacity:.49;}
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{
  --panel-art-x:50%;--panel-art-y:50%;
  inset:0;z-index:1;opacity:1;pointer-events:none;
  -webkit-mask-image:none;mask-image:none;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{
  opacity:.42;inset:0;background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
  mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{
  opacity:1;mix-blend-mode:screen;
  -webkit-mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
  mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
  filter:drop-shadow(0 0 4px color-mix(in srgb,var(--gold) 35%,transparent));
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-glyph-stage.lux-glyph-stage{opacity:.88;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph{
  box-shadow:inset 0 1px 0 rgba(255,245,221,.52),0 0 35px color-mix(in srgb,var(--gold) 20%,transparent),0 15px 40px rgba(0,0,0,.32);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption{
  position:absolute;z-index:4;pointer-events:none;
  font:500 8px/1.4 Consolas,"SFMono-Regular",monospace;
  color:color-mix(in srgb,var(--light) 58%,var(--muted));
  letter-spacing:.12em;opacity:.48;white-space:nowrap;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption-top{top:17%;left:51%;transform:translateX(-50%);}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption-bottom{bottom:16%;left:50%;transform:translateX(-50%);}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-art.lux-art{opacity:.65;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{
  mix-blend-mode:multiply;opacity:.88;filter:none;
}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-art-caption{color:#78532c;opacity:.58;}
@media (max-width:900px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{--panel-art-x:50%;--panel-art-y:50%;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption{font-size:7px;}
}
@media (max-width:620px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{--panel-art-x:50%;--panel-art-y:50%;opacity:.55;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{opacity:.22;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{opacity:.78;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption{display:none;}
}
@media (max-width:380px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-glyph-stage.lux-glyph-stage{opacity:.64;}
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{
  opacity:.62;
  background-image:
    linear-gradient(color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px),
    linear-gradient(90deg,color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px);
  background-size:36px 36px;
  animation:landing-art-grid-sweep 9s linear infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-scan-ray.lux-scan-ray{
  position:absolute;inset:-15% -18%;z-index:2;pointer-events:none;
  background:linear-gradient(111deg,
    transparent 46.5%,
    color-mix(in srgb,var(--gold) 2%,transparent) 48.5%,
    color-mix(in srgb,var(--light) 23%,transparent) 49.8%,
    color-mix(in srgb,var(--light) 9%,transparent) 50.45%,
    transparent 53%);
  opacity:.66;filter:blur(11px);
  -webkit-mask-image:radial-gradient(ellipse 34% 68% at 50% 50%,#000 10%,transparent 100%);
  mask-image:radial-gradient(ellipse 34% 68% at 50% 50%,#000 10%,transparent 100%);
  animation:landing-art-scan-sweep 6.4s cubic-bezier(.42,0,.58,1) infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-cursor-glow.lux-cursor-glow::after{
  content:"";position:absolute;inset:8% 12%;pointer-events:none;
  background:radial-gradient(ellipse 32% 43% at 50% 50%,
    color-mix(in srgb,var(--light) 12%,transparent),
    color-mix(in srgb,var(--gold) 5%,transparent) 46%,transparent 85%);
  animation:landing-art-ambient-drift 5.8s ease-in-out infinite alternate;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one.lux-orbit-one{
  animation:landing-art-orbit-one 10s linear infinite;
  border-color:color-mix(in srgb,var(--light) 46%,transparent);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two.lux-orbit-two{
  animation:landing-art-orbit-two 13s linear infinite;
  border-color:color-mix(in srgb,var(--gold) 40%,transparent);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-three.lux-orbit-three{
  animation:landing-art-orbit-three 10s ease-in-out infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one::before,body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two::before{
  width:6px;height:6px;background:var(--light);
  box-shadow:0 0 9px 2px color-mix(in srgb,var(--light) 62%,transparent),
             0 0 24px 5px color-mix(in srgb,var(--gold) 38%,transparent);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one::after,body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two::after{
  content:"";position:absolute;inset:-2px;padding:2px;border-radius:50%;pointer-events:none;
  background:conic-gradient(from 190deg,transparent 0deg 110deg,
    color-mix(in srgb,var(--gold) 13%,transparent) 145deg,
    color-mix(in srgb,var(--light) 79%,transparent) 162deg,
    color-mix(in srgb,var(--gold) 25%,transparent) 181deg,transparent 217deg 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  filter:drop-shadow(0 0 6px color-mix(in srgb,var(--gold) 50%,transparent));
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph{
  animation:landing-art-glyph-float 4.5s ease-in-out infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph::before{
  content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(128deg,transparent 35%,color-mix(in srgb,var(--light) 19%,transparent) 50%,transparent 65%);
  background-size:230% 100%;
  animation:landing-art-glyph-shine 5.5s ease-in-out infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph span{position:relative;z-index:1;}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-scan-ray.lux-scan-ray{
  mix-blend-mode:multiply;opacity:.4;
}
@media (max-width:620px){
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{opacity:.37;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-scan-ray.lux-scan-ray{opacity:.38;}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one::before,body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two::before{width:4px;height:4px;}
}
@media (max-width:620px){
.opening>body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero>.landing-panel-art{opacity:.4}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption{display:none}
}

/* Integration: keep the logo inside the existing right-hand dashboard column. */
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{
  --gold:var(--ps-accent,#d7b079);
  --light:var(--ps-accent2,#f1d7a8);
  --muted:var(--ps-muted,#b0afb1);
  --panel-art-x:50%;--panel-art-y:50%;--panel-mx:50%;--panel-my:50%;
  position:relative;inset:auto;right:auto;left:auto;top:auto;bottom:auto;
  width:100%;height:100%;min-height:245px;grid-column:2;
  isolation:isolate;overflow:hidden;opacity:1;pointer-events:none;
  -webkit-mask-image:none;mask-image:none;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-glyph-stage.lux-glyph-stage{
  opacity:.88;transform:translate3d(0,0,0);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{
  width:100%;height:100%;mix-blend-mode:screen;opacity:1;
  -webkit-mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
  mask-image:radial-gradient(ellipse 72% 96% at 50% 50%,#000 15%,rgba(0,0,0,.9) 72%,transparent 100%);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{
  opacity:.62;inset:0!important;
  background-size:36px 36px;
  -webkit-mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
  mask-image:radial-gradient(ellipse 50% 68% at 50% 50%,#000 0%,rgba(0,0,0,.76) 48%,transparent 100%);
  animation:landing-art-grid-sweep 9s linear infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-scan-ray.lux-scan-ray{
  inset:-15% -18%;filter:blur(11px);
  animation:landing-art-scan-sweep 6.4s cubic-bezier(.42,0,.58,1) infinite;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one.lux-orbit-one{
  animation:landing-art-orbit-one 10s linear infinite!important;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two.lux-orbit-two{
  animation:landing-art-orbit-two 13s linear infinite!important;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-three.lux-orbit-three{
  animation:landing-art-orbit-three 10s ease-in-out infinite!important;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph{
  animation:landing-art-glyph-float 4.5s ease-in-out infinite!important;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph::before{
  animation:landing-art-glyph-shine 5.5s ease-in-out infinite!important;
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-art-grid.lux-art-grid{
 background-image:linear-gradient(color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px),
                  linear-gradient(90deg,color-mix(in srgb,var(--light) 15%,transparent) 1px,transparent 1px);
}
body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph::before{
  content:"";position:absolute;inset:1px;border-radius:inherit;pointer-events:none;
  background:linear-gradient(128deg,transparent 35%,color-mix(in srgb,var(--light) 19%,transparent) 50%,transparent 65%);
  background-size:230% 100%;
}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-circuit.lux-circuit-canvas{
  mix-blend-mode:multiply;opacity:.88;filter:none;
}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph{
  background:linear-gradient(145deg,rgba(222,210,187,.82),rgba(198,174,137,.78) 65%,rgba(184,158,118,.74));
  border-color:color-mix(in srgb,var(--ps-accent) 60%,transparent);
}
body.mf-theme.obsidian-demo[data-ps-mode="light"] .usk-page-index .sc-showcase-hero .landing-panel-central-glyph.lux-central-glyph span{
 color:var(--ps-accent-ink,#65411f);text-shadow:0 1px 0 #fff7;
}
@media(max-width:760px) and (min-width:521px){
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{min-height:0;}
}
@media(max-width:520px){
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art{
   position:absolute;left:auto;right:-90px;top:0;bottom:0;width:280px;height:auto;min-height:0;
   opacity:.32;
   -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.44) 27%,#000 68%);
   mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.44) 27%,#000 68%);
 }
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-art-caption{display:none;}
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-one{width:82px;height:82px;}
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-two{width:112px;height:112px;}
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-orbit-three{width:153px;height:153px;}
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph{width:66px;height:66px;border-radius:12px;}
 body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero .landing-panel-central-glyph span{font-size:35px;}
}

/* Signed-in dashboard Hero: fade the LEFT edge of the right-hand U/Circuit artwork.
   Preserve the original mobile (<521px) artwork masking and all other pages. */
@media (min-width:521px){
  body.mf-theme.obsidian-demo .usk-page-index .sc-showcase-hero > .landing-panel-art.lux-art.sig-stage.sig-stage-side{
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.20) 14%,rgba(0,0,0,.68) 31%,#000 49%,#000 100%);
    mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.20) 14%,rgba(0,0,0,.68) 31%,#000 49%,#000 100%);
  }
}


/* ==========================================================
   USKOBOT CORE V2 — AUTHENTICATED SERVICES PAGE
   Scoped presentation; never change the legacy action/API
   contracts, server package IDs, or shared page heading.
   ========================================================== */
.usk-page-services{
  --sv-ink:var(--ps-text,var(--mf-text,#f0efeb));
  --sv-muted:var(--ps-muted,var(--mf-muted,#afb0af));
  --sv-accent:var(--ps-accent,var(--mf-accent,#d7b079));
  --sv-line:var(--ps-border,var(--mf-line,#514b42));
  --sv-bg:var(--ps-bg,var(--mf-bg,#0b0d10));
  --sv-card:var(--ps-surface,var(--mf-card,#1b1c20));
  --sv-subcard:var(--ps-surface2,var(--mf-raised,#26272b));
  color:var(--sv-ink);min-width:0;
}
.usk-page-services :is(.usk-services-intro,.usk-services-scope,.usk-services-toolbar,.usk-services-gifts,.usk-services-table-frame){box-sizing:border-box;min-width:0;}
/* Keep the normal shared mf-page-heading hierarchy untouched. */
.usk-page-services .usk-services-intro{
  margin:0 0 22px!important;padding:0 1px;
  color:var(--sv-muted);font-size:13px;line-height:1.75;
}
.usk-page-services .usk-services-intro p:first-child{margin:0;color:var(--sv-muted)!important;font-size:13px!important;line-height:1.75;}
.usk-page-services .usk-services-intro p+p{margin:10px 0 0!important;color:var(--sv-accent)!important;font-size:12px!important;font-weight:700;line-height:1.65;}
.usk-page-services .usk-services-scope,
.usk-page-services .usk-services-toolbar,
.usk-page-services .usk-services-gifts,
.usk-page-services .usk-services-table-frame{
  position:relative;margin:0 0 16px;border:1px solid color-mix(in srgb,var(--sv-line) 72%,transparent);
  border-radius:16px;background:var(--sv-card);box-shadow:0 12px 34px rgba(0,0,0,.12);
}
.usk-page-services .usk-services-scope::before,
.usk-page-services .usk-services-toolbar::before,
.usk-page-services .usk-services-gifts::before,
.usk-page-services .usk-services-table-frame::before{
  content:"";position:absolute;inset:0 auto auto 24px;width:min(40%,310px);height:1px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--sv-accent) 58%,transparent),transparent);
  pointer-events:none;
}
/* Server scope chooser */
.usk-page-services .usk-services-scope{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:17px 20px;}
.usk-page-services .usk-server-scope-header{display:flex;flex-direction:column;gap:3px;min-width:200px;flex:1 1 225px;}
.usk-page-services .usk-server-scope-header strong{color:var(--sv-ink);font-size:14px;letter-spacing:-.015em;font-weight:750;}
.usk-page-services .usk-server-scope-header small{color:var(--sv-muted);font-size:11px;line-height:1.5;}
.usk-page-services .usk-server-scope-options{display:inline-flex;gap:4px;flex-shrink:0;padding:4px;border-radius:11px;border:1px solid var(--sv-line);background:color-mix(in srgb,var(--sv-bg) 72%,var(--sv-card));}
.usk-page-services .usk-server-scope-options button{min-width:84px;border:0;border-radius:8px;padding:9px 13px;background:transparent;color:var(--sv-muted);font-size:11px;font-weight:750;letter-spacing:.09em;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;}
.usk-page-services .usk-server-scope-options button[aria-pressed="true"]{background:color-mix(in srgb,var(--sv-accent) 15%,var(--sv-card));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sv-accent) 38%,transparent);color:var(--sv-accent);}
.usk-page-services .usk-server-scope-options button:focus-visible{outline:2px solid var(--sv-accent);outline-offset:2px;}
.usk-page-services .usk-server-scope-message{flex-basis:100%;font-size:11px;line-height:1.3;color:var(--sv-muted);margin:0;}
.usk-page-services .usk-server-scope-message:empty{display:none;}
/* Search / results */
.usk-page-services .usk-services-toolbar{display:flex;align-items:center;gap:17px;flex-wrap:wrap;padding:17px 20px;}
.usk-page-services .usk-sc-toolbar-heading{display:flex;flex-direction:column;gap:5px;min-width:200px;flex:1 1 215px;}
.usk-page-services .usk-sc-overline{color:var(--sv-accent);font:650 10px/1.3 Consolas,monospace;letter-spacing:.115em;}
.usk-page-services .usk-sc-toolbar-heading strong{color:var(--sv-ink);font-size:16px;font-weight:730;letter-spacing:-.025em;}
.usk-page-services .usk-sc-search{display:flex;align-items:center;gap:10px;flex:1 1 240px;max-width:375px;min-width:0;padding:0 13px;height:44px;border:1px solid color-mix(in srgb,var(--sv-line) 95%,transparent);border-radius:11px;background:color-mix(in srgb,var(--sv-bg) 54%,var(--sv-card));color:var(--sv-accent);}
.usk-page-services .usk-sc-search:focus-within{border-color:var(--sv-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--sv-accent) 12%,transparent);}
.usk-page-services .usk-sc-search>span{font-size:23px;line-height:1;transform:translateY(-1px);}
.usk-page-services .usk-sc-search input{flex:1;min-width:0;width:100%;border:0;outline:0;box-shadow:none;background:transparent;color:var(--sv-ink);font:inherit;font-size:12px;}
.usk-page-services .usk-sc-search input::placeholder{color:var(--sv-muted);opacity:.85;}
.usk-page-services .usk-sc-result{font:600 11px/1.5 Consolas,monospace;color:var(--sv-muted);white-space:nowrap;}
/* Gifts + table frames */
.usk-page-services .usk-services-gifts{margin-bottom:20px;padding:8px 10px 12px!important;border-left:2px solid color-mix(in srgb,var(--sv-accent) 65%,transparent);}
.usk-page-services .usk-services-gifts>div:first-child{padding:15px 15px 8px!important;}
.usk-page-services .usk-services-gifts h3{color:var(--sv-ink)!important;font-size:17px!important;letter-spacing:-.02em;}
.usk-page-services .usk-services-gifts p{color:var(--sv-muted)!important;line-height:1.65;}
.usk-page-services .usk-services-table-frame{padding:7px 10px!important;margin-bottom:25px;overflow-x:auto;}
.usk-page-services .usk-services-table-frame .active-services-table{width:100%;border-collapse:separate;border-spacing:0;}
.usk-page-services .usk-services-table-frame .active-services-table thead th,
.usk-page-services .usk-services-gifts .neu-table thead th{background:transparent;border-bottom:1px solid var(--sv-line);color:var(--sv-muted);font:700 10px/1.5 Consolas,monospace;letter-spacing:.09em;padding:15px 13px;text-transform:uppercase;}
.usk-page-services .usk-services-table-frame .active-service-row td,
.usk-page-services .usk-services-gifts .neu-table tbody td{border-bottom:1px solid color-mix(in srgb,var(--sv-line) 46%,transparent);padding:18px 13px;color:var(--sv-ink);}
.usk-page-services .usk-services-table-frame .active-service-row:last-child td,
.usk-page-services .usk-services-gifts .neu-table tbody tr:last-child td{border-bottom:0;}
.usk-page-services .active-service-row{transition:background .2s;}
.usk-page-services .active-service-row:hover{background:color-mix(in srgb,var(--sv-accent) 4%,transparent);}
.usk-page-services .neu-table .tier-flex-container{display:flex;align-items:center;gap:12px;min-width:0;}
.usk-page-services .neu-table .tier-flex-container>div:last-child{min-width:0;}
.usk-page-services .neu-table .neu-icon{flex:0 0 46px;width:46px!important;height:46px!important;display:grid;place-items:center;margin:0!important;border-radius:12px;border:1px solid color-mix(in srgb,var(--sv-accent) 24%,var(--sv-line));background:color-mix(in srgb,var(--sv-accent) 8%,var(--sv-card));box-shadow:none;color:var(--sv-accent);}
.usk-page-services .neu-table .tier-flex-container b{color:var(--sv-ink)!important;overflow-wrap:anywhere;line-height:1.4;}
.usk-page-services .usk-services-gifts td b[style*="#eef3fa"],
.usk-page-services .usk-services-gifts td span[style*="#eef3fa"],
.usk-page-services .usk-services-gifts td small[style*="#eef3fa"]{color:var(--sv-ink)!important;}
.usk-page-services .usk-services-gifts td :is(span,small)[style*="#ffbf47"]{color:var(--sv-accent)!important;}
.usk-page-services .neu-table .tier-flex-container small{line-height:1.5;}
.usk-page-services .active-service-row .usk-server-kind-badge{display:inline-block;margin-right:8px;padding:3px 7px;border:1px solid color-mix(in srgb,var(--sv-accent) 35%,transparent);border-radius:6px;font:700 9px/1.5 Consolas,monospace;letter-spacing:.09em;color:var(--sv-accent);background:color-mix(in srgb,var(--sv-accent) 8%,transparent);}
.usk-page-services .active-service-row .usk-server-kind-badge.is-new{color:#6acac1;border-color:rgba(106,202,193,.4);background:rgba(106,202,193,.08);}
.usk-page-services .service-expiry-cell span{color:var(--sv-ink);font-size:13px;}
.usk-page-services .service-expiry-cell span.text-danger{color:#ff6983;}
.usk-page-services .service-expiry-cell small{color:var(--sv-muted)!important;font-size:11px;line-height:1.5;}
.usk-page-services .service-renew-cell .service-renew-label{color:var(--sv-muted);font-size:10px;}
.usk-page-services .service-renew-cell .switch-container{display:inline-block;vertical-align:middle;}
.usk-page-services .service-renew-cell .switch-slider{border:1px solid var(--sv-line);background:color-mix(in srgb,var(--sv-bg) 74%,var(--sv-card));box-shadow:inset 0 2px 6px rgba(0,0,0,.18);}
.usk-page-services .service-renew-cell .switch-slider:before{background:var(--sv-muted);box-shadow:0 2px 6px rgba(0,0,0,.2);}
.usk-page-services .service-renew-cell input:checked+.switch-slider{background:color-mix(in srgb,var(--sv-accent) 63%,var(--sv-bg));border-color:var(--sv-accent);}
.usk-page-services .service-renew-cell input:checked+.switch-slider:before{background:var(--sv-card);}
.usk-page-services .service-renew-cell input:focus-visible+.switch-slider{outline:2px solid var(--sv-accent);outline-offset:4px;}
.usk-page-services .neu-table .neu-btn{margin:0;border-radius:10px!important;border:1px solid color-mix(in srgb,var(--sv-accent) 33%,var(--sv-line));background:color-mix(in srgb,var(--sv-accent) 9%,var(--sv-card));color:var(--sv-ink);box-shadow:none;transition:background .2s,border-color .2s,transform .2s;}
.usk-page-services .neu-table .neu-btn:hover{background:color-mix(in srgb,var(--sv-accent) 19%,var(--sv-card));border-color:var(--sv-accent);}
.usk-page-services .neu-table .neu-btn:focus-visible{outline:2px solid var(--sv-accent);outline-offset:2px;}
.usk-page-services [hidden]{display:none!important;}
.usk-page-services .usk-services-filter-empty{padding:23px 15px;text-align:center;font-size:13px;line-height:1.55;color:var(--sv-muted);}
/* Modal: retains original #extend-modal, #package-list, #m-buy-btn and onclick contracts. */
.usk-services-extend-modal{z-index:1250!important;padding:14px;overflow-y:auto;background:rgba(2,5,9,.74);backdrop-filter:blur(8px);}
.usk-services-extend-modal .modal-content{box-sizing:border-box;width:min(480px,100%)!important;max-height:calc(100dvh - 30px);overflow-y:auto;padding:25px!important;border:1px solid var(--ps-border,var(--mf-line,#514b42));border-radius:17px;background:var(--ps-surface,var(--mf-card,#1b1c20));color:var(--ps-text,var(--mf-text,#fff));box-shadow:0 26px 85px rgba(0,0,0,.32);}
.usk-services-extend-modal #m-title{color:var(--ps-text,var(--mf-text,#fff))!important;font-size:19px!important;}
.usk-services-extend-modal #m-category-info{color:var(--ps-accent,var(--mf-accent,#d7b079))!important;}
.usk-services-extend-modal #extend-summary{border:1px solid var(--ps-border,var(--mf-line,#514b42));border-radius:11px;background:color-mix(in srgb,var(--ps-bg,#0b0d10) 65%,var(--ps-surface,#1b1c20));box-shadow:none;}
.usk-services-extend-modal .modal-footer{display:flex;gap:10px;flex-wrap:wrap;}
.usk-services-extend-modal .modal-footer .neu-btn{min-width:130px;}
/* Mobile — only this services page; override earlier global 2x2 table rules. */
@media(max-width:992px){
  .usk-page-services .usk-services-scope{gap:12px;}
  .usk-page-services .usk-services-toolbar{gap:12px;}
  .usk-page-services .usk-services-table-frame{overflow:visible;padding:6px 10px!important;}
  .usk-page-services .active-services-table{width:100%!important;display:block!important;min-width:0!important;}
  .usk-page-services .active-services-table thead{display:none!important;}
  .usk-page-services .active-services-table tbody{display:block!important;}
  .usk-page-services .active-services-table .active-service-row{
    width:100%;display:grid!important;box-sizing:border-box;padding:15px 8px;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;align-items:center;
    gap:12px!important;
  }
  .usk-page-services .active-services-table .active-service-row>td{box-sizing:border-box;min-width:0!important;max-width:none!important;width:100%!important;border:0;padding:0!important;}
  .usk-page-services .active-services-table .service-main-cell{grid-row:1!important;grid-column:1!important;}
  .usk-page-services .active-services-table .service-expiry-cell{grid-row:1!important;grid-column:2!important;text-align:right;justify-self:stretch!important;}
  .usk-page-services .active-services-table .service-expiry-cell>div{align-items:flex-end!important;}
  .usk-page-services .active-services-table .service-expiry-cell span{font-size:13px!important;white-space:normal!important;}
  .usk-page-services .active-services-table .service-expiry-cell small{font-size:10px!important;}
  .usk-page-services .active-services-table .service-renew-cell{grid-row:2!important;grid-column:1!important;display:flex!important;align-items:center;gap:8px;justify-content:flex-start!important;}
  .usk-page-services .active-services-table .service-action-cell{grid-row:2!important;grid-column:2!important;display:flex!important;align-items:center;justify-content:flex-end!important;}
  .usk-page-services .active-services-table .service-action-cell .neu-btn{max-width:100%!important;white-space:normal!important;min-height:40px;font-size:11px!important;line-height:1.4;padding:9px 11px!important;}
  /* Gift BOT rows must remain operable on phones without horizontal scrolling. */
  .usk-page-services .usk-services-gifts{overflow:visible;}
  .usk-page-services .usk-services-gifts .neu-table{display:block;min-width:0;width:100%;}
  .usk-page-services .usk-services-gifts .neu-table thead{display:none;}
  .usk-page-services .usk-services-gifts .neu-table tbody{display:block;}
  .usk-page-services .usk-services-gifts .neu-table tbody tr{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto auto;
    gap:11px;padding:11px 8px 13px;
  }
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td{
    display:block;width:100%;min-width:0;box-sizing:border-box;
    padding:0!important;border:0;text-align:left!important;
  }
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td:nth-child(1){grid-row:1;grid-column:1/-1;}
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td:nth-child(2){grid-row:2;grid-column:1;}
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td:nth-child(3){grid-row:2;grid-column:2;}
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td:nth-child(4){grid-row:3;grid-column:1/-1;}
  .usk-page-services .usk-services-gifts .neu-table tbody tr>td:nth-child(4) .neu-btn{width:100%;min-height:42px;}
}
@media(max-width:600px){
 .usk-page-services .usk-services-intro{margin-bottom:16px!important;font-size:12px;}
 .usk-page-services .usk-services-scope,.usk-page-services .usk-services-toolbar{padding:15px 14px;}
 .usk-page-services .usk-server-scope-header{flex-basis:100%;min-width:0;}
 .usk-page-services .usk-server-scope-options{width:100%;}
 .usk-page-services .usk-server-scope-options button{flex:1;}
 .usk-page-services .usk-sc-toolbar-heading{flex:1 1 100%;min-width:0;}
 .usk-page-services .usk-sc-search{flex:1 1 calc(100% - 80px);max-width:none;}
 .usk-page-services .usk-sc-result{flex:0 0 auto;}
 .usk-page-services .usk-services-table-frame{padding:5px!important;}
 .usk-page-services .active-services-table .active-service-row{column-gap:8px!important;padding:13px 8px;}
 .usk-page-services .active-services-table .service-main-cell .neu-icon{flex-basis:40px;width:40px!important;height:40px!important;}
 .usk-page-services .active-services-table .service-main-cell .tier-flex-container{display:flex!important;gap:8px!important;}
 .usk-page-services .active-services-table .service-main-cell b{font-size:12px!important;}
 .usk-page-services .active-services-table .service-expiry-cell span{font-size:12px!important;}
 .usk-page-services .active-services-table .service-renew-cell .service-renew-label{font-size:10px!important;}
 .usk-page-services .active-services-table .service-action-cell .neu-btn{font-size:10px!important;padding:8px!important;}
 .usk-services-extend-modal .modal-content{padding:18px!important;}
}
@media(max-width:355px){
  .usk-page-services .active-services-table .active-service-row{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:repeat(4,auto)!important;}
  .usk-page-services .active-services-table .service-main-cell{grid-column:1!important;grid-row:1!important;}
  .usk-page-services .active-services-table .service-expiry-cell{grid-column:1!important;grid-row:2!important;text-align:left!important;}
  .usk-page-services .active-services-table .service-expiry-cell>div{align-items:flex-start!important;}
  .usk-page-services .active-services-table .service-renew-cell{grid-column:1!important;grid-row:3!important;}
  .usk-page-services .active-services-table .service-action-cell{grid-column:1!important;grid-row:4!important;justify-content:flex-start!important;}
  .usk-page-services .active-services-table .service-action-cell .neu-btn{margin-left:auto;}
}


/* ===== SERVICES — Signature mechanical auto-renew switch =====
   Mirrors the final demo sc-switch (recessed metal rail + raised thumb).
   Scope only the live services renew input; keep the original onchange API.
*/
.usk-page-services .service-renew-cell .sc-switch.usk-service-renew-switch{
  position:relative;display:inline-block;vertical-align:middle;
  flex:0 0 48px;width:48px;height:27px;min-width:48px;
  cursor:pointer;isolation:isolate;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > input[type="checkbox"]{
  position:absolute;inset:0;width:100%;height:100%;margin:0;
  opacity:0;z-index:2;cursor:pointer;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > i{
  display:block;position:relative;width:100%;height:100%;box-sizing:border-box;
  background:linear-gradient(169deg,
    color-mix(in srgb,var(--sv-bg) 80%,var(--sv-ink) 20%),
    color-mix(in srgb,var(--sv-card) 92%,var(--sv-ink) 8%) 61%,
    color-mix(in srgb,var(--sv-bg) 78%,var(--sv-card) 22%));
  border:1px solid color-mix(in srgb,var(--sv-line) 65%,var(--sv-ink) 35%);
  border-radius:6px;
  box-shadow:inset 0 3px 6px rgba(0,0,0,.30),
    inset 0 -1px 0 color-mix(in srgb,var(--sv-ink) 9%,transparent),
    0 1px 0 color-mix(in srgb,var(--sv-ink) 10%,transparent);
  transition:background .22s,border-color .22s;
  pointer-events:none;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > i::before{
  content:"";position:absolute;right:5px;top:7px;width:2px;height:10px;
  border-left:1px solid color-mix(in srgb,var(--sv-muted) 42%,transparent);
  border-right:1px solid color-mix(in srgb,var(--sv-accent) 32%,transparent);
  background:none;transform:none;box-shadow:none;border-radius:0;
  pointer-events:none;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > i::after{
  content:"";display:block;position:absolute;left:3px;top:3px;
  width:19px;height:19px;box-sizing:border-box;border-radius:4px;
  border:1px solid color-mix(in srgb,var(--sv-muted) 55%,var(--sv-line) 45%);
  background:
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--sv-ink) 5%,transparent) 0 1px,transparent 1px 4px),
    linear-gradient(145deg,
      color-mix(in srgb,var(--sv-muted) 57%,var(--sv-card) 43%),
      color-mix(in srgb,var(--sv-card) 64%,var(--sv-ink) 36%) 52%,
      color-mix(in srgb,var(--sv-bg) 72%,var(--sv-ink) 28%));
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--sv-ink) 17%,transparent),
    inset 0 -2px 3px rgba(0,0,0,.18),0 2px 4px rgba(0,0,0,.24),0 0 0 1px rgba(0,0,0,.10);
  transform:translateX(0);
  transition:transform .23s cubic-bezier(.18,.72,.23,1),background .23s,border-color .23s;
  pointer-events:none;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > input:checked+i{
  background:linear-gradient(158deg,
    color-mix(in srgb,var(--sv-accent) 13%,var(--sv-bg)),
    color-mix(in srgb,var(--sv-accent) 32%,var(--sv-card)) 70%,
    color-mix(in srgb,var(--sv-accent) 14%,var(--sv-bg)));
  border-color:color-mix(in srgb,var(--sv-accent) 67%,var(--sv-line) 33%);
  box-shadow:inset 0 3px 7px rgba(0,0,0,.30),
    inset 0 -1px 0 color-mix(in srgb,var(--sv-accent) 24%,transparent),
    0 1px 0 color-mix(in srgb,var(--sv-ink) 10%,transparent);
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > input:checked+i::after{
  transform:translateX(21px);
  border-color:color-mix(in srgb,var(--sv-accent) 72%,var(--sv-ink) 28%);
  background:
    repeating-linear-gradient(90deg,color-mix(in srgb,var(--sv-ink) 8%,transparent) 0 1px,transparent 1px 4px),
    linear-gradient(145deg,
      color-mix(in srgb,var(--ps-accent2,var(--sv-accent)) 78%,var(--sv-card)),
      var(--sv-accent) 55%,color-mix(in srgb,var(--sv-accent) 58%,var(--sv-card)));
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--sv-ink) 24%,transparent),
    inset 0 -2px 3px rgba(0,0,0,.15),0 2px 5px rgba(0,0,0,.24),
    0 0 10px color-mix(in srgb,var(--sv-accent) 22%,transparent);
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > input:focus-visible+i{
  outline:2px solid var(--sv-accent);outline-offset:3px;
}
.usk-page-services .service-renew-cell .usk-service-renew-switch > input:disabled+i{
  opacity:.44;
}

/* ===== SERVICES — Core V2 tooltip portal =====
   The reusable CoreV2 JS already recognizes .sc-tooltip[data-tip].
   It mounts #usk-core-tooltip directly under <body> to bypass overflow clipping.
   These CSS rules were restricted to body.ui-showcase in the demo; the
   authenticated services page now opts into the same visual behavior.
*/
body.mf-theme:has(.usk-page-services) > #usk-core-tooltip.sc-tooltip-portal{
  position:fixed;z-index:12000;
  display:block;max-width:min(320px,calc(100vw - 22px));padding:9px 12px;
  border:1px solid var(--ps-border,var(--mf-line,#65523c));border-radius:7px;
  background:var(--ps-surface2,var(--mf-raised,#191c23));
  color:var(--ps-text,var(--mf-text,#eee));
  box-shadow:0 15px 38px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.07);
  font-size:11px;line-height:1.45;white-space:normal;overflow-wrap:anywhere;
  pointer-events:none;opacity:0;transform:translateY(5px);
  transition:opacity .15s ease,transform .15s ease;
}
body.mf-theme:has(.usk-page-services) > #usk-core-tooltip.sc-tooltip-portal.is-visible{
  opacity:1;transform:translateY(0);
}
.usk-page-services .neu-icon.sc-tooltip:focus-visible{
  outline:2px solid var(--sv-accent);outline-offset:3px;
}


/* ===== Core V2 authenticated panel: pre-palette first paint =====
   The production stylesheet includes older blue (#0B111B/#151F2E)
   defaults. The Core V2 runtime applies classes and the saved palette after
   DOMContentLoaded. Prevent the transient BLUE version of the dashboard on F5.
   Only active while the JS palette is not yet applied, and only on dashboards.
   No flash/blank overlay: the page remains readable if JavaScript is disabled.
*/
html:has(body > .dashboard-container){
  background-color:#0B0D10;
}
body:has(> .dashboard-container):not([data-ps-palette]){
  color-scheme:dark;
  --ps-bg:#0B0D10;
  --ps-sidebar:#111317;
  --ps-sidebar2:#0E1012;
  --ps-surface:#1B1C20;
  --ps-surface2:#131518;
  --ps-border:#554C3F;
  --ps-border-soft:#3B3630;
  --ps-text:#F1F0EC;
  --ps-muted:#B0AFB1;
  --ps-accent:#D7B079;
  --ps-accent2:#F1D7A8;
  --mf-bg:var(--ps-bg);
  --mf-canvas:var(--ps-bg);
  --mf-sidebar:var(--ps-sidebar);
  --mf-card:var(--ps-surface);
  --mf-raised:var(--ps-surface2);
  --mf-input:var(--ps-surface2);
  --mf-text:var(--ps-text);
  --mf-muted:var(--ps-muted);
  --mf-line:var(--ps-border);
  --mf-soft:var(--ps-border-soft);
  --mf-accent:var(--ps-accent);
  --mf-accent-text:var(--ps-accent2);
  --fx-bg:var(--ps-bg);
  --fx-sidebar:var(--ps-sidebar);
  --fx-surface:var(--ps-surface);
  --fx-surface-raised:var(--ps-surface2);
  --fx-text:var(--ps-text);
  --fx-muted:var(--ps-muted);
  --fx-line:var(--ps-border);
  background-color:var(--ps-bg) !important;
  color:var(--ps-text);
}
body:has(> .dashboard-container):not([data-ps-palette]) > .dashboard-container{
  background:var(--ps-bg) !important;
}
body:has(> .dashboard-container):not([data-ps-palette]) > .dashboard-container > .sidebar,
body:has(> .dashboard-container):not([data-ps-palette]) .sidebar{
  background:var(--ps-sidebar) !important;
  color:var(--ps-text);
}
body:has(> .dashboard-container):not([data-ps-palette]) .main-content{
  background:var(--ps-bg) !important;
  color:var(--ps-text);
}
body:has(> .dashboard-container):not([data-ps-palette]) :is(.neu-panel-card,.mf-panel,.sc-card,.sc-surface){
  background-color:var(--ps-surface) !important;
  color:var(--ps-text);
}
body:has(> .dashboard-container):not([data-ps-palette]) :is(.dashboard-header,.page-header){
  color:var(--ps-text);
}