/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* [AETHRION v1.0.0] ROOT DEĞİŞKENLERİ — GENİŞLETİLMİŞ         */
/* ============================================================ */
:root {
    /* --- ANA ARKA PLAN (Obsidian Deep + Quantum) --- */
    --bg: #030306;
    --bg2: #06060b;
    --bg3: #0a0a12;
    --surface: #101018;
    --surface2: #16161f;
    --surface3: #1e1e2a;
    --surface4: #282838;
    --border: #232333;
    --border2: #34344a;
    --border3: #4a4a66;

    /* --- AETHRION LUXURY RENK PALETİ --- */
    --accent: #e8c555;
    --accent-hover: #f5d878;
    --accent-glow: rgba(232, 197, 85, 0.6);

    --accent2: #c5cde0;
    --accent2-glow: rgba(197, 205, 224, 0.5);

    --accent3: #8b6bff;
    --accent3-glow: rgba(139, 107, 255, 0.55);

    --accent4: #6ee0ff;
    --accent4-glow: rgba(110, 224, 255, 0.55);

    --gold: #e8c555;
    --gold-soft: #f5d878;
    --gold-glow: rgba(232, 197, 85, 0.6);
    --purple: #8b6bff;
    --purple-hover: #a890ff;
    --purple-glow: rgba(139, 107, 255, 0.55);
    --platinum: #c5cde0;
    --platinum-glow: rgba(197, 205, 224, 0.5);
    --ice: #6ee0ff;
    --ice-glow: rgba(110, 224, 255, 0.55);
    --ember: #ff8a5c;
    --ember-glow: rgba(255, 138, 92, 0.55);
    --ruby: #ff4d5e;
    --ruby-glow: rgba(255, 77, 94, 0.55);
    --deep-blue: #0d2a7a;
    --quantum: #8b6bff;
    --quantum-glow: rgba(139, 107, 255, 0.55);
    --nvidia: #76b900;
    --nvidia-glow: rgba(118, 185, 0, 0.55);

    /* --- AURORA RENKLERİ (AETHRION) --- */
    --aurora-1: #e8c555;
    --aurora-2: #8b6bff;
    --aurora-3: #6ee0ff;
    --aurora-4: #c5cde0;
    --aurora-5: #f5d878;
    --aurora-6: #76b900;

    /* --- METİN --- */
    --text: #ffffff;
    --text2: #dbdbe8;
    --text3: #8a8aa8;
    --text4: #56566e;
    --text5: #38384a;

    /* --- DURUMLAR --- */
    --danger: #ff4d5e;
    --danger-hover: #ff7a88;
    --danger-glow: rgba(255, 77, 94, 0.55);
    --success: #2ecc71;
    --warning: #ffb347;
    --info: #6ee0ff;
    --moderator: #e8c555;
    --nvidia-color: #76b900;

    /* --- FONTLAR --- */
    --font-display: 'Syne', 'Inter', sans-serif;
    --font-code: 'Fira Code', 'Consolas', monospace;
    --font-body: 'Inter', 'Segoe UI', sans-serif;
    --font-quantum: 'Orbitron', 'Syne', sans-serif;

    /* --- GÖLGELER (Deep Luxury) --- */
    --shadow-xs: 0 1px 4px rgba(0, 0, 0, 0.5);
    --shadow-sm: 0 2px 14px rgba(0, 0, 0, 0.6);
    --shadow-md: 0 8px 32px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 16px 70px rgba(0, 0, 0, 0.85);
    --shadow-xl: 0 28px 120px rgba(0, 0, 0, 0.95);
    --shadow-glow: 0 0 40px rgba(232, 197, 85, 0.5);
    --shadow-glow-strong: 0 0 80px rgba(232, 197, 85, 0.8);
    --shadow-glow-purple: 0 0 50px rgba(139, 107, 255, 0.55);
    --shadow-glow-platinum: 0 0 50px rgba(197, 205, 224, 0.5);
    --shadow-glow-gold: 0 0 50px rgba(232, 197, 85, 0.65);
    --shadow-glow-ice: 0 0 50px rgba(110, 224, 255, 0.55);
    --shadow-glow-nvidia: 0 0 50px rgba(118, 185, 0, 0.55);
    --shadow-glow-quantum: 0 0 55px rgba(139, 107, 255, 0.6);
    --shadow-inner: inset 0 1px 0 rgba(255, 255, 255, 0.07);

    /* --- GEÇİŞLER --- */
    --transition-fast: 0.16s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.48s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: 0.58s cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-elastic: 0.72s cubic-bezier(0.68, -0.55, 0.265, 1.55);

    /* --- ALIAS'LAR --- */
    --bg-body: var(--bg);
    --text-body: var(--text);
    --surface-body: var(--surface);

    /* --- BORDER RADIUS --- */
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --radius-xl: 32px;
    --radius-pill: 999px;
}

/* ============================================================ */
/* [AETHRION] LIGHT TEMA (Luxury açık palet)                    */
/* ============================================================ */
[data-theme="light"] {
    --bg: #f8f5ee;
    --bg2: #efebe1;
    --bg3: #e6e0d2;
    --surface: #ffffff;
    --surface2: #fcfaf4;
    --surface3: #f2ede0;
    --surface4: #e6e0d0;
    --border: #d6cfbc;
    --border2: #bab2a0;
    --border3: #9e9686;
    --text: #0a0a14;
    --text2: #24243a;
    --text3: #56566e;
    --text4: #78788e;
    --text5: #9898ac;
    --bg-body: var(--bg);
    --text-body: var(--text);
    --surface-body: var(--surface);
    --shadow-glow: 0 0 35px rgba(232, 197, 85, 0.4);
    --shadow-glow-strong: 0 0 70px rgba(232, 197, 85, 0.6);
    --shadow-inner: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

/* ============================================================ */
/* RESET + BODY                                                 */
/* ============================================================ */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    width: 100%;
    max-width: 100vw;
}

body {
    background: var(--bg-body);
    color: var(--text-body);
    font-family: var(--font-body);
    overflow-x: hidden;
    min-height: 100vh;
    width: 100%;
    max-width: 100vw;
    transition: background 0.4s, color 0.4s;
    position: relative;
    line-height: 1.6;
    letter-spacing: 0.01em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Custom Scrollbar Global */
::-webkit-scrollbar {
    width: 11px;
    height: 11px;
}

::-webkit-scrollbar-track {
    background: var(--bg2);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(232, 197, 85, 0.55), rgba(139, 107, 255, 0.55));
    border-radius: 10px;
    border: 2px solid var(--bg2);
    transition: background 0.2s;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--accent), var(--purple));
    box-shadow: 0 0 18px var(--accent-glow);
}

::selection {
    background: var(--accent);
    color: #030306;
    text-shadow: none;
}

/* ============================================================ */
/* [AETHRION] ÇOK KATMANLI AURORA + NEBULA + STARFIELD          */
/* 5 katmanlı, GPU hızlandırmalı, mobilde otomatik hafifletme   */
/* ============================================================ */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 100% 65% at 10% -10%, rgba(232, 197, 85, 0.18) 0%, transparent 55%),
        radial-gradient(ellipse 80% 55% at 90% 5%, rgba(139, 107, 255, 0.16) 0%, transparent 55%),
        radial-gradient(ellipse 95% 60% at 50% 105%, rgba(110, 224, 255, 0.12) 0%, transparent 60%),
        radial-gradient(ellipse 75% 50% at 0% 55%, rgba(197, 205, 224, 0.1) 0%, transparent 60%),
        radial-gradient(ellipse 70% 45% at 100% 75%, rgba(232, 197, 85, 0.1) 0%, transparent 60%),
        radial-gradient(ellipse 60% 40% at 50% 50%, rgba(139, 107, 255, 0.06) 0%, transparent 70%);
    animation: auroraShift 32s ease-in-out infinite alternate;
    will-change: opacity, transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

[data-theme="light"] body::before {
    background:
        radial-gradient(ellipse 100% 65% at 10% -10%, rgba(232, 197, 85, 0.14) 0%, transparent 55%),
        radial-gradient(ellipse 80% 55% at 90% 5%, rgba(139, 107, 255, 0.1) 0%, transparent 55%),
        radial-gradient(ellipse 95% 60% at 50% 105%, rgba(110, 224, 255, 0.08) 0%, transparent 60%);
}

@keyframes auroraShift {
    0%   { opacity: 0.82; transform: scale(1) rotate(0deg); }
    33%  { opacity: 0.95; transform: scale(1.05) rotate(1.8deg); }
    66%  { opacity: 1;    transform: scale(1.08) rotate(-1.8deg); }
    100% { opacity: 0.88; transform: scale(1) rotate(0deg); }
}

/* Grid + Star field overlay */
body::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(232, 197, 85, 0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232, 197, 85, 0.03) 1px, transparent 1px),
        radial-gradient(1px 1px at 15% 25%, rgba(255, 255, 255, 0.55), transparent),
        radial-gradient(1px 1px at 55% 65%, rgba(232, 197, 85, 0.6), transparent),
        radial-gradient(1.5px 1.5px at 75% 15%, rgba(139, 107, 255, 0.55), transparent),
        radial-gradient(1px 1px at 35% 85%, rgba(110, 224, 255, 0.5), transparent),
        radial-gradient(1px 1px at 85% 55%, rgba(245, 216, 120, 0.55), transparent),
        radial-gradient(1.2px 1.2px at 25% 45%, rgba(255, 255, 255, 0.45), transparent),
        radial-gradient(1px 1px at 65% 90%, rgba(139, 107, 255, 0.5), transparent);
    background-size: 70px 70px, 70px 70px, 240px 240px, 320px 320px, 300px 300px, 260px 260px, 340px 340px, 280px 280px, 360px 360px;
    mask-image: radial-gradient(ellipse 95% 85% at 50% 40%, black 30%, transparent 88%);
    -webkit-mask-image: radial-gradient(ellipse 95% 85% at 50% 40%, black 30%, transparent 88%);
    opacity: 0.75;
    animation: gridPulse 16s ease-in-out infinite, starTwinkle 10s ease-in-out infinite;
}

[data-theme="light"] body::after {
    background-image:
        linear-gradient(rgba(0, 90, 160, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 90, 160, 0.05) 1px, transparent 1px);
}

@keyframes gridPulse {
    0%, 100% { opacity: 0.5; }
    50%      { opacity: 0.85; }
}

@keyframes starTwinkle {
    0%, 100% { background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0; }
    50%      { background-position: 0 0, 0 0, 25px 35px, 45px -25px, -35px 45px, 30px -30px, -45px 25px, 15px 20px, -20px -15px; }
}

/* Dashboard açıkken AI widget gizle */
body.dashboard-open .ai-widget {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================================ */
/* [AETHRION] MULTI-RING QUANTUM CURSOR (4 katman)              */
/* ============================================================ */
.custom-cursor {
    width: 18px;
    height: 18px;
    background: radial-gradient(circle, #ffffff 0%, var(--accent) 40%, transparent 100%);
    border-radius: 50%;
    position: fixed;
    pointer-events: none;
    z-index: 999999;
    box-shadow:
        0 0 20px var(--accent),
        0 0 40px var(--accent),
        0 0 80px var(--accent-glow),
        0 0 130px rgba(139, 107, 255, 0.5);
    transition: width 0.2s ease, height 0.2s ease, background 0.2s;
    will-change: transform, left, top;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    mix-blend-mode: screen;
}

.custom-cursor.hover {
    width: 44px;
    height: 44px;
    background: radial-gradient(circle, rgba(232, 197, 85, 0.45) 0%, transparent 70%);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    box-shadow:
        0 0 30px var(--accent),
        0 0 70px var(--accent),
        0 0 130px var(--accent-glow),
        0 0 200px rgba(139, 107, 255, 0.6);
}

.custom-cursor-ring {
    width: 54px;
    height: 54px;
    border: 2px solid var(--accent);
    border-radius: 50%;
    position: fixed;
    pointer-events: none;
    z-index: 999998;
    opacity: 0.75;
    will-change: transform, left, top;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow:
        0 0 22px rgba(232, 197, 85, 0.55),
        0 0 50px rgba(139, 107, 255, 0.35),
        inset 0 0 22px rgba(232, 197, 85, 0.2);
    transition: opacity 0.3s, transform 0.1s;
}

.custom-cursor-ring::before {
    content: '';
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    border: 1.5px dashed rgba(139, 107, 255, 0.55);
    animation: cursorRingSpin 8s linear infinite;
}

.custom-cursor-ring::after {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 1.5px solid rgba(197, 205, 224, 0.45);
    animation: cursorRingSpin 13s linear infinite reverse;
    box-shadow: 0 0 18px rgba(197, 205, 224, 0.3);
}

@keyframes cursorRingSpin {
    to { transform: rotate(360deg); }
}

/* ============================================================ */
/* [AETHRION] 6 KATMANLI PARÇACIK SİSTEMİ                       */
/* Katman 1: Star dust (yavaş, minik, çok sayıda)               */
/* Katman 2: Energy orbs (orta boy, pulse)                      */
/* Katman 3: Light trails (hızlı diyagonal)                     */
/* Katman 4: Quantum sparks (rasgele pulse)                     */
/* Katman 5: Ribbon light (yumuşak gradient şeritler)           */
/* Katman 6: Glitch particles (kısa süreli parlamalar)         */
/* ============================================================ */
.particles {
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
    contain: strict;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

/* Katman 1: Star dust */
.particle {
    position: absolute;
    width: 2.5px;
    height: 2.5px;
    background: var(--accent);
    border-radius: 50%;
    animation: float-up linear infinite;
    opacity: 0;
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 10px var(--accent);
}

.particle:nth-child(2n) {
    background: var(--accent2);
    width: 3.5px;
    height: 3.5px;
    box-shadow: 0 0 12px var(--accent2);
}

.particle:nth-child(3n) {
    background: var(--purple);
    width: 3px;
    height: 3px;
    box-shadow: 0 0 12px var(--purple);
}

.particle:nth-child(5n) {
    background: var(--ice);
    box-shadow: 0 0 14px var(--ice);
}

.particle:nth-child(7n) {
    background: var(--gold);
    box-shadow: 0 0 14px var(--gold);
}

.particle:nth-child(11n) {
    background: var(--quantum);
    box-shadow: 0 0 16px var(--quantum);
}

@keyframes float-up {
    0%   { transform: translateY(100vh) translateX(0); opacity: 0; }
    10%  { opacity: 0.95; }
    50%  { opacity: 0.75; }
    90%  { opacity: 0.4; }
    100% { transform: translateY(-150px) translateX(45px); opacity: 0; }
}

/* Katman 2: Energy orbs (mevcut ::before/::after genişletildi) */
.particles::before,
.particles::after {
    content: '';
    position: absolute;
    width: 520px;
    height: 520px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(232, 197, 85, 0.16) 0%, transparent 70%);
    filter: blur(60px);
    pointer-events: none;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.particles::before {
    top: 10%;
    left: -200px;
    animation: orbFloat1 34s ease-in-out infinite;
}

.particles::after {
    bottom: 6%;
    right: -200px;
    background: radial-gradient(circle, rgba(139, 107, 255, 0.16) 0%, transparent 70%);
    animation: orbFloat2 38s ease-in-out infinite;
}

@keyframes orbFloat1 {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(100px, -80px) scale(1.2); }
    66%      { transform: translate(-60px, 60px) scale(0.86); }
}

@keyframes orbFloat2 {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50%      { transform: translate(-120px, -100px) scale(1.24); }
}

/* Katman 3: Light trails */
.particles .light-line {
    position: absolute;
    width: 1.8px;
    height: 140px;
    background: linear-gradient(180deg, transparent, var(--accent), transparent);
    animation: lineDrop linear infinite;
    opacity: 0;
    will-change: transform, opacity;
    box-shadow: 0 0 12px var(--accent);
}

@keyframes lineDrop {
    0%   { transform: translateY(-140px) rotate(15deg); opacity: 0; }
    20%  { opacity: 0.9; }
    100% { transform: translateY(110vh) rotate(15deg); opacity: 0; }
}

/* Katman 4: Quantum sparks */
.particles .quantum-spark {
    position: absolute;
    width: 5px;
    height: 5px;
    background: var(--quantum);
    border-radius: 50%;
    box-shadow: 0 0 18px var(--quantum), 0 0 35px var(--quantum-glow);
    animation: quantumPulse 3.2s ease-in-out infinite;
    opacity: 0.75;
}

@keyframes quantumPulse {
    0%, 100% { transform: scale(0.75); opacity: 0.4; }
    50%      { transform: scale(1.5);  opacity: 1; }
}

/* Katman 5: Ribbon light (gradient şeritler) */
.particles .ribbon-light {
    position: absolute;
    width: 220px;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--ice), var(--purple), var(--accent), transparent);
    border-radius: 4px;
    animation: ribbonFlow linear infinite;
    opacity: 0;
    will-change: transform, opacity;
    box-shadow: 0 0 18px var(--ice), 0 0 35px var(--purple-glow);
}

@keyframes ribbonFlow {
    0%   { transform: translateX(-100%) translateY(0) rotate(-8deg); opacity: 0; }
    15%  { opacity: 0.85; }
    85%  { opacity: 0.7; }
    100% { transform: translateX(110vw) translateY(-40px) rotate(-8deg); opacity: 0; }
}

/* Katman 6: Glitch particles */
.particles .glitch-particle {
    position: absolute;
    width: 6px;
    height: 6px;
    background: var(--ice);
    border-radius: 2px;
    box-shadow: 0 0 20px var(--ice), 0 0 40px var(--ice-glow);
    animation: glitchFlash 4s ease-in-out infinite;
    opacity: 0;
}

@keyframes glitchFlash {
    0%, 90%, 100% { opacity: 0; transform: scale(0.3); }
    92%           { opacity: 1; transform: scale(1.4); }
    95%           { opacity: 0.6; transform: scale(0.9); }
}

/* ============================================================ */
/* [AETHRION] İLERLEME ÇUBUĞU (Legendary Aurora)                */
/* ============================================================ */
.progress-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(
        90deg,
        var(--accent) 0%,
        var(--gold-soft) 15%,
        var(--ice) 30%,
        var(--purple) 45%,
        var(--platinum) 60%,
        var(--gold) 75%,
        var(--nvidia) 90%,
        var(--accent) 100%
    );
    background-size: 300% 100%;
    z-index: 200;
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 0.1s ease-out;
    will-change: transform, background-position;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    animation: progressShimmer 4.5s linear infinite;
    box-shadow: 0 0 22px var(--accent), 0 0 45px var(--purple);
}

@keyframes progressShimmer {
    0%   { background-position: 0% 50%; }
    100% { background-position: 300% 50%; }
}

/* ============================================================ */
/* [AETHRION] BİLDİRİM (Legendary)                              */
/* ============================================================ */
.notification {
    position: fixed;
    bottom: 34px;
    left: 34px;
    padding: 18px 26px;
    background: linear-gradient(135deg, rgba(22, 22, 32, 0.98), rgba(38, 38, 52, 0.96));
    border: 1px solid var(--border2);
    border-left: 5px solid var(--accent2);
    border-radius: var(--radius-lg);
    z-index: 999999;
    transform: translate3d(0, 140px, 0);
    opacity: 0;
    transition: opacity 0.42s ease, transform 0.42s ease;
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    max-width: 440px;
    font-size: 14px;
    color: var(--text2);
    box-shadow:
        var(--shadow-xl),
        0 0 40px rgba(197, 205, 224, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.07);
    font-family: var(--font-body);
    will-change: opacity, transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    letter-spacing: 0.2px;
    line-height: 1.6;
}

.notification.show {
    transform: translate3d(0, 0, 0);
    opacity: 1;
}

.notification.error {
    border-left-color: var(--danger);
    box-shadow: var(--shadow-xl), 0 0 40px rgba(255, 77, 94, 0.4);
}

.notification.warning {
    border-left-color: var(--warning);
    box-shadow: var(--shadow-xl), 0 0 40px rgba(255, 179, 71, 0.4);
}

/* ============================================================ */
/* SORGU LİMİTİ ROZETİ                                          */
/* ============================================================ */
.query-limit-badge {
    position: fixed;
    bottom: 110px;
    left: 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.22), rgba(139, 107, 255, 0.14));
    border: 1.5px solid var(--accent);
    border-radius: var(--radius-pill);
    padding: 10px 24px;
    font-size: 12px;
    font-family: var(--font-body);
    font-weight: 700;
    z-index: 100;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    letter-spacing: 0.5px;
    color: var(--accent);
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

/* ============================================================ */
/* [AETHRION] NAVBAR (Holographic Glass + Luxury Gold)          */
/* ============================================================ */
nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 52px;
    height: 92px;
    border-bottom: 1px solid rgba(232, 197, 85, 0.22);
    background: rgba(8, 8, 14, 0.75);
    backdrop-filter: blur(38px) saturate(200%);
    -webkit-backdrop-filter: blur(38px) saturate(200%);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    transition: background 0.35s, border-color 0.35s, height 0.3s;
    box-shadow:
        0 6px 50px rgba(0, 0, 0, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    width: 100%;
    max-width: 100vw;
}

nav::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--accent) 15%,
        var(--platinum) 30%,
        var(--purple) 50%,
        var(--ice) 70%,
        var(--gold) 85%,
        transparent 100%
    );
    opacity: 0.75;
    animation: navGlow 5.5s ease-in-out infinite alternate;
}

@keyframes navGlow {
    0%   { opacity: 0.5; filter: blur(0); }
    100% { opacity: 1; filter: blur(0.6px); }
}

[data-theme="light"] nav {
    background: rgba(255, 255, 255, 0.9);
    border-bottom-color: rgba(0, 0, 0, 0.1);
    box-shadow:
        0 6px 50px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

/* ============================================================ */
/* [AETHRION] LOGO                                              */
/* ============================================================ */
.logo {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}

.logo-icon {
    width: 62px;
    height: 62px;
    background: linear-gradient(135deg, #e8c555 0%, #f5d878 35%, #c5cde0 65%, #8b6bff 100%);
    background-size: 200% 200%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow:
        0 0 42px rgba(232, 197, 85, 0.7),
        0 0 85px rgba(197, 205, 224, 0.45),
        0 0 130px rgba(139, 107, 255, 0.3),
        inset 0 0 24px rgba(255, 255, 255, 0.18);
    color: #ffffff;
    text-shadow: 0 0 24px rgba(232, 197, 85, 0.85);
    will-change: auto;
    position: relative;
    overflow: hidden;
    animation: logoSpinGlow 9s ease-in-out infinite, logoGradientShift 6s ease infinite;
}

@keyframes logoGradientShift {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

.logo-icon::before {
    content: '';
    position: absolute;
    inset: -4px;
    background: conic-gradient(
        from 0deg,
        transparent,
        var(--accent),
        transparent,
        var(--platinum),
        transparent,
        var(--purple),
        transparent,
        var(--ice),
        transparent
    );
    border-radius: 50%;
    animation: logoConicSpin 8s linear infinite;
    z-index: -1;
}

@keyframes logoSpinGlow {
    0%, 100% {
        box-shadow:
            0 0 42px rgba(232, 197, 85, 0.7),
            0 0 85px rgba(139, 107, 255, 0.45),
            0 0 130px rgba(197, 205, 224, 0.3);
    }
    50% {
        box-shadow:
            0 0 60px rgba(232, 197, 85, 1),
            0 0 120px rgba(139, 107, 255, 0.7),
            0 0 180px rgba(197, 205, 224, 0.45);
    }
}

@keyframes logoConicSpin {
    to { transform: rotate(360deg); }
}

.logo-text {
    font-family: var(--font-display);
    font-size: 31px;
    font-weight: 800;
    background: linear-gradient(
        45deg,
        #e8c555,
        #f5d878,
        #c5cde0,
        #8b6bff,
        #6ee0ff,
        #e8c555
    );
    background-size: 500% 500%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 7.5s ease infinite;
    text-shadow: 0 0 55px rgba(232, 197, 85, 0.5);
    will-change: background-position;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    letter-spacing: 1.4px;
}

@keyframes gradientMove {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ============================================================ */
/* NAV LİNKLERİ                                                 */
/* ============================================================ */
.nav-links {
    display: flex;
    gap: 44px;
    list-style: none;
}

.nav-links a {
    color: var(--text2);
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    transition: color var(--transition-fast);
    cursor: pointer;
    position: relative;
    padding: 10px 0;
}

.nav-links a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    right: 50%;
    height: 2.5px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), var(--purple));
    transition: left 0.38s ease, right 0.38s ease;
    border-radius: 3px;
    box-shadow: 0 0 14px var(--accent), 0 0 28px var(--purple-glow);
}

.nav-links a:hover {
    color: var(--accent);
    text-shadow: 0 0 24px var(--accent-glow);
}

.nav-links a:hover::after {
    left: 0;
    right: 0;
}

.button-group {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.secret-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* ============================================================ */
/* AETHRION MARKA ROZETİ                                       */
/* ============================================================ */
.aethrion-mark {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e8c555, #8b6bff);
    border-radius: 50%;
    color: #030306;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -0.5px;
    font-family: var(--font-display);
    box-shadow:
        0 0 20px rgba(232, 197, 85, 0.7),
        inset 0 0 10px rgba(255, 255, 255, 0.28);
    margin-left: 6px;
    cursor: help;
    transition: transform 0.26s ease, box-shadow 0.26s ease;
}

.aethrion-mark:hover {
    transform: scale(1.18) rotate(-8deg);
    box-shadow:
        0 0 32px rgba(232, 197, 85, 1),
        0 0 60px rgba(139, 107, 255, 0.6);
}

/* ============================================================ */
/* TEMA BUTONU                                                  */
/* ============================================================ */
.theme-toggle,
.theme-toggle-btn {
    background: none;
    border: 1.5px solid var(--border2);
    border-radius: 50%;
    width: 44px;
    height: 44px;
    cursor: pointer;
    color: var(--text);
    font-size: 19px;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.theme-toggle::before,
.theme-toggle-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle, rgba(232, 197, 85, 0.32) 0%, transparent 70%);
    opacity: 0;
    transition: opacity 0.3s;
}

.theme-toggle:hover,
.theme-toggle-btn:hover {
    border-color: var(--accent);
    transform: rotate(30deg) scale(1.12);
    box-shadow: 0 0 28px rgba(232, 197, 85, 0.55), 0 0 55px var(--purple-glow);
}

.theme-toggle:hover::before,
.theme-toggle-btn:hover::before {
    opacity: 1;
}

/* ============================================================ */
/* [AETHRION] BUTONLAR (Luxury Legendary)                       */
/* ============================================================ */
.btn {
    padding: 13px 30px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--transition-fast);
    border: none;
    font-family: var(--font-body);
    position: relative;
    overflow: hidden;
    letter-spacing: 0.38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    transform: translate(-50%, -50%);
    transition: width 0.7s, height 0.7s;
    pointer-events: none;
}

.btn:active::before {
    width: 380px;
    height: 380px;
    transition: width 0.3s, height 0.3s;
}

.btn-primary {
    background: linear-gradient(135deg, #e8c555 0%, #f5d878 25%, #c5cde0 55%, #8b6bff 100%);
    background-size: 250% 250%;
    color: #06060b;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.55),
        0 0 70px rgba(139, 107, 255, 0.3),
        inset 0 0 22px rgba(255, 255, 255, 0.18);
    animation: btnGradientShift 5.5s ease infinite;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.25);
    font-weight: 700;
}

@keyframes btnGradientShift {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

.btn-primary:hover {
    transform: translateY(-3px) scale(1.04);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 0.9),
        0 0 120px rgba(139, 107, 255, 0.65),
        0 0 180px rgba(197, 205, 224, 0.4),
        inset 0 0 35px rgba(255, 255, 255, 0.22);
}

.btn-secondary {
    background: transparent;
    border: 2px solid var(--accent);
    color: var(--accent);
    box-shadow: inset 0 0 0 transparent;
    position: relative;
    overflow: hidden;
}

.btn-secondary::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(232, 197, 85, 0.25), transparent);
    transform: translateX(-100%);
    transition: transform 0.8s;
    pointer-events: none;
}

.btn-secondary:hover::after {
    transform: translateX(100%);
}

.btn-secondary:hover {
    background: rgba(232, 197, 85, 0.16);
    box-shadow: var(--shadow-glow), 0 0 70px var(--purple-glow);
    transform: translateY(-2px);
    color: var(--accent-hover);
}

.btn-danger {
    background: transparent;
    border: 1.5px solid var(--danger);
    color: var(--danger);
    position: relative;
}

.btn-danger:hover {
    background: rgba(255, 77, 94, 0.2);
    border-color: var(--danger-hover);
    box-shadow: 0 0 35px rgba(255, 77, 94, 0.55);
    transform: translateY(-2px);
}

.btn-success {
    background: linear-gradient(135deg, var(--accent2) 0%, #aab8d0 100%);
    color: #06060b;
    box-shadow: 0 0 35px rgba(197, 205, 224, 0.55);
    font-weight: 700;
}

.btn-success:hover {
    box-shadow: 0 0 60px rgba(197, 205, 224, 0.9), 0 0 120px rgba(197, 205, 224, 0.45);
    transform: translateY(-2px);
}

.btn-sm {
    padding: 8px 20px;
    font-size: 12px;
}

.btn-price {
    width: 100%;
    padding: 18px;
    background: transparent;
    border: 1.5px solid var(--border2);
    color: var(--text2);
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: var(--radius-pill);
    transition: all var(--transition-fast);
    letter-spacing: 1px;
}

.btn-price:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.45), 0 0 70px var(--purple-glow);
    transform: translateY(-2px);
}

.price-card.featured .btn-price {
    background: linear-gradient(135deg, var(--accent), var(--gold-soft), var(--purple));
    background-size: 200% 200%;
    color: #06060b;
    border: none;
    box-shadow: 0 0 40px rgba(232, 197, 85, 0.65), 0 0 80px var(--purple-glow);
    font-weight: 700;
    animation: btnGradientShift 5.5s ease infinite;
}

.price-card.featured .btn-price:hover {
    box-shadow: 0 0 70px rgba(232, 197, 85, 1), 0 0 130px var(--purple-glow);
    transform: translateY(-3px) scale(1.03);
}

.nav-cta {
    background: transparent;
    border: 1.5px solid var(--accent);
    color: var(--accent);
    padding: 11px 26px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--transition-fast);
    letter-spacing: 0.38px;
}

.nav-cta:hover {
    background: rgba(232, 197, 85, 0.16);
    box-shadow: var(--shadow-glow), 0 0 70px var(--purple-glow);
    transform: translateY(-1px);
}

.secret-btn {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    border: 1px solid var(--border2);
    color: var(--text3);
    font-size: 10.5px;
    padding: 8px 18px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.secret-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(232, 197, 85, 0.16);
    box-shadow: 0 0 24px rgba(232, 197, 85, 0.45);
    transform: translateY(-1px);
}

.logout-btn {
    background: rgba(255, 77, 94, 0.16);
    border: 1.5px solid var(--danger);
    color: var(--danger);
    padding: 11px 26px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: all var(--transition-fast);
    font-weight: 600;
}

.logout-btn:hover {
    background: rgba(255, 77, 94, 0.3);
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.55);
    transform: translateY(-1px);
}

/* ============================================================ */
/* [AETHRION] HERO (Legendary)                                  */
/* ============================================================ */
.hero {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 170px 52px 110px;
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 100vw;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 26px;
    border: 1px solid rgba(232, 197, 85, 0.45);
    border-radius: var(--radius-pill);
    font-size: 13px;
    color: var(--accent);
    margin-bottom: 42px;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    font-weight: 600;
    letter-spacing: 0.55px;
    box-shadow:
        0 0 40px rgba(232, 197, 85, 0.25),
        0 0 80px var(--purple-glow),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    animation: badgePulse 3.8s ease-in-out infinite;
}

@keyframes badgePulse {
    0%, 100% {
        box-shadow:
            0 0 40px rgba(232, 197, 85, 0.25),
            0 0 80px var(--purple-glow);
    }
    50% {
        box-shadow:
            0 0 65px rgba(232, 197, 85, 0.5),
            0 0 130px var(--purple-glow);
    }
}

.hero-badge .blink {
    width: 11px;
    height: 11px;
    background: var(--accent2);
    border-radius: 50%;
    animation: blink 1s step-end infinite;
    box-shadow: 0 0 18px var(--accent2), 0 0 35px var(--accent2-glow);
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.2; }
}

.hero-title {
    font-family: var(--font-display);
    font-size: clamp(56px, 9vw, 116px);
    font-weight: 800;
    line-height: 0.95;
    margin-bottom: 34px;
    letter-spacing: -1.8px;
}

.hero-title .line1 {
    color: var(--text);
    display: block;
    text-shadow:
        0 0 50px rgba(232, 197, 85, 0.55),
        0 0 100px rgba(232, 197, 85, 0.3);
}

.hero-title .line2 {
    display: block;
    -webkit-text-stroke: 3px var(--accent);
    color: transparent;
    text-shadow: 0 0 80px rgba(232, 197, 85, 0.6);
    position: relative;
}

.hero-title .line2::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    -webkit-text-stroke: 0;
    background: linear-gradient(90deg, var(--accent), var(--platinum), var(--purple), var(--ice), var(--accent));
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 7.5s ease infinite;
    opacity: 0.2;
    filter: blur(20px);
}

.hero-title .line3 {
    display: block;
    color: var(--accent2);
    font-size: 0.48em;
    margin-top: 18px;
    letter-spacing: 3.5px;
    text-shadow: 0 0 40px rgba(197, 205, 224, 0.6), 0 0 80px rgba(197, 205, 224, 0.3);
    font-weight: 600;
}

.hero-sub {
    max-width: 760px;
    font-size: 17px;
    line-height: 1.9;
    color: var(--text2);
    margin-bottom: 60px;
    letter-spacing: 0.22px;
}

.hero-actions {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 78px;
}

/* ============================================================ */
/* [AETHRION] STATS (Legendary gold neon)                       */
/* ============================================================ */
.stats-bar {
    display: flex;
    justify-content: center;
    gap: 0;
    margin-top: 24px;
    border: 1px solid var(--border2);
    background: linear-gradient(135deg, rgba(22, 22, 32, 0.75), rgba(38, 38, 52, 0.6));
    backdrop-filter: blur(22px) saturate(180%);
    -webkit-backdrop-filter: blur(22px) saturate(180%);
    max-width: 950px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 90px;
    overflow: hidden;
    box-shadow:
        0 0 60px rgba(232, 197, 85, 0.18),
        0 0 120px var(--purple-glow),
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        inset 0 0 40px rgba(232, 197, 85, 0.06);
    position: relative;
}

.stats-bar::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(232, 197, 85, 0.12) 20%,
        rgba(139, 107, 255, 0.12) 50%,
        rgba(197, 205, 224, 0.12) 80%,
        transparent
    );
    pointer-events: none;
}

.stat-item {
    flex: 1;
    padding: 32px 42px;
    text-align: center;
    border-right: 1px solid var(--border);
    position: relative;
    transition: background 0.35s;
}

.stat-item:hover {
    background: linear-gradient(180deg, rgba(232, 197, 85, 0.08), rgba(139, 107, 255, 0.05));
}

.stat-item:last-child {
    border-right: none;
}

.stat-num {
    font-family: var(--font-display);
    font-size: 46px;
    font-weight: 800;
    background: linear-gradient(135deg, var(--accent), var(--gold-soft), var(--platinum), var(--purple));
    background-size: 250% 250%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: block;
    animation: gradientMove 5.5s ease infinite;
    text-shadow: 0 0 45px rgba(232, 197, 85, 0.45);
    letter-spacing: -1.4px;
}

.stat-label {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 2.8px;
    color: var(--text3);
    margin-top: 10px;
    font-weight: 600;
}

/* ============================================================ */
/* SCROLL INDICATOR                                             */
/* ============================================================ */
.scroll-indicator {
    position: absolute;
    bottom: 46px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    opacity: 0.6;
    animation: scrollBounce 2.6s ease-in-out infinite;
}

@keyframes scrollBounce {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50%      { transform: translateX(-50%) translateY(12px); }
}

.scroll-mouse {
    width: 30px;
    height: 48px;
    border: 1.5px solid var(--accent);
    border-radius: 18px;
    display: flex;
    justify-content: center;
    padding-top: 10px;
    box-shadow: 0 0 24px rgba(232, 197, 85, 0.4);
}

.scroll-wheel {
    width: 3px;
    height: 11px;
    background: var(--accent);
    border-radius: 3px;
    animation: scrollAnim 1.7s ease infinite;
    box-shadow: 0 0 12px var(--accent);
}

@keyframes scrollAnim {
    from { transform: translateY(0); opacity: 1; }
    to   { transform: translateY(16px); opacity: 0; }
}

.scroll-indicator span {
    font-size: 11.5px;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: 2.4px;
    font-weight: 500;
}

/* ============================================================ */
/* [AETHRION] SPLASH EKRANI — KÖKTEN YENİDEN TASARIM            */
/* Çok katmanlı orbit halkaları, shimmer, pulse, particles      */
/* ============================================================ */
#splashScreen {
    position: fixed;
    inset: 0;
    z-index: 9999999;
    background:
        radial-gradient(ellipse 120% 80% at 50% 40%, #0a0a18 0%, #030306 55%, #000000 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: opacity 0.9s ease;
    overflow: hidden;
    width: 100vw;
    height: 100vh;
}

#splashScreen.hide,
#splashScreen.hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.65s ease, visibility 0.65s ease !important;
}

#splashScreen::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 70% 50% at 25% 30%, rgba(232, 197, 85, 0.22) 0%, transparent 65%),
        radial-gradient(ellipse 60% 50% at 75% 70%, rgba(139, 107, 255, 0.22) 0%, transparent 65%),
        radial-gradient(ellipse 75% 45% at 50% 0%, rgba(110, 224, 255, 0.14) 0%, transparent 65%),
        radial-gradient(ellipse 65% 45% at 50% 100%, rgba(197, 205, 224, 0.16) 0%, transparent 65%),
        radial-gradient(ellipse 50% 35% at 50% 50%, rgba(245, 216, 120, 0.08) 0%, transparent 70%);
    animation: splashBgBreath 5.5s ease-in-out infinite alternate;
    z-index: 0;
    pointer-events: none;
}

@keyframes splashBgBreath {
    0%   { opacity: 0.65; transform: scale(1); }
    100% { opacity: 1;    transform: scale(1.1); }
}

#splashScreen::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(1px 1px at 15% 25%, rgba(255, 255, 255, 0.6), transparent),
        radial-gradient(1.5px 1.5px at 55% 65%, rgba(232, 197, 85, 0.7), transparent),
        radial-gradient(1px 1px at 75% 15%, rgba(139, 107, 255, 0.65), transparent),
        radial-gradient(1px 1px at 35% 85%, rgba(110, 224, 255, 0.6), transparent),
        radial-gradient(1.2px 1.2px at 85% 55%, rgba(245, 216, 120, 0.65), transparent),
        radial-gradient(1px 1px at 25% 45%, rgba(255, 255, 255, 0.5), transparent);
    background-size: 260px 260px, 320px 320px, 300px 300px, 260px 260px, 340px 340px, 280px 280px;
    animation: splashStarsTwinkle 5s ease-in-out infinite alternate;
    z-index: 0;
    pointer-events: none;
    opacity: 0.7;
}

@keyframes splashStarsTwinkle {
    0%   { opacity: 0.5; }
    100% { opacity: 1; }
}

.splash-particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

.splash-particle {
    position: absolute;
    width: 3.5px;
    height: 3.5px;
    background: var(--accent);
    border-radius: 50%;
    animation: floatParticle linear infinite;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 12px currentColor;
}

.splash-particle:nth-child(odd) {
    background: var(--purple);
    width: 4.5px;
    height: 4.5px;
}

.splash-particle:nth-child(3n) {
    background: var(--ice);
    width: 3px;
    height: 3px;
}

.splash-particle:nth-child(5n) {
    background: var(--platinum);
    box-shadow: 0 0 18px var(--platinum);
}

.splash-particle:nth-child(7n) {
    background: var(--quantum);
    box-shadow: 0 0 18px var(--quantum);
}

.splash-particle:nth-child(11n) {
    background: var(--gold);
    box-shadow: 0 0 18px var(--gold);
}

@keyframes floatParticle {
    0%   { transform: translateY(100vh) scale(0); opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 0.6; }
    100% { transform: translateY(-10vh) scale(1.3); opacity: 0; }
}

/* --- AETHRION LOGO (Splash) — 3 KATMANLI HALKA --- */
.splash-logo {
    width: 190px;
    height: 190px;
    padding: 18px;
    border-radius: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(12, 12, 20, 0.85);
    border: 2px solid rgba(232, 197, 85, 0.65);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 0.5),
        0 0 130px rgba(139, 107, 255, 0.35),
        0 0 240px rgba(197, 205, 224, 0.22),
        inset 0 0 55px rgba(255, 255, 255, 0.06);
    animation: splashLogoEnter 1.1s ease-out forwards,
               splashLogoPulse 3.2s ease-in-out 1s infinite;
    position: relative;
    z-index: 2;
    overflow: visible;
    will-change: transform, box-shadow;
}

.splash-logo::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 49px;
    background: conic-gradient(
        from 0deg,
        #e8c555,
        #f5d878,
        #c5cde0,
        #8b6bff,
        #6ee0ff,
        #e8c555
    );
    animation: splashLogoBorder 5.5s linear infinite;
    z-index: -1;
    filter: blur(4px);
}

.splash-logo::after {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 38px;
    background: #06060b;
    z-index: -1;
}

/* Yeni: Dış orbit halkası (yavaş döner) */
.splash-logo .aath-orbit-outer {
    position: absolute;
    inset: -34px;
    border-radius: 50%;
    border: 2px dashed rgba(232, 197, 85, 0.55);
    animation: splashOrbitSpin 14s linear infinite;
    pointer-events: none;
}

.splash-logo .aath-orbit-outer::before,
.splash-logo .aath-orbit-outer::after {
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 22px var(--accent), 0 0 42px var(--accent-glow);
    top: 50%;
    transform: translateY(-50%);
}
.splash-logo .aath-orbit-outer::before { left: -5px; }
.splash-logo .aath-orbit-outer::after  { right: -5px; background: var(--purple); box-shadow: 0 0 22px var(--purple), 0 0 42px var(--purple-glow); }

/* Yeni: İç orbit halkası (ters yön) */
.splash-logo .aath-orbit-inner {
    position: absolute;
    inset: -22px;
    border-radius: 50%;
    border: 1.5px solid rgba(139, 107, 255, 0.55);
    animation: splashOrbitSpin 9s linear infinite reverse;
    pointer-events: none;
}

.splash-logo .aath-orbit-inner::before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ice);
    box-shadow: 0 0 20px var(--ice), 0 0 40px var(--ice-glow);
    top: -4px;
    left: 50%;
    transform: translateX(-50%);
}

@keyframes splashOrbitSpin {
    to { transform: rotate(360deg); }
}

/* Yeni: Shimmer conic parıltı */
.splash-logo .aath-shimmer {
    position: absolute;
    inset: -10px;
    border-radius: 52px;
    background: conic-gradient(
        from 0deg,
        transparent 0%,
        rgba(232, 197, 85, 0.55) 15%,
        transparent 30%,
        rgba(139, 107, 255, 0.5) 45%,
        transparent 60%,
        rgba(110, 224, 255, 0.5) 75%,
        transparent 90%
    );
    animation: splashShimmerSpin 4.5s linear infinite;
    filter: blur(8px);
    opacity: 0.9;
    z-index: -2;
    pointer-events: none;
}

@keyframes splashShimmerSpin {
    to { transform: rotate(360deg); }
}

.splash-logo img,
.splash-logo svg {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
    border-radius: 32px;
    filter: drop-shadow(0 0 32px rgba(232, 197, 85, 0.7))
            drop-shadow(0 0 60px rgba(139, 107, 255, 0.5));
    position: relative;
    z-index: 1;
}

@keyframes splashLogoEnter {
    0%   { opacity: 0; transform: scale(0.35) rotate(-20deg); }
    70%  { opacity: 1; transform: scale(1.12) rotate(4deg); }
    100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

@keyframes splashLogoPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow:
            0 0 60px rgba(232, 197, 85, 0.5),
            0 0 130px rgba(139, 107, 255, 0.35);
    }
    50% {
        transform: scale(1.06);
        box-shadow:
            0 0 85px rgba(232, 197, 85, 0.8),
            0 0 175px rgba(139, 107, 255, 0.55);
    }
}

@keyframes splashLogoBorder {
    to { transform: rotate(360deg); }
}

/* --- Splash Başlık --- */
.splash-title {
    margin-top: 42px;
    font-family: var(--font-display);
    font-size: clamp(38px, 6vw, 58px);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 9px;
    text-align: center;
    background: linear-gradient(
        90deg,
        #e8c555,
        #f5d878,
        #c5cde0,
        #8b6bff,
        #6ee0ff,
        #e8c555
    );
    background-size: 500% 500%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation:
        gradientMove 4.5s ease infinite,
        splashTextEnter 1.2s ease forwards;
    position: relative;
    z-index: 2;
    text-shadow: 0 0 85px rgba(232, 197, 85, 0.4);
}

.splash-sub {
    color: var(--text3);
    font-size: 16px;
    margin-top: 24px;
    letter-spacing: 6px;
    text-align: center;
    animation: splashTextEnter 1.4s ease forwards;
    position: relative;
    z-index: 2;
    opacity: 0;
    text-transform: uppercase;
    font-weight: 500;
    font-style: italic;
}

.splash-sub em {
    font-style: italic;
    color: var(--accent);
    text-shadow: 0 0 32px rgba(232, 197, 85, 0.9);
    font-weight: 700;
}

.splash-status {
    margin-top: 28px;
    min-height: 24px;
    color: rgba(255, 255, 255, 0.82);
    font-family: var(--font-code);
    font-size: 12.5px;
    letter-spacing: 3.5px;
    text-align: center;
    position: relative;
    z-index: 2;
    animation: splashTextEnter 1.6s ease forwards;
    opacity: 0;
    text-transform: uppercase;
}

.splash-status-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 11px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 22px var(--accent2);
    animation: splashStatusBlink 1.1s ease-in-out infinite;
    vertical-align: middle;
}

@keyframes splashStatusBlink {
    0%, 100% { opacity: 0.35; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.3); }
}

/* --- AETHRION İLERLEME ÇUBUĞU --- */
.splash-progress-wrap {
    width: min(560px, 86vw);
    margin-top: 40px;
    position: relative;
    z-index: 2;
}

.splash-progress-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    font-family: var(--font-code);
    font-size: 11.5px;
    letter-spacing: 2.4px;
    color: rgba(255, 255, 255, 0.6);
    text-transform: uppercase;
    font-weight: 600;
}

.splash-progress {
    width: 100%;
    height: 18px;
    padding: 3.5px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(232, 197, 85, 0.22);
    border-radius: var(--radius-pill);
    overflow: hidden;
    box-shadow:
        0 0 40px rgba(232, 197, 85, 0.25),
        0 0 80px rgba(139, 107, 255, 0.15),
        inset 0 0 22px rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    position: relative;
}

.splash-progress-bar {
    width: 0%;
    height: 100%;
    border-radius: var(--radius-pill);
    background: linear-gradient(
        90deg,
        #e8c555 0%,
        #f5d878 20%,
        #c5cde0 40%,
        #8b6bff 60%,
        #6ee0ff 80%,
        #e8c555 100%
    );
    background-size: 300% 100%;
    transition: width 0.1s linear;
    animation: splashProgressShine 1.8s linear infinite;
    box-shadow:
        0 0 25px rgba(232, 197, 85, 0.9),
        0 0 55px rgba(139, 107, 255, 0.55);
    position: relative;
    overflow: hidden;
    will-change: width;
}

.splash-progress-bar::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: -35%;
    width: 35%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.95),
        transparent
    );
    animation: splashProgressSweep 1.4s linear infinite;
}

@keyframes splashProgressShine {
    0%   { background-position: 0% 50%; }
    100% { background-position: 300% 50%; }
}

@keyframes splashProgressSweep {
    0%   { left: -35%; }
    100% { left: 118%; }
}

.splash-progress-info {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 16px;
    font-family: var(--font-code);
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 1.8px;
}

.splash-percent {
    color: #ffffff;
    font-weight: 800;
    min-width: 54px;
    text-align: right;
    text-shadow: 0 0 22px rgba(232, 197, 85, 0.8);
    font-family: var(--font-code);
}

.splash-complete {
    color: var(--accent2) !important;
    text-shadow: 0 0 30px rgba(197, 205, 224, 0.8);
}

.splash-ready {
    position: relative;
    z-index: 2;
    margin-top: 20px;
    font-size: 11px;
    letter-spacing: 4.5px;
    color: rgba(255, 255, 255, 0.35);
    text-transform: uppercase;
    font-weight: 500;
    animation: splashTextEnter 1.8s ease forwards;
    opacity: 0;
}

.splash-version {
    position: absolute;
    bottom: 36px;
    right: 42px;
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.28);
    font-family: var(--font-code);
    letter-spacing: 2.5px;
    z-index: 2;
    font-weight: 500;
}

@keyframes splashTextEnter {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .splash-logo {
        width: 128px;
        height: 128px;
        border-radius: 32px;
        padding: 12px;
    }
    .splash-logo::before { border-radius: 34px; }
    .splash-logo::after { border-radius: 26px; }
    .splash-logo .aath-orbit-outer { inset: -24px; }
    .splash-logo .aath-orbit-inner { inset: -16px; }
    .splash-title {
        margin-top: 30px;
        letter-spacing: 4px;
    }
    .splash-sub {
        font-size: 12px;
        letter-spacing: 4px;
        padding: 0 22px;
    }
    .splash-progress-wrap {
        width: 84vw;
    }
    .splash-version {
        right: 22px;
        bottom: 22px;
    }
}

/* ============================================================ */
/* UYGULAMAYI İNDİR BUTONU                                      */
/* ============================================================ */
.download-btn-container {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 50;
}

.download-btn-container .btn {
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff);
    background-size: 200% 200%;
    color: #06060b;
    border: none;
    padding: 17px 30px;
    border-radius: var(--radius-pill);
    font-weight: 700;
    box-shadow:
        0 5px 32px rgba(232, 197, 85, 0.6),
        0 0 55px rgba(139, 107, 255, 0.4);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    animation: btnGradientShift 5.5s ease infinite;
}

.download-btn-container .btn:hover {
    transform: scale(1.1) translateY(-4px);
    box-shadow:
        0 10px 55px rgba(232, 197, 85, 1),
        0 0 90px rgba(139, 107, 255, 0.7);
}

/* ============================================================ */
/* SÜRÜM BİLGİSİ                                                */
/* ============================================================ */
.version-badge {
    position: fixed;
    bottom: 88px;
    left: 24px;
    font-size: 11.5px;
    color: var(--text3);
    background: rgba(0, 0, 0, 0.72);
    padding: 7px 17px;
    border-radius: var(--radius-pill);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    z-index: 50;
    border: 1px solid var(--border2);
    font-family: var(--font-code);
    letter-spacing: 0.7px;
}

/* ============================================================ */
/* API MODU TOGGLE BUTONLARI                                    */
/* ============================================================ */
.api-mode-toggle {
    display: inline-flex;
    background: rgba(0, 0, 0, 0.55);
    border: 1px solid var(--border2);
    border-radius: var(--radius-pill);
    padding: 6px;
    gap: 4px;
    flex-wrap: wrap;
    align-items: center;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: inset 0 0 25px rgba(0, 0, 0, 0.6);
}

.api-mode-toggle button {
    background: transparent;
    border: none;
    color: var(--text3);
    padding: 11px 22px;
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.24s ease;
    font-family: var(--font-body);
    white-space: nowrap;
    letter-spacing: 0.38px;
}

.api-mode-toggle button:hover {
    color: var(--text);
    background: rgba(255, 255, 255, 0.08);
}

.api-mode-toggle button.active {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    background-size: 200% 200%;
    color: #06060b;
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.6),
        0 0 60px var(--purple-glow),
        inset 0 0 14px rgba(255, 255, 255, 0.18);
    animation: btnGradientShift 5.5s ease infinite;
    font-weight: 700;
}

.api-mode-toggle button.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* ============================================================ */
/* A27 API KEY ROZET DESTEĞİ                                    */
/* ============================================================ */
.mbadge.a27 {
    border-color: var(--gold);
    color: var(--gold);
    background: linear-gradient(
        135deg,
        rgba(232, 197, 85, 0.22),
        rgba(255, 138, 92, 0.14)
    );
    box-shadow:
        0 0 22px rgba(232, 197, 85, 0.45),
        inset 0 0 14px rgba(232, 197, 85, 0.14);
    font-weight: 700;
    position: relative;
    overflow: hidden;
}

.mbadge.a27::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.4),
        transparent
    );
    animation: a27Shine 3.8s linear infinite;
}

@keyframes a27Shine {
    0%   { left: -100%; }
    100% { left: 200%; }
}

.mbadge.a27:hover {
    box-shadow:
        0 0 42px rgba(232, 197, 85, 0.8),
        0 0 80px rgba(255, 138, 92, 0.5);
    transform: scale(1.1);
    border-color: var(--gold-soft);
}

/* ============================================================ */
/* [AETHRION] AETHRION AL PANEL — KÖKTEN YENİDEN TASARIM       */
/* (Mevcut sınıf isimleri korundu, görsel tamamen yenilendi)    */
/* ============================================================ */

/* 3 Çizgi Tetikleyici */
.aethrion-al-trigger {
    position: fixed;
    top: 108px;
    right: 24px;
    width: 58px;
    height: 58px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 300% 300%;
    border: none;
    border-radius: 17px;
    cursor: pointer;
    z-index: 999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    box-shadow:
        0 5px 40px rgba(232, 197, 85, 0.65),
        0 0 80px rgba(139, 107, 255, 0.45),
        0 0 130px rgba(197, 205, 224, 0.3),
        inset 0 0 20px rgba(255, 255, 255, 0.14);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding: 0;
    animation: aaTriggerGradient 6.5s ease infinite;
}

@keyframes aaTriggerGradient {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

.aethrion-al-trigger:hover {
    transform: scale(1.14) rotate(4deg);
    box-shadow:
        0 12px 60px rgba(232, 197, 85, 1),
        0 0 120px rgba(139, 107, 255, 0.75),
        0 0 180px rgba(197, 205, 224, 0.5);
}

.aethrion-al-trigger::after {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 22px;
    background: conic-gradient(
        from 0deg,
        transparent,
        var(--accent),
        transparent,
        var(--platinum),
        transparent,
        var(--purple),
        transparent,
        var(--ice),
        transparent
    );
    z-index: -1;
    animation: aaTriggerOrbit 5.5s linear infinite;
    filter: blur(6px);
    opacity: 0.8;
}

@keyframes aaTriggerOrbit {
    to { transform: rotate(360deg); }
}

.aethrion-al-trigger span {
    display: block;
    width: 28px;
    height: 3px;
    background: #ffffff;
    border-radius: 2px;
    transition: all 0.34s ease;
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.8);
}

.aethrion-al-trigger.active span:nth-child(1) {
    transform: translateY(9px) rotate(45deg);
}

.aethrion-al-trigger.active span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.aethrion-al-trigger.active span:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg);
}

/* Aethrion Al Panel Ana Gövde */
.aethrion-al-panel {
    position: fixed;
    top: 0;
    right: -100%;
    width: 30%;
    min-width: 420px;
    max-width: 580px;
    height: 100vh;
    background:
        linear-gradient(180deg, rgba(18, 18, 26, 0.99) 0%, rgba(3, 3, 6, 0.998) 100%);
    border-left: 1.5px solid rgba(232, 197, 85, 0.45);
    box-shadow:
        -30px 0 110px rgba(0, 0, 0, 0.95),
        -8px 0 55px rgba(232, 197, 85, 0.22),
        inset 0 0 140px rgba(232, 197, 85, 0.04);
    z-index: 999998;
    display: flex;
    flex-direction: column;
    transition: right 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    pointer-events: auto;
    backdrop-filter: blur(26px) saturate(170%);
    -webkit-backdrop-filter: blur(26px) saturate(170%);
}

.aethrion-al-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 2.5px;
    background: linear-gradient(
        180deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        transparent
    );
    animation: aaPanelEdgeGlow 3.8s ease-in-out infinite alternate;
    box-shadow: 0 0 28px var(--accent), 0 0 60px var(--purple-glow);
    z-index: 1;
}

@keyframes aaPanelEdgeGlow {
    0%   { opacity: 0.55; box-shadow: 0 0 14px var(--accent); }
    100% { opacity: 1;   box-shadow: 0 0 42px var(--accent), 0 0 85px var(--purple); }
}

.aethrion-al-panel.open {
    right: 0;
}

.aethrion-al-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    background: linear-gradient(
        90deg,
        rgba(232, 197, 85, 0.12) 0%,
        rgba(139, 107, 255, 0.1) 50%,
        rgba(197, 205, 224, 0.1) 100%
    );
    border-bottom: 1px solid rgba(232, 197, 85, 0.25);
    flex-shrink: 0;
    gap: 14px;
    position: relative;
    overflow: hidden;
}

.aethrion-al-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(232, 197, 85, 0.22),
        transparent
    );
    transform: translateX(-100%);
    animation: aaHeaderShine 5s linear infinite;
    pointer-events: none;
}

@keyframes aaHeaderShine {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(200%); }
}

.aethrion-al-header .aa-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 4.5s ease infinite;
    letter-spacing: 1.4px;
    white-space: nowrap;
    position: relative;
    z-index: 1;
}

.aethrion-al-header .aa-title .aa-icon {
    width: 46px;
    height: 46px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 200% 200%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.75),
        0 0 70px rgba(139, 107, 255, 0.5),
        inset 0 0 14px rgba(255, 255, 255, 0.2);
    flex-shrink: 0;
    animation: gradientMove 5.5s ease infinite;
    position: relative;
}

.aethrion-al-header .aa-title .aa-icon::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    background: conic-gradient(from 0deg, transparent, #e8c555, transparent, #8b6bff, transparent);
    z-index: -1;
    animation: aaTriggerOrbit 4s linear infinite;
    filter: blur(4px);
}

.aethrion-al-close {
    background: transparent;
    border: 1px solid rgba(255, 77, 94, 0.6);
    color: #ff4d5e;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.24s ease;
    flex-shrink: 0;
    font-weight: 700;
    position: relative;
    z-index: 1;
}

.aethrion-al-close:hover {
    background: rgba(255, 77, 94, 0.3);
    border-color: #ff4d5e;
    color: #fff;
    box-shadow: 0 0 35px rgba(255, 77, 94, 0.75);
    transform: rotate(90deg) scale(1.14);
}

.aethrion-al-responsibility {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 42px 30px;
    text-align: center;
    gap: 26px;
    position: relative;
    overflow-y: auto;
}

.aethrion-al-responsibility .aa-shield {
    font-size: 74px;
    margin-bottom: 12px;
    filter: drop-shadow(0 0 40px rgba(232, 197, 85, 0.8));
    animation: shieldPulse 2.4s ease-in-out infinite;
}

@keyframes shieldPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.14); }
}

.aethrion-al-responsibility h3 {
    font-family: var(--font-display);
    font-size: 22px;
    color: var(--accent);
    margin-bottom: 12px;
    text-shadow: 0 0 28px rgba(232, 197, 85, 0.55);
    letter-spacing: 0.55px;
}

.aethrion-al-responsibility p {
    font-size: 14px;
    color: var(--text2);
    line-height: 1.85;
    max-width: 430px;
}

.aethrion-al-responsibility .aa-warning {
    color: var(--warning);
    font-weight: 700;
    text-shadow: 0 0 22px rgba(255, 179, 71, 0.65);
}

.aa-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(110, 224, 255, 0.1));
    border: 2px solid rgba(255, 77, 94, 0.5);
    border-radius: var(--radius-md);
    padding: 18px 22px;
    cursor: pointer;
    user-select: none;
    width: 100%;
    max-width: 460px;
    transition: border-color 0.24s ease, box-shadow 0.24s ease;
    text-align: left;
}

.aa-checkbox-label:hover {
    border-color: #ff4d5e;
    box-shadow: 0 0 35px rgba(255, 77, 94, 0.5);
}

.aa-checkbox-label input[type="checkbox"] {
    margin-top: 3px;
    width: 24px;
    height: 24px;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}

.aa-checkbox-label span {
    font-size: 13.5px;
    color: #ffb0b8;
    line-height: 1.7;
}

.aa-start-btn {
    width: 100%;
    max-width: 460px;
    padding: 18px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: 36px;
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 40px rgba(232, 197, 85, 0.6),
        0 0 80px rgba(139, 107, 255, 0.4),
        inset 0 0 20px rgba(255, 255, 255, 0.14);
    transition: transform 0.24s ease, box-shadow 0.24s ease, opacity 0.24s ease;
    letter-spacing: 1px;
    animation: btnGradientShift 5.5s ease infinite;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
}

.aa-start-btn:hover:not(:disabled) {
    transform: translateY(-3px) scale(1.03);
    box-shadow:
        0 14px 55px rgba(232, 197, 85, 1),
        0 0 120px rgba(139, 107, 255, 0.7);
}

.aa-start-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

.aethrion-al-modes {
    display: flex;
    gap: 7px;
    padding: 14px 16px;
    background: rgba(0, 0, 0, 0.45);
    border-bottom: 1px solid rgba(232, 197, 85, 0.22);
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: center;
}

.aa-mode-btn {
    flex: 1;
    min-width: 84px;
    padding: 12px 14px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1.5px solid rgba(232, 197, 85, 0.28);
    border-radius: 26px;
    color: var(--text3);
    font-size: 11.5px;
    font-weight: 600;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    text-align: center;
    letter-spacing: 0.28px;
    position: relative;
    overflow: hidden;
}

.aa-mode-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    transform: translateY(-2px);
    box-shadow: 0 6px 28px rgba(232, 197, 85, 0.4);
}

.aa-mode-btn.active {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.35), rgba(139, 107, 255, 0.32), rgba(197, 205, 224, 0.3));
    border-color: var(--accent);
    color: #ffffff;
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.6),
        0 0 60px var(--purple-glow),
        inset 0 0 20px rgba(255, 255, 255, 0.12);
    font-weight: 700;
}

.aa-mode-btn[data-mode="deep"].active {
    background: linear-gradient(135deg, rgba(110, 224, 255, 0.38), rgba(0, 100, 220, 0.32));
    border-color: #6ee0ff;
    box-shadow: 0 0 35px rgba(110, 224, 255, 0.75), 0 0 70px rgba(110, 224, 255, 0.45);
}

.aa-mode-btn[data-mode="agent"].active {
    background: linear-gradient(135deg, rgba(255, 138, 92, 0.38), rgba(255, 77, 94, 0.32));
    border-color: #ff8a5c;
    box-shadow: 0 0 35px rgba(255, 138, 92, 0.75), 0 0 70px rgba(255, 77, 94, 0.45);
}

.aa-mode-btn[data-mode="developer"].active {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.38), rgba(232, 197, 85, 0.32));
    border-color: #c5cde0;
    box-shadow: 0 0 35px rgba(197, 205, 224, 0.75), 0 0 70px rgba(232, 197, 85, 0.45);
}

.aethrion-al-chat {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    scroll-behavior: smooth;
    background: rgba(0, 0, 0, 0.3);
    position: relative;
}

.aethrion-al-chat::-webkit-scrollbar {
    width: 8px;
}

.aethrion-al-chat::-webkit-scrollbar-track {
    background: rgba(232, 197, 85, 0.07);
    border-radius: 10px;
}

.aethrion-al-chat::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(232, 197, 85, 0.6), rgba(139, 107, 255, 0.6));
    border-radius: 10px;
}

.aethrion-al-chat::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(232, 197, 85, 1), rgba(139, 107, 255, 1));
}

.aa-msg {
    max-width: 92%;
    padding: 14px 20px;
    border-radius: var(--radius-lg);
    font-size: 14px;
    line-height: 1.7;
    word-wrap: break-word;
    position: relative;
    animation: aaMsgIn 0.4s ease;
    box-shadow: 0 5px 22px rgba(0, 0, 0, 0.4);
}

@keyframes aaMsgIn {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

.aa-msg.user {
    align-self: flex-end;
    background: linear-gradient(
        135deg,
        rgba(232, 197, 85, 0.3),
        rgba(139, 107, 255, 0.22),
        rgba(197, 205, 224, 0.18)
    );
    border: 1px solid rgba(232, 197, 85, 0.45);
    border-radius: var(--radius-lg) var(--radius-lg) 4px var(--radius-lg);
    color: #fff;
    box-shadow:
        0 5px 30px rgba(232, 197, 85, 0.35),
        inset 0 0 20px rgba(255, 255, 255, 0.08);
}

.aa-msg.bot {
    align-self: flex-start;
    background: linear-gradient(
        135deg,
        rgba(197, 205, 224, 0.14),
        rgba(110, 224, 255, 0.12)
    );
    border: 1px solid rgba(197, 205, 224, 0.28);
    border-left: 3.5px solid var(--accent2);
    border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) 4px;
    color: #eaf2fa;
    box-shadow:
        0 5px 30px rgba(197, 205, 224, 0.22),
        inset 0 0 20px rgba(197, 205, 224, 0.05);
}

.aa-msg .aa-role {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--accent2);
    margin-bottom: 7px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.aa-msg.user .aa-role {
    color: var(--accent);
    text-align: right;
}

.aa-msg code {
    background: rgba(0, 0, 0, 0.65);
    padding: 5px 10px;
    border-radius: 7px;
    font-family: var(--font-code);
    font-size: 12.5px;
    color: var(--accent2);
    border: 1px solid rgba(232, 197, 85, 0.28);
    display: inline-block;
    margin: 2px 0;
}

.aa-thinking {
    align-self: flex-start;
    max-width: 94%;
    padding: 12px 0;
    margin: 4px 0;
    position: relative;
}

.aa-thinking .thinking-text {
    color: var(--text3);
    font-size: 12.5px;
    font-style: italic;
    font-family: var(--font-code);
    line-height: 1.8;
    padding: 14px 18px;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 260px;
    overflow-y: auto;
    border-radius: 14px;
    opacity: 0.92;
    background: rgba(110, 224, 255, 0.1);
    border-left: 2.5px solid rgba(110, 224, 255, 0.55);
    animation: thinkFade 1.9s ease-in-out infinite;
}

@keyframes thinkFade {
    0%, 100% { opacity: 0.7; }
    50%      { opacity: 1; }
}

.aa-thinking .thinking-line {
    height: 2px;
    background: linear-gradient(90deg, #6ee0ff, rgba(110, 224, 255, 0.2));
    margin: 10px 18px 0 18px;
    width: calc(100% - 36px);
    border-radius: 2px;
    transform-origin: left center;
    animation: thinkLineGrow 1.7s ease-in-out infinite;
    box-shadow: 0 0 12px rgba(110, 224, 255, 0.8);
}

@keyframes thinkLineGrow {
    0%   { transform: scaleX(0.05); opacity: 0.4; }
    50%  { transform: scaleX(1);    opacity: 1; }
    100% { transform: scaleX(0.05); opacity: 0.4; }
}

.aa-thinking.done .thinking-line {
    animation: none;
    transform: scaleX(1);
    background: linear-gradient(90deg, #6ee0ff, #e8c555, #8b6bff);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.9);
}

.aa-thinking.done .thinking-text {
    animation: none;
    opacity: 0.8;
}

.aa-agent-indicator {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    background: linear-gradient(135deg, rgba(255, 138, 92, 0.2), rgba(255, 77, 94, 0.14));
    border: 1px solid rgba(255, 138, 92, 0.55);
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 600;
    color: #ff8a5c;
    letter-spacing: 0.55px;
    margin: 6px 0;
    animation: agentPulse 2s ease-in-out infinite;
}

@keyframes agentPulse {
    0%, 100% { box-shadow: 0 0 15px rgba(255, 138, 92, 0.4); }
    50%      { box-shadow: 0 0 35px rgba(255, 138, 92, 0.8); }
}

.aa-file-preview-box {
    display: none;
    align-items: center;
    gap: 15px;
    padding: 14px 18px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.1));
    border: 1px solid rgba(232, 197, 85, 0.45);
    border-top: 1px solid rgba(232, 197, 85, 0.45);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    flex-shrink: 0;
    margin-bottom: 0;
    position: relative;
    animation: aaFileSlideIn 0.34s ease;
}

.aa-file-preview-box.show {
    display: flex;
}

@keyframes aaFileSlideIn {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
}

.aa-file-preview-icon {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.25), rgba(139, 107, 255, 0.2));
    border-radius: 14px;
    flex-shrink: 0;
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.4);
    overflow: hidden;
}

.aa-file-preview-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.aa-file-preview-info {
    flex: 1;
    min-width: 0;
}

.aa-file-preview-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--accent);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.3px;
}

.aa-file-preview-size {
    font-size: 11.5px;
    color: var(--text3);
    margin-top: 3px;
    letter-spacing: 0.38px;
}

.aa-file-preview-remove {
    width: 34px;
    height: 34px;
    background: rgba(255, 77, 94, 0.2);
    border: 1px solid rgba(255, 77, 94, 0.55);
    color: var(--danger);
    border-radius: 50%;
    cursor: pointer;
    font-size: 17px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.24s ease;
}

.aa-file-preview-remove:hover {
    background: rgba(255, 77, 94, 0.4);
    color: #fff;
    transform: rotate(90deg) scale(1.14);
    box-shadow: 0 0 22px rgba(255, 77, 94, 0.8);
}

.aethrion-al-input-area {
    display: flex;
    gap: 10px;
    padding: 16px 20px;
    background: rgba(3, 3, 6, 0.995);
    border-top: 1px solid rgba(232, 197, 85, 0.32);
    align-items: flex-end;
    flex-shrink: 0;
    flex-wrap: wrap;
    position: relative;
}

.aethrion-al-input-area textarea {
    flex: 1;
    min-width: 140px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.07), rgba(139, 107, 255, 0.05));
    border: 1.5px solid rgba(232, 197, 85, 0.4);
    color: #fff;
    padding: 14px 20px;
    border-radius: 26px;
    font-size: 14px;
    font-family: var(--font-body);
    resize: none;
    max-height: 140px;
    min-height: 48px;
    outline: none;
    transition: border-color 0.24s ease, box-shadow 0.24s ease;
    line-height: 1.55;
}

.aethrion-al-input-area textarea:focus {
    border-color: var(--accent);
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.55),
        inset 0 0 20px rgba(232, 197, 85, 0.08);
}

.aethrion-al-input-area textarea::placeholder {
    color: var(--text4);
}

.aa-mic-btn {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(139, 107, 255, 0.14));
    border: 1.5px solid rgba(232, 197, 85, 0.5);
    border-radius: 50%;
    color: var(--accent);
    font-size: 19px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.3);
}

.aa-mic-btn:hover {
    background: rgba(232, 197, 85, 0.4);
    border-color: var(--accent);
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.7), 0 0 70px var(--purple-glow);
    transform: scale(1.12);
}

.aa-mic-btn.listening {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.4), rgba(255, 77, 94, 0.3));
    border-color: #ff4d5e;
    color: #ff4d5e;
    animation: micPulse 1.1s ease-in-out infinite;
    box-shadow: 0 0 40px rgba(255, 77, 94, 0.8);
}

@keyframes micPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.2); }
}

.aa-voice-chat-btn {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, rgba(110, 224, 255, 0.28), rgba(139, 107, 255, 0.22));
    border: 1.5px solid rgba(110, 224, 255, 0.6);
    border-radius: 50%;
    color: var(--ice);
    font-size: 19px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 0 22px rgba(110, 224, 255, 0.4);
    position: relative;
}

.aa-voice-chat-btn::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 1px solid var(--ice);
    opacity: 0;
    animation: voiceRing 2.4s ease-out infinite;
}

@keyframes voiceRing {
    0%   { opacity: 0.9; transform: scale(1); }
    100% { opacity: 0;   transform: scale(1.65); }
}

.aa-voice-chat-btn:hover {
    background: rgba(110, 224, 255, 0.45);
    border-color: var(--ice);
    color: #fff;
    box-shadow: 0 0 42px rgba(110, 224, 255, 0.9), 0 0 80px var(--purple-glow);
    transform: scale(1.12);
}

.aa-send-btn {
    padding: 14px 26px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: 26px;
    font-size: 14px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.55),
        inset 0 0 20px rgba(255, 255, 255, 0.14);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    flex-shrink: 0;
    white-space: nowrap;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.6px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
}

.aa-send-btn:hover {
    transform: scale(1.07) translateY(-2px);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 1),
        0 0 110px rgba(139, 107, 255, 0.7);
}

.aa-send-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

.aa-screen-permission {
    align-self: stretch;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(197, 205, 224, 0.08));
    border: 1.5px dashed rgba(232, 197, 85, 0.55);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    font-size: 13px;
    color: var(--text3);
    line-height: 1.8;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 14px;
    align-items: center;
    box-shadow: inset 0 0 30px rgba(232, 197, 85, 0.08);
}

.aa-screen-permission button {
    padding: 12px 24px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(197, 205, 224, 0.2));
    border: 1.5px solid var(--accent);
    color: var(--accent);
    border-radius: 26px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-body);
    transition: all 0.3s ease;
    letter-spacing: 0.55px;
}

.aa-screen-permission button:hover {
    background: var(--accent);
    color: #06060b;
    box-shadow: 0 0 42px rgba(232, 197, 85, 0.9), 0 0 80px var(--purple-glow);
    transform: translateY(-2px);
}

/* Sesli Sohbet Tam Ekran */
.aa-voice-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 9999999;
    background:
        radial-gradient(ellipse at 50% 40%, #0f0f18 0%, #05050a 55%, #000 100%);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 34px;
    overflow: hidden;
}

.aa-voice-fullscreen.open {
    display: flex;
}

.aa-voice-fullscreen::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 50% 50%, rgba(232, 197, 85, 0.22) 0%, transparent 60%),
        radial-gradient(ellipse 70% 60% at 30% 30%, rgba(139, 107, 255, 0.18) 0%, transparent 60%),
        radial-gradient(ellipse 70% 60% at 70% 70%, rgba(110, 224, 255, 0.15) 0%, transparent 60%);
    animation: splashBgBreath 5.5s ease-in-out infinite alternate;
    pointer-events: none;
}

.aa-voice-logo {
    width: 165px;
    height: 165px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 70px;
    position: relative;
    z-index: 2;
    animation: voiceLogoPulse 2.4s ease-in-out infinite, gradientMove 5.5s ease infinite;
    box-shadow:
        0 0 85px rgba(232, 197, 85, 0.85),
        0 0 165px rgba(139, 107, 255, 0.6),
        0 0 240px rgba(197, 205, 224, 0.4);
    color: #fff;
    text-shadow: 0 0 40px rgba(255, 255, 255, 0.9);
}

@keyframes voiceLogoPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.12); }
}

.aa-voice-waves {
    display: flex;
    gap: 6px;
    margin-top: 38px;
    align-items: center;
    height: 48px;
    z-index: 2;
}

.aa-voice-waves span {
    width: 5px;
    background: linear-gradient(180deg, var(--accent), var(--platinum), var(--purple));
    border-radius: 4px;
    animation: voiceWave 1.4s ease-in-out infinite;
    box-shadow: 0 0 14px var(--accent);
}

.aa-voice-waves span:nth-child(1)  { animation-delay: 0s;    height: 18px; }
.aa-voice-waves span:nth-child(2)  { animation-delay: 0.1s;  height: 30px; }
.aa-voice-waves span:nth-child(3)  { animation-delay: 0.2s;  height: 42px; }
.aa-voice-waves span:nth-child(4)  { animation-delay: 0.3s;  height: 30px; }
.aa-voice-waves span:nth-child(5)  { animation-delay: 0.4s;  height: 18px; }
.aa-voice-waves span:nth-child(6)  { animation-delay: 0.5s;  height: 36px; }
.aa-voice-waves span:nth-child(7)  { animation-delay: 0.6s;  height: 24px; }
.aa-voice-waves span:nth-child(8)  { animation-delay: 0.7s;  height: 42px; }
.aa-voice-waves span:nth-child(9)  { animation-delay: 0.8s;  height: 18px; }

@keyframes voiceWave {
    0%, 100% { transform: scaleY(0.4); opacity: 0.6; }
    50%      { transform: scaleY(1.3); opacity: 1; }
}

.aa-voice-transcript {
    margin-top: 40px;
    max-width: 780px;
    text-align: center;
    color: var(--text2);
    font-size: 17px;
    line-height: 1.8;
    padding: 0 24px;
    z-index: 2;
    min-height: 68px;
    letter-spacing: 0.38px;
}

.aa-voice-transcript .aa-voice-user-text {
    color: var(--accent);
    font-weight: 600;
}

.aa-voice-transcript .aa-voice-ai-text {
    color: var(--accent2);
    font-weight: 500;
}

.aa-voice-back-btn {
    position: fixed;
    top: 28px;
    right: 28px;
    padding: 14px 26px;
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.28), rgba(255, 77, 94, 0.2));
    border: 1.5px solid rgba(255, 77, 94, 0.6);
    color: #ff4d5e;
    border-radius: var(--radius-pill);
    font-size: 15px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s ease;
    letter-spacing: 0.55px;
}

.aa-voice-back-btn:hover {
    background: rgba(255, 77, 94, 0.45);
    color: #fff;
    box-shadow: 0 0 42px rgba(255, 77, 94, 0.9), 0 0 80px var(--ruby-glow);
    transform: scale(1.07);
}

.aa-voice-status {
    position: fixed;
    top: 34px;
    left: 34px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 22px;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-radius: var(--radius-pill);
    border: 1px solid rgba(232, 197, 85, 0.45);
    color: var(--accent);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.55px;
    z-index: 3;
}

.aa-voice-status::before {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 22px var(--accent2);
    animation: splashStatusBlink 1.1s ease-in-out infinite;
}

/* Backdrop */
.aethrion-al-backdrop {
    display: none !important;
}

body.aethrion-al-open { }

.custom-cursor,
.custom-cursor-ring {
    pointer-events: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-touch-callout: none !important;
}

.particles {
    pointer-events: none !important;
}

.particles .particle {
    pointer-events: none !important;
}

/* ============================================================ */
/* MODERATÖR / TASARIMCI ROZET                                  */
/* ============================================================ */
.role-badge.moderator,
.level-badge.moderator,
#userRoleBadge.moderator {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.3), rgba(245, 216, 120, 0.16));
    border: 1.5px solid #e8c555;
    color: #e8c555;
    box-shadow:
        0 0 22px rgba(232, 197, 85, 0.6),
        inset 0 0 14px rgba(232, 197, 85, 0.14);
    font-weight: 700;
    letter-spacing: 0.55px;
}

/* ============================================================ */
/* [AETHRION] TABLET UYUMLULUĞU (max-width: 768px)             */
/* ============================================================ */
@media (max-width: 768px) {
    nav {
        padding: 0 18px;
        height: 72px;
        gap: 10px;
    }

    .logo { gap: 10px; flex-shrink: 0; }
    .logo-icon { width: 46px; height: 46px; font-size: 24px; }
    .logo-text { font-size: 20px; letter-spacing: 0.7px; }

    .nav-links { gap: 14px; }
    .nav-links a { font-size: 10.5px; letter-spacing: 0.6px; }

    .button-group { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
    .secret-buttons { gap: 5px; }
    .secret-btn { font-size: 8.5px !important; padding: 5px 10px !important; }
    .btn { font-size: 11.5px !important; padding: 8px 16px !important; }
    .nav-cta { font-size: 11.5px !important; padding: 8px 16px !important; }
    .theme-toggle-btn { padding: 5px 9px !important; font-size: 15px !important; }
    .language-selector select { font-size: 10.5px !important; padding: 5px 9px !important; }

    body::after { background-size: 45px 45px; opacity: 0.45; }
    .particles::before,
    .particles::after { filter: blur(80px); opacity: 0.6; }

    .hero { padding: 125px 26px 78px; min-height: auto; }
    .hero-badge { font-size: 12px; padding: 9px 18px; margin-bottom: 26px; }
    .hero-title .line1 { font-size: 54px !important; }
    .hero-title .line2 { font-size: 46px !important; -webkit-text-stroke: 2px var(--accent) !important; }
    .hero-title .line3 { font-size: 18px !important; letter-spacing: 2px; }
    .hero-sub { font-size: 14.5px; padding: 0 14px; margin-bottom: 42px; }

    .hero-actions {
        flex-direction: column;
        align-items: center;
        gap: 14px;
        margin-bottom: 50px;
    }

    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        width: 100%;
        max-width: 380px;
        font-size: 16px !important;
        padding: 15px 30px !important;
    }

    .stats-bar {
        flex-wrap: wrap;
        border-radius: 26px;
        max-width: 100%;
    }
    .stat-item {
        flex: 1 1 50%;
        padding: 22px 16px;
        border-right: none;
        border-bottom: 1px solid var(--border);
    }
    .stat-item:nth-child(odd) { border-right: 1px solid var(--border); }
    .stat-item:nth-child(3),
    .stat-item:nth-child(4) { border-bottom: none; }
    .stat-num { font-size: 30px; }
    .stat-label { font-size: 10px; letter-spacing: 2px; }

    .splash-logo { width: 136px !important; height: 136px !important; border-radius: 36px; padding: 13px; }
    .splash-logo::before { border-radius: 38px; }
    .splash-logo::after { border-radius: 30px; }
    .splash-title { font-size: 36px !important; letter-spacing: 6.5px; }
    .splash-sub { font-size: 13px; letter-spacing: 4px; }
    .splash-progress-wrap { width: 86vw; }
    .splash-version { right: 26px; bottom: 26px; }

    .api-mode-toggle { padding: 4px; }
    .api-mode-toggle button { font-size: 10.5px; padding: 8px 12px; }

    .aethrion-al-panel {
        width: 68%;
        min-width: 360px;
        max-width: 540px;
    }
    .aethrion-al-trigger {
        top: 90px;
        right: 16px;
        width: 52px;
        height: 52px;
    }
    .aethrion-al-trigger span { width: 24px; }
    .aa-mode-btn { font-size: 10.5px; padding: 9px 10px; min-width: 74px; }

    .aa-voice-logo { width: 130px; height: 130px; font-size: 56px; }
    .aa-voice-transcript { font-size: 15px; margin-top: 32px; }
    .aa-voice-back-btn { padding: 11px 20px; font-size: 13px; }
}

/* ============================================================ */
/* [AETHRION] TELEFON UYUMLULUĞU (max-width: 480px)            */
/* ============================================================ */
@media (max-width: 480px) {
    nav {
        padding: 9px 12px !important;
        height: auto !important;
        min-height: 64px !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
    }

    .logo {
        order: 1;
        flex-shrink: 0;
        gap: 7px !important;
    }
    .logo-icon {
        width: 40px !important;
        height: 40px !important;
        font-size: 18px !important;
    }
    .logo-text { font-size: 16px !important; letter-spacing: 0.6px; }

    .nav-links { display: none !important; }

    .button-group {
        order: 2;
        margin-left: auto;
        flex-wrap: wrap !important;
        justify-content: flex-end !important;
        gap: 5px !important;
    }

    .button-group .btn {
        font-size: 9.5px !important;
        padding: 6px 10px !important;
        white-space: nowrap !important;
    }
    .nav-cta {
        font-size: 9.5px !important;
        padding: 6px 10px !important;
        white-space: nowrap !important;
    }
    .logout-btn {
        font-size: 9.5px !important;
        padding: 6px 10px !important;
    }

    .secret-buttons {
        order: 3;
        width: 100% !important;
        justify-content: center !important;
        gap: 5px !important;
        margin-top: 3px;
        padding-top: 7px;
        border-top: 1px solid rgba(232, 197, 85, 0.18);
    }
    .secret-btn {
        font-size: 8.5px !important;
        padding: 5px 10px !important;
        white-space: nowrap !important;
    }

    .language-selector {
        margin-left: 0 !important;
        order: 2;
    }
    .language-selector select {
        font-size: 9.5px !important;
        padding: 5px 8px !important;
    }
    .theme-toggle-btn {
        padding: 5px 10px !important;
        font-size: 13px !important;
        order: 2;
    }

    body::after { background-size: 32px 32px; opacity: 0.32; }

    .particles .particle:nth-child(n+28) { display: none !important; }
    .particles::before,
    .particles::after { display: none; }

    .hero { padding: 88px 12px 48px !important; }
    .hero-badge {
        font-size: 10px !important;
        padding: 7px 13px !important;
        margin-bottom: 20px !important;
    }
    .hero-title .line1 { font-size: 36px !important; }
    .hero-title .line2 {
        font-size: 30px !important;
        -webkit-text-stroke: 1.5px var(--accent) !important;
    }
    .hero-title .line3 {
        font-size: 12.5px !important;
        letter-spacing: 1px !important;
    }
    .hero-sub {
        font-size: 13px !important;
        padding: 0 8px !important;
        margin-bottom: 30px !important;
        line-height: 1.72;
    }
    .hero-actions {
        gap: 10px !important;
        margin-bottom: 36px !important;
    }
    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        font-size: 13.5px !important;
        padding: 12px 22px !important;
        max-width: 320px !important;
    }

    .stats-bar { border-radius: 18px !important; }
    .stat-item {
        flex: 1 1 50% !important;
        padding: 16px 9px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
    }
    .stat-item:nth-child(odd) { border-right: 1px solid var(--border) !important; }
    .stat-item:nth-child(3),
    .stat-item:nth-child(4) { border-bottom: none !important; }
    .stat-num { font-size: 24px !important; }
    .stat-label { font-size: 9px !important; letter-spacing: 1.4px !important; }

    .btn-primary, .btn-secondary {
        font-size: 12.5px !important;
        padding: 10px 17px !important;
    }
    .btn-sm {
        font-size: 10px !important;
        padding: 6px 12px !important;
    }

    .custom-cursor, .custom-cursor-ring { display: none !important; }

    .notification {
        bottom: 18px !important;
        left: 14px !important;
        right: 14px !important;
        max-width: calc(100% - 28px) !important;
        font-size: 13px !important;
        padding: 14px 18px !important;
    }

    .query-limit-badge {
        font-size: 10px !important;
        padding: 6px 12px !important;
        bottom: 84px !important;
        left: 14px !important;
    }

    #splashScreen .splash-logo,
    .splash-logo {
        width: 100px !important;
        height: 100px !important;
        border-radius: 28px !important;
        padding: 9px;
    }
    .splash-logo::before { border-radius: 30px !important; }
    .splash-logo::after { border-radius: 24px !important; }
    .splash-title {
        font-size: 26px !important;
        letter-spacing: 4.5px !important;
        margin-top: 26px;
    }
    .splash-sub {
        font-size: 11.5px !important;
        letter-spacing: 3px !important;
        margin-top: 16px;
    }
    .splash-status { font-size: 10.5px !important; letter-spacing: 2.2px !important; }
    .splash-progress-wrap { width: 88vw !important; }
    .splash-progress { height: 14px !important; }
    .splash-percent { font-size: 12px !important; }
    .splash-progress-head { font-size: 10px !important; letter-spacing: 1.8px; }
    .splash-ready { font-size: 10px !important; letter-spacing: 2.4px !important; }
    .splash-version { bottom: 20px !important; right: 20px !important; font-size: 10px !important; }

    .api-mode-toggle { width: 100%; justify-content: center; padding: 4px; }
    .api-mode-toggle button { font-size: 9.5px; padding: 8px 10px; flex: 1; text-align: center; }

    .aethrion-al-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        border-left: none;
    }
    .aethrion-al-panel::before { display: none; }
    .aethrion-al-trigger {
        top: 78px;
        right: 12px;
        width: 48px;
        height: 48px;
        border-radius: 14px;
    }
    .aethrion-al-trigger span { width: 24px; height: 2.5px; }
    .aethrion-al-trigger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .aethrion-al-trigger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

    .aethrion-al-header { padding: 14px 16px; }
    .aethrion-al-header .aa-title { font-size: 15.5px; gap: 10px; letter-spacing: 0.6px; }
    .aethrion-al-header .aa-title .aa-icon { width: 36px; height: 36px; font-size: 17px; }

    .aethrion-al-modes { padding: 10px 12px; gap: 6px; }
    .aa-mode-btn {
        font-size: 10.5px;
        padding: 8px 9px;
        min-width: 68px;
    }

    .aethrion-al-chat { padding: 14px 16px; gap: 12px; }
    .aa-msg { font-size: 13px; padding: 12px 16px; max-width: 95%; }
    .aa-msg .aa-role { font-size: 10.5px; }
    .aa-msg code { font-size: 11.5px; padding: 3px 7px; }

    .aethrion-al-input-area { padding: 12px 14px; gap: 8px; }
    .aethrion-al-input-area textarea {
        font-size: 13px;
        padding: 11px 16px;
        border-radius: 24px;
        min-height: 46px;
    }
    .aa-send-btn { padding: 12px 18px; font-size: 13px; }
    .aa-mic-btn { width: 46px; height: 46px; font-size: 17px; }
    .aa-voice-chat-btn { width: 46px; height: 46px; font-size: 17px; }

    .aa-thinking .thinking-text { font-size: 12px; max-height: 190px; padding: 10px 14px; }
    .aa-thinking .thinking-line { margin: 7px 14px 0 14px; width: calc(100% - 28px); }

    .aa-file-preview-box { padding: 12px 14px; gap: 12px; }
    .aa-file-preview-icon { width: 44px; height: 44px; font-size: 23px; }
    .aa-file-preview-name { font-size: 13px; }
    .aa-file-preview-size { font-size: 11px; }
    .aa-file-preview-remove { width: 30px; height: 30px; font-size: 15px; }

    .aethrion-al-responsibility { padding: 34px 22px; gap: 22px; }
    .aethrion-al-responsibility .aa-shield { font-size: 56px; }
    .aethrion-al-responsibility h3 { font-size: 19px; }
    .aethrion-al-responsibility p { font-size: 13px; }
    .aa-checkbox-label { padding: 15px 18px; }
    .aa-checkbox-label span { font-size: 13px; }
    .aa-start-btn { font-size: 14.5px; padding: 15px; }

    .aa-voice-logo { width: 120px; height: 120px; font-size: 50px; }
    .aa-voice-transcript { font-size: 14px; padding: 0 18px; margin-top: 28px; }
    .aa-voice-back-btn { padding: 11px 18px; font-size: 13px; top: 18px; right: 18px; }
    .aa-voice-status { top: 18px; left: 18px; padding: 10px 16px; font-size: 13px; }
    .aa-voice-waves { height: 36px; margin-top: 28px; }
    .aa-voice-waves span { width: 4px; }
}

/* ============================================================ */
/* [AETHRION] ÇOK KÜÇÜK EKRANLAR (max-width: 360px)            */
/* ============================================================ */
@media (max-width: 360px) {
    .logo-text { font-size: 14px !important; letter-spacing: 0; }
    .button-group .btn,
    .nav-cta { font-size: 8.5px !important; padding: 5px 8px !important; }
    .secret-btn { font-size: 7.5px !important; padding: 4px 8px !important; }
    .hero-title .line1 { font-size: 29px !important; }
    .hero-title .line2 { font-size: 25px !important; }
    .hero-title .line3 { font-size: 11px !important; }
    .hero-sub { font-size: 12px !important; }
    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        font-size: 12px !important;
        padding: 10px 17px !important;
    }
    .stat-num { font-size: 20px !important; }
    .stat-label { font-size: 8px !important; }

    .api-mode-toggle button { font-size: 8.5px; padding: 7px 8px; }
    .particle:nth-child(n+18) { display: none !important; }

    .aethrion-al-trigger { top: 74px; right: 8px; width: 44px; height: 44px; }
    .aethrion-al-trigger span { width: 22px; }
    .aa-mode-btn { font-size: 9.5px; padding: 7px 6px; min-width: 60px; }
    .aa-msg { font-size: 12px; }

    .splash-logo { width: 86px !important; height: 86px !important; }
    .splash-title { font-size: 22px !important; letter-spacing: 3.5px; }
    .splash-sub { font-size: 10px !important; }

    .aa-voice-logo { width: 94px; height: 94px; font-size: 38px; }
    .aa-voice-transcript { font-size: 13px; }
}

/* ============================================================ */
/* [AETHRION] NVIDIA NIM MODEL ROZETİ (Yeşil tema)             */
/* ============================================================ */
.mbadge.nvidia {
    border-color: var(--nvidia);
    color: var(--nvidia);
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.2), rgba(118, 185, 0, 0.1));
    box-shadow: 0 0 22px rgba(118, 185, 0, 0.45), inset 0 0 14px rgba(118, 185, 0, 0.1);
    font-weight: 700;
}

.mbadge.nvidia:hover {
    box-shadow: 0 0 42px rgba(118, 185, 0, 0.8), 0 0 80px rgba(118, 185, 0, 0.45);
    transform: scale(1.1);
}

/* ============================================================ */
/* [AETHRION] 28 MODEL vurgusu (Hero badge alternate)          */
/* ============================================================ */
.hero-badge .model-count {
    color: var(--nvidia);
    font-weight: 800;
    text-shadow: 0 0 24px var(--nvidia-glow);
}

/* ============================================================ */
/* [AETHRION] QUANTUM EFFECT - Bazı kartlarda hover            */
/* ============================================================ */
.quantum-hover {
    transition: all 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.quantum-hover:hover {
    transform: translateY(-6px) scale(1.02);
    box-shadow:
        0 22px 70px rgba(0, 0, 0, 0.65),
        0 0 55px var(--purple-glow),
        0 0 110px rgba(139, 107, 255, 0.35);
}

/* ============================================================ */
/* [AETHRION] ULTRA MODE - Uzay modu daha derin               */
/* ============================================================ */
body.space-mode {
    --bg: #010205;
    --bg2: #020208;
    --accent: #e8c555;
    --accent-glow: rgba(232, 197, 85, 0.85);
}

body.space-mode body::before {
    opacity: 0.9;
    animation-duration: 16s;
}

/* ═══ [v1.0.0 ALIAS] Eski class isimlerini yeni class'lara bağla ═══ */
/* HTML'de .vizyon-al-* ve .vz-* var, CSS'te .aethrion-al-* ve .aa-* var */
/* Bu blok ikisini birbirine bağlar */

/* AETHRION AL Trigger */
.vizyon-al-trigger {
    position: fixed; top: 108px; right: 24px; width: 58px; height: 58px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 300% 300%; border: none; border-radius: 17px;
    cursor: pointer; z-index: 999; display: flex; flex-direction: column;
    justify-content: center; align-items: center; gap: 6px;
    box-shadow: 0 5px 40px rgba(212,175,55,0.65), 0 0 80px rgba(124,92,255,0.45);
    animation: btnGradientShift 6.5s ease infinite;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.vizyon-al-trigger:hover {
    transform: scale(1.14) rotate(4deg);
    box-shadow: 0 12px 60px rgba(232,197,85,1), 0 0 120px rgba(139,107,255,0.75);
}
.vizyon-al-trigger span {
    display: block; width: 28px; height: 3px; background: #fff;
    border-radius: 2px; box-shadow: 0 0 12px rgba(255,255,255,0.8);
    transition: all 0.34s ease;
}
.vizyon-al-trigger.active span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.vizyon-al-trigger.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.vizyon-al-trigger.active span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* AETHRION AL Panel */
.vizyon-al-panel {
    position: fixed; top: 0; right: -100%; width: 30%; min-width: 420px; max-width: 580px;
    height: 100vh; z-index: 999998; display: flex; flex-direction: column;
    background: linear-gradient(180deg, rgba(18,18,26,0.99) 0%, rgba(3,3,6,0.998) 100%);
    border-left: 1.5px solid rgba(232,197,85,0.45);
    box-shadow: -30px 0 110px rgba(0,0,0,0.95);
    transition: right 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    backdrop-filter: blur(26px) saturate(170%);
    -webkit-backdrop-filter: blur(26px) saturate(170%);
}
.vizyon-al-panel.open { right: 0; }
.vizyon-al-panel:not(.open) {
    right: -100% !important; visibility: hidden !important; pointer-events: none !important;
}
.vizyon-al-backdrop { display: none !important; }

.vizyon-al-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 20px 24px;
    background: linear-gradient(90deg, rgba(232,197,85,0.12), rgba(139,107,255,0.1), rgba(197,205,224,0.1));
    border-bottom: 1px solid rgba(232,197,85,0.25);
    flex-shrink: 0; gap: 14px;
}

.vizyon-al-close {
    background: transparent; border: 1px solid rgba(255,77,94,0.6);
    color: #ff4d5e; width: 38px; height: 38px; border-radius: 50%; cursor: pointer;
    font-size: 18px; display: flex; align-items: center; justify-content: center;
    transition: all 0.24s ease; flex-shrink: 0; font-weight: 700;
}
.vizyon-al-close:hover {
    background: rgba(255,77,94,0.3); border-color: #ff4d5e; color: #fff;
    box-shadow: 0 0 35px rgba(255,77,94,0.75); transform: rotate(90deg) scale(1.14);
}

/* VZ-* class alias'ları */
.vz-title {
    display: flex; align-items: center; gap: 14px;
    font-family: var(--font-display); font-size: 18px; font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent;
    animation: gradientMove 4.5s ease infinite; letter-spacing: 1.4px;
}
.vz-icon {
    width: 46px; height: 46px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 200% 200%; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; flex-shrink: 0;
    box-shadow: 0 0 35px rgba(232,197,85,0.75), 0 0 70px rgba(139,107,255,0.5);
    animation: gradientMove 5.5s ease infinite;
}
.vz-shield {
    font-size: 74px; margin-bottom: 12px;
    filter: drop-shadow(0 0 40px rgba(232,197,85,0.8));
    animation: shieldPulse 2.4s ease-in-out infinite;
}
.vz-checkbox-label {
    display: flex; align-items: flex-start; gap: 16px;
    background: linear-gradient(135deg, rgba(255,77,94,0.14), rgba(110,224,255,0.1));
    border: 2px solid rgba(255,77,94,0.5); border-radius: var(--radius-md);
    padding: 18px 22px; cursor: pointer; user-select: none;
    width: 100%; max-width: 460px; text-align: left;
    transition: border-color 0.24s ease, box-shadow 0.24s ease;
}
.vz-checkbox-label:hover {
    border-color: #ff4d5e; box-shadow: 0 0 35px rgba(255,77,94,0.5);
}
.vz-checkbox-label input[type="checkbox"] {
    margin-top: 3px; width: 24px; height: 24px;
    accent-color: var(--accent); cursor: pointer; flex-shrink: 0;
}
.vz-checkbox-label span { font-size: 13.5px; color: #ffb0b8; line-height: 1.7; }
.vz-start-btn {
    width: 100%; max-width: 460px; padding: 18px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%; color: #06060b; border: none;
    border-radius: 36px; font-size: 16px; font-weight: 700;
    font-family: var(--font-body); cursor: pointer;
    box-shadow: 0 0 40px rgba(232,197,85,0.6), 0 0 80px rgba(139,107,255,0.4);
    transition: transform 0.24s ease, box-shadow 0.24s ease, opacity 0.24s ease;
    letter-spacing: 1px; animation: btnGradientShift 5.5s ease infinite;
}
.vz-start-btn:hover:not(:disabled) {
    transform: translateY(-3px) scale(1.03);
    box-shadow: 0 14px 55px rgba(232,197,85,1), 0 0 120px rgba(139,107,255,0.7);
}
.vz-start-btn:disabled { opacity: 0.4; cursor: not-allowed; transform: none; animation: none; }

.vz-mode-btn {
    flex: 1; min-width: 84px; padding: 12px 14px;
    background: linear-gradient(135deg, rgba(232,197,85,0.1), rgba(139,107,255,0.06));
    border: 1.5px solid rgba(232,197,85,0.28); border-radius: 26px;
    color: var(--text3); font-size: 11.5px; font-weight: 600;
    font-family: var(--font-body); cursor: pointer;
    transition: all 0.3s ease; white-space: nowrap; text-align: center;
}
.vz-mode-btn:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-2px); }
.vz-mode-btn.active {
    background: linear-gradient(135deg, rgba(232,197,85,0.35), rgba(139,107,255,0.32), rgba(197,205,224,0.3));
    border-color: var(--accent); color: #ffffff;
    box-shadow: 0 0 30px rgba(232,197,85,0.6), 0 0 60px rgba(139,107,255,0.4);
    font-weight: 700;
}

.vz-msg {
    max-width: 92%; padding: 14px 20px; border-radius: var(--radius-lg);
    font-size: 14px; line-height: 1.7; word-wrap: break-word;
    position: relative; animation: aaMsgIn 0.4s ease;
    box-shadow: 0 5px 22px rgba(0,0,0,0.4);
}
.vz-msg.user {
    align-self: flex-end;
    background: linear-gradient(135deg, rgba(232,197,85,0.3), rgba(139,107,255,0.22));
    border: 1px solid rgba(232,197,85,0.45);
    border-radius: var(--radius-lg) var(--radius-lg) 4px var(--radius-lg);
    color: #fff;
    box-shadow: 0 5px 30px rgba(232,197,85,0.35), inset 0 0 20px rgba(255,255,255,0.08);
}
.vz-msg.bot {
    align-self: flex-start;
    background: linear-gradient(135deg, rgba(197,205,224,0.14), rgba(110,224,255,0.12));
    border: 1px solid rgba(197,205,224,0.28);
    border-left: 3.5px solid var(--accent2);
    border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) 4px;
    color: #eaf2fa;
    box-shadow: 0 5px 30px rgba(197,205,224,0.22), inset 0 0 20px rgba(197,205,224,0.05);
}
.vz-role {
    font-size: 11.5px; font-weight: 700; color: var(--accent2);
    margin-bottom: 7px; letter-spacing: 0.6px; text-transform: uppercase;
}
.vz-msg.user .vz-role { color: var(--accent); text-align: right; }

.vz-mic-btn {
    width: 48px; height: 48px;
    background: linear-gradient(135deg, rgba(232,197,85,0.2), rgba(139,107,255,0.14));
    border: 1.5px solid rgba(232,197,85,0.5); border-radius: 50%;
    color: var(--accent); font-size: 19px; cursor: pointer;
    transition: all 0.3s ease; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; box-shadow: 0 0 22px rgba(232,197,85,0.3);
}
.vz-mic-btn:hover {
    background: rgba(232,197,85,0.4); border-color: var(--accent);
    box-shadow: 0 0 35px rgba(232,197,85,0.7), 0 0 70px rgba(139,107,255,0.4);
    transform: scale(1.12);
}
.vz-mic-btn.listening {
    background: linear-gradient(135deg, rgba(255,77,94,0.4), rgba(255,77,94,0.3));
    border-color: #ff4d5e; color: #ff4d5e;
    animation: micPulse 1.1s ease-in-out infinite;
    box-shadow: 0 0 40px rgba(255,77,94,0.8);
}

.vz-voice-chat-btn {
    width: 48px; height: 48px;
    background: linear-gradient(135deg, rgba(110,224,255,0.28), rgba(139,107,255,0.22));
    border: 1.5px solid rgba(110,224,255,0.6); border-radius: 50%;
    color: var(--ice); font-size: 19px; cursor: pointer;
    transition: all 0.3s ease; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; box-shadow: 0 0 22px rgba(110,224,255,0.4);
}
.vz-voice-chat-btn:hover {
    background: rgba(110,224,255,0.45); border-color: var(--ice); color: #fff;
    box-shadow: 0 0 42px rgba(110,224,255,0.9), 0 0 80px rgba(139,107,255,0.5);
    transform: scale(1.12);
}

.vz-send-btn {
    padding: 14px 26px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%; color: #06060b; border: none;
    border-radius: 26px; font-size: 14px; font-weight: 700;
    font-family: var(--font-body); cursor: pointer;
    box-shadow: 0 0 35px rgba(232,197,85,0.55), inset 0 0 20px rgba(255,255,255,0.14);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    flex-shrink: 0; white-space: nowrap;
    animation: btnGradientShift 5.5s ease infinite; letter-spacing: 0.6px;
}
.vz-send-btn:hover {
    transform: scale(1.07) translateY(-2px);
    box-shadow: 0 0 60px rgba(232,197,85,1), 0 0 110px rgba(139,107,255,0.7);
}
.vz-send-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; animation: none; }

.vizyon-al-chat {
    flex: 1; overflow-y: auto; overflow-x: hidden;
    padding: 20px 22px; display: flex; flex-direction: column; gap: 16px;
    scroll-behavior: smooth; background: rgba(0,0,0,0.3);
}
.vizyon-al-input-area {
    display: flex; gap: 10px; padding: 16px 20px;
    background: rgba(3,3,6,0.995);
    border-top: 1px solid rgba(232,197,85,0.32);
    align-items: flex-end; flex-shrink: 0; flex-wrap: wrap;
}
.vizyon-al-input-area textarea {
    flex: 1; min-width: 140px;
    background: linear-gradient(135deg, rgba(232,197,85,0.07), rgba(139,107,255,0.05));
    border: 1.5px solid rgba(232,197,85,0.4); color: #fff;
    padding: 14px 20px; border-radius: 26px; font-size: 14px;
    font-family: var(--font-body); resize: none; max-height: 140px;
    min-height: 48px; outline: none;
    transition: border-color 0.24s ease, box-shadow 0.24s ease; line-height: 1.55;
}
.vizyon-al-input-area textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232,197,85,0.55), inset 0 0 20px rgba(232,197,85,0.08);
}
.vizyon-al-input-area textarea::placeholder { color: var(--text4); }

.vizyon-al-responsibility {
    flex: 1; display: flex; flex-direction: column; align-items: center;
    justify-content: center; padding: 42px 30px; text-align: center;
    gap: 26px; position: relative; overflow-y: auto;
}
.vizyon-al-responsibility h3 {
    font-family: var(--font-display); font-size: 22px; color: var(--accent);
    margin-bottom: 12px; text-shadow: 0 0 28px rgba(232,197,85,0.55);
    letter-spacing: 0.55px;
}
.vizyon-al-responsibility p {
    font-size: 14px; color: var(--text2); line-height: 1.85; max-width: 430px;
}
.vizyon-al-modes {
    display: flex; gap: 7px; padding: 14px 16px;
    background: rgba(0,0,0,0.45);
    border-bottom: 1px solid rgba(232,197,85,0.22);
    flex-shrink: 0; flex-wrap: wrap; justify-content: center;
}
.vz-file-preview-box {
    display: none; align-items: center; gap: 15px;
    padding: 14px 18px;
    background: linear-gradient(135deg, rgba(232,197,85,0.12), rgba(139,107,255,0.1));
    border: 1px solid rgba(232,197,85,0.45);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
    flex-shrink: 0; margin-bottom: 0; position: relative;
}
.vz-file-preview-box.show { display: flex; }

/* Sesli sohbet fullscreen alias */
.vz-voice-fullscreen {
    position: fixed; inset: 0; z-index: 9999999;
    background: radial-gradient(ellipse at 50% 40%, #0f0f18 0%, #05050a 55%, #000 100%);
    display: none; flex-direction: column; align-items: center;
    justify-content: center; padding: 34px; overflow: hidden;
}
.vz-voice-fullscreen.open { display: flex; }
.vz-voice-fullscreen:not(.open) {
    display: none !important; visibility: hidden !important; pointer-events: none !important;
}
.vz-voice-logo {
    width: 165px; height: 165px; border-radius: 50%;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    display: flex; align-items: center; justify-content: center;
    font-size: 70px; position: relative; z-index: 2;
    animation: voiceLogoPulse 2.4s ease-in-out infinite, gradientMove 5.5s ease infinite;
    box-shadow: 0 0 85px rgba(232,197,85,0.85), 0 0 165px rgba(139,107,255,0.6);
    color: #fff;
}
.vz-voice-waves {
    display: flex; gap: 6px; margin-top: 38px;
    align-items: center; height: 48px; z-index: 2;
}
.vz-voice-waves span {
    width: 5px;
    background: linear-gradient(180deg, var(--accent), var(--platinum), var(--purple));
    border-radius: 4px; animation: voiceWave 1.4s ease-in-out infinite;
    box-shadow: 0 0 14px var(--accent);
}
.vz-voice-waves span:nth-child(1)  { animation-delay: 0s;    height: 18px; }
.vz-voice-waves span:nth-child(2)  { animation-delay: 0.1s;  height: 30px; }
.vz-voice-waves span:nth-child(3)  { animation-delay: 0.2s;  height: 42px; }
.vz-voice-waves span:nth-child(4)  { animation-delay: 0.3s;  height: 30px; }
.vz-voice-waves span:nth-child(5)  { animation-delay: 0.4s;  height: 18px; }
.vz-voice-waves span:nth-child(6)  { animation-delay: 0.5s;  height: 36px; }
.vz-voice-waves span:nth-child(7)  { animation-delay: 0.6s;  height: 24px; }
.vz-voice-waves span:nth-child(8)  { animation-delay: 0.7s;  height: 42px; }
.vz-voice-waves span:nth-child(9)  { animation-delay: 0.8s;  height: 18px; }
.vz-voice-transcript {
    margin-top: 40px; max-width: 780px; text-align: center;
    color: var(--text2); font-size: 17px; line-height: 1.8;
    padding: 0 24px; z-index: 2; min-height: 68px; letter-spacing: 0.38px;
}
.vz-voice-user-text { color: var(--accent); font-weight: 600; }
.vz-voice-ai-text { color: var(--accent2); font-weight: 500; }
.vz-voice-back-btn {
    position: fixed; top: 28px; right: 28px; padding: 14px 26px;
    background: linear-gradient(135deg, rgba(255,77,94,0.28), rgba(255,77,94,0.2));
    border: 1.5px solid rgba(255,77,94,0.6); color: #ff4d5e;
    border-radius: var(--radius-pill); font-size: 15px; font-weight: 700;
    font-family: var(--font-body); cursor: pointer; z-index: 3;
    display: flex; align-items: center; gap: 10px;
    transition: all 0.3s ease; letter-spacing: 0.55px;
}
.vz-voice-back-btn:hover {
    background: rgba(255,77,94,0.45); color: #fff;
    box-shadow: 0 0 42px rgba(255,77,94,0.9); transform: scale(1.07);
}
.vz-voice-status {
    position: fixed; top: 34px; left: 34px;
    display: flex; align-items: center; gap: 12px;
    padding: 12px 22px; background: rgba(0,0,0,0.6);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-radius: var(--radius-pill);
    border: 1px solid rgba(232,197,85,0.45);
    color: var(--accent); font-size: 14px; font-weight: 600;
    letter-spacing: 0.55px; z-index: 3;
}

/* Animasyon keyframes (CSS-1'de yoksa) */
@keyframes shieldPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.14); }
}
@keyframes voiceLogoPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.12); }
}
@keyframes voiceWave {
    0%, 100% { transform: scaleY(0.4); opacity: 0.6; }
    50%      { transform: scaleY(1.3); opacity: 1; }
}
@keyframes micPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.2); }
}
@keyframes aaMsgIn {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* [AETHRION] EDITOR PREVIEW — Luxury Gold cam efekt (YENİ)    */
/* ============================================================ */
.editor-preview {
    margin: 110px auto;
    max-width: 1160px;
    padding: 0 26px;
    position: relative;
    z-index: 10;
}

.editor-window {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.96), rgba(3, 3, 6, 0.98));
    border: 1.5px solid rgba(232, 197, 85, 0.32);
    border-radius: 28px;
    overflow: hidden;
    box-shadow:
        0 30px 95px rgba(0, 0, 0, 0.8),
        0 0 95px rgba(232, 197, 85, 0.22),
        0 0 190px rgba(139, 107, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(24px) saturate(170%);
    -webkit-backdrop-filter: blur(24px) saturate(170%);
    position: relative;
}

.editor-window::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        var(--nvidia),
        transparent
    );
    animation: editorGlow 5.5s ease-in-out infinite alternate;
    box-shadow: 0 0 25px var(--accent), 0 0 50px var(--purple-glow);
}

@keyframes editorGlow {
    0%   { opacity: 0.6; }
    100% { opacity: 1; }
}

.editor-titlebar {
    display: flex;
    align-items: center;
    padding: 18px 28px;
    background: linear-gradient(90deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.05));
    border-bottom: 1px solid rgba(232, 197, 85, 0.22);
    gap: 10px;
}

.editor-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    box-shadow: 0 0 12px currentColor;
}

.editor-dot.red    { background: #ff5f56; box-shadow: 0 0 14px rgba(255, 95, 86, 0.8); }
.editor-dot.yellow { background: #ffbd2e; box-shadow: 0 0 14px rgba(255, 189, 46, 0.8); }
.editor-dot.green  { background: #27c93f; box-shadow: 0 0 14px rgba(39, 201, 63, 0.8); }

.editor-filename {
    margin-left: auto;
    font-size: 13px;
    color: var(--text3);
    font-family: var(--font-code);
    letter-spacing: 0.6px;
}

.editor-body {
    padding: 38px 42px;
    font-family: var(--font-code);
    font-size: 14.5px;
    line-height: 1.95;
    overflow-x: auto;
}

.code-line {
    display: flex;
    gap: 28px;
}

.ln {
    color: var(--text4);
    min-width: 38px;
    text-align: right;
    user-select: none;
}

.code-line .kw  { color: var(--purple); font-weight: 600; }
.code-line .fn  { color: var(--accent2); font-weight: 600; }
.code-line .str { color: var(--accent3); }
.code-line .cm  { color: var(--text3); font-style: italic; }
.code-line .num { color: var(--gold); }

/* ============================================================ */
/* [AETHRION] FEATURES — Luxury kartlar (YENİ TASARIM)         */
/* ============================================================ */
.features {
    padding: 110px 52px;
    max-width: 1560px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.section-header {
    text-align: center;
    margin-bottom: 90px;
}

.section-tag {
    font-size: 13.5px;
    letter-spacing: 6px;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 22px;
    font-weight: 700;
    font-family: var(--font-code);
    text-shadow: 0 0 28px rgba(232, 197, 85, 0.7);
    position: relative;
    display: inline-block;
}

.section-tag::before,
.section-tag::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 55px;
    height: 1.5px;
    background: linear-gradient(90deg, transparent, var(--accent));
    box-shadow: 0 0 12px var(--accent);
}

.section-tag::before { right: 100%; margin-right: 18px; }
.section-tag::after  { left: 100%;  margin-left: 18px; background: linear-gradient(90deg, var(--accent), transparent); }

.section-title {
    font-family: var(--font-display);
    font-size: clamp(44px, 6.2vw, 66px);
    font-weight: 800;
    letter-spacing: -0.8px;
    line-height: 1.05;
}

.section-title .hl {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    background-size: 250% 250%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    text-shadow: 0 0 80px rgba(232, 197, 85, 0.55);
}

/* --- Features Grid --- */
.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1.5px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(139, 107, 255, 0.22), rgba(197, 205, 224, 0.18));
    border: 1.5px solid rgba(232, 197, 85, 0.25);
    border-radius: 36px;
    overflow: hidden;
    box-shadow:
        0 0 85px rgba(232, 197, 85, 0.14),
        0 0 170px rgba(139, 107, 255, 0.1),
        inset 0 0 85px rgba(232, 197, 85, 0.04);
    position: relative;
}

.feature-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    padding: 52px 46px;
    transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.feature-card::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(232, 197, 85, 0.18) 0%, transparent 42%);
    opacity: 0;
    transition: opacity 0.6s ease;
    pointer-events: none;
    transform: translate(var(--mx, 0), var(--my, 0));
}

.feature-card:hover::before {
    opacity: 1;
}

.feature-card:hover {
    background: linear-gradient(135deg, rgba(30, 30, 42, 0.99), rgba(18, 18, 26, 0.99));
    transform: translateY(-6px);
    z-index: 2;
    box-shadow:
        0 30px 60px rgba(0, 0, 0, 0.65),
        0 0 70px rgba(139, 107, 255, 0.15),
        inset 0 0 85px rgba(232, 197, 85, 0.09);
}

.feature-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--accent), var(--platinum), var(--purple), var(--ice), var(--gold), transparent);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.6s ease;
    box-shadow: 0 0 22px var(--accent), 0 0 42px var(--purple-glow);
}

.feature-card:hover::after {
    transform: scaleX(1);
}

.feature-icon {
    width: 74px;
    height: 74px;
    margin-bottom: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    border: 1.5px solid var(--border3);
    color: var(--accent);
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    box-shadow:
        0 0 28px rgba(232, 197, 85, 0.22),
        inset 0 0 20px rgba(232, 197, 85, 0.08);
    transition: all 0.45s ease;
    position: relative;
    overflow: hidden;
}

.feature-card:hover .feature-icon {
    transform: scale(1.12) rotate(-5deg);
    box-shadow:
        0 0 45px rgba(232, 197, 85, 0.7),
        0 0 90px rgba(139, 107, 255, 0.4),
        inset 0 0 28px rgba(232, 197, 85, 0.22);
    border-color: var(--accent);
}

.feature-icon::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 40%, rgba(255, 255, 255, 0.2) 50%, transparent 60%);
    transform: translateX(-100%);
    transition: transform 1s;
}

.feature-card:hover .feature-icon::after {
    transform: translateX(100%);
}

.feature-title {
    font-family: var(--font-display);
    font-size: 23px;
    font-weight: 700;
    margin-bottom: 16px;
    color: var(--text);
    letter-spacing: -0.35px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.feature-desc {
    font-size: 14px;
    line-height: 1.85;
    color: var(--text2);
    letter-spacing: 0.12px;
}

/* --- [AETHRION] Luxury YENİ Rozeti --- */
.feature-badge-new,
.new-badge {
    font-size: 10.5px;
    padding: 5px 14px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    background-size: 300% 300%;
    color: #06060b;
    font-weight: 800;
    letter-spacing: 1.3px;
    text-transform: uppercase;
    animation: btnGradientShift 4.5s ease infinite;
    box-shadow:
        0 0 22px rgba(232, 197, 85, 0.8),
        0 0 45px rgba(139, 107, 255, 0.45),
        inset 0 0 12px rgba(255, 255, 255, 0.2);
    position: relative;
    overflow: hidden;
    vertical-align: middle;
}

.feature-badge-new::after,
.new-badge::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7), transparent);
    animation: newBadgeShine 2.8s linear infinite;
}

@keyframes newBadgeShine {
    0%   { left: -100%; }
    100% { left: 200%; }
}

/* --- Moderatör kart özel --- */
.feature-card.moderator-card {
    border-left: 4px solid var(--moderator);
    box-shadow: inset 6px 0 30px rgba(232, 197, 85, 0.12);
}

.feature-card.moderator-card .feature-icon {
    border-color: var(--moderator);
    color: var(--moderator);
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.6),
        inset 0 0 22px rgba(232, 197, 85, 0.14);
}

/* --- Aethrion Al kart özel --- */
.feature-card.aethrion-al-card {
    border-left: 4px solid var(--purple);
    box-shadow: inset 6px 0 30px rgba(139, 107, 255, 0.12);
}

.feature-card.aethrion-al-card .feature-icon {
    border-color: var(--purple);
    color: var(--purple);
    box-shadow:
        0 0 35px rgba(139, 107, 255, 0.6),
        inset 0 0 22px rgba(139, 107, 255, 0.14);
}

/* --- [AETHRION] NVIDIA NIM kart özel --- */
.feature-card.nvidia-card {
    border-left: 4px solid var(--nvidia);
    box-shadow: inset 6px 0 30px rgba(118, 185, 0, 0.12);
}

.feature-card.nvidia-card .feature-icon {
    border-color: var(--nvidia);
    color: var(--nvidia);
    box-shadow:
        0 0 35px rgba(118, 185, 0, 0.6),
        inset 0 0 22px rgba(118, 185, 0, 0.14);
}

/* --- [AETHRION] Quantum kart özel --- */
.feature-card.quantum-card {
    border-left: 4px solid var(--quantum);
    box-shadow: inset 6px 0 30px rgba(139, 107, 255, 0.14);
}

.feature-card.quantum-card .feature-icon {
    border-color: var(--quantum);
    color: var(--quantum);
    box-shadow:
        0 0 35px rgba(139, 107, 255, 0.6),
        inset 0 0 22px rgba(139, 107, 255, 0.14);
}

/* ============================================================ */
/* [AETHRION] AI SHOWCASE — 28 model + gradient border          */
/* ============================================================ */
.ai-section {
    padding: 110px 52px;
    max-width: 1560px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.ai-showcase {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5px;
    background: linear-gradient(
        135deg,
        rgba(232, 197, 85, 0.32) 0%,
        rgba(139, 107, 255, 0.28) 25%,
        rgba(197, 205, 224, 0.24) 50%,
        rgba(110, 224, 255, 0.24) 75%,
        rgba(118, 185, 0, 0.24) 100%
    );
    border: 1.5px solid rgba(232, 197, 85, 0.25);
    border-radius: 36px;
    overflow: hidden;
    box-shadow:
        0 0 95px rgba(232, 197, 85, 0.18),
        0 0 190px rgba(139, 107, 255, 0.12),
        inset 0 0 95px rgba(232, 197, 85, 0.04);
}

.ai-left {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    padding: 66px;
    position: relative;
}

.ai-right {
    background: linear-gradient(135deg, rgba(30, 30, 42, 0.97), rgba(18, 18, 26, 0.99));
    padding: 66px;
    position: relative;
}

.ai-title {
    font-family: var(--font-display);
    font-size: clamp(38px, 4.6vw, 54px);
    font-weight: 800;
    margin-bottom: 28px;
    line-height: 1.05;
    letter-spacing: -0.8px;
}

.ai-title em {
    background: linear-gradient(135deg, var(--accent2), var(--accent), var(--platinum));
    background-size: 250% 250%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-style: normal;
    animation: gradientMove 5.5s ease infinite;
    text-shadow: 0 0 60px rgba(197, 205, 224, 0.6);
}

.ai-desc {
    font-size: 15px;
    line-height: 1.95;
    color: var(--text2);
    margin-bottom: 42px;
    letter-spacing: 0.12px;
}

.model-row {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-bottom: 42px;
}

.mbadge {
    padding: 11px 24px;
    font-size: 12.5px;
    font-weight: 600;
    text-transform: uppercase;
    border: 1.5px solid;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: all 0.3s ease;
    letter-spacing: 0.6px;
    position: relative;
    overflow: hidden;
}

.mbadge::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.14), transparent);
    transform: translateX(-100%);
    transition: transform 0.75s;
}

.mbadge:hover::before {
    transform: translateX(100%);
}

.mbadge:hover {
    transform: scale(1.1) translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}

.mbadge.a {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(232, 197, 85, 0.12);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.25);
}

.mbadge.a:hover {
    box-shadow: 0 0 42px rgba(232, 197, 85, 0.8), 0 0 80px var(--purple-glow);
    background: rgba(232, 197, 85, 0.22);
}

.mbadge.b {
    border-color: var(--accent2);
    color: var(--accent2);
    background: rgba(197, 205, 224, 0.12);
    box-shadow: 0 0 22px rgba(197, 205, 224, 0.25);
}

.mbadge.b:hover {
    box-shadow: 0 0 42px rgba(197, 205, 224, 0.8), 0 0 80px rgba(197, 205, 224, 0.45);
    background: rgba(197, 205, 224, 0.22);
}

.mbadge.c {
    border-color: var(--purple);
    color: var(--purple);
    background: rgba(139, 107, 255, 0.12);
    box-shadow: 0 0 22px rgba(139, 107, 255, 0.25);
}

.mbadge.c:hover {
    box-shadow: 0 0 42px rgba(139, 107, 255, 0.8), 0 0 80px var(--purple-glow);
    background: rgba(139, 107, 255, 0.22);
}

.ai-chat-msg {
    padding: 26px;
    border-left: 3.5px solid;
    font-size: 14px;
    line-height: 1.85;
    background: rgba(0, 0, 0, 0.45);
    border-radius: var(--radius-md);
    margin-bottom: 20px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.ai-chat-msg.user {
    border-color: var(--text3);
    color: var(--text2);
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.4);
}

.ai-chat-msg.bot {
    border-color: var(--accent);
    color: var(--text);
    box-shadow:
        inset 0 0 30px rgba(232, 197, 85, 0.08),
        0 0 35px rgba(232, 197, 85, 0.15),
        0 0 70px rgba(139, 107, 255, 0.1);
}

.ai-chat-code {
    background: rgba(232, 197, 85, 0.1);
    border: 1px solid rgba(232, 197, 85, 0.28);
    padding: 18px 22px;
    margin-top: 18px;
    font-size: 13px;
    color: var(--accent2);
    white-space: pre-wrap;
    overflow-x: auto;
    border-radius: 14px;
    font-family: var(--font-code);
    box-shadow: inset 0 0 25px rgba(232, 197, 85, 0.08);
}

/* ============================================================ */
/* [AETHRION] 28 MODEL SHOWCASE GRID                            */
/* ============================================================ */
.model-showcase-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(195px, 1fr));
    gap: 16px;
    margin-top: 34px;
    padding: 24px;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.65), rgba(8, 8, 12, 0.75));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    box-shadow: inset 0 0 45px rgba(232, 197, 85, 0.04);
}

.model-mini-card {
    padding: 16px 18px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.08), rgba(139, 107, 255, 0.05));
    border: 1px solid var(--border2);
    border-radius: var(--radius-md);
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.model-mini-card:hover {
    border-color: var(--accent);
    transform: translateY(-4px);
    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.45),
        0 0 35px rgba(232, 197, 85, 0.35);
}

.model-mini-card.nvidia-card-mini:hover {
    border-color: var(--nvidia);
    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.45),
        0 0 35px rgba(118, 185, 0, 0.45);
}

.model-mini-icon {
    font-size: 24px;
    margin-bottom: 7px;
    display: block;
}

.model-mini-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    word-break: break-word;
    line-height: 1.3;
}

.model-mini-provider {
    font-size: 11px;
    color: var(--text3);
    margin-top: 4px;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    font-weight: 600;
}

.model-mini-badge {
    position: absolute;
    top: 9px;
    right: 9px;
    font-size: 9px;
    padding: 3px 8px;
    border-radius: 9px;
    font-weight: 800;
    letter-spacing: 0.9px;
    text-transform: uppercase;
}

.model-mini-badge.nvidia {
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.35), rgba(118, 185, 0, 0.18));
    border: 1px solid var(--nvidia);
    color: var(--nvidia);
    box-shadow: 0 0 14px rgba(118, 185, 0, 0.55);
}

.model-mini-badge.ollama {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.35), rgba(232, 197, 85, 0.18));
    border: 1px solid var(--accent);
    color: var(--accent);
    box-shadow: 0 0 14px rgba(232, 197, 85, 0.55);
}

.model-mini-badge.cloud {
    background: linear-gradient(135deg, rgba(139, 107, 255, 0.35), rgba(139, 107, 255, 0.18));
    border: 1px solid var(--purple);
    color: var(--purple);
    box-shadow: 0 0 14px rgba(139, 107, 255, 0.55);
}

/* ============================================================ */
/* [AETHRION] TECH STACK — Neon luxury orbit                    */
/* ============================================================ */
.tech-section {
    padding: 68px 52px;
    border-top: 1px solid rgba(232, 197, 85, 0.22);
    border-bottom: 1px solid rgba(232, 197, 85, 0.22);
    overflow: hidden;
    position: relative;
    z-index: 10;
    background: linear-gradient(90deg, rgba(232, 197, 85, 0.035), rgba(139, 107, 255, 0.035), rgba(197, 205, 224, 0.035));
}

.tech-section::before,
.tech-section::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 150px;
    z-index: 2;
    pointer-events: none;
}

.tech-section::before {
    left: 0;
    background: linear-gradient(90deg, var(--bg), transparent);
}

.tech-section::after {
    right: 0;
    background: linear-gradient(90deg, transparent, var(--bg));
}

.tech-scroll {
    display: flex;
    gap: 48px;
    animation: scrollLeft 36s linear infinite;
    white-space: nowrap;
}

.tech-scroll:hover {
    animation-play-state: paused;
}

@keyframes scrollLeft {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

.tech-item {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 17px 32px;
    border: 1.5px solid var(--border3);
    color: var(--text3);
    font-size: 14px;
    text-transform: uppercase;
    white-space: nowrap;
    border-radius: var(--radius-pill);
    transition: all 0.3s ease;
    letter-spacing: 1.2px;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.4);
    position: relative;
    overflow: hidden;
}

.tech-item::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.15), rgba(139, 107, 255, 0.12), rgba(197, 205, 224, 0.1));
    opacity: 0;
    transition: opacity 0.4s;
}

.tech-item:hover::before {
    opacity: 1;
}

.tech-item:hover {
    border-color: var(--accent);
    color: var(--accent);
    transform: translateY(-5px) scale(1.06);
    box-shadow:
        0 12px 40px rgba(232, 197, 85, 0.4),
        0 0 70px var(--purple-glow),
        inset 0 0 28px rgba(232, 197, 85, 0.15);
    text-shadow: 0 0 22px rgba(232, 197, 85, 0.8);
}

.tech-item i {
    font-size: 17px;
    color: var(--accent);
    transition: all 0.3s;
}

.tech-item:hover i {
    transform: rotate(20deg) scale(1.22);
    color: var(--accent2);
}

/* ============================================================ */
/* [AETHRION] PRICING — Featured kart luxury gold               */
/* ============================================================ */
.pricing {
    padding: 110px 52px;
    max-width: 1560px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5px;
    background: linear-gradient(
        135deg,
        rgba(232, 197, 85, 0.32) 0%,
        rgba(139, 107, 255, 0.28) 33%,
        rgba(197, 205, 224, 0.24) 66%,
        rgba(110, 224, 255, 0.24) 100%
    );
    border: 1.5px solid rgba(232, 197, 85, 0.25);
    border-radius: 36px;
    overflow: hidden;
    box-shadow:
        0 0 95px rgba(232, 197, 85, 0.18),
        0 0 190px rgba(139, 107, 255, 0.12),
        inset 0 0 95px rgba(232, 197, 85, 0.04);
    position: relative;
}

.price-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    padding: 55px 46px;
    position: relative;
    transition: all 0.45s ease;
    overflow: hidden;
}

.price-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 0%, rgba(232, 197, 85, 0.12) 0%, transparent 62%);
    opacity: 0;
    transition: opacity 0.5s;
    pointer-events: none;
}

.price-card:hover::before {
    opacity: 1;
}

.price-card:hover {
    transform: translateY(-10px);
    z-index: 2;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.7);
}

.price-card.featured {
    background: linear-gradient(135deg, rgba(30, 30, 42, 0.99), rgba(18, 18, 26, 0.99));
    outline: 2.5px solid var(--accent);
    outline-offset: -2.5px;
    position: relative;
    animation: featuredPulse 5.5s ease-in-out infinite;
}

@keyframes featuredPulse {
    0%, 100% {
        box-shadow:
            inset 0 0 85px rgba(232, 197, 85, 0.12),
            0 0 60px rgba(232, 197, 85, 0.35),
            0 0 120px rgba(139, 107, 255, 0.18);
    }
    50% {
        box-shadow:
            inset 0 0 140px rgba(232, 197, 85, 0.22),
            0 0 105px rgba(232, 197, 85, 0.7),
            0 0 210px rgba(139, 107, 255, 0.4);
    }
}

.price-card.featured::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(135deg, transparent 30%, rgba(232, 197, 85, 0.1) 50%, transparent 70%);
    background-size: 200% 200%;
    animation: featuredShine 5.5s ease-in-out infinite;
}

@keyframes featuredShine {
    0%   { background-position: 200% 200%; }
    100% { background-position: -200% -200%; }
}

.price-tier {
    font-size: 13.5px;
    letter-spacing: 5px;
    text-transform: uppercase;
    color: var(--text3);
    margin-bottom: 22px;
    font-weight: 700;
    font-family: var(--font-code);
}

.price-amount {
    font-family: var(--font-display);
    font-size: 64px;
    font-weight: 800;
    letter-spacing: -2.5px;
    background: linear-gradient(135deg, #ffffff, #c5cde0);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    line-height: 1;
    text-shadow: 0 0 60px rgba(255, 255, 255, 0.22);
}

.price-card.featured .price-amount {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    background-size: 250% 250%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
}

.price-amount span {
    font-size: 19px;
    color: var(--text3);
    letter-spacing: 0;
    font-weight: 500;
}

.price-features {
    list-style: none;
    margin: 36px 0;
}

.price-features li {
    padding: 12px 0;
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 14px;
    color: var(--text2);
    line-height: 1.6;
    border-bottom: 1px solid rgba(232, 197, 85, 0.08);
    transition: color 0.24s, padding-left 0.24s;
}

.price-features li:hover {
    color: var(--text);
    padding-left: 5px;
}

.price-features li::before {
    content: "▸";
    color: var(--accent2);
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
    text-shadow: 0 0 14px rgba(197, 205, 224, 0.8);
}

/* Koç satırı */
.price-features li.koc-line::before {
    content: "🧭";
    font-size: 15px;
    color: var(--accent);
    text-shadow: 0 0 14px rgba(232, 197, 85, 0.8);
}

.price-features li.koc-line strong {
    color: var(--accent);
    font-weight: 700;
}

/* A27 API satırı */
.price-features li.a27-line::before,
.price-features li.A27-line::before {
    content: "🔑";
    font-size: 15px;
    color: var(--gold);
    text-shadow: 0 0 14px rgba(232, 197, 85, 0.8);
}

.price-features li.a27-line strong,
.price-features li.A27-line strong {
    color: var(--gold);
    font-weight: 700;
}

/* Aethrion Al satırı */
.price-features li.aethrion-al-line::before,
.price-features li.vizyon-al-line::before {
    content: "✨";
    font-size: 15px;
    color: var(--purple);
    text-shadow: 0 0 14px rgba(139, 107, 255, 0.8);
}

.price-features li.aethrion-al-line strong,
.price-features li.vizyon-al-line strong {
    color: var(--purple);
    font-weight: 700;
}

/* NVIDIA NIM satırı */
.price-features li.nvidia-line::before {
    content: "🟢";
    font-size: 15px;
    color: var(--nvidia);
    text-shadow: 0 0 14px rgba(118, 185, 0, 0.8);
}

.price-features li.nvidia-line strong {
    color: var(--nvidia);
    font-weight: 700;
}

/* 28 Model satırı */
.price-features li.model28-line::before {
    content: "🧠";
    font-size: 15px;
    color: var(--quantum);
    text-shadow: 0 0 14px rgba(139, 107, 255, 0.8);
}

.price-features li.model28-line strong {
    color: var(--quantum);
    font-weight: 700;
}

.price-badge {
    position: absolute;
    top: -17px;
    right: 30px;
    padding: 8px 22px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    background-size: 250% 250%;
    color: #06060b;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 800;
    border-radius: var(--radius-pill);
    letter-spacing: 2px;
    animation: btnGradientShift 4.5s ease infinite;
    box-shadow:
        0 6px 30px rgba(232, 197, 85, 0.8),
        0 0 60px rgba(139, 107, 255, 0.45),
        inset 0 0 14px rgba(255, 255, 255, 0.2);
    z-index: 3;
    white-space: nowrap;
}

/* ============================================================ */
/* [AETHRION] MODERATÖR RÜTBESİ BİLGİ KARTI                    */
/* ============================================================ */
.moderator-info-card {
    max-width: 1080px;
    margin: 60px auto 0;
    padding: 40px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(245, 216, 120, 0.06));
    border: 2.5px solid var(--moderator);
    border-radius: var(--radius-xl);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 0.35),
        0 0 120px rgba(245, 216, 120, 0.18),
        inset 0 0 60px rgba(232, 197, 85, 0.08);
    position: relative;
    overflow: hidden;
}

.moderator-info-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--moderator), transparent);
    animation: moderatorShine 4.5s linear infinite;
}

@keyframes moderatorShine {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.moderator-info-card h3 {
    color: var(--moderator);
    text-align: center;
    font-size: 26px;
    margin-bottom: 18px;
    text-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
    font-family: var(--font-display);
}

.moderator-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 18px;
    font-size: 13.5px;
    color: var(--text2);
    margin-top: 24px;
}

.moderator-info-grid > div {
    background: rgba(0, 0, 0, 0.4);
    padding: 18px 20px;
    border-radius: var(--radius-md);
    border-left: 3.5px solid var(--moderator);
    transition: all 0.3s ease;
}

.moderator-info-grid > div:hover {
    background: rgba(232, 197, 85, 0.12);
    transform: translateY(-4px);
    box-shadow: 0 12px 35px rgba(232, 197, 85, 0.3);
}

/* ============================================================ */
/* [AETHRION] NVIDIA NIM BİLGİ KARTI                            */
/* ============================================================ */
.nvidia-info-card {
    max-width: 1080px;
    margin: 60px auto 0;
    padding: 40px;
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.12), rgba(118, 185, 0, 0.05));
    border: 2.5px solid var(--nvidia);
    border-radius: var(--radius-xl);
    box-shadow:
        0 0 60px rgba(118, 185, 0, 0.35),
        0 0 120px rgba(118, 185, 0, 0.18),
        inset 0 0 60px rgba(118, 185, 0, 0.08);
    position: relative;
    overflow: hidden;
}

.nvidia-info-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--nvidia), transparent);
    animation: moderatorShine 4.5s linear infinite;
}

.nvidia-info-card h3 {
    color: var(--nvidia);
    text-align: center;
    font-size: 26px;
    margin-bottom: 18px;
    text-shadow: 0 0 30px rgba(118, 185, 0, 0.6);
    font-family: var(--font-display);
}

/* ============================================================ */
/* [AETHRION] FOOTER — Aurora 8 renk üst çizgi                  */
/* ============================================================ */
footer {
    border-top: 1px solid rgba(232, 197, 85, 0.22);
    padding: 90px 52px 52px;
    background: linear-gradient(180deg, var(--bg2), var(--bg));
    position: relative;
    z-index: 10;
}

footer::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--accent) 14%,
        var(--accent2) 28%,
        var(--purple) 42%,
        var(--ice) 56%,
        var(--platinum) 70%,
        var(--gold) 84%,
        var(--nvidia) 100%
    );
    opacity: 0.8;
    animation: footerGlow 6.5s ease-in-out infinite alternate;
    box-shadow: 0 0 35px var(--accent), 0 0 70px var(--purple-glow);
}

@keyframes footerGlow {
    0%   { opacity: 0.5; }
    100% { opacity: 1; }
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 58px;
    max-width: 1560px;
    margin: 0 auto 58px;
}

.footer-col h4 {
    font-size: 13.5px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--text3);
    margin-bottom: 26px;
    font-weight: 700;
    position: relative;
    padding-bottom: 14px;
}

.footer-col h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 38px;
    height: 2.5px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), transparent);
    border-radius: 3px;
    box-shadow: 0 0 14px var(--accent);
}

.footer-col ul {
    list-style: none;
}

.footer-col li {
    margin-bottom: 14px;
}

.footer-col a {
    color: var(--text2);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.24s ease;
    cursor: pointer;
    position: relative;
    padding-left: 0;
    display: inline-block;
}

.footer-col a::before {
    content: '→';
    position: absolute;
    left: -20px;
    opacity: 0;
    transition: all 0.24s;
    color: var(--accent);
}

.footer-col a:hover {
    color: var(--accent);
    padding-left: 20px;
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.7);
}

.footer-col a:hover::before {
    opacity: 1;
    left: 0;
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 45px;
    border-top: 1px solid rgba(232, 197, 85, 0.15);
    max-width: 1560px;
    margin: 0 auto;
    flex-wrap: wrap;
    gap: 22px;
}

.footer-copy {
    font-size: 13px;
    color: var(--text3);
    letter-spacing: 0.38px;
}

.footer-copy span {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 700;
}

.badge {
    padding: 9px 20px;
    font-size: 11px;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    border: 1px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    font-weight: 600;
    transition: all 0.3s;
}

.badge:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45);
}

.badge.live {
    border-color: var(--accent2);
    color: var(--accent2);
    box-shadow: 0 0 22px rgba(197, 205, 224, 0.4);
    position: relative;
    padding-left: 26px;
}

.badge.live::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 18px var(--accent2);
    animation: badgeLivePulse 1.7s ease-in-out infinite;
}

@keyframes badgeLivePulse {
    0%, 100% { opacity: 1; transform: translateY(-50%) scale(1); }
    50%      { opacity: 0.5; transform: translateY(-50%) scale(0.75); }
}

.support-footer {
    text-align: center;
    margin-top: 45px;
}

.support-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 14px 30px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(139, 107, 255, 0.1));
    border: 1.5px solid var(--accent);
    border-radius: var(--radius-pill);
    color: var(--accent);
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.55px;
    position: relative;
    overflow: hidden;
}

.support-link::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(232, 197, 85, 0.25), transparent);
    transform: translateX(-100%);
    transition: transform 0.8s;
}

.support-link:hover::before {
    transform: translateX(100%);
}

.support-link:hover {
    background: var(--accent);
    color: #06060b;
    box-shadow:
        0 0 40px rgba(232, 197, 85, 0.9),
        0 0 80px rgba(139, 107, 255, 0.55);
    transform: translateY(-3px);
}

/* ============================================================ */
/* TOPLULUK KURALLARI FOOTER                                    */
/* ============================================================ */
.community-rules-footer {
    width: 100%;
    background: linear-gradient(90deg, #16161f, #1f2937, #16161f);
    color: #a0a0b8;
    text-align: center;
    padding: 18px 24px;
    font-size: 12.5px;
    border-top: 1px solid rgba(232, 197, 85, 0.14);
    margin-top: 28px;
    line-height: 1.75;
    font-family: var(--font-body);
    letter-spacing: 0.38px;
    box-shadow: inset 0 1px 0 rgba(232, 197, 85, 0.12);
}

.community-rules-footer strong {
    color: #f0f0f8;
    font-weight: 700;
}

/* ============================================================ */
/* [AETHRION] TABLET UYUMLULUĞU (max-width: 768px)             */
/* ============================================================ */
@media (max-width: 768px) {
    .editor-preview { margin: 55px auto; padding: 0 18px; }
    .editor-body { padding: 26px 22px; font-size: 13px; line-height: 1.8; }
    .code-line { gap: 16px; }
    .ln { min-width: 27px; font-size: 11.5px; }
    .editor-titlebar { padding: 11px 17px; }
    .editor-filename { font-size: 11px; }

    .features { padding: 65px 22px; }
    .section-header { margin-bottom: 52px; }
    .section-tag { font-size: 11px; letter-spacing: 4px; }
    .section-tag::before,
    .section-tag::after { width: 28px; }
    .section-title { font-size: clamp(30px, 6.5vw, 40px); }

    .features-grid {
        grid-template-columns: 1fr;
        border-radius: 24px;
    }
    .feature-card { padding: 30px 26px; }
    .feature-icon { width: 58px; height: 58px; font-size: 27px; margin-bottom: 20px; }
    .feature-title { font-size: 20px; }
    .feature-desc { font-size: 13px; }

    .ai-section { padding: 65px 22px; }
    .ai-showcase {
        grid-template-columns: 1fr;
        border-radius: 24px;
    }
    .ai-left, .ai-right { padding: 30px 26px; }
    .ai-title { font-size: clamp(28px, 5.5vw, 38px); }
    .ai-desc { font-size: 14px; margin-bottom: 26px; }
    .model-row { gap: 9px; margin-bottom: 26px; }
    .mbadge { padding: 9px 17px; font-size: 11px; }
    .ai-chat-msg { padding: 19px; font-size: 13px; }
    .ai-chat-code { font-size: 12px; padding: 14px 16px; }

    .model-showcase-grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 11px;
        padding: 16px;
    }
    .model-mini-card { padding: 13px 15px; }
    .model-mini-icon { font-size: 21px; }
    .model-mini-name { font-size: 12px; }
    .model-mini-provider { font-size: 10px; }

    .tech-section { padding: 38px 22px; }
    .tech-scroll { gap: 26px; }
    .tech-item {
        padding: 13px 22px;
        font-size: 12px;
        gap: 9px;
    }

    .pricing { padding: 65px 22px; }
    .pricing-grid {
        grid-template-columns: 1fr;
        border-radius: 24px;
    }
    .price-card { padding: 32px 28px; }
    .price-amount { font-size: 50px; }
    .price-tier { font-size: 11.5px; }
    .price-features li { font-size: 13px; padding: 10px 0; }
    .btn-price { font-size: 13px; padding: 15px; }
    .price-badge { font-size: 10px; padding: 6px 17px; top: -14px; right: 24px; }

    .moderator-info-card { padding: 28px 24px; margin-top: 44px; }
    .moderator-info-card h3 { font-size: 22px; }
    .moderator-info-grid { grid-template-columns: 1fr 1fr; font-size: 13px; }

    .nvidia-info-card { padding: 28px 24px; margin-top: 44px; }
    .nvidia-info-card h3 { font-size: 22px; }

    footer { padding: 52px 22px 32px; }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 38px;
        margin-bottom: 44px;
    }
    .footer-brand {
        grid-column: 1 / -1;
        text-align: center;
    }
    .footer-brand .logo-text { font-size: 25px !important; }
    .footer-brand p { font-size: 13px !important; }
    .footer-col h4 { font-size: 12px; margin-bottom: 17px; }
    .footer-col a { font-size: 13px; }
    .footer-bottom {
        flex-direction: column;
        gap: 22px;
        text-align: center;
        padding-top: 32px;
    }
    .footer-copy { font-size: 12px; }
    .footer-badges {
        justify-content: center !important;
        width: 100%;
    }
    .footer-badges .support-link {
        padding: 12px 22px !important;
        font-size: 12.5px !important;
    }
    .community-rules-footer {
        font-size: 11.5px;
        padding: 13px 20px;
        line-height: 1.65;
    }
}

/* ============================================================ */
/* [AETHRION] TELEFON UYUMLULUĞU (max-width: 480px)            */
/* ============================================================ */
@media (max-width: 480px) {
    .editor-preview { margin: 30px auto !important; padding: 0 10px !important; }
    .editor-window { border-radius: 18px !important; }
    .editor-titlebar { padding: 9px 14px !important; gap: 6px !important; }
    .editor-dot { width: 11px !important; height: 11px !important; }
    .editor-filename { font-size: 10px !important; }
    .editor-body { padding: 18px 14px !important; font-size: 11.5px !important; line-height: 1.75 !important; }
    .code-line { gap: 10px !important; }
    .ln { min-width: 20px !important; font-size: 10px !important; }

    .features { padding: 40px 12px !important; }
    .section-header { margin-bottom: 30px !important; }
    .section-tag { font-size: 10px !important; letter-spacing: 3px !important; }
    .section-tag::before,
    .section-tag::after { display: none; }
    .section-title { font-size: 27px !important; line-height: 1.25 !important; }
    .features-grid { border-radius: 20px !important; }
    .feature-card { padding: 22px 19px !important; }
    .feature-icon {
        width: 48px !important;
        height: 48px !important;
        font-size: 23px !important;
        margin-bottom: 15px !important;
        border-radius: 14px !important;
    }
    .feature-title { font-size: 17px !important; margin-bottom: 10px !important; }
    .feature-desc { font-size: 12.5px !important; line-height: 1.72 !important; }
    .feature-badge-new,
    .new-badge { font-size: 9px !important; padding: 4px 10px !important; }

    .ai-section { padding: 40px 12px !important; }
    .ai-showcase { border-radius: 20px !important; }
    .ai-left, .ai-right { padding: 22px 18px !important; }
    .ai-title { font-size: 24px !important; margin-bottom: 17px !important; }
    .ai-desc { font-size: 12.5px !important; line-height: 1.72 !important; margin-bottom: 20px !important; }
    .model-row { gap: 6px !important; margin-bottom: 20px !important; }
    .mbadge { font-size: 9.5px !important; padding: 7px 12px !important; letter-spacing: 0.4px !important; }
    .ai-chat-msg { padding: 14px 16px !important; font-size: 12.5px !important; border-radius: 14px !important; margin-bottom: 14px !important; }
    .ai-chat-code { font-size: 11px !important; padding: 11px 14px !important; border-radius: 10px !important; }

    .model-showcase-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 9px !important;
        padding: 12px;
    }
    .model-mini-card { padding: 10px 12px; }
    .model-mini-icon { font-size: 19px; }
    .model-mini-name { font-size: 11px; }
    .model-mini-provider { font-size: 9.5px; }
    .model-mini-badge { font-size: 8px; padding: 2px 6px; }

    .tech-section { padding: 26px 12px !important; }
    .tech-scroll { gap: 17px !important; }
    .tech-item {
        padding: 9px 15px !important;
        font-size: 10.5px !important;
        gap: 6px !important;
    }
    .tech-item i { font-size: 13px !important; }

    .pricing { padding: 40px 12px !important; }
    .pricing-grid { border-radius: 20px !important; }
    .price-card { padding: 24px 19px !important; }
    .price-tier { font-size: 10.5px !important; letter-spacing: 3px !important; }
    .price-amount { font-size: 38px !important; }
    .price-amount span { font-size: 15px !important; }
    .price-features { margin: 20px 0 !important; }
    .price-features li { font-size: 12.5px !important; padding: 8px 0 !important; }
    .btn-price { font-size: 12.5px !important; padding: 13px !important; border-radius: 34px !important; }
    .price-badge { font-size: 9px !important; padding: 5px 13px !important; top: -11px !important; right: 17px !important; }

    .moderator-info-card { padding: 22px 18px; margin-top: 30px; border-radius: 22px; }
    .moderator-info-card h3 { font-size: 19px; }
    .moderator-info-grid { grid-template-columns: 1fr; font-size: 12.5px; gap: 12px; }
    .moderator-info-grid > div { padding: 13px 15px; }

    .nvidia-info-card { padding: 22px 18px; margin-top: 30px; border-radius: 22px; }
    .nvidia-info-card h3 { font-size: 19px; }

    footer { padding: 40px 16px 26px !important; }
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 26px !important;
        margin-bottom: 30px !important;
    }
    .footer-brand {
        grid-column: 1 !important;
        text-align: center !important;
    }
    .footer-brand .logo-text { font-size: 21px !important; }
    .footer-brand p { font-size: 12.5px !important; margin-top: 9px !important; }
    .footer-col {
        text-align: center !important;
    }
    .footer-col h4 {
        font-size: 11px !important;
        margin-bottom: 14px !important;
        letter-spacing: 2.1px !important;
    }
    .footer-col h4::after {
        left: 50%;
        transform: translateX(-50%);
    }
    .footer-col li { margin-bottom: 9px !important; }
    .footer-col a { font-size: 13px !important; }
    .footer-col a::before { display: none; }
    .footer-col a:hover { padding-left: 0; }

    .footer-bottom {
        flex-direction: column !important;
        gap: 18px !important;
        text-align: center !important;
        padding-top: 24px !important;
    }
    .footer-copy {
        font-size: 11.5px !important;
        line-height: 1.65 !important;
    }
    .badge { font-size: 9px !important; padding: 7px 14px !important; }

    .footer-badges {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 11px !important;
        width: 100% !important;
    }
    .footer-badges .support-link,
    .footer-badges .btn-secondary {
        width: 100% !important;
        justify-content: center !important;
        padding: 13px 18px !important;
        font-size: 12.5px !important;
        text-align: center !important;
        margin: 0 !important;
    }

    footer > div[style*="text-align:center"] {
        font-size: 11.5px !important;
        margin-top: 17px !important;
    }

    .community-rules-footer {
        font-size: 11px !important;
        padding: 13px 16px !important;
        line-height: 1.65 !important;
        letter-spacing: 0.28px !important;
    }
}

/* ============================================================ */
/* [AETHRION] ÇOK KÜÇÜK EKRANLAR (max-width: 360px)            */
/* ============================================================ */
@media (max-width: 360px) {
    .section-title { font-size: 24px !important; }
    .ai-title { font-size: 22px !important; }
    .price-amount { font-size: 34px !important; }
    .feature-title { font-size: 16px !important; }
    .footer-brand .logo-text { font-size: 19px !important; }
    .footer-col a { font-size: 12px !important; }
    .footer-badges .support-link,
    .footer-badges .btn-secondary {
        font-size: 11.5px !important;
        padding: 11px 14px !important;
    }
    .moderator-info-card h3 { font-size: 17px; }
    .nvidia-info-card h3 { font-size: 17px; }
    .model-showcase-grid { grid-template-columns: 1fr !important; }
}


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* DASHBOARD SCROLL FIX                                          */
/* ============================================================ */
html.dashboard-open,
body.dashboard-open {
    overflow: hidden !important;
    height: 100vh !important;
    max-height: 100vh !important;
    overscroll-behavior: none !important;
}

@media (min-width: 769px) {
    html:not(.dashboard-open) { scrollbar-gutter: stable; }
    body:not(.dashboard-open) { scrollbar-gutter: stable; }
    html.dashboard-open,
    body.dashboard-open { scrollbar-gutter: auto !important; }
}

body.dashboard-open .ai-widget,
body.dashboard-open .ai-widget-btn,
body.dashboard-open .ai-panel {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.dashboard-open .comments-track,
body.dashboard-open .tech-scroll {
    animation-play-state: paused !important;
}

.modal-overlay,
.legal-banner,
.ai-panel,
.team-page-overlay,
.contest-page-overlay,
.admin-login-screen,
.full-3d-builder,
.koc-panel-overlay,
.logs-panel-overlay,
.video-studio-overlay,
.a27-api-guide-overlay,
.job-market-overlay,
.job-detail-overlay,
.video-editor-overlay {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* ============================================================ */
/* [AETHRION] DASHBOARD CONTAINER                               */
/* ============================================================ */
.dashboard-container {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #030306;
    background-image:
        radial-gradient(ellipse 130% 65% at 50% 0%, rgba(232, 197, 85, 0.1) 0%, transparent 60%),
        radial-gradient(ellipse 85% 45% at 20% 30%, rgba(139, 107, 255, 0.08) 0%, transparent 60%),
        radial-gradient(ellipse 85% 45% at 80% 70%, rgba(197, 205, 224, 0.06) 0%, transparent 60%),
        radial-gradient(ellipse 65% 45% at 50% 100%, rgba(118, 185, 0, 0.05) 0%, transparent 60%);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top center;
    background-attachment: local;
    z-index: 10000;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 0 !important;
    display: none;
    overflow-anchor: none;
    will-change: scroll-position;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    width: 100%;
    max-width: 100vw;
}

[data-theme="light"] .dashboard-container {
    background-color: #f8f5ee;
    background-image: radial-gradient(ellipse 130% 65% at 50% 0%, rgba(232, 197, 85, 0.1) 0%, transparent 60%);
}

.dashboard-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.99)) !important;
    border-bottom: 2.5px solid var(--accent) !important;
    padding: 16px 28px !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    min-height: 80px;
    overflow-anchor: none;
    backdrop-filter: blur(24px) saturate(190%);
    -webkit-backdrop-filter: blur(24px) saturate(190%);
    box-shadow:
        0 6px 45px rgba(0, 0, 0, 0.65),
        0 0 60px rgba(232, 197, 85, 0.22),
        0 0 120px rgba(139, 107, 255, 0.12);
    position: relative;
    width: 100%;
}

.dashboard-header::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        var(--nvidia),
        transparent
    );
    animation: dashboardHeaderGlow 4.5s ease-in-out infinite alternate;
}

@keyframes dashboardHeaderGlow {
    0%   { opacity: 0.55; }
    100% { opacity: 1; box-shadow: 0 0 30px var(--accent); }
}

[data-theme="light"] .dashboard-header {
    background: rgba(255, 255, 255, 0.99) !important;
}

.dashboard-content-wrapper {
    padding: 26px;
    padding-top: 16px;
    margin-top: 0;
    max-width: 1720px;
    margin-left: auto;
    margin-right: auto;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    padding: 30px;
    max-width: 1720px;
    margin: 0 auto;
    margin-top: 0;
    padding-top: 12px;
}

.dashboard-grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    padding: 30px;
    max-width: 1720px;
    margin: 0 auto;
    width: 100%;
    margin-top: 0;
    padding-top: 12px;
}

.dashboard-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.96), rgba(8, 8, 12, 0.98));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 30px;
    transition: border-color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    overflow-anchor: none;
    contain: layout style;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    position: relative;
    box-shadow:
        0 5px 30px rgba(0, 0, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.dashboard-card:hover {
    border-color: var(--accent);
    box-shadow:
        0 12px 55px rgba(0, 0, 0, 0.6),
        0 0 50px rgba(232, 197, 85, 0.22),
        0 0 100px rgba(139, 107, 255, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

[data-theme="light"] .dashboard-card {
    background: rgba(255, 255, 255, 0.96);
}

.dashboard-card h3 {
    color: var(--accent);
    margin-bottom: 26px;
    font-size: 20px;
    border-bottom: 1px solid var(--border);
    padding-bottom: 17px;
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: 0.4px;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.dashboard-card h3::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 55px;
    height: 2.5px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), transparent);
    box-shadow: 0 0 14px var(--accent);
}

.full-width { grid-column: 1 / -1; }

/* ============================================================ */
/* DASHBOARD HEADER AETHRION AL TRIGGER                         */
/* ============================================================ */
.aethrion-al-trigger-dash {
    position: relative;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    box-shadow:
        0 5px 28px rgba(232, 197, 85, 0.6),
        0 0 55px rgba(139, 107, 255, 0.4);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    padding: 0;
    margin-right: 4px;
    flex-shrink: 0;
    animation: btnGradientShift 5.5s ease infinite;
}

.aethrion-al-trigger-dash span {
    display: block;
    width: 20px;
    height: 2.5px;
    background: #ffffff;
    border-radius: 2px;
    box-shadow: 0 0 9px rgba(255, 255, 255, 0.7);
}

.aethrion-al-trigger-dash:hover {
    transform: scale(1.14);
    box-shadow:
        0 10px 45px rgba(232, 197, 85, 1),
        0 0 100px rgba(139, 107, 255, 0.7);
}

.aethrion-al-trigger-dash:active {
    transform: scale(0.95);
}

/* ============================================================ */
/* PUAN ROZETİ                                                  */
/* ============================================================ */
.points-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(255, 138, 92, 0.16));
    border: 1.5px solid var(--gold);
    border-radius: var(--radius-pill);
    padding: 9px 22px 9px 15px;
    font-weight: 700;
    color: var(--gold);
    font-size: 14.5px;
    cursor: default;
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.45),
        inset 0 0 14px rgba(232, 197, 85, 0.14);
    letter-spacing: 0.38px;
}

.points-badge .coin-icon { font-size: 21px; }
.points-badge .points-value { font-size: 18px; margin: 0 4px; }

/* ============================================================ */
/* LEVEL ROZETİ                                                 */
/* ============================================================ */
.level-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 18px;
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.level-badge.level-caylak {
    background: linear-gradient(135deg, #4a5568, #2d3748);
    color: #cbd5e1;
    box-shadow: 0 0 22px rgba(74, 85, 104, 0.4);
}
.level-badge.level-uye {
    background: linear-gradient(135deg, #2b6cb0, #1e4f8b);
    color: #bee3f8;
    box-shadow: 0 0 22px rgba(43, 108, 176, 0.55);
}
.level-badge.level-uzman {
    background: linear-gradient(135deg, #e8c555, #b8901f);
    color: #030306;
    box-shadow: 0 0 28px rgba(232, 197, 85, 0.7);
}
.level-badge.level-efsane {
    background: linear-gradient(135deg, #c5cde0, #8b6bff);
    color: #030306;
    box-shadow:
        0 0 35px rgba(139, 107, 255, 0.8),
        0 0 70px rgba(197, 205, 224, 0.4);
    animation: efsanePulse 3.8s ease-in-out infinite;
}

@keyframes efsanePulse {
    0%, 100% { box-shadow: 0 0 35px rgba(139, 107, 255, 0.8); }
    50%      { box-shadow: 0 0 65px rgba(139, 107, 255, 1); }
}

#userRoleBadge.moderator {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.3), rgba(245, 216, 120, 0.16));
    border: 1.5px solid #e8c555;
    color: #e8c555;
    box-shadow:
        0 0 22px rgba(232, 197, 85, 0.6),
        inset 0 0 14px rgba(232, 197, 85, 0.14);
    font-weight: 700;
}

/* ============================================================ */
/* AI CHAT (Dashboard)                                          */
/* ============================================================ */
.ai-chat-messages {
    height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: auto;
    overscroll-behavior: contain;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.45));
    border-radius: var(--radius-lg);
    padding: 22px;
    margin-bottom: 22px;
    overflow-anchor: none;
    border: 1px solid rgba(232, 197, 85, 0.14);
    box-shadow: inset 0 0 40px rgba(232, 197, 85, 0.05);
}

[data-theme="light"] .ai-chat-messages {
    background: rgba(0, 0, 0, 0.06);
}

.ai-message {
    padding: 17px 24px;
    margin-bottom: 17px;
    border-radius: var(--radius-lg);
    font-size: 14.5px;
    max-width: 85%;
    word-wrap: break-word;
    position: relative;
    box-shadow: 0 5px 22px rgba(0, 0, 0, 0.35);
}

.ai-message.user {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(139, 107, 255, 0.18));
    text-align: right;
    margin-left: auto;
    border-radius: var(--radius-lg) var(--radius-lg) 4px var(--radius-lg);
    border: 1px solid rgba(232, 197, 85, 0.4);
}

.ai-message.bot {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.12), rgba(110, 224, 255, 0.1));
    border-left: 3.5px solid var(--accent2);
    border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) 4px;
    border: 1px solid rgba(197, 205, 224, 0.22);
}

.ai-message.bot code {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    padding: 7px 16px;
    border-radius: 9px;
    font-family: var(--font-code);
    font-size: 13.5px;
    display: block;
    margin: 11px 0;
    border: 1px solid rgba(232, 197, 85, 0.22);
    color: var(--accent2);
}

.ai-message .role {
    font-size: 11.5px;
    opacity: 0.72;
    margin-bottom: 6px;
    font-weight: 600;
    letter-spacing: 0.38px;
}

.ai-message .timestamp {
    font-size: 10.5px;
    opacity: 0.48;
    margin-top: 10px;
}

.ai-input-area {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.ai-input-area input,
.ai-input-area textarea {
    flex: 1;
    min-width: 180px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 15px 22px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.ai-input-area input:focus,
.ai-input-area textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45), 0 0 60px rgba(139, 107, 255, 0.28);
}

.glow-input {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--accent);
    color: var(--text);
    padding: 13px 22px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    width: 100%;
    transition: box-shadow 0.24s;
}

.glow-input:focus {
    outline: none;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.6), 0 0 65px rgba(139, 107, 255, 0.35);
}

.glow-input option {
    background: var(--bg);
    color: var(--text);
}

/* ============================================================ */
/* PROJE LİSTESİ                                                */
/* ============================================================ */
.project-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.project-item {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.45));
    border-radius: var(--radius-md);
    padding: 15px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-left: 3.5px solid var(--accent);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
    gap: 12px;
}

.project-item:hover {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    box-shadow: 0 5px 28px rgba(232, 197, 85, 0.22);
}

[data-theme="light"] .project-item { background: #fcfaf4; }

.project-item .project-select {
    margin-right: 12px;
    accent-color: var(--accent);
}

.project-actions {
    display: flex;
    gap: 10px;
}

.project-actions span {
    cursor: pointer;
    opacity: 0.78;
    transition: opacity var(--transition-fast), transform 0.2s;
    font-size: 15px;
}

.project-actions span:hover {
    opacity: 1;
    transform: scale(1.2);
}

/* ============================================================ */
/* GELEN KUTUSU                                                 */
/* ============================================================ */
.inbox-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.inbox-item {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.45));
    border-radius: var(--radius-md);
    padding: 15px 22px;
    border-left: 3.5px solid var(--accent2);
    box-shadow: 0 5px 22px rgba(0, 0, 0, 0.28);
}

[data-theme="light"] .inbox-item { background: #fcfaf4; }

.inbox-item .inbox-sender {
    font-size: 12.5px;
    color: var(--text3);
    font-weight: 600;
    letter-spacing: 0.28px;
}

.inbox-item .inbox-message {
    font-size: 14px;
    margin-top: 7px;
    line-height: 1.6;
}

.inbox-item .inbox-actions {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* ============================================================ */
/* KULLANICI YÖNETİMİ                                          */
/* ============================================================ */
.user-list {
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.user-item {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.45));
    border-radius: 14px;
    padding: 13px 19px;
    margin-bottom: 9px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-left: 3.5px solid var(--accent);
    flex-wrap: wrap;
    gap: 10px;
    transition: background 0.24s;
}

.user-item:hover {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
}

[data-theme="light"] .user-item { background: #fcfaf4; }

.user-item .user-email {
    font-size: 13.5px;
    color: var(--text2);
    word-break: break-all;
    font-weight: 500;
}

.user-item .user-role {
    font-size: 11.5px;
    padding: 5px 14px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(139, 107, 255, 0.14));
    color: var(--accent);
    font-weight: 600;
    letter-spacing: 0.38px;
}

.user-item .user-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.user-item .user-actions button {
    padding: 7px 14px;
    font-size: 11px;
    border-radius: var(--radius-pill);
    border: none;
    cursor: pointer;
    font-weight: 600;
    transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s;
    letter-spacing: 0.28px;
}

.user-item .user-actions button:hover {
    transform: scale(1.1);
    box-shadow: 0 5px 22px rgba(0, 0, 0, 0.4);
}

.user-item .user-actions .btn-ban {
    background: linear-gradient(135deg, var(--danger), #cc2233);
    color: white;
}
.user-item .user-actions .btn-admin {
    background: linear-gradient(135deg, var(--accent), var(--purple));
    color: #06060b;
}
.user-item .user-actions .btn-user {
    background: var(--border2);
    color: var(--text2);
}
.user-item .user-actions .btn-gift {
    background: linear-gradient(135deg, var(--gold), #cc9900);
    color: #06060b;
}
.user-item .user-actions .btn-mod {
    background: linear-gradient(135deg, var(--moderator), #f5d878);
    color: #06060b;
}

/* ============================================================ */
/* [AETHRION] MODAL (Z-INDEX VE KAPANMA FIX)                    */
/* ============================================================ */
.modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.97);
    z-index: 99999;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    align-items: center;
    justify-content: center;
    padding: 24px;
    will-change: opacity;
    overflow-x: hidden;
    overscroll-behavior: contain;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow-anchor: none;
}

.modal-overlay:not(.open) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.modal-overlay.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.modal {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2px solid var(--accent);
    border-radius: var(--radius-xl);
    width: 540px;
    max-width: 92vw;
    padding: 40px;
    animation: modalFadeIn 0.4s ease;
    max-height: 90vh;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
    box-shadow:
        0 30px 120px rgba(0, 0, 0, 0.9),
        0 0 95px rgba(232, 197, 85, 0.32),
        0 0 190px rgba(139, 107, 255, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
}

.modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        var(--nvidia),
        transparent
    );
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 25px var(--accent), 0 0 50px var(--purple-glow);
}

[data-theme="light"] .modal { background: #ffffff; }

@keyframes modalFadeIn {
    from { opacity: 0; transform: scale(0.94) translateY(14px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.modal-header h3 {
    font-family: var(--font-display);
    font-size: 26px;
    letter-spacing: -0.4px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.modal-close {
    background: none;
    border: none;
    color: var(--text3);
    cursor: pointer;
    font-size: 34px;
    transition: color var(--transition-fast), transform 0.24s;
    line-height: 1;
    padding: 0 8px;
    font-weight: 300;
}

.modal-close:hover {
    color: var(--danger);
    transform: rotate(90deg) scale(1.2);
}

.modal-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 30px;
}

.modal-tab {
    flex: 1;
    padding: 15px;
    background: none;
    border: none;
    font-size: 13.5px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--text3);
    cursor: pointer;
    border-bottom: 2.5px solid transparent;
    transition: color 0.2s ease, border-color 0.2s ease;
    letter-spacing: 1px;
}

.modal-tab.active {
    color: var(--accent);
    border-bottom-color: var(--accent);
    text-shadow: 0 0 22px rgba(232, 197, 85, 0.7);
}

.form-input {
    width: 100%;
    padding: 17px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    font-size: 14.5px;
    border-radius: var(--radius-lg);
    margin-bottom: 22px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.form-input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.45),
        0 0 60px rgba(139, 107, 255, 0.22),
        inset 0 0 20px rgba(232, 197, 85, 0.06);
}

.form-row {
    display: flex;
    gap: 14px;
    margin-bottom: 22px;
    flex-wrap: wrap;
}

.form-row .form-input {
    flex: 1;
    min-width: 140px;
}

.password-toggle-btn {
    background: none !important;
    border: none !important;
    color: var(--text3) !important;
    cursor: pointer !important;
    font-size: 21px !important;
    padding: 0 10px !important;
    transition: color 0.24s ease !important;
}

.password-toggle-btn:hover { color: var(--accent) !important; }

.password-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
}

.password-wrapper .form-input {
    flex: 1 !important;
    margin-bottom: 0 !important;
}

/* ============================================================ */
/* AI WIDGET                                                     */
/* ============================================================ */
.ai-widget {
    position: fixed;
    bottom: 38px;
    right: 38px;
    z-index: 500;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.ai-widget-btn {
    width: 72px;
    height: 72px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    border: none;
    border-radius: 50%;
    font-size: 30px;
    cursor: pointer;
    box-shadow:
        0 0 50px rgba(232, 197, 85, 0.7),
        0 0 100px rgba(139, 107, 255, 0.45);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    color: #06060b;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    animation: btnGradientShift 5.5s ease infinite;
    position: relative;
}

.ai-widget-btn::before {
    content: '';
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    background: conic-gradient(from 0deg, transparent, var(--accent), transparent, var(--platinum), transparent, var(--purple), transparent);
    z-index: -1;
    animation: aaTriggerOrbit 5.5s linear infinite;
    filter: blur(6px);
    opacity: 0.9;
}

.ai-widget-btn:hover {
    transform: scale(1.18) rotate(8deg);
    box-shadow:
        0 0 85px rgba(232, 197, 85, 1),
        0 0 165px rgba(139, 107, 255, 0.8);
}

.ai-panel {
    display: none;
    position: absolute;
    bottom: 92px;
    right: 0;
    width: 450px;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2px solid var(--accent);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow:
        0 30px 90px rgba(0, 0, 0, 0.8),
        0 0 70px rgba(232, 197, 85, 0.35),
        0 0 140px rgba(139, 107, 255, 0.18);
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.ai-panel.open {
    display: flex;
    flex-direction: column;
}

.ai-messages {
    height: 340px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: auto;
    overscroll-behavior: contain;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 17px;
    overflow-anchor: none;
}

.ai-msg {
    padding: 13px 20px;
    font-size: 13px;
    line-height: 1.75;
    max-width: 85%;
    border-radius: var(--radius-lg);
    word-wrap: break-word;
}

.ai-msg.bot {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(139, 107, 255, 0.1));
    align-self: flex-start;
    border-left: 2.5px solid var(--accent);
}

.ai-msg.user {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.14), rgba(110, 224, 255, 0.1));
    align-self: flex-end;
    text-align: right;
    border-right: 2.5px solid var(--accent2);
}

.ai-suggestions {
    padding: 16px;
    border-top: 1px solid var(--border);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ai-suggestion {
    padding: 9px 18px;
    font-size: 11px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    font-weight: 500;
}

.ai-suggestion:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.45), 0 0 45px rgba(139, 107, 255, 0.22);
    transform: translateY(-2px);
}

.ai-input {
    flex: 1;
    background: rgba(0, 0, 0, 0.5);
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 13px 20px;
    border-radius: var(--radius-pill);
    font-size: 13px;
    transition: border-color 0.24s;
}

.ai-input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.4);
}

.ai-send {
    padding: 11px 24px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    background-size: 200% 200%;
    border: none;
    color: #06060b;
    border-radius: var(--radius-pill);
    cursor: pointer;
    font-weight: 700;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.5);
    transition: transform 0.2s, box-shadow 0.2s;
    animation: btnGradientShift 5.5s ease infinite;
}

.ai-send:hover {
    transform: scale(1.07);
    box-shadow: 0 0 50px rgba(232, 197, 85, 0.9), 0 0 100px rgba(139, 107, 255, 0.6);
}

/* ============================================================ */
/* PROFİL                                                        */
/* ============================================================ */
#profileContent p {
    margin: 12px 0;
    font-size: 14.5px;
}

#profileContent strong { color: var(--accent); }

.profile-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 26px;
}

.profile-card .avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    border: 3.5px solid var(--accent);
    object-fit: cover;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.6),
        0 0 70px rgba(139, 107, 255, 0.35);
}

.profile-card .name {
    font-size: 23px;
    font-weight: 700;
    margin-top: 15px;
}

.profile-card .bio {
    color: var(--text3);
    font-size: 14.5px;
    margin: 10px 0;
}

.profile-card .stats {
    display: flex;
    gap: 26px;
    margin-top: 18px;
}

.profile-card .stats span { text-align: center; }

.profile-card .stats .num {
    font-weight: 700;
    font-size: 21px;
    display: block;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.profile-card .stats .label {
    font-size: 11.5px;
    color: var(--text3);
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.profile-actions {
    display: flex;
    gap: 10px;
    margin-top: 18px;
    flex-wrap: wrap;
}

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

::-webkit-scrollbar-track {
    background: var(--bg2);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(232, 197, 85, 0.55), rgba(139, 107, 255, 0.55));
    border-radius: 10px;
    transition: background-color 0.2s ease;
    border: 2px solid var(--bg2);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--accent), var(--platinum), var(--purple));
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.7);
}

/* ============================================================ */
/* MISC                                                          */
/* ============================================================ */
.hidden { display: none !important; }
.text-center { text-align: center; }
.mt-8 { margin-top: 8px; }
.mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; }
.mb-12 { margin-bottom: 12px; }
.mb-16 { margin-bottom: 16px; }
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.w-full { width: 100%; }
.flex-1 { flex: 1; }
.min-w-150 { min-width: 150px; }

/* ============================================================ */
/* 3D GÖSTERİM ALANI                                             */
/* ============================================================ */
#canvas3d {
    width: 100%;
    height: 460px;
    background: #08080e;
    border-radius: var(--radius-md);
    border: 1px solid rgba(232, 197, 85, 0.3);
    margin-top: 18px;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 60px rgba(232, 197, 85, 0.08), 0 0 50px rgba(139, 107, 255, 0.1);
}

#canvas3d canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.btn-3d {
    background: linear-gradient(135deg, #ff8a5c, #8b6bff, #c5cde0);
    color: #06060b;
    box-shadow: 0 0 30px rgba(255, 138, 92, 0.55);
    font-weight: 700;
}

.btn-3d:hover {
    box-shadow:
        0 0 60px rgba(255, 138, 92, 0.9),
        0 0 120px rgba(139, 107, 255, 0.6);
    transform: translateY(-3px);
}

#imageResults img {
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    border-radius: 12px;
}

#imageResults img:hover {
    transform: scale(1.1);
    box-shadow:
        0 12px 45px rgba(232, 197, 85, 0.6),
        0 0 90px rgba(139, 107, 255, 0.35);
}

/* ============================================================ */
/* YILDIZ PUANLAMA                                               */
/* ============================================================ */
.star-rating {
    display: flex;
    gap: 4px;
    direction: rtl;
}

.star-rating input { display: none; }

.star-rating label {
    font-size: 28px;
    color: #444;
    cursor: pointer;
    transition: color 0.24s, transform 0.24s;
}

.star-rating label:hover,
.star-rating label:hover ~ label,
.star-rating input:checked ~ label {
    color: var(--gold);
    text-shadow: 0 0 18px var(--gold), 0 0 35px var(--gold-glow);
    transform: scale(1.2);
}

.star-display {
    display: inline-flex;
    gap: 3px;
    font-size: 17px;
    color: var(--gold);
    text-shadow: 0 0 12px rgba(232, 197, 85, 0.7);
}

/* ============================================================ */
/* ADMIN LOGIN SCREEN                                            */
/* ============================================================ */
.admin-login-screen {
    display: none !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background:
        radial-gradient(ellipse at 50% 40%, #0f0f18 0%, #030306 60%, #000 100%) !important;
    z-index: 9999999 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.admin-login-screen.active { display: flex !important; }

.admin-login-box {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(5, 5, 15, 0.99)) !important;
    border: 2.5px solid var(--accent) !important;
    border-radius: var(--radius-xl) !important;
    padding: 40px 50px !important;
    max-width: 440px !important;
    width: 100% !important;
    text-align: center !important;
    box-shadow:
        0 0 100px rgba(232, 197, 85, 0.45),
        0 0 200px rgba(139, 107, 255, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    cursor: pointer !important;
    margin: 10px !important;
    color: #ffffff !important;
    transition: transform 0.4s, box-shadow 0.4s;
}

.admin-login-box:hover {
    transform: translateY(-5px);
    box-shadow:
        0 15px 130px rgba(232, 197, 85, 0.65),
        0 0 250px rgba(139, 107, 255, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.admin-login-box[data-beta] {
    border-color: var(--accent2) !important;
    box-shadow:
        0 0 100px rgba(197, 205, 224, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

/* ============================================================ */
/* 🆕🆕🆕 [AETHRION v1.0.0] JARVIS TAM EKRAN MODAL 🆕🆕🆕       */
/* + HAL 9000 + Jarvis tarzı enerji küresi                      */
/* + Radar dalgaları, ses dalgaları, transcript                 */
/* + Quick commands, status indicator                           */
/* + Aethrion sesli asistanının en gelişmiş versiyonu           */
/* ============================================================ */

#aethrionJarvisOverlay {
    position: fixed;
    inset: 0;
    z-index: 2147483640;
    background:
        radial-gradient(ellipse 100% 70% at 50% 30%, #06060e 0%, #02020a 60%, #000 100%);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px;
    overflow: hidden;
    animation: jarvisFadeIn 0.5s ease;
}

#aethrionJarvisOverlay.open {
    display: flex;
}

@keyframes jarvisFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Arka plan aurora katmanları */
#aethrionJarvisOverlay::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 65% 55% at 50% 50%, rgba(232, 197, 85, 0.18) 0%, transparent 62%),
        radial-gradient(ellipse 70% 60% at 25% 25%, rgba(139, 107, 255, 0.16) 0%, transparent 62%),
        radial-gradient(ellipse 70% 60% at 75% 75%, rgba(110, 224, 255, 0.14) 0%, transparent 62%),
        radial-gradient(ellipse 50% 40% at 50% 100%, rgba(245, 216, 120, 0.1) 0%, transparent 65%);
    animation: jarvisBgBreath 6s ease-in-out infinite alternate;
    z-index: 0;
    pointer-events: none;
}

@keyframes jarvisBgBreath {
    0%   { opacity: 0.7; transform: scale(1); }
    100% { opacity: 1;   transform: scale(1.06); }
}

/* İnce grid çizgileri (HAL 9000 dokusu) */
#aethrionJarvisOverlay::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(232, 197, 85, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232, 197, 85, 0.04) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(ellipse 75% 65% at 50% 50%, black 25%, transparent 80%);
    -webkit-mask-image: radial-gradient(ellipse 75% 65% at 50% 50%, black 25%, transparent 80%);
    pointer-events: none;
    z-index: 0;
    animation: jarvisGridPulse 8s ease-in-out infinite;
}

@keyframes jarvisGridPulse {
    0%, 100% { opacity: 0.35; }
    50%      { opacity: 0.75; }
}

/* --- Jarvis Header Bar --- */
#aethrionJarvisOverlay .jarvis-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 32px;
    z-index: 3;
    background: linear-gradient(180deg, rgba(3, 3, 6, 0.85), transparent);
}

#aethrionJarvisOverlay .jarvis-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-display);
    font-size: 19px;
    font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 4.5s ease infinite;
    letter-spacing: 2.2px;
}

#aethrionJarvisOverlay .jarvis-title-icon {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, #e8c555, #8b6bff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    color: #06060b;
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.75),
        0 0 60px rgba(139, 107, 255, 0.5);
    flex-shrink: 0;
}

#aethrionJarvisOverlay .jarvis-header-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

#aethrionJarvisOverlay .jarvis-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    background: rgba(0, 0, 0, 0.55);
    border: 1px solid rgba(232, 197, 85, 0.4);
    border-radius: var(--radius-pill);
    font-family: var(--font-code);
    font-size: 12px;
    font-weight: 600;
    color: var(--accent);
    letter-spacing: 1.2px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

#aethrionJarvisOverlay .jarvis-status-pill::before {
    content: '';
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 16px var(--accent2);
    animation: jarvisStatusBlink 1s ease-in-out infinite;
}

@keyframes jarvisStatusBlink {
    0%, 100% { opacity: 0.4; transform: scale(0.85); }
    50%      { opacity: 1;   transform: scale(1.3); }
}

#aethrionJarvisOverlay .jarvis-close-btn {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: rgba(255, 77, 94, 0.18);
    border: 1.5px solid rgba(255, 77, 94, 0.6);
    color: #ff4d5e;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.24s ease;
    flex-shrink: 0;
}

#aethrionJarvisOverlay .jarvis-close-btn:hover {
    background: rgba(255, 77, 94, 0.4);
    color: #fff;
    transform: rotate(90deg) scale(1.12);
    box-shadow: 0 0 32px rgba(255, 77, 94, 0.75);
}

/* --- Jarvis Orb (Merkez Enerji Küresi) --- */
#aethrionJarvisOverlay .jarvis-orb-wrap {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
}

#aethrionJarvisOverlay .jarvis-orb {
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(232, 197, 85, 0.85) 18%,
        rgba(139, 107, 255, 0.7) 42%,
        rgba(110, 224, 255, 0.45) 62%,
        transparent 85%
    );
    box-shadow:
        0 0 80px rgba(232, 197, 85, 0.9),
        0 0 160px rgba(139, 107, 255, 0.65),
        0 0 280px rgba(110, 224, 255, 0.4),
        inset 0 0 90px rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    animation: jarvisOrbPulse 2.4s ease-in-out infinite;
    font-size: 86px;
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 0 40px rgba(255, 255, 255, 0.9);
    transition: all 0.4s ease;
}

@keyframes jarvisOrbPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow:
            0 0 80px rgba(232, 197, 85, 0.9),
            0 0 160px rgba(139, 107, 255, 0.65);
    }
    50% {
        transform: scale(1.05);
        box-shadow:
            0 0 110px rgba(232, 197, 85, 1),
            0 0 210px rgba(139, 107, 255, 0.85),
            0 0 350px rgba(110, 224, 255, 0.55);
    }
}

/* Orb içindeki ikon (halo/çekirdek) */
#aethrionJarvisOverlay .jarvis-orb::before {
    content: '';
    position: absolute;
    inset: 30px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.6) 0%, transparent 70%);
    animation: jarvisOrbCore 1.8s ease-in-out infinite;
}

@keyframes jarvisOrbCore {
    0%, 100% { transform: scale(0.95); opacity: 0.75; }
    50%      { transform: scale(1.08); opacity: 1; }
}

/* Orb dış halkası (radar dalgası 1) */
#aethrionJarvisOverlay .jarvis-orb-ring {
    position: absolute;
    inset: -30px;
    border-radius: 50%;
    border: 2px solid rgba(232, 197, 85, 0.6);
    animation: jarvisRingExpand 3s ease-out infinite;
    pointer-events: none;
}

#aethrionJarvisOverlay .jarvis-orb-ring:nth-child(2) {
    animation-delay: 1s;
    border-color: rgba(139, 107, 255, 0.6);
}

#aethrionJarvisOverlay .jarvis-orb-ring:nth-child(3) {
    animation-delay: 2s;
    border-color: rgba(110, 224, 255, 0.55);
}

@keyframes jarvisRingExpand {
    0% {
        transform: scale(0.85);
        opacity: 0.9;
    }
    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

/* Dış dashed orbit */
#aethrionJarvisOverlay .jarvis-orb-orbit {
    position: absolute;
    inset: -55px;
    border-radius: 50%;
    border: 2px dashed rgba(232, 197, 85, 0.35);
    animation: jarvisOrbitSpin 18s linear infinite;
    pointer-events: none;
}

#aethrionJarvisOverlay .jarvis-orb-orbit::before,
#aethrionJarvisOverlay .jarvis-orb-orbit::after {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 24px var(--accent), 0 0 48px var(--accent-glow);
    top: 50%;
    transform: translateY(-50%);
}

#aethrionJarvisOverlay .jarvis-orb-orbit::before { left: -6px; }
#aethrionJarvisOverlay .jarvis-orb-orbit::after {
    right: -6px;
    background: var(--purple);
    box-shadow: 0 0 24px var(--purple), 0 0 48px var(--purple-glow);
}

@keyframes jarvisOrbitSpin {
    to { transform: rotate(360deg); }
}

/* Ses dalgaları (konuşurken) */
#aethrionJarvisOverlay .jarvis-wave-bars {
    position: absolute;
    bottom: -50px;
    display: flex;
    gap: 6px;
    align-items: center;
    height: 40px;
    z-index: 3;
}

#aethrionJarvisOverlay .jarvis-wave-bars span {
    width: 5px;
    background: linear-gradient(180deg, var(--accent), var(--platinum), var(--purple));
    border-radius: 4px;
    animation: jarvisWaveBar 1.2s ease-in-out infinite;
    box-shadow: 0 0 12px var(--accent);
}

#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(1)  { animation-delay: 0s;    height: 14px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(2)  { animation-delay: 0.1s;  height: 26px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(3)  { animation-delay: 0.2s;  height: 36px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(4)  { animation-delay: 0.3s;  height: 24px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(5)  { animation-delay: 0.4s;  height: 34px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(6)  { animation-delay: 0.5s;  height: 26px; }
#aethrionJarvisOverlay .jarvis-wave-bars span:nth-child(7)  { animation-delay: 0.6s;  height: 14px; }

@keyframes jarvisWaveBar {
    0%, 100% { transform: scaleY(0.4); opacity: 0.6; }
    50%      { transform: scaleY(1.3); opacity: 1; }
}

/* Konuşmuyorken dalgalar dursun */
#aethrionJarvisOverlay.idle .jarvis-wave-bars span {
    animation-play-state: paused;
    opacity: 0.4;
}

#aethrionJarvisOverlay.idle .jarvis-orb {
    animation-duration: 4s;
    opacity: 0.85;
}

/* --- Jarvis Transcript --- */
#aethrionJarvisOverlay .jarvis-transcript-wrap {
    max-width: 820px;
    width: 100%;
    z-index: 2;
    text-align: center;
    padding: 0 24px;
}

#aethrionJarvisOverlay .jarvis-transcript {
    font-size: 19px;
    line-height: 1.7;
    color: var(--text2);
    min-height: 72px;
    letter-spacing: 0.4px;
    margin-bottom: 22px;
}

#aethrionJarvisOverlay .jarvis-transcript .jarvis-user-text {
    color: var(--accent);
    font-weight: 700;
    text-shadow: 0 0 20px rgba(232, 197, 85, 0.6);
}

#aethrionJarvisOverlay .jarvis-transcript .jarvis-ai-text {
    color: var(--accent2);
    font-weight: 500;
    text-shadow: 0 0 20px rgba(197, 205, 224, 0.4);
}

#aethrionJarvisOverlay .jarvis-transcript .jarvis-thinking {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--text3);
    font-style: italic;
    font-size: 16px;
}

#aethrionJarvisOverlay .jarvis-transcript .jarvis-thinking::before {
    content: '';
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 20px var(--accent);
    animation: jarvisStatusBlink 1s ease-in-out infinite;
}

/* --- Jarvis Quick Commands --- */
#aethrionJarvisOverlay .jarvis-quick-cmds {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 32px;
    z-index: 2;
    max-width: 900px;
    padding: 0 20px;
}

#aethrionJarvisOverlay .jarvis-quick-cmds button {
    padding: 11px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1.5px solid rgba(232, 197, 85, 0.35);
    color: var(--text2);
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    font-family: var(--font-body);
    transition: all 0.24s ease;
    letter-spacing: 0.3px;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

#aethrionJarvisOverlay .jarvis-quick-cmds button:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(232, 197, 85, 0.22);
    box-shadow:
        0 0 25px rgba(232, 197, 85, 0.5),
        0 0 50px rgba(139, 107, 255, 0.25);
    transform: translateY(-2px);
}

/* --- Jarvis Mikrofon Butonu (Alt) --- */
#aethrionJarvisOverlay .jarvis-mic-btn {
    position: absolute;
    bottom: 38px;
    left: 50%;
    transform: translateX(-50%);
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    border: none;
    color: #06060b;
    font-size: 36px;
    cursor: pointer;
    box-shadow:
        0 0 50px rgba(232, 197, 85, 0.85),
        0 0 100px rgba(139, 107, 255, 0.55),
        0 0 160px rgba(110, 224, 255, 0.35);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    animation: btnGradientShift 5s ease infinite;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
}

#aethrionJarvisOverlay .jarvis-mic-btn::after {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: 2px solid var(--accent);
    opacity: 0;
    animation: jarvisMicPulse 2.4s ease-out infinite;
}

@keyframes jarvisMicPulse {
    0%   { opacity: 0.9; transform: scale(1); }
    100% { opacity: 0;   transform: scale(1.55); }
}

#aethrionJarvisOverlay .jarvis-mic-btn:hover {
    transform: translateX(-50%) scale(1.1);
    box-shadow:
        0 0 70px rgba(232, 197, 85, 1),
        0 0 140px rgba(139, 107, 255, 0.75);
}

#aethrionJarvisOverlay .jarvis-mic-btn.listening {
    background: linear-gradient(135deg, #ff4d5e, #ff8a5c, #e8c555);
    animation: jarvisMicListening 0.9s ease-in-out infinite, btnGradientShift 3s ease infinite;
    box-shadow:
        0 0 65px rgba(255, 77, 94, 0.95),
        0 0 130px rgba(255, 138, 92, 0.7);
}

@keyframes jarvisMicListening {
    0%, 100% { transform: translateX(-50%) scale(1); }
    50%      { transform: translateX(-50%) scale(1.15); }
}

/* --- Jarvis Hızlı Kapatma (Sağ Alt) --- */
#aethrionJarvisOverlay .jarvis-side-actions {
    position: absolute;
    bottom: 40px;
    right: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 3;
}

#aethrionJarvisOverlay .jarvis-side-actions button {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    border: 1.5px solid rgba(232, 197, 85, 0.4);
    color: var(--accent);
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: all 0.24s ease;
}

#aethrionJarvisOverlay .jarvis-side-actions button:hover {
    background: rgba(232, 197, 85, 0.3);
    color: #06060b;
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.7);
    transform: scale(1.1);
}

/* --- Jarvis Responsive --- */
@media (max-width: 768px) {
    #aethrionJarvisOverlay .jarvis-orb {
        width: 200px;
        height: 200px;
        font-size: 68px;
    }
    #aethrionJarvisOverlay .jarvis-orb-orbit { inset: -44px; }
    #aethrionJarvisOverlay .jarvis-orb-ring { inset: -24px; }
    #aethrionJarvisOverlay .jarvis-transcript { font-size: 16px; }
    #aethrionJarvisOverlay .jarvis-mic-btn { width: 76px; height: 76px; font-size: 30px; bottom: 32px; }
    #aethrionJarvisOverlay .jarvis-side-actions button { width: 46px; height: 46px; font-size: 18px; }
    #aethrionJarvisOverlay .jarvis-quick-cmds button { font-size: 11.5px; padding: 10px 18px; }
}

@media (max-width: 480px) {
    #aethrionJarvisOverlay { padding: 24px 16px; }
    #aethrionJarvisOverlay .jarvis-header { padding: 14px 18px; }
    #aethrionJarvisOverlay .jarvis-title { font-size: 15px; gap: 10px; }
    #aethrionJarvisOverlay .jarvis-title-icon { width: 34px; height: 34px; font-size: 16px; }
    #aethrionJarvisOverlay .jarvis-status-pill { font-size: 10.5px; padding: 8px 15px; }
    #aethrionJarvisOverlay .jarvis-orb {
        width: 155px;
        height: 155px;
        font-size: 52px;
    }
    #aethrionJarvisOverlay .jarvis-orb-orbit { inset: -34px; }
    #aethrionJarvisOverlay .jarvis-orb-ring { inset: -18px; }
    #aethrionJarvisOverlay .jarvis-transcript { font-size: 14.5px; padding: 0 14px; }
    #aethrionJarvisOverlay .jarvis-quick-cmds { margin-top: 24px; gap: 8px; }
    #aethrionJarvisOverlay .jarvis-quick-cmds button { font-size: 10.5px; padding: 9px 15px; }
    #aethrionJarvisOverlay .jarvis-mic-btn { width: 68px; height: 68px; font-size: 26px; bottom: 28px; }
    #aethrionJarvisOverlay .jarvis-side-actions { bottom: 28px; right: 18px; }
    #aethrionJarvisOverlay .jarvis-side-actions button { width: 42px; height: 42px; font-size: 16px; }
    #aethrionJarvisOverlay .jarvis-wave-bars { bottom: -38px; gap: 4px; height: 32px; }
    #aethrionJarvisOverlay .jarvis-wave-bars span { width: 4px; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TABLET (max-width: 768px)           */
/* ============================================================ */
@media (max-width: 768px) {
    .dashboard-header {
        padding: 14px 18px !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        min-height: auto !important;
    }
    .dashboard-header .logo { justify-content: center; }
    .dashboard-header .user-info {
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
    .dashboard-header .user-info span { font-size: 14px !important; }
    .dashboard-header .btn-sm {
        font-size: 11px !important;
        padding: 7px 13px !important;
    }
    .aethrion-al-trigger-dash {
        width: 42px;
        height: 42px;
    }
    .aethrion-al-trigger-dash span {
        width: 18px;
    }

    .dashboard-content-wrapper { padding: 16px !important; }

    .dashboard-grid,
    .dashboard-grid-2col {
        grid-template-columns: 1fr !important;
        padding: 14px !important;
        gap: 18px !important;
    }
    .dashboard-card {
        padding: 20px !important;
        border-radius: 22px !important;
    }
    .dashboard-card h3 {
        font-size: 17px !important;
        margin-bottom: 16px !important;
        padding-bottom: 12px !important;
    }

    .ai-chat-messages {
        height: 280px !important;
        padding: 14px !important;
    }
    .ai-message { padding: 13px 16px !important; font-size: 13.5px !important; }
    .ai-input-area { flex-direction: column !important; gap: 12px !important; }
    .ai-input-area input,
    .ai-input-area textarea {
        min-width: auto !important;
        font-size: 13.5px !important;
        padding: 13px 18px !important;
    }
    .glow-input {
        font-size: 13.5px !important;
        padding: 11px 18px !important;
    }

    .modal-overlay {
        padding: 14px !important;
        align-items: flex-start !important;
        overflow-y: auto !important;
    }
    .modal {
        width: 100% !important;
        max-width: 100% !important;
        padding: 24px 22px !important;
        border-radius: 26px !important;
        max-height: none !important;
        margin: 24px auto !important;
    }
    .modal-header { margin-bottom: 20px !important; }
    .modal-header h3 { font-size: 22px !important; }
    .modal-close { font-size: 30px !important; }
    .modal-tab { font-size: 12.5px !important; padding: 11px !important; }
    .form-input {
        font-size: 14px !important;
        padding: 13px 18px !important;
        margin-bottom: 16px !important;
        border-radius: 16px !important;
    }
    .form-row { gap: 12px !important; }
    .password-wrapper { gap: 8px !important; }

    .ai-widget { bottom: 26px !important; right: 26px !important; }
    .ai-widget-btn {
        width: 62px !important;
        height: 62px !important;
        font-size: 27px !important;
    }
    .ai-panel {
        width: calc(100vw - 30px) !important;
        right: 15px !important;
        bottom: 88px !important;
        max-width: 460px !important;
    }
    .ai-messages { height: 280px !important; }
    .ai-msg { font-size: 13px !important; }

    #canvas3d { height: 340px !important; }

    .project-item { padding: 13px 16px !important; font-size: 13.5px !important; }
    .project-actions span { font-size: 14px !important; }
    .project-list { max-height: 220px !important; }

    .inbox-item { padding: 13px 16px !important; }

    .user-item { padding: 11px 16px !important; }
    .user-item .user-email { font-size: 13px !important; }
    .user-item .user-actions button {
        font-size: 10.5px !important;
        padding: 5px 11px !important;
    }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TELEFON (max-width: 480px)          */
/* ============================================================ */
@media (max-width: 480px) {
    .dashboard-container { padding: 0 !important; }
    .dashboard-header {
        padding: 11px 14px !important;
        gap: 8px !important;
    }
    .dashboard-header .logo-icon { width: 38px !important; height: 38px !important; }
    .dashboard-header .logo-text { font-size: 16px !important; }
    .dashboard-header .user-info {
        gap: 6px !important;
        justify-content: center !important;
    }
    .dashboard-header .user-info span { font-size: 12.5px !important; }
    .dashboard-header .btn-sm {
        font-size: 10.5px !important;
        padding: 5px 10px !important;
    }
    .aethrion-al-trigger-dash {
        width: 38px;
        height: 38px;
    }
    .aethrion-al-trigger-dash span {
        width: 16px;
        height: 2px;
    }

    .dashboard-content-wrapper { padding: 10px !important; }

    .dashboard-grid,
    .dashboard-grid-2col {
        padding: 6px !important;
        gap: 12px !important;
    }
    .dashboard-card {
        padding: 16px !important;
        border-radius: 18px !important;
    }
    .dashboard-card h3 {
        font-size: 15px !important;
        margin-bottom: 14px !important;
        padding-bottom: 10px !important;
    }

    .ai-chat-messages {
        height: 210px !important;
        padding: 10px !important;
        border-radius: 16px !important;
    }
    .ai-message {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
        max-width: 95% !important;
        margin-bottom: 10px !important;
    }
    .ai-input-area { gap: 7px !important; }
    .ai-input-area input,
    .ai-input-area textarea {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
        border-radius: 26px !important;
    }
    .glow-input {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
        border-radius: 26px !important;
    }

    .modal-overlay {
        padding: 10px !important;
        align-items: flex-start !important;
        overflow-y: auto !important;
    }
    .modal {
        padding: 18px 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 22px !important;
        max-height: none !important;
        margin: 14px auto !important;
    }
    .modal-header { margin-bottom: 16px !important; }
    .modal-header h3 { font-size: 19px !important; }
    .modal-close { font-size: 26px !important; }
    .modal-tab { font-size: 11.5px !important; padding: 9px 6px !important; }
    .form-input {
        font-size: 12.5px !important;
        padding: 11px 14px !important;
        margin-bottom: 12px !important;
        border-radius: 14px !important;
    }
    .form-row { gap: 9px !important; }
    .password-toggle-btn { font-size: 17px !important; padding: 0 6px !important; }

    .ai-widget { bottom: 16px !important; right: 16px !important; }
    .ai-widget-btn {
        width: 52px !important;
        height: 52px !important;
        font-size: 23px !important;
    }
    .ai-panel {
        width: calc(100vw - 22px) !important;
        right: 11px !important;
        bottom: 74px !important;
        border-radius: 18px !important;
    }
    .ai-messages { height: 210px !important; padding: 12px !important; }
    .ai-msg { font-size: 12.5px !important; padding: 9px 14px !important; }
    .ai-suggestions { padding: 9px !important; gap: 6px !important; }
    .ai-suggestion { font-size: 10.5px !important; padding: 6px 12px !important; }
    .ai-input {
        font-size: 12.5px !important;
        padding: 9px 14px !important;
        border-radius: 26px !important;
    }
    .ai-send { font-size: 12.5px !important; padding: 9px 16px !important; }

    .project-item {
        padding: 10px 14px !important;
        font-size: 12.5px !important;
        border-radius: 12px !important;
    }
    .project-actions { gap: 7px !important; }
    .project-actions span { font-size: 12.5px !important; }
    .project-list { max-height: 180px !important; gap: 7px !important; }

    .user-list { max-height: 220px !important; }
    .user-item {
        padding: 10px 12px !important;
        font-size: 12.5px !important;
        gap: 6px !important;
    }
    .user-item .user-email { font-size: 11.5px !important; word-break: break-word !important; }
    .user-item .user-role { font-size: 10.5px !important; padding: 3px 9px !important; }
    .user-item .user-actions button {
        font-size: 9.5px !important;
        padding: 4px 9px !important;
    }

    .inbox-item {
        padding: 11px 14px !important;
        font-size: 12.5px !important;
        border-radius: 12px !important;
    }
    .inbox-item .inbox-message { font-size: 12.5px !important; }
    .inbox-item .inbox-actions button {
        font-size: 10.5px !important;
        padding: 4px 11px !important;
    }

    .admin-login-screen { padding: 12px !important; }
    .admin-login-wrapper {
        gap: 14px !important;
        padding: 12px !important;
    }
    .admin-login-box {
        padding: 22px !important;
        max-width: 340px !important;
        border-radius: 24px !important;
        margin: 5px !important;
    }
    .admin-login-box > div:first-child { font-size: 44px !important; }
    .admin-login-box > div:nth-child(2) { font-size: 20px !important; }
    .admin-login-box > div:nth-child(3) { font-size: 13px !important; }
    .admin-login-title { font-size: 22px !important; }

    #canvas3d { height: 220px !important; }

    .btn-primary, .btn-secondary, .btn-danger, .btn-success {
        font-size: 12.5px !important;
        padding: 9px 16px !important;
        border-radius: 26px !important;
    }
    .btn-sm { font-size: 10.5px !important; padding: 5px 10px !important; }
    .points-badge {
        font-size: 12.5px !important;
        padding: 5px 13px !important;
    }
    .points-badge .points-value { font-size: 14.5px !important; }
    #imageResults img { max-width: 100% !important; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — ÇOK KÜÇÜK (max-width: 360px)        */
/* ============================================================ */
@media (max-width: 360px) {
    .dashboard-header .logo-text { font-size: 14px !important; }
    .dashboard-header .btn-sm {
        font-size: 9.5px !important;
        padding: 4px 8px !important;
    }
    .dashboard-card h3 { font-size: 13.5px !important; }
    .admin-login-box { padding: 16px !important; max-width: 300px !important; }
    .admin-login-title { font-size: 20px !important; }
}


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* [AETHRION] TAKIM SAYFASI                                     */
/* ============================================================ */
.team-page-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, var(--bg), var(--bg2));
    z-index: 99999;
    display: none;
    flex-direction: column;
    padding: 24px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow-anchor: none;
}

.team-page-overlay.open { display: flex; }

.team-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 18px;
    border-bottom: 2.5px solid var(--accent);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 13px;
    position: relative;
}

.team-page-header::after {
    content: '';
    position: absolute;
    bottom: -2.5px;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        transparent
    );
    filter: blur(2px);
    opacity: 0.8;
}

.team-page-header h2 {
    margin: 0;
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 26px;
    text-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
    letter-spacing: -0.4px;
}

.team-page-close {
    background: none;
    border: none;
    color: var(--text3);
    font-size: 36px;
    cursor: pointer;
    transition: color 0.24s, transform 0.24s;
    line-height: 1;
    padding: 0 10px;
}

.team-page-close:hover {
    color: var(--danger);
    transform: rotate(90deg) scale(1.2);
}

.team-page-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-top: 18px;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.team-page-info {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    padding: 16px 20px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border2);
    font-size: 14px;
    flex-shrink: 0;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.12);
}

.team-page-info .team-code {
    color: var(--accent);
    font-weight: 700;
    font-family: var(--font-code);
    letter-spacing: 1.3px;
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.7);
}

.team-page-chat {
    display: flex;
    flex-direction: column;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border-radius: var(--radius-lg);
    border: 1px solid var(--border2);
    padding: 18px;
    flex-shrink: 0;
    min-height: 380px;
    max-height: 580px;
    box-shadow: 0 0 45px rgba(232, 197, 85, 0.14), 0 0 90px rgba(139, 107, 255, 0.08);
}

.team-page-chat .team-chat-messages {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: auto;
    overscroll-behavior: contain;
    min-height: 260px;
    max-height: 470px;
    padding: 12px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: var(--radius-md);
    margin-bottom: 16px;
    overflow-anchor: none;
}

.team-page-chat .ai-input-area {
    margin-top: 6px;
    flex-shrink: 0;
    gap: 10px;
}

.team-page-chat .gif-btn {
    background: none;
    border: 1.5px solid var(--border2);
    border-radius: 50%;
    width: 42px;
    height: 42px;
    cursor: pointer;
    font-size: 19px;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s;
    color: var(--text3);
}

.team-page-chat .gif-btn:hover {
    border-color: var(--accent);
    transform: scale(1.14);
    box-shadow: 0 0 28px rgba(232, 197, 85, 0.55);
    color: var(--accent);
}

.team-page-middle {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 18px !important;
    margin-top: 0 !important;
    flex-shrink: 0;
}

.team-page-middle .team-page-card {
    max-height: 260px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    width: 100% !important;
    flex: none !important;
    min-width: 0 !important;
    overflow-anchor: none;
}

.team-page-bottom {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    gap: 18px !important;
    flex-shrink: 0;
}

.team-page-bottom .team-page-card {
    max-height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    width: 100% !important;
    overflow-anchor: none;
}

.team-page-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border: 1px solid var(--border2);
    border-radius: var(--radius-md);
    padding: 16px 18px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.team-page-card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.2);
}

.team-page-card h4 {
    color: var(--accent);
    font-size: 15px;
    margin: 0 0 13px 0;
    border-bottom: 1px solid var(--border);
    padding-bottom: 11px;
    font-family: var(--font-display);
    letter-spacing: 0.4px;
    font-weight: 700;
}

.member-item {
    display: flex;
    justify-content: space-between;
    padding: 7px 0;
    font-size: 13px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    flex-wrap: wrap;
    gap: 6px;
}

.team-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 13px;
    border-top: 1px solid var(--border);
    flex-shrink: 0;
}

.team-page-actions .glow-input {
    padding: 7px 15px;
    font-size: 13px;
    height: 36px;
    border-radius: 24px;
}

#teamPageFounderPanel {
    display: none;
    margin-top: 13px;
    padding-top: 18px;
    border-top: 2.5px solid var(--gold);
    flex-shrink: 0;
}

#teamPageFounderPanel h4 {
    color: var(--gold);
    margin: 0 0 13px 0;
    font-size: 17px;
    text-shadow: 0 0 24px rgba(232, 197, 85, 0.7);
}

#teamPageFounderPanel > div {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
}

#teamPageFounderPanel .btn-secondary {
    font-size: 13px !important;
    padding: 7px 17px !important;
}

#teamPageFounderPanel #teamSearchInput {
    flex: 1;
    min-width: 150px;
    font-size: 13px;
    padding: 7px 15px;
    height: 36px;
}

#allTeamsList {
    margin-top: 13px;
    max-height: 260px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border-radius: var(--radius-md);
    padding: 13px;
    display: none;
    overflow-anchor: none;
    border: 1px solid var(--border2);
}

#aethrionLogContainer {
    max-height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border-radius: var(--radius-md);
    padding: 13px;
    margin-top: 13px;
    border: 1px solid var(--border2);
    overflow-anchor: none;
}

/* ============================================================ */
/* RAINBOW TEXT (Luxury Gold Rainbow)                           */
/* ============================================================ */
.rainbow-text {
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #f5d878, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow 4.5s linear infinite;
    font-weight: 700;
}

@keyframes rainbow {
    0%   { background-position: 0% 50%; }
    100% { background-position: 400% 50%; }
}

.welcome-msg {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.3), rgba(232, 197, 85, 0.2)) !important;
    color: #fff !important;
    border-left-color: var(--accent2) !important;
    box-shadow: 0 0 30px rgba(197, 205, 224, 0.4) !important;
}

.welcome-msg .rainbow-text {
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #f5d878, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow 4.5s linear infinite;
}

.founder-deleted {
    background: linear-gradient(135deg, rgba(102, 0, 0, 0.6), rgba(60, 0, 0, 0.5)) !important;
    color: #c0c0c0 !important;
    border-left-color: #ff0000 !important;
    opacity: 0.88;
    box-shadow: 0 0 30px rgba(255, 0, 0, 0.22) !important;
}

.founder-deleted .ai-message { color: #c0c0c0 !important; }

.founder-badge {
    background: linear-gradient(90deg, #e8c555, #ff8a5c, #f5d878, #c5cde0, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow 4.5s linear infinite;
    font-weight: 800;
    padding: 3px 12px;
    border-radius: 14px;
    border: 1px solid var(--gold);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.55);
}

.aethrion-ai-msg {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(139, 107, 255, 0.24)) !important;
    border-left: 3.5px solid var(--gold) !important;
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.22) !important;
}

/* ============================================================ */
/* DİL SEÇİCİ                                                   */
/* ============================================================ */
.language-selector select {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    color: var(--text);
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-pill);
    padding: 8px 16px;
    font-size: 12.5px;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.language-selector select:hover {
    border-color: var(--accent);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.4);
}

.language-selector select option {
    background: var(--bg);
    color: var(--text);
}

/* ============================================================ */
/* AI MESAJ AKSİYONLARI                                         */
/* ============================================================ */
.ai-msg-actions {
    display: flex;
    gap: 7px;
    margin-top: 13px;
    flex-wrap: wrap;
    align-items: center;
}

.ai-msg-actions button {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    border: 1px solid rgba(232, 197, 85, 0.32);
    color: var(--text3);
    padding: 6px 15px;
    border-radius: var(--radius-pill);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.24s ease, border-color 0.24s ease, color 0.24s ease, box-shadow 0.24s;
    font-family: var(--font-body);
    letter-spacing: 0.28px;
}

.ai-msg-actions button:hover {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(139, 107, 255, 0.2));
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.5);
}

.ai-stop-btn {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(230, 57, 70, 0.1)) !important;
    border-color: rgba(255, 77, 94, 0.45) !important;
    color: var(--danger) !important;
}

.ai-stop-btn:hover {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.35), rgba(230, 57, 70, 0.25)) !important;
    border-color: var(--danger) !important;
    color: #fff !important;
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.7) !important;
}

.ai-edit-btn {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.14), rgba(255, 140, 0, 0.08)) !important;
    border-color: rgba(255, 179, 71, 0.45) !important;
    color: var(--warning) !important;
}

.ai-edit-btn:hover {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.35), rgba(255, 140, 0, 0.25)) !important;
    border-color: var(--warning) !important;
    color: #fff !important;
    box-shadow: 0 0 30px rgba(255, 179, 71, 0.7) !important;
}

.ai-thinking {
    display: inline-block;
    color: var(--text3);
    font-size: 12.5px;
    font-style: italic;
    animation: aiPulse 1.7s ease-in-out infinite;
}

@keyframes aiPulse {
    0%, 100% { opacity: 0.5; }
    50%      { opacity: 1; }
}

/* ============================================================ */
/* TAKIM MESAJ AKSİYONLARI                                      */
/* ============================================================ */
.team-msg-actions {
    display: flex;
    gap: 5px;
    margin-top: 6px;
    opacity: 0.55;
    transition: opacity 0.24s ease;
}

.team-msg-actions:hover { opacity: 1; }

.team-msg-actions button {
    background: transparent;
    border: none;
    color: var(--text3);
    cursor: pointer;
    font-size: 12.5px;
    padding: 3px 9px;
    border-radius: 10px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.team-msg-actions button:hover {
    background: rgba(232, 197, 85, 0.2);
    color: var(--accent);
}

.deleted-message {
    opacity: 0.55;
    font-style: italic;
    color: var(--text3) !important;
    border-left-color: var(--border) !important;
    background: rgba(0, 0, 0, 0.3) !important;
}

.message-not-found {
    color: var(--danger);
    font-size: 12.5px;
    font-style: italic;
    padding: 9px 14px;
}

/* ============================================================ */
/* API ANAHTAR YÖNETİMİ                                         */
/* ============================================================ */
.api-key-card {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px 22px;
    margin-bottom: 14px;
    transition: border-color 0.24s ease, box-shadow 0.24s ease;
    position: relative;
}

.api-key-card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.3);
}

.api-key-card .api-key-name {
    font-weight: 700;
    font-size: 15px;
    color: var(--text);
    margin-bottom: 13px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.api-key-card .api-key-value-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.api-key-card .api-key-value {
    flex: 1;
    min-width: 150px;
    font-family: var(--font-code);
    font-size: 13px;
    color: var(--text2);
    background: rgba(0, 0, 0, 0.5);
    padding: 10px 15px;
    border-radius: 13px;
    filter: blur(5px);
    transition: filter 0.3s ease;
    word-break: break-all;
    user-select: none;
    border: 1px solid rgba(232, 197, 85, 0.14);
}

.api-key-card .api-key-value.revealed {
    filter: none;
    user-select: text;
}

[data-theme="light"] .api-key-card .api-key-value {
    background: rgba(0, 0, 0, 0.06);
}

.api-key-card .api-key-actions {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
}

.api-key-card .api-key-actions button {
    padding: 8px 17px;
    font-size: 12px;
    font-weight: 600;
    border-radius: var(--radius-pill);
    cursor: pointer;
    border: 1px solid var(--border2);
    background: transparent;
    color: var(--text3);
    transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s;
    font-family: var(--font-body);
}

.api-key-card .api-key-actions button:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(232, 197, 85, 0.14);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.45);
}

.api-key-card .api-key-actions .btn-reveal.active {
    border-color: var(--accent2);
    color: var(--accent2);
    background: rgba(197, 205, 224, 0.14);
}

.api-key-card .api-key-actions .btn-delete {
    border-color: rgba(255, 77, 94, 0.5);
    color: var(--danger);
}

.api-key-card .api-key-actions .btn-delete:hover {
    border-color: var(--danger);
    background: rgba(255, 77, 94, 0.24);
    color: #fff;
    box-shadow: 0 0 22px rgba(255, 77, 94, 0.7);
}

/* ============================================================ */
/* ŞİFRE EKRANI                                                 */
/* ============================================================ */
.api-password-screen {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 26px;
    gap: 22px;
    text-align: center;
}

.api-password-screen .lock-icon {
    font-size: 78px;
    margin-bottom: 13px;
    animation: lockPulse 2.4s ease-in-out infinite;
    will-change: transform, filter;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    filter: drop-shadow(0 0 40px rgba(232, 197, 85, 0.8));
}

@keyframes lockPulse {
    0%, 100% { transform: scale(1); filter: drop-shadow(0 0 24px rgba(232, 197, 85, 0.6)); }
    50%      { transform: scale(1.12); filter: drop-shadow(0 0 55px rgba(232, 197, 85, 1)); }
}

.api-password-screen h3 {
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 26px;
    margin-bottom: 10px;
    text-shadow: 0 0 28px rgba(232, 197, 85, 0.6);
}

.api-password-screen p {
    color: var(--text3);
    font-size: 14px;
    max-width: 400px;
    line-height: 1.75;
}

.api-password-screen input {
    max-width: 360px;
    width: 100%;
    text-align: center;
    font-size: 17px;
    letter-spacing: 2.4px;
}

.api-password-screen .btn {
    max-width: 360px;
    width: 100%;
}

/* ============================================================ */
/* AYLIK YARIŞMA                                                */
/* ============================================================ */
.contest-page-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, var(--bg), var(--bg2));
    z-index: 99998;
    display: none;
    flex-direction: column;
    padding: 30px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.contest-page-overlay.open { display: flex; }

.contest-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 22px;
    border-bottom: 2.5px solid var(--gold);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 18px;
    margin-bottom: 22px;
}

.contest-page-header h2 {
    margin: 0;
    color: var(--gold);
    font-family: var(--font-display);
    font-size: 30px;
    text-shadow: 0 0 35px rgba(232, 197, 85, 0.7);
    letter-spacing: -0.4px;
}

.contest-page-close {
    background: transparent;
    border: 1.5px solid var(--danger);
    color: var(--danger);
    font-size: 15px;
    font-weight: 600;
    padding: 9px 22px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: background-color 0.24s ease, color 0.24s ease, box-shadow 0.24s;
}

.contest-page-close:hover {
    background: rgba(255, 77, 94, 0.25);
    color: #fff;
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.7);
}

.contest-page-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 22px;
    max-width: 1300px;
    margin: 0 auto;
    width: 100%;
}

.contest-section {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border: 1px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 26px;
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.4);
}

.contest-section h3 {
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 21px;
    margin: 0 0 18px 0;
    border-bottom: 1px solid var(--border);
    padding-bottom: 13px;
    letter-spacing: -0.22px;
}

.contest-ranking-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 13px 20px;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4));
    border-radius: var(--radius-md);
    margin-bottom: 10px;
    border-left: 3.5px solid var(--border2);
    transition: border-color 0.2s ease, transform 0.2s;
    flex-wrap: wrap;
    gap: 10px;
}

.contest-ranking-row:hover {
    transform: translateX(5px);
    border-left-color: var(--accent);
}

.contest-ranking-row.rank-1 {
    border-left-color: var(--gold);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(255, 140, 0, 0.08));
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.22);
}
.contest-ranking-row.rank-2 {
    border-left-color: #c5cde0;
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.12), rgba(170, 178, 196, 0.06));
}
.contest-ranking-row.rank-3 {
    border-left-color: #cd7f32;
    background: linear-gradient(135deg, rgba(205, 127, 50, 0.12), rgba(180, 110, 40, 0.06));
}

.contest-ranking-row.my-row {
    outline: 2.5px solid var(--accent);
    outline-offset: 1px;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.4);
}

.contest-ranking-name {
    font-weight: 700;
    color: var(--text);
    font-size: 15px;
}

.contest-ranking-email {
    font-size: 12px;
    color: var(--text3);
}

.contest-ranking-points {
    color: var(--gold);
    font-weight: 800;
    font-size: 17px;
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.7);
}

.contest-action-row {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 22px 0;
}

.contest-action-row .btn { min-width: 220px; }

.contest-warning-box {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.14), rgba(255, 140, 0, 0.08));
    border: 2.5px solid var(--warning);
    border-radius: var(--radius-xl);
    padding: 26px;
    margin: 22px 0;
    line-height: 1.85;
    box-shadow: 0 0 45px rgba(255, 179, 71, 0.22);
}

.contest-warning-box h4 {
    color: var(--warning);
    margin: 0 0 18px 0;
    font-size: 19px;
    letter-spacing: 0.38px;
}

.contest-warning-box .user-info-row {
    background: rgba(0, 0, 0, 0.4);
    border-radius: 13px;
    padding: 13px 19px;
    margin: 11px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14.5px;
}

.contest-warning-box .user-info-label {
    color: var(--text3);
    font-weight: 500;
}

.contest-warning-box .user-info-value {
    color: var(--accent);
    font-weight: 700;
    word-break: break-all;
}

.contest-project-card {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px;
    margin-bottom: 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.contest-project-card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.22);
}

.contest-project-card .project-info {
    flex: 1;
    min-width: 220px;
}

.contest-project-card .project-info-name {
    font-weight: 700;
    color: var(--text);
    font-size: 15px;
    margin-bottom: 7px;
}

.contest-project-card .project-info-meta {
    font-size: 12.5px;
    color: var(--text3);
}

.contest-project-card .project-info-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.contest-review-content {
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 22px;
    margin: 22px 0;
    max-height: 62vh;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.contest-review-content pre {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 1px solid rgba(232, 197, 85, 0.25);
    border-radius: 13px;
    padding: 18px;
    font-family: var(--font-code);
    font-size: 13.5px;
    color: var(--accent2);
    white-space: pre-wrap;
    word-break: break-word;
    margin: 11px 0;
    overflow-x: auto;
}

.contest-project-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.contest-project-form label {
    font-size: 14px;
    color: var(--text2);
    font-weight: 600;
    margin-bottom: 7px;
    display: block;
    letter-spacing: 0.28px;
}

.contest-project-form textarea {
    width: 100%;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 18px 20px;
    border-radius: var(--radius-lg);
    font-family: var(--font-code);
    font-size: 14px;
    min-height: 300px;
    resize: vertical;
    line-height: 1.75;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.contest-project-form textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.4);
}

.contest-empty-state {
    text-align: center;
    padding: 52px 24px;
    color: var(--text3);
    font-size: 15px;
}

#contestJoinWarningModal,
#contestProjectFormModal,
#contestReviewModal,
#contestScoreModal {
    z-index: 9999999 !important;
}

/* ============================================================ */
/* FULL 3D BUILDER                                              */
/* ============================================================ */
.full-3d-builder {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999998;
    background: linear-gradient(180deg, #030306 0%, #0f0f18 100%);
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    overscroll-behavior: contain;
}

.full-3d-builder.open { display: flex; }

.full-3d-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    background: linear-gradient(90deg, rgba(20, 30, 40, 0.99), rgba(30, 30, 42, 0.97));
    border-bottom: 1px solid rgba(232, 197, 85, 0.4);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 13px;
    z-index: 3;
    transform: translateZ(0);
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
}

.full-3d-header .f3d-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-display);
    font-size: 21px;
    font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #76b900, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    letter-spacing: 1.4px;
}

.full-3d-header .f3d-title .f3d-icon {
    width: 46px;
    height: 46px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.75),
        0 0 70px rgba(139, 107, 255, 0.45);
    animation: gradientMove 5.5s ease infinite;
    color: #06060b;
}

.full-3d-header .f3d-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.full-3d-header .f3d-actions button {
    padding: 11px 22px;
    border-radius: var(--radius-pill);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    border: 1px solid transparent;
    transition: transform 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s;
    font-family: var(--font-body);
    white-space: nowrap;
    letter-spacing: 0.38px;
}

.full-3d-header .f3d-btn-save {
    background: linear-gradient(135deg, #c5cde0, #6ee0ff);
    color: #06060b;
    border: none;
    box-shadow: 0 0 35px rgba(197, 205, 224, 0.6);
}

.full-3d-header .f3d-btn-save:hover {
    transform: scale(1.07) translateY(-2px);
    box-shadow: 0 0 60px rgba(197, 205, 224, 1);
}

.full-3d-header .f3d-btn-clear {
    background: transparent;
    border: 1.5px solid rgba(255, 179, 71, 0.6);
    color: #ffb347;
}

.full-3d-header .f3d-btn-clear:hover {
    background: rgba(255, 179, 71, 0.25);
    border-color: #ffb347;
    box-shadow: 0 0 30px rgba(255, 179, 71, 0.7);
}

.full-3d-header .f3d-btn-close {
    background: transparent;
    border: 1.5px solid rgba(255, 77, 94, 0.6);
    color: #ff4d5e;
}

.full-3d-header .f3d-btn-close:hover {
    background: rgba(255, 77, 94, 0.25);
    border-color: #ff4d5e;
    color: #fff;
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.7);
}

.full-3d-stage {
    flex: 1;
    position: relative;
    overflow: hidden;
    background: radial-gradient(ellipse 85% 65% at 50% 40%, rgba(232, 197, 85, 0.12) 0%, transparent 70%);
    touch-action: none;
    min-height: 0;
}

.full-3d-stage canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
    touch-action: none;
}

.full-3d-stage .f3d-hint {
    position: absolute;
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    color: rgba(220, 220, 235, 0.9);
    background: rgba(8, 12, 18, 0.82);
    padding: 9px 20px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(232, 197, 85, 0.35);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    pointer-events: none;
    z-index: 2;
    text-align: center;
    max-width: 90%;
    line-height: 1.65;
    transition: opacity 0.5s ease;
}

.full-3d-stage .f3d-info-badge {
    position: absolute;
    top: 18px;
    right: 20px;
    font-size: 12px;
    color: #e8c555;
    background: rgba(22, 10, 0, 0.85);
    padding: 9px 18px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(232, 197, 85, 0.5);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    pointer-events: none;
    z-index: 2;
    font-weight: 700;
    letter-spacing: 0.6px;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.35);
}

.full-3d-stage .f3d-dropzone-hint {
    position: absolute;
    inset: 26px;
    border: 2.5px dashed rgba(232, 197, 85, 0.32);
    border-radius: var(--radius-xl);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.full-3d-stage.dragover .f3d-dropzone-hint {
    opacity: 1;
    border-color: rgba(232, 197, 85, 0.9);
    background: rgba(232, 197, 85, 0.08);
    box-shadow: inset 0 0 60px rgba(232, 197, 85, 0.15);
}

.full-3d-stage .f3d-loading {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(8, 12, 18, 0.82);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 5;
    color: #e8c555;
    font-size: 15px;
    flex-direction: column;
    gap: 18px;
}

.full-3d-stage .f3d-loading.active { display: flex; }

.full-3d-stage .f3d-loading .spin {
    width: 52px;
    height: 52px;
    border: 3.5px solid rgba(232, 197, 85, 0.25);
    border-top-color: #e8c555;
    border-radius: 50%;
    animation: f3dSpin 1s linear infinite;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
}

@keyframes f3dSpin { to { transform: rotate(360deg); } }

.full-3d-palette {
    flex-shrink: 0;
    background: linear-gradient(180deg, rgba(15, 20, 26, 0.99), rgba(3, 3, 6, 0.99));
    border-top: 1.5px solid rgba(232, 197, 85, 0.4);
    padding: 16px 18px 20px;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 3;
    max-height: 46vh;
    display: flex;
    flex-direction: column;
    transform: translateZ(0);
    box-shadow: 0 -5px 40px rgba(0, 0, 0, 0.6);
}

.full-3d-palette .f3d-palette-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 13px;
    gap: 10px;
    flex-wrap: wrap;
}

.full-3d-palette .f3d-palette-header h4 {
    margin: 0;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff);
    background-size: 250% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-family: var(--font-display);
    font-size: 15px;
    letter-spacing: 2px;
    font-weight: 700;
    animation: gradientMove 5.5s ease infinite;
}

.full-3d-palette .f3d-palette-header .f3d-palette-hint {
    font-size: 11px;
    color: rgba(140, 140, 170, 0.8);
    font-style: italic;
}

.full-3d-shape-list {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 9px 2px 18px;
    scrollbar-width: auto;
    scrollbar-color: rgba(232, 197, 85, 0.65) rgba(232, 197, 85, 0.14);
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scroll-padding: 0 13px;
    touch-action: pan-x;
    overflow-anchor: none;
    scrollbar-gutter: stable;
}

.full-3d-shape-list::-webkit-scrollbar { height: 14px; }

.full-3d-shape-list::-webkit-scrollbar-track {
    background: rgba(232, 197, 85, 0.12);
    border-radius: 10px;
    margin: 0 9px;
}

.full-3d-shape-list::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, rgba(232, 197, 85, 0.8), rgba(139, 107, 255, 0.8), rgba(197, 205, 224, 0.8));
    border-radius: 10px;
    border: 2px solid rgba(15, 20, 26, 0.9);
    min-width: 48px;
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.4);
}

.full-3d-shape-list::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, rgba(232, 197, 85, 1), rgba(139, 107, 255, 1), rgba(197, 205, 224, 1));
}

.f3d-shape-item {
    flex: 0 0 auto;
    width: 96px;
    height: 106px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: linear-gradient(180deg, rgba(30, 20, 10, 0.8), rgba(15, 10, 5, 0.97));
    border: 1px solid rgba(232, 197, 85, 0.3);
    border-radius: var(--radius-lg);
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    touch-action: none;
    position: relative;
    overflow: hidden;
    scroll-snap-align: start;
}

.f3d-shape-item:active { cursor: grabbing; }

.f3d-shape-item:hover {
    border-color: #e8c555;
    transform: translateY(-6px);
    box-shadow:
        0 14px 40px rgba(232, 197, 85, 0.45),
        0 0 45px rgba(232, 197, 85, 0.25);
}

.f3d-shape-item .f3d-shape-icon {
    font-size: 36px;
    line-height: 1;
    filter: drop-shadow(0 0 12px rgba(232, 197, 85, 0.75));
    pointer-events: none;
}

.f3d-shape-item .f3d-shape-label {
    font-size: 10.5px;
    font-weight: 600;
    color: #dbdbe8;
    text-align: center;
    letter-spacing: 0.38px;
    pointer-events: none;
    padding: 0 5px;
    line-height: 1.25;
}

.f3d-shape-item.dragging {
    opacity: 0.45;
    transform: scale(0.9);
}

.f3d-shape-item::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 60%, rgba(232, 197, 85, 0.14) 100%);
    pointer-events: none;
    border-radius: inherit;
}

.f3d-drag-ghost {
    position: fixed;
    width: 96px;
    height: 106px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: linear-gradient(180deg, rgba(90, 60, 0, 0.97), rgba(30, 20, 10, 0.99));
    border: 2.5px solid #e8c555;
    border-radius: var(--radius-lg);
    pointer-events: none;
    z-index: 99999999;
    transform: translate(-50%, -50%);
    box-shadow:
        0 20px 70px rgba(232, 197, 85, 0.85),
        0 0 90px rgba(232, 197, 85, 0.55);
    opacity: 0.96;
}

.f3d-drag-ghost .f3d-shape-icon { font-size: 40px; }

.f3d-drag-ghost .f3d-shape-label {
    font-size: 12px;
    font-weight: 700;
    color: #e8c555;
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.8);
}

.f3d-selected-panel {
    position: absolute;
    top: 72px;
    left: 20px;
    background: linear-gradient(135deg, rgba(15, 20, 26, 0.97), rgba(3, 3, 10, 0.99));
    border: 1.5px solid rgba(232, 197, 85, 0.5);
    border-radius: var(--radius-xl);
    padding: 18px 20px;
    z-index: 4;
    min-width: 240px;
    max-width: 320px;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow:
        0 15px 55px rgba(0, 0, 0, 0.7),
        0 0 45px rgba(232, 197, 85, 0.22);
    display: none;
    font-size: 13px;
    color: #dbdbe8;
}

.f3d-selected-panel.open { display: block; }

.f3d-selected-panel .f3d-sp-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(232, 197, 85, 0.25);
}

.f3d-selected-panel .f3d-sp-title {
    font-weight: 700;
    color: #e8c555;
    font-size: 14px;
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.7);
}

.f3d-selected-panel .f3d-sp-close {
    background: none;
    border: none;
    color: #8ab4cc;
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
    transition: color 0.24s, transform 0.24s;
}

.f3d-selected-panel .f3d-sp-close:hover {
    color: #ff4d5e;
    transform: rotate(90deg);
}

.f3d-selected-panel .f3d-sp-row {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 15px;
}

.f3d-selected-panel .f3d-sp-row label {
    font-size: 11px;
    color: #8ab4cc;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    font-weight: 600;
}

.f3d-selected-panel .f3d-sp-row input[type="color"] {
    width: 100%;
    height: 40px;
    border-radius: 13px;
    border: 1px solid rgba(232, 197, 85, 0.32);
    background: #0f0f18;
    cursor: pointer;
    padding: 3px;
}

.f3d-selected-panel .f3d-sp-row input[type="range"] {
    width: 100%;
    accent-color: #e8c555;
    cursor: pointer;
}

.f3d-selected-panel .f3d-sp-row .f3d-sp-val {
    font-size: 11px;
    color: #c5cde0;
    text-align: right;
    font-family: var(--font-code);
    font-weight: 600;
}

.f3d-selected-panel .f3d-sp-actions {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.f3d-selected-panel .f3d-sp-actions button {
    flex: 1;
    padding: 9px 12px;
    border-radius: var(--radius-pill);
    border: 1px solid rgba(232, 197, 85, 0.5);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(139, 107, 255, 0.1));
    color: #e8c555;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s;
    font-family: var(--font-body);
    white-space: nowrap;
}

.f3d-selected-panel .f3d-sp-actions button:hover {
    background: rgba(232, 197, 85, 0.3);
    border-color: #e8c555;
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.6);
}

.f3d-selected-panel .f3d-sp-actions button.danger {
    border-color: rgba(255, 77, 94, 0.6);
    color: #ff4d5e;
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(230, 57, 70, 0.08));
}

.f3d-selected-panel .f3d-sp-actions button.danger:hover {
    background: rgba(255, 77, 94, 0.3);
    border-color: #ff4d5e;
    color: #fff;
    box-shadow: 0 0 25px rgba(255, 77, 94, 0.7);
}

/* ============================================================ */
/* [AETHRION] A27 API ANAHTAR SİSTEMİ                           */
/* ============================================================ */
.a27-api-section {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(139, 107, 255, 0.12));
    border: 2.5px solid var(--accent);
    border-radius: var(--radius-xl);
    padding: 30px;
    margin-top: 30px;
    contain: layout paint;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow:
        0 0 60px rgba(232, 197, 85, 0.3),
        0 0 120px rgba(139, 107, 255, 0.15),
        inset 0 0 85px rgba(232, 197, 85, 0.05);
    position: relative;
    overflow: hidden;
}

.a27-api-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        transparent
    );
    animation: a27Shine 4.5s linear infinite;
    box-shadow: 0 0 30px var(--accent);
}

.a27-api-section h3 {
    color: var(--accent);
    border: none;
    padding: 0;
    margin-bottom: 13px;
    font-size: 23px;
    text-shadow: 0 0 28px rgba(232, 197, 85, 0.7);
    display: flex;
    align-items: center;
    gap: 13px;
}

.a27-api-btn-create {
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    padding: 18px 40px;
    font-size: 16.5px;
    font-weight: 700;
    cursor: pointer;
    box-shadow:
        0 0 45px rgba(232, 197, 85, 0.6),
        0 0 90px rgba(139, 107, 255, 0.4),
        inset 0 0 20px rgba(255, 255, 255, 0.14);
    transition: transform 0.3s, box-shadow 0.3s;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.6px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
    position: relative;
    overflow: hidden;
}

.a27-api-btn-create::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    animation: a27Shine 3.8s linear infinite;
}

.a27-api-btn-create:hover {
    transform: scale(1.07) translateY(-3px);
    box-shadow:
        0 14px 70px rgba(232, 197, 85, 1),
        0 0 140px rgba(139, 107, 255, 0.7);
}

.a27-api-key-list {
    margin-top: 22px;
    max-height: 460px;
    overflow-y: auto;
    overflow-x: hidden;
    overflow-anchor: none;
}

.a27-api-key-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.4));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 17px 22px;
    margin-bottom: 13px;
    flex-wrap: wrap;
    gap: 13px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.a27-api-key-card:hover {
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.22);
}

.a27-api-key-card .a27-name {
    font-weight: 700;
    color: var(--text);
    font-size: 15px;
}

.a27-api-key-card .a27-masked {
    font-family: var(--font-code);
    font-size: 13.5px;
    color: var(--accent2);
    background: rgba(0, 0, 0, 0.5);
    padding: 7px 15px;
    border-radius: 13px;
    border: 1px solid rgba(197, 205, 224, 0.3);
    letter-spacing: 0.6px;
}

.a27-api-key-card .a27-duration {
    font-size: 12px;
    color: var(--text3);
}

.a27-api-key-card .a27-status {
    font-size: 12px;
    padding: 5px 15px;
    border-radius: var(--radius-pill);
    font-weight: 600;
    letter-spacing: 0.38px;
}

.a27-status-active {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.25), rgba(210, 210, 220, 0.14));
    color: var(--accent2);
    border: 1px solid rgba(197, 205, 224, 0.4);
}

.a27-status-expired {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.25), rgba(230, 57, 70, 0.14));
    color: var(--danger);
    border: 1px solid rgba(255, 77, 94, 0.4);
}

/* ============================================================ */
/* [AETHRION] AETHRION KOÇ ASİSTANI                             */
/* ============================================================ */
.aethrion-coach-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.6),
        0 0 70px rgba(139, 107, 255, 0.4),
        inset 0 0 14px rgba(255, 255, 255, 0.14);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    white-space: nowrap;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.38px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
}

.aethrion-coach-btn:hover {
    transform: translateY(-3px) scale(1.07);
    box-shadow:
        0 12px 55px rgba(232, 197, 85, 1),
        0 0 110px rgba(139, 107, 255, 0.7);
}

.aethrion-coach-btn:active {
    transform: scale(0.98);
}

.aethrion-coach-btn .coach-icon {
    font-size: 17px;
}

.aethrion-coach-btn .coach-limit-mini {
    font-size: 10.5px;
    padding: 3px 11px;
    border-radius: var(--radius-pill);
    background: rgba(0, 0, 0, 0.4);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.38px;
    box-shadow: inset 0 0 14px rgba(255, 255, 255, 0.08);
}

.coach-panel-overlay {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #030306, #0a0a12);
    z-index: 9999999;
    display: none;
    flex-direction: column;
    overflow: hidden;
    overscroll-behavior: none;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.coach-panel-overlay.open { display: flex; }

.coach-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 18px 24px;
    background: linear-gradient(90deg, rgba(20, 30, 40, 0.99), rgba(30, 30, 42, 0.97));
    border-bottom: 1px solid rgba(232, 197, 85, 0.4);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    flex-shrink: 0;
    flex-wrap: wrap;
    z-index: 3;
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
    position: relative;
}

.coach-panel-header::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 1.5px;
    background: linear-gradient(90deg, transparent, var(--accent), var(--platinum), var(--purple), transparent);
    opacity: 0.8;
}

.coach-panel-header .coach-header-left {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 0;
}

.coach-panel-header .coach-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.coach-panel-title {
    font-family: var(--font-display);
    font-size: 21px;
    font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    display: flex;
    align-items: center;
    gap: 13px;
    white-space: nowrap;
    letter-spacing: 1.4px;
}

.coach-panel-title .coach-title-icon {
    width: 46px;
    height: 46px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.75),
        0 0 70px rgba(139, 107, 255, 0.45);
    flex-shrink: 0;
    animation: gradientMove 5.5s ease infinite;
    color: #06060b;
}

.coach-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 11px 22px;
    background: transparent;
    border: 1.5px solid rgba(232, 197, 85, 0.6);
    color: #e8c555;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s;
    font-family: var(--font-body);
    white-space: nowrap;
    letter-spacing: 0.38px;
}

.coach-back-btn:hover {
    background: rgba(232, 197, 85, 0.24);
    border-color: #e8c555;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
}

.coach-share-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 11px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(255, 140, 0, 0.12));
    border: 1.5px solid rgba(232, 197, 85, 0.6);
    color: var(--gold);
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s;
    font-family: var(--font-body);
    white-space: nowrap;
    letter-spacing: 0.38px;
}

.coach-share-btn:hover {
    background: rgba(232, 197, 85, 0.4);
    border-color: var(--gold);
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.7);
}

.coach-limit-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 20px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(139, 107, 255, 0.12));
    border: 1.5px solid rgba(232, 197, 85, 0.5);
    color: var(--accent);
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.44px;
    white-space: nowrap;
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.3);
}

.coach-limit-badge.low {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.2), rgba(255, 140, 0, 0.12));
    border-color: rgba(255, 179, 71, 0.6);
    color: var(--warning);
    box-shadow: 0 0 25px rgba(255, 179, 71, 0.4);
}

.coach-limit-badge.danger {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.2), rgba(230, 57, 70, 0.14));
    border-color: rgba(255, 77, 94, 0.6);
    color: var(--danger);
    animation: coachLimitPulse 1.7s ease-in-out infinite;
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.55);
}

.coach-limit-badge.unlimited {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(255, 140, 0, 0.16));
    border-color: var(--gold);
    color: var(--gold);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.55);
}

@keyframes coachLimitPulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0.6; }
}

.coach-panel-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 22px;
    gap: 18px;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
}

.coach-chat-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-xl);
    overflow: hidden;
    min-height: 340px;
    flex-shrink: 0;
    contain: layout style;
    box-shadow: 0 0 45px rgba(232, 197, 85, 0.12);
}

.coach-chat-header {
    padding: 15px 22px;
    background: linear-gradient(90deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    border-bottom: 1px solid rgba(232, 197, 85, 0.25);
    font-size: 13px;
    color: var(--text3);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.coach-chat-header .coach-topic {
    color: var(--accent2);
    font-weight: 700;
    font-size: 14.5px;
    word-break: break-word;
    text-shadow: 0 0 14px rgba(197, 205, 224, 0.6);
}

.coach-chat-messages {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    background: rgba(0, 0, 0, 0.38);
    overscroll-behavior: contain;
    overflow-anchor: none;
    scroll-behavior: auto;
}

.coach-msg {
    max-width: 88%;
    padding: 15px 22px;
    border-radius: var(--radius-xl);
    font-size: 14.5px;
    line-height: 1.8;
    word-wrap: break-word;
    position: relative;
    box-shadow: 0 5px 24px rgba(0, 0, 0, 0.32);
}

.coach-msg.user {
    align-self: flex-end;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(139, 107, 255, 0.2));
    border: 1px solid rgba(232, 197, 85, 0.45);
    border-radius: var(--radius-xl) var(--radius-xl) 4px var(--radius-xl);
    text-align: right;
    color: #fff;
    box-shadow:
        0 5px 30px rgba(232, 197, 85, 0.35),
        inset 0 0 20px rgba(255, 255, 255, 0.08);
}

.coach-msg.coach {
    align-self: flex-start;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.14), rgba(197, 205, 224, 0.1));
    border: 1px solid rgba(232, 197, 85, 0.28);
    border-left: 3.5px solid var(--gold);
    border-radius: var(--radius-xl) var(--radius-xl) var(--radius-xl) 4px;
    color: #eaf2fa;
    box-shadow:
        0 5px 30px rgba(232, 197, 85, 0.22),
        inset 0 0 20px rgba(232, 197, 85, 0.05);
}

.coach-msg.coach .coach-msg-role {
    font-size: 11.5px;
    color: var(--gold);
    font-weight: 700;
    margin-bottom: 7px;
    display: flex;
    align-items: center;
    gap: 7px;
    letter-spacing: 0.44px;
    text-transform: uppercase;
    text-shadow: 0 0 14px rgba(232, 197, 85, 0.7);
}

.coach-msg.user .coach-msg-role {
    font-size: 11.5px;
    color: var(--accent);
    font-weight: 600;
    margin-bottom: 7px;
    letter-spacing: 0.44px;
    text-transform: uppercase;
}

.coach-msg .coach-msg-time {
    font-size: 10.5px;
    color: var(--text3);
    margin-top: 9px;
    opacity: 0.8;
    letter-spacing: 0.38px;
}

.coach-msg code {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    padding: 5px 11px;
    border-radius: 8px;
    font-family: var(--font-code);
    font-size: 12.5px;
    color: var(--accent2);
    border: 1px solid rgba(232, 197, 85, 0.22);
    display: inline-block;
    margin: 4px 0;
}

.coach-input-area {
    display: flex;
    gap: 10px;
    padding: 17px 20px;
    background: linear-gradient(90deg, rgba(15, 20, 26, 0.97), rgba(20, 20, 30, 0.97));
    border-top: 1px solid rgba(232, 197, 85, 0.32);
    align-items: center;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.coach-input {
    flex: 1;
    min-width: 180px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid rgba(232, 197, 85, 0.4);
    color: #fff;
    padding: 14px 22px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-family: var(--font-body);
    resize: none;
    max-height: 140px;
    min-height: 48px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.coach-input:focus {
    outline: none;
    border-color: #e8c555;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.55);
}

.coach-send-btn {
    padding: 14px 28px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-body);
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.55),
        inset 0 0 14px rgba(255, 255, 255, 0.14);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.38px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
}

.coach-send-btn:hover {
    transform: scale(1.07) translateY(-2px);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 1),
        0 0 110px rgba(139, 107, 255, 0.7);
}

.coach-send-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

.coach-history-wrap {
    flex-shrink: 0;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 20px 22px;
    max-height: 320px;
    display: flex;
    flex-direction: column;
    contain: layout style;
}

.coach-history-title {
    font-family: var(--font-display);
    font-size: 15px;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--border);
    padding-bottom: 13px;
    letter-spacing: 0.38px;
}

.coach-history-title .coach-history-note {
    font-size: 11px;
    font-weight: 400;
    color: var(--text3);
    font-style: italic;
}

.coach-history-list {
    display: flex;
    flex-direction: column;
    gap: 9px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
    max-height: 240px;
}

.coach-history-item {
    padding: 14px 19px;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.35));
    border: 1px solid rgba(232, 197, 85, 0.22);
    border-left: 3.5px solid var(--accent);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s;
    font-size: 13px;
    color: var(--text2);
    word-break: break-word;
}

.coach-history-item:hover {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.18), rgba(139, 107, 255, 0.1));
    border-left-color: var(--accent);
    color: #fff;
    transform: translateX(5px);
}

.coach-history-item.active {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.28), rgba(139, 107, 255, 0.15));
    border-left-color: var(--accent2);
    color: #fff;
    font-weight: 600;
}

.coach-history-item .coach-h-meta {
    font-size: 11px;
    color: var(--text3);
    margin-top: 7px;
    display: flex;
    gap: 13px;
    flex-wrap: wrap;
}

.coach-history-empty {
    text-align: center;
    padding: 26px;
    color: var(--text3);
    font-size: 13px;
    font-style: italic;
}

.coach-thinking {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 13px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(255, 140, 0, 0.06));
    border-left: 3.5px solid var(--gold);
    border-radius: var(--radius-lg);
    font-size: 13px;
    color: var(--text3);
    font-style: italic;
    align-self: flex-start;
    max-width: 88%;
}

.coach-thinking .coach-dot {
    width: 8px;
    height: 8px;
    background: var(--gold);
    border-radius: 50%;
    animation: coachThinkingDot 1.6s infinite ease-in-out both;
    box-shadow: 0 0 14px var(--gold);
}

.coach-thinking .coach-dot:nth-child(1) { animation-delay: -0.32s; }
.coach-thinking .coach-dot:nth-child(2) { animation-delay: -0.16s; }
.coach-thinking .coach-dot:nth-child(3) { animation-delay: 0s; }

@keyframes coachThinkingDot {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
    40%           { transform: scale(1);   opacity: 1; }
}

.coach-share-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.97);
    z-index: 99999999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.coach-share-modal-overlay.open { display: flex; }

.coach-share-modal {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--gold);
    border-radius: var(--radius-xl);
    padding: 36px 32px;
    width: 100%;
    max-width: 540px;
    max-height: 90vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow:
        0 0 100px rgba(232, 197, 85, 0.45),
        0 0 200px rgba(255, 140, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    animation: modalFadeIn 0.34s ease;
    position: relative;
}

.coach-share-modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 30px var(--gold);
}

.coach-share-modal h3 {
    font-family: var(--font-display);
    font-size: 23px;
    color: var(--gold);
    margin-bottom: 22px;
    text-align: center;
    text-shadow: 0 0 35px rgba(232, 197, 85, 0.7);
    letter-spacing: 0.38px;
}

.coach-share-info-box {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    border: 1px solid rgba(232, 197, 85, 0.4);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    font-size: 13px;
    color: #8ab4cc;
    line-height: 1.85;
    margin-bottom: 22px;
}

.coach-share-responsibility {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(230, 57, 70, 0.08));
    border: 1.5px solid rgba(255, 77, 94, 0.5);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    margin-bottom: 22px;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.2s ease, box-shadow 0.2s;
}

.coach-share-responsibility:hover {
    border-color: var(--danger);
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.45);
}

.coach-share-responsibility input[type="checkbox"] {
    margin-top: 3px;
    width: 22px;
    height: 22px;
    accent-color: var(--danger);
    cursor: pointer;
    flex-shrink: 0;
}

.coach-share-responsibility label {
    font-size: 13px;
    color: #ffb0b8;
    line-height: 1.7;
    cursor: pointer;
    flex: 1;
}

.coach-share-password-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}

.coach-share-password-row input {
    flex: 1;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 15px 20px;
    border-radius: var(--radius-lg);
    font-size: 15px;
    font-family: var(--font-code);
    letter-spacing: 2px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.coach-share-password-row input:focus {
    outline: none;
    border-color: var(--gold);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.5);
}

.coach-share-password-row .coach-pw-toggle {
    background: none;
    border: none;
    color: var(--text3);
    font-size: 21px;
    cursor: pointer;
    padding: 4px 10px;
    transition: color 0.24s, transform 0.24s;
}

.coach-share-password-row .coach-pw-toggle:hover {
    color: var(--gold);
    transform: scale(1.2);
}

.coach-share-generate-pw {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(255, 140, 0, 0.12));
    border: 1.5px solid rgba(232, 197, 85, 0.6);
    color: var(--gold);
    padding: 11px 20px;
    border-radius: var(--radius-md);
    font-size: 12.5px;
    cursor: pointer;
    font-weight: 600;
    margin-bottom: 22px;
    font-family: var(--font-body);
    transition: background-color 0.2s ease, box-shadow 0.2s;
    letter-spacing: 0.38px;
}

.coach-share-generate-pw:hover {
    background: rgba(232, 197, 85, 0.4);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
}

.coach-share-actions {
    display: flex;
    gap: 12px;
    margin-top: 18px;
}

.coach-share-actions button {
    flex: 1;
    padding: 16px;
    border-radius: var(--radius-lg);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-body);
    border: 1px solid transparent;
    transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s;
    letter-spacing: 0.38px;
}

.coach-share-actions .coach-share-create {
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.6);
    animation: btnGradientShift 5.5s ease infinite;
}

.coach-share-actions .coach-share-create:hover {
    transform: scale(1.04) translateY(-3px);
    box-shadow:
        0 0 60px rgba(232, 197, 85, 1),
        0 0 110px rgba(139, 107, 255, 0.7);
}

.coach-share-actions .coach-share-create:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

.coach-share-actions .coach-share-cancel {
    background: transparent;
    border: 1.5px solid var(--border2);
    color: var(--text3);
}

.coach-share-actions .coach-share-cancel:hover {
    border-color: var(--danger);
    color: var(--danger);
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.45);
}

.coach-share-result {
    margin-top: 22px;
    display: none;
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.12), rgba(232, 197, 85, 0.08));
    border: 1.5px solid rgba(197, 205, 224, 0.45);
    border-radius: var(--radius-lg);
    padding: 20px;
    font-size: 13px;
    line-height: 1.85;
    color: #dbdbe8;
    word-break: break-all;
}

.coach-share-result.show { display: block; }

.coach-share-result .coach-share-link,
.coach-share-result .coach-share-password-display {
    background: rgba(0, 0, 0, 0.55);
    padding: 11px 17px;
    border-radius: 13px;
    font-family: var(--font-code);
    font-size: 13px;
    margin: 9px 0;
    color: var(--accent2);
    user-select: all;
    display: block;
    overflow-wrap: anywhere;
    border: 1px solid rgba(197, 205, 224, 0.3);
}

.coach-share-result .coach-share-copy-btn {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(197, 205, 224, 0.14));
    border: 1.5px solid rgba(232, 197, 85, 0.5);
    color: var(--accent);
    padding: 9px 20px;
    border-radius: var(--radius-pill);
    font-size: 12px;
    cursor: pointer;
    font-weight: 600;
    margin-top: 9px;
    font-family: var(--font-body);
    transition: all 0.24s;
}

.coach-share-result .coach-share-copy-btn:hover {
    background: rgba(232, 197, 85, 0.4);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
}

/* ============================================================ */
/* MODERATÖR ATAMA BÖLÜMÜ                                       */
/* ============================================================ */
.moderator-assign-btn {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(245, 216, 120, 0.14));
    border: 1.5px solid var(--moderator);
    color: var(--moderator);
    padding: 12px 24px;
    border-radius: var(--radius-pill);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.24s ease;
    font-family: var(--font-body);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    letter-spacing: 0.38px;
}

.moderator-assign-btn:hover {
    background: rgba(232, 197, 85, 0.4);
    box-shadow: 0 0 40px rgba(232, 197, 85, 0.8), 0 0 80px rgba(232, 197, 85, 0.4);
    transform: translateY(-2px) scale(1.04);
}

.modal-moderator .modal-header h3 {
    color: var(--moderator);
    background: linear-gradient(135deg, #e8c555, #f5d878);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.modal-moderator .a27-form-input:focus {
    border-color: var(--moderator);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
}

#moderatorAssignSection {
    border: 2.5px solid var(--moderator) !important;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.08), rgba(245, 216, 120, 0.05)) !important;
    box-shadow: 0 0 60px rgba(232, 197, 85, 0.22);
}

#moderatorAssignSection h3 {
    color: var(--moderator) !important;
    border-bottom-color: rgba(232, 197, 85, 0.4) !important;
    text-shadow: 0 0 24px rgba(232, 197, 85, 0.6);
}

/* ============================================================ */
/* [AETHRION] LOGS PANELİ                                       */
/* ============================================================ */
.logs-panel-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.99);
    z-index: 99999998;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.logs-panel-overlay.open { display: flex; }

.logs-panel {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--accent);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 1000px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow:
        0 0 100px rgba(232, 197, 85, 0.4),
        0 0 200px rgba(139, 107, 255, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.logs-panel::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        var(--nvidia),
        transparent
    );
    box-shadow: 0 0 30px var(--accent);
    z-index: 1;
}

.logs-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px 28px;
    border-bottom: 1px solid var(--border2);
    flex-shrink: 0;
    gap: 15px;
    flex-wrap: wrap;
}

.logs-panel-header h3 {
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 23px;
    margin: 0;
    text-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
    display: flex;
    align-items: center;
    gap: 13px;
    letter-spacing: 0.38px;
}

.logs-panel-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 22px 26px;
    background: rgba(0, 0, 0, 0.5);
    font-family: var(--font-code);
    font-size: 13px;
    line-height: 1.85;
}

.logs-entry {
    padding: 11px 17px;
    margin-bottom: 7px;
    border-radius: 10px;
    border-left: 3.5px solid var(--border2);
    background: rgba(0, 0, 0, 0.4);
    word-break: break-word;
    display: flex;
    gap: 15px;
    align-items: flex-start;
}

.logs-entry-time {
    color: var(--text4);
    font-size: 11.5px;
    flex-shrink: 0;
    min-width: 145px;
}

.logs-entry.log-info {
    border-left-color: var(--accent);
    color: var(--text2);
}

.logs-entry.log-success {
    border-left-color: var(--accent2);
    color: #dbdbe8;
    background: rgba(197, 205, 224, 0.05);
}

.logs-entry.log-warning {
    border-left-color: var(--warning);
    color: #ffd58a;
    background: rgba(255, 179, 71, 0.06);
}

.logs-entry.log-error {
    border-left-color: var(--danger);
    color: #ffb0b8;
    background: rgba(255, 77, 94, 0.07);
}

.logs-entry.log-critical {
    border-left-color: #ff00cc;
    color: #ff99ff;
    background: linear-gradient(90deg, rgba(255, 0, 204, 0.12), transparent);
    box-shadow: 0 0 30px rgba(255, 0, 204, 0.22);
    animation: logsCriticalPulse 2.4s ease-in-out infinite;
}

@keyframes logsCriticalPulse {
    0%, 100% { box-shadow: 0 0 30px rgba(255, 0, 204, 0.22); }
    50%      { box-shadow: 0 0 50px rgba(255, 0, 204, 0.5); }
}

.logs-panel-actions {
    display: flex;
    gap: 10px;
    padding: 17px 26px;
    border-top: 1px solid var(--border2);
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.4);
}

.logs-empty {
    text-align: center;
    padding: 75px 24px;
    color: var(--text3);
    font-style: italic;
}

/* ============================================================ */
/* [AETHRION] VİDEO STÜDYO                                     */
/* ============================================================ */
.video-studio-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.99);
    z-index: 99999998;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.video-studio-overlay.open { display: flex; }

.video-studio {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--accent3);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 1050px;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    box-shadow:
        0 0 100px rgba(255, 138, 92, 0.4),
        0 0 200px rgba(255, 77, 94, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.video-studio::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--accent3), var(--ice), var(--purple), transparent);
    box-shadow: 0 0 30px var(--accent3);
    z-index: 1;
}

.video-studio-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 30px;
    border-bottom: 1px solid var(--border2);
    flex-shrink: 0;
    gap: 15px;
    flex-wrap: wrap;
}

.video-studio-header h3 {
    color: var(--accent3);
    font-family: var(--font-display);
    font-size: 26px;
    margin: 0;
    text-shadow: 0 0 30px rgba(255, 138, 92, 0.7);
    display: flex;
    align-items: center;
    gap: 13px;
    letter-spacing: 0.38px;
}

.video-studio-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 28px 30px;
}

.video-studio-form {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.video-studio-form label {
    font-size: 14px;
    color: var(--text2);
    font-weight: 600;
    margin-bottom: 7px;
    display: block;
    letter-spacing: 0.38px;
}

.video-studio-form input[type="text"],
.video-studio-form textarea,
.video-studio-form select {
    width: 100%;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 15px 20px;
    border-radius: var(--radius-lg);
    font-size: 14px;
    font-family: var(--font-body);
    transition: border-color 0.24s, box-shadow 0.24s;
}

.video-studio-form input:focus,
.video-studio-form textarea:focus,
.video-studio-form select:focus {
    outline: none;
    border-color: var(--accent3);
    box-shadow: 0 0 30px rgba(255, 138, 92, 0.55);
}

.video-studio-form textarea {
    min-height: 160px;
    resize: vertical;
    line-height: 1.75;
}

.video-studio-actions {
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    padding-top: 9px;
    flex-wrap: wrap;
}

.video-studio-preview {
    margin-top: 22px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px;
    min-height: 100px;
    color: var(--text3);
    font-size: 14px;
    line-height: 1.8;
}

/* ============================================================ */
/* [AETHRION] A27 API REHBER MODALI                             */
/* ============================================================ */
.a27-api-guide-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.99);
    z-index: 99999998;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.a27-api-guide-overlay.open { display: flex; }

.a27-api-guide {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--gold);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 1050px;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    box-shadow:
        0 0 100px rgba(232, 197, 85, 0.45),
        0 0 200px rgba(255, 140, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.a27-api-guide::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--gold), var(--accent3), var(--ice), transparent);
    box-shadow: 0 0 30px var(--gold);
    z-index: 1;
}

.a27-api-guide-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 30px;
    border-bottom: 1px solid rgba(232, 197, 85, 0.32);
    flex-shrink: 0;
    gap: 15px;
    flex-wrap: wrap;
}

.a27-api-guide-header h3 {
    color: var(--gold);
    font-family: var(--font-display);
    font-size: 26px;
    margin: 0;
    text-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
    display: flex;
    align-items: center;
    gap: 13px;
    letter-spacing: 0.38px;
}

.a27-api-guide-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 28px 30px;
    line-height: 1.95;
    font-size: 14.5px;
    color: var(--text2);
}

.a27-api-guide-body h4 {
    color: var(--gold);
    font-size: 19px;
    margin: 28px 0 15px 0;
    border-bottom: 1px solid rgba(232, 197, 85, 0.25);
    padding-bottom: 11px;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: 0.28px;
}

.a27-api-guide-body h4:first-child {
    margin-top: 0;
}

.a27-api-guide-body p {
    margin: 15px 0;
}

.a27-api-guide-body ul,
.a27-api-guide-body ol {
    margin: 15px 0 15px 26px;
}

.a27-api-guide-body li {
    margin: 10px 0;
}

.a27-api-guide-body code {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.16), rgba(139, 107, 255, 0.12));
    padding: 5px 12px;
    border-radius: 7px;
    font-family: var(--font-code);
    font-size: 13px;
    color: var(--accent2);
    border: 1px solid rgba(232, 197, 85, 0.25);
    display: inline-block;
    margin: 2px 0;
}

.a27-api-guide-body pre {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 1px solid rgba(232, 197, 85, 0.25);
    border-radius: var(--radius-md);
    padding: 20px;
    font-family: var(--font-code);
    font-size: 13px;
    color: var(--accent2);
    overflow-x: auto;
    margin: 18px 0;
    white-space: pre-wrap;
    word-break: break-word;
    box-shadow: inset 0 0 30px rgba(232, 197, 85, 0.08);
}

.a27-api-guide-body .guide-note {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(255, 140, 0, 0.08));
    border-left: 3.5px solid var(--gold);
    border-radius: 13px;
    padding: 18px 22px;
    margin: 20px 0;
    font-size: 14px;
    color: #ffd58a;
    line-height: 1.8;
}

/* ============================================================ */
/* [AETHRION] SESLİ SOHBET DASHBOARD BUTONU                     */
/* ============================================================ */
.voice-chat-dashboard-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #6ee0ff, #c5cde0, #8b6bff, #e8c555);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 14.5px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 40px rgba(110, 224, 255, 0.6),
        0 0 80px rgba(139, 107, 255, 0.4),
        inset 0 0 17px rgba(255, 255, 255, 0.14);
    transition: transform 0.3s, box-shadow 0.3s;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.6px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
}

.voice-chat-dashboard-btn:hover {
    transform: translateY(-4px) scale(1.07);
    box-shadow:
        0 14px 60px rgba(110, 224, 255, 1),
        0 0 120px rgba(139, 107, 255, 0.7);
}

/* ============================================================ */
/* A27 API FORM ELEMANLARI                                      */
/* ============================================================ */
#a27ApiKeyGeneratorModal .modal {
    max-width: 640px;
}

.a27-form-label {
    display: block;
    font-size: 13px;
    color: var(--text3);
    margin-bottom: 8px;
    font-weight: 600;
    letter-spacing: 0.28px;
}

.a27-form-input {
    width: 100%;
    padding: 15px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    border-radius: var(--radius-lg);
    margin-bottom: 22px;
    font-size: 14.5px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.a27-form-input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45);
}

.a27-duration-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.a27-duration-btn {
    flex: 1;
    min-width: 110px;
    padding: 13px 12px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1.5px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: background-color 0.24s, border-color 0.24s, color 0.24s, box-shadow 0.24s;
    font-family: var(--font-body);
    letter-spacing: 0.28px;
}

.a27-duration-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.45);
}

.a27-duration-btn.active {
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border-color: transparent;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.8),
        0 0 70px rgba(139, 107, 255, 0.45),
        inset 0 0 14px rgba(255, 255, 255, 0.14);
    animation: btnGradientShift 5.5s ease infinite;
    font-weight: 700;
}

#a27ApiKeyCreatedModal .modal {
    max-width: 580px;
}

.a27-key-display {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 2.5px solid var(--accent2);
    border-radius: var(--radius-lg);
    padding: 22px;
    font-family: var(--font-code);
    font-size: 17px;
    color: var(--accent2);
    word-break: break-all;
    text-align: center;
    margin: 22px 0;
    letter-spacing: 2px;
    box-shadow:
        0 0 50px rgba(197, 205, 224, 0.45),
        inset 0 0 30px rgba(197, 205, 224, 0.08);
    user-select: all;
    font-weight: 600;
    position: relative;
}

.a27-copy-btn {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(197, 205, 224, 0.2));
    border: 1.5px solid var(--accent);
    color: var(--accent);
    padding: 13px 30px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    font-weight: 700;
    font-size: 15px;
    font-family: var(--font-body);
    transition: background-color 0.24s, color 0.24s, box-shadow 0.24s, transform 0.24s;
    letter-spacing: 0.6px;
}

.a27-copy-btn:hover {
    background: var(--accent);
    color: #06060b;
    box-shadow: 0 0 45px rgba(232, 197, 85, 1);
    transform: translateY(-3px);
}

.a27-warning-box {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.16), rgba(230, 57, 70, 0.12));
    border: 1.5px solid var(--danger);
    color: #ffb0b8;
    border-radius: var(--radius-lg);
    padding: 18px 22px;
    font-size: 14px;
    line-height: 1.8;
    text-align: center;
    box-shadow: 0 0 35px rgba(255, 77, 94, 0.28);
}

/* ============================================================ */
/* YORUMLAR — DASHBOARD STATİK LİSTE                             */
/* ============================================================ */
.comments-list-static {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    animation: none !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
}

.comments-list-static .comment-item {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    cursor: default !important;
}

/* Yorum Aksiyon Butonları */
.comment-actions {
    display: flex;
    gap: 7px;
    margin-top: 13px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.comment-edit-btn,
.comment-delete-btn {
    padding: 7px 18px;
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: 1.5px solid;
    font-family: var(--font-body);
    transition: all 0.24s ease;
    letter-spacing: 0.28px;
}

.comment-edit-btn {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.14), rgba(255, 140, 0, 0.08));
    border-color: rgba(255, 179, 71, 0.5);
    color: var(--warning);
}

.comment-edit-btn:hover {
    background: linear-gradient(135deg, rgba(255, 179, 71, 0.35), rgba(255, 140, 0, 0.25));
    border-color: var(--warning);
    color: #fff;
    box-shadow: 0 0 22px rgba(255, 179, 71, 0.7);
    transform: translateY(-1px);
}

.comment-delete-btn {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(230, 57, 70, 0.08));
    border-color: rgba(255, 77, 94, 0.5);
    color: var(--danger);
}

.comment-delete-btn:hover {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.35), rgba(230, 57, 70, 0.25));
    border-color: var(--danger);
    color: #fff;
    box-shadow: 0 0 22px rgba(255, 77, 94, 0.7);
    transform: translateY(-1px);
}

/* ============================================================ */
/* MODERATÖR EK STİLLERİ                                        */
/* ============================================================ */
.moderator-assign-btn {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(245, 216, 120, 0.14));
    border: 1.5px solid var(--moderator);
    color: var(--moderator);
    padding: 12px 24px;
    border-radius: var(--radius-pill);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    font-family: var(--font-body);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    letter-spacing: 0.38px;
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.4);
}

.moderator-assign-btn:hover {
    background: rgba(232, 197, 85, 0.4);
    box-shadow:
        0 0 45px rgba(232, 197, 85, 0.9),
        0 0 90px rgba(232, 197, 85, 0.45);
    transform: translateY(-3px) scale(1.04);
}

/* ============================================================ */
/* AETHRION AL PANEL EK CSS                                     */
/* ============================================================ */
.aa-mode-deep .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(0, 30, 60, 0.24), rgba(0, 15, 30, 0.2));
}

.aa-mode-agent .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(60, 20, 0, 0.22), rgba(30, 10, 0, 0.2));
}

.aa-mode-developer .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(40, 30, 0, 0.22), rgba(20, 15, 0, 0.2));
}

.aa-mode-deep .aethrion-al-input-area textarea:focus {
    border-color: #6ee0ff;
    box-shadow: 0 0 30px rgba(110, 224, 255, 0.7);
}

.aa-mode-agent .aethrion-al-input-area textarea:focus {
    border-color: #ff8a5c;
    box-shadow: 0 0 30px rgba(255, 138, 92, 0.7);
}

.aa-mode-developer .aethrion-al-input-area textarea:focus {
    border-color: #c5cde0;
    box-shadow: 0 0 30px rgba(197, 205, 224, 0.7);
}

.aethrion-al-panel.open ~ .aethrion-al-trigger {
    opacity: 0.3;
}

@media (max-width: 1024px) and (min-width: 769px) {
    .aethrion-al-panel {
        width: 44%;
        min-width: 380px;
    }
}

/* ============================================================ */
/* LOGS PANEL EK STİLLERİ                                        */
/* ============================================================ */
.logs-panel-header .logs-filter-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.logs-filter-btn {
    padding: 8px 18px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.24s ease;
    font-family: var(--font-body);
    letter-spacing: 0.38px;
}

.logs-filter-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.45);
}

.logs-filter-btn.active {
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff);
    background-size: 250% 250%;
    color: #06060b;
    border-color: transparent;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
    animation: btnGradientShift 5.5s ease infinite;
}

/* ============================================================ */
/* VIDEO STUDIO EK STİLLERİ                                      */
/* ============================================================ */
.video-studio-video-preview {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text3);
    font-size: 15px;
    margin-bottom: 22px;
    overflow: hidden;
    box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.7);
    position: relative;
}

.video-studio-video-preview video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.video-studio-video-preview .preview-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    color: var(--text3);
}

.video-studio-video-preview .preview-placeholder .placeholder-icon {
    font-size: 68px;
    opacity: 0.5;
    filter: drop-shadow(0 0 25px rgba(232, 197, 85, 0.55));
}

.video-studio-progress {
    height: 10px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 9px;
    overflow: hidden;
    margin-top: 18px;
    display: none;
}

.video-studio-progress.active { display: block; }

.video-studio-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 100%;
    animation: btnGradientShift 3.5s linear infinite;
    border-radius: 9px;
    transition: width 0.34s ease;
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.7);
}

/* ============================================================ */
/* A27 API REHBER EK STİLLERİ                                   */
/* ============================================================ */
.a27-api-guide-body .guide-step-list {
    counter-reset: step-counter;
    list-style: none;
    padding: 0;
    margin: 22px 0;
}

.a27-api-guide-body .guide-step-list li {
    counter-increment: step-counter;
    position: relative;
    padding: 18px 18px 18px 70px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border-left: 3.5px solid var(--gold);
    border-radius: var(--radius-md);
    margin-bottom: 13px;
    line-height: 1.8;
}

.a27-api-guide-body .guide-step-list li::before {
    content: counter(step-counter);
    position: absolute;
    left: 17px;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold), var(--accent3));
    color: #06060b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 15px;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
}

.a27-api-guide-body .guide-highlight {
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.12), rgba(232, 197, 85, 0.08));
    border-left: 3.5px solid var(--accent2);
    border-radius: 13px;
    padding: 18px 22px;
    margin: 18px 0;
    font-size: 14px;
    color: #dbdbe8;
}

.a27-api-guide-body .guide-highlight strong {
    color: var(--accent2);
}

/* ============================================================ */
/* SESLİ SOHBET DASHBOARD EK STİLLERİ                            */
/* ============================================================ */
.voice-chat-card {
    background: linear-gradient(135deg, rgba(110, 224, 255, 0.12), rgba(139, 107, 255, 0.1));
    border: 1.5px solid rgba(110, 224, 255, 0.4);
    border-radius: var(--radius-xl);
    padding: 26px;
    display: flex;
    align-items: center;
    gap: 22px;
    flex-wrap: wrap;
    box-shadow: 0 0 45px rgba(110, 224, 255, 0.22);
    transition: all 0.3s ease;
}

.voice-chat-card:hover {
    border-color: var(--ice);
    box-shadow: 0 0 65px rgba(110, 224, 255, 0.45);
    transform: translateY(-3px);
}

.voice-chat-card .voice-card-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, #6ee0ff, #c5cde0, #8b6bff, #e8c555);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: #06060b;
    box-shadow:
        0 0 40px rgba(110, 224, 255, 0.8),
        0 0 80px rgba(139, 107, 255, 0.55);
    animation: btnGradientShift 5.5s ease infinite;
    flex-shrink: 0;
}

.voice-chat-card .voice-card-info {
    flex: 1;
    min-width: 220px;
}

.voice-chat-card .voice-card-info h4 {
    color: var(--ice);
    font-family: var(--font-display);
    font-size: 19px;
    margin-bottom: 8px;
    letter-spacing: -0.22px;
    text-shadow: 0 0 24px rgba(110, 224, 255, 0.7);
}

.voice-chat-card .voice-card-info p {
    color: var(--text2);
    font-size: 13px;
    line-height: 1.7;
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE (CSS-3/B) — TABLET 768px              */
/* ============================================================ */
@media (max-width: 768px) {
    #mainSite { padding-top: 50px; }
    nav { top: 50px !important; }

    .team-page-overlay { padding: 14px; }
    .team-page-header h2 { font-size: 20px; }
    .team-page-body { gap: 13px; }
    .team-page-info {
        font-size: 13px;
        padding: 11px 14px;
        gap: 11px;
    }
    .team-page-chat {
        min-height: 340px;
        max-height: 480px;
        padding: 14px;
    }
    .team-page-chat .team-chat-messages {
        min-height: 210px;
        max-height: 380px;
    }
    .team-page-middle {
        grid-template-columns: 1fr 1fr !important;
        gap: 13px !important;
    }
    .team-page-middle .team-page-card { max-height: 220px; }
    .team-page-bottom {
        grid-template-columns: 1fr 1fr !important;
        gap: 13px !important;
    }
    .team-page-bottom .team-page-card { max-height: 200px; }
    .team-page-card { padding: 13px !important; }
    .team-page-card h4 { font-size: 13px !important; }
    .member-item { font-size: 12px !important; }
    .team-page-actions .glow-input {
        font-size: 12px !important;
        padding: 6px 10px !important;
        height: 34px !important;
    }
    .team-page-actions .btn-sm {
        font-size: 11px !important;
        padding: 6px 12px !important;
    }

    #teamPageFounderPanel > div {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    #teamPageFounderPanel .btn-secondary {
        width: 100% !important;
        text-align: center !important;
    }
    #teamPageFounderPanel #teamSearchInput {
        width: 100% !important;
        min-width: unset !important;
    }

    .admin-login-screen { padding: 14px !important; }
    .admin-login-wrapper {
        gap: 16px !important;
        padding: 14px !important;
    }
    .admin-login-box {
        padding: 28px !important;
        max-width: 400px !important;
        margin: 8px !important;
    }
    .admin-login-title { font-size: 26px !important; }

    .api-key-card { padding: 15px 17px !important; }
    .api-key-card .api-key-name { font-size: 14px !important; }
    .api-key-card .api-key-value { font-size: 12px !important; }
    .api-password-screen { padding: 26px 18px !important; }
    .api-password-screen .lock-icon { font-size: 64px !important; }
    .api-password-screen h3 { font-size: 21px !important; }
    .ai-msg-actions button { font-size: 10.5px !important; padding: 5px 10px !important; }

    .contest-page-overlay { padding: 18px; }
    .contest-page-header h2 { font-size: 23px !important; }
    .contest-ranking-row { padding: 11px 14px !important; }
    .contest-ranking-name { font-size: 14px !important; }
    .contest-ranking-points { font-size: 15.5px !important; }
    .contest-action-row .btn { min-width: 170px; font-size: 14px !important; }
    .contest-project-card { padding: 15px !important; }
    .contest-review-content pre { font-size: 13px !important; }

    .full-3d-header {
        padding: 11px 15px;
        gap: 8px;
    }
    .full-3d-header .f3d-title { font-size: 18px; }
    .full-3d-header .f3d-title .f3d-icon {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }
    .full-3d-header .f3d-actions button {
        padding: 9px 16px;
        font-size: 12px;
    }
    .full-3d-palette {
        padding: 11px 13px 15px;
        max-height: 42vh;
    }
    .f3d-shape-item {
        width: 84px;
        height: 94px;
    }
    .f3d-shape-item .f3d-shape-icon { font-size: 32px; }
    .f3d-shape-item .f3d-shape-label { font-size: 10px; }
    .f3d-selected-panel {
        min-width: 210px;
        max-width: 260px;
        padding: 13px 15px;
        top: 66px;
        left: 13px;
    }

    .aethrion-coach-btn {
        font-size: 12px;
        padding: 9px 17px;
    }
    .aethrion-coach-btn .coach-icon { font-size: 15px; }
    .coach-panel-header {
        padding: 13px 17px;
        gap: 10px;
    }
    .coach-panel-title { font-size: 18px; }
    .coach-panel-title .coach-title-icon {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }
    .coach-back-btn,
    .coach-share-btn {
        font-size: 12px;
        padding: 9px 15px;
    }
    .coach-limit-badge {
        font-size: 11px;
        padding: 8px 14px;
    }
    .coach-panel-body {
        padding: 15px;
        gap: 13px;
    }
    .coach-chat-wrap {
        border-radius: 22px;
    }
    .coach-chat-messages {
        padding: 15px;
        gap: 11px;
    }
    .coach-msg {
        font-size: 13.5px;
        padding: 13px 17px;
        max-width: 92%;
    }
    .coach-history-wrap {
        padding: 13px 15px;
        max-height: 280px;
    }
    .coach-history-list { max-height: 210px; }
    .coach-share-modal {
        padding: 28px 26px;
        border-radius: 26px;
    }
    .coach-share-modal h3 { font-size: 21px; }

    .full-3d-shape-list::-webkit-scrollbar { height: 16px; }
    .full-3d-shape-list::-webkit-scrollbar-thumb {
        border: 3px solid rgba(15, 20, 26, 0.9);
        min-width: 64px;
    }

    .logs-panel, .video-studio, .a27-api-guide {
        max-width: 100% !important;
        max-height: 95vh !important;
        border-radius: 24px !important;
    }
    .logs-panel-header, .video-studio-header, .a27-api-guide-header {
        padding: 20px 22px !important;
    }
    .logs-panel-header h3, .video-studio-header h3, .a27-api-guide-header h3 {
        font-size: 19px !important;
    }
    .logs-panel-body { padding: 16px 19px !important; font-size: 12.5px !important; }
    .video-studio-body, .a27-api-guide-body {
        padding: 22px 24px !important;
        font-size: 13.5px !important;
    }
    .a27-api-guide-body h4 { font-size: 16px !important; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE (CSS-3/B) — TELEFON 480px             */
/* ============================================================ */
@media (max-width: 480px) {
    #mainSite { padding-top: 54px; }
    nav { top: 54px !important; }

    .team-page-overlay { padding: 11px; }
    .team-page-header {
        padding-bottom: 13px !important;
        gap: 10px !important;
    }
    .team-page-header h2 { font-size: 18px !important; }
    .team-page-close { font-size: 30px !important; }
    .team-page-body { gap: 13px !important; }
    .team-page-info {
        font-size: 12px !important;
        padding: 9px 11px !important;
        gap: 8px !important;
    }
    .team-page-info .team-code { font-size: 12px !important; }
    .team-page-chat {
        padding: 11px !important;
        min-height: 300px !important;
        max-height: 440px !important;
    }
    .team-page-chat .team-chat-messages {
        min-height: 190px !important;
        max-height: 340px !important;
    }
    .team-page-middle {
        grid-template-columns: 1fr !important;
        gap: 11px !important;
    }
    .team-page-middle .team-page-card { max-height: 190px !important; }
    .team-page-bottom {
        grid-template-columns: 1fr !important;
        gap: 11px !important;
    }
    .team-page-bottom .team-page-card { max-height: 180px !important; }
    .team-page-card { padding: 11px !important; }
    .team-page-card h4 { font-size: 12px !important; margin-bottom: 7px !important; }
    .member-item { font-size: 11px !important; padding: 3px 0 !important; }
    .team-page-actions { gap: 9px !important; }
    .team-page-actions .btn-sm {
        font-size: 10.5px !important;
        padding: 6px 10px !important;
        flex: 1 1 calc(50% - 5px) !important;
    }
    .team-page-actions .glow-input {
        font-size: 11px !important;
        padding: 6px 10px !important;
        height: 34px !important;
        flex: 1 1 100% !important;
    }

    #teamPageFounderPanel h4 { font-size: 14px !important; }
    #teamPageFounderPanel .btn-secondary {
        font-size: 11px !important;
        padding: 9px 13px !important;
    }
    #teamPageFounderPanel #teamSearchInput {
        font-size: 11px !important;
        height: 34px !important;
    }

    .admin-login-screen { padding: 12px !important; }
    .admin-login-wrapper {
        gap: 13px !important;
        padding: 11px !important;
    }
    .admin-login-box {
        padding: 22px !important;
        max-width: 340px !important;
        border-radius: 24px !important;
        margin: 5px !important;
    }
    .admin-login-box > div:first-child { font-size: 44px !important; }
    .admin-login-box > div:nth-child(2) { font-size: 20px !important; }
    .admin-login-box > div:nth-child(3) { font-size: 12.5px !important; }
    .admin-login-title { font-size: 22px !important; }

    .api-key-card { padding: 13px 15px !important; margin-bottom: 11px !important; }
    .api-key-card .api-key-name { font-size: 13px !important; margin-bottom: 9px !important; }
    .api-key-card .api-key-value { font-size: 11px !important; padding: 8px 11px !important; }
    .api-key-card .api-key-actions button {
        font-size: 11px !important;
        padding: 6px 12px !important;
    }
    .api-password-screen { padding: 22px 14px !important; gap: 16px !important; }
    .api-password-screen .lock-icon { font-size: 56px !important; }
    .api-password-screen h3 { font-size: 19px !important; }
    .api-password-screen p { font-size: 12.5px !important; }
    .api-password-screen input { font-size: 15px !important; padding: 13px !important; }

    .ai-msg-actions { gap: 6px !important; margin-top: 9px !important; }
    .ai-msg-actions button { font-size: 10.5px !important; padding: 5px 9px !important; }

    .team-msg-actions { gap: 3px !important; }
    .team-msg-actions button { font-size: 11px !important; padding: 3px 7px !important; }

    .contest-page-overlay { padding: 13px !important; }
    .contest-page-header {
        padding-bottom: 13px !important;
        gap: 10px !important;
        margin-bottom: 13px !important;
    }
    .contest-page-header h2 { font-size: 19px !important; }
    .contest-page-close { font-size: 12.5px !important; padding: 6px 14px !important; }
    .contest-section { padding: 16px !important; border-radius: 16px !important; }
    .contest-section h3 { font-size: 16px !important; margin-bottom: 11px !important; }
    .contest-ranking-row {
        padding: 9px 11px !important;
        font-size: 12px !important;
    }
    .contest-ranking-name { font-size: 12px !important; }
    .contest-ranking-email { font-size: 10.5px !important; }
    .contest-ranking-points { font-size: 13.5px !important; }
    .contest-action-row { flex-direction: column !important; gap: 11px !important; }
    .contest-action-row .btn {
        width: 100% !important;
        min-width: unset !important;
        font-size: 13.5px !important;
        padding: 13px !important;
    }
    .contest-warning-box { padding: 18px !important; }
    .contest-warning-box h4 { font-size: 16.5px !important; }
    .contest-warning-box .user-info-row {
        font-size: 12px !important;
        padding: 11px 13px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }
    .contest-project-card {
        padding: 13px !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .contest-project-card .project-info-actions { flex-direction: column !important; }
    .contest-project-card .project-info-actions .btn { width: 100% !important; }
    .contest-review-content pre { font-size: 12.5px !important; padding: 13px !important; }
    .contest-project-form textarea { font-size: 13px !important; min-height: 220px !important; }
    .contest-project-form label { font-size: 13px !important; }

    .full-3d-header {
        padding: 9px 11px;
        gap: 6px;
        flex-direction: column;
        align-items: stretch;
    }
    .full-3d-header .f3d-title {
        justify-content: center;
        font-size: 16px;
    }
    .full-3d-header .f3d-title .f3d-icon {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
    .full-3d-header .f3d-actions {
        justify-content: center;
        gap: 6px;
    }
    .full-3d-header .f3d-actions button {
        padding: 8px 13px;
        font-size: 11px;
        flex: 1 1 calc(33.333% - 5px);
        min-width: 0;
        text-align: center;
    }
    .full-3d-palette {
        padding: 9px 9px 13px;
        max-height: 40vh;
    }
    .full-3d-palette .f3d-palette-header h4 { font-size: 12px; }
    .full-3d-palette .f3d-palette-header .f3d-palette-hint {
        font-size: 10px;
        display: none;
    }
    .f3d-shape-item {
        width: 74px;
        height: 84px;
        border-radius: 14px;
    }
    .f3d-shape-item .f3d-shape-icon { font-size: 26px; }
    .f3d-shape-item .f3d-shape-label { font-size: 9px; }
    .f3d-selected-panel {
        min-width: 190px;
        max-width: 230px;
        padding: 11px 13px;
        top: 60px;
        left: 9px;
        font-size: 12px;
    }
    .f3d-selected-panel .f3d-sp-title { font-size: 12px; }
    .f3d-selected-panel .f3d-sp-actions button {
        font-size: 10px;
        padding: 6px 8px;
    }
    .full-3d-stage .f3d-hint {
        font-size: 10px;
        padding: 7px 13px;
        top: 11px;
    }
    .full-3d-stage .f3d-info-badge {
        font-size: 10px;
        padding: 7px 11px;
        top: 11px;
        right: 11px;
    }

    .full-3d-shape-list {
        padding: 9px 2px 18px;
        gap: 11px;
    }
    .full-3d-shape-list::-webkit-scrollbar { height: 18px; }
    .full-3d-shape-list::-webkit-scrollbar-thumb {
        border: 3px solid rgba(15, 20, 26, 0.9);
        min-width: 72px;
        border-radius: 12px;
    }
    .full-3d-shape-list::-webkit-scrollbar-track {
        margin: 0 7px;
    }

    .aethrion-coach-btn {
        font-size: 11px;
        padding: 7px 14px;
        gap: 6px;
    }
    .aethrion-coach-btn .coach-icon { font-size: 13px; }
    .aethrion-coach-btn .coach-text { display: none; }
    .aethrion-coach-btn .coach-limit-mini {
        font-size: 10px;
        padding: 2px 8px;
    }
    .coach-panel-header {
        padding: 11px 13px;
        gap: 7px;
    }
    .coach-panel-header .coach-header-left { gap: 9px; }
    .coach-panel-header .coach-header-right { gap: 6px; }
    .coach-panel-title {
        font-size: 15.5px;
        gap: 7px;
    }
    .coach-panel-title .coach-title-icon {
        width: 32px;
        height: 32px;
        font-size: 15px;
    }
    .coach-back-btn,
    .coach-share-btn {
        font-size: 11px;
        padding: 7px 12px;
        gap: 5px;
    }
    .coach-limit-badge {
        font-size: 10px;
        padding: 6px 11px;
        gap: 5px;
    }
    .coach-panel-body {
        padding: 11px;
        gap: 11px;
    }
    .coach-chat-wrap {
        border-radius: 18px;
        min-height: 300px;
    }
    .coach-chat-header {
        padding: 11px 15px;
        font-size: 12px;
    }
    .coach-chat-header .coach-topic { font-size: 13px; }
    .coach-chat-messages {
        padding: 13px;
        gap: 9px;
    }
    .coach-msg {
        font-size: 13px;
        padding: 11px 15px;
        border-radius: 18px;
        max-width: 95%;
    }
    .coach-msg code { font-size: 12px; padding: 3px 8px; }
    .coach-input-area {
        padding: 11px 13px;
        gap: 7px;
    }
    .coach-input {
        font-size: 13px;
        padding: 11px 16px;
        min-height: 44px;
        min-width: 130px;
    }
    .coach-send-btn {
        font-size: 13px;
        padding: 11px 22px;
    }
    .coach-history-wrap {
        padding: 13px;
        max-height: 260px;
        border-radius: 18px;
    }
    .coach-history-title { font-size: 13px; }
    .coach-history-title .coach-history-note { font-size: 10px; }
    .coach-history-list { max-height: 190px; gap: 7px; }
    .coach-history-item {
        font-size: 12.5px;
        padding: 11px 15px;
    }
    .coach-share-modal {
        padding: 24px 22px;
        border-radius: 24px;
    }
    .coach-share-modal h3 { font-size: 19px; margin-bottom: 17px; }
    .coach-share-info-box,
    .coach-share-responsibility {
        padding: 13px 15px;
        font-size: 12.5px;
    }
    .coach-share-responsibility label { font-size: 12.5px; }
    .coach-share-password-row input {
        font-size: 13px;
        padding: 13px 15px;
    }
    .coach-share-actions button {
        font-size: 13px;
        padding: 13px;
    }
    .coach-share-result { padding: 15px; font-size: 12.5px; }
    .coach-share-result .coach-share-link,
    .coach-share-result .coach-share-password-display {
        font-size: 12px;
        padding: 9px 13px;
    }

    .logs-panel, .video-studio, .a27-api-guide {
        max-height: 96vh !important;
        border-radius: 22px !important;
    }
    .logs-panel-header, .video-studio-header, .a27-api-guide-header {
        padding: 15px 18px !important;
        gap: 10px !important;
    }
    .logs-panel-header h3, .video-studio-header h3, .a27-api-guide-header h3 {
        font-size: 17px !important;
    }
    .logs-panel-body { padding: 14px 16px !important; font-size: 12px !important; }
    .logs-entry { padding: 9px 13px !important; gap: 10px !important; flex-wrap: wrap !important; }
    .logs-entry-time { font-size: 10.5px !important; min-width: 120px !important; }
    .logs-panel-actions { padding: 13px 16px !important; }
    .video-studio-body, .a27-api-guide-body {
        padding: 17px 19px !important;
        font-size: 13px !important;
    }
    .a27-api-guide-body h4 { font-size: 15.5px !important; margin: 22px 0 12px 0 !important; }
    .a27-api-guide-body code { font-size: 12px !important; padding: 3px 8px !important; }
    .a27-api-guide-body pre { font-size: 11.5px !important; padding: 14px !important; }
    .a27-api-guide-body .guide-note {
        padding: 13px 16px !important;
        font-size: 12.5px !important;
    }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE (CSS-3/B) — ÇOK KÜÇÜK 360px           */
/* ============================================================ */
@media (max-width: 360px) {
    .team-page-header h2 { font-size: 17px !important; }
    .admin-login-box { padding: 16px !important; max-width: 300px !important; }
    .admin-login-title { font-size: 20px !important; }

    .api-key-card .api-key-name { font-size: 12px !important; }
    .api-key-card .api-key-value { font-size: 10px !important; }
    .api-key-card .api-key-actions button {
        font-size: 10px !important;
        padding: 5px 10px !important;
    }
    .api-password-screen .lock-icon { font-size: 50px !important; }

    .contest-page-header h2 { font-size: 17px !important; }
    .contest-section h3 { font-size: 15px !important; }
    .contest-ranking-name { font-size: 11px !important; }
    .contest-ranking-points { font-size: 12.5px !important; }

    .full-3d-header .f3d-title { font-size: 15px; }
    .full-3d-header .f3d-actions button {
        font-size: 10.5px;
        padding: 7px 9px;
    }
    .f3d-shape-item {
        width: 68px;
        height: 78px;
    }
    .f3d-shape-item .f3d-shape-icon { font-size: 24px; }
    .f3d-shape-item .f3d-shape-label { font-size: 8.5px; }
    .f3d-selected-panel {
        min-width: 175px;
        max-width: 205px;
    }

    .aethrion-coach-btn {
        font-size: 10.5px;
        padding: 6px 12px;
    }
    .coach-panel-title { font-size: 14px; }
    .coach-back-btn,
    .coach-share-btn { font-size: 10.5px; padding: 6px 10px; }
    .coach-msg { font-size: 12.5px; padding: 9px 13px; }
    .coach-input { font-size: 12.5px; }
    .coach-send-btn { font-size: 12.5px; padding: 9px 18px; }
    .coach-history-item { font-size: 12px; padding: 9px 13px; }
    .coach-share-modal h3 { font-size: 17px; }

    .logs-panel-header h3, .video-studio-header h3, .a27-api-guide-header h3 {
        font-size: 16px !important;
    }
    .logs-panel-body { font-size: 11.5px !important; }
}

/* ============================================================ */
/* FOUNDER PANELİ ÖZEL DÜZENLEME                                 */
/* ============================================================ */
#teamPageFounderPanel {
    display: none;
    margin-top: 22px;
    padding-top: 22px;
    border-top: 2.5px solid var(--gold);
}

#teamPageFounderPanel h4 {
    color: var(--gold);
    margin-bottom: 15px;
    font-size: 18px;
    text-shadow: 0 0 24px rgba(232, 197, 85, 0.7);
}

#teamPageFounderPanel > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
}

#teamPageFounderPanel .btn-secondary {
    font-size: 13px !important;
    padding: 9px 19px !important;
    white-space: nowrap;
}

#teamPageFounderPanel #teamSearchInput {
    flex: 1 1 220px;
    min-width: 150px;
    font-size: 13px;
    padding: 9px 16px;
    height: 38px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
}

#teamPageFounderPanel #teamSearchInput:focus {
    border-color: var(--gold);
    outline: none;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.55);
}

#allTeamsList {
    margin-top: 13px;
    max-height: 260px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border-radius: var(--radius-md);
    padding: 13px;
    display: none;
    width: 100%;
    overflow-anchor: none;
    border: 1px solid var(--border2);
}

#aethrionLogContainer {
    max-height: 240px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border-radius: var(--radius-md);
    padding: 13px;
    margin-top: 13px;
    border: 1px solid var(--border2);
    width: 100%;
    overflow-anchor: none;
}


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* [AETHRION] İŞ İLANLARI MAĞAZASI — TAM EKRAN                  */
/* ============================================================ */
.job-market-overlay {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #030306 0%, #0a0a12 50%, #030306 100%);
    z-index: 9999998;
    display: none;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    overscroll-behavior: contain;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.job-market-overlay.open { display: flex; }

.job-market-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 28px;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.98));
    border-bottom: 2.5px solid var(--accent);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 15px;
    position: relative;
    z-index: 3;
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
}

.job-market-header::after {
    content: '';
    position: absolute;
    bottom: -2.5px;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        var(--gold),
        var(--nvidia),
        transparent
    );
    opacity: 0.85;
    animation: jobHeaderGlow 4.5s ease-in-out infinite alternate;
    box-shadow: 0 0 25px var(--accent);
}

@keyframes jobHeaderGlow {
    0%   { opacity: 0.6; }
    100% { opacity: 1; }
}

.job-market-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-display);
    font-size: 26px;
    font-weight: 800;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #f5d878, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    letter-spacing: 1.4px;
}

.job-market-title .job-market-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #f5d878);
    background-size: 250% 250%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.75),
        0 0 70px rgba(139, 107, 255, 0.45);
    animation: gradientMove 5.5s ease infinite;
    color: #06060b;
}

.job-market-actions {
    display: flex;
    gap: 11px;
    flex-wrap: wrap;
    align-items: center;
}

.job-market-limit-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 18px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.2), rgba(139, 107, 255, 0.12));
    border: 1.5px solid rgba(232, 197, 85, 0.5);
    color: var(--accent);
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.44px;
    white-space: nowrap;
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.3);
}

.job-market-limit-badge.danger {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.2), rgba(230, 57, 70, 0.12));
    border-color: rgba(255, 77, 94, 0.6);
    color: var(--danger);
    animation: coachLimitPulse 1.7s ease-in-out infinite;
}

.job-market-limit-badge.unlimited {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(255, 140, 0, 0.16));
    border-color: var(--gold);
    color: var(--gold);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.55);
}

.job-market-create-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 12px 26px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 35px rgba(232, 197, 85, 0.6),
        inset 0 0 14px rgba(255, 255, 255, 0.14);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.44px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.22);
    white-space: nowrap;
}

.job-market-create-btn:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow:
        0 12px 55px rgba(232, 197, 85, 1),
        0 0 110px rgba(139, 107, 255, 0.7);
}

.job-market-create-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

.job-market-close-btn {
    background: transparent;
    border: 1.5px solid rgba(255, 77, 94, 0.6);
    color: var(--danger);
    width: 46px;
    height: 46px;
    border-radius: 50%;
    font-size: 21px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.24s ease;
    flex-shrink: 0;
}

.job-market-close-btn:hover {
    background: rgba(255, 77, 94, 0.25);
    border-color: var(--danger);
    color: #fff;
    transform: rotate(90deg) scale(1.12);
    box-shadow: 0 0 30px rgba(255, 77, 94, 0.7);
}

.job-market-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 28px;
    min-height: 0;
}

.job-market-filters {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 24px;
    padding: 18px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.1);
}

.job-market-search {
    flex: 1;
    min-width: 240px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 13px 20px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-family: var(--font-body);
    transition: border-color 0.24s, box-shadow 0.24s;
}

.job-market-search:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45);
}

.job-market-select {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 13px 20px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-family: var(--font-body);
    cursor: pointer;
    transition: border-color 0.24s, box-shadow 0.24s;
    min-width: 170px;
}

.job-market-select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45);
}

.job-market-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    gap: 22px;
}

.job-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 24px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.job-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3.5px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), var(--purple), var(--gold), var(--nvidia));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.5s ease;
    box-shadow: 0 0 25px var(--accent);
}

.job-card:hover::before {
    transform: scaleX(1);
}

.job-card:hover {
    border-color: var(--accent);
    transform: translateY(-6px) scale(1.01);
    box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.65),
        0 0 60px rgba(232, 197, 85, 0.3),
        0 0 120px rgba(139, 107, 255, 0.15);
}

.job-card.status-accepted {
    border-color: var(--accent2);
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.1), rgba(232, 197, 85, 0.05));
}

.job-card.status-accepted::after {
    content: '✅ KABUL EDİLDİ';
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 9.5px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(197, 205, 224, 0.35), rgba(210, 210, 220, 0.25));
    border: 1px solid var(--accent2);
    color: var(--accent2);
    letter-spacing: 1px;
    box-shadow: 0 0 18px rgba(197, 205, 224, 0.6);
}

.job-card.status-closed {
    opacity: 0.6;
    border-color: var(--border2);
}

.job-card.status-closed::after {
    content: '🔒 KAPALI';
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 9.5px;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: var(--radius-pill);
    background: rgba(0, 0, 0, 0.55);
    border: 1px solid var(--border2);
    color: var(--text3);
    letter-spacing: 1px;
}

.job-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 11px;
    flex-wrap: wrap;
}

.job-card-number {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--font-code);
    font-size: 11px;
    font-weight: 700;
    padding: 5px 13px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.18), rgba(139, 107, 255, 0.12));
    border: 1px solid rgba(232, 197, 85, 0.45);
    color: var(--accent);
    letter-spacing: 0.7px;
    box-shadow: 0 0 15px rgba(232, 197, 85, 0.35);
}

.job-card-type {
    font-size: 10.5px;
    font-weight: 700;
    padding: 5px 13px;
    border-radius: var(--radius-pill);
    letter-spacing: 0.7px;
    text-transform: uppercase;
    white-space: nowrap;
}

.job-card-type.type-kod { background: rgba(232, 197, 85, 0.18); border: 1px solid var(--accent); color: var(--accent); }
.job-card-type.type-tasarim { background: rgba(139, 107, 255, 0.18); border: 1px solid var(--purple); color: var(--purple); }
.job-card-type.type-video { background: rgba(110, 224, 255, 0.18); border: 1px solid var(--ice); color: var(--ice); }
.job-card-type.type-ceviri { background: rgba(197, 205, 224, 0.18); border: 1px solid var(--accent2); color: var(--accent2); }
.job-card-type.type-yazar { background: rgba(232, 197, 85, 0.18); border: 1px solid var(--gold); color: var(--gold); }
.job-card-type.type-3d { background: rgba(139, 107, 255, 0.18); border: 1px solid var(--quantum); color: var(--quantum); }
.job-card-type.type-muzik { background: rgba(255, 138, 92, 0.18); border: 1px solid var(--ember); color: var(--ember); }
.job-card-type.type-diger { background: rgba(140, 140, 170, 0.18); border: 1px solid var(--text3); color: var(--text3); }

.job-card-title {
    font-family: var(--font-display);
    font-size: 18px;
    font-weight: 800;
    color: var(--text);
    line-height: 1.3;
    letter-spacing: -0.22px;
    word-break: break-word;
}

.job-card-desc {
    font-size: 13px;
    color: var(--text2);
    line-height: 1.7;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

.job-card-image {
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: var(--radius-md);
    border: 1px solid var(--border2);
}

.job-card-meta {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding-top: 11px;
    border-top: 1px dashed rgba(232, 197, 85, 0.18);
}

.job-card-owner {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 12.5px;
    color: var(--text3);
    word-break: break-all;
}

.job-card-owner .owner-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #06060b;
    font-weight: 800;
    font-size: 13px;
    flex-shrink: 0;
    box-shadow: 0 0 15px rgba(232, 197, 85, 0.6);
}

.job-card-owner .owner-email {
    color: var(--accent);
    font-weight: 600;
    font-family: var(--font-code);
    font-size: 11.5px;
}

.job-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
    padding-top: 9px;
}

.job-card-salary {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 800;
    font-size: 15.5px;
    color: var(--gold);
    text-shadow: 0 0 18px rgba(232, 197, 85, 0.7);
    letter-spacing: -0.22px;
}

.job-card-salary .salary-icon {
    font-size: 17px;
    filter: drop-shadow(0 0 10px var(--gold));
}

.job-card-views {
    font-size: 11.5px;
    color: var(--text4);
    display: flex;
    align-items: center;
    gap: 5px;
}

.job-market-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 75px 28px;
    color: var(--text3);
    font-size: 16px;
}

.job-market-empty .empty-icon {
    font-size: 74px;
    display: block;
    margin-bottom: 20px;
    opacity: 0.55;
    filter: drop-shadow(0 0 35px rgba(232, 197, 85, 0.45));
}

/* ============================================================ */
/* [AETHRION] İŞ İLANI OLUŞTURMA MODALI                         */
/* ============================================================ */
.job-create-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.98);
    z-index: 9999999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.job-create-overlay.open { display: flex; }

.job-create-modal {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--accent);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 680px;
    max-height: 92vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 34px 32px;
    box-shadow:
        0 30px 120px rgba(0, 0, 0, 0.9),
        0 0 95px rgba(232, 197, 85, 0.35),
        0 0 190px rgba(139, 107, 255, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
    animation: modalFadeIn 0.38s ease;
}

.job-create-modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--accent), var(--platinum), var(--purple), var(--gold), transparent);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 25px var(--accent);
}

.job-create-modal h3 {
    font-family: var(--font-display);
    font-size: 26px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 24px;
    letter-spacing: -0.22px;
}

.job-form-group {
    margin-bottom: 22px;
}

.job-form-label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--text3);
    margin-bottom: 9px;
    letter-spacing: 0.44px;
    text-transform: uppercase;
}

.job-form-label .required {
    color: var(--danger);
    margin-left: 3px;
}

.job-form-input,
.job-form-textarea,
.job-form-select {
    width: 100%;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 15px 20px;
    border-radius: var(--radius-lg);
    font-size: 14px;
    font-family: var(--font-body);
    transition: border-color 0.24s, box-shadow 0.24s;
}

.job-form-input:focus,
.job-form-textarea:focus,
.job-form-select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.45), 0 0 60px rgba(139, 107, 255, 0.25);
}

.job-form-textarea {
    min-height: 140px;
    resize: vertical;
    line-height: 1.7;
    font-family: var(--font-body);
}

.job-form-hint {
    font-size: 11.5px;
    color: var(--text4);
    margin-top: 7px;
    line-height: 1.55;
    padding-left: 4px;
}

.job-form-image-upload {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    padding: 18px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.05), rgba(139, 107, 255, 0.03));
    border: 2px dashed rgba(232, 197, 85, 0.45);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all 0.24s ease;
}

.job-form-image-upload:hover {
    border-color: var(--accent);
    background: rgba(232, 197, 85, 0.1);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.18);
}

.job-form-image-upload input[type="file"] {
    display: none;
}

.job-form-image-preview {
    width: 86px;
    height: 86px;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.18), rgba(139, 107, 255, 0.12));
    border: 1px solid var(--border2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    color: var(--text3);
    flex-shrink: 0;
    overflow: hidden;
}

.job-form-image-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.job-form-image-text {
    flex: 1;
    min-width: 160px;
    font-size: 13px;
    color: var(--text2);
    line-height: 1.65;
}

.job-form-image-text strong {
    color: var(--accent);
    display: block;
    margin-bottom: 5px;
}

.job-create-actions {
    display: flex;
    gap: 13px;
    margin-top: 28px;
    flex-wrap: wrap;
}

.job-create-actions .btn {
    flex: 1;
    min-width: 140px;
}

.job-create-error {
    display: none;
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.14), rgba(230, 57, 70, 0.08));
    border: 1.5px solid rgba(255, 77, 94, 0.55);
    color: #ffb0b8;
    padding: 14px 19px;
    border-radius: var(--radius-md);
    font-size: 13px;
    line-height: 1.65;
    text-align: center;
    margin-bottom: 18px;
}

.job-create-error.show { display: block; }

/* ============================================================ */
/* [AETHRION] İŞ İLANI TAM EKRAN DETAY                          */
/* ============================================================ */
.job-detail-overlay {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #030306 0%, #0a0a12 50%, #030306 100%);
    z-index: 99999999;
    display: none;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    overscroll-behavior: contain;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.job-detail-overlay.open { display: flex; }

.job-detail-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 28px;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.98));
    border-bottom: 2.5px solid var(--accent);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 15px;
    z-index: 3;
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
}

.job-detail-header h2 {
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 800;
    margin: 0;
    color: var(--text);
    letter-spacing: -0.35px;
    display: flex;
    align-items: center;
    gap: 13px;
    flex-wrap: wrap;
}

.job-detail-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 34px 28px 46px;
    min-height: 0;
}

.job-detail-content {
    max-width: 1000px;
    margin: 0 auto;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 38px;
    box-shadow:
        0 25px 80px rgba(0, 0, 0, 0.65),
        0 0 70px rgba(232, 197, 85, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    position: relative;
}

.job-detail-content::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3.5px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), var(--purple), var(--gold), var(--nvidia));
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 30px var(--accent);
}

.job-detail-number-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--font-code);
    font-size: 13px;
    font-weight: 800;
    padding: 7px 18px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.22), rgba(139, 107, 255, 0.14));
    border: 1.5px solid rgba(232, 197, 85, 0.55);
    color: var(--accent);
    letter-spacing: 1.2px;
    box-shadow: 0 0 22px rgba(232, 197, 85, 0.5);
    margin-bottom: 20px;
}

.job-detail-title {
    font-family: var(--font-display);
    font-size: clamp(28px, 4.2vw, 42px);
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.55px;
    margin-bottom: 22px;
    background: linear-gradient(135deg, #ffffff, #dbdbe8, #8a8aa8);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 70px rgba(232, 197, 85, 0.35);
    word-break: break-word;
}

.job-detail-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 15px;
    margin-bottom: 28px;
}

.job-detail-meta-item {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.08), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 16px 18px;
    display: flex;
    align-items: center;
    gap: 13px;
    transition: border-color 0.24s, box-shadow 0.24s;
}

.job-detail-meta-item:hover {
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.18);
}

.job-detail-meta-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.24), rgba(139, 107, 255, 0.18));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
    box-shadow: 0 0 18px rgba(232, 197, 85, 0.35);
}

.job-detail-meta-content {
    flex: 1;
    min-width: 0;
}

.job-detail-meta-label {
    font-size: 11px;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: 0.9px;
    font-weight: 700;
    margin-bottom: 3px;
}

.job-detail-meta-value {
    font-size: 15px;
    color: var(--text);
    font-weight: 600;
    word-break: break-word;
}

.job-detail-meta-value.gold {
    color: var(--gold);
    text-shadow: 0 0 15px rgba(232, 197, 85, 0.6);
}

.job-detail-image {
    width: 100%;
    max-height: 400px;
    object-fit: cover;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border2);
    margin-bottom: 26px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.55);
}

.job-detail-section-title {
    font-family: var(--font-display);
    font-size: 19px;
    font-weight: 700;
    color: var(--accent);
    margin: 28px 0 15px 0;
    letter-spacing: -0.22px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(232, 197, 85, 0.22);
}

.job-detail-description {
    font-size: 15px;
    line-height: 1.9;
    color: var(--text2);
    white-space: pre-wrap;
    word-break: break-word;
    letter-spacing: 0.15px;
}

.job-detail-owner-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px 22px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1px solid rgba(232, 197, 85, 0.35);
    border-radius: var(--radius-lg);
    margin-top: 26px;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.15);
}

.job-detail-owner-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #06060b;
    font-weight: 800;
    font-size: 26px;
    flex-shrink: 0;
    box-shadow:
        0 0 30px rgba(232, 197, 85, 0.7),
        0 0 60px rgba(139, 107, 255, 0.35);
    animation: gradientMove 5.5s ease infinite;
}

.job-detail-owner-info {
    flex: 1;
    min-width: 0;
}

.job-detail-owner-name {
    font-size: 16.5px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 5px;
    word-break: break-word;
}

.job-detail-owner-email {
    font-size: 13px;
    color: var(--accent);
    font-family: var(--font-code);
    font-weight: 600;
    word-break: break-all;
}

.job-detail-actions {
    display: flex;
    gap: 13px;
    margin-top: 34px;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 26px;
    border-top: 1px solid var(--border);
}

.job-accept-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    padding: 17px 42px;
    background: linear-gradient(135deg, #c5cde0, #e8c555, #8b6bff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 17px;
    font-weight: 800;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 45px rgba(197, 205, 224, 0.65),
        0 0 90px rgba(232, 197, 85, 0.4),
        inset 0 0 17px rgba(255, 255, 255, 0.22);
    transition: transform 0.28s ease, box-shadow 0.28s ease;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.7px;
    text-shadow: 0 1px 3px rgba(255, 255, 255, 0.32);
    flex: 1;
    min-width: 220px;
}

.job-accept-btn:hover {
    transform: translateY(-4px) scale(1.04);
    box-shadow:
        0 18px 70px rgba(197, 205, 224, 1),
        0 0 130px rgba(232, 197, 85, 0.7);
}

.job-accept-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
    animation: none;
    filter: grayscale(0.6);
}

.job-detail-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 15px 28px;
    background: transparent;
    border: 1.5px solid var(--warning);
    color: var(--warning);
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.24s ease;
    letter-spacing: 0.44px;
}

.job-detail-edit-btn:hover {
    background: rgba(255, 179, 71, 0.24);
    box-shadow: 0 0 35px rgba(255, 179, 71, 0.7);
    transform: translateY(-2px);
}

.job-detail-delete-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 15px 28px;
    background: transparent;
    border: 1.5px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.24s ease;
    letter-spacing: 0.44px;
}

.job-detail-delete-btn:hover {
    background: rgba(255, 77, 94, 0.24);
    color: #fff;
    box-shadow: 0 0 35px rgba(255, 77, 94, 0.7);
    transform: translateY(-2px);
}

/* ============================================================ */
/* [AETHRION] 9 KATEGORİ KARTLARI                               */
/* ============================================================ */
.category-section {
    padding: 90px 52px;
    max-width: 1560px;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

.category-section-title {
    text-align: center;
    margin-bottom: 66px;
}

.category-section-title h2 {
    font-family: var(--font-display);
    font-size: clamp(34px, 5vw, 52px);
    font-weight: 800;
    letter-spacing: -0.55px;
    margin-bottom: 16px;
}

.category-section-title h2 .hl-cat {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice), var(--gold));
    background-size: 300% 300%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    text-shadow: 0 0 70px rgba(232, 197, 85, 0.45);
}

.category-section-title p {
    color: var(--text3);
    font-size: 15px;
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.85;
}

.category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 22px;
}

.category-card {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-xl);
    padding: 28px 26px;
    cursor: pointer;
    transition: all 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 15px;
    min-height: 260px;
    text-align: left;
}

.category-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3.5px;
    background: linear-gradient(90deg, var(--cat-color, var(--accent)), transparent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.5s ease;
    box-shadow: 0 0 25px var(--cat-color, var(--accent));
}

.category-card:hover::before {
    transform: scaleX(1);
}

.category-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 100% 0%, var(--cat-color-glow, rgba(232, 197, 85, 0.18)) 0%, transparent 55%);
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.category-card:hover::after {
    opacity: 1;
}

.category-card:hover {
    border-color: var(--cat-color, var(--accent));
    transform: translateY(-10px) scale(1.02);
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.65),
        0 0 70px var(--cat-color-glow, rgba(232, 197, 85, 0.35));
}

.category-icon {
    width: 74px;
    height: 74px;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, var(--cat-color, var(--accent)), transparent 200%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 34px;
    color: #06060b;
    box-shadow:
        0 0 35px var(--cat-color-glow, rgba(232, 197, 85, 0.55)),
        inset 0 0 22px rgba(255, 255, 255, 0.1);
    transition: transform 0.45s ease;
    position: relative;
    z-index: 2;
}

.category-card:hover .category-icon {
    transform: scale(1.12) rotate(-6deg);
}

.category-title {
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 800;
    color: var(--text);
    letter-spacing: -0.28px;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.category-desc {
    font-size: 13px;
    line-height: 1.75;
    color: var(--text2);
    position: relative;
    z-index: 2;
    flex: 1;
}

.category-features-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    position: relative;
    z-index: 2;
}

.category-feature-chip {
    font-size: 10.5px;
    padding: 4px 12px;
    border-radius: var(--radius-pill);
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid var(--border2);
    color: var(--text3);
    font-weight: 600;
    letter-spacing: 0.35px;
}

.category-open-btn {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 10px 20px;
    background: transparent;
    border: 1.5px solid var(--cat-color, var(--accent));
    color: var(--cat-color, var(--accent));
    border-radius: var(--radius-pill);
    font-size: 12px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.28s ease;
    position: relative;
    z-index: 2;
    letter-spacing: 0.38px;
}

.category-open-btn:hover {
    background: var(--cat-color, var(--accent));
    color: #06060b;
    box-shadow: 0 0 30px var(--cat-color-glow, rgba(232, 197, 85, 0.7));
    transform: translateX(5px);
}

/* Renk varyantları */
.category-card.cat-assistant { --cat-color: #e8c555; --cat-color-glow: rgba(232, 197, 85, 0.45); }
.category-card.cat-education { --cat-color: #c5cde0; --cat-color-glow: rgba(197, 205, 224, 0.45); }
.category-card.cat-gamification { --cat-color: #8b6bff; --cat-color-glow: rgba(139, 107, 255, 0.45); }
.category-card.cat-creative { --cat-color: #6ee0ff; --cat-color-glow: rgba(110, 224, 255, 0.45); }
.category-card.cat-professional { --cat-color: #f5d878; --cat-color-glow: rgba(245, 216, 120, 0.45); }
.category-card.cat-health { --cat-color: #c5cde0; --cat-color-glow: rgba(197, 205, 224, 0.45); }
.category-card.cat-social { --cat-color: #e8c555; --cat-color-glow: rgba(232, 197, 85, 0.45); }
.category-card.cat-surprise { --cat-color: #8b6bff; --cat-color-glow: rgba(139, 107, 255, 0.45); }
.category-card.cat-earn { --cat-color: #76b900; --cat-color-glow: rgba(118, 185, 0, 0.45); }

/* ============================================================ */
/* [AETHRION] VİDEO EDITOR (GERÇEK) — TIMELINE + TRIM          */
/* ============================================================ */
.video-editor-overlay {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #030306 0%, #0a0a12 50%, #030306 100%);
    z-index: 99999999;
    display: none;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    overscroll-behavior: contain;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.video-editor-overlay.open { display: flex; }

.video-editor-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 26px;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.98));
    border-bottom: 2.5px solid var(--accent3);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 15px;
    z-index: 3;
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
}

.video-editor-title {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--font-display);
    font-size: 22px;
    font-weight: 800;
    background: linear-gradient(90deg, #ff8a5c, #e8c555, #8b6bff, #6ee0ff, #ff8a5c);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5.5s ease infinite;
    letter-spacing: 1.2px;
}

.video-editor-title .video-editor-icon {
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #ff8a5c, #e8c555, #8b6bff);
    background-size: 250% 250%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 21px;
    color: #06060b;
    box-shadow:
        0 0 35px rgba(255, 138, 92, 0.75),
        0 0 70px rgba(139, 107, 255, 0.45);
    animation: gradientMove 5.5s ease infinite;
}

.video-editor-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.video-editor-body {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 340px;
    overflow: hidden;
    min-height: 0;
}

.video-editor-main {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px;
    gap: 20px;
    min-height: 0;
}

.video-editor-preview {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 70px rgba(0, 0, 0, 0.75);
}

.video-editor-preview video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
}

.video-editor-preview .video-editor-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    color: var(--text3);
    font-size: 15px;
    text-align: center;
    padding: 34px;
}

.video-editor-preview .video-editor-placeholder .placeholder-icon {
    font-size: 78px;
    opacity: 0.45;
    filter: drop-shadow(0 0 35px rgba(232, 197, 85, 0.5));
}

.video-editor-preview .video-editor-upload-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 14.5px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow: 0 0 35px rgba(232, 197, 85, 0.55);
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.44px;
}

.video-editor-preview .video-editor-upload-btn:hover {
    transform: translateY(-3px) scale(1.06);
    box-shadow: 0 0 60px rgba(232, 197, 85, 1);
}

.video-editor-preview input[type="file"] {
    display: none;
}

/* Timeline */
.video-editor-timeline-wrap {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.92), rgba(8, 8, 12, 0.96));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.video-editor-timeline-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 13px;
    flex-wrap: wrap;
    font-size: 13px;
    color: var(--text3);
    font-weight: 600;
    letter-spacing: 0.44px;
}

.video-editor-timeline-time {
    color: var(--accent);
    font-family: var(--font-code);
    font-weight: 700;
    text-shadow: 0 0 15px rgba(232, 197, 85, 0.6);
}

.video-editor-timeline-container {
    position: relative;
    height: 66px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.35));
    border: 1px solid var(--border2);
    border-radius: var(--radius-md);
    overflow: hidden;
    cursor: pointer;
    user-select: none;
}

.video-editor-timeline-track {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg,
            rgba(232, 197, 85, 0.18) 0%,
            rgba(139, 107, 255, 0.18) 50%,
            rgba(197, 205, 224, 0.18) 100%);
}

.video-editor-timeline-selection {
    position: absolute;
    top: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(232, 197, 85, 0.4), rgba(139, 107, 255, 0.3));
    border-left: 2.5px solid var(--accent);
    border-right: 2.5px solid var(--accent);
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.6);
    pointer-events: none;
}

.video-editor-timeline-playhead {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2.5px;
    background: var(--gold);
    box-shadow: 0 0 18px var(--gold);
    pointer-events: none;
    z-index: 5;
}

.video-editor-timeline-playhead::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 14px;
    height: 14px;
    background: var(--gold);
    border-radius: 50%;
    box-shadow: 0 0 18px var(--gold);
}

.video-editor-timeline-handle {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 14px;
    background: linear-gradient(180deg, var(--accent), var(--platinum));
    cursor: ew-resize;
    z-index: 6;
    border-radius: 5px;
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.8);
    transition: transform 0.18s;
}

.video-editor-timeline-handle:hover {
    transform: scaleX(1.35);
}

.video-editor-timeline-handle.left { left: 0; }
.video-editor-timeline-handle.right { right: 0; }

.video-editor-controls {
    display: flex;
    gap: 11px;
    flex-wrap: wrap;
    align-items: center;
}

.video-editor-control-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 11px 20px;
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.12), rgba(139, 107, 255, 0.08));
    border: 1.5px solid var(--border2);
    color: var(--text2);
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 600;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.24s ease;
    letter-spacing: 0.38px;
}

.video-editor-control-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(232, 197, 85, 0.22);
    box-shadow: 0 0 25px rgba(232, 197, 85, 0.45);
    transform: translateY(-2px);
}

.video-editor-control-btn.active {
    background: linear-gradient(135deg, #e8c555, #c5cde0);
    color: #06060b;
    border-color: transparent;
    box-shadow: 0 0 30px rgba(232, 197, 85, 0.7);
    font-weight: 700;
}

/* Sidebar */
.video-editor-sidebar {
    background: linear-gradient(180deg, rgba(18, 18, 26, 0.97), rgba(8, 8, 12, 0.99));
    border-left: 1px solid var(--border2);
    padding: 24px 22px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    min-height: 0;
}

.video-editor-sidebar-section {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.06), rgba(139, 107, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px;
}

.video-editor-sidebar-section h4 {
    font-family: var(--font-display);
    font-size: 15px;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 14px;
    letter-spacing: 0.38px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding-bottom: 11px;
    border-bottom: 1px solid rgba(232, 197, 85, 0.18);
}

.video-editor-sidebar-row {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-bottom: 14px;
}

.video-editor-sidebar-row label {
    font-size: 11.5px;
    color: var(--text3);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.7px;
}

.video-editor-sidebar-row input[type="text"],
.video-editor-sidebar-row input[type="number"],
.video-editor-sidebar-row select,
.video-editor-sidebar-row textarea {
    background: rgba(0, 0, 0, 0.45);
    border: 1px solid var(--border2);
    color: var(--text);
    padding: 10px 15px;
    border-radius: var(--radius-md);
    font-size: 13px;
    font-family: var(--font-body);
    transition: border-color 0.24s, box-shadow 0.24s;
}

.video-editor-sidebar-row input:focus,
.video-editor-sidebar-row select:focus,
.video-editor-sidebar-row textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 18px rgba(232, 197, 85, 0.4);
}

.video-editor-sidebar-row textarea {
    min-height: 78px;
    resize: vertical;
    line-height: 1.65;
    font-family: var(--font-body);
}

.video-editor-export-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    background: linear-gradient(135deg, #c5cde0, #e8c555, #8b6bff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 15px;
    font-weight: 800;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 40px rgba(197, 205, 224, 0.65),
        inset 0 0 17px rgba(255, 255, 255, 0.22);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.55px;
    text-shadow: 0 1px 3px rgba(255, 255, 255, 0.32);
    width: 100%;
}

.video-editor-export-btn:hover {
    transform: translateY(-3px) scale(1.03);
    box-shadow:
        0 15px 65px rgba(197, 205, 224, 1),
        0 0 110px rgba(232, 197, 85, 0.65);
}

.video-editor-export-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

/* ============================================================ */
/* [AETHRION] A27 QUICK CREATE MODAL (Aethrion Al Üzerinden)   */
/* ============================================================ */
.a27-quick-create-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.98);
    z-index: 99999999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    overscroll-behavior: contain;
}

.a27-quick-create-overlay.open { display: flex; }

.a27-quick-create-modal {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 2.5px solid var(--gold);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 580px;
    max-height: 92vh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 34px 32px;
    box-shadow:
        0 30px 120px rgba(0, 0, 0, 0.9),
        0 0 100px rgba(232, 197, 85, 0.45),
        0 0 200px rgba(255, 140, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
    animation: modalFadeIn 0.38s ease;
    position: relative;
}

.a27-quick-create-modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5px;
    background: linear-gradient(90deg, transparent, var(--gold), var(--accent3), transparent);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 25px var(--gold);
}

.a27-quick-create-modal h3 {
    font-family: var(--font-display);
    font-size: 24px;
    color: var(--gold);
    text-align: center;
    margin-bottom: 13px;
    text-shadow: 0 0 35px rgba(232, 197, 85, 0.7);
    letter-spacing: 0.38px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
}

.a27-quick-create-info {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.1), rgba(139, 107, 255, 0.06));
    border: 1px solid rgba(232, 197, 85, 0.35);
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    font-size: 13px;
    color: #8ab4cc;
    line-height: 1.8;
    margin-bottom: 24px;
    text-align: center;
}

.a27-quick-create-info strong {
    color: var(--accent);
}

/* ============================================================ */
/* [AETHRION] A27 KEY REVEAL (TEK SEFERLİK GÖSTERİM)           */
/* ============================================================ */
.a27-key-reveal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(3, 3, 6, 0.99);
    z-index: 2147483647;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    backdrop-filter: blur(26px);
    -webkit-backdrop-filter: blur(26px);
    overscroll-behavior: contain;
    animation: revealFadeIn 0.55s ease;
}

.a27-key-reveal-overlay.open { display: flex; }

@keyframes revealFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.a27-key-reveal-modal {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.995), rgba(8, 8, 12, 0.998));
    border: 3px solid var(--accent2);
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 660px;
    padding: 44px 34px 34px;
    box-shadow:
        0 0 130px rgba(197, 205, 224, 0.65),
        0 0 260px rgba(197, 205, 224, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    position: relative;
    animation: revealPop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
    overflow: hidden;
}

@keyframes revealPop {
    0%   { opacity: 0; transform: scale(0.85) translateY(22px); }
    100% { opacity: 1; transform: scale(1) translateY(0); }
}

.a27-key-reveal-modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3.5px;
    background: linear-gradient(90deg, var(--accent2), var(--accent), var(--accent2));
    background-size: 200% 100%;
    animation: btnGradientShift 3.5s ease infinite;
    box-shadow: 0 0 35px var(--accent2);
}

.a27-key-reveal-header-icon {
    width: 92px;
    height: 92px;
    margin: 0 auto 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #c5cde0, #e8c555);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 44px;
    color: #06060b;
    box-shadow:
        0 0 60px rgba(197, 205, 224, 0.85),
        0 0 120px rgba(197, 205, 224, 0.45);
    animation: revealIconPulse 2.2s ease-in-out infinite;
    font-weight: 800;
}

@keyframes revealIconPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.07); }
}

.a27-key-reveal-modal h3 {
    font-family: var(--font-display);
    font-size: 27px;
    color: var(--accent2);
    text-align: center;
    margin-bottom: 13px;
    text-shadow: 0 0 35px rgba(197, 205, 224, 0.8);
    letter-spacing: 0.38px;
}

.a27-key-reveal-modal .reveal-sub {
    text-align: center;
    font-size: 14px;
    color: var(--text2);
    line-height: 1.8;
    margin-bottom: 26px;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.a27-key-value-display {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 2.5px solid var(--accent2);
    border-radius: var(--radius-lg);
    padding: 24px 22px;
    font-family: var(--font-code);
    font-size: 16px;
    color: var(--accent2);
    word-break: break-all;
    text-align: center;
    margin: 22px 0;
    letter-spacing: 1.7px;
    box-shadow:
        0 0 55px rgba(197, 205, 224, 0.55),
        inset 0 0 35px rgba(197, 205, 224, 0.1);
    user-select: all;
    font-weight: 700;
    line-height: 1.65;
    position: relative;
    overflow: hidden;
}

.a27-key-value-display::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(197, 205, 224, 0.18), transparent);
    animation: keyValueShine 3.5s linear infinite;
}

@keyframes keyValueShine {
    0%   { left: -100%; }
    100% { left: 200%; }
}

.a27-key-warning-big {
    background: linear-gradient(135deg, rgba(255, 77, 94, 0.18), rgba(230, 57, 70, 0.12));
    border: 2.5px solid var(--danger);
    color: #ffb0b8;
    border-radius: var(--radius-lg);
    padding: 20px 24px;
    font-size: 14px;
    line-height: 1.85;
    text-align: center;
    box-shadow: 0 0 45px rgba(255, 77, 94, 0.4);
    margin-bottom: 26px;
}

.a27-key-warning-big strong {
    color: #fff;
    display: block;
    margin-bottom: 7px;
    font-size: 15.5px;
    letter-spacing: 0.35px;
}

.a27-key-copy-btn-big {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    width: 100%;
    padding: 18px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: var(--radius-pill);
    font-size: 16.5px;
    font-weight: 800;
    font-family: var(--font-body);
    cursor: pointer;
    box-shadow:
        0 0 45px rgba(232, 197, 85, 0.65),
        inset 0 0 17px rgba(255, 255, 255, 0.18);
    transition: transform 0.24s ease, box-shadow 0.24s ease;
    animation: btnGradientShift 5.5s ease infinite;
    letter-spacing: 0.7px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.25);
    margin-bottom: 16px;
}

.a27-key-copy-btn-big:hover {
    transform: translateY(-3px) scale(1.02);
    box-shadow:
        0 18px 65px rgba(232, 197, 85, 1),
        0 0 130px rgba(139, 107, 255, 0.75);
}

.a27-key-close-btn-big {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    padding: 16px;
    background: transparent;
    border: 1.5px solid var(--accent2);
    color: var(--accent2);
    border-radius: var(--radius-pill);
    font-size: 14px;
    font-weight: 700;
    font-family: var(--font-body);
    cursor: pointer;
    transition: all 0.24s ease;
    letter-spacing: 0.44px;
}

.a27-key-close-btn-big:hover {
    background: rgba(197, 205, 224, 0.18);
    box-shadow: 0 0 35px rgba(197, 205, 224, 0.6);
}

/* ============================================================ */
/* [AETHRION] 28 MODEL SHOWCASE (Dashboard'da)                  */
/* ============================================================ */
.models-showcase-overlay {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #030306 0%, #0a0a12 50%, #030306 100%);
    z-index: 99999998;
    display: none;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    overscroll-behavior: contain;
}

.models-showcase-overlay.open { display: flex; }

.models-showcase-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 28px;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.98));
    border-bottom: 2.5px solid var(--accent);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: 15px;
    box-shadow: 0 5px 40px rgba(0, 0, 0, 0.6);
    z-index: 3;
}

.models-showcase-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 28px;
    min-height: 0;
}

.models-showcase-group {
    margin-bottom: 34px;
}

.models-showcase-group-title {
    font-family: var(--font-display);
    font-size: 21px;
    font-weight: 800;
    color: var(--text);
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 13px;
    letter-spacing: -0.22px;
}

.models-showcase-group-title .group-badge {
    font-size: 11px;
    padding: 5px 14px;
    border-radius: var(--radius-pill);
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.models-showcase-group-title .group-badge.ollama {
    background: linear-gradient(135deg, rgba(232, 197, 85, 0.22), rgba(232, 197, 85, 0.12));
    border: 1px solid var(--accent);
    color: var(--accent);
    box-shadow: 0 0 18px rgba(232, 197, 85, 0.5);
}

.models-showcase-group-title .group-badge.nvidia {
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.22), rgba(118, 185, 0, 0.12));
    border: 1px solid var(--nvidia);
    color: var(--nvidia);
    box-shadow: 0 0 18px rgba(118, 185, 0, 0.5);
}

.models-showcase-group-title .group-badge.cloud {
    background: linear-gradient(135deg, rgba(139, 107, 255, 0.22), rgba(139, 107, 255, 0.12));
    border: 1px solid var(--purple);
    color: var(--purple);
    box-shadow: 0 0 18px rgba(139, 107, 255, 0.5);
}

.models-showcase-grid-full {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 15px;
}

.model-tile {
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.94), rgba(8, 8, 12, 0.97));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 18px 20px;
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.model-tile:hover {
    border-color: var(--accent);
    transform: translateY(-5px);
    box-shadow:
        0 15px 45px rgba(0, 0, 0, 0.55),
        0 0 35px rgba(232, 197, 85, 0.35);
}

.model-tile.nvidia-tile:hover {
    border-color: var(--nvidia);
    box-shadow:
        0 15px 45px rgba(0, 0, 0, 0.55),
        0 0 35px rgba(118, 185, 0, 0.45);
}

.model-tile-icon {
    font-size: 28px;
    margin-bottom: 9px;
    display: block;
    filter: drop-shadow(0 0 12px rgba(232, 197, 85, 0.55));
}

.model-tile.nvidia-tile .model-tile-icon {
    filter: drop-shadow(0 0 12px rgba(118, 185, 0, 0.7));
}

.model-tile-name {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.35;
    word-break: break-word;
    margin-bottom: 5px;
}

.model-tile-provider {
    font-size: 10.5px;
    color: var(--text3);
    letter-spacing: 0.55px;
    text-transform: uppercase;
    font-weight: 600;
}

/* ============================================================ */
/* [AETHRION] NVIDIA NIM ÖZEL KART                               */
/* ============================================================ */
.nvidia-model-card {
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.18), rgba(118, 185, 0, 0.08));
    border: 1.5px solid var(--nvidia);
    border-radius: var(--radius-lg);
    padding: 20px;
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
}

.nvidia-model-card:hover {
    border-color: var(--nvidia);
    transform: translateY(-6px);
    box-shadow:
        0 18px 55px rgba(0, 0, 0, 0.55),
        0 0 55px rgba(118, 185, 0, 0.6),
        0 0 110px rgba(118, 185, 0, 0.3);
}

.nvidia-model-card::before {
    content: 'NVIDIA NIM';
    position: absolute;
    top: 11px;
    right: 11px;
    font-size: 9px;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: var(--radius-pill);
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.4), rgba(118, 185, 0, 0.25));
    border: 1px solid var(--nvidia);
    color: var(--nvidia);
    letter-spacing: 1px;
    box-shadow: 0 0 18px rgba(118, 185, 0, 0.6);
    text-transform: uppercase;
}

/* ============================================================ */
/* [AETHRION] NOVA EFFECT (Bazı kartlarda)                     */
/* ============================================================ */
.nova-hover {
    position: relative;
    transition: all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.nova-hover::after {
    content: '';
    position: absolute;
    inset: -1.5px;
    border-radius: inherit;
    background: conic-gradient(
        from var(--angle, 0deg),
        transparent,
        var(--accent),
        transparent,
        var(--platinum),
        transparent,
        var(--purple),
        transparent,
        var(--ice),
        transparent
    );
    z-index: -1;
    opacity: 0;
    transition: opacity 0.4s;
    animation: novaRotate 7s linear infinite;
}

.nova-hover:hover::after {
    opacity: 1;
}

@keyframes novaRotate {
    to { --angle: 360deg; }
}

@property --angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TABLET (max-width: 768px)           */
/* ============================================================ */
@media (max-width: 768px) {
    .job-market-header {
        padding: 16px 20px;
        gap: 12px;
    }
    .job-market-title {
        font-size: 20px;
        gap: 11px;
    }
    .job-market-title .job-market-icon {
        width: 40px;
        height: 40px;
        font-size: 19px;
    }
    .job-market-create-btn {
        font-size: 13px;
        padding: 11px 20px;
    }
    .job-market-close-btn {
        width: 42px;
        height: 42px;
        font-size: 19px;
    }
    .job-market-body { padding: 20px; }
    .job-market-grid {
        grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
        gap: 18px;
    }
    .job-card { padding: 20px; }
    .job-card-title { font-size: 16.5px; }

    .job-create-modal {
        padding: 28px 24px;
        max-width: 100%;
        border-radius: 24px;
    }
    .job-create-modal h3 { font-size: 22px; }

    .job-detail-body { padding: 24px 20px 34px; }
    .job-detail-content { padding: 28px 24px; border-radius: 24px; }
    .job-detail-title { font-size: 28px; }
    .job-detail-meta-grid { grid-template-columns: 1fr 1fr; gap: 13px; }

    .category-section { padding: 60px 22px; }
    .category-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
        gap: 18px;
    }
    .category-card { padding: 24px 22px; min-height: 240px; }
    .category-icon { width: 66px; height: 66px; font-size: 30px; }
    .category-title { font-size: 20px; }

    .video-editor-body {
        grid-template-columns: 1fr;
        overflow-y: auto;
    }
    .video-editor-main {
        padding: 18px;
        overflow: visible;
    }
    .video-editor-sidebar {
        border-left: none;
        border-top: 1px solid var(--border2);
        max-height: none;
        overflow: visible;
    }

    .models-showcase-header { padding: 16px 20px; gap: 12px; }
    .models-showcase-body { padding: 20px; }
    .models-showcase-grid-full {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
        gap: 12px;
    }
    .model-tile { padding: 14px 16px; }
    .model-tile-icon { font-size: 24px; }
    .model-tile-name { font-size: 13px; }

    .a27-key-reveal-modal {
        padding: 34px 26px 28px;
        border-radius: 24px;
    }
    .a27-key-reveal-header-icon {
        width: 78px;
        height: 78px;
        font-size: 36px;
    }
    .a27-key-reveal-modal h3 { font-size: 23px; }
    .a27-key-value-display { font-size: 14px; padding: 20px 18px; letter-spacing: 1.2px; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TELEFON (max-width: 480px)          */
/* ============================================================ */
@media (max-width: 480px) {
    .job-market-header {
        padding: 12px 14px;
        gap: 9px;
    }
    .job-market-title { font-size: 16px; letter-spacing: 0.6px; }
    .job-market-title .job-market-icon {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }
    .job-market-limit-badge { font-size: 11px; padding: 7px 13px; }
    .job-market-create-btn {
        font-size: 12px;
        padding: 9px 16px;
        gap: 6px;
    }
    .job-market-close-btn {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
    .job-market-body { padding: 14px; }
    .job-market-filters {
        padding: 14px 16px;
        gap: 9px;
    }
    .job-market-search { font-size: 13px; padding: 11px 15px; }
    .job-market-select { font-size: 12.5px; padding: 11px 15px; min-width: 140px; }
    .job-market-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .job-card { padding: 16px; gap: 10px; border-radius: 20px; }
    .job-card-title { font-size: 15px; }
    .job-card-desc { font-size: 12px; -webkit-line-clamp: 2; }
    .job-card-image { height: 110px; }
    .job-card-salary { font-size: 14px; }
    .job-card-number,
    .job-card-type { font-size: 10px; padding: 4px 10px; }

    .job-create-modal {
        padding: 22px 18px;
        border-radius: 22px;
    }
    .job-create-modal h3 { font-size: 19px; margin-bottom: 18px; }
    .job-form-label { font-size: 12px; }
    .job-form-input,
    .job-form-textarea,
    .job-form-select {
        padding: 12px 16px;
        font-size: 13px;
    }
    .job-form-textarea { min-height: 110px; }
    .job-create-actions { flex-direction: column; }
    .job-create-actions .btn { width: 100%; }

    .job-detail-header { padding: 14px 16px; gap: 9px; }
    .job-detail-header h2 { font-size: 18px; }
    .job-detail-body { padding: 18px 14px 28px; }
    .job-detail-content { padding: 22px 18px; border-radius: 20px; }
    .job-detail-title { font-size: 23px; margin-bottom: 18px; }
    .job-detail-meta-grid { grid-template-columns: 1fr; gap: 10px; }
    .job-detail-meta-item { padding: 12px 14px; gap: 10px; }
    .job-detail-meta-icon { width: 36px; height: 36px; font-size: 17px; }
    .job-detail-meta-label { font-size: 10px; }
    .job-detail-meta-value { font-size: 13.5px; }
    .job-detail-owner-card { padding: 14px 16px; gap: 13px; flex-direction: column; align-items: flex-start; }
    .job-detail-owner-avatar { width: 50px; height: 50px; font-size: 22px; }
    .job-detail-actions { flex-direction: column; }
    .job-accept-btn,
    .job-detail-edit-btn,
    .job-detail-delete-btn {
        width: 100%;
        min-width: unset;
        font-size: 15px;
        padding: 15px 24px;
    }

    .category-section { padding: 40px 12px; }
    .category-section-title { margin-bottom: 36px; }
    .category-section-title h2 { font-size: 26px; }
    .category-section-title p { font-size: 13px; }
    .category-grid { grid-template-columns: 1fr; gap: 14px; }
    .category-card {
        padding: 20px 18px;
        min-height: 220px;
        border-radius: 20px;
    }
    .category-icon {
        width: 56px;
        height: 56px;
        font-size: 26px;
        border-radius: 16px;
    }
    .category-title { font-size: 17px; }
    .category-desc { font-size: 12.5px; }
    .category-feature-chip { font-size: 10px; padding: 3px 9px; }
    .category-open-btn { font-size: 11.5px; padding: 8px 15px; }

    .video-editor-header { padding: 12px 14px; gap: 9px; }
    .video-editor-title { font-size: 16px; gap: 9px; }
    .video-editor-title .video-editor-icon { width: 34px; height: 34px; font-size: 16px; }
    .video-editor-actions { gap: 6px; }
    .video-editor-actions .btn { font-size: 11.5px; padding: 8px 13px; }
    .video-editor-main { padding: 13px; gap: 13px; }
    .video-editor-timeline-container { height: 56px; }
    .video-editor-control-btn { font-size: 12px; padding: 9px 14px; }
    .video-editor-sidebar { padding: 18px 15px; gap: 15px; }
    .video-editor-sidebar-section { padding: 14px; }
    .video-editor-sidebar-section h4 { font-size: 13.5px; }
    .video-editor-sidebar-row label { font-size: 11px; }
    .video-editor-sidebar-row input,
    .video-editor-sidebar-row select,
    .video-editor-sidebar-row textarea { font-size: 13px; padding: 9px 12px; }
    .video-editor-export-btn { font-size: 14px; padding: 14px; }

    .models-showcase-header { padding: 12px 14px; gap: 9px; }
    .models-showcase-body { padding: 16px; }
    .models-showcase-group { margin-bottom: 24px; }
    .models-showcase-group-title { font-size: 17px; margin-bottom: 13px; gap: 9px; }
    .models-showcase-group-title .group-badge { font-size: 9px; padding: 4px 10px; }
    .models-showcase-grid-full {
        grid-template-columns: repeat(2, 1fr);
        gap: 9px;
    }
    .model-tile { padding: 12px 14px; }
    .model-tile-icon { font-size: 22px; }
    .model-tile-name { font-size: 11.5px; }
    .model-tile-provider { font-size: 10px; }

    .a27-quick-create-modal {
        padding: 26px 20px;
        border-radius: 22px;
    }
    .a27-quick-create-modal h3 { font-size: 20px; }
    .a27-quick-create-info { font-size: 12.5px; padding: 14px 16px; }

    .a27-key-reveal-modal {
        padding: 28px 22px 24px;
        border-radius: 22px;
    }
    .a27-key-reveal-header-icon {
        width: 70px;
        height: 70px;
        font-size: 32px;
        margin-bottom: 18px;
    }
    .a27-key-reveal-modal h3 { font-size: 20px; }
    .a27-key-reveal-modal .reveal-sub { font-size: 13.5px; }
    .a27-key-value-display {
        font-size: 12.5px;
        padding: 17px 14px;
        letter-spacing: 0.9px;
    }
    .a27-key-warning-big {
        padding: 16px 18px;
        font-size: 13px;
    }
    .a27-key-warning-big strong { font-size: 14px; }
    .a27-key-copy-btn-big { font-size: 14.5px; padding: 15px; }
    .a27-key-close-btn-big { font-size: 13px; padding: 13px; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — ÇOK KÜÇÜK (max-width: 360px)        */
/* ============================================================ */
@media (max-width: 360px) {
    .job-market-title { font-size: 14.5px; }
    .job-market-create-btn { font-size: 11px; padding: 8px 13px; }
    .job-card-title { font-size: 14.5px; }
    .job-card-salary { font-size: 13px; }

    .job-detail-title { font-size: 21px; }
    .job-detail-header h2 { font-size: 17px; }

    .category-title { font-size: 16px; }
    .category-icon { width: 50px; height: 50px; font-size: 23px; }

    .video-editor-title { font-size: 14.5px; }
    .video-editor-title .video-editor-icon { width: 30px; height: 30px; font-size: 14px; }
    .video-editor-actions .btn { font-size: 10.5px; padding: 7px 11px; }

    .models-showcase-group-title { font-size: 15px; }
    .model-tile-name { font-size: 10.5px; }
    .model-tile-icon { font-size: 20px; }

    .a27-key-reveal-modal h3 { font-size: 18px; }
    .a27-key-value-display { font-size: 11.5px; padding: 14px 12px; }
    .a27-key-copy-btn-big { font-size: 13px; padding: 13px; }
}


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* [AETHRION] LEGAL BANNER                                      */
/* ============================================================ */
#mainSite {
    padding-top: 48px;
}

nav {
    top: 48px !important;
}

.legal-banner {
    background: linear-gradient(135deg, #7c5cff, #6a4eff, #4a3a99, #2a1f5c);
    color: #ffffff;
    text-align: center;
    padding: 8px 42px 8px 14px;
    font-size: 10.5px;
    font-weight: 600;
    font-family: var(--font-body);
    letter-spacing: 0.3px;
    line-height: 1.4;
    width: 100%;
    z-index: 10001;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid #2a1f5c;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 42px;
    max-height: 56px;
    overflow: hidden;
    transition: opacity 0.32s ease, transform 0.32s ease;
    will-change: opacity, transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow:
        0 3px 25px rgba(124, 92, 255, 0.5),
        0 0 60px rgba(124, 92, 255, 0.2);
    position: relative;
}

.legal-banner::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    animation: legalShine 9s linear infinite;
    pointer-events: none;
}

@keyframes legalShine {
    0%   { left: -100%; }
    100% { left: 100%; }
}

.legal-banner-close {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: #ffffff;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s;
    z-index: 2;
    font-family: var(--font-body);
}

.legal-banner-close:hover {
    background: rgba(255, 255, 255, 0.35);
    transform: translateY(-50%) scale(1.18);
    box-shadow: 0 0 20px rgba(255, 255, 255, 0.6);
}

.legal-banner-close:active {
    transform: translateY(-50%) scale(0.95);
}

.legal-banner-line {
    display: block;
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    font-size: 10.5px;
}

.legal-banner-line.community-line {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    color: #e8c555;
    font-size: 10px;
    font-weight: 500;
    opacity: 0.95;
}

.legal-banner.hidden {
    display: none !important;
}

/* ============================================================ */
/* [AETHRION] BÜYÜK BUTONLAR                                    */
/* ============================================================ */
.btn-primary {
    font-size: 18px !important;
    padding: 15px 34px !important;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff) !important;
    background-size: 250% 250% !important;
    color: #0a0a0e !important;
    border: none !important;
    border-radius: 60px !important;
    box-shadow:
        0 0 30px rgba(212, 175, 55, 0.55),
        0 0 60px rgba(124, 92, 255, 0.35),
        inset 0 0 18px rgba(255, 255, 255, 0.12) !important;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: transform 0.22s ease, box-shadow 0.22s ease !important;
    animation: btnGradientShift 5s ease infinite;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.2);
    font-weight: 700;
}

.btn-primary:hover {
    transform: scale(1.06) translateY(-3px);
    box-shadow:
        0 0 55px rgba(212, 175, 55, 0.9),
        0 0 110px rgba(124, 92, 255, 0.6),
        inset 0 0 25px rgba(255, 255, 255, 0.18) !important;
}

.btn-secondary {
    font-size: 18px !important;
    padding: 15px 34px !important;
    border: 2px solid #d4af37 !important;
    color: #d4af37 !important;
    background: transparent !important;
    border-radius: 60px !important;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: background-color 0.22s ease, box-shadow 0.22s ease, color 0.22s ease !important;
    position: relative;
    overflow: hidden;
}

.btn-secondary::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.2), transparent);
    transform: translateX(-100%);
    transition: transform 0.7s;
    pointer-events: none;
}

.btn-secondary:hover::after {
    transform: translateX(100%);
}

.btn-secondary:hover {
    background: rgba(212, 175, 55, 0.15) !important;
    box-shadow:
        0 0 40px rgba(212, 175, 55, 0.6),
        0 0 80px rgba(124, 92, 255, 0.3),
        inset 0 0 25px rgba(212, 175, 55, 0.12) !important;
    transform: translateY(-3px);
    color: var(--accent-hover) !important;
}

/* HERO butonları */
.hero-actions .btn-primary,
.hero-actions .btn-secondary {
    font-size: 20px !important;
    padding: 17px 42px !important;
}

/* Daha Fazla → */
.btn-secondary {
    color: #d4af37 !important;
    font-weight: 700 !important;
}

/* HERO BAŞLIK */
.hero-title .line1 {
    font-size: clamp(56px, 10vw, 118px) !important;
    text-shadow:
        0 0 45px rgba(212, 175, 55, 0.55),
        0 0 90px rgba(212, 175, 55, 0.3) !important;
    will-change: auto;
}

.hero-title .line2 {
    font-size: clamp(48px, 8vw, 96px) !important;
    -webkit-text-stroke: 3px #d4af37 !important;
    text-shadow: 0 0 70px rgba(212, 175, 55, 0.5) !important;
    will-change: auto;
}

.hero-title .line3 {
    font-size: clamp(20px, 3vw, 38px) !important;
    color: #b8c0d0 !important;
    text-shadow:
        0 0 25px rgba(184, 192, 208, 0.6),
        0 0 50px rgba(184, 192, 208, 0.3) !important;
    will-change: auto;
}

/* AI WIDGET sağ alt */
.ai-widget-btn {
    width: 68px !important;
    height: 68px !important;
    font-size: 30px !important;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff) !important;
    background-size: 250% 250% !important;
    box-shadow:
        0 0 45px rgba(212, 175, 55, 0.7),
        0 0 90px rgba(124, 92, 255, 0.4) !important;
    will-change: transform, box-shadow;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: transform 0.22s ease, box-shadow 0.22s ease !important;
    animation: btnGradientShift 5s ease infinite;
    color: #0a0a0e !important;
}

.ai-widget-btn:hover {
    transform: scale(1.15) rotate(6deg);
    box-shadow:
        0 0 75px rgba(212, 175, 55, 1),
        0 0 130px rgba(124, 92, 255, 0.7) !important;
}

/* AI PANEL */
.ai-panel {
    width: 440px !important;
    background: linear-gradient(135deg, rgba(20, 20, 26, 0.98), rgba(10, 10, 14, 0.99)) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border: 1.5px solid #d4af37 !important;
    border-radius: 26px !important;
    will-change: transform;
    transform: translateZ(0);
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.75),
        0 0 60px rgba(212, 175, 55, 0.3),
        0 0 120px rgba(124, 92, 255, 0.15) !important;
}

.ai-msg.bot {
    font-size: 14px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12), rgba(124, 92, 255, 0.08)) !important;
}

.ai-msg.user {
    font-size: 14px !important;
    background: linear-gradient(135deg, rgba(184, 192, 208, 0.12), rgba(127, 212, 255, 0.08)) !important;
}

/* ============================================================ */
/* GOOGLE / FACEBOOK BUTONLARI                                  */
/* ============================================================ */
.btn-google {
    width: 100%;
    padding: 15px;
    background: #ffffff;
    border: none;
    border-radius: var(--radius-lg);
    color: #333;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.22s ease, box-shadow 0.22s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    margin-bottom: 13px;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.btn-google:hover {
    transform: scale(1.03) translateY(-3px);
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35),
        0 0 40px rgba(255, 255, 255, 0.2);
}

.btn-google i {
    color: #ea4335;
    font-size: 18px;
}

.btn-facebook {
    width: 100%;
    padding: 15px;
    background: linear-gradient(135deg, #1877f2, #0d5ec7);
    border: none;
    border-radius: var(--radius-lg);
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.22s ease, box-shadow 0.22s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    margin-bottom: 13px;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.btn-facebook:hover {
    transform: scale(1.03) translateY(-3px);
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35),
        0 0 40px rgba(24, 119, 242, 0.6);
}

.btn-facebook i {
    color: #ffffff;
    font-size: 18px;
}

/* ============================================================ */
/* [AETHRION] YORUM SİSTEMİ                                     */
/* ============================================================ */
#commentsSection {
    max-width: 880px;
    margin: 48px auto;
    padding: 24px;
    border-top: 1px solid var(--border);
}

#commentsSection h3 {
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-family: var(--font-display);
    font-size: 26px;
    margin-bottom: 24px;
    letter-spacing: -0.3px;
}

.comment-item {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.06), rgba(124, 92, 255, 0.04));
    padding: 15px 20px;
    border-radius: var(--radius-md);
    margin-bottom: 11px;
    border-left: 3px solid var(--border2);
    transition: background-color 0.22s ease, border-color 0.22s, box-shadow 0.22s;
}

.comment-item:hover {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12), rgba(124, 92, 255, 0.06));
    border-left-color: var(--accent);
    box-shadow: 0 4px 25px rgba(212, 175, 55, 0.18);
}

.comment-item .role-badge {
    font-size: 10px;
    padding: 4px 12px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.18), rgba(124, 92, 255, 0.1));
    color: var(--text3);
    border: 1px solid var(--border2);
    font-weight: 600;
    letter-spacing: 0.35px;
}

.comment-item .role-badge.founder {
    border-color: var(--gold);
    color: var(--gold);
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.5);
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.18), rgba(255, 140, 0, 0.1));
}
.comment-item .role-badge.admin {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}
.comment-item .role-badge.beta {
    border-color: var(--purple);
    color: var(--purple);
    box-shadow: 0 0 15px rgba(124, 92, 255, 0.5);
}
.comment-item .role-badge.moderator {
    border-color: var(--moderator);
    color: var(--moderator);
    box-shadow: 0 0 15px rgba(212, 175, 55, 0.6);
}
.comment-item .role-badge.user {
    border-color: var(--text3);
    color: var(--text3);
}

.comment-item .comment-text {
    margin: 8px 0 3px 0;
    color: var(--text2);
    font-size: 14px;
    line-height: 1.7;
}

.comment-item .comment-time {
    font-size: 10.5px;
    color: var(--text3);
    letter-spacing: 0.3px;
}

.comment-item .comment-email {
    font-size: 10.5px;
    color: var(--text3);
    margin-left: 9px;
}

#commentForm {
    margin-top: 20px;
}

#commentForm textarea {
    width: 100%;
    padding: 15px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-md);
    color: var(--text);
    font-size: 14px;
    resize: vertical;
    font-family: var(--font-body);
    transition: border-color 0.22s, box-shadow 0.22s;
}

#commentForm textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.4);
}

#commentLoginMessage {
    margin-top: 20px;
    padding: 15px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.06), rgba(124, 92, 255, 0.04));
    border-radius: var(--radius-md);
    border: 1px dashed var(--border2);
    text-align: center;
    color: var(--text3);
}

#commentLoginMessage .btn-secondary {
    display: inline-block;
    padding: 8px 20px;
    font-size: 12px;
}

/* ============================================================ */
/* [AETHRION] YORUMLAR MARQUEE                                  */
/* ============================================================ */
.comments-scroll {
    display: flex;
    overflow: hidden;
    width: 100%;
    position: relative;
    margin: 24px 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, black 8%, black 92%, transparent 100%);
}

.comments-track {
    display: flex;
    animation: scrollComments 32s linear infinite;
    gap: 24px;
    width: max-content;
    min-width: 100%;
    flex-wrap: nowrap;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    animation-play-state: running;
}

.comments-track:hover {
    animation-play-state: paused;
}

body.dashboard-open .comments-track {
    animation-play-state: paused !important;
}

.comment-item {
    flex: 0 0 auto;
    width: 340px;
    max-width: 92vw;
    margin: 0 10px;
    cursor: pointer;
}

@keyframes scrollComments {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.comments-track.single-copy {
    animation: none;
    justify-content: center;
}

/* ============================================================ */
/* YILDIZLAR ALTIN                                              */
/* ============================================================ */
.star, .star-rating label, .star-display {
    color: #d4af37 !important;
}

.star {
    font-size: 26px;
    cursor: pointer;
    transition: color 0.22s, transform 0.22s;
}

.star:hover {
    color: #e8c555 !important;
    transform: scale(1.25);
    text-shadow: 0 0 20px #d4af37, 0 0 40px rgba(212, 175, 55, 0.5);
}

/* ============================================================ */
/* FOUNDER PANEL ŞİFRE INPUT                                    */
/* ============================================================ */
#rolePanel .form-input,
#rolePanel input[type="password"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03)) !important;
    border: 1.5px solid var(--border2) !important;
    color: var(--text) !important;
    padding: 16px 20px !important;
    border-radius: var(--radius-lg) !important;
    margin-bottom: 20px !important;
}

/* ŞİFRE GÖSTERME BUTONLARI */
button[onclick*="togglePassword"] {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
    border: none !important;
    color: var(--text3) !important;
    cursor: pointer !important;
    font-size: 20px !important;
    padding: 0 9px !important;
    align-items: center !important;
    justify-content: center !important;
}

button[onclick*="togglePassword"] i {
    font-size: 20px !important;
}

/* DASHBOARD'DA AI WIDGET GİZLE */
body.dashboard-open .ai-widget,
body.dashboard-open .ai-widget-btn,
body.dashboard-open .ai-panel {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================================ */
/* [AETHRION] SPLASH INTRO (Eski stiller korundu)              */
/* ============================================================ */
.splash-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(ellipse at 50% 40%, #0f0f14 0%, #050507 60%, #000000 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    transition: opacity 0.85s ease, visibility 0.85s ease;
    overflow: hidden;
    contain: layout style paint;
}

.splash-screen.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.splash-screen::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 30% 50%, rgba(212, 175, 55, 0.18) 0%, transparent 60%),
        radial-gradient(ellipse at 70% 80%, rgba(124, 92, 255, 0.15) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 20%, rgba(127, 212, 255, 0.12) 0%, transparent 40%);
    animation: splashBgPulse 7s ease-in-out infinite alternate;
    z-index: 0;
    will-change: opacity, transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

@keyframes splashBgPulse {
    0%   { opacity: 0.6; transform: scale(1); }
    100% { opacity: 1;   transform: scale(1.06); }
}

.splash-particles {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}

.splash-particle {
    position: absolute;
    width: 3px;
    height: 3px;
    background: rgba(212, 175, 55, 0.55);
    border-radius: 50%;
    animation: floatParticle linear infinite;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 10px currentColor;
}

.splash-particle:nth-child(odd) {
    background: rgba(124, 92, 255, 0.55);
    width: 4px;
    height: 4px;
}

.splash-particle:nth-child(3n) {
    background: rgba(127, 212, 255, 0.5);
}

.splash-particle:nth-child(5n) {
    background: rgba(184, 192, 208, 0.5);
}

@keyframes floatParticle {
    0%   { transform: translateY(100vh) scale(0); opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 0.6; }
    100% { transform: translateY(-10vh) scale(1); opacity: 0; }
}

.splash-logo {
    width: 130px;
    height: 130px;
    background: radial-gradient(circle, #d4af37 0%, #7c5cff 50%, #b8c0d0 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    color: #0a0a0e;
    box-shadow:
        0 0 90px rgba(212, 175, 55, 0.7),
        0 0 180px rgba(124, 92, 255, 0.4);
    animation: splashPulse 2s ease-in-out infinite;
    position: relative;
    z-index: 2;
    will-change: transform, box-shadow;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

@keyframes splashPulse {
    0%   { transform: scale(1);    box-shadow: 0 0 45px rgba(212, 175, 55, 0.5); }
    50%  { transform: scale(1.1);  box-shadow: 0 0 120px rgba(212, 175, 55, 0.9); }
    100% { transform: scale(1);    box-shadow: 0 0 45px rgba(212, 175, 55, 0.5); }
}

.splash-title {
    margin-top: 32px;
    font-family: var(--font-display);
    font-size: 34px;
    font-weight: 800;
    background: linear-gradient(90deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff, #d4af37);
    background-size: 400% 300%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 3s ease infinite, fadeUp 1.3s ease forwards;
    position: relative;
    z-index: 2;
    letter-spacing: 2.5px;
    will-change: background-position;
}

/* ============================================================ */
/* SPLASH EKRANI - AETHRION TASARIM                             */
/* ============================================================ */
.splash-logo {
    width: 200px;
    height: 200px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
    overflow: visible;
    animation: splashLogoEnter 1s ease-out forwards,
               splashLogoPulse 2.8s ease-in-out 1s infinite;
}

/* Eski ::before ve ::after halkalarını devre dışı bırak */
.splash-logo::before,
.splash-logo::after {
    display: none !important;
}

.splash-logo img,
.splash-logo svg {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
    border-radius: 0;
    filter: drop-shadow(0 0 40px rgba(212,175,55,0.9))
            drop-shadow(0 0 80px rgba(124,92,255,0.6));
}

@keyframes splashLogoPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 20px rgba(212,175,55,0.6));
    }
    50% {
        transform: scale(1.06);
        filter: drop-shadow(0 0 55px rgba(212,175,55,0.95))
                drop-shadow(0 0 100px rgba(124,92,255,0.7));
    }
}

.splash-logo::before {
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 39px;
    background: conic-gradient(
        from 0deg,
        #d4af37,
        #b8c0d0,
        #7c5cff,
        #e8c555,
        #7fd4ff,
        #d4af37
    );
    animation: splashLogoBorder 5s linear infinite;
    z-index: -1;
}

.splash-logo::after {
    content: '';
    position: absolute;
    inset: 4px;
    border-radius: 32px;
    background: #0a0a0e;
    z-index: -1;
}

.splash-logo img,
.splash-logo svg {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    border-radius: 26px;
    filter: drop-shadow(0 0 25px rgba(212, 175, 55, 0.45));
}

@keyframes splashLogoEnter {
    0%   { opacity: 0; transform: scale(0.5) rotate(-10deg); }
    70%  { opacity: 1; transform: scale(1.08) rotate(2deg); }
    100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

@keyframes splashLogoPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow:
            0 0 50px rgba(212, 175, 55, 0.4),
            0 0 110px rgba(124, 92, 255, 0.28);
    }
    50% {
        transform: scale(1.04);
        box-shadow:
            0 0 65px rgba(212, 175, 55, 0.6),
            0 0 140px rgba(124, 92, 255, 0.45);
    }
}

@keyframes splashLogoBorder {
    to { transform: rotate(360deg); }
}

.splash-title {
    margin-top: 30px;
    font-family: var(--font-display);
    font-size: clamp(32px, 5.5vw, 46px);
    line-height: 1;
    font-weight: 900;
    letter-spacing: 5px;
    text-align: center;
    background: linear-gradient(
        90deg,
        #d4af37,
        #e8c555,
        #b8c0d0,
        #7c5cff,
        #7fd4ff,
        #d4af37
    );
    background-size: 500% 500%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation:
        gradientMove 4s ease infinite,
        splashTextEnter 1.05s ease forwards;
    position: relative;
    z-index: 2;
}

.splash-sub {
    color: #8c8ca6;
    font-size: 15px;
    margin-top: 18px;
    letter-spacing: 5px;
    text-align: center;
    animation: splashTextEnter 1.35s ease forwards;
    position: relative;
    z-index: 2;
    opacity: 0;
    text-transform: uppercase;
    font-style: italic;
}

.splash-sub em {
    font-style: italic;
    color: #d4af37;
    text-shadow: 0 0 25px rgba(212, 175, 55, 0.7);
    font-weight: 700;
}

.splash-status {
    margin-top: 22px;
    min-height: 22px;
    color: rgba(255, 255, 255, 0.78);
    font-family: var(--font-code);
    font-size: 11.5px;
    letter-spacing: 3px;
    text-align: center;
    position: relative;
    z-index: 2;
    animation: splashTextEnter 1.5s ease forwards;
    opacity: 0;
    text-transform: uppercase;
}

.splash-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 8px;
    border-radius: 50%;
    background: #b8c0d0;
    box-shadow: 0 0 18px rgba(184, 192, 208, 0.9);
    animation: splashStatusBlink 1s ease-in-out infinite;
    vertical-align: middle;
}

@keyframes splashStatusBlink {
    0%, 100% { opacity: 0.35; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1.2); }
}

.splash-progress-wrap {
    width: min(460px, 82vw);
    margin-top: 28px;
    position: relative;
    z-index: 2;
}

.splash-progress-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 11px;
    font-family: var(--font-code);
    font-size: 10.5px;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
}

.splash-progress {
    width: 100%;
    height: 13px;
    padding: 2.5px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(212, 175, 55, 0.2);
    border-radius: var(--radius-pill);
    overflow: hidden;
    box-shadow:
        0 0 25px rgba(212, 175, 55, 0.22),
        inset 0 0 15px rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.splash-progress-bar {
    width: 0%;
    height: 100%;
    border-radius: var(--radius-pill);
    background: linear-gradient(
        90deg,
        #d4af37,
        #e8c555,
        #b8c0d0,
        #7c5cff,
        #7fd4ff,
        #d4af37
    );
    background-size: 250% 100%;
    transition: width 0.1s linear;
    animation: splashProgressShine 1.4s linear infinite;
    box-shadow:
        0 0 18px rgba(212, 175, 55, 0.75),
        0 0 40px rgba(124, 92, 255, 0.35);
    position: relative;
    overflow: hidden;
    will-change: width;
}

.splash-progress-bar::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: -28%;
    width: 28%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.85),
        transparent
    );
    animation: splashProgressSweep 1.25s linear infinite;
}

@keyframes splashProgressShine {
    0%   { background-position: 0% 50%; }
    100% { background-position: 250% 50%; }
}

@keyframes splashProgressSweep {
    0%   { left: -28%; }
    100% { left: 112%; }
}

.splash-progress-info {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 12px;
    font-family: var(--font-code);
    font-size: 11.5px;
    color: rgba(255, 255, 255, 0.5);
}

.splash-percent {
    color: #ffffff;
    font-weight: 800;
    min-width: 46px;
    text-align: right;
    font-family: var(--font-code);
    text-shadow: 0 0 18px rgba(212, 175, 55, 0.65);
}

.splash-complete {
    color: #b8c0d0 !important;
    text-shadow: 0 0 25px rgba(184, 192, 208, 0.7);
}

.splash-ready {
    position: relative;
    z-index: 2;
    margin-top: 15px;
    font-size: 10.5px;
    letter-spacing: 3.5px;
    color: rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
}

.splash-version {
    position: absolute;
    bottom: 28px;
    right: 34px;
    font-size: 10.5px;
    color: rgba(255, 255, 255, 0.22);
    font-family: var(--font-code);
    letter-spacing: 1.8px;
    z-index: 2;
}

@keyframes splashTextEnter {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .splash-logo {
        width: 112px;
        height: 112px;
        border-radius: 29px;
    }

    .splash-logo::before {
        border-radius: 31px;
    }

    .splash-logo::after {
        border-radius: 25px;
    }

    .splash-title {
        margin-top: 24px;
        letter-spacing: 3px;
    }

    .splash-sub {
        font-size: 11.5px;
        letter-spacing: 3px;
        padding: 0 20px;
    }

    .splash-progress-wrap {
        width: 82vw;
    }

    .splash-version {
        right: 20px;
        bottom: 20px;
    }
}

/* ============================================================ */
/* İNDİR POPUP'U                                                */
/* ============================================================ */
.download-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.78);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 99999;
    align-items: flex-end;
    justify-content: center;
    padding: 22px;
    overflow-x: hidden;
}

.download-modal-overlay.active {
    display: flex;
}

.download-modal {
    background: linear-gradient(135deg, rgba(20, 20, 26, 0.99), rgba(10, 10, 14, 0.995));
    border: 1.5px solid var(--accent);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    width: 100%;
    max-width: 540px;
    padding: 36px 28px 46px;
    animation: slideUp 0.45s ease;
    box-shadow:
        0 -15px 60px rgba(0, 0, 0, 0.75),
        0 0 70px rgba(212, 175, 55, 0.25);
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    position: relative;
}

.download-modal::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent,
        var(--accent),
        var(--platinum),
        var(--purple),
        var(--ice),
        transparent
    );
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 25px var(--accent);
}

@keyframes slideUp {
    from { transform: translateY(100%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.download-modal h3 {
    font-family: var(--font-display);
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-align: center;
    margin-bottom: 28px;
    font-size: 26px;
}

.download-btn-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.download-btn-group .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    width: 100%;
    padding: 17px;
    border-radius: 60px;
    font-size: 16px;
    font-weight: 700;
    transition: transform 0.22s, box-shadow 0.22s;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.download-btn-group .btn:hover {
    transform: scale(1.04) translateY(-3px);
}

.btn-download-play {
    background: linear-gradient(135deg, #0f0f0f, #000000);
    border: 1.5px solid #444;
    color: #fff;
}

.btn-download-play:hover {
    box-shadow: 0 0 40px rgba(255, 255, 255, 0.28);
}

.btn-download-apple {
    background: linear-gradient(135deg, #1a1a1a, #0a0a0a);
    border: 1.5px solid #555;
    color: #fff;
}

.btn-download-apple:hover {
    box-shadow: 0 0 40px rgba(255, 255, 255, 0.22);
}

.btn-download-apk {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    background-size: 250% 250%;
    color: #0a0a0e;
    border: none;
    box-shadow: 0 0 30px rgba(212, 175, 55, 0.6);
    animation: btnGradientShift 5s ease infinite;
}

.btn-download-apk:hover {
    box-shadow: 0 0 55px rgba(212, 175, 55, 0.95), 0 0 110px rgba(124, 92, 255, 0.5);
}

.btn-download-close {
    background: transparent;
    border: 1.5px solid var(--danger);
    color: var(--danger);
    margin-top: 9px;
}

.btn-download-close:hover {
    background: rgba(239, 68, 68, 0.18);
    box-shadow: 0 0 25px rgba(239, 68, 68, 0.5);
}

/* ============================================================ */
/* A27 PUAN ROZETİ                                              */
/* ============================================================ */
.points-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(135deg, #d4af37, #e8c555, #b8c0d0);
    background-size: 200% 200%;
    color: #0a0a0e;
    padding: 8px 20px 8px 14px;
    border-radius: var(--radius-pill);
    font-weight: 800;
    font-size: 14px;
    box-shadow:
        0 0 30px rgba(212, 175, 55, 0.6),
        inset 0 0 12px rgba(255, 255, 255, 0.25);
    border: 1px solid #d4af37;
    animation: btnGradientShift 5s ease infinite;
}

.points-badge i {
    font-size: 18px;
}

.points-badge .points-amount {
    font-size: 17px;
}

/* ============================================================ */
/* [AETHRION] STORE / ÜRÜN KARTLARI                            */
/* ============================================================ */
.store-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 24px;
    margin-top: 24px;
}

.store-item {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.06), rgba(124, 92, 255, 0.04));
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 24px 20px;
    text-align: center;
    transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
    cursor: pointer;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    position: relative;
    overflow: hidden;
}

.store-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.12), transparent);
    transition: left 0.7s;
    pointer-events: none;
}

.store-item:hover::before {
    left: 100%;
}

.store-item:hover {
    transform: translateY(-7px) scale(1.03);
    border-color: var(--accent);
    box-shadow:
        0 15px 50px rgba(0, 0, 0, 0.5),
        0 0 50px rgba(212, 175, 55, 0.3),
        0 0 100px rgba(124, 92, 255, 0.15);
}

.store-item .item-icon {
    font-size: 44px;
    margin-bottom: 14px;
    filter: drop-shadow(0 0 20px rgba(212, 175, 55, 0.5));
}

.store-item .item-name {
    font-weight: 700;
    color: var(--text);
    font-size: 15px;
}

.store-item .item-price {
    color: var(--gold);
    font-weight: 700;
    font-size: 14.5px;
    margin: 8px 0 15px;
    text-shadow: 0 0 18px rgba(212, 175, 55, 0.6);
}

.store-item .btn-sm {
    font-size: 12px !important;
    padding: 8px 22px !important;
}

/* ============================================================ */
/* [AETHRION] GÖREV KARTLARI                                   */
/* ============================================================ */
.task-card {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.07), rgba(124, 92, 255, 0.04));
    border-left: 4px solid var(--accent);
    padding: 20px 24px;
    border-radius: var(--radius-md);
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
    transition: transform 0.22s, box-shadow 0.22s;
}

.task-card:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 30px rgba(212, 175, 55, 0.18);
}

.task-card.completed {
    border-left-color: var(--success);
    opacity: 0.78;
}

.task-card .task-info {
    display: flex;
    align-items: center;
    gap: 15px;
}

.task-card .task-points {
    background: linear-gradient(135deg, var(--gold), #e8c555);
    color: #0a0a0e;
    padding: 4px 15px;
    border-radius: var(--radius-pill);
    font-weight: 800;
    font-size: 13px;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.6);
    letter-spacing: 0.35px;
}

.task-card .task-status {
    font-size: 12.5px;
    color: var(--text3);
}

/* ============================================================ */
/* [AETHRION] ANKET / OYLAMA                                   */
/* ============================================================ */
.poll-container {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.06), rgba(124, 92, 255, 0.04));
    border-radius: var(--radius-lg);
    padding: 28px;
    border: 1px solid var(--border2);
    margin: 20px 0;
    box-shadow: 0 0 40px rgba(212, 175, 55, 0.1);
}

.poll-question {
    font-size: 22px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 20px;
    font-family: var(--font-display);
    letter-spacing: -0.35px;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.poll-option {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 17px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border-radius: var(--radius-md);
    margin-bottom: 11px;
    cursor: pointer;
    transition: border-color 0.22s, transform 0.22s, box-shadow 0.22s;
    border: 1.5px solid transparent;
}

.poll-option:hover {
    border-color: var(--accent);
    transform: translateX(4px);
    box-shadow: 0 4px 25px rgba(212, 175, 55, 0.25);
}

.poll-option .poll-bar {
    flex: 1;
    height: 10px;
    background: rgba(38, 38, 50, 0.65);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.45);
}

.poll-option .poll-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 100%;
    width: 0%;
    transition: width 0.75s ease;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.6);
    border-radius: 10px;
}

.poll-option .poll-percent {
    min-width: 48px;
    font-weight: 700;
    color: var(--accent);
    font-size: 14px;
    text-align: right;
    text-shadow: 0 0 12px rgba(212, 175, 55, 0.6);
}

.poll-option .poll-votes {
    color: var(--text3);
    font-size: 12px;
}

/* ============================================================ */
/* [AETHRION] DM / SOSYAL MESAJLAŞMA                           */
/* ============================================================ */
.dm-container {
    display: flex;
    gap: 22px;
    height: 560px;
    background: linear-gradient(135deg, rgba(20, 20, 26, 0.94), rgba(10, 10, 14, 0.96));
    border-radius: var(--radius-lg);
    border: 1.5px solid var(--border2);
    overflow: hidden;
    box-shadow:
        0 15px 50px rgba(0, 0, 0, 0.55),
        0 0 50px rgba(212, 175, 55, 0.12);
}

.dm-conversations {
    width: 320px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border-right: 1px solid var(--border2);
    overflow-y: auto;
    overflow-x: hidden;
    flex-shrink: 0;
    overflow-anchor: none;
}

.dm-conversation-item {
    padding: 16px 22px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    transition: background-color 0.18s, border-left 0.18s;
    display: flex;
    align-items: center;
    gap: 13px;
    border-left: 3px solid transparent;
}

.dm-conversation-item:hover {
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.1), transparent);
    border-left-color: var(--accent);
}

.dm-conversation-item.active {
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.18), transparent);
    border-left: 3px solid var(--accent);
}

.dm-conversation-item .dm-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--platinum), var(--purple));
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #0a0a0e;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.dm-conversation-item .dm-name {
    font-weight: 600;
    color: var(--text);
}

.dm-conversation-item .dm-last-msg {
    font-size: 12px;
    color: var(--text3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dm-chat {
    flex: 1;
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.28);
}

.dm-chat-header {
    padding: 18px 24px;
    border-bottom: 1px solid var(--border2);
    font-weight: 700;
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.1), rgba(124, 92, 255, 0.05));
    color: var(--accent);
    letter-spacing: 0.35px;
}

.dm-messages {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 13px;
    overflow-anchor: none;
}

.dm-msg {
    max-width: 78%;
    padding: 12px 18px;
    border-radius: var(--radius-xl);
    font-size: 14px;
    word-wrap: break-word;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28);
}

.dm-msg.sent {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    background-size: 250% 250%;
    color: #0a0a0e;
    align-self: flex-end;
    border-bottom-right-radius: 4px;
    box-shadow:
        0 4px 25px rgba(212, 175, 55, 0.45),
        inset 0 0 12px rgba(255, 255, 255, 0.12);
    animation: btnGradientShift 6s ease infinite;
    font-weight: 600;
}

.dm-msg.received {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12), rgba(124, 92, 255, 0.08));
    color: var(--text);
    align-self: flex-start;
    border-bottom-left-radius: 4px;
    border: 1px solid var(--border2);
}

.dm-msg .dm-file {
    max-width: 150px;
    border-radius: 8px;
    margin-top: 4px;
}

.dm-input-area {
    padding: 15px 20px;
    border-top: 1px solid var(--border2);
    display: flex;
    gap: 11px;
    align-items: center;
    background: rgba(0, 0, 0, 0.35);
}

.dm-input-area input {
    flex: 1;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border: 1.5px solid var(--border2);
    color: var(--text);
    padding: 12px 20px;
    border-radius: var(--radius-pill);
    font-size: 14px;
    transition: border-color 0.22s, box-shadow 0.22s;
}

.dm-input-area input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.4);
}

.dm-input-area .dm-file-btn {
    background: transparent;
    border: 1.5px solid var(--border2);
    border-radius: 50%;
    width: 42px;
    height: 42px;
    color: var(--text3);
    font-size: 18px;
    cursor: pointer;
    transition: all 0.22s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dm-input-area .dm-file-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

/* ============================================================ */
/* [AETHRION] EBEVEYN PANELİ                                   */
/* ============================================================ */
.parent-panel {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.06), rgba(255, 140, 0, 0.04));
    border: 2px solid var(--gold);
    border-radius: var(--radius-xl);
    padding: 34px;
    margin-top: 24px;
    box-shadow:
        0 0 50px rgba(212, 175, 55, 0.25),
        0 0 100px rgba(255, 140, 0, 0.1),
        inset 0 0 70px rgba(212, 175, 55, 0.04);
}

.parent-panel .panel-title {
    color: var(--gold);
    font-family: var(--font-display);
    font-size: 26px;
    display: flex;
    align-items: center;
    gap: 13px;
    text-shadow: 0 0 25px rgba(212, 175, 55, 0.6);
    letter-spacing: -0.3px;
}

.parent-setting {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 17px 0;
    border-bottom: 1px solid rgba(212, 175, 55, 0.12);
}

.parent-setting .setting-label {
    font-weight: 500;
    color: var(--text2);
}

.parent-setting .setting-control {
    display: flex;
    align-items: center;
    gap: 17px;
}

.toggle-switch {
    width: 52px;
    height: 30px;
    background: linear-gradient(135deg, #2a2a3c, #1a1a24);
    border-radius: 30px;
    cursor: pointer;
    position: relative;
    transition: background-color 0.35s, box-shadow 0.35s;
    will-change: background-color;
    border: 1px solid var(--border2);
}

.toggle-switch.active {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    background-size: 200% 200%;
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.6);
    animation: btnGradientShift 5s ease infinite;
}

.toggle-switch::after {
    content: '';
    width: 24px;
    height: 24px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    transition: left 0.35s;
    will-change: left;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.toggle-switch.active::after {
    left: 25px;
}

/* ============================================================ */
/* [AETHRION] KONFETİ / SEVİYE ATLAMA                          */
/* ============================================================ */
.confetti-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 99999;
    overflow: hidden;
}

.confetti-piece {
    position: absolute;
    width: 12px;
    height: 12px;
    opacity: 0;
    animation: confettiFall 3.5s ease-in forwards;
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 15px currentColor;
}

@keyframes confettiFall {
    0%   { transform: translateY(-10vh) rotate(0deg) scale(1); opacity: 1; }
    100% { transform: translateY(110vh) rotate(720deg) scale(0.2); opacity: 0; }
}

.level-up-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: linear-gradient(135deg, rgba(20, 20, 26, 0.99), rgba(10, 10, 14, 0.995));
    border: 2px solid var(--gold);
    border-radius: 36px;
    padding: 46px 56px;
    z-index: 99998;
    text-align: center;
    box-shadow:
        0 0 120px rgba(212, 175, 55, 0.5),
        0 0 240px rgba(255, 140, 0, 0.25),
        inset 0 0 70px rgba(212, 175, 55, 0.06);
    animation: levelUpPop 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

@keyframes levelUpPop {
    0%   { transform: translate(-50%, -50%) scale(0.5); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(1);   opacity: 1; }
}

.level-up-modal .level-title {
    font-family: var(--font-display);
    font-size: 48px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 70px rgba(212, 175, 55, 0.5);
    letter-spacing: -0.6px;
    animation: gradientMove 5s ease infinite;
}

.level-up-modal .level-sub {
    font-size: 19px;
    color: var(--text2);
    margin-top: 12px;
}

.level-up-modal .level-badge {
    font-size: 92px;
    display: block;
    margin: 16px 0;
    filter: drop-shadow(0 0 35px currentColor);
}

/* ============================================================ */
/* [AETHRION] UZAY MODU (02:00-05:00) — Derin Kuantum         */
/* ============================================================ */
body.space-mode {
    background: #010205 !important;
}

body.space-mode .hero,
body.space-mode .features,
body.space-mode .ai-section,
body.space-mode .pricing,
body.space-mode .category-section {
    background: transparent !important;
}

body.space-mode .navbar,
body.space-mode nav {
    background: rgba(5, 5, 20, 0.92) !important;
    border-bottom-color: rgba(124, 92, 255, 0.35) !important;
    box-shadow:
        0 4px 50px rgba(124, 92, 255, 0.4),
        0 0 100px rgba(212, 175, 55, 0.15);
}

body.space-mode .space-stars {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    background: transparent;
    overflow: hidden;
}

body.space-mode .space-stars::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(2px 2px at 20% 30%, #fff, transparent),
        radial-gradient(2px 2px at 40% 70%, #d4af37, transparent),
        radial-gradient(2px 2px at 60% 20%, #fff, transparent),
        radial-gradient(2px 2px at 80% 80%, #7c5cff, transparent),
        radial-gradient(1px 1px at 10% 90%, #fff, transparent),
        radial-gradient(1px 1px at 90% 10%, #b8c0d0, transparent),
        radial-gradient(1.5px 1.5px at 50% 50%, #d4af37, transparent);
    background-size: 200px 200px;
    background-repeat: repeat;
    opacity: 0.78;
    animation: twinkle 5s ease-in-out infinite alternate;
    will-change: opacity;
}

@keyframes twinkle {
    0%   { opacity: 0.45; }
    100% { opacity: 1; }
}

.space-badge {
    background: linear-gradient(135deg, #1a0a2e, #0d1b2a);
    border: 1.5px solid #7c5cff;
    color: #b8a0ff;
    padding: 6px 18px;
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 700;
    box-shadow:
        0 0 30px rgba(124, 92, 255, 0.6),
        inset 0 0 18px rgba(124, 92, 255, 0.12);
    letter-spacing: 0.4px;
}

.x2-badge {
    background: linear-gradient(135deg, #d4af37, #ff7a45, #7c5cff);
    background-size: 200% 200%;
    color: #0a0a0e;
    padding: 4px 14px;
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 800;
    animation: pulseX2 1.4s infinite, btnGradientShift 5s ease infinite;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.7);
    letter-spacing: 0.55px;
}

@keyframes pulseX2 {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.12); }
    100% { transform: scale(1); }
}

/* ============================================================ */
/* [AETHRION] KARANLIK / AYDINLIK TEMA                         */
/* ============================================================ */
body.light-theme {
    --bg: #f3f4f6;
    --bg2: #e5e7eb;
    --surface: #ffffff;
    --surface2: #f9fafb;
    --border: #d1d5db;
    --text: #111827;
    --text2: #374151;
    --text3: #6b7280;
}

body.light-theme .navbar,
body.light-theme nav {
    background: rgba(255, 255, 255, 0.92) !important;
}

body.light-theme .dashboard-card {
    background: rgba(255, 255, 255, 0.94) !important;
}

body.light-theme .legal-banner {
    background: linear-gradient(135deg, #7c5cff, #6a4eff) !important;
}

.theme-toggle-btn {
    background: transparent;
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-pill);
    padding: 8px 18px;
    color: var(--text);
    cursor: pointer;
    font-size: 18px;
    transition: border-color 0.22s, box-shadow 0.22s, transform 0.22s;
}

.theme-toggle-btn:hover {
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.5);
    transform: rotate(20deg) scale(1.08);
}

/* ============================================================ */
/* TOGGLE SWITCH VARYANTLARI                                    */
/* ============================================================ */
.toggle-switch-sm {
    width: 40px;
    height: 24px;
    background: linear-gradient(135deg, #2a2a3c, #1a1a24);
    border-radius: 30px;
    cursor: pointer;
    position: relative;
    transition: background-color 0.35s, box-shadow 0.35s;
    display: inline-block;
    vertical-align: middle;
    will-change: background-color;
    border: 1px solid var(--border2);
}

.toggle-switch-sm.active {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    background-size: 200% 200%;
    box-shadow: 0 0 18px rgba(212, 175, 55, 0.6);
    animation: btnGradientShift 5s ease infinite;
}

.toggle-switch-sm::after {
    content: '';
    width: 18px;
    height: 18px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    transition: left 0.35s;
    will-change: left;
}

.toggle-switch-sm.active::after {
    left: 19px;
}

.toggle-switch-xs {
    width: 32px;
    height: 20px;
    background: linear-gradient(135deg, #2a2a3c, #1a1a24);
    border-radius: 20px;
    cursor: pointer;
    position: relative;
    transition: background-color 0.35s, box-shadow 0.35s;
    display: inline-block;
    vertical-align: middle;
    will-change: background-color;
    border: 1px solid var(--border2);
}

.toggle-switch-xs.active {
    background: linear-gradient(135deg, #b8c0d0, #9aa4b8);
    box-shadow: 0 0 18px rgba(184, 192, 208, 0.6);
}

.toggle-switch-xs::after {
    content: '';
    width: 14px;
    height: 14px;
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    transition: left 0.35s;
    will-change: left;
}

.toggle-switch-xs.active::after {
    left: 15px;
}

/* ============================================================ */
/* [AETHRION] BUTON VARYANTLARI                                */
/* ============================================================ */
.btn-copy {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.14), rgba(124, 92, 255, 0.08));
    border: 1.5px solid rgba(212, 175, 55, 0.35);
    color: var(--text3);
    padding: 6px 16px;
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.35px;
}

.btn-copy:hover {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.28), rgba(124, 92, 255, 0.18));
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.btn-copy.copied {
    background: linear-gradient(135deg, rgba(184, 192, 208, 0.22), rgba(212, 175, 55, 0.12));
    border-color: var(--accent2);
    color: var(--accent2);
    box-shadow: 0 0 20px rgba(184, 192, 208, 0.5);
}

.btn-reveal {
    background: transparent;
    border: 1.5px solid var(--border2);
    color: var(--text3);
    padding: 6px 15px;
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.18s, color 0.18s, background-color 0.18s, box-shadow 0.18s;
    font-family: var(--font-body);
}

.btn-reveal:hover {
    border-color: var(--accent2);
    color: var(--accent2);
    background: rgba(184, 192, 208, 0.12);
    box-shadow: 0 0 20px rgba(184, 192, 208, 0.4);
}

.btn-reveal.active {
    background: rgba(184, 192, 208, 0.18);
    border-color: var(--accent2);
    color: var(--accent2);
    box-shadow: 0 0 20px rgba(184, 192, 208, 0.5);
}

.btn-stop {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(230, 57, 70, 0.08)) !important;
    border: 1.5px solid rgba(239, 68, 68, 0.4) !important;
    color: var(--danger) !important;
    padding: 6px 16px;
    border-radius: var(--radius-pill);
    font-size: 10.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.25px;
}

.btn-stop:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.32), rgba(230, 57, 70, 0.22)) !important;
    border-color: var(--danger) !important;
    color: #fff !important;
    box-shadow: 0 0 25px rgba(239, 68, 68, 0.6) !important;
}

.btn-edit {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(255, 140, 0, 0.06)) !important;
    border: 1.5px solid rgba(245, 158, 11, 0.4) !important;
    color: var(--warning) !important;
    padding: 6px 16px;
    border-radius: var(--radius-pill);
    font-size: 10.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.25px;
}

.btn-edit:hover {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.32), rgba(255, 140, 0, 0.22)) !important;
    border-color: var(--warning) !important;
    color: #fff !important;
    box-shadow: 0 0 25px rgba(245, 158, 11, 0.6) !important;
}

.btn-action-icon {
    background: transparent;
    border: 1.5px solid var(--border2);
    color: var(--text3);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 14px;
    transition: border-color 0.18s, color 0.18s, background-color 0.18s, transform 0.18s;
    padding: 0;
}

.btn-action-icon:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: rgba(212, 175, 55, 0.12);
    transform: scale(1.15);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.5);
}

.btn-action-icon.danger:hover {
    border-color: var(--danger);
    color: var(--danger);
    background: rgba(239, 68, 68, 0.12);
    box-shadow: 0 0 20px rgba(239, 68, 68, 0.5);
}

.btn-gradient-border {
    background: transparent;
    border: 2px solid transparent;
    background-image:
        linear-gradient(var(--surface), var(--surface)),
        linear-gradient(135deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    background-origin: border-box;
    background-clip: padding-box, border-box;
    color: var(--accent);
    padding: 12px 28px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: box-shadow 0.22s, transform 0.22s;
    font-family: var(--font-body);
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    letter-spacing: 0.35px;
}

.btn-gradient-border:hover {
    box-shadow:
        0 0 40px rgba(212, 175, 55, 0.5),
        0 0 80px rgba(124, 92, 255, 0.3);
    transform: scale(1.04) translateY(-2px);
}

.btn-ghost {
    background: transparent;
    border: none;
    color: var(--text3);
    padding: 8px 15px;
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    cursor: pointer;
    transition: background-color 0.18s, color 0.18s;
    font-family: var(--font-body);
}

.btn-ghost:hover {
    background: rgba(255, 255, 255, 0.07);
    color: var(--text);
}

.btn-success-soft {
    background: linear-gradient(135deg, rgba(184, 192, 208, 0.14), rgba(200, 200, 200, 0.08));
    border: 1.5px solid rgba(184, 192, 208, 0.35);
    color: var(--accent2);
    padding: 10px 24px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.35px;
}

.btn-success-soft:hover {
    background: linear-gradient(135deg, rgba(184, 192, 208, 0.28), rgba(200, 200, 200, 0.18));
    border-color: var(--accent2);
    color: #0a0a0e;
    box-shadow: 0 0 25px rgba(184, 192, 208, 0.6);
}

.btn-warning-soft {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.14), rgba(255, 140, 0, 0.08));
    border: 1.5px solid rgba(245, 158, 11, 0.35);
    color: var(--warning);
    padding: 10px 24px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.35px;
}

.btn-warning-soft:hover {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.32), rgba(255, 140, 0, 0.22));
    border-color: var(--warning);
    color: #fff;
    box-shadow: 0 0 25px rgba(245, 158, 11, 0.6);
}

/* ============================================================ */
/* API ANAHTAR YÖNETİMİ EK STİLLERİ                            */
/* ============================================================ */
.api-keys-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 11px 0;
    border-bottom: 1px solid var(--border2);
    margin-bottom: 15px;
    flex-wrap: wrap;
    gap: 9px;
}

.api-keys-header h4 {
    color: var(--accent);
    font-size: 15px;
    margin: 0;
    letter-spacing: 0.35px;
}

.api-keys-empty {
    text-align: center;
    padding: 34px 24px;
    color: var(--text3);
    font-size: 13px;
    font-style: italic;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.04), rgba(124, 92, 255, 0.02));
    border-radius: var(--radius-md);
    border: 1px dashed var(--border2);
}

.api-password-screen .btn-group {
    display: flex;
    flex-direction: column;
    gap: 11px;
    width: 100%;
    max-width: 340px;
    margin-top: 9px;
}

.api-key-type {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.18), rgba(124, 92, 255, 0.1));
    border: 1px solid var(--accent);
    color: var(--accent);
    margin-left: 7px;
    vertical-align: middle;
    letter-spacing: 0.6px;
}

.api-key-type.openai    { border-color: #10a37f; color: #10a37f; background: rgba(16, 163, 127, 0.18); }
.api-key-type.groq      { border-color: #ff7a45; color: #ff7a45; background: rgba(255, 122, 69, 0.18); }
.api-key-type.deepseek  { border-color: #4d6bfe; color: #4d6bfe; background: rgba(77, 107, 254, 0.18); }
.api-key-type.gemini    { border-color: #4285f4; color: #4285f4; background: rgba(66, 133, 244, 0.18); }
.api-key-type.anthropic { border-color: #d97757; color: #d97757; background: rgba(217, 119, 87, 0.18); }
.api-key-type.nvidia    { border-color: #76b900; color: #76b900; background: rgba(118, 185, 0, 0.18); }
.api-key-type.a27 {
    border-color: var(--gold);
    color: var(--gold);
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(255, 140, 0, 0.12));
    box-shadow: 0 0 12px rgba(212, 175, 55, 0.5);
}

.api-input-hint {
    font-size: 11.5px;
    color: var(--text3);
    margin-top: -8px;
    margin-bottom: 15px;
    padding-left: 4px;
    line-height: 1.55;
}

/* ============================================================ */
/* AI MESAJ AKSİYON VARYANTLARI                                 */
/* ============================================================ */
.ai-msg-actions-container {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    opacity: 0.55;
    transition: opacity 0.22s ease;
    flex-wrap: wrap;
    align-items: center;
}

.ai-message:hover .ai-msg-actions-container {
    opacity: 1;
}

.ai-message.stopped {
    opacity: 0.65;
    font-style: italic;
    border-left-color: var(--warning) !important;
}

.ai-thinking-indicator {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1), rgba(124, 92, 255, 0.05));
    border-radius: var(--radius-lg);
    border-left: 3px solid var(--accent);
    font-size: 13px;
    color: var(--text3);
}

.ai-thinking-indicator .dot {
    width: 8px;
    height: 8px;
    background: var(--accent);
    border-radius: 50%;
    animation: thinkingDot 1.5s infinite ease-in-out both;
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    box-shadow: 0 0 12px var(--accent);
}

.ai-thinking-indicator .dot:nth-child(1) { animation-delay: -0.32s; }
.ai-thinking-indicator .dot:nth-child(2) { animation-delay: -0.16s; }
.ai-thinking-indicator .dot:nth-child(3) { animation-delay: 0s; }

@keyframes thinkingDot {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
    40%           { transform: scale(1);   opacity: 1; }
}

/* ============================================================ */
/* TAKIM MESAJ AKSİYON VARYANTLARI                              */
/* ============================================================ */
.team-msg-actions-container {
    display: flex;
    gap: 4px;
    margin-top: 5px;
    opacity: 0.35;
    transition: opacity 0.22s ease;
    flex-wrap: wrap;
}

.team-chat-messages .ai-message:hover .team-msg-actions-container,
#teamPageMessages .ai-message:hover .team-msg-actions-container {
    opacity: 1;
}

.deleted-message .deleted-icon {
    font-size: 14px;
    margin-right: 4px;
    opacity: 0.7;
}

.message-not-found {
    color: var(--danger);
    font-size: 12px;
    font-style: italic;
    padding: 8px 12px;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1), rgba(230, 57, 70, 0.05));
    border-radius: 10px;
    border-left: 2px solid var(--danger);
}

.edited-label {
    display: inline-block;
    font-size: 9.5px;
    color: var(--text3);
    margin-left: 6px;
    font-style: italic;
    opacity: 0.78;
}

/* ============================================================ */
/* API MODU TOGGLE EK STİLLERİ                                 */
/* ============================================================ */
.api-mode-toggle-large {
    display: inline-flex;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0.45));
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-pill);
    padding: 6px;
    gap: 3px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.55);
}

.api-mode-toggle-large button {
    background: transparent;
    border: none;
    color: var(--text3);
    padding: 12px 26px;
    border-radius: var(--radius-pill);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.28s, color 0.28s, box-shadow 0.28s;
    font-family: var(--font-body);
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.35px;
}

.api-mode-toggle-large button:hover {
    color: var(--text);
    background: rgba(255, 255, 255, 0.07);
}

.api-mode-toggle-large button.active {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    color: #0a0a0e;
    box-shadow:
        0 0 30px rgba(212, 175, 55, 0.55),
        0 0 60px rgba(124, 92, 255, 0.3),
        inset 0 0 12px rgba(255, 255, 255, 0.12);
    animation: btnGradientShift 5s ease infinite;
    font-weight: 700;
}

.api-mode-toggle-large button.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.api-mode-toggle-large button.warning-state {
    background: linear-gradient(135deg, var(--warning), var(--accent3));
    color: #0a0a0e;
    box-shadow: 0 0 30px rgba(245, 158, 11, 0.55);
}

.api-mode-indicator {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 15px var(--accent2);
    animation: apiIndicatorPulse 2.2s infinite;
    margin-left: 4px;
    vertical-align: middle;
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

@keyframes apiIndicatorPulse {
    0%, 100% { opacity: 1;   transform: scale(1); }
    50%      { opacity: 0.6; transform: scale(1.25); }
}

/* ============================================================ */
/* PREFERS REDUCED MOTION                                       */
/* ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .comments-track,
    .tech-scroll {
        animation: none !important;
        transform: none !important;
    }
    .splash-screen::before,
    .splash-particle,
    .splash-logo,
    .splash-title {
        animation: none !important;
    }
    body.dashboard-open .comments-track,
    body.dashboard-open .tech-scroll {
        animation: none !important;
    }
    body::before,
    body::after {
        animation: none !important;
    }
    .auroraShift,
    .gridPulse,
    .splashBgBreath,
    .logoConicSpin,
    .aaTriggerOrbit,
    .novaRotate {
        animation: none !important;
    }
}

/* ============================================================ */
/* [AETHRION] AI KİŞİSEL ASİSTAN KARTI                         */
/* ============================================================ */
.assistant-card {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.1), rgba(124, 92, 255, 0.08));
    border: 1.5px solid rgba(212, 175, 55, 0.35);
    border-radius: var(--radius-xl);
    padding: 26px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    box-shadow:
        0 0 40px rgba(212, 175, 55, 0.15),
        inset 0 0 30px rgba(212, 175, 55, 0.04);
    transition: all 0.28s ease;
    position: relative;
    overflow: hidden;
}

.assistant-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent), var(--platinum), var(--purple), var(--ice));
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    box-shadow: 0 0 20px var(--accent);
}

.assistant-card:hover {
    border-color: var(--accent);
    transform: translateY(-3px);
    box-shadow:
        0 15px 50px rgba(0, 0, 0, 0.5),
        0 0 50px rgba(212, 175, 55, 0.25);
}

.assistant-card-header {
    display: flex;
    align-items: center;
    gap: 15px;
}

.assistant-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: #0a0a0e;
    box-shadow:
        0 0 30px rgba(212, 175, 55, 0.6),
        0 0 60px rgba(124, 92, 255, 0.35);
    animation: gradientMove 5s ease infinite;
    flex-shrink: 0;
    position: relative;
}

.assistant-avatar::after {
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 2px solid rgba(212, 175, 55, 0.5);
    animation: assistantPulse 2.2s ease-in-out infinite;
}

@keyframes assistantPulse {
    0%, 100% { transform: scale(1);    opacity: 0.6; }
    50%      { transform: scale(1.15); opacity: 1; }
}

.assistant-info h4 {
    color: var(--accent);
    font-family: var(--font-display);
    font-size: 18px;
    margin-bottom: 4px;
    letter-spacing: -0.2px;
    text-shadow: 0 0 15px rgba(212, 175, 55, 0.5);
}

.assistant-info p {
    color: var(--text3);
    font-size: 12.5px;
    line-height: 1.55;
}

.assistant-summary-box {
    background: rgba(0, 0, 0, 0.32);
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg);
    padding: 16px 18px;
    font-size: 13.5px;
    line-height: 1.75;
    color: var(--text2);
    min-height: 80px;
    position: relative;
}

.assistant-summary-box.loading::before {
    content: '⏳ Yükleniyor...';
    color: var(--text3);
    font-style: italic;
}

.assistant-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.assistant-actions .btn {
    font-size: 12.5px;
    padding: 10px 20px;
}

/* ============================================================ */
/* [AETHRION] MODEL SHOWCASE EXTRA (dashboard içinde)          */
/* ============================================================ */
.model-showcase-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    margin-bottom: 22px;
}

.model-summary-box {
    padding: 16px 14px;
    border-radius: var(--radius-lg);
    text-align: center;
    border: 1.5px solid;
    transition: all 0.28s ease;
}

.model-summary-box:hover {
    transform: translateY(-4px);
}

.model-summary-box.ollama {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.12), rgba(212, 175, 55, 0.04));
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.15);
}

.model-summary-box.ollama:hover {
    box-shadow: 0 0 35px rgba(212, 175, 55, 0.4);
}

.model-summary-box.nvidia {
    background: linear-gradient(135deg, rgba(118, 185, 0, 0.12), rgba(118, 185, 0, 0.04));
    border-color: var(--nvidia);
    box-shadow: 0 0 25px rgba(118, 185, 0, 0.15);
}

.model-summary-box.nvidia:hover {
    box-shadow: 0 0 35px rgba(118, 185, 0, 0.4);
}

.model-summary-box.cloud {
    background: linear-gradient(135deg, rgba(124, 92, 255, 0.12), rgba(124, 92, 255, 0.04));
    border-color: var(--purple);
    box-shadow: 0 0 25px rgba(124, 92, 255, 0.15);
}

.model-summary-box.cloud:hover {
    box-shadow: 0 0 35px rgba(124, 92, 255, 0.4);
}

.model-summary-box .summary-count {
    font-family: var(--font-display);
    font-size: 32px;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 6px;
    letter-spacing: -1px;
}

.model-summary-box.ollama .summary-count { color: var(--accent); text-shadow: 0 0 20px rgba(212, 175, 55, 0.5); }
.model-summary-box.nvidia .summary-count { color: var(--nvidia); text-shadow: 0 0 20px rgba(118, 185, 0, 0.5); }
.model-summary-box.cloud .summary-count { color: var(--purple); text-shadow: 0 0 20px rgba(124, 92, 255, 0.5); }

.model-summary-box .summary-label {
    font-size: 11px;
    color: var(--text3);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    font-weight: 700;
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TABLET (max-width: 768px)           */
/* ============================================================ */
@media (max-width: 768px) {
    #mainSite { padding-top: 52px; }
    nav { top: 52px !important; }

    .legal-banner {
        font-size: 10px !important;
        padding: 6px 38px 6px 12px !important;
        line-height: 1.3 !important;
        min-height: 38px;
        max-height: 52px;
    }
    .legal-banner-line { font-size: 10px !important; }
    .legal-banner-line.community-line {
        font-size: 9px !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    .legal-banner-close {
        width: 22px;
        height: 22px;
        font-size: 12px;
        right: 8px;
    }

    .dashboard-grid,
    .dashboard-grid-2col {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
        gap: 14px !important;
    }
    .dashboard-card { padding: 18px !important; }
    .dashboard-card h3 { font-size: 16px !important; }

    .aethrion-ai-panel.fullscreen {
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;
        border-radius: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
    }
    .aethrion-ai-panel.halfscreen {
        bottom: 5% !important;
        right: 5% !important;
        width: 95% !important;
        max-width: 95% !important;
        height: 70% !important;
        max-height: 70% !important;
        border-radius: 18px !important;
    }
    .aethrion-ai-header .logo-text { font-size: 14px !important; }
    .aethrion-ai-input {
        font-size: 12px !important;
        padding: 8px 10px !important;
    }
    .aethrion-ai-input-area {
        flex-direction: column !important;
        gap: 6px !important;
        padding: 8px !important;
    }
    .aethrion-ai-chat .ai-msg {
        font-size: 12px !important;
        padding: 8px 12px !important;
    }

    .modal {
        width: 95% !important;
        padding: 18px !important;
        max-height: none !important;
        overflow-y: auto !important;
    }
    .modal-header h3 { font-size: 18px !important; }
    .form-input {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
    }

    nav {
        padding: 0 14px !important;
        height: 60px !important;
        flex-wrap: wrap !important;
    }
    .nav-links { gap: 8px !important; }
    .nav-links a { font-size: 9.5px !important; }
    .logo-text { font-size: 17px !important; }
    .button-group .btn {
        font-size: 10.5px !important;
        padding: 5px 11px !important;
    }

    .hero-title .line1 { font-size: 27px !important; }
    .hero-title .line2 { font-size: 23px !important; }
    .hero-title .line3 { font-size: 13.5px !important; }
    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        font-size: 14.5px !important;
        padding: 10px 19px !important;
    }

    .stats-bar {
        flex-wrap: wrap !important;
        border-radius: 20px !important;
    }
    .stat-item {
        flex: 1 1 50% !important;
        padding: 14px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border) !important;
    }
    .stat-item:last-child { border-bottom: none !important; }
    .stat-num { font-size: 22px !important; }
    .stat-label { font-size: 9.5px !important; }

    .ai-widget { bottom: 24px !important; right: 24px !important; }
    .ai-widget-btn {
        width: 58px !important;
        height: 58px !important;
        font-size: 25px !important;
    }
    .ai-panel {
        width: calc(100vw - 28px) !important;
        right: 14px !important;
        bottom: 82px !important;
        max-width: 440px !important;
    }
    .ai-messages { height: 250px !important; }

    #commentsSection { padding: 10px !important; }
    .comment-item { padding: 10px 12px !important; }
    .comment-item .role-badge {
        font-size: 8.5px !important;
        padding: 2px 8px !important;
    }

    .btn-google,
    .btn-facebook {
        font-size: 12.5px !important;
        padding: 12px !important;
    }

    .query-limit-badge {
        font-size: 9.5px !important;
        padding: 5px 11px !important;
    }

    .dashboard-header .user-info span { font-size: 12.5px !important; }
    .dashboard-header .btn-sm {
        font-size: 10.5px !important;
        padding: 5px 11px !important;
    }

    .comments-track { animation-duration: 55s !important; }
    .comment-item { width: 290px !important; }

    .store-grid {
        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
        gap: 14px !important;
    }

    .dm-container {
        flex-direction: column !important;
        height: 650px !important;
    }
    .dm-conversations {
        width: 100% !important;
        height: 200px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border2) !important;
    }

    .splash-logo {
        width: 96px !important;
        height: 96px !important;
        font-size: 38px !important;
    }
    .splash-title { font-size: 27px !important; }
    .splash-sub { font-size: 14px !important; letter-spacing: 4px !important; }
    .splash-progress { width: 240px !important; }

    .level-up-modal {
        padding: 34px 36px !important;
        max-width: 92vw !important;
    }
    .level-up-modal .level-title { font-size: 36px !important; }
    .level-up-modal .level-badge { font-size: 66px !important; }

    .poll-container { padding: 18px !important; }
    .poll-question { font-size: 18px !important; }
    .poll-option {
        padding: 10px 14px !important;
        font-size: 13px !important;
    }

    .task-card {
        padding: 14px 16px !important;
        font-size: 13px !important;
    }

    .api-mode-toggle-large { padding: 4px; }
    .api-mode-toggle-large button {
        font-size: 11.5px;
        padding: 10px 18px;
    }

    .api-key-card { padding: 14px 16px !important; }
    .api-key-card .api-key-name { font-size: 13.5px !important; }
    .api-key-card .api-key-value { font-size: 11.5px !important; }
    .api-password-screen { padding: 24px 16px !important; }
    .api-password-screen .lock-icon { font-size: 60px !important; }
    .api-password-screen h3 { font-size: 20px !important; }
    .ai-msg-actions button { font-size: 9.5px !important; padding: 4px 9px !important; }

    .assistant-card { padding: 20px !important; }
    .assistant-avatar { width: 52px !important; height: 52px !important; font-size: 24px !important; }
    .assistant-info h4 { font-size: 16px !important; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — TELEFON (max-width: 480px)          */
/* ============================================================ */
@media (max-width: 480px) {
    #mainSite { padding-top: 56px; }
    nav { top: 56px !important; }

    .legal-banner {
        font-size: 9px !important;
        padding: 5px 34px 5px 9px !important;
        line-height: 1.25 !important;
        min-height: 36px;
        max-height: 48px;
    }
    .legal-banner-line {
        font-size: 9px !important;
        white-space: nowrap;
    }
    .legal-banner-line.community-line {
        font-size: 8.5px !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    .legal-banner-close {
        width: 20px;
        height: 20px;
        font-size: 11px;
        right: 6px;
    }

    .btn-primary,
    .btn-secondary,
    .btn-danger,
    .btn-success {
        font-size: 12.5px !important;
        padding: 10px 18px !important;
        border-radius: 32px !important;
    }
    .btn-sm {
        font-size: 10.5px !important;
        padding: 6px 12px !important;
    }
    .hero-actions .btn-primary,
    .hero-actions .btn-secondary {
        font-size: 13.5px !important;
        padding: 12px 20px !important;
    }

    .hero-title .line1 { font-size: 27px !important; }
    .hero-title .line2 {
        font-size: 23px !important;
        -webkit-text-stroke: 1.5px #d4af37 !important;
    }
    .hero-title .line3 { font-size: 11.5px !important; }

    .ai-widget {
        bottom: 14px !important;
        right: auto !important;
        left: 14px !important;
    }
    .ai-widget-btn {
        width: 48px !important;
        height: 48px !important;
        font-size: 21px !important;
    }
    .ai-panel {
        width: calc(100vw - 20px) !important;
        right: auto !important;
        left: 10px !important;
        bottom: 68px !important;
        border-radius: 16px !important;
    }
    .ai-messages {
        height: 190px !important;
        padding: 10px !important;
    }
    .ai-msg {
        font-size: 11.5px !important;
        padding: 8px 12px !important;
    }
    .ai-suggestions {
        padding: 8px !important;
        gap: 5px !important;
    }
    .ai-suggestion {
        font-size: 9.5px !important;
        padding: 5px 10px !important;
    }
    .ai-input {
        font-size: 11.5px !important;
        padding: 8px 12px !important;
    }
    .ai-send {
        font-size: 11.5px !important;
        padding: 8px 14px !important;
    }

    .comments-track {
        animation-duration: 75s !important;
        gap: 10px !important;
    }
    .comment-item {
        width: 270px !important;
        margin: 0 6px !important;
        padding: 10px 12px !important;
        font-size: 11.5px !important;
    }
    .comment-item .comment-text {
        font-size: 11.5px !important;
        line-height: 1.6 !important;
    }
    .comment-item .comment-email { font-size: 9.5px !important; }
    .comment-item .comment-time { font-size: 9.5px !important; }

    .store-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }
    .store-item {
        padding: 14px 12px !important;
        border-radius: 15px !important;
    }
    .store-item .item-icon { font-size: 36px !important; margin-bottom: 8px !important; }
    .store-item .item-name { font-size: 12.5px !important; word-break: break-word !important; }
    .store-item .item-price { font-size: 12.5px !important; margin: 5px 0 10px !important; }
    .store-item .btn-sm { font-size: 10.5px !important; padding: 5px 11px !important; }

    .dm-container {
        height: 560px !important;
        gap: 0 !important;
        border-radius: 16px !important;
    }
    .dm-conversations { height: 170px !important; }
    .dm-conversation-item { padding: 12px 14px !important; }
    .dm-conversation-item .dm-avatar {
        width: 36px !important;
        height: 36px !important;
        font-size: 15px !important;
    }
    .dm-conversation-item .dm-name { font-size: 13px !important; }
    .dm-conversation-item .dm-last-msg { font-size: 11.5px !important; }
    .dm-chat-header {
        padding: 12px 16px !important;
        font-size: 13px !important;
    }
    .dm-messages {
        padding: 14px !important;
        gap: 10px !important;
    }
    .dm-msg {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
        max-width: 85% !important;
    }
    .dm-input-area {
        padding: 10px 12px !important;
        gap: 6px !important;
    }
    .dm-input-area input {
        font-size: 12.5px !important;
        padding: 10px 14px !important;
        border-radius: 22px !important;
    }
    .dm-input-area .dm-file-btn { font-size: 18px !important; }

    .splash-logo {
        width: 76px !important;
        height: 76px !important;
        font-size: 30px !important;
    }
    .splash-title {
        font-size: 21px !important;
        margin-top: 22px !important;
        letter-spacing: 1px !important;
    }
    .splash-sub {
        font-size: 11.5px !important;
        letter-spacing: 3px !important;
        margin-top: 10px !important;
    }
    .splash-progress {
        width: 170px !important;
        height: 4px !important;
        margin-top: 22px !important;
    }
    .splash-percent { font-size: 11.5px !important; }
    .splash-version {
        bottom: 16px !important;
        right: 16px !important;
        font-size: 9.5px !important;
    }

    .level-up-modal {
        padding: 28px 24px !important;
        width: 90% !important;
        max-width: 350px !important;
        border-radius: 24px !important;
    }
    .level-up-modal .level-title { font-size: 28px !important; }
    .level-up-modal .level-sub { font-size: 14.5px !important; }
    .level-up-modal .level-badge {
        font-size: 54px !important;
        margin: 8px 0 !important;
    }

    .points-badge {
        font-size: 11.5px !important;
        padding: 5px 12px !important;
        gap: 5px !important;
    }
    .points-badge i { font-size: 14px !important; }
    .points-badge .points-amount { font-size: 13.5px !important; }

    .poll-container {
        padding: 14px !important;
        border-radius: 16px !important;
    }
    .poll-question {
        font-size: 15.5px !important;
        margin-bottom: 12px !important;
    }
    .poll-option {
        padding: 10px 12px !important;
        font-size: 11.5px !important;
        gap: 9px !important;
    }
    .poll-option .poll-percent { font-size: 12.5px !important; min-width: 36px !important; }
    .poll-option .poll-votes { font-size: 10.5px !important; }

    .task-card {
        padding: 12px 14px !important;
        font-size: 11.5px !important;
        gap: 9px !important;
    }
    .task-card .task-info { gap: 9px !important; }
    .task-card .task-points { font-size: 11.5px !important; padding: 3px 10px !important; }
    .task-card .task-status { font-size: 10.5px !important; }

    .parent-panel {
        padding: 18px !important;
        border-radius: 16px !important;
    }
    .parent-panel .panel-title { font-size: 20px !important; }
    .parent-setting {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        padding: 12px 0 !important;
    }
    .parent-setting .setting-control {
        width: 100% !important;
        justify-content: space-between !important;
        gap: 9px !important;
    }
    .parent-setting .setting-control input {
        flex: 1 !important;
        min-width: 0 !important;
        font-size: 12.5px !important;
        padding: 10px 12px !important;
    }
    .parent-setting .setting-control button {
        font-size: 11.5px !important;
        padding: 8px 14px !important;
        white-space: nowrap !important;
    }
    .toggle-switch {
        width: 46px !important;
        height: 28px !important;
    }
    .toggle-switch::after {
        width: 22px !important;
        height: 22px !important;
    }
    .toggle-switch.active::after { left: 24px !important; }

    .toggle-switch-sm {
        width: 36px !important;
        height: 22px !important;
    }
    .toggle-switch-sm::after {
        width: 18px !important;
        height: 18px !important;
    }
    .toggle-switch-sm.active::after { left: 17px !important; }

    .btn-google,
    .btn-facebook {
        font-size: 12px !important;
        padding: 10px !important;
        border-radius: 15px !important;
        margin-bottom: 10px !important;
    }
    .btn-google i,
    .btn-facebook i { font-size: 15px !important; }

    .query-limit-badge {
        font-size: 9.5px !important;
        padding: 4px 10px !important;
        bottom: 62px !important;
        left: 11px !important;
    }

    #commentsSection {
        padding: 8px !important;
        margin: 24px auto !important;
    }
    #commentsSection h3 {
        font-size: 20px !important;
        margin-bottom: 14px !important;
    }
    #commentForm textarea {
        font-size: 12.5px !important;
        padding: 10px 12px !important;
        border-radius: 13px !important;
    }
    #commentLoginMessage {
        padding: 12px !important;
        font-size: 11.5px !important;
    }

    .dashboard-grid,
    .dashboard-grid-2col {
        padding: 5px !important;
        gap: 10px !important;
    }
    .dashboard-card {
        padding: 14px !important;
        border-radius: 16px !important;
    }
    .dashboard-card h3 { font-size: 13.5px !important; }
    .dashboard-header .user-info span { font-size: 11.5px !important; }
    .dashboard-header .btn-sm {
        font-size: 9.5px !important;
        padding: 4px 9px !important;
    }

    .api-key-card { padding: 12px 14px !important; margin-bottom: 10px !important; }
    .api-key-card .api-key-name { font-size: 12.5px !important; margin-bottom: 8px !important; }
    .api-key-card .api-key-value { font-size: 10.5px !important; padding: 7px 10px !important; }
    .api-key-card .api-key-actions button {
        font-size: 10.5px !important;
        padding: 5px 11px !important;
    }
    .api-password-screen { padding: 20px 12px !important; gap: 14px !important; }
    .api-password-screen .lock-icon { font-size: 52px !important; }
    .api-password-screen h3 { font-size: 18px !important; }
    .api-password-screen p { font-size: 11.5px !important; }
    .api-password-screen input { font-size: 14px !important; padding: 12px !important; }

    .ai-msg-actions { gap: 5px !important; margin-top: 8px !important; }
    .ai-msg-actions button { font-size: 9.5px !important; padding: 4px 8px !important; }

    .team-msg-actions { gap: 3px !important; }
    .team-msg-actions button { font-size: 10.5px !important; padding: 3px 6px !important; }

    .api-mode-toggle-large {
        width: 100%;
        justify-content: center;
        padding: 4px;
    }
    .api-mode-toggle-large button {
        font-size: 10.5px;
        padding: 10px 14px;
        flex: 1;
        text-align: center;
        justify-content: center;
    }

    .btn-copy, .btn-reveal, .btn-stop, .btn-edit {
        font-size: 9.5px !important;
        padding: 4px 10px !important;
    }
    .btn-action-icon {
        width: 30px !important;
        height: 30px !important;
        font-size: 13px !important;
    }

    .a27-api-section {
        padding: 18px !important;
        margin-top: 18px !important;
    }
    .a27-api-section h3 { font-size: 18px !important; }
    .a27-api-btn-create {
        font-size: 13.5px !important;
        padding: 14px 24px !important;
        width: 100%;
    }
    .a27-api-key-card {
        padding: 12px 14px !important;
        font-size: 12.5px !important;
    }
    .a27-api-key-card .a27-name { font-size: 13.5px !important; }
    .a27-api-key-card .a27-masked { font-size: 11.5px !important; padding: 4px 10px !important; }
    .a27-api-key-card .a27-duration { font-size: 10.5px !important; }
    .a27-api-key-card .a27-status { font-size: 10.5px !important; padding: 3px 10px !important; }

    .assistant-card { padding: 16px !important; gap: 14px !important; }
    .assistant-avatar {
        width: 46px !important;
        height: 46px !important;
        font-size: 21px !important;
    }
    .assistant-info h4 { font-size: 14.5px !important; }
    .assistant-info p { font-size: 11.5px !important; }
    .assistant-summary-box {
        padding: 12px 14px !important;
        font-size: 12px !important;
    }
    .assistant-actions .btn {
        font-size: 11.5px;
        padding: 9px 15px;
    }

    .model-showcase-summary {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    .model-summary-box { padding: 12px 10px !important; }
    .model-summary-box .summary-count { font-size: 24px !important; }
    .model-summary-box .summary-label { font-size: 9px !important; letter-spacing: 0.8px !important; }
}

/* ============================================================ */
/* [AETHRION] RESPONSIVE — ÇOK KÜÇÜK (max-width: 360px)        */
/* ============================================================ */
@media (max-width: 360px) {
    #mainSite { padding-top: 60px; }
    nav { top: 60px !important; }

    .legal-banner {
        font-size: 8px !important;
        padding: 4px 30px 4px 7px !important;
        line-height: 1.2 !important;
        min-height: 34px;
        max-height: 44px;
    }
    .legal-banner-line { font-size: 8px !important; }
    .legal-banner-line.community-line {
        font-size: 7.5px !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    .legal-banner-close {
        width: 18px;
        height: 18px;
        font-size: 10px;
        right: 4px;
    }

    .btn-primary,
    .btn-secondary,
    .btn-danger,
    .btn-success {
        font-size: 11.5px !important;
        padding: 8px 14px !important;
    }
    .btn-sm {
        font-size: 9.5px !important;
        padding: 5px 10px !important;
    }
    .hero-title .line1 { font-size: 25px !important; }
    .hero-title .line2 { font-size: 21px !important; }
    .points-badge {
        font-size: 10.5px !important;
        padding: 4px 10px !important;
    }
    .points-badge .points-amount { font-size: 12.5px !important; }
    .store-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 9px !important;
    }
    .store-item .item-icon { font-size: 30px !important; }
    .store-item .item-name { font-size: 11.5px !important; }
    .dm-container { height: 520px !important; }
    .splash-title { font-size: 17px !important; }
    .splash-logo {
        width: 64px !important;
        height: 64px !important;
        font-size: 26px !important;
    }

    .api-key-card .api-key-name { font-size: 11.5px !important; }
    .api-key-card .api-key-value { font-size: 9.5px !important; }
    .api-key-card .api-key-actions button {
        font-size: 9.5px !important;
        padding: 4px 9px !important;
    }
    .api-password-screen .lock-icon { font-size: 46px !important; }

    .api-mode-toggle-large button { font-size: 9.5px; padding: 9px 10px; }
    .toggle-switch-sm {
        width: 32px !important;
        height: 20px !important;
    }
    .toggle-switch-sm::after {
        width: 16px !important;
        height: 16px !important;
    }
    .toggle-switch-sm.active::after { left: 14px !important; }

    .a27-api-section { padding: 14px !important; }
    .a27-api-section h3 { font-size: 16px !important; }
    .a27-api-btn-create {
        font-size: 12.5px !important;
        padding: 12px 18px !important;
    }
    .a27-api-key-card { padding: 10px 12px !important; }
    .a27-api-key-card .a27-name { font-size: 12.5px !important; }
    .a27-api-key-card .a27-masked { font-size: 10.5px !important; }

    .assistant-card { padding: 13px !important; }
    .assistant-avatar { width: 42px !important; height: 42px !important; font-size: 19px !important; }
    .assistant-info h4 { font-size: 13.5px !important; }
    .assistant-summary-box { font-size: 11px !important; }
}

/* ============================================================ */
/* [AETHRION] A27 API MODAL (Generator + Created)              */
/* ============================================================ */
#a27ApiKeyGeneratorModal .modal {
    max-width: 620px;
}

.a27-form-label {
    display: block;
    font-size: 12.5px;
    color: var(--text3);
    margin-bottom: 8px;
    font-weight: 600;
    letter-spacing: 0.25px;
}

.a27-form-input {
    width: 100%;
    padding: 14px 20px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border: 1.5px solid var(--border2);
    color: var(--text);
    border-radius: var(--radius-lg);
    margin-bottom: 20px;
    font-size: 14px;
    transition: border-color 0.22s, box-shadow 0.22s;
}

.a27-form-input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.4);
}

.a27-duration-row {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.a27-duration-btn {
    flex: 1;
    min-width: 100px;
    padding: 12px 10px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08), rgba(124, 92, 255, 0.05));
    border: 1.5px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    cursor: pointer;
    font-size: 12.5px;
    font-weight: 600;
    transition: background-color 0.22s, border-color 0.22s, color 0.22s, box-shadow 0.22s;
    font-family: var(--font-body);
    letter-spacing: 0.25px;
}

.a27-duration-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.4);
}

.a27-duration-btn.active {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    color: #0a0a0e;
    border-color: transparent;
    box-shadow:
        0 0 30px rgba(212, 175, 55, 0.7),
        0 0 60px rgba(124, 92, 255, 0.4),
        inset 0 0 12px rgba(255, 255, 255, 0.12);
    animation: btnGradientShift 5s ease infinite;
    font-weight: 700;
}

#a27ApiKeyCreatedModal .modal {
    max-width: 560px;
}

.a27-key-display {
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 2px solid var(--accent2);
    border-radius: var(--radius-lg);
    padding: 20px;
    font-family: var(--font-code);
    font-size: 15.5px;
    color: var(--accent2);
    word-break: break-all;
    text-align: center;
    margin: 20px 0;
    letter-spacing: 1.5px;
    box-shadow:
        0 0 45px rgba(184, 192, 208, 0.4),
        inset 0 0 25px rgba(184, 192, 208, 0.06);
    user-select: all;
    font-weight: 600;
    position: relative;
}

.a27-copy-btn {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(184, 192, 208, 0.18));
    border: 1.5px solid var(--accent);
    color: var(--accent);
    padding: 12px 28px;
    border-radius: var(--radius-pill);
    cursor: pointer;
    font-weight: 700;
    font-size: 14px;
    font-family: var(--font-body);
    transition: background-color 0.22s, color 0.22s, box-shadow 0.22s, transform 0.22s;
    letter-spacing: 0.55px;
}

.a27-copy-btn:hover {
    background: var(--accent);
    color: #0a0a0e;
    box-shadow: 0 0 40px rgba(212, 175, 55, 0.85);
    transform: translateY(-3px);
}

.a27-warning-box {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(230, 57, 70, 0.1));
    border: 1.5px solid var(--danger);
    color: #ffb0b0;
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    font-size: 13px;
    line-height: 1.75;
    text-align: center;
    box-shadow: 0 0 30px rgba(239, 68, 68, 0.25);
}

@media (max-width: 768px) {
    #a27ApiKeyGeneratorModal .modal,
    #a27ApiKeyCreatedModal .modal {
        max-width: 100% !important;
        width: 100% !important;
    }
    .a27-form-input {
        font-size: 13.5px !important;
        padding: 12px 16px !important;
    }
    .a27-duration-btn {
        font-size: 11.5px;
        padding: 10px 8px;
        min-width: 90px;
    }
    .a27-key-display {
        font-size: 13.5px;
        padding: 14px;
    }
}

@media (max-width: 480px) {
    .a27-form-label { font-size: 11.5px; }
    .a27-form-input {
        font-size: 12.5px !important;
        padding: 11px 14px !important;
        margin-bottom: 14px !important;
    }
    .a27-duration-row { gap: 5px; }
    .a27-duration-btn {
        font-size: 10.5px;
        padding: 9px 6px;
        min-width: 74px;
    }
    .a27-key-display {
        font-size: 11.5px;
        padding: 12px 10px;
        letter-spacing: 0.5px;
    }
    .a27-copy-btn {
        font-size: 12.5px;
        padding: 10px 20px;
    }
    .a27-warning-box {
        font-size: 11.5px;
        padding: 12px 14px;
    }
}

@media (max-width: 360px) {
    .a27-duration-btn {
        font-size: 9.5px;
        padding: 8px 5px;
        min-width: 62px;
    }
    .a27-key-display {
        font-size: 10.5px;
        padding: 10px 8px;
    }
}

/* ============================================================ */
/* [AETHRION] STATİK YORUM LİSTESİ (DASHBOARD)                 */
/* ============================================================ */
.comments-list-static {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    animation: none !important;
    transform: none !important;
    width: 100% !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
}

.comments-list-static .comment-item {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    cursor: default !important;
}

/* Yorum Aksiyon Butonları */
.comment-actions {
    display: flex;
    gap: 6px;
    margin-top: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.comment-edit-btn,
.comment-delete-btn {
    padding: 6px 16px;
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
    border: 1.5px solid;
    font-family: var(--font-body);
    transition: all 0.22s ease;
    letter-spacing: 0.25px;
}

.comment-edit-btn {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(255, 140, 0, 0.06));
    border-color: rgba(245, 158, 11, 0.45);
    color: var(--warning);
}

.comment-edit-btn:hover {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.32), rgba(255, 140, 0, 0.22));
    border-color: var(--warning);
    color: #fff;
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.6);
    transform: translateY(-1px);
}

.comment-delete-btn {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(230, 57, 70, 0.06));
    border-color: rgba(239, 68, 68, 0.45);
    color: var(--danger);
}

.comment-delete-btn:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.32), rgba(230, 57, 70, 0.22));
    border-color: var(--danger);
    color: #fff;
    box-shadow: 0 0 20px rgba(239, 68, 68, 0.6);
    transform: translateY(-1px);
}

/* ============================================================ */
/* [AETHRION] MODERATÖR EK STİLLERİ                            */
/* ============================================================ */
.moderator-assign-btn {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.22), rgba(232, 197, 85, 0.12));
    border: 1.5px solid var(--moderator);
    color: var(--moderator);
    padding: 11px 22px;
    border-radius: var(--radius-pill);
    font-size: 12.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.28s ease;
    font-family: var(--font-body);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.35px;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.35);
}

.moderator-assign-btn:hover {
    background: rgba(212, 175, 55, 0.35);
    box-shadow:
        0 0 40px rgba(212, 175, 55, 0.8),
        0 0 80px rgba(212, 175, 55, 0.4);
    transform: translateY(-3px) scale(1.04);
}

.modal-moderator .modal-header h3 {
    color: var(--moderator);
    background: linear-gradient(135deg, #d4af37, #e8c555);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 25px rgba(212, 175, 55, 0.5);
}

.modal-moderator .a27-form-input:focus {
    border-color: var(--moderator);
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.5);
}

/* ============================================================ */
/* [AETHRION] AETHRION AL PANEL EK CSS                         */
/* ============================================================ */
.aa-mode-deep .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(0, 30, 60, 0.22), rgba(0, 15, 30, 0.18));
}

.aa-mode-agent .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(60, 20, 0, 0.2), rgba(30, 10, 0, 0.18));
}

.aa-mode-developer .aethrion-al-chat {
    background: linear-gradient(180deg, rgba(40, 30, 0, 0.2), rgba(20, 15, 0, 0.18));
}

.aa-mode-deep .aethrion-al-input-area textarea:focus {
    border-color: #7fd4ff;
    box-shadow: 0 0 25px rgba(127, 212, 255, 0.6);
}

.aa-mode-agent .aethrion-al-input-area textarea:focus {
    border-color: #ff7a45;
    box-shadow: 0 0 25px rgba(255, 122, 69, 0.6);
}

.aa-mode-developer .aethrion-al-input-area textarea:focus {
    border-color: #b8c0d0;
    box-shadow: 0 0 25px rgba(184, 192, 208, 0.6);
}

.aethrion-al-panel.open ~ .aethrion-al-trigger {
    opacity: 0.3;
}

@media (max-width: 1024px) and (min-width: 769px) {
    .aethrion-al-panel {
        width: 42%;
        min-width: 370px;
    }
}

/* ============================================================ */
/* [AETHRION] LOGS PANEL EK STİLLERİ                           */
/* ============================================================ */
.logs-panel-header .logs-filter-row {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    align-items: center;
}

.logs-filter-btn {
    padding: 7px 16px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.08), rgba(124, 92, 255, 0.05));
    border: 1px solid var(--border2);
    color: var(--text3);
    border-radius: var(--radius-pill);
    font-size: 11.5px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.22s ease;
    font-family: var(--font-body);
    letter-spacing: 0.35px;
}

.logs-filter-btn:hover {
    border-color: var(--accent);
    color: var(--accent);
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.4);
}

.logs-filter-btn.active {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    background-size: 250% 250%;
    color: #0a0a0e;
    border-color: transparent;
    box-shadow: 0 0 30px rgba(212, 175, 55, 0.6);
    animation: btnGradientShift 5s ease infinite;
    font-weight: 700;
}

/* ============================================================ */
/* [AETHRION] VIDEO STUDIO EK STİLLERİ                         */
/* ============================================================ */
.video-studio-video-preview {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #0a0a0a, #050505);
    border: 1.5px solid var(--border2);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text3);
    font-size: 14px;
    margin-bottom: 20px;
    overflow: hidden;
    box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.65);
    position: relative;
}

.video-studio-video-preview video {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.video-studio-video-preview .preview-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    color: var(--text3);
}

.video-studio-video-preview .preview-placeholder .placeholder-icon {
    font-size: 62px;
    opacity: 0.45;
    filter: drop-shadow(0 0 25px rgba(212, 175, 55, 0.5));
}

.video-studio-progress {
    height: 9px;
    background: rgba(0, 0, 0, 0.45);
    border-radius: 8px;
    overflow: hidden;
    margin-top: 16px;
    display: none;
}

.video-studio-progress.active { display: block; }

.video-studio-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 100%;
    animation: btnGradientShift 3s linear infinite;
    border-radius: 8px;
    transition: width 0.32s ease;
    box-shadow: 0 0 20px rgba(212, 175, 55, 0.6);
}

/* ============================================================ */
/* [AETHRION] A27 API REHBER EK STİLLERİ                       */
/* ============================================================ */
.a27-api-guide-body .guide-step-list {
    counter-reset: step-counter;
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.a27-api-guide-body .guide-step-list li {
    counter-increment: step-counter;
    position: relative;
    padding: 16px 16px 16px 65px;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05), rgba(124, 92, 255, 0.03));
    border-left: 3px solid var(--gold);
    border-radius: var(--radius-md);
    margin-bottom: 11px;
    line-height: 1.75;
}

.a27-api-guide-body .guide-step-list li::before {
    content: counter(step-counter);
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--gold), var(--accent3));
    color: #0a0a0e;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 14.5px;
    box-shadow: 0 0 25px rgba(212, 175, 55, 0.6);
}

.a27-api-guide-body .guide-highlight {
    background: linear-gradient(135deg, rgba(184, 192, 208, 0.1), rgba(212, 175, 55, 0.06));
    border-left: 3px solid var(--accent2);
    border-radius: 11px;
    padding: 16px 20px;
    margin: 16px 0;
    font-size: 13.5px;
    color: #d4d4e4;
}

.a27-api-guide-body .guide-highlight strong {
    color: var(--accent2);
}

/* ============================================================ */
/* [AETHRION] SESLİ SOHBET DASHBOARD EK STİLLERİ               */
/* ============================================================ */
.voice-chat-card {
    background: linear-gradient(135deg, rgba(127, 212, 255, 0.1), rgba(124, 92, 255, 0.08));
    border: 1.5px solid rgba(127, 212, 255, 0.35);
    border-radius: var(--radius-xl);
    padding: 24px;
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    box-shadow: 0 0 40px rgba(127, 212, 255, 0.18);
    transition: all 0.28s ease;
}

.voice-chat-card:hover {
    border-color: var(--ice);
    box-shadow: 0 0 55px rgba(127, 212, 255, 0.4);
    transform: translateY(-3px);
}

.voice-chat-card .voice-card-icon {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: linear-gradient(135deg, #7fd4ff, #b8c0d0, #7c5cff, #d4af37);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    color: #0a0a0e;
    box-shadow:
        0 0 35px rgba(127, 212, 255, 0.7),
        0 0 70px rgba(124, 92, 255, 0.5);
    animation: btnGradientShift 5s ease infinite;
    flex-shrink: 0;
}

.voice-chat-card .voice-card-info {
    flex: 1;
    min-width: 210px;
}

.voice-chat-card .voice-card-info h4 {
    color: var(--ice);
    font-family: var(--font-display);
    font-size: 18px;
    margin-bottom: 7px;
    letter-spacing: -0.2px;
    text-shadow: 0 0 20px rgba(127, 212, 255, 0.6);
}

.voice-chat-card .voice-card-info p {
    color: var(--text2);
    font-size: 12.5px;
    line-height: 1.65;
}

/* ============================================================ */
/* CSS-4 SONU                                                   */
/* ============================================================ */


/* Extracted inline styles; source attributes: id="dashboardVisibilityFix" */
/* Dashboard Container */
#dashboardArea {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background-color: #030306 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    z-index: 999999 !important;
    padding: 0 !important;
}

/* Dashboard Header */
#dashboardArea .dashboard-header {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: linear-gradient(90deg, rgba(18, 18, 26, 0.99), rgba(30, 30, 42, 0.99)) !important;
    border-bottom: 2.5px solid var(--accent) !important;
    padding: 16px 28px !important;
    min-height: 80px !important;
    width: 100% !important;
}

/* Content Wrapper (Sorun buradaydı) */
#dashboardArea .dashboard-content-wrapper {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    min-height: calc(100vh - 80px) !important;
    padding: 26px !important;
    width: 100% !important;
    max-width: 1720px !important;
    margin: 0 auto !important;
    overflow: visible !important;
}

/* Grid Yapıları */
#dashboardArea .dashboard-grid,
#dashboardArea .dashboard-grid-2col {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 30px !important;
    padding: 30px !important;
    max-width: 1720px !important;
    margin: 0 auto !important;
    width: 100% !important;
}

#dashboardArea .dashboard-card.full-width {
    grid-column: 1 / -1 !important;
}

/* Kartlar */
#dashboardArea .dashboard-card {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: linear-gradient(135deg, rgba(18, 18, 26, 0.96), rgba(8, 8, 12, 0.98)) !important;
    border: 1.5px solid var(--border2) !important;
    border-radius: var(--radius-xl) !important;
    padding: 30px !important;
    width: 100% !important;
    position: relative !important;
    box-shadow: 0 5px 30px rgba(0,0,0,0.4) !important;
}

/* Mobil için Grid Düzeltmesi */
@media (max-width: 768px) {
    #dashboardArea .dashboard-grid,
    #dashboardArea .dashboard-grid-2col {
        grid-template-columns: 1fr !important;
        padding: 14px !important;
        gap: 18px !important;
    }
    #dashboardArea .dashboard-card {
        padding: 20px !important;
    }
}

/* Splash Ekranını Kesin Gizle */
#splashScreen,
.splash-screen {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -9999 !important;
}

/* MainSite ve Legal Banner (Gizli olmalı) */
body.dashboard-open #mainSite,
body.dashboard-open .legal-banner,
body.dashboard-open nav {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* Body ve HTML Kaydırma */
body.dashboard-open,
html.dashboard-open {
    overflow: hidden !important;
    height: 100vh !important;
}


/* Extracted inline styles; source attributes: id="aethrion-visual-system-v3" */
:root{color-scheme:dark;--ae-bg:#070b16;--ae-panel:rgba(16,24,43,.78);--ae-line:rgba(133,169,224,.2);--ae-text:#f3f6ff;--ae-muted:#a9b6d0;--ae-cyan:#6be7ff;--ae-blue:#648cff;--ae-violet:#b59aff;--ae-radius:22px;--ae-shadow:0 22px 70px rgba(0,0,0,.28)}
html{scroll-behavior:smooth;scroll-padding-top:90px;background:var(--ae-bg)}body{background:radial-gradient(ellipse at 12% -10%,rgba(69,107,255,.2),transparent 38%),radial-gradient(ellipse at 90% 12%,rgba(33,220,238,.11),transparent 34%),linear-gradient(160deg,#070b16 0%,#0b1020 48%,#090d19 100%);color:var(--ae-text);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(rgba(150,180,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(150,180,255,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,black,transparent 90%)}
h1,h2,h3,h4{letter-spacing:-.035em;text-wrap:balance}p,li{line-height:1.72}a,button,[role=button]{transition:color .2s ease,opacity .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
:where(a,button,input,textarea,select,[tabindex]):focus-visible{outline:2px solid var(--ae-cyan)!important;outline-offset:3px}
:where(.card,.feature-card,.tool-card,.glass-card,.panel,.feature,.service-card,.ai-card,.pricing-card,.stat-card,.team-card,.api-card,.legal-card){border-color:var(--ae-line)!important;border-radius:var(--ae-radius);box-shadow:0 12px 38px rgba(0,0,0,.15);backdrop-filter:blur(16px);transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
:where(.card,.feature-card,.tool-card,.glass-card,.feature,.service-card,.ai-card,.pricing-card,.team-card,.api-card,.legal-card):hover{border-color:rgba(107,231,255,.38)!important;box-shadow:var(--ae-shadow);transform:translateY(-3px)}
:where(.gradient-text,.text-gradient,.brand-gradient){background:linear-gradient(105deg,var(--ae-cyan),#a9b8ff 55%,var(--ae-violet));-webkit-background-clip:text;background-clip:text;color:transparent}
header,nav,.navbar,.top-nav,.site-header{backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}::selection{background:rgba(107,231,255,.28);color:#fff}
@keyframes ae-rise-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:no-preference){main h1,main .hero h1,.hero-section h1{animation:ae-rise-in .65s ease-out both}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:640px){:root{--ae-radius:17px}body:before{background-size:30px 30px}h1{letter-spacing:-.025em}}


/* Extracted inline styles; source attributes: id="aethrion-corporate-ui-v1" */
:root {
  --aethrion-ink:#0b1220; --aethrion-panel:#111c2e; --aethrion-panel-2:#17243a;
  --aethrion-line:rgba(148,163,184,.19); --aethrion-gold:#d9b45b;
  --aethrion-muted:#a8b4c7; --aethrion-focus:rgba(217,180,91,.42);
}
html { scroll-behavior:smooth; }
body {
  background-color:var(--aethrion-ink);
  background-image:radial-gradient(ellipse at 12% 0%,rgba(37,76,125,.22),transparent 42%),
                   radial-gradient(ellipse at 88% 18%,rgba(148,113,43,.10),transparent 34%);
  color:#edf2f9;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button,a,input,textarea,select { -webkit-tap-highlight-color:transparent; }
button, [role="button"], .btn-primary, .nav-cta {
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:2px solid var(--aethrion-gold); outline-offset:3px;
}
.btn-primary,.nav-cta,.btn-price {
  border-radius:11px; font-weight:650; letter-spacing:.01em;
}
.btn-primary {
  box-shadow:0 7px 24px rgba(217,180,91,.12);
}
.btn-primary:hover,.nav-cta:hover,.btn-price:hover {
  transform:translateY(-1px); box-shadow:0 10px 28px rgba(217,180,91,.18);
}
/* Site-wide visual system: restrained enterprise styling instead of competing neon/glow effects. */
.hero { padding-left:clamp(20px,5vw,72px)!important; padding-right:clamp(20px,5vw,72px)!important; }
.hero-badge { border-color:rgba(217,180,91,.30)!important; background:rgba(17,28,46,.72)!important; color:#dce5f2!important; box-shadow:none!important; }
.hero-title,.hero h1,.hero-section h1 { color:#f4f7fb!important; text-shadow:none!important; letter-spacing:-.045em; }
.hero-sub,.hero-subtitle,.hero p { color:#aebbd0; }
.section-tag { letter-spacing:2.2px!important; text-shadow:none!important; color:#d9b45b!important; }
.section-title,.feature-title { color:#edf2f9!important; text-shadow:none!important; letter-spacing:-.025em; }
.features { padding-top:clamp(64px,8vw,104px)!important; padding-bottom:clamp(64px,8vw,104px)!important; }
.feature-card {
  background:linear-gradient(145deg,rgba(17,28,46,.96),rgba(11,18,32,.98))!important;
  border:1px solid rgba(148,163,184,.18)!important; border-radius:18px!important;
  box-shadow:0 12px 34px rgba(0,0,0,.18)!important; padding:clamp(24px,3vw,38px)!important;
  transition:transform .2s ease,border-color .2s ease,background-color .2s ease!important;
}
.feature-card::before,.feature-card::after { opacity:0!important; display:none!important; }
.feature-card:hover { transform:translateY(-3px)!important; border-color:rgba(217,180,91,.42)!important; box-shadow:0 18px 42px rgba(0,0,0,.25)!important; }
.pricing-grid {
  gap:16px!important; background:transparent!important; border:0!important;
  border-radius:0!important; box-shadow:none!important; overflow:visible!important;
}
.price-card {
  background:linear-gradient(155deg,rgba(20,32,51,.98),rgba(11,18,32,.99))!important;
  border:1px solid rgba(148,163,184,.2)!important; border-radius:18px!important;
  box-shadow:0 12px 34px rgba(0,0,0,.2)!important;
}
.price-card.featured { border-color:rgba(217,180,91,.55)!important; box-shadow:0 16px 42px rgba(0,0,0,.24)!important; }
nav,.navbar { background:rgba(9,16,29,.94)!important; border-bottom:1px solid rgba(148,163,184,.15)!important; box-shadow:0 8px 28px rgba(0,0,0,.14)!important; }
.dashboard-header { background:rgba(12,20,34,.96)!important; border-bottom:1px solid rgba(148,163,184,.2)!important; }
.modal-content { background:linear-gradient(160deg,#142033,#0c1422)!important; border:1px solid rgba(148,163,184,.24)!important; border-radius:18px!important; box-shadow:0 28px 90px rgba(0,0,0,.52)!important; }
@media (max-width:760px) {
  .hero { min-height:auto!important; padding-top:112px!important; padding-bottom:64px!important; }
  .features { padding-left:18px!important; padding-right:18px!important; }
  .pricing-grid { grid-template-columns:1fr!important; gap:14px!important; }
  .feature-card { padding:22px!important; }
  nav,.navbar { left:0!important; right:0!important; }
}
.form-input,input.form-input,textarea.form-input,select.form-input {
  border:1px solid var(--aethrion-line); border-radius:10px;
  background:rgba(9,16,29,.82); color:#edf2f9;
  min-height:44px; box-sizing:border-box;
}
.form-input:focus,input.form-input:focus,textarea.form-input:focus,select.form-input:focus {
  border-color:rgba(217,180,91,.72); box-shadow:0 0 0 3px var(--aethrion-focus); outline:none;
}
.card,.feature-card,.price-card,.stat-card,.dashboard-card,.settings-card,.modal-content {
  border-color:var(--aethrion-line);
}
.vizyon-al-panel.open {
  display:flex!important; position:fixed!important; top:0!important; right:0!important;
  visibility:visible!important; pointer-events:auto!important;
  z-index:2147483000!important;
}
.vizyon-al-panel:not(.open) {
  visibility:hidden!important; pointer-events:none!important;
}
@media (max-width:760px) {
  .vizyon-al-panel { width:100%!important; min-width:0!important; max-width:none!important; }
  .vizyon-al-header { padding:15px 16px!important; }
  .form-input,input.form-input,textarea.form-input,select.form-input { max-width:100%; }
  .modal-body { max-height:calc(100dvh - 150px); overflow-y:auto; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}


/* Extracted inline styles; source attributes: id="aethrion-overlap-repair-v2" */
/* One navigation system: remove competing feature-search controls. */
.aews-search,.aed-search,#aewsSearch,#aedSearch{display:none!important;visibility:hidden!important;pointer-events:none!important}
body.ae-shell-on #aeWorkspaceSidebar{gap:0!important}
body.ae-shell-on #aeWorkspaceSidebar #aewsNav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overscroll-behavior:contain!important;padding-bottom:18px!important}
body.ae-shell-on #aeWorkspaceSidebar .aews-footer{position:relative!important;flex:0 0 auto!important;margin-top:auto!important;padding-bottom:max(6px,env(safe-area-inset-bottom))!important}
body.ae-shell-on #dashboardArea,body.ae-shell-on #dashboardArea *{box-sizing:border-box}
body.ae-shell-on #dashboardArea .aew-name,body.ae-shell-on #dashboardArea .aew-copy,body.ae-shell-on #dashboardArea .ae-ws-stage-head h2,body.ae-shell-on #dashboardArea .ae-ws-stage-head p{max-width:100%!important;min-width:0!important;overflow-wrap:anywhere!important;word-break:normal!important}
body.ae-shell-on #aethrionWorkspaceStage{min-width:0!important}
body.ae-shell-on .ae-ws-stage-frame{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important}
#mainSite section,#mainSite footer{position:relative;clear:both}
#mainSite .features-grid,#mainSite .feature-grid,#mainSite .features-container,#mainSite .category-grid,#mainSite .models-grid,#mainSite .pricing-grid,#mainSite .ecosystem-grid,#mainSite .tech-grid{
 display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))!important;gap:20px!important;align-items:stretch!important
}
#mainSite .feature-card,#mainSite .category-card,#mainSite .model-card,#mainSite .tool-card,#mainSite .price-card,#mainSite .pricing-card,#mainSite .ecosystem-card{
 position:relative!important;inset:auto!important;min-width:0!important;max-width:100%!important;height:auto!important;overflow-wrap:anywhere!important
}
#mainSite .feature-title,#mainSite .category-title,#mainSite .model-mini-name,#mainSite .model-tile-name,#mainSite .feature-desc,#mainSite .category-desc,#mainSite .feature-card p{
 min-width:0!important;max-width:100%!important;overflow-wrap:anywhere!important;word-break:normal!important
}
#mainSite footer{margin-top:clamp(40px,7vw,88px)!important;padding-bottom:max(36px,env(safe-area-inset-bottom))!important;clear:both!important}
@media(max-width:600px){
 #mainSite .features-grid,#mainSite .feature-grid,#mainSite .features-container,#mainSite .category-grid,#mainSite .models-grid,#mainSite .pricing-grid,#mainSite .ecosystem-grid,#mainSite .tech-grid{grid-template-columns:minmax(0,1fr)!important;gap:14px!important}
 #mainSite .feature-card,#mainSite .category-card,#mainSite .model-card,#mainSite .tool-card,#mainSite .price-card,#mainSite .pricing-card,#mainSite .ecosystem-card{width:100%!important}
}


/* Extracted inline styles; source attributes: id="aethrion-homepage-repair-2026-10" */
/* Homepage CTA: keep the download action beside the primary AI action. */
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.hero-actions .download-hero-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:12px 20px; border:1px solid rgba(217,180,91,.58);
  border-radius:999px; color:#f4e4b5;
  background:linear-gradient(135deg,rgba(217,180,91,.13),rgba(139,107,255,.10));
  box-shadow:0 8px 24px rgba(0,0,0,.18); font-weight:700;
  white-space:nowrap; cursor:pointer; transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.hero-actions .download-hero-btn:hover { transform:translateY(-2px); border-color:rgba(217,180,91,.95); background:linear-gradient(135deg,rgba(217,180,91,.22),rgba(139,107,255,.16)); }
@media(max-width:640px) {
  .hero-actions { gap:9px; }
  .hero-actions .download-hero-btn { width:100%; }
}
/* Keep the dynamically-created feature drawer fully hidden until explicitly opened. */
#aethrionFeaturesPanel { visibility:hidden; pointer-events:none; right:-105%; z-index:2147483001; }
#aethrionFeaturesPanel.open { visibility:visible; pointer-events:auto; right:0; }
#aethrionFeaturesBackdrop { display:block; visibility:hidden; opacity:0; pointer-events:none; }
#aethrionFeaturesBackdrop.show { visibility:visible; opacity:1; pointer-events:auto; }
#aethrionFeaturesPanel .aethrion-features-group { margin:0 0 18px; }
#aethrionFeaturesPanel .aethrion-features-group-title { padding:8px 10px; color:#d9b45b; font-size:11px; font-weight:700; letter-spacing:1.5px; }
#aethrionFeaturesPanel .aethrion-features-list { display:grid; gap:8px; }
#aethrionFeaturesPanel .aethrion-feature-item { display:flex; align-items:center; gap:12px; width:100%; padding:12px; text-align:left; color:#f3f4f6; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.09); border-radius:12px; cursor:pointer; }
#aethrionFeaturesPanel .aethrion-feature-item:hover { background:rgba(217,180,91,.08); border-color:rgba(217,180,91,.35); }
#aethrionFeaturesPanel .aethrion-feature-text { display:flex; flex:1; min-width:0; flex-direction:column; gap:4px; }
#aethrionFeaturesPanel .aethrion-feature-name { color:#f7f7fb; font-weight:700; }
#aethrionFeaturesPanel .aethrion-feature-desc { color:#a8a9b8; font-size:12px; line-height:1.45; overflow-wrap:anywhere; }
#aethrionFeaturesPanel .aethrion-features-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; padding:14px 16px; border-top:1px solid rgba(255,255,255,.09); color:#9293a5; font-size:11px; }


/* Extracted inline styles; source attributes: id="aethrionUltimateGuard" */
/* 1. Varsayılan olarak Dashboard'u KESİN GİZLE */
    #dashboardArea {
        display: none !important;
    }
    /* 2. Varsayılan olarak Ana Sayfa'yı GÖSTER */
    #mainSite {
        display: block !important;
    }

    /* 3. SADECE giriş yapılmışsa (body'de logged-in-user class'ı varsa) Dashboard'u GÖSTER */
    body.logged-in-user #dashboardArea {
        display: block !important;
    }
    
    /* 4. Giriş yapılmışsa Ana Sayfa'yı GİZLE */
    body.logged-in-user #mainSite {
        display: none !important;
    }


/* Extracted inline styles; source attributes: none */
/* ============================================================ */
/* 🆕 [v1.0.0] SIDEBAR (Yan Menü) — Tüm özellikler logolarla  */
/* ============================================================ */
.aethrion-sidebar-toggle {
    position: fixed;
    top: 110px;
    left: 22px;
    width: 54px;
    height: 54px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 300% 300%;
    border: none;
    border-radius: 15px;
    cursor: pointer;
    z-index: 999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    box-shadow:
        0 4px 35px rgba(212,175,55,0.6),
        0 0 70px rgba(124,92,255,0.4),
        inset 0 0 18px rgba(255,255,255,0.12);
    transition: transform 0.28s ease, box-shadow 0.28s ease;
    animation: btnGradientShift 6s ease infinite;
}
.aethrion-sidebar-toggle:hover {
    transform: scale(1.1) rotate(-3deg);
    box-shadow:
        0 10px 55px rgba(212,175,55,0.95),
        0 0 110px rgba(124,92,255,0.65);
}
.aethrion-sidebar-toggle span {
    display: block;
    width: 26px;
    height: 3px;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 0 10px rgba(255,255,255,0.7);
    transition: all 0.32s ease;
}
.aethrion-sidebar-toggle.active span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}
.aethrion-sidebar-toggle.active span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}
.aethrion-sidebar-toggle.active span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/* Backdrop */
.aethrion-sidebar-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(5,5,7,0.75);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 999996;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.32s ease, visibility 0.32s ease;
}
.aethrion-sidebar-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Sidebar Panel */
.aethrion-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 380px;
    max-width: 92vw;
    z-index: 999997;
    background: linear-gradient(180deg, rgba(15,15,20,0.998) 0%, rgba(5,5,7,0.999) 100%);
    border-right: 1.5px solid rgba(212,175,55,0.4);
    box-shadow:
        30px 0 90px rgba(0,0,0,0.85),
        6px 0 45px rgba(212,175,55,0.18);
    display: flex;
    flex-direction: column;
    transform: translateX(-100%);
    transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    overflow: hidden;
}
.aethrion-sidebar.open {
    transform: translateX(0);
}
.aethrion-sidebar::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, transparent, var(--accent), var(--platinum), var(--purple), var(--ice), transparent);
    animation: aathEdgeGlow 3.5s ease-in-out infinite alternate;
    box-shadow: 0 0 25px var(--accent), 0 0 50px rgba(124,92,255,0.5);
    z-index: 1;
}

/* Sidebar Header */
.aethrion-sidebar-header {
    padding: 20px 22px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid rgba(212,175,55,0.22);
    background: linear-gradient(90deg, rgba(212,175,55,0.1), rgba(124,92,255,0.06), transparent);
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}
.aethrion-sidebar-title {
    display: flex;
    align-items: center;
    gap: 12px;
}
.aethrion-sidebar-title .aath-logo {
    width: 42px;
    height: 42px;
    filter: drop-shadow(0 0 12px rgba(212,175,55,0.7));
    flex-shrink: 0;
}
.aethrion-sidebar-brand {
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 1.6px;
    background: linear-gradient(90deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 5s ease infinite;
}
.aethrion-sidebar-slogan {
    font-size: 9.5px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: var(--accent2);
    font-weight: 500;
    margin-top: 2px;
    opacity: 0.9;
}
.aethrion-sidebar-close {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: transparent;
    border: 1.5px solid rgba(239,68,68,0.55);
    color: var(--danger);
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.22s;
    flex-shrink: 0;
    font-weight: 700;
}
.aethrion-sidebar-close:hover {
    background: rgba(239,68,68,0.22);
    color: #fff;
    transform: rotate(90deg) scale(1.08);
    box-shadow: 0 0 25px rgba(239,68,68,0.6);
}

/* Sidebar Body */
.aethrion-sidebar-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 12px 12px 20px;
}
.aethrion-sidebar-body::-webkit-scrollbar {
    width: 8px;
}
.aethrion-sidebar-body::-webkit-scrollbar-track {
    background: rgba(212,175,55,0.06);
    border-radius: 8px;
}
.aethrion-sidebar-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, rgba(212,175,55,0.6), rgba(124,92,255,0.6));
    border-radius: 8px;
}

/* Sidebar Group Title */
.aethrion-sidebar-group-title {
    font-family: var(--font-display);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    color: var(--text3);
    margin: 14px 4px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.aethrion-sidebar-group-title::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(212,175,55,0.25), transparent);
}

/* Sidebar Item */
.aethrion-sidebar-item {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 12px 14px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(212,175,55,0.04), rgba(124,92,255,0.03));
    border: 1px solid rgba(212,175,55,0.1);
    cursor: pointer;
    transition: all 0.22s ease;
    text-align: left;
    width: 100%;
    font-family: inherit;
    color: inherit;
    margin-bottom: 6px;
}
.aethrion-sidebar-item:hover {
    background: linear-gradient(135deg, rgba(212,175,55,0.14), rgba(124,92,255,0.1));
    border-color: var(--accent);
    transform: translateX(6px);
    box-shadow: 0 4px 20px rgba(212,175,55,0.2);
}
.aethrion-sidebar-item.active {
    background: linear-gradient(135deg, rgba(212,175,55,0.22), rgba(124,92,255,0.15));
    border-color: var(--accent);
    box-shadow:
        0 0 25px rgba(212,175,55,0.35),
        inset 0 0 18px rgba(255,255,255,0.05);
}
.aethrion-sidebar-item .aath-item-icon {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    border-radius: 12px;
    background: rgba(0,0,0,0.4);
    border: 1.5px solid rgba(212,175,55,0.35);
    transition: transform 0.25s ease;
}
.aethrion-sidebar-item:hover .aath-item-icon {
    transform: scale(1.1) rotate(-5deg);
}
.aethrion-sidebar-item .aath-item-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.aethrion-sidebar-item .aath-item-name {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--text);
    letter-spacing: 0.15px;
}
.aethrion-sidebar-item .aath-item-desc {
    font-size: 10.5px;
    color: var(--text3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.aethrion-sidebar-item .aath-item-arrow {
    font-size: 20px;
    font-weight: 700;
    opacity: 0.5;
    color: var(--accent);
    transition: opacity 0.22s, transform 0.22s;
    flex-shrink: 0;
}
.aethrion-sidebar-item:hover .aath-item-arrow {
    opacity: 1;
    transform: translateX(4px);
}

/* Sidebar Ana Ekran Butonu (Üst) */
.aethrion-sidebar-item.aath-home-btn {
    background: linear-gradient(135deg, rgba(212,175,55,0.2), rgba(232,197,85,0.12));
    border: 1.5px solid var(--gold);
    margin-bottom: 14px;
    box-shadow: 0 0 25px rgba(212,175,55,0.35);
}
.aethrion-sidebar-item.aath-home-btn:hover {
    background: linear-gradient(135deg, rgba(212,175,55,0.32), rgba(232,197,85,0.22));
    box-shadow: 0 0 40px rgba(212,175,55,0.7);
}
.aethrion-sidebar-item.aath-home-btn .aath-item-icon {
    border-color: var(--gold);
    color: var(--gold);
    box-shadow: 0 0 20px rgba(212,175,55,0.5);
}

/* Sidebar Footer */
.aethrion-sidebar-footer {
    padding: 12px 18px;
    border-top: 1px solid rgba(212,175,55,0.15);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 10.5px;
    color: var(--text3);
    letter-spacing: 0.5px;
    background: rgba(0,0,0,0.35);
    flex-shrink: 0;
}

/* Body kilidi */
body.aethrion-sidebar-open {
    overflow: hidden;
}

/* ============================================================ */
/* 🆕 [v1.0.0] SİTE DIŞI EYLEM ONAY MODALI                      */
/* ============================================================ */
.aethrion-responsibility-modal {
    position: fixed;
    inset: 0;
    z-index: 2147483645;
    background: rgba(5,5,7,0.97);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    animation: revealFadeIn 0.35s ease;
}
.aethrion-responsibility-modal.open {
    display: flex;
}
.aethrion-responsibility-box {
    background: linear-gradient(135deg, rgba(20,20,26,0.99), rgba(10,10,14,0.995));
    border: 2.5px solid var(--warning);
    border-radius: 26px;
    width: 100%;
    max-width: 560px;
    padding: 34px 30px 28px;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 0 120px rgba(245,158,11,0.35),
        0 0 240px rgba(245,158,11,0.15),
        inset 0 1px 0 rgba(255,255,255,0.06);
    animation: revealPop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.aethrion-responsibility-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--warning), var(--gold), var(--warning), transparent);
    box-shadow: 0 0 30px var(--warning);
}
.aethrion-responsibility-icon {
    width: 88px;
    height: 88px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--warning), #ff8c42);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 44px;
    color: #0a0a0e;
    box-shadow:
        0 0 50px rgba(245,158,11,0.7),
        0 0 100px rgba(245,158,11,0.35);
    animation: assistantPulse 2.2s ease-in-out infinite;
    font-weight: 800;
}
.aethrion-responsibility-title {
    font-family: var(--font-display);
    font-size: 23px;
    color: var(--warning);
    text-align: center;
    margin-bottom: 12px;
    text-shadow: 0 0 30px rgba(245,158,11,0.6);
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.aethrion-responsibility-desc {
    text-align: center;
    font-size: 13.5px;
    color: var(--text2);
    line-height: 1.75;
    margin-bottom: 20px;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}
.aethrion-resp-action-preview {
    background: linear-gradient(135deg, rgba(212,175,55,0.12), rgba(124,92,255,0.08));
    border: 1.5px solid var(--accent);
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 20px;
    font-size: 13px;
    color: var(--accent);
    font-family: var(--font-code);
    line-height: 1.65;
    word-break: break-word;
    box-shadow: 0 0 25px rgba(212,175,55,0.2);
    position: relative;
}
.aethrion-resp-action-preview::before {
    content: 'EYLEM:';
    display: block;
    font-size: 10px;
    letter-spacing: 1.5px;
    color: var(--text3);
    margin-bottom: 4px;
    font-weight: 700;
}
.aethrion-resp-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: linear-gradient(135deg, rgba(239,68,68,0.14), rgba(245,158,11,0.08));
    border: 2px solid rgba(239,68,68,0.55);
    border-radius: 14px;
    padding: 16px 18px;
    cursor: pointer;
    user-select: none;
    width: 100%;
    margin-bottom: 20px;
    transition: border-color 0.22s ease, box-shadow 0.22s;
}
.aethrion-resp-checkbox-label:hover {
    border-color: var(--danger);
    box-shadow: 0 0 30px rgba(239,68,68,0.4);
}
.aethrion-resp-checkbox-label input[type="checkbox"] {
    margin-top: 3px;
    width: 22px;
    height: 22px;
    accent-color: var(--warning);
    cursor: pointer;
    flex-shrink: 0;
}
.aethrion-resp-checkbox-label span {
    font-size: 13px;
    color: #ffb0b0;
    line-height: 1.65;
}
.aethrion-resp-checkbox-label strong {
    color: #fff;
    display: block;
    margin-bottom: 4px;
    font-size: 14px;
}
.aethrion-resp-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.aethrion-resp-actions button {
    flex: 1;
    min-width: 130px;
    padding: 14px;
    border-radius: 40px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    font-family: var(--font-body);
    border: none;
    transition: all 0.22s;
    letter-spacing: 0.4px;
}
.aethrion-resp-actions .aath-resp-cancel {
    background: transparent;
    border: 1.5px solid var(--border2);
    color: var(--text3);
}
.aethrion-resp-actions .aath-resp-cancel:hover {
    border-color: var(--danger);
    color: var(--danger);
    box-shadow: 0 0 25px rgba(239,68,68,0.4);
}
.aethrion-resp-actions .aath-resp-confirm {
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    color: #0a0a0e;
    box-shadow: 0 0 35px rgba(212,175,55,0.5);
    animation: btnGradientShift 5s ease infinite;
    text-shadow: 0 1px 2px rgba(255,255,255,0.2);
}
.aethrion-resp-actions .aath-resp-confirm:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow:
        0 0 55px rgba(212,175,55,0.9),
        0 0 100px rgba(124,92,255,0.6);
}
.aethrion-resp-actions .aath-resp-confirm:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: none;
    animation: none;
}

/* ============================================================ */
/* 🆕 [v1.0.0] NAVBAR AVATAR                                     */
/* ============================================================ */
.navbar-avatar-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 8px;
    padding: 4px 12px 4px 4px;
    background: linear-gradient(135deg, rgba(212,175,55,0.15), rgba(124,92,255,0.1));
    border: 1.5px solid var(--accent);
    border-radius: 40px;
    cursor: pointer;
    transition: all 0.22s ease;
    position: relative;
}
.navbar-avatar-wrapper:hover {
    background: linear-gradient(135deg, rgba(212,175,55,0.28), rgba(124,92,255,0.18));
    box-shadow: 0 0 25px rgba(212,175,55,0.5);
    transform: translateY(-1px);
}
.navbar-avatar-img {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 800;
    color: #0a0a0e;
    box-shadow: 0 0 18px rgba(212,175,55,0.6);
    overflow: hidden;
}
.navbar-avatar-name {
    font-size: 12px;
    color: var(--text);
    font-weight: 600;
    letter-spacing: 0.2px;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.navbar-avatar-wrapper .aath-avatar-chev {
    font-size: 10px;
    color: var(--accent);
    transition: transform 0.22s;
}
.navbar-avatar-wrapper:hover .aath-avatar-chev {
    transform: rotate(180deg);
}
.navbar-avatar-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 220px;
    background: linear-gradient(135deg, rgba(20,20,26,0.998), rgba(10,10,14,0.999));
    border: 1.5px solid var(--accent);
    border-radius: 16px;
    box-shadow: 0 25px 80px rgba(0,0,0,0.85), 0 0 60px rgba(212,175,55,0.25);
    padding: 8px;
    z-index: 10001;
    display: none;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.22s, transform 0.22s;
    flex-direction: column;
    gap: 2px;
}
.navbar-avatar-wrapper.menu-open .navbar-avatar-menu {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}
.navbar-avatar-menu button {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: transparent;
    border: none;
    border-radius: 10px;
    color: var(--text2);
    font-size: 12.5px;
    font-weight: 500;
    font-family: var(--font-body);
    cursor: pointer;
    text-align: left;
    width: 100%;
    transition: background 0.18s, color 0.18s;
    letter-spacing: 0.2px;
}
.navbar-avatar-menu button:hover {
    background: linear-gradient(90deg, rgba(212,175,55,0.18), rgba(124,92,255,0.1));
    color: var(--accent);
}
.navbar-avatar-menu .aath-menu-divider {
    height: 1px;
    background: rgba(212,175,55,0.18);
    margin: 6px 4px;
}
.navbar-avatar-menu .aath-menu-danger {
    color: var(--danger);
}
.navbar-avatar-menu .aath-menu-danger:hover {
    background: rgba(239,68,68,0.18);
    color: #ff8a9a;
}

/* ============================================================ */
/* 🆕 [v1.0.0] DAHA ŞIK SPLASH — EKSTRA HALKA + SHIMMER          */
/* ============================================================ */
.splash-logo-outer-ring {
    position: absolute;
    inset: -22px;
    border-radius: 50%;
    border: 2px dashed rgba(212,175,55,0.5);
    animation: splashRingSpin 12s linear infinite;
    pointer-events: none;
}
.splash-logo-inner-ring {
    position: absolute;
    inset: -12px;
    border-radius: 50%;
    border: 1.5px solid rgba(124,92,255,0.45);
    animation: splashRingSpin 8s linear infinite reverse;
    pointer-events: none;
}
@keyframes splashRingSpin {
    to { transform: rotate(360deg); }
}
.splash-logo-shimmer {
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    background: conic-gradient(
        from 0deg,
        transparent,
        rgba(212,175,55,0.6),
        transparent,
        rgba(124,92,255,0.5),
        transparent,
        rgba(127,212,255,0.5),
        transparent
    );
    animation: splashShimmerSpin 4s linear infinite;
    filter: blur(6px);
    opacity: 0.85;
    pointer-events: none;
    z-index: -1;
}
@keyframes splashShimmerSpin {
    to { transform: rotate(360deg); }
}

/* ============================================================ */
/* 🆕 [v1.0.0] MODAL KAPATMA FIX (Emir Güncellemesi)            */
/* ============================================================ */
#v27KeyRevealOverlay:not(.open),
#a27KeyRevealOverlay:not(.open),
#v27ApiKeyCreatedModal:not(.open),
#a27ApiKeyCreatedModal:not(.open),
#modalOverlay:not(.open),
#v27ApiGuideModal:not(.open),
#a27ApiGuideModal:not(.open),
#v27QuickCreateOverlay:not(.open),
#a27QuickCreateOverlay:not(.open),
#v27ApiKeyGeneratorModal:not(.open),
#a27ApiKeyGeneratorModal:not(.open) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ============================================================ */
/* 🆕 [v1.0.0] RESPONSIVE — Sidebar için                        */
/* ============================================================ */
@media (max-width: 768px) {
    .aethrion-sidebar-toggle {
        top: 84px;
        left: 14px;
        width: 48px;
        height: 48px;
    }
    .aethrion-sidebar-toggle span {
        width: 22px;
    }
    .aethrion-sidebar {
        width: 88vw;
        max-width: 88vw;
    }
}
@media (max-width: 480px) {
    .aethrion-sidebar-toggle {
        top: 74px;
        left: 10px;
        width: 44px;
        height: 44px;
        border-radius: 12px;
    }
    .aethrion-sidebar-toggle span {
        width: 20px;
        height: 2.5px;
    }
    .aethrion-sidebar-item {
        padding: 10px 12px;
        gap: 10px;
    }
    .aethrion-sidebar-item .aath-item-icon {
        width: 36px;
        height: 36px;
        font-size: 17px;
    }
    .aethrion-sidebar-item .aath-item-name {
        font-size: 12.5px;
    }
    .aethrion-sidebar-item .aath-item-desc {
        font-size: 9.5px;
    }
    .aethrion-responsibility-box {
        padding: 24px 18px 20px;
    }
    .aethrion-responsibility-icon {
        width: 68px;
        height: 68px;
        font-size: 34px;
    }
    .aethrion-responsibility-title {
        font-size: 19px;
    }
    .navbar-avatar-wrapper {
        padding: 3px 8px 3px 3px;
    }
    .navbar-avatar-img {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }
    .navbar-avatar-name {
        display: none;
    }
}


/* Extracted inline styles; source attributes: none */
/* ═══ AETHRION AL PANEL — Varsayılan KAPALI ═══ */
.vizyon-al-panel {
    position: fixed;
    top: 0;
    right: -100%;
    width: 28%;
    min-width: 410px;
    max-width: 570px;
    height: 100vh;
    background: linear-gradient(180deg, rgba(20,20,26,0.985) 0%, rgba(5,5,7,0.995) 100%);
    border-left: 1px solid rgba(212,175,55,0.4);
    box-shadow: -25px 0 90px rgba(0,0,0,0.9), -6px 0 45px rgba(212,175,55,0.18);
    z-index: 999998;
    display: flex;
    flex-direction: column;
    transition: right 0.52s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
}
.vizyon-al-panel.open { right: 0; }

/* 🚨 KRİTİK — Açılışta panel KAPALI ve GİZLİ olmalı */
.vizyon-al-panel:not(.open) {
    right: -100% !important;
    visibility: hidden !important;
    pointer-events: none !important;
}
.vizyon-al-panel.open {
    visibility: visible !important;
    pointer-events: auto !important;
}

/* ═══ AETHRION AL HEADER ═══ */
.vizyon-al-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    background: linear-gradient(90deg, rgba(212,175,55,0.1), rgba(124,92,255,0.08), rgba(184,192,208,0.08));
    border-bottom: 1px solid rgba(212,175,55,0.22);
    flex-shrink: 0;
    gap: 12px;
}
.vz-title {
    display: flex;
    align-items: center;
    gap: 13px;
    font-family: var(--font-display);
    font-size: 17px;
    font-weight: 800;
    background: linear-gradient(90deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff, #d4af37);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: gradientMove 4s ease infinite;
    letter-spacing: 1.2px;
}
.vz-icon {
    width: 42px;
    height: 42px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 200% 200%;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    box-shadow: 0 0 30px rgba(212,175,55,0.7), 0 0 60px rgba(124,92,255,0.45);
    flex-shrink: 0;
}
.vizyon-al-close {
    background: transparent;
    border: 1px solid rgba(239,68,68,0.55);
    color: #ef4444;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.22s;
    flex-shrink: 0;
    font-weight: 700;
}
.vizyon-al-close:hover {
    background: rgba(239,68,68,0.28);
    color: #fff;
    transform: rotate(90deg) scale(1.12);
}

/* ═══ SORUMLULUK ALANI ═══ */
.vizyon-al-responsibility {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 38px 28px;
    text-align: center;
    gap: 24px;
    overflow-y: auto;
}
.vz-shield {
    font-size: 68px;
    filter: drop-shadow(0 0 35px rgba(212,175,55,0.75));
    animation: shieldPulse 2.2s ease-in-out infinite;
}
.vizyon-al-responsibility h3 {
    font-family: var(--font-display);
    font-size: 21px;
    color: var(--accent);
    margin-bottom: 10px;
}
.vizyon-al-responsibility p {
    font-size: 13.5px;
    color: var(--text2);
    line-height: 1.85;
    max-width: 420px;
}
.vz-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    background: linear-gradient(135deg, rgba(239,68,68,0.12), rgba(127,212,255,0.08));
    border: 1.5px solid rgba(239,68,68,0.45);
    border-radius: 14px;
    padding: 17px 20px;
    cursor: pointer;
    width: 100%;
    max-width: 440px;
    text-align: left;
}
.vz-checkbox-label input[type="checkbox"] {
    margin-top: 3px;
    width: 22px;
    height: 22px;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}
.vz-checkbox-label span {
    font-size: 13px;
    color: #ffb0b0;
    line-height: 1.65;
}
.vz-start-btn {
    width: 100%;
    max-width: 440px;
    padding: 17px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    color: #0a0a0e;
    border: none;
    border-radius: 34px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    animation: btnGradientShift 5s ease infinite;
}
.vz-start-btn:disabled { opacity: 0.4; cursor: not-allowed; }

/* ═══ MOD SEÇİM ALANI ═══ */
.vizyon-al-modes {
    display: flex;
    gap: 6px;
    padding: 13px 15px;
    background: rgba(0,0,0,0.4);
    border-bottom: 1px solid rgba(212,175,55,0.2);
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: center;
}
.vz-mode-btn {
    flex: 1;
    min-width: 82px;
    padding: 11px 13px;
    background: linear-gradient(135deg, rgba(212,175,55,0.08), rgba(124,92,255,0.05));
    border: 1.5px solid rgba(212,175,55,0.25);
    border-radius: 24px;
    color: var(--text3);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.28s;
    white-space: nowrap;
}
.vz-mode-btn.active {
    background: linear-gradient(135deg, rgba(212,175,55,0.32), rgba(124,92,255,0.3));
    border-color: var(--accent);
    color: #ffffff;
    font-weight: 700;
}

/* ═══ SOHBET ALANI ═══ */
.vizyon-al-chat {
    flex: 1;
    overflow-y: auto;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: rgba(0,0,0,0.28);
}
.vz-msg {
    max-width: 92%;
    padding: 13px 18px;
    border-radius: 18px;
    font-size: 13.5px;
    line-height: 1.7;
    word-wrap: break-word;
}
.vz-msg.user {
    align-self: flex-end;
    background: linear-gradient(135deg, rgba(212,175,55,0.26), rgba(124,92,255,0.18));
    border: 1px solid rgba(212,175,55,0.4);
    color: #fff;
}
.vz-msg.bot {
    align-self: flex-start;
    background: linear-gradient(135deg, rgba(184,192,208,0.12), rgba(127,212,255,0.1));
    border: 1px solid rgba(184,192,208,0.25);
    border-left: 3px solid var(--accent2);
    color: #e8f0f8;
}
.vz-role {
    font-size: 11px;
    font-weight: 700;
    color: var(--accent2);
    margin-bottom: 6px;
    letter-spacing: 0.55px;
    text-transform: uppercase;
}

/* ═══ DOSYA ÖNİZLEME ═══ */
.vz-file-preview-box {
    display: none;
    align-items: center;
    gap: 14px;
    padding: 13px 16px;
    background: linear-gradient(135deg, rgba(212,175,55,0.1), rgba(124,92,255,0.08));
    border: 1px solid rgba(212,175,55,0.4);
    border-radius: 14px 14px 0 0;
    flex-shrink: 0;
}
.vz-file-preview-box.show { display: flex; }

/* ═══ ALT INPUT ALANI ═══ */
.vizyon-al-input-area {
    display: flex;
    gap: 9px;
    padding: 15px 18px;
    background: rgba(5,5,7,0.99);
    border-top: 1px solid rgba(212,175,55,0.28);
    align-items: flex-end;
    flex-shrink: 0;
    flex-wrap: wrap;
}
.vizyon-al-input-area textarea {
    flex: 1;
    min-width: 130px;
    background: linear-gradient(135deg, rgba(212,175,55,0.06), rgba(124,92,255,0.04));
    border: 1.5px solid rgba(212,175,55,0.35);
    color: #fff;
    padding: 12px 18px;
    border-radius: 24px;
    font-size: 13.5px;
    resize: none;
    max-height: 130px;
    min-height: 46px;
    outline: none;
}
.vz-mic-btn {
    width: 46px;
    height: 46px;
    background: linear-gradient(135deg, rgba(212,175,55,0.18), rgba(124,92,255,0.12));
    border: 1.5px solid rgba(212,175,55,0.45);
    border-radius: 50%;
    color: var(--accent);
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.vz-voice-chat-btn {
    width: 46px;
    height: 46px;
    background: linear-gradient(135deg, rgba(127,212,255,0.24), rgba(124,92,255,0.18));
    border: 1.5px solid rgba(127,212,255,0.55);
    border-radius: 50%;
    color: var(--ice);
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.vz-send-btn {
    padding: 13px 24px;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    color: #0a0a0e;
    border: none;
    border-radius: 24px;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    flex-shrink: 0;
    animation: btnGradientShift 5s ease infinite;
}

/* ═══ SESLİ SOHBET FULLSCREEN — Varsayılan GİZLİ ═══ */
.vz-voice-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 9999999;
    background: radial-gradient(ellipse at 50% 40%, #0f0f14 0%, #050507 55%, #000 100%);
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    overflow: hidden;
}
.vz-voice-fullscreen.open { display: flex; }

/* 🚨 KRİTİK — Açılışta sesli sohbet modalı KESİN KAPALI olmalı */
.vz-voice-fullscreen:not(.open) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}
.vz-voice-fullscreen.open {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.vz-voice-logo {
    width: 152px;
    height: 152px;
    border-radius: 50%;
    background: linear-gradient(135deg, #d4af37, #b8c0d0, #7c5cff, #7fd4ff);
    background-size: 250% 250%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 65px;
    position: relative;
    z-index: 2;
    animation: voiceLogoPulse 2.2s ease-in-out infinite, gradientMove 5s ease infinite;
    box-shadow: 0 0 70px rgba(212,175,55,0.8), 0 0 140px rgba(124,92,255,0.55);
    color: #fff;
}
.vz-voice-waves {
    display: flex;
    gap: 5px;
    margin-top: 34px;
    align-items: center;
    height: 44px;
    z-index: 2;
}
.vz-voice-waves span {
    width: 4.5px;
    background: linear-gradient(180deg, var(--accent), var(--platinum), var(--purple));
    border-radius: 4px;
    animation: voiceWave 1.3s ease-in-out infinite;
}
.vz-voice-transcript {
    margin-top: 36px;
    max-width: 740px;
    text-align: center;
    color: var(--text2);
    font-size: 16px;
    line-height: 1.75;
    padding: 0 22px;
    z-index: 2;
    min-height: 62px;
}
.vz-voice-back-btn {
    position: fixed;
    top: 26px;
    right: 26px;
    padding: 13px 24px;
    background: linear-gradient(135deg, rgba(239,68,68,0.24), rgba(230,57,70,0.18));
    border: 1.5px solid rgba(239,68,68,0.55);
    color: #ef4444;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 9px;
}
.vz-voice-status {
    position: fixed;
    top: 32px;
    left: 32px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 20px;
    background: rgba(0,0,0,0.55);
    border-radius: 999px;
    border: 1px solid rgba(212,175,55,0.4);
    color: var(--accent);
    font-size: 13px;
    font-weight: 600;
    z-index: 3;
}
.vz-thinking {
    align-self: flex-start;
    max-width: 94%;
    padding: 10px 0;
}

/* ═══ GÜVENLİK: Açılışta backend modal'ları KESİN GİZLİ ═══ */
body:not(.dashboard-open) .vizyon-al-panel:not(.open),
body:not(.dashboard-open) .vz-voice-fullscreen:not(.open) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}


/* Extracted inline styles; source attributes: none */
/* Modal Temizleme */
.modal-overlay:not(.open),
.a27-key-reveal-overlay:not(.open),
.koc-share-modal-overlay:not(.open),
.A27-key-reveal-overlay:not(.open) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.modal-overlay.open,
.a27-key-reveal-overlay.open,
.koc-share-modal-overlay.open,
.A27-key-reveal-overlay.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Z-Index düzeltmesi */
#v27KeyRevealOverlay,
#a27KeyRevealOverlay {
    z-index: 2147483647 !important;
}

#kocShareModalOverlay {
    z-index: 2147483646 !important;
}

/* Footer Düzeni */
.footer-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
}

.footer-badges > * {
    flex: 0 0 auto !important;
}

@media (max-width: 768px) {
    .footer-badges {
        flex-direction: column !important;
    }
    .footer-badges > * {
        width: 100% !important;
        max-width: 320px !important;
        justify-content: center !important;
    }
}

/* Navbar Sticky */
nav, .navbar {
    position: fixed !important;
    top: 48px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    background: rgba(10, 10, 14, 0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

@media (max-width: 768px) {
    nav, .navbar {
        top: 52px !important;
    }
}

body {
    padding-top: 48px;
}


/* Extracted inline styles; source attributes: none */
/* A27 API Rehber Modalı — VARSAYILAN GİZLİ */
.A27-api-guide-overlay,
#v27ApiGuideModal {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.A27-api-guide-overlay.open,
#v27ApiGuideModal.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* A27 Quick Create Modalı — VARSAYILAN GİZLİ */
.A27-quick-create-overlay,
#v27QuickCreateOverlay {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.A27-quick-create-overlay.open,
#v27QuickCreateOverlay.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* A27 Key Created Modal (A27 + A27 uyumlu) */
#v27ApiKeyCreatedModal,
#a27ApiKeyCreatedModal {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
#v27ApiKeyCreatedModal.open,
#a27ApiKeyCreatedModal.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* A27 Key Generator Modal */
#v27ApiKeyGeneratorModal,
#a27ApiKeyGeneratorModal {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
#v27ApiKeyGeneratorModal.open,
#a27ApiKeyGeneratorModal.open {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Z-Index güvenlik */
#v27ApiGuideModal.open,
#v27QuickCreateOverlay.open {
    z-index: 2147483647 !important;
}


/* Extracted inline styles; source attributes: id="aethrionFinalStyles" */
/* ═══ KARŞILAMA EKRANI ═══ */
#aethrionWelcomeScreen {
    min-height: calc(100vh - 100px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    text-align: center;
    background: radial-gradient(ellipse at center top, rgba(232,197,85,0.08), transparent 70%);
}

#aethrionWelcomeScreen .aw-avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 300% 300%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    font-weight: 900;
    color: #06060b;
    margin-bottom: 22px;
    box-shadow: 0 0 60px rgba(232,197,85,0.7), 0 0 120px rgba(139,107,255,0.4);
    animation: awSpin 8s linear infinite, awPulse 3s ease-in-out infinite;
}

@keyframes awSpin { 0% { background-position: 0% 50%; } 100% { background-position: 300% 50%; } }
@keyframes awPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }

#aethrionWelcomeScreen h1 {
    font-family: 'Syne', 'Inter', sans-serif;
    font-size: clamp(32px, 5vw, 52px);
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1.15;
}

#aethrionWelcomeScreen .aw-name {
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff, #e8c555);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: awGrad 4s ease infinite;
}

@keyframes awGrad { 0%,100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

#aethrionWelcomeScreen .aw-role {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 24px;
}

#aethrionWelcomeScreen .aw-role.founder { background: rgba(232,197,85,0.2); border: 1.5px solid #e8c555; color: #e8c555; }
#aethrionWelcomeScreen .aw-role.admin { background: rgba(232,197,85,0.15); border: 1.5px solid #e8c555; color: #e8c555; }
#aethrionWelcomeScreen .aw-role.beta { background: rgba(139,107,255,0.2); border: 1.5px solid #8b6bff; color: #8b6bff; }
#aethrionWelcomeScreen .aw-role.moderator { background: rgba(232,197,85,0.15); border: 1.5px solid #e8c555; color: #e8c555; }
#aethrionWelcomeScreen .aw-role.user { background: rgba(197,205,224,0.15); border: 1.5px solid #c5cde0; color: #c5cde0; }

#aethrionWelcomeScreen .aw-sub {
    color: #dbdbe8;
    font-size: 15px;
    max-width: 560px;
    line-height: 1.8;
    margin-bottom: 32px;
}

#aethrionWelcomeScreen .aw-cta {
    padding: 18px 48px;
    font-size: 18px;
    font-weight: 800;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 250% 250%;
    color: #06060b;
    border: none;
    border-radius: 60px;
    cursor: pointer;
    box-shadow: 0 0 50px rgba(232,197,85,0.6), 0 0 100px rgba(139,107,255,0.4);
    animation: btnGradientShift 5s ease infinite;
    transition: transform 0.25s;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 50px;
}

#aethrionWelcomeScreen .aw-cta:hover {
    transform: translateY(-4px) scale(1.05);
}

/* ═══ SAĞ PANEL ═══ */
#aethrionFeaturesPanel {
    position: fixed;
    top: 0;
    right: -100%;
    width: 420px;
    max-width: 92vw;
    height: 100vh;
    background: linear-gradient(180deg, #0f0f16 0%, #050508 100%);
    border-left: 2px solid rgba(232,197,85,0.4);
    box-shadow: -30px 0 90px rgba(0,0,0,0.85);
    z-index: 999999;
    display: flex;
    flex-direction: column;
    transition: right 0.4s cubic-bezier(0.4,0,0.2,1);
    overflow: hidden;
}

#aethrionFeaturesPanel.open { right: 0; }

#aethrionFeaturesPanel .afp-head {
    padding: 18px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(232,197,85,0.2);
    background: linear-gradient(90deg, rgba(232,197,85,0.1), rgba(139,107,255,0.05));
    flex-shrink: 0;
}

#aethrionFeaturesPanel .afp-head h3 {
    font-family: 'Syne', sans-serif;
    font-size: 16px;
    letter-spacing: 1.5px;
    background: linear-gradient(90deg, #e8c555, #c5cde0, #8b6bff, #e8c555);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: awGrad 4s ease infinite;
}

#aethrionFeaturesPanel .afp-close {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(239,68,68,0.15);
    border: 1.5px solid rgba(239,68,68,0.6);
    color: #ef4444;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

#aethrionFeaturesPanel .afp-close:hover {
    background: rgba(239,68,68,0.35);
    color: #fff;
    transform: rotate(90deg);
}

#aethrionFeaturesPanel .afp-body {
    flex: 1;
    overflow-y: auto;
    padding: 10px 12px;
}

#aethrionFeaturesPanel .afp-group {
    margin-bottom: 16px;
}

#aethrionFeaturesPanel .afp-group-title {
    font-family: 'Syne', sans-serif;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #8a8aa8;
    text-transform: uppercase;
    padding: 8px 6px;
    display: flex;
    align-items: center;
    gap: 8px;
}

#aethrionFeaturesPanel .afp-group-title::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(232,197,85,0.3), transparent);
}

#aethrionFeaturesPanel .afp-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    margin-bottom: 4px;
    background: linear-gradient(135deg, rgba(232,197,85,0.04), rgba(139,107,255,0.02));
    border: 1px solid rgba(232,197,85,0.1);
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    font-family: 'Inter', sans-serif;
    color: inherit;
    transition: all 0.2s;
}

#aethrionFeaturesPanel .afp-item:hover {
    background: rgba(232,197,85,0.12);
    border-color: #e8c555;
    transform: translateX(-3px);
}

#aethrionFeaturesPanel .afp-icon {
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    border-radius: 9px;
    background: rgba(0,0,0,0.4);
    border: 1.5px solid rgba(232,197,85,0.3);
}

#aethrionFeaturesPanel .afp-text {
    flex: 1;
    min-width: 0;
}

#aethrionFeaturesPanel .afp-name {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    display: block;
    margin-bottom: 2px;
}

#aethrionFeaturesPanel .afp-desc {
    font-size: 10.5px;
    color: #8a8aa8;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#aethrionFeaturesPanel .afp-arrow {
    color: #e8c555;
    opacity: 0.5;
    font-size: 16px;
}

#aethrionFeaturesPanel .afp-item:hover .afp-arrow {
    opacity: 1;
}

/* ═══ TRIGGER (Panel Açma Butonu) ═══ */
#aethrionFeaturesTrigger {
    position: fixed;
    top: 100px;
    right: 24px;
    width: 52px;
    height: 52px;
    background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff);
    background-size: 300% 300%;
    border: none;
    border-radius: 14px;
    cursor: pointer;
    z-index: 999998;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    box-shadow: 0 4px 30px rgba(232,197,85,0.6);
    animation: btnGradientShift 6s ease infinite;
}

#aethrionFeaturesTrigger span {
    display: block;
    width: 24px;
    height: 3px;
    background: #fff;
    border-radius: 2px;
}

#aethrionFeaturesTrigger:hover {
    transform: scale(1.1);
}

#aethrionFeaturesTrigger.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
#aethrionFeaturesTrigger.active span:nth-child(2) { opacity: 0; }
#aethrionFeaturesTrigger.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ═══ BACKDROP ═══ */
#aethrionFeaturesBackdrop {
    position: fixed;
    inset: 0;
    background: rgba(5,5,7,0.75);
    backdrop-filter: blur(6px);
    z-index: 999997;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s, visibility 0.3s;
}

#aethrionFeaturesBackdrop.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

@media (max-width: 768px) {
    #aethrionFeaturesPanel { width: 100vw; max-width: 100vw; }
    #aethrionFeaturesTrigger { top: 80px; right: 14px; width: 46px; height: 46px; }
    #aethrionWelcomeScreen .aw-avatar { width: 90px; height: 90px; font-size: 40px; }
    #aethrionWelcomeScreen .aw-cta { padding: 14px 32px; font-size: 15px; }
}


/* Extracted inline styles; source attributes: id="aethrionGuardStyles" */
/* Kullanıcı yoksa dashboard'u kesin gizle (CSS ile) */
    body:not(.logged-in-user) #dashboardArea {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    /* Moderatör paneli her zaman gizli olsun, sadece JS ile gösterilecek */
    #moderatorInfoCard {
        display: none !important;
    }
    /* Dashboard açıkken ana sayfayı gizle */
    body.logged-in-user #mainSite {
        display: none !important;
    }


/* Extracted inline styles; source attributes: id="aethrionNihaiStyles" */
/* ========== 1. MOBİL VE GENEL DÜZELTMELER ========== */
    @media (max-width: 768px) {
        /* Dashboard içeriğinin taşmasını ve titreşimi engelle */
        #dashboardArea, #dashboardArea * {
            max-width: 100vw !important;
            box-sizing: border-box !important;
        }
        #dashboardArea .dashboard-content-wrapper {
            padding: 15px !important;
            overflow-x: hidden !important;
        }
        /* Karşılama ekranı mobil */
        #aethrionWelcomeScreen {
            padding: 30px 15px !important;
        }
        #aethrionWelcomeScreen h1 {
            font-size: 28px !important;
        }
        /* Sağ panel mobilde tam ekran */
        #aethrionFeaturesPanel {
            width: 100vw !important;
            max-width: 100vw !important;
        }
    }

    /* ========== 2. ÖZELLİKLER PANELİ TETİKLEYİCİSİ ========== */
    /* Her zaman görünür ve tıklanabilir olsun */
    #aethrionFeaturesTrigger {
        position: fixed !important;
        top: 100px !important;
        right: 24px !important;
        width: 54px !important;
        height: 54px !important;
        background: linear-gradient(135deg, #e8c555, #c5cde0, #8b6bff, #6ee0ff) !important;
        background-size: 300% 300% !important;
        border: none !important;
        border-radius: 15px !important;
        cursor: pointer !important;
        z-index: 99999999 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 5px !important;
        box-shadow: 0 4px 35px rgba(232,197,85,0.6) !important;
        animation: btnGradientShift 6s ease infinite !important;
    }
    #aethrionFeaturesTrigger span {
        display: block !important;
        width: 26px !important;
        height: 3px !important;
        background: #fff !important;
        border-radius: 2px !important;
    }
    @media (max-width: 768px) {
        #aethrionFeaturesTrigger {
            top: 80px !important;
            right: 14px !important;
            width: 46px !important;
            height: 46px !important;
        }
        #aethrionFeaturesTrigger span { width: 22px !important; }
    }

    /* ========== 3. PANEL İÇİ DÜZEN ========== */
    #aethrionFeaturesPanel {
        position: fixed !important;
        top: 0 !important;
        right: -100% !important;
        width: 420px !important;
        max-width: 92vw !important;
        height: 100vh !important;
        background: #0f0f16 !important;
        border-left: 2px solid #e8c555 !important;
        z-index: 99999998 !important;
        display: flex !important;
        flex-direction: column !important;
        transition: right 0.4s ease !important;
        overflow-y: auto !important;
    }
    #aethrionFeaturesPanel.open { right: 0 !important; }

    /* ========== 4. KARŞILAMA EKRANI KİLİDİ ========== */
    #aethrionWelcomeScreen {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: calc(100vh - 100px) !important;
        text-align: center !important;
    }


/* Extracted inline styles; source attributes: id="aethrionFinalMasterCSS" */
/* 1. MODERATÖR PANELİNİ KESİN GİZLE (Sadece gerçekten moderatörse gösterilecek) */
    #moderatorInfoCard {
        display: none !important;
    }

    /* 2. KOÇ VE SESLİ ASİSTAN MODALLARINI ZORLA ÖNE ÇIKAR */
    #kocPanelOverlay, #voiceChatFullscreen, #vzVoiceFullscreen, #aethrionAlPanel {
        z-index: 2147483647 !important; /* En üst katman */
    }
    #kocPanelOverlay.open, #voiceChatFullscreen.open, #vzVoiceFullscreen.open {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* 3. ÖZELLİKLER BUTONU HER ZAMAN GÖRÜNSÜN */
    #aethrionFeaturesTrigger {
        z-index: 2147483646 !important;
    }

    /* 4. MOBİL DÜZELTME */
    @media (max-width: 768px) {
        #dashboardArea .dashboard-content-wrapper {
            padding: 10px !important;
            overflow-x: hidden !important;
        }
        #aethrionWelcomeScreen h1 { font-size: 28px !important; }
        #aethrionFeaturesPanel { width: 100vw !important; max-width: 100vw !important; }
    }


/* Extracted inline styles; source attributes: none */
@keyframes awPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.05)} }
                @keyframes awGrad { 0%,100%{background-position:0% 50%} 50%{background-position:100% 50%} }


/* Extracted inline styles; source attributes: id="aethrion-workspace-consolidation-v7" */
html, body { max-width:100%; overflow-x:clip; }
  body.ae-shell-on #dashboardArea,
  body.ae-shell-on #dashboardArea * { box-sizing:border-box; }
  body.ae-shell-on #dashboardArea { min-width:0!important; }
  body.ae-shell-on #aethrionWorkspaceStage { width:100%!important; min-width:0!important; max-width:100%!important; overflow:hidden!important; }
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-head { min-width:0!important; flex-wrap:wrap!important; overflow-wrap:anywhere!important; }
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-head h2,
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-head p,
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-empty h3,
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-empty p { min-width:0!important; max-width:100%!important; overflow-wrap:anywhere!important; word-break:normal!important; }
  body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-frame { display:block!important; width:100%!important; min-width:0!important; min-height:70vh!important; border:0!important; background:#f5f8fc!important; }
  body.ae-shell-on #aeWorkspaceSidebar { min-width:0!important; }
  body.ae-shell-on #aeWorkspaceSidebar .aews-search { width:100%!important; min-width:0!important; }
  body.ae-shell-on #aeWorkspaceSidebar .aews-search input { min-width:0!important; }
  body.ae-shell-on #aeWorkspaceSidebar .aews-link { height:auto!important; min-height:42px!important; white-space:normal!important; }
  body.ae-shell-on #aeWorkspaceSidebar .aews-link > span:last-child { min-width:0!important; white-space:normal!important; overflow-wrap:anywhere!important; line-height:1.4!important; }
  body.ae-shell-on .aew-name, body.ae-shell-on .aew-copy { max-width:100%!important; overflow-wrap:anywhere!important; }
  body.ae-shell-on .aew-name em { display:inline-block!important; max-width:100%!important; overflow-wrap:anywhere!important; }
  body.ae-shell-on.ae-overlay-active #aeWorkspaceSidebar { z-index:99990!important; }
  body.ae-shell-on.ae-overlay-active #aewsMobileToggle,
  body.ae-shell-on.ae-overlay-active #aewsMobileShade { display:none!important; pointer-events:none!important; }
  #fullAIPanel, #full3DBuilder, #videoEditorOverlay, #voiceChatFullscreen, #vzVoiceFullscreen { z-index:2147483000!important; }
  body.ae-shell-on #aethrionExperienceDrawer,
  body.ae-shell-on #aethrionExperienceBackdrop,
  body.ae-shell-on #aethrionFeaturesPanel,
  body.ae-shell-on #aethrionFeaturesBackdrop,
  body.ae-shell-on #aethrionFeaturesTrigger,
  body.ae-shell-on #aethrionFeaturesButton,
  body.ae-shell-on .aed-search,
  body.ae-shell-on .aethrion-sidebar,
  body.ae-shell-on .aethrion-sidebar-toggle,
  body.ae-shell-on .aethrion-sidebar-backdrop { display:none!important; visibility:hidden!important; pointer-events:none!important; }
  @media(max-width:768px) {
    body.ae-shell-on #dashboardArea { width:100%!important; max-width:100%!important; margin:0!important; padding:12px!important; }
    body.ae-shell-on #aethrionWorkspaceStage { min-height:calc(100dvh - 24px)!important; border-radius:14px!important; }
    body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-head { padding:16px!important; }
    body.ae-shell-on #aethrionWorkspaceStage .ae-ws-stage-frame { min-height:65vh!important; }
    }


/* Extracted inline styles; source attributes: id="aethrionAuthInputReliabilityPatch" */
#authModal{z-index:2147483001!important;pointer-events:auto!important}
#authModal .modal,#authModal .modal-body,#authModal input,#authModal button{pointer-events:auto!important}
#authModal input.form-input{position:relative;z-index:2147483002!important;pointer-events:auto!important;touch-action:manipulation;user-select:text;-webkit-user-select:text;caret-color:var(--text,#fff);-webkit-appearance:none;appearance:none}
#authModal input.form-input:focus{outline:2px solid var(--accent,#d4af37)!important;outline-offset:1px}


/* Extracted inline styles; source attributes: id="aethrionFinalToastStyles20261024" */
#notification.notification, .notification#notification {
    position: fixed !important;
    inset: max(12px, env(safe-area-inset-top, 0px)) auto auto 50% !important;
    bottom: auto !important;
    right: auto !important;
    width: min(540px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: min(42dvh, 300px) !important;
    overflow: auto !important;
    box-sizing: border-box !important;
    padding: 15px 48px 15px 18px !important;
    border: 1px solid rgba(220, 190, 112, .62) !important;
    border-left: 4px solid #dfc37b !important;
    border-radius: 16px !important;
    background: rgba(9, 17, 31, .985) !important;
    color: #f7f9fc !important;
    font: 600 clamp(14px, 2.6vw, 16px)/1.55 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
    box-shadow: 0 20px 70px rgba(0,0,0,.62), 0 0 0 1px rgba(255,255,255,.04) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    -webkit-backdrop-filter:  
<!-- AETHRION JARVIS: official AETHRION community links -->
<style id="aethrionJarvisOfficialLinksCSS">
#aethrionJarvisOfficialLinks{position:fixed;left:18px;bottom:18px;z-index:2147483000;width:min(310px,calc(100vw - 36px));padding:14px;border:1px solid rgba(212,175,55,.38);border-radius:16px;background:rgba(8,12,22,.95);color:#f5f7ff;box-shadow:0 16px 50px rgba(0,0,0,.4);backdrop-filter:blur(16px);font:500 13px/1.45 system-ui,sans-serif}
#aethrionJarvisOfficialLinks .aj-title{font-weight:800;letter-spacing:.08em;color:#d8bd79;margin:0 0 9px}
#aethrionJarvisOfficialLinks .aj-links{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#aethrionJarvisOfficialLinks a{display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px;border:1px solid rgba(212,175,55,.32);border-radius:9px;background:rgba(255,255,255,.045);color:#fff;text-decoration:none;text-align:center;font-weight:700}
#aethrionJarvisOfficialLinks a:hover{background:rgba(212,175,55,.15)}
#aethrionJarvisOfficialLinks .aj-note{margin:8px 0 0;color:#aeb8ca;font-size:11px}
@media(max-width:600px){#aethrionJarvisOfficialLinks{left:10px;bottom:10px;width:min(290px,calc(100vw - 20px));padding:10px}}


/* Extracted inline styles; source attributes: id="aethrionAuthForegroundRepair20261024" */
#authModal.modal-overlay,
  #socialAuthTermsModal.modal-overlay,
  #profileCompletionModal.modal-overlay,
  #resetPasswordModal.modal-overlay,
  #recoveryLoginModal.modal-overlay {
    position: fixed !important; inset: 0 !important; z-index: 2147483000 !important;
    isolation: isolate !important; align-items: center !important; justify-content: center !important;
    padding: max(16px, env(safe-area-inset-top, 0px)) 12px max(16px, env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important; overscroll-behavior: contain !important; box-sizing: border-box !important;
  }
  #authModal.modal-overlay.open, #socialAuthTermsModal.modal-overlay.open,
  #profileCompletionModal.modal-overlay.open, #resetPasswordModal.modal-overlay.open,
  #recoveryLoginModal.modal-overlay.open { display: flex !important; visibility: visible !important; opacity: 1 !important; }
  #authModal > .modal { position: relative !important; z-index: 1 !important; width: min(520px, 100%) !important;
    max-width: 100% !important; max-height: calc(100dvh - 32px) !important; overflow-y: auto !important;
    overscroll-behavior: contain !important; margin: auto !important; }
  #authModal .modal-body { min-width: 0 !important; }
  #authModal input, #authModal button, #socialAuthTermsModal input, #socialAuthTermsModal button { pointer-events: auto !important; }
  #aethrionAuthBusyOverlay { position: fixed !important; inset: 0 !important; z-index: 2147483646 !important;
    display: none; align-items: center !important; justify-content: center !important; padding: 24px !important;
    background: rgba(3,6,14,.84) !important; backdrop-filter: blur(14px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(135%) !important; color: #f8fafc !important;
    font: 600 15px/1.55 system-ui,sans-serif !important; }
  #aethrionAuthBusyOverlay[aria-hidden="false"] { display: flex !important; }
  #aethrionAuthBusyOverlay .aethrion-auth-busy-card { width: min(360px,100%) !important; padding: 26px 22px !important;
    border-radius: 22px !important; text-align: center !important; background: rgba(10,17,31,.98) !important;
    border: 1px solid rgba(223,195,123,.6) !important; box-shadow: 0 24px 80px rgba(0,0,0,.6) !important; }
  #aethrionAuthBusyOverlay .aethrion-auth-spinner { width: 42px !important; height: 42px !important;
    margin: 0 auto 18px !important; border: 3px solid rgba(255,255,255,.16) !important;
    border-top-color: #dfc37b !important; border-radius: 50% !important; animation: aethrionAuthSpin .8s linear infinite !important; }
  @keyframes aethrionAuthSpin { to { transform: rotate(360deg); } }
  @media (max-width:600px) { #authModal.modal-overlay { align-items: flex-start !important;
    padding-top: max(12px,env(safe-area-inset-top,0px)) !important; }
    #authModal > .modal { max-height: calc(100dvh - 24px) !important; border-radius: 18px !important; } }
  @media (prefers-reduced-motion:reduce) { #aethrionAuthBusyOverlay .aethrion-auth-spinner { animation: none !important; } }