:root{
  --ink:#e6e8ee; --ink-soft:#9aa4b2; --surface:#0b1220; --nav:rgba(11,18,32,0.75);
}
html:not(.dark){
  --ink:#0b1220;
  --ink-soft:#475569;
}
*{outline:0}
.font-inter{font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif}
.bg-surface{background:radial-gradient(1100px 600px at 10% -20%, #0f1c37 0%, #0b1220 45%), #0b1220;}
.bg-nav{background:var(--nav)}
.text-ink{color:var(--ink)}

.shadow-glow{box-shadow:0 8px 25px rgba(59,130,246,.25), inset 0 1px 0 rgba(255,255,255,.06)}
.text-grad{background:linear-gradient(90deg,#60a5fa,#a78bfa);-webkit-background-clip:text;background-clip:text;color:transparent}

.nav-btn{display:flex;align-items:center;gap:.5rem;padding:.55rem .8rem;border-radius:.75rem;color:#dbe0ea;background:#141a2a;border:1px solid #212a43}
.nav-btn:hover{background:#1b2236}
.nav-btn i{opacity:.85}
.icon-btn{width:40px;height:40px;border-radius:.75rem;display:grid;place-items:center;background:#141a2a;border:1px solid #212a43;color:#dbe0ea}
.icon-btn:hover{background:#1b2236}

.hero{position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-10%;background:radial-gradient(800px 500px at 80% 0%, rgba(59,130,246,.15), transparent 60%);pointer-events:none}
.hero-title{font-weight:800;color:#e9eef9;font-size:clamp(2rem,3.5vw,3.5rem);line-height:1.1}
.hero-sub{color:#c6cede;max-width:36rem}
.badge{display:inline-flex;gap:.5rem;align-items:center;background:rgba(59,130,246,.12);color:#9ec2ff;padding:.4rem .7rem;border:1px solid rgba(59,130,246,.25);border-radius:999px;font-size:.875rem}

.grid-img{border-radius:1rem;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 30px rgba(0,0,0,.35);object-fit:cover;width:100%;height:12rem}
.float-card{position:absolute;bottom:-12px;right:-12px;transform:translate(-8%,-8%);display:flex;gap:.6rem;align-items:center;background:#0f172a;border:1px solid #1f2a44;color:#cbd5e1;padding:.55rem .8rem;border-radius:.8rem;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.float-card i{color:#34d399}

.section{padding-block:4rem}
.section-head{text-align:center;margin-bottom:1.5rem}
.section-head h2{font-weight:800;color:#e5ecf7;font-size:clamp(1.5rem,2.2vw,2.25rem)}
.section-head p{color:#b9c2d4}

.card{border:1px solid #202a44;background:linear-gradient(180deg,#11182a, #0f172a);padding:1.1rem;border-radius:1rem;box-shadow:0 8px 28px rgba(0,0,0,.35);height:100%}
.card .card-icon{width:3.5rem;height:3.5rem;border-radius:1rem;display:grid;place-items:center;margin:0 auto 12px;color:#fff;font-size:1.25rem}
.card-blue .card-icon{background:linear-gradient(135deg,#60a5fa,#2563eb)}
.card-amber .card-icon{background:linear-gradient(135deg,#f59e0b,#ea580c)}
.card-green .card-icon{background:linear-gradient(135deg,#22c55e,#16a34a)}
.card-purple .card-icon{background:linear-gradient(135deg,#a78bfa,#7c3aed)}
.card h3{color:#e7ecf8;font-weight:700;text-align:center}
.card p{color:#b9c2d4;text-align:center}

.panel{border:1px solid #1f2a44;background:linear-gradient(180deg,#0f1629,#0d1424);border-radius:1rem;padding:1.1rem;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.panel-title{font-weight:700;color:#e7ecf8}
.panel-sub{border:1px solid #1e2740;background:linear-gradient(180deg,#0f1422,#0c1320);border-radius:.9rem;padding:1rem}
.panel-sub-title{font-weight:600;color:#dfe7f8}
.label{font-size:.8rem;color:#93a0b8}
.value{color:#e7ecf8}

.input{width:100%;padding:.8rem .9rem;border-radius:.8rem;background:#0b1220;border:1px solid #1e2740;color:#e7ecf8}
.input::placeholder{color:#71809b}
.hint{color:#93a0b8;font-size:.8rem;margin-top:.4rem}

.dropzone{border:2px dashed #2b3654;border-radius:.9rem;background:#0b1220;transition:border-color .2s, background .2s}
.dropzone:hover{border-color:#3b82f6;background:#0b1220}
.dropzone.drag-active{border-color:#60a5fa;background:rgba(96,165,250,.06)}

.btn-primary{display:flex;justify-content:center;align-items:center;gap:.5rem;border-radius:.8rem;background:linear-gradient(90deg,#2563eb,#1d4ed8);color:#fff;font-weight:600;padding:.85rem 1rem;box-shadow:0 10px 30px rgba(29,78,216,.3)}
.btn-primary:disabled{opacity:.6;cursor:not-allowed}
.btn-secondary{display:flex;justify-content:center;align-items:center;gap:.5rem;border-radius:.8rem;background:linear-gradient(90deg,#334155,#1f2937);color:#fff;font-weight:600;padding:.8rem 1rem;border:1px solid #3b455a}
.btn-ghost{display:flex;justify-content:center;align-items:center;gap:.5rem;border-radius:.8rem;background:#0b1220;color:#cfd6e6;font-weight:600;padding:.8rem 1rem;border:1px solid #1e2740}
.ghost{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1rem;border-radius:.8rem;border:1px solid #24304f;color:#cdd6ea}
.cta{display:inline-flex;align-items:center;justify-content:center;border-radius:.9rem;padding:1rem 1.2rem;background:linear-gradient(90deg,#2563eb,#1d4ed8);color:#fff;font-weight:700;box-shadow:0 10px 30px rgba(29,78,216,.35)}
.cta:hover{filter:brightness(1.05)}

.badge-soft{display:inline-flex;align-items:center;padding:.35rem .6rem;border-radius:999px;background:#0e1628;border:1px solid #203055;color:#bcd3ff;font-size:.82rem}
.sev-badge{padding:.15rem .45rem;border-radius:.5rem;background:#0e1628;border:1px solid #203055;color:#c7d2fe;font-size:.8rem}

.info-chip{display:flex;gap:.7rem;align-items:center;padding:.75rem;border-radius:.8rem;border:1px solid #1f2a44;background:#0b1220}

.note{margin-top:1.25rem;border:1px solid #1f2a44;background:#0b1220;color:#cbd5e1;padding:.9rem;border-radius:.8rem;display:flex;gap:.6rem;align-items:flex-start}
.note i{color:#60a5fa;margin-top:2px}

.footer{border-top:1px solid #1d2640;background:#0b1220;color:#cbd5e1;padding:2rem 0;margin-top:2rem}

.animate-in{animation:fadeIn .6s ease forwards;opacity:0}
@keyframes fadeIn{to{opacity:1;transform:none}}

/* ============ LIGHT THEME OVERRIDES ============ */
html:not(.dark) body { background:#f7f8fb; color:#0b1220; }

html:not(.dark) .bg-surface {
  background: radial-gradient(1100px 600px at 10% -20%, #f0f4ff 0%, #ffffff 45%), #ffffff;
}

html:not(.dark) header,
html:not(.dark) .footer {
  background: rgba(255,255,255,.92);
  border-color: rgba(0,0,0,.08);
  color:#0b1220;
}

html:not(.dark) .nav-btn { background:#ffffff; color:#0b1220; border:1px solid rgba(0,0,0,.08); }
html:not(.dark) .nav-btn:hover { background:#f3f6fb; }

html:not(.dark) .icon-btn { background:#ffffff; border:1px solid rgba(0,0,0,.08); color:#0b1220; }

html:not(.dark) .hero::before { background: radial-gradient(800px 500px at 80% 0%, rgba(59,130,246,.15), transparent 60%); }
html:not(.dark) .hero-title { color:#0b1220; }
html:not(.dark) .hero-sub { color:#394150; }
html:not(.dark) .badge { background:#e9f2ff; color:#1d4ed8; border-color:#c7ddff; }

html:not(.dark) .grid-img { box-shadow:0 12px 30px rgba(0,0,0,.1); border-color: rgba(0,0,0,.06); }
html:not(.dark) .float-card { background:#ffffff; border:1px solid rgba(0,0,0,.08); color:#1f2937; box-shadow:0 8px 24px rgba(0,0,0,.08); }

html:not(.dark) .section-head h2 { color:#0b1220; }
html:not(.dark) .section-head p { color:#475569; }

html:not(.dark) .card { background: linear-gradient(180deg, #ffffff, #f7f9ff); border:1px solid rgba(0,0,0,.06); box-shadow:0 8px 28px rgba(0,0,0,.08); }
html:not(.dark) .card h3 { color:#0b1220; }
html:not(.dark) .card p { color:#475569; }

html:not(.dark) .panel { background: #ffffff; border:1px solid rgba(0,0,0,.08); box-shadow:0 10px 30px rgba(0,0,0,.08); }
html:not(.dark) .panel-title { color:#0b1220; }
html:not(.dark) .panel-sub { background:#ffffff; border:1px solid rgba(0,0,0,.06); }
html:not(.dark) .panel-sub-title { color:#0b1220; }

html:not(.dark) .label { color:#64748b; }
html:not(.dark) .value { color:#111827; }

html:not(.dark) .input { background:#ffffff; color:#0b1220; border:1px solid rgba(0,0,0,.12); }
html:not(.dark) .input::placeholder { color:#9ca3af; }

html:not(.dark) .dropzone { background:#ffffff; border-color: rgba(0,0,0,.15); }
html:not(.dark) .dropzone:hover { background:#f8fbff; border-color:#93c5fd; }
html:not(.dark) .dropzone.drag-active { border-color:#60a5fa; background:#f0f6ff; }

html:not(.dark) .btn-primary { background: linear-gradient(90deg,#2563eb,#1d4ed8); color:#fff; box-shadow:0 10px 30px rgba(29,78,216,.2); border:none; }
html:not(.dark) .btn-secondary { background: linear-gradient(90deg, #f3f4f6, #e5e7eb); color:#111827; border:1px solid rgba(0,0,0,.08); }
html:not(.dark) .btn-ghost, html:not(.dark) .ghost { background:#ffffff; color:#111827; border:1px solid rgba(0,0,0,.12); }

html:not(.dark) .badge-soft { background:#eef2ff; border:1px solid #c7d2fe; color:#1e3a8a; }
html:not(.dark) .sev-badge { background:#eef2ff; border:1px solid #c7d2fe; color:#1e3a8a; }

html:not(.dark) .info-chip { background:#ffffff; border:1px solid rgba(0,0,0,.08); color:#0b1220; }
html:not(.dark) .note { background:#ffffff; border:1px solid rgba(0,0,0,.12); color:#374151; }

/* Upload alanı – ikon ve metinler */
html:not(.dark) #upload-content i { color:#9ca3af; }
html:not(.dark) #upload-content p { color:#0b1220; }
html:not(.dark) #upload-content p + p { color:#475569; }
html:not(.dark) #upload-content p + p + p { color:#64748b; }

/* Analiz placeholder */
html:not(.dark) #results-placeholder i { color:#cbd5e1; }
html:not(.dark) #results-placeholder h3 { color:#0b1220; }
html:not(.dark) #results-placeholder p { color:#475569; }

/* Navbar metinleri */
html:not(.dark) header .text-white\/90 { color:#0b1220 !important; }
html:not(.dark) header .text-white\/60,
html:not(.dark) header .text-white\/50 { color:#475569 !important; }

/* ===== Modern Toast Stack ===== */
#toast-stack{ position:fixed; z-index:60; top:1rem; right:1rem; display:flex; flex-direction:column; gap:.5rem; pointer-events:none; }
@media (max-width: 640px){ #toast-stack{ top:auto; right:.75rem; left:.75rem; bottom:.75rem; } }
.toast{ pointer-events:auto; display:flex; align-items:center; gap:.6rem; padding:.75rem .9rem; border-radius:.9rem; border:1px solid; backdrop-filter:saturate(140%) blur(6px); box-shadow:0 12px 30px rgba(0,0,0,.18); transition:transform .25s ease, opacity .25s ease; opacity:0; transform:translateY(-6px) scale(.98); }
.toast.show{ opacity:1; transform:none; }
.toast.exit{ opacity:0; transform:translateY(6px) scale(.98); }
.toast i{ font-size:1rem; }
.toast .msg{ line-height:1.35; }
.toast .close{ margin-left:auto; display:grid; place-items:center; width:28px; height:28px; border-radius:.5rem; border:1px solid currentColor; opacity:.7; }
.toast .close:hover{ opacity:1; }

/* Tema uyumlu varyantlar */
html.dark .toast--info    { background:rgba(30,41,59,.7);  color:#cbd5e1; border-color:#334155; }
html.dark .toast--success { background:rgba(6,78,59,.7);   color:#d1fae5; border-color:#0f766e; }
html.dark .toast--warning { background:rgba(120,53,15,.72); color:#fde68a; border-color:#b45309; }
html.dark .toast--error   { background:rgba(127,29,29,.75); color:#fecaca; border-color:#dc2626; }

html:not(.dark) .toast--info    { background:rgba(241,245,249,.85); color:#0f172a; border-color:#cbd5e1; }
html:not(.dark) .toast--success { background:rgba(236,253,245,.9);  color:#065f46; border-color:#86efac; }
html:not(.dark) .toast--warning { background:rgba(255,251,235,.95); color:#92400e; border-color:#fcd34d; }
html:not(.dark) .toast--error   { background:rgba(254,242,242,.95); color:#7f1d1d; border-color:#fca5a5; }

/* ===== Light tema düzeltmeleri ===== */
html:not(.dark) section.bg-white { background-color:#ffffff !important; }

html:not(.dark) .footer {
  background:#ffffff !important; color:#0b1220 !important; border-top:1px solid rgba(0,0,0,.12) !important;
}
html:not(.dark) .footer .footer-brand-sub { color:#475569 !important; }
html:not(.dark) .footer .footer-meta { color:#6b7280 !important; }

/* Başlık ve açıklama güçlendirme */
html:not(.dark) .section-head h2 { color:#0b1220 !important; }
html:not(.dark) .section-head p  { color:#475569 !important; }
html:not(.dark) section.bg-white .text-center h2 { color:#0b1220 !important; }
html:not(.dark) section.bg-white .text-center p  { color:#475569 !important; }

/* === Progress çemberleri === */
.ring-bg{ stroke:rgba(0,0,0,.10) }
html.dark .ring-bg{ stroke:rgba(255,255,255,.15) }
.ring-fg{ stroke-linecap:round; transition:stroke-dashoffset 1s ease }
.ring-fg--orange{ stroke:#f97316 } /* turuncu */
.ring-fg--green{  stroke:#22c55e } /* yeşil  */

/* Açık temada istatistik metinlerinin net görünmesi */
html:not(.dark) #hero-stats .stat-number   { color:#0b1220 !important; }
html:not(.dark) #hero-stats .stat-caption  { color:#475569 !important; }
html:not(.dark) #hero-stats .stat-label    { color:#334155 !important; }

/* === Açık tema: feature kart metinleri kesin koyu olsun === */
html:not(.dark) .feature-card h3 { color:#0b1220 !important; }
html:not(.dark) .feature-card p  { color:#475569 !important; }

html:not(.dark) .feature-card .text-gray-100,
html:not(.dark) .feature-card .dark\:text-gray-100 { color:#0b1220 !important; }
html:not(.dark) .feature-card .text-gray-300,
html:not(.dark) .feature-card .dark\:text-gray-300 { color:#475569 !important; }

/* ===== Light tema: "Dosya seçildi" yazıları görünür olsun ===== */
html:not(.dark) #file-selected { background:#ffffff; border-radius:.75rem; }
html:not(.dark) #file-selected #file-name { color:#0b1220 !important; }
html:not(.dark) #file-selected #file-size { color:#475569 !important; }
html:not(.dark) #file-selected i { color:#10b981 !important; }

/* === HERO GALLERY (crossfade + ken burns) === */
.hero-gallery{
  position:relative;
  width:100%;
  height:26rem; /* ~ 416px */
  border-radius:1rem;
  overflow:hidden;
}
@media (min-width: 640px){
  .hero-gallery{ height:28rem; }
}
.hero-gallery .gallery-item{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:0;
  transform:scale(1.03);
  transition:opacity 1.2s ease, transform 5s ease;
  will-change: opacity, transform;
  filter: saturate(1.05) contrast(1.04);
}
.hero-gallery .gallery-item.active{
  opacity:1;
  transform:scale(1.08); /* hafif Ken Burns */
  z-index:1;
}

/* ---- Hero slider (mobil/iOS uyumlu) ---- */
.gallery-image{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity 1000ms ease;
  will-change: opacity, transform;
  transform: translateZ(0);
  -webkit-transform: translateZ(0); /* iOS */
  backface-visibility: hidden;      /* iOS */
  contain: paint;                   /* iOS yeniden boyama ipucu */
}
.gallery-image.is-active{ opacity:1; }
@media (prefers-reduced-motion: reduce){
  .gallery-image{ transition:none; }
}


/* Mobil */
@media (max-width: 640px){
  #toast-stack .toast{ width:100%; }
}