/* =====================================================
   JADID PLATFORMASI — Zamonaviy dizayn tizimi
   Meros / Heritage theme
   ===================================================== */

:root{
    --ink:        #1a1512;   /* deep warm black */
    --ink-soft:   #3a322c;
    --parchment:  #f7f2e9;   /* cream background */
    --parchment-2:#efe7d7;
    --card:       #fffdf8;
    --gold:       #c39a3e;   /* brass / gold accent */
    --gold-soft:  #e3c877;
    --gold-deep:  #a37c26;
    --emerald:    #1f5c4d;   /* erkak accent */
    --plum:       #7a2f43;   /* ayol accent */
    --line:       rgba(26,21,18,.12);
    --shadow:     0 18px 45px rgba(26,21,18,.14);
    --shadow-lg:  0 30px 70px rgba(26,21,18,.28);
    --r:          20px;
    --serif:      "Playfair Display", Georgia, serif;
    --sans:       "Manrope", "Segoe UI", system-ui, sans-serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
    font-family:var(--sans);
    background:
        radial-gradient(1200px 600px at 100% -10%, rgba(195,154,62,.10), transparent 60%),
        var(--parchment);
    color:var(--ink);
    line-height:1.7;
    -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5{ font-family:var(--serif); color:var(--ink); letter-spacing:.2px; }

a{ text-decoration:none; }

.section-eyebrow{
    display:inline-flex; align-items:center; gap:.5rem;
    font-family:var(--sans); font-weight:700; letter-spacing:.18em;
    text-transform:uppercase; font-size:.72rem; color:var(--gold-deep);
    margin-bottom:.6rem;
}
.section-eyebrow::before{
    content:""; width:34px; height:2px; background:var(--gold); display:inline-block;
}
.section-heading{ font-size:clamp(1.9rem,4vw,2.9rem); font-weight:800; line-height:1.15; }

/* ===================== NAVBAR ===================== */
.navbar{
    background:rgba(20,17,15,.82)!important;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(227,200,119,.18);
    box-shadow:0 6px 24px rgba(0,0,0,.18);
    padding:.7rem 0;
}
.navbar-brand{
    font-family:var(--serif); font-weight:800; font-size:1.45rem;
    color:#fff!important; display:flex; align-items:center; gap:.5rem;
}
.navbar-brand i{ color:var(--gold-soft); }
.navbar .nav-link{
    color:rgba(255,255,255,.82)!important; font-weight:600; font-size:.95rem;
    position:relative; margin:0 .15rem; transition:.25s;
}
.navbar .nav-link::after{
    content:""; position:absolute; left:12px; right:12px; bottom:4px; height:2px;
    background:var(--gold); transform:scaleX(0); transform-origin:left; transition:.3s;
}
.navbar .nav-link:hover{ color:#fff!important; }
.navbar .nav-link:hover::after,
.navbar .nav-link.active::after{ transform:scaleX(1); }
.navbar .form-control{
    background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
    color:#fff; border-radius:30px;
}
.navbar .form-control::placeholder{ color:rgba(255,255,255,.55); }

/* ===================== BUTTONS ===================== */
.btn{ border-radius:40px; font-weight:700; transition:.3s; border:none; }
.btn-warning{ background:var(--gold); color:#1a1512; }
.btn-warning:hover{ background:var(--gold-deep); color:#fff; transform:translateY(-2px); }
.btn-primary{ background:var(--ink); color:#fff; }
.btn-primary:hover{ background:var(--gold-deep); transform:translateY(-2px); }
.btn-outline-light:hover{ transform:translateY(-2px); }
.btn-gold{
    background:linear-gradient(135deg,var(--gold-soft),var(--gold));
    color:#1a1512; box-shadow:0 10px 24px rgba(195,154,62,.35);
}
.btn-gold:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(195,154,62,.45); }

/* ===================== HERO ===================== */
.hero{
    position:relative; overflow:hidden; color:#f7f2e9;
    background:
        radial-gradient(900px 500px at 12% 20%, rgba(195,154,62,.22), transparent 60%),
        linear-gradient(135deg,#14110f 0%, #241d16 55%, #14110f 100%);
    min-height:600px; display:flex; align-items:center;
}
.hero::before{
    content:""; position:absolute; inset:0;
    background-image:radial-gradient(rgba(227,200,119,.10) 1px, transparent 1px);
    background-size:22px 22px; opacity:.5;
}
.hero .container{ position:relative; z-index:2; }
.hero .badge{
    background:rgba(195,154,62,.18)!important; color:var(--gold-soft)!important;
    border:1px solid rgba(227,200,119,.4); border-radius:30px; padding:.5rem 1rem;
    font-family:var(--sans); font-weight:700; letter-spacing:.12em;
}
.hero h1{ color:#fff; font-size:clamp(2.4rem,6vw,4rem); font-weight:800; line-height:1.12; }
.hero h1 .accent{ color:var(--gold-soft); }
.hero p{ font-size:1.15rem; color:rgba(247,242,233,.8); max-width:600px; }
.hero-icon{ font-size:clamp(120px,20vw,260px); color:rgba(227,200,119,.16); }
.hero .btn{ padding:14px 34px; }

/* ===================== STATISTICS ===================== */
.statistics{ margin-top:-70px; position:relative; z-index:10; }
.stat-card{
    background:var(--card); border-radius:var(--r); padding:36px 28px; text-align:center;
    box-shadow:var(--shadow); border:1px solid var(--line); height:100%; transition:.35s;
}
.stat-card:hover{ transform:translateY(-10px); box-shadow:var(--shadow-lg); }
.stat-icon{
    width:74px; height:74px; border-radius:50%; margin:0 auto 18px;
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-size:28px;
    background:linear-gradient(135deg,var(--gold),var(--gold-deep));
}
.stat-icon.bg-primary,.stat-icon.bg-success,.stat-icon.bg-danger{
    background:linear-gradient(135deg,var(--gold),var(--gold-deep))!important;
}
.stat-card h2{ font-size:2.6rem; font-weight:800; color:var(--ink); }
.stat-card p{ color:#8a7f72; font-size:1.05rem; margin:0; font-family:var(--sans); }

/* ===================== SECTION BG ===================== */
.bg-light{ background:var(--parchment-2)!important; }
.section-pad{ padding:5.5rem 0; }

/* ===================== GENDER SECTION HEADERS ===================== */
.gender-band{
    display:flex; align-items:center; gap:1rem; margin:0 0 2.6rem;
}
.gender-band .line{ flex:1; height:1px; background:var(--line); }
.gender-title{
    font-family:var(--serif); font-weight:800; font-size:clamp(1.6rem,3.5vw,2.3rem);
    display:inline-flex; align-items:center; gap:.7rem; white-space:nowrap;
}
.gender-title .chip{
    font-family:var(--sans); font-size:.75rem; font-weight:700; letter-spacing:.1em;
    text-transform:uppercase; padding:.35rem .8rem; border-radius:30px; color:#fff;
}
.gender-erkak .chip{ background:var(--emerald); }
.gender-ayol  .chip{ background:var(--plum); }
.gender-erkak .gender-title i{ color:var(--emerald); }
.gender-ayol  .gender-title i{ color:var(--plum); }

/* =====================================================
   FRAME CARD — "rams" (ramka) holati + hover animatsiya
   Sukunatda: klassik ramkadagi portret.
   Ustiga borilganda: jonlanadi (rang, zoom, nur, bio ochiladi).
   Olib borilganda: yana ramka holatiga qaytadi.
   ===================================================== */
.frame-card{
    position:relative; height:440px; border-radius:18px; overflow:hidden;
    background:var(--ink); cursor:pointer;
    border:7px solid transparent;
    background-image:
        linear-gradient(var(--ink),var(--ink)),
        linear-gradient(135deg,#e9d69a, #b8892f 45%, #f2e3ad 70%, #a8781f);
    background-origin:border-box;
    background-clip:padding-box, border-box;
    box-shadow:var(--shadow);
    transform-style:preserve-3d; will-change:transform;
    transition:transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .5s;
}
/* sichqoncha harakatlanayotganda egilish silliq va tez bo'lsin */
.frame-card.tilting{ transition:transform .12s ease-out, box-shadow .4s; }

.frame-inner{ position:absolute; inset:0; overflow:hidden; border-radius:8px; }

.frame-card img{
    width:100%; height:100%; object-fit:cover; object-position:center 22%;
    filter:sepia(.12) contrast(1.03) brightness(1.02) saturate(.95);
    transform:scale(1);
    transition:filter .6s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}

/* kursor ortidan yuradigan yorug'lik dog'i (glare) */
.frame-glare{
    position:absolute; inset:0; z-index:5; pointer-events:none; opacity:0;
    mix-blend-mode:soft-light; transition:opacity .4s ease;
    background:radial-gradient(circle at var(--gx,50%) var(--gy,30%),
        rgba(255,255,255,.55), rgba(255,255,255,0) 45%);
}

/* pastdagi nom plastinkasi — rams holati */
.frame-plate{
    position:absolute; left:0; right:0; bottom:0; z-index:3;
    padding:1.1rem 1.2rem;
    background:linear-gradient(to top, rgba(20,17,15,.92) 0%, rgba(20,17,15,.6) 55%, transparent 100%);
    color:#fff; transition:opacity .4s ease, transform .5s cubic-bezier(.2,.7,.2,1);
}
.frame-plate h4{
    color:#fff; font-family:var(--serif); font-weight:700; font-size:1.25rem; margin:0;
    text-shadow:0 2px 8px rgba(0,0,0,.5);
}
.frame-plate .years{
    display:inline-block; margin-top:.35rem; font-family:var(--sans);
    font-size:.82rem; font-weight:700; letter-spacing:.06em;
    color:var(--gold-soft);
}

/* hover paytida ochiladigan bio paneli */
.frame-reveal{
    position:absolute; inset:0; z-index:4;
    display:flex; flex-direction:column; justify-content:flex-end;
    padding:1.6rem 1.4rem;
    background:linear-gradient(to top, rgba(20,17,15,.96) 8%, rgba(20,17,15,.5) 58%, rgba(20,17,15,.05) 100%);
    opacity:0; transition:opacity .45s ease;
    pointer-events:none;
}
/* bolalar bosqichma-bosqich (stagger) chiqadi */
.frame-reveal > *{
    opacity:0; transform:translateY(18px);
    transition:opacity .5s ease, transform .55s cubic-bezier(.2,.8,.2,1);
}
.frame-reveal .r-name{ color:#fff; font-family:var(--serif); font-size:1.4rem; font-weight:700; position:relative; padding-bottom:.5rem; }
.frame-reveal .r-name::after{
    content:""; position:absolute; left:0; bottom:0; height:2px; width:0;
    background:var(--gold); transition:width .55s ease .25s;
}
.frame-reveal .r-years{
    color:var(--gold-soft); font-weight:700; font-size:.85rem; letter-spacing:.05em; margin:.5rem 0 .6rem;
}
.frame-reveal .r-bio{
    color:rgba(255,255,255,.88); font-family:var(--sans); font-size:.9rem; line-height:1.55;
    margin-bottom:1rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.frame-reveal .btn{ align-self:flex-start; padding:.6rem 1.3rem; font-size:.9rem; }

/* nur (shine) — hover paytida diagonal o'tadi */
.frame-shine{
    position:absolute; top:-60%; left:-60%; width:55%; height:220%; z-index:6;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);
    transform:rotate(22deg); pointer-events:none; opacity:0;
}

/* aksent chizig'i (gender ranggi) */
.frame-card::after{
    content:""; position:absolute; top:0; left:0; right:0; height:5px; z-index:7;
    transform:scaleX(0); transform-origin:left; transition:transform .5s ease;
}
.frame-card.is-erkak::after{ background:var(--emerald); }
.frame-card.is-ayol::after{  background:var(--plum); }

/* ---------- HOVER (animatsiya boshlanadi) ---------- */
.frame-card:hover{ transform:translateY(-12px) scale(1.02); box-shadow:var(--shadow-lg), 0 0 0 2px rgba(227,200,119,.55); }
.frame-card:hover img{
    filter:sepia(0) contrast(1.05) brightness(1.02) saturate(1.15);
    transform:scale(1.1);
}
.frame-card:hover .frame-glare{ opacity:1; }
.frame-card:hover .frame-plate{ opacity:0; transform:translateY(14px); }
.frame-card:hover .frame-reveal{ opacity:1; pointer-events:auto; }
.frame-card:hover .frame-reveal > *{ opacity:1; transform:translateY(0); }
.frame-card:hover .frame-reveal .r-years{ transition-delay:.08s; }
.frame-card:hover .frame-reveal .r-bio{ transition-delay:.16s; }
.frame-card:hover .frame-reveal .btn{ transition-delay:.24s; }
.frame-card:hover .frame-reveal .r-name::after{ width:52px; }
.frame-card:hover::after{ transform:scaleX(1); }
.frame-card:hover .frame-shine{ opacity:1; animation:shineSweep 1s ease forwards; }

@keyframes shineSweep{
    from{ left:-60%; }
    to{ left:135%; }
}

@media (prefers-reduced-motion: reduce){
    .frame-card, .frame-card img, .frame-reveal > *{ transition-duration:.2s !important; }
    .frame-card:hover .frame-shine{ animation:none; }
}

/* kartaning kirish animatsiyasi (scroll reveal) */
.reveal-up{ opacity:0; transform:translateY(30px); transition:.7s cubic-bezier(.2,.7,.2,1); }
.reveal-up.in{ opacity:1; transform:translateY(0); }

/* ===================== OLD .jadid-card (index) — modernized ===================== */
.jadid-card{
    background:var(--card); border-radius:var(--r); overflow:hidden;
    box-shadow:var(--shadow); border:1px solid var(--line); height:100%; transition:.4s;
}
.jadid-card:hover{ transform:translateY(-12px); box-shadow:var(--shadow-lg); }
.jadid-card img{ width:100%; height:300px; object-fit:cover; transition:.5s; filter:saturate(.9); }
.jadid-card:hover img{ transform:scale(1.06); filter:saturate(1.1); }
.jadid-body{ padding:24px; }
.jadid-body h4{ font-weight:700; margin-bottom:.4rem; }
.jadid-body .text-primary{ color:var(--gold-deep)!important; font-family:var(--sans); }
.jadid-body p{ color:#6f665b; font-family:var(--sans); font-size:.95rem; }

/* ===================== DETAIL PAGE ===================== */
.detail-image{
    height:600px; width:100%; object-fit:cover; border-radius:24px;
    border:8px solid transparent;
    background-image:linear-gradient(var(--card),var(--card)),
        linear-gradient(135deg,#e9d69a,#b8892f 50%,#f2e3ad);
    background-origin:border-box; background-clip:content-box,border-box;
    box-shadow:var(--shadow); transition:.4s;
}
.detail-image:hover{ transform:scale(1.02); }
.bio-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--r);
    padding:26px; box-shadow:var(--shadow);
}
.bio-card h5{ font-family:var(--serif); font-weight:700; }
.biography{ text-align:justify; line-height:1.9; font-size:1.02rem; color:var(--ink-soft); font-family:var(--sans); }
.work-card{
    background:var(--card); border:1px solid var(--line); border-radius:var(--r);
    overflow:hidden; transition:.35s; box-shadow:var(--shadow);
}
.work-card:hover{ transform:translateY(-10px); box-shadow:var(--shadow-lg); }
.work-card .card-body{ padding:28px; }
.work-card h4{ font-weight:700; margin-bottom:1rem; }
.work-card p{ color:#6f665b; min-height:80px; font-family:var(--sans); }
.download-btn{ border-radius:40px; padding:13px; font-weight:600; }
.badge.bg-primary{ background:var(--ink)!important; }
.badge.bg-success{ background:var(--emerald)!important; }
.badge.bg-danger{ background:var(--plum)!important; }

/* generic bootstrap card (jadids fallback / works) */
.card{ border:none; border-radius:var(--r); overflow:hidden; transition:.35s;
    box-shadow:var(--shadow); background:var(--card); }
.card:hover{ transform:translateY(-8px); box-shadow:var(--shadow-lg); }

/* ===================== FORMS ===================== */
.form-control,.form-select{ border-radius:12px; padding:11px 14px; border:1px solid var(--line); }
.form-control:focus,.form-select:focus{ box-shadow:0 0 0 3px rgba(195,154,62,.18); border-color:var(--gold); }

/* ===================== FOOTER ===================== */
footer{ margin-top:0; background:var(--ink)!important; }
footer h4,footer h5{ color:#fff; }
footer .fw-bold{ font-family:var(--serif); }
footer a{ transition:.3s; }
footer a:hover{ color:var(--gold-soft)!important; }
.bg-black{ background:#0f0c0a!important; }

/* ===================== EMPTY STATE ===================== */
.empty-note{
    text-align:center; padding:3rem 1rem; border:1px dashed var(--line);
    border-radius:var(--r); background:var(--card); color:#8a7f72; font-family:var(--sans);
}

/* ===================== RESPONSIVE ===================== */
@media(max-width:992px){
    .hero{ text-align:center; }
    .hero-icon{ margin-top:2rem; }
}
@media(max-width:768px){
    .frame-card{ height:400px; }
    .statistics{ margin-top:-50px; }
    .section-pad{ padding:3.5rem 0; }
}

/* =====================================================
   DARK MODE  (html[data-theme="dark"])
   ===================================================== */
:root[data-theme="dark"]{
    --parchment:  #131017;
    --parchment-2:#1a1622;
    --card:       #201b29;
    --ink:        #f0e9dc;   /* endi asosiy MATN ochiq rangda */
    --ink-soft:   #c9c0d0;
    --line:       rgba(255,255,255,.10);
    --shadow:     0 18px 45px rgba(0,0,0,.5);
    --shadow-lg:  0 30px 70px rgba(0,0,0,.65);
}
:root[data-theme="dark"] body{
    background:
        radial-gradient(1200px 600px at 100% -10%, rgba(195,154,62,.14), transparent 60%),
        var(--parchment);
}
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] h5{ color:var(--ink); }
:root[data-theme="dark"] .btn-primary{ background:var(--gold-deep); color:#fff; }
:root[data-theme="dark"] .btn-primary:hover{ background:var(--gold); color:#1a1512; }
:root[data-theme="dark"] .badge.bg-primary{ background:var(--gold-deep)!important; }
:root[data-theme="dark"] .jadid-body p,
:root[data-theme="dark"] .work-card p,
:root[data-theme="dark"] .stat-card p,
:root[data-theme="dark"] .empty-note{ color:#a99fb0; }
:root[data-theme="dark"] .biography{ color:var(--ink-soft); }
:root[data-theme="dark"] .card{ background:var(--card); }
:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .form-select{
    background:var(--card); color:var(--ink); border-color:var(--line);
}
:root[data-theme="dark"] .form-control::placeholder{ color:#8a8194; }
:root[data-theme="dark"] .table{ --bs-table-bg:var(--card); color:var(--ink); }

/* Tungi/kunduzgi almashtirish tugmasi */
.theme-toggle{
    background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18);
    color:#fff; width:40px; height:40px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
    transition:.25s; font-size:1rem;
}
.theme-toggle:hover{ background:var(--gold); color:#1a1512; border-color:var(--gold); transform:translateY(-2px); }

/* =====================================================
   ASARLAR (works) — zamonaviy kartalar
   ===================================================== */
.work-tile{
    background:var(--card); border:1px solid var(--line); border-radius:var(--r);
    box-shadow:var(--shadow); overflow:hidden; height:100%;
    display:flex; flex-direction:column; transition:.35s; position:relative;
}
.work-tile::before{
    content:""; position:absolute; top:0; left:0; right:0; height:4px;
    background:linear-gradient(90deg,var(--gold),var(--gold-deep));
    transform:scaleX(0); transform-origin:left; transition:.45s;
}
.work-tile:hover{ transform:translateY(-10px); box-shadow:var(--shadow-lg); }
.work-tile:hover::before{ transform:scaleX(1); }
.work-tile .wt-body{ padding:26px; flex:1; display:flex; flex-direction:column; }
.work-tile .wt-icon{
    width:54px; height:54px; border-radius:14px; display:flex; align-items:center;
    justify-content:center; font-size:22px; color:#fff; margin-bottom:16px;
    background:linear-gradient(135deg,var(--gold),var(--gold-deep));
}
.work-tile h4{ font-family:var(--serif); font-weight:700; font-size:1.25rem; margin-bottom:.4rem; }
.work-tile .wt-author{
    display:inline-flex; align-items:center; gap:.4rem; font-family:var(--sans);
    font-size:.85rem; font-weight:700; color:var(--gold-deep); margin-bottom:.8rem;
}
.work-tile .wt-desc{ color:#7a7183; font-family:var(--sans); font-size:.95rem; flex:1; }
:root[data-theme="dark"] .work-tile .wt-desc{ color:#a99fb0; }
.work-tile .wt-foot{ padding:0 26px 26px; }

/* =====================================================
   AI YORDAMCHI (chat) — savol-javob
   ===================================================== */
.ai-box{
    background:var(--card); border:1px solid var(--line); border-radius:var(--r);
    box-shadow:var(--shadow); overflow:hidden; margin-top:1.4rem;
}
.ai-head{
    display:flex; align-items:center; gap:.7rem; padding:16px 20px;
    background:linear-gradient(135deg,var(--ink),#2a2038); color:#fff;
}
.ai-head .ai-ava{
    width:38px; height:38px; border-radius:50%; display:flex; align-items:center;
    justify-content:center; background:linear-gradient(135deg,var(--gold-soft),var(--gold));
    color:#1a1512; font-size:1.1rem;
}
.ai-head h5{ color:#fff; margin:0; font-size:1.05rem; font-family:var(--serif); }
.ai-head small{ color:rgba(255,255,255,.6); font-family:var(--sans); }
.ai-log{
    padding:20px; max-height:360px; overflow-y:auto; display:flex; flex-direction:column; gap:12px;
    font-family:var(--sans);
}
.ai-msg{ max-width:85%; padding:12px 16px; border-radius:16px; line-height:1.6; font-size:.95rem; }
.ai-msg.user{ align-self:flex-end; background:var(--gold); color:#1a1512; border-bottom-right-radius:5px; }
.ai-msg.bot{ align-self:flex-start; background:var(--parchment-2); color:var(--ink); border-bottom-left-radius:5px; }
.ai-msg.bot.err{ background:rgba(122,47,67,.14); color:#b64b63; }
.ai-suggest{ display:flex; flex-wrap:wrap; gap:8px; padding:0 20px 12px; }
.ai-chip{
    background:transparent; border:1px solid var(--line); color:var(--ink);
    border-radius:30px; padding:7px 14px; font-size:.82rem; cursor:pointer;
    font-family:var(--sans); transition:.2s;
}
.ai-chip:hover{ background:var(--gold); color:#1a1512; border-color:var(--gold); }
.ai-input{ display:flex; gap:10px; padding:14px 20px; border-top:1px solid var(--line); }
.ai-input input{
    flex:1; border:1px solid var(--line); border-radius:30px; padding:11px 16px;
    background:var(--parchment); color:var(--ink); font-family:var(--sans); outline:none;
}
.ai-input input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(195,154,62,.18); }
.ai-send{
    background:var(--gold); border:none; color:#1a1512; width:46px; height:46px;
    border-radius:50%; cursor:pointer; font-size:1rem; transition:.2s; flex-shrink:0;
}
.ai-send:hover{ background:var(--gold-deep); color:#fff; }
.ai-send:disabled{ opacity:.5; cursor:not-allowed; }
.ai-typing{ display:inline-flex; gap:4px; align-items:center; }
.ai-typing span{ width:7px; height:7px; border-radius:50%; background:var(--gold-deep); animation:aiBlink 1.2s infinite; }
.ai-typing span:nth-child(2){ animation-delay:.2s; } .ai-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes aiBlink{ 0%,80%,100%{opacity:.25;transform:translateY(0)} 40%{opacity:1;transform:translateY(-3px)} }

/* =====================================================
   AUTH (kirish / ro'yxatdan o'tish) — toza, alohida sahifa
   ===================================================== */
.auth-wrap{
    min-height:100vh; display:flex; align-items:center; justify-content:center;
    padding:2rem 1rem; position:relative; overflow:hidden;
    background:
        radial-gradient(800px 500px at 15% 10%, rgba(195,154,62,.18), transparent 60%),
        linear-gradient(135deg,#14110f 0%, #241d16 55%, #14110f 100%);
}
.auth-wrap::before{
    content:""; position:absolute; inset:0;
    background-image:radial-gradient(rgba(227,200,119,.10) 1px, transparent 1px);
    background-size:22px 22px; opacity:.5;
}
.auth-card{
    position:relative; z-index:2; width:100%; max-width:430px;
    background:var(--card); border-radius:22px; padding:2.6rem 2.4rem;
    box-shadow:0 30px 80px rgba(0,0,0,.45); border:1px solid var(--line);
}
.auth-brand{
    display:flex; align-items:center; justify-content:center; gap:.5rem;
    font-family:var(--serif); font-weight:800; font-size:1.35rem; color:var(--gold-deep);
    margin-bottom:.4rem;
}
.auth-card h2{ text-align:center; font-family:var(--serif); font-weight:800; font-size:1.7rem; margin-bottom:.3rem; }
.auth-sub{ text-align:center; color:#8a7f72; font-family:var(--sans); font-size:.95rem; margin-bottom:1.8rem; }
:root[data-theme="dark"] .auth-sub{ color:#a99fb0; }
.auth-card label{ font-family:var(--sans); font-weight:600; font-size:.9rem; margin-bottom:.35rem; display:block; }
.auth-field{ position:relative; margin-bottom:1.1rem; }
.auth-field .fa{ position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--gold-deep); }
.auth-field input{
    width:100%; padding:12px 14px 12px 42px; border-radius:12px;
    border:1px solid var(--line); background:var(--parchment); color:var(--ink);
    font-family:var(--sans); outline:none; transition:.2s;
}
.auth-field input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(195,154,62,.18); }
.auth-btn{
    width:100%; padding:13px; border:none; border-radius:40px; cursor:pointer;
    background:linear-gradient(135deg,var(--gold-soft),var(--gold)); color:#1a1512;
    font-family:var(--sans); font-weight:800; font-size:1rem; transition:.25s;
    box-shadow:0 10px 24px rgba(195,154,62,.3);
}
.auth-btn:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(195,154,62,.42); }
.auth-alt{ text-align:center; margin-top:1.6rem; font-family:var(--sans); font-size:.95rem; color:#8a7f72; }
:root[data-theme="dark"] .auth-alt{ color:#a99fb0; }
.auth-alt a{ color:var(--gold-deep); font-weight:700; }
.auth-alt a:hover{ text-decoration:underline; }
.auth-divider{ height:1px; background:var(--line); margin:1.6rem 0; }
.auth-back{
    position:absolute; top:1.4rem; left:1.6rem; z-index:3; color:rgba(255,255,255,.7);
    font-family:var(--sans); font-size:.9rem; font-weight:600; display:inline-flex; align-items:center; gap:.4rem;
}
.auth-back:hover{ color:var(--gold-soft); }
.auth-msg{
    padding:12px 14px; border-radius:12px; font-family:var(--sans); font-size:.92rem;
    margin-bottom:1.2rem; text-align:center;
}
.auth-msg.err{ background:rgba(122,47,67,.14); color:#b64b63; border:1px solid rgba(122,47,67,.3); }
.auth-msg.ok{ background:rgba(31,92,77,.14); color:#2e8b6f; border:1px solid rgba(31,92,77,.3); }
.auth-hint{ font-size:.78rem; color:#a79c8d; margin-top:-.7rem; margin-bottom:1rem; font-family:var(--sans); }

/* =====================================================
   MEDIA (audio / video / linklar) — jadid sahifasi
   ===================================================== */
.media-box{
    background:var(--card); border:1px solid var(--line); border-radius:var(--r);
    box-shadow:var(--shadow); padding:26px; margin-top:1.4rem;
}
.media-box h5{ font-family:var(--serif); font-weight:700; margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; }
.media-box h5 i{ color:var(--gold-deep); }
.media-audio{ width:100%; margin-bottom:1rem; }
.media-video{ position:relative; padding-top:56.25%; border-radius:14px; overflow:hidden; margin-bottom:1rem; background:#000; }
.media-video iframe, .media-video video{ position:absolute; inset:0; width:100%; height:100%; border:none; }
.media-links{ display:flex; flex-direction:column; gap:.5rem; }
.media-link{
    display:flex; align-items:center; gap:.6rem; padding:12px 16px; border-radius:12px;
    background:var(--parchment-2); color:var(--ink); font-family:var(--sans); font-weight:600;
    transition:.2s; text-decoration:none; border:1px solid var(--line);
}
.media-link:hover{ background:var(--gold); color:#1a1512; border-color:var(--gold); transform:translateX(4px); }
.media-link i.tag{ color:var(--gold-deep); }
.media-link:hover i.tag{ color:#1a1512; }

/* Login talab qilinadigan yuklab olish tugmasi */
.locked-btn{
    display:flex; align-items:center; justify-content:center; gap:.5rem;
    width:100%; padding:13px; border-radius:40px; font-weight:700; font-family:var(--sans);
    background:transparent; border:1px dashed var(--gold-deep); color:var(--gold-deep);
    text-decoration:none; transition:.2s;
}
.locked-btn:hover{ background:var(--gold); color:#1a1512; border-style:solid; }

/* =====================================================
   QIDIRUV — jonli natijalar
   ===================================================== */
.search-hero{
    background:
        radial-gradient(700px 400px at 80% 10%, rgba(195,154,62,.16), transparent 60%),
        linear-gradient(135deg,#14110f, #241d16);
    padding:4.5rem 0 3rem; color:#fff; text-align:center;
}
.search-bar{ max-width:620px; margin:1.8rem auto 0; position:relative; }
.search-bar input{
    width:100%; padding:16px 54px 16px 22px; border-radius:44px; border:1px solid rgba(255,255,255,.2);
    background:rgba(255,255,255,.1); color:#fff; font-family:var(--sans); font-size:1.05rem; outline:none;
    backdrop-filter:blur(6px);
}
.search-bar input::placeholder{ color:rgba(255,255,255,.55); }
.search-bar input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(195,154,62,.25); }
.search-bar .s-ico{ position:absolute; right:22px; top:50%; transform:translateY(-50%); color:var(--gold-soft); font-size:1.1rem; }
.search-tabs{ display:flex; gap:.6rem; justify-content:center; margin:1.4rem 0 2.4rem; flex-wrap:wrap; }
.search-tab{
    background:var(--card); border:1px solid var(--line); border-radius:30px; padding:8px 18px;
    font-family:var(--sans); font-weight:700; font-size:.9rem; color:var(--ink); cursor:pointer; transition:.2s;
}
.search-tab.active{ background:var(--ink); color:#fff; border-color:var(--ink); }
:root[data-theme="dark"] .search-tab.active{ background:var(--gold-deep); border-color:var(--gold-deep); }
.search-count{ text-align:center; color:#8a7f72; font-family:var(--sans); margin-bottom:1.5rem; }
:root[data-theme="dark"] .search-count{ color:#a99fb0; }
.search-loading{ text-align:center; padding:2rem; color:var(--gold-deep); font-family:var(--sans); }
mark.hl{ background:rgba(195,154,62,.35); color:inherit; padding:0 2px; border-radius:3px; }