/* =========================================================
   BUBBLE UI — modern redesign layer (overrides everything above)
   ========================================================= */
:root,[data-theme="light"]{
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Newsreader",Georgia,serif;
  --background:#e9f1fb; --background-secondary:#e9f1fb; --background-tertiary:#dfeaf8;
  --foreground:#0c1a3a; --muted:#5b6c8c;
  --surface:#ffffff; --surface-secondary:rgba(240,246,255,.9); --surface-tertiary:#e6eefa;
  --overlay:#ffffff; --default:rgba(80,120,200,.10); --default-foreground:#0c1a3a;
  --border:rgba(70,110,180,.16); --border-secondary:rgba(70,110,180,.24); --border-tertiary:rgba(70,110,180,.34);
  --separator:rgba(70,110,180,.12); --segment:#fff; --segment-foreground:#0c1a3a;
  --field-background:rgba(255,255,255,.7); --field-border:rgba(70,110,180,.18);
  --accent:#2563eb; --accent-foreground:#fff; --focus:#2563eb;
  --overlay-shadow:0 24px 70px rgba(30,60,140,.22),0 2px 10px rgba(30,60,140,.08);
  --glass:rgba(255,255,255,.58); --glass-strong:rgba(255,255,255,.93);
  --glass-brd:rgba(255,255,255,.85);
  --glass-sh:0 12px 44px rgba(37,74,150,.13),inset 0 1px 0 rgba(255,255,255,.95);
  --ink:#0c1a3a;
  /* bubble palette: core / mid / rim */
  --k0:#0b8f95; --k0m:#6fd3d6; --k0r:#d9f7a8;
  --k1:#2a9a4b; --k1m:#93dc7a; --k1r:#fff08a;
  --k2:#d4780f; --k2m:#ffc062; --k2r:#fff1b8;
  --k3:#cf2f86; --k3m:#f58cc4; --k3r:#ffd0a6;
  --k4:#0a86c8; --k4m:#7ccaf5; --k4r:#ecc0f7;
  --k5:#0b63d6; --k5m:#7aa8ff; --k5r:#d9b2ff;
  --k6:#6a34e0; --k6m:#d98cf2; --k6r:#ffd25e;
  --k7:#2a3f6d; --k7m:#93aad8; --k7r:#dfe9ff;
  --so0:1; --so1:.72; --so2:.55;
  --mesh:rgba(40,95,190,.17);
}
[data-theme="dark"]{
  --background:#060a18; --background-secondary:#060a18; --background-tertiary:#0b1124;
  --foreground:#e9eefc; --muted:#8c9bc0;
  --surface:#0f1630; --surface-secondary:rgba(22,32,66,.8); --surface-tertiary:#18224a;
  --overlay:#101835; --default:rgba(140,170,255,.10); --default-foreground:#e9eefc;
  --border:rgba(150,180,255,.14); --border-secondary:rgba(150,180,255,.22); --border-tertiary:rgba(150,180,255,.32);
  --separator:rgba(150,180,255,.10); --segment:#18224a; --segment-foreground:#fff;
  --field-background:rgba(20,30,62,.7); --field-border:rgba(150,180,255,.18);
  --accent:#7aa8ff; --accent-foreground:#07102a; --focus:#7aa8ff;
  --overlay-shadow:0 28px 80px rgba(0,0,0,.6),0 2px 10px rgba(0,0,0,.4);
  --glass:rgba(16,24,52,.55); --glass-strong:rgba(12,18,40,.94);
  --glass-brd:rgba(160,185,255,.16);
  --glass-sh:0 14px 50px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.06);
  --ink:#e9eefc;
  --k0:#2fe0d3; --k0m:#2aa7b8; --k0r:#b8f08a;
  --k1:#7de26f; --k1m:#3fae6a; --k1r:#ffe86b;
  --k2:#ffb04a; --k2m:#d9781a; --k2r:#ffe3a0;
  --k3:#ff6fb5; --k3m:#c93a8e; --k3r:#ffc08e;
  --k4:#4cc4ff; --k4m:#2a86d0; --k4r:#e6a8ff;
  --k5:#6ea0ff; --k5m:#3a6be0; --k5r:#c89bff;
  --k6:#b58cff; --k6m:#8a4ee0; --k6r:#ffd45e;
  --k7:#a9bde8; --k7m:#5a72b0; --k7r:#cfdcff;
  --so0:1; --so1:.74; --so2:.52;
  --mesh:rgba(150,180,255,.16);
}
html{background:var(--background)}
body{
  font-family:var(--sans);font-size:14px;letter-spacing:-.006em;color:var(--foreground);
  background:
    radial-gradient(1100px 760px at 12% 6%,rgba(255,255,255,.95),transparent 62%),
    radial-gradient(900px 700px at 96% 92%,rgba(222,205,255,.55),transparent 62%),
    radial-gradient(800px 600px at 80% 8%,rgba(190,225,255,.6),transparent 60%),
    var(--background);
}
[data-theme="dark"] body{
  background:
    radial-gradient(1000px 700px at 82% -4%,rgba(46,72,170,.38),transparent 62%),
    radial-gradient(900px 700px at -4% 104%,rgba(110,44,150,.30),transparent 62%),
    var(--background);
}
#amb{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}

/* ---------- floating glass chrome ---------- */
.topbar{position:absolute;top:14px;left:14px;right:14px;height:auto;min-height:0;padding:0;gap:10px;background:transparent;border:0;z-index:70;pointer-events:none;align-items:center}
.topbar>*{pointer-events:auto}
#ftog{width:46px;height:46px;border-radius:50%;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);color:var(--foreground)}
#ftog:hover{background:var(--glass-strong);border-color:var(--glass-brd)}
.brandbar{height:46px;padding:0 20px 0 9px;gap:11px;min-width:0;margin:0;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}
.brandbar__mark{width:30px;height:30px;border-radius:50%;flex:none;position:relative;box-shadow:0 4px 14px rgba(70,100,255,.35);
  background:radial-gradient(circle at 36% 38%,#fff 0 1.6px,transparent 2.2px),radial-gradient(circle at 50% 50%,#0b5fd8 0,#5f8bff 42%,#d9a8ff 78%,#ffd36e 100%)}
.brandbar__mark:before{content:"";position:absolute;left:auto;top:auto;right:-6px;bottom:-4px;width:17px;height:17px;border-radius:50%;opacity:.9;transform:none;
  background:radial-gradient(circle at 50% 50%,#fff 0 1px,transparent 1.6px),radial-gradient(circle,#7a2fe0 0,#e58bf0 62%,rgba(255,210,100,.95) 100%);mix-blend-mode:multiply}
.brandbar__mark:after{display:none}
.brandbar__text strong{font:420 18px/1 var(--serif);letter-spacing:-.012em}
.brandbar__text small{font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;margin-top:4px;color:var(--muted);font-weight:460}
.searchbox{max-width:380px;min-width:200px}
.search-field__group{height:46px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}
.search-field__group:hover:not(:focus-within){background:var(--glass-strong);border-color:var(--glass-brd)}
.search-field__group:focus-within{background:var(--glass-strong);border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 16%,transparent),var(--glass-sh)}
.search-field__input{background:transparent!important;font-size:13.5px!important}
#results{top:calc(100% + 10px);border-radius:24px;border:1px solid var(--glass-brd);background:var(--glass-strong);backdrop-filter:blur(26px) saturate(1.5);-webkit-backdrop-filter:blur(26px) saturate(1.5);box-shadow:var(--overlay-shadow);padding:8px}
#results button{border-radius:16px}
#results .dc{width:12px;height:12px;background:radial-gradient(circle at 50% 50%,var(--c),color-mix(in srgb,var(--c) 40%,#fff))}

.topbar .tabs{flex:none;margin-left:auto;justify-content:flex-end}
.topbar .tabs__list-container{background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);border-radius:999px;padding:4px}
.tabs__list{padding:0;gap:2px}
.tabs__tab{height:38px;padding:0 16px;border-radius:999px;font-size:13px;font-weight:470;color:var(--muted);transition:color .2s}
.tabs__tab:hover{color:var(--foreground)}
.tabs__tab[data-selected="true"]{color:#fff;font-weight:500}
.tabs__indicator{height:38px;top:0;bottom:auto;border-radius:999px;box-shadow:0 6px 20px rgba(86,92,255,.35);
  background:linear-gradient(120deg,#1f6bff 0%,#7a5cff 55%,#e46bd8 100%)}

/* ---------- stage: full-bleed canvas ---------- */
.app{position:absolute;inset:0;padding:0;gap:0;background:transparent;z-index:1;overflow:hidden}
#stage{position:absolute;inset:0;border:0;border-radius:0;background:transparent;box-shadow:none}
#v-list{padding:0 20px 100px;background:transparent}
#v-map{padding:84px 14px 14px;background:transparent}
#v-ident{padding-top:92px;background:transparent}
.cv{background:transparent}

/* tools */
.tools{top:auto;bottom:18px;left:18px;right:auto;flex-direction:row;align-items:center;gap:2px;padding:5px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6)}
.tzoom{flex-direction:row;align-items:center;gap:2px;padding-left:4px;margin-left:2px;border-left:1px solid var(--separator)}
.tools .button{border-radius:50%;width:36px;height:36px;color:var(--foreground);--button-bg:transparent;--button-bg-hover:var(--default);box-shadow:none!important}
.tools .button:hover{background:var(--default)}

/* legend */
.legend{position:absolute;left:18px;bottom:78px;z-index:11;padding:14px 16px 12px;border-radius:22px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);display:flex;flex-direction:column;gap:7px;pointer-events:none}
.legend .lg-t{font-size:9.5px;font-weight:540;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}
.legend .lg-i{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:440}
.legend .lg-i i{width:13px;height:13px;border-radius:50%;flex:none;background:radial-gradient(circle at 50% 50%,var(--c) 0,color-mix(in srgb,var(--c) 45%,#fff) 70%,color-mix(in srgb,var(--c) 15%,#fff) 100%)}
.legend{display:none}
#stage:has(#v-radial.active,#v-force.active) .legend{display:flex}
@media (max-height:720px),(max-width:1100px){#stage:has(#v-radial.active,#v-force.active) .legend{display:none}}

/* tooltip */
#tip{position:fixed;left:0;top:0;z-index:200;pointer-events:none;padding:9px 13px 10px;border-radius:16px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:var(--overlay-shadow);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);opacity:0;transition:opacity .12s;display:flex;flex-direction:column;gap:1px;max-width:260px}
#tip.on{opacity:1}
#tip b{font-size:13px;font-weight:520}
#tip i{font:italic 340 13px var(--serif);color:var(--muted)}
#tip span{font-size:10.5px;color:var(--muted);margin-top:3px;font-weight:470;letter-spacing:.02em}

/* ---------- drawer (menu) ---------- */
.side{padding:74px 0 14px 14px}
.side .drawer__dialog{border-radius:30px;background:var(--glass-strong);border:1px solid var(--glass-brd);backdrop-filter:blur(30px) saturate(1.6);-webkit-backdrop-filter:blur(30px) saturate(1.6);box-shadow:var(--overlay-shadow)}
.drawer__heading{font:420 20px/1.1 var(--serif);letter-spacing:-.01em}
.drawer__header p{font-size:11.5px}
.msec>h3{font-size:10px;letter-spacing:.09em}
.ksum{border:0;gap:8px;grid-template-columns:repeat(4,minmax(0,1fr))}
.ksum .card{border:1px solid var(--border);border-radius:18px;background:var(--surface-secondary)!important;padding:11px 8px}
.ksum .card:last-child{border-right:1px solid var(--border)}
.ksum b{font-size:19px;font-weight:500;background:linear-gradient(120deg,var(--k5),var(--k6));-webkit-background-clip:text;background-clip:text;color:transparent}
.ksum .hit b{background:linear-gradient(120deg,var(--k3),var(--k2));-webkit-background-clip:text;background-clip:text;color:transparent}
.gb .gl::before{width:11px;height:11px;background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 40%,#fff))}
.gb .gbar{height:5px}
.gb .gbar i{background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 55%,#fff))}
.fi,.sw{border-radius:14px}
.fi:hover,.sw:hover{background:var(--default)}
.side .checkbox[data-selected="true"] .checkbox__control{background:var(--accent)}
.button{border-radius:999px;font-weight:480}
.button--secondary{--button-bg:var(--default);--button-bg-hover:color-mix(in srgb,var(--default) 70%,var(--accent) 12%)}
.button--primary{--button-bg:linear-gradient(120deg,#1f6bff,#7a5cff);background:linear-gradient(120deg,#1f6bff,#7a5cff);--button-fg:#fff;color:#fff}
.chip{border-radius:999px;padding:1px 9px}
.close-button{border-radius:50%}

/* ---------- graphic: bubbles + mesh ---------- */
.mesh{fill:none;stroke:var(--mesh);stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}
.lk{fill:none;stroke:var(--c);stroke-opacity:.34;stroke-width:1;stroke-linecap:round}
.lk.hl{stroke-opacity:.95;stroke-width:2.2}
.lk.dim,.nd.dim{opacity:.12}
.nd{cursor:pointer}
.nd .bub{transform-box:fill-box;transform-origin:center;transition:transform .22s cubic-bezier(.32,.72,0,1),filter .2s}
.nd .bub:not(.sp){mix-blend-mode:multiply}
[data-theme="dark"] .nd .bub:not(.sp){mix-blend-mode:screen}
.nd:hover .bub{transform:scale(1.08);filter:saturate(1.2) brightness(1.04)}
.nd .bub.sp{fill:var(--c);fill-opacity:.92;stroke:#fff;stroke-opacity:.9;stroke-width:1}
[data-theme="dark"] .nd .bub.sp{stroke:rgba(255,255,255,.25)}
.nd .ring{fill:none;stroke:var(--c);stroke-opacity:.55;stroke-width:1.3}
.nd .pin{fill:#fff;fill-opacity:.95;pointer-events:none}
.nd .halo{fill:none;stroke:var(--c);stroke-width:1.6;stroke-opacity:.95;stroke-dasharray:none}
.nd.sel .bub:not(.sp){filter:drop-shadow(0 0 10px var(--c))}
.nd:not(.col):not(.sp) .dot,.nd .dot{display:none}
.nd text{font:470 11.5px var(--sans);fill:var(--ink);paint-order:stroke;stroke:color-mix(in srgb,var(--background) 80%,transparent);stroke-width:3.5px;stroke-linejoin:round;letter-spacing:-.005em}
.nd.sp text{font-weight:360;font-size:10.5px}
.nd.sel text{font-weight:580}
.nd text.cnt{fill:#fff;stroke:none;font-weight:540;letter-spacing:-.02em;text-anchor:middle;dominant-baseline:central;transform:none;text-shadow:none}
.nd .bd{fill:var(--muted);font-weight:500;font-size:10.5px}
.era{fill:rgba(90,130,220,.04);opacity:1}.era.e1{fill:rgba(170,110,240,.035);opacity:1}
.etxt{font:540 10.5px var(--sans);letter-spacing:.12em;fill:var(--muted)}
.tick{stroke:var(--border-secondary)}
.ttxt{fill:var(--muted)}

/* ---------- detail panel ---------- */
.detail{background:var(--glass-strong);border:1px solid var(--glass-brd);border-radius:30px;backdrop-filter:blur(30px) saturate(1.6);-webkit-backdrop-filter:blur(30px) saturate(1.6);box-shadow:var(--overlay-shadow)}
@media (min-width:821px){
  .detail{position:absolute;top:74px;right:14px;bottom:14px;width:376px;z-index:30}
  .detail.shown{display:block}
}
.dh{padding:22px 22px 12px}
.nm strong{font:420 24px/1.1 var(--serif);letter-spacing:-.015em}
.nm em{font:italic 340 16px var(--serif)}
.db{padding:2px 22px 26px}
.db h3,.lineage-head h3{font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:540}
.note{font-size:14px;line-height:1.6}
.kids .button{border-left:0;border-radius:999px;height:32px;background:var(--default);position:relative;padding-left:26px}
.kids .button:before{content:"";position:absolute;left:10px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 40%,#fff))}
.plant-media{border-radius:24px;border-color:var(--border)}
.wiki-info,.bot-card,.cmp{border-radius:22px}

/* ---------- list / map / ident ---------- */
.lsticky{top:0;padding:88px 56px 18px 0;margin:0 -20px 4px;padding-left:20px;background:linear-gradient(color-mix(in srgb,var(--background) 94%,transparent) 62%,transparent)}
.row{border-radius:16px}
.row .dot{width:11px;height:11px;background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 40%,#fff))}
.row.sp .dot{width:7px;height:7px;margin:0 2px}
.row.sel{background:color-mix(in srgb,var(--c) 14%,transparent)}
.tl ul{border-left:1px solid color-mix(in srgb,var(--c) 30%,transparent)}
.mt{border-radius:22px;background:radial-gradient(120% 120% at 18% 12%,color-mix(in srgb,var(--c) 26%,var(--surface)),color-mix(in srgb,var(--c) 7%,var(--surface)) 70%);border:1px solid color-mix(in srgb,var(--c) 26%,transparent);backdrop-filter:blur(8px)}
.mt.l2{border-radius:18px;background:radial-gradient(130% 130% at 20% 10%,color-mix(in srgb,var(--c) 42%,var(--surface)),color-mix(in srgb,var(--c) 14%,var(--surface)) 75%)}
.ident__question-card,.ident__results-card{border-radius:30px;background:var(--glass-strong);border:1px solid var(--glass-brd);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:var(--glass-sh)}
.ident .radio{border-radius:20px}
.ident__intro h2{font:420 clamp(1.5rem,2.4vw,2.1rem)/1.1 var(--serif);letter-spacing:-.02em}
.ident .progress-bar__fill,.ident__score-fill{background:linear-gradient(90deg,#1f6bff,#a45cff,#ff8ad0)}

/* ---------- mobile ---------- */
@media (max-width:820px){
  .topbar{top:8px;left:8px;right:8px;flex-wrap:wrap;gap:8px;padding:0}
  #ftog{width:42px;height:42px}
  .brandbar{display:none}
  .searchbox{flex:1;max-width:none}
  .search-field__group{height:42px}
  .topbar .tabs{order:3;width:100%;margin-left:0}
  .topbar .tabs__list-container{width:100%}
  .tabs__tab{height:34px;padding:0 4px;flex:1;font-size:12px;min-width:0}
  .tabs__indicator{height:34px}
  #v-list{padding:0 10px 100px}
  #v-map{padding:112px 8px 8px}
  #v-ident{padding-top:112px}
  .lsticky{top:0;padding-top:116px;margin:0 -10px 4px;padding-left:10px}
  .tools{bottom:auto;top:auto;left:auto;right:10px;bottom:84px;flex-direction:column;border-radius:26px}
  .tzoom{flex-direction:column;border-left:0;padding-left:0;margin-left:0}
  .side{padding:60px 0 8px 8px}
  .detail,.detail.shown{border-radius:26px}
}
@media (prefers-reduced-motion:reduce){.nd .bub{transition:none}}

#stage:has(#v-map.active,#v-ident.active) .tools{display:none}

/* =========================================================
   SADELEŞTİRME — calmer UI / better UX
   ========================================================= */
:root,[data-theme="light"]{--glass-sh:0 6px 24px rgba(37,74,150,.09),inset 0 1px 0 rgba(255,255,255,.9)}
[data-theme="dark"]{--glass-sh:0 8px 30px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.05)}

/* üst bar: Filtreler (etiketli) · marka · arama · sekmeler */
#ftog{width:auto;padding:0 18px 0 14px;gap:9px;display:inline-flex;align-items:center}
#ftog::after{content:"Filtreler";font-size:13px;font-weight:480;letter-spacing:-.005em}
.badge-anchor .badge{top:-3px;right:-3px}
.brandbar{background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0 6px 0 2px}
.brandbar__text small{display:none}
.brandbar__text strong{font-size:19px}
.searchbox{max-width:340px}
.search-field__input{font-size:13.5px!important}

/* sekmeler: sakin, tek renk */
.topbar .tabs__list-container{padding:3px}
.tabs__tab{height:36px;padding:0 15px;font-weight:460}
.tabs__tab[data-selected="true"]{color:var(--background);font-weight:500}
.tabs__indicator{height:36px;background:var(--foreground);box-shadow:0 3px 10px rgba(12,26,58,.22)}
[data-theme="dark"] .tabs__indicator{box-shadow:0 3px 10px rgba(0,0,0,.5)}

/* gösterge kaldırıldı (renkler menüde var), yerine kısa ipucu */

#hint{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);z-index:11;display:none;padding:10px 18px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-size:12.5px;font-weight:440;color:var(--muted);white-space:nowrap;pointer-events:none;transition:opacity .5s}
#stage:has(#v-radial.active,#v-force.active,#v-tree.active,#v-time.active) #hint{display:block}
#hint.off{opacity:0}

/* menü: özet tek satır */
.ksum{display:flex;gap:0;border:0;margin:2px 0 0}
.ksum .card{flex:1;border:0!important;border-radius:0;background:transparent!important;padding:4px 0;text-align:left;border-left:1px solid var(--separator)!important;padding-left:12px}
.ksum .card:first-child{border-left:0!important;padding-left:0}
.ksum b{font-size:22px;font-weight:500;letter-spacing:-.03em;background:none;color:var(--foreground);-webkit-background-clip:initial;background-clip:initial}
.ksum .hit b{color:var(--accent);background:none}
.ksum .hit:has(#k-hit-s:empty){display:none}
.ksum .card__description{font-size:10.5px;margin-top:2px}

/* filtre grupları: katlanır */
#filters h4{margin:14px 6px 6px}
details.fgrp{border-bottom:1px solid var(--separator)}
details.fgrp>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:11px 6px;font-size:13px;font-weight:500;border-radius:12px;user-select:none}
details.fgrp>summary::-webkit-details-marker{display:none}
details.fgrp>summary::after{content:"";margin-left:auto;width:7px;height:7px;border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s}
details.fgrp[open]>summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
details.fgrp>summary:hover{background:var(--default)}
details.fgrp .fcnt{margin-left:2px;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:var(--accent-foreground);font-size:11px;display:inline-grid;place-items:center}
details.fgrp[open]{padding-bottom:6px}

/* detay paneli: soy hattı tek satır, daha az gürültü */
.lin{display:flex;flex-wrap:wrap;gap:6px 2px;align-items:center}
.lin li{display:flex;align-items:center;padding:0!important}
.lin li small{display:none}
.lin li+li::before{content:"›";color:var(--muted);margin:0 3px 0 1px}
.lin button{padding:3px 10px;min-height:0;border-radius:999px;background:var(--default);text-decoration:none;font-size:12px;font-weight:460}
.lin button:hover{background:color-mix(in srgb,var(--default) 60%,var(--accent) 16%)}
.lineage-head{display:flex;align-items:center;justify-content:space-between}
.db h3,.lineage-head h3{margin-top:22px}
.acts{position:sticky;bottom:0;margin:20px -22px -26px;padding:14px 22px 18px;background:linear-gradient(transparent,var(--glass-strong) 38%)}

@media (max-width:820px){
  #ftog{padding:0 14px 0 12px}
  #ftog::after{content:"Filtre"}
  #hint{bottom:96px;font-size:12px;padding:9px 14px}
}
.side .drawer__dialog{background:color-mix(in srgb,var(--surface) 97%,transparent)}

/* ---------- sade yazılar ---------- */
.nd text{font-weight:420;font-size:11px;letter-spacing:0;stroke-width:3px}
.nd.d1 text,.nd.d2 text{font-weight:500}
.nd.sp text{font-weight:340;font-size:10.5px;fill:var(--muted)}
.nd.sel text{fill:var(--ink);font-weight:540}
.nd text:not(.cnt){transition:opacity .18s}
.nd.nolb text:not(.cnt){opacity:0}
.nd.nolb:hover text:not(.cnt){opacity:1}
.drawer__header p{display:none}
.drawer__header{padding-bottom:10px}
.side .msec:first-of-type>h3{display:none}
.note{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer;font-size:13.5px;line-height:1.55;color:color-mix(in srgb,var(--foreground) 88%,var(--muted))}
.note.open{display:block}

/* =========================================================
   DETAY PANELİ — yeniden tasarım + fotoğraf zoom
   ========================================================= */
.detail{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--foreground) 18%,transparent) transparent}
.detail::-webkit-scrollbar{width:9px}
.detail::-webkit-scrollbar-track{background:transparent;margin:22px 0}
.detail::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--foreground) 16%,transparent);border-radius:99px;border:2.5px solid transparent;background-clip:padding-box}
.dh{border-bottom:0!important;padding:22px 22px 10px;align-items:center}
.dh .chip{display:none}
.nm strong{font-size:26px}
.db{padding:0 22px 28px}
.db>.meta{margin:0 0 4px;font-size:12.5px}

/* fotoğraf modülü: kutu içinde kutu yok, büyük görsel */
.plant-media{border:0!important;background:transparent!important;border-radius:0;margin:8px 0 20px;overflow:visible}
.plant-media .plant-media__organs{gap:18px;padding:0;margin:0 0 14px;border-bottom:1px solid var(--separator);overflow-x:auto}
.plant-media .plant-media__organ{border:0;background:transparent;border-radius:0;padding:0 1px 10px;margin-bottom:-1px;font-size:12.5px;font-weight:470;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}
.plant-media .plant-media__organ:hover{background:transparent;color:var(--foreground)}
.plant-media .plant-media__organ.is-active{background:transparent;color:var(--foreground);font-weight:520;border-bottom-color:var(--foreground)}
.plant-media__organ-empty{padding:34px 18px;text-align:center;font-size:12.5px;color:var(--muted);border-radius:24px;background:var(--default)}
.plant-media .plant-media__hero{height:auto;aspect-ratio:4/3;border-radius:24px;background:var(--default);cursor:zoom-in;position:relative;overflow:hidden;display:block}
.plant-media .plant-media__hero img{width:100%;height:100%;object-fit:cover;background:none;transform-origin:50% 50%;transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform;user-select:none;-webkit-user-drag:none}
.plant-media .plant-media__hero.zoomed img{transform:scale(2.6);transition:transform .14s ease-out}
.plant-media__badge{display:none!important}
.plant-media__hero::after{content:"";position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:var(--glass-strong) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='11' cy='11' r='7'/><path d='M21 21l-4.3-4.3M11 8v6M8 11h6'/></svg>") center/16px no-repeat;box-shadow:var(--glass-sh);pointer-events:none;transition:opacity .2s}
[data-theme="dark"] .plant-media__hero::after{filter:invert(1) hue-rotate(180deg)}
.plant-media__hero.zoomed::after{opacity:0}
.plant-media .plant-media__strip{padding:12px 0 0;gap:8px}
.plant-media .plant-media__thumb{width:62px;height:50px;border-radius:14px;opacity:.6;border:2px solid transparent}
.plant-media .plant-media__thumb.is-active{opacity:1;border-color:var(--foreground)}
.plant-media .plant-media__meta{padding:10px 2px 0}
.plant-media__credit{font-size:11px}
.plant-media__loading{min-height:230px;border-radius:24px;background:var(--default)}

/* Wikipedia bilgisi: kutusuz, okunur metin */
.wiki-info{border:0!important;background:transparent!important;border-radius:0;margin:4px 0 0}
.wiki-info__head{padding:0 0 8px!important}
.wiki-info__body{padding:0!important}
.wiki-info__mark{display:none}
.wiki-info__body p{font-size:13.5px;line-height:1.65;color:color-mix(in srgb,var(--foreground) 84%,var(--muted))}
.wiki-info__empty,.wiki-info__loading{padding:0!important;font-size:12px}

/* kartlar daha hafif */
.bot-card,.compare-pro{border:1px solid var(--separator)!important;background:transparent!important;border-radius:22px}
.similar-item{background:var(--default)!important;border-radius:18px!important}
.dist-map{border-radius:18px!important}

/* ---------- lightbox ---------- */
#lb{position:fixed;inset:0;z-index:300;display:none;background:rgba(6,10,26,.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);align-items:center;justify-content:center}
#lb.on{display:flex;animation:lbin .22s ease}
@keyframes lbin{from{opacity:0}to{opacity:1}}
#lb .lb-stage{position:relative;width:min(94vw,1240px);height:min(82vh,900px);overflow:hidden;border-radius:26px;display:grid;place-items:center;cursor:zoom-in}
#lb .lb-stage.zoomed{cursor:zoom-out}
#lb .lb-stage img{max-width:100%;max-height:100%;object-fit:contain;transform-origin:50% 50%;transition:transform .3s cubic-bezier(.2,.7,.2,1);user-select:none;-webkit-user-drag:none}
#lb .lb-stage.zoomed img{transform:scale(2.5);transition:transform .14s ease-out}
#lb button{position:absolute;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:22px;line-height:1;display:grid;place-items:center;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .15s}
#lb button:hover{background:rgba(255,255,255,.26)}
#lb .lb-x{top:20px;right:20px}
#lb .lb-p{left:20px;top:50%;margin-top:-23px}
#lb .lb-n{right:20px;top:50%;margin-top:-23px}
#lb.single .lb-p,#lb.single .lb-n{display:none}
#lb .lb-cap{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:12.5px;font-weight:440;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap}
@media (max-width:820px){#lb .lb-stage{width:100vw;height:76vh;border-radius:0}#lb .lb-p{left:8px}#lb .lb-n{right:8px}}
#lb .lb-stage img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}
.plant-media .plant-media__organs{gap:13px}
.plant-media .plant-media__organ{font-size:12px}
#lb .lb-stage{display:block}
#lb .lb-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}

/* ---------- fotoğraf: sol alanda dev önizleme + lens ---------- */
.plant-media .plant-media__hero{cursor:crosshair}
.plant-media .plant-media__hero.zin img{transform:none}
.plant-media__hero.zin::after{opacity:0}
.zlens{display:none;position:absolute;pointer-events:none;border:2px solid #fff;border-radius:8px;box-shadow:0 0 0 999px rgba(8,14,30,.36),0 4px 18px rgba(0,0,0,.3)}
#zpane{position:fixed;left:14px;top:14px;bottom:14px;right:420px;z-index:95;display:none;overflow:hidden;border-radius:30px;background:#0b1226;box-shadow:0 30px 90px rgba(10,20,50,.5),inset 0 0 0 1px rgba(255,255,255,.35);pointer-events:none}
#zpane.on{display:block;animation:lbin .16s ease}
#zpane img{position:absolute;max-width:none;user-select:none;-webkit-user-drag:none}
#zpane .zz{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);padding:9px 18px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);color:#fff;font-size:12.5px;font-weight:440;white-space:nowrap;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#zpane .zz{background:rgba(10,16,34,.66);border-color:rgba(255,255,255,.2)}

/* ---------- cila ---------- */
#zpane{top:84px}
.dh{position:sticky;top:0;z-index:6;background:var(--glass-strong);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-radius:30px 30px 0 0;transition:box-shadow .2s}
.detail.scrolled .dh{box-shadow:0 1px 0 var(--separator)}
@media (max-width:820px){.dh{position:static;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}}
.acts{background:linear-gradient(to bottom,transparent,var(--surface) 42%);padding-top:30px}
[data-theme="dark"] .acts{background:linear-gradient(to bottom,transparent,var(--overlay) 42%)}
.similar-list{display:flex;flex-direction:column;gap:8px}
.similar-item{padding:10px 12px!important}
.similar-item__actions button[data-go]{display:none}
.similar-item__why{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bot-card__head p{display:none}
.bot-card{padding:16px}
@media (max-width:820px){
  .topbar::before{content:"";position:absolute;left:-8px;right:-8px;top:-8px;bottom:-14px;background:linear-gradient(var(--background) 70%,transparent);z-index:-1;pointer-events:none}
}
@media (max-width:820px){
  .acts{position:static;margin:20px 0 0;padding:0;background:none!important}
}

/* =========================================================
   SADE ZEMİN — FigJam tarzı noktalı ızgara
   ========================================================= */
:root,[data-theme="light"]{--background:#f5f7fb;--background-secondary:#f5f7fb;--dot:rgba(52,72,120,.26);--mesh:rgba(40,95,190,.10)}
[data-theme="dark"]{--background:#0a0e1c;--background-secondary:#0a0e1c;--dot:rgba(160,180,255,.20);--mesh:rgba(150,180,255,.10)}
html,body{background:var(--background)!important}
#amb{display:none!important}
#stage{
  background-image:radial-gradient(circle at 50% 50%,var(--dot) 1.25px,transparent 1.75px);
  background-size:var(--gs,26px) var(--gs,26px);
  background-position:var(--gx,0px) var(--gy,0px);
}
/* zemin sade olunca cam efekti daha ince */
:root,[data-theme="light"]{--glass:rgba(255,255,255,.78);--glass-sh:0 4px 20px rgba(30,50,110,.08),0 0 0 1px rgba(30,50,110,.04)}
[data-theme="dark"]{--glass:rgba(18,26,54,.72);--glass-sh:0 6px 26px rgba(0,0,0,.4),0 0 0 1px rgba(160,185,255,.08)}

/* logo */
.brandbar__mark{background:none!important;box-shadow:none!important;width:32px;height:32px;border-radius:10px;flex:none;display:block;filter:drop-shadow(0 4px 10px rgba(30,130,210,.28))}
.brandbar__mark::before,.brandbar__mark::after{display:none!important}

/* arama kısayolu */
#sf[data-empty="true"] .search-field__group:not(:focus-within)::after{content:"/";margin-right:14px;width:22px;height:22px;display:grid;place-items:center;border-radius:7px;border:1px solid var(--border-secondary);font-size:12px;font-weight:500;color:var(--muted);flex:none}

/* rastgele bitki düğmesi */
#rndbtn{color:var(--foreground)}
#rndbtn:hover{color:var(--accent)}
.tools #rndbtn{margin-right:2px}
[data-theme="dark"] .nd .bub:not(.sp){filter:drop-shadow(0 0 12px color-mix(in srgb,var(--c) 50%,transparent)) saturate(1.25)}
[data-theme="dark"] .nd.sel .bub:not(.sp){filter:drop-shadow(0 0 18px var(--c)) saturate(1.3)}


/* nokta katmanları (yakınlaştırmayla uyumlu) */
#stage{background-image:none!important}
.dotlayer{position:absolute;inset:0;pointer-events:none;background-repeat:repeat;will-change:background-position,opacity}

/* sesli okuma */
.dh{flex-wrap:nowrap;gap:10px}
.tts{display:inline-flex;align-items:center;gap:6px;flex:none}
.tts-btn{height:36px;padding:0 15px 0 12px;border-radius:999px;background:var(--default);display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--foreground);transition:background .18s,color .18s}
.tts-btn:hover{background:color-mix(in srgb,var(--default) 50%,var(--accent) 20%)}
.tts.speaking .tts-btn{background:var(--foreground);color:var(--background)}
.tts-rate{height:28px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:540;color:var(--muted);border:1px solid var(--border-secondary);background:transparent}
.tts-rate:hover{color:var(--foreground)}
.tts:not(.speaking) .tts-rate{display:none}
.wave{display:inline-flex;align-items:center;gap:2.5px;height:16px}
.wave b{display:block;width:3px;height:6px;border-radius:2px;background:currentColor;animation:wv .9s ease-in-out infinite}
.wave b:nth-child(2){animation-delay:.15s}.wave b:nth-child(3){animation-delay:.3s}.wave b:nth-child(4){animation-delay:.45s}
@keyframes wv{0%,100%{height:5px}50%{height:15px}}
@media (prefers-reduced-motion:reduce){.wave b{animation:none;height:10px}}
@media (max-width:820px){.dh{gap:8px}.tts-btn span{display:none}.tts-btn{padding:0;width:36px;justify-content:center}.tts.speaking .tts-btn span{display:none}}
@media (hover:none),(max-width:820px){#sf[data-empty="true"] .search-field__group::after{display:none!important}}


/* ---- nokta zemini (canvas) ---- */
:root,[data-theme="light"]{--dotrgb:52,72,120;--dota:.28;--mesh:rgba(40,95,190,.06)}
[data-theme="dark"]{--dotrgb:165,185,255;--dota:.20;--mesh:rgba(150,180,255,.07)}
.dotlayer{display:none!important}
.dotcv{position:absolute;left:0;top:0;pointer-events:none}

/* ---- Wikipedia kartı: kısa / tam ---- */
.wiki-info.is-short .wiki-info__body>p:not(:first-of-type){display:none}
.wiki-info.is-short .wiki-info__body>p:first-of-type{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.wiki-info.has-full:not(.is-short) .wiki-info__body>p{display:none}
.wiki-info.is-short .wiki-full{display:none}
.wiki-more{margin:10px 0 2px}
.wiki-more__btn{height:34px;padding:0 16px;border-radius:999px;background:var(--default);font-size:12.5px;font-weight:520;color:var(--foreground);transition:background .15s}
.wiki-more__btn:hover{background:color-mix(in srgb,var(--default) 50%,var(--accent) 20%)}
.wiki-info.loading-more .wiki-more__btn{opacity:.6;pointer-events:none}
.wiki-full h4{margin:20px 0 6px;font-size:14.5px;font-weight:540;letter-spacing:-.01em;color:var(--foreground)}
.wiki-full h4.l3,.wiki-full h4.l4,.wiki-full h4.l5{font-size:13px;color:var(--muted)}
.wiki-full p{margin:0 -8px 4px!important;padding:5px 8px;border-radius:10px;transition:background .3s}
.wiki-full p.reading{background:color-mix(in srgb,var(--accent) 13%,transparent)}

/* ---- okuma ilerleme çubuğu ---- */
.dh{position:sticky}
.tts-prog{position:absolute;left:22px;right:22px;bottom:2px;height:3px;border-radius:3px;background:transparent;overflow:hidden;opacity:0;transition:opacity .2s}
.dh.tts-on .tts-prog{opacity:1;background:var(--default)}
.tts-prog i{display:block;height:100%;width:var(--tp,0%);border-radius:3px;background:linear-gradient(90deg,#1fcfa3,#2a6cff);transition:width .5s linear}
@media (max-width:820px){.dh{position:relative}.tts-prog{left:16px;right:16px}}

/* ---- ses ayarları ---- */
.tts-voice{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:var(--muted);flex:none}
.tts-voice:hover{background:var(--default);color:var(--foreground)}
.tts-pop{position:absolute;right:14px;top:calc(100% - 6px);width:min(318px,calc(100% - 28px));z-index:30;padding:14px 14px 12px;border-radius:22px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:var(--overlay-shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.tts-pop[hidden]{display:none}
.tts-pop h5{margin:2px 4px 8px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:540}
.tts-pop h5:not(:first-child){margin-top:14px}
.tts-vl{display:flex;flex-direction:column;gap:3px}
.tts-v{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:14px;text-align:left;font-size:13px;font-weight:470}
.tts-v:hover{background:var(--default)}
.tts-v.on{background:color-mix(in srgb,var(--accent) 14%,transparent);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--accent) 55%,transparent)}
.tts-v em{font-style:normal;font-size:11px;color:var(--muted);font-weight:500}
.tts-seg{display:flex;gap:4px;padding:3px;border-radius:999px;background:var(--default)}
.tts-s{flex:1;height:30px;border-radius:999px;font-size:12px;font-weight:500;color:var(--muted)}
.tts-s.on{background:var(--foreground);color:var(--background)}
.tts-note{margin:10px 4px 0;font-size:11.5px;line-height:1.5;color:var(--muted)}
.tts-test{margin-top:12px;width:100%;height:36px;border-radius:999px;background:var(--default);font-size:12.5px;font-weight:520}
.tts-test:hover{background:color-mix(in srgb,var(--default) 50%,var(--accent) 20%)}

/* =========================================================
   YOĞUN GÖRÜNÜM (Tümünü aç) — hafif çizim
   ========================================================= */
.cv.dense .nd .bub{mix-blend-mode:normal!important;filter:none!important;transition:none!important}
.cv.dense .nd:hover .bub{transform:none}
.cv.dense .nd.sel .bub{filter:none!important}
.cv.dense .nd .pin{display:none}
.cv.dense .nd .bub.sp{stroke:none;fill-opacity:.95}
.cv.dense .nd.nolb text{display:none}
.cv.dense .nd text{transition:none}
.cv.dense .lk{stroke-opacity:.2;stroke-width:.8}
.cv.dense .lk.hl{stroke-opacity:.95;stroke-width:2}
.cv.dense .mesh{display:none}
.cv.dense .nd .ring{stroke-opacity:.35}

/* araç çubuğu: yazılı düğmeler */
.tools #allbtn.button,.tools #rndbtn.button{width:auto;min-width:36px;padding:0 14px 0 11px;gap:7px;border-radius:999px}
.tools .tl{font-size:12.5px;font-weight:520;letter-spacing:-.005em;white-space:nowrap}
@media (max-width:820px){.tools .tl{display:none}.tools #allbtn.button,.tools #rndbtn.button{width:36px;padding:0}}

/* =========================================================
   GERÇEK CAM: paneller arkadakini gerçekten bulanıklaştırır
   ========================================================= */
:root,[data-theme="light"]{--glass:rgba(255,255,255,.55);--glass-strong:rgba(255,255,255,.66);--blur:blur(30px) saturate(1.7)}
[data-theme="dark"]{--glass:rgba(16,24,52,.5);--glass-strong:rgba(12,18,40,.6);--blur:blur(30px) saturate(1.5)}
.brandbar,#ftog,.search-field__group,.topbar .tabs__list-container,.tools,.legend,#hint,#tip,#results{backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.detail,.side .drawer__dialog,.tts-pop,.ident__question-card,.ident__results-card{background:var(--glass-strong)!important;backdrop-filter:blur(38px) saturate(1.7);-webkit-backdrop-filter:blur(38px) saturate(1.7)}
.dh{background:color-mix(in srgb,var(--glass-strong) 70%,transparent)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.brandbar{backdrop-filter:none;-webkit-backdrop-filter:none}
.similar-item{background:color-mix(in srgb,var(--default) 100%,transparent)!important}
.acts{background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--glass-strong) 90%,var(--surface)) 45%)}

/* yoğun görünümde yakınlaşma düzeyinden bağımsız görünürlük */
.cv.dense .nd .bub.sp{stroke:var(--c);stroke-opacity:.95;stroke-width:2.2px;vector-effect:non-scaling-stroke}
.cv.dense .lk{vector-effect:non-scaling-stroke;stroke-width:1px;stroke-opacity:.3}
.cv.dense .lk.hl{stroke-width:2.2px;stroke-opacity:.95}
/* orta yoğunlukta (100+ düğüm) pahalı efektleri kapat */
.cv.lite .nd .bub{mix-blend-mode:normal!important;filter:none!important;transition:none!important}
.cv.lite .nd:hover .bub{transform:none}
.cv.lite .nd.sel .bub{filter:none!important}
.cv.lite .mesh{display:none}
.cv.lite .nd text{transition:none}
.cv.lite .nd.nolb text{display:none}
/* uzaktayken sabit ince çizgi/nokta, yakındayken normal (daha hızlı) */
.cv.dense .nd .bub.sp{stroke:none}
.cv.dense.far .nd .bub.sp{stroke:var(--c);stroke-opacity:.95;stroke-width:2.2px;vector-effect:non-scaling-stroke}
.cv.dense .lk{vector-effect:none;stroke-width:1px;stroke-opacity:.28}
.cv.dense.far .lk{vector-effect:non-scaling-stroke}
.cv.dense .lk.hl{stroke-width:2px;stroke-opacity:.95;vector-effect:none}
.cv.lite .nd .hit{fill:none;pointer-events:all}
/* menü açıkken alttaki araçlar cam arkasında hayalet gibi görünmesin */
.app:has(.side.show) .tools,.app:has(.side.show) #hint{opacity:0;pointer-events:none;transition:opacity .15s}
.tools,#hint{transition:opacity .2s}
.brandbar__mark{border-radius:50%;filter:drop-shadow(0 4px 12px rgba(122,108,255,.35))}
.tts-pop{position:fixed!important;right:auto;top:auto;z-index:140;backdrop-filter:blur(40px) saturate(1.7)!important;-webkit-backdrop-filter:blur(40px) saturate(1.7)!important}
/* iç içe cam çalışmadığı için sabit başlık neredeyse opak */
.dh{background:color-mix(in srgb,var(--surface) 93%,transparent)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
@media (max-width:820px){.dh{background:transparent!important}}

/* =========================================================
   YAZI TİPLERİ — Instrument Serif (başlık) · Plus Jakarta Sans (arayüz) · Newsreader (okuma)
   ========================================================= */
:root{
  --sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --display:"Instrument Serif","Newsreader",Georgia,serif;
}
body{font-family:var(--sans);font-size:13.5px;font-optical-sizing:auto}
.brandbar__text strong{font:340 25px/1 var(--display);letter-spacing:-.005em}
.drawer__heading{font:340 28px/1.1 var(--display);letter-spacing:-.005em}
.nm strong{font:340 34px/1.04 var(--display);letter-spacing:-.012em}
.nm em{font:italic 340 20px/1.2 var(--display);color:var(--muted)}
.ksum b{font:340 32px/1 var(--display);letter-spacing:-.01em;font-variant-numeric:lining-nums}
.ident__intro h2{font:340 clamp(1.9rem,2.8vw,2.7rem)/1.05 var(--display);letter-spacing:-.01em}
.wiki-full h4{font:340 22px/1.2 var(--display);letter-spacing:-.005em;margin:24px 0 6px;color:var(--foreground)}
.wiki-full h4.l3,.wiki-full h4.l4,.wiki-full h4.l5{font-size:19px;color:var(--muted)}
.wiki-info__body p,.wiki-full p,.note{font-family:var(--serif);font-size:15.5px;line-height:1.72;letter-spacing:0;color:color-mix(in srgb,var(--foreground) 92%,var(--muted))}
.wiki-info__body p{margin:0}
.wiki-info__title b{font-weight:540}
.tooltip-name,#tip b{font-weight:540}
#tip i,#results i,.similar-item i{font:italic 340 14.5px/1.3 var(--serif)}
.nd text{font-family:var(--sans)}
.nd text{font-size:11.5px;font-weight:460;letter-spacing:.004em;word-spacing:.14em}
.nd.sp text{font-size:11px;font-weight:380}
body,.button,.tabs__tab{word-spacing:.04em}
@media (min-width:821px){.detail{clip-path:inset(0 round 30px)}}
/* .app'in kendi katmanı olması panellerin arkadaki diyagramı bulanıklaştırmasını engelliyordu */
.app{z-index:auto!important}

/* Dinle / Durdur kontrolleri başlığın altında kendi satırında (masaüstü) */
@media (min-width:821px){
  .dh{flex-wrap:wrap;row-gap:12px;align-items:flex-start;padding-bottom:16px}
  .dh .nm{order:1;flex:1 1 0;min-width:0}
  .dh>:not(.nm):not(.tts):not(.tts-prog){order:2;flex:none}
  .dh .tts{order:3;flex:1 0 100%;display:flex;align-items:center;gap:8px}
  .dh .tts .tts-voice{margin-left:auto}
}
.dh{background:color-mix(in srgb,var(--surface) 99%,transparent)!important}
@media (max-width:820px){.dh{background:transparent!important}}

/* =========================================================
   YENİ TEŞHİS — mobil öncelikli, fotoğraflı
   ========================================================= */
#v-ident{padding:0!important;background:transparent!important}
@media (min-width:1000px){.app:has(#detail.shown) #v-ident{padding-right:392px}}
@keyframes idsh{from{background-position:120% 0}to{background-position:-120% 0}}
@keyframes idfade{from{opacity:0}to{opacity:1}}
@media (min-width:1000px){.app:has(#detail.shown) #v-ident{padding-right:392px!important}}

/* =========================================================
   KEŞFET — fotoğraflı galeri + kategoriler
   ========================================================= */
.ex{max-width:1260px;margin:0 auto;padding:86px 22px 90px}
.ex-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:16px}
.ex-eyebrow{font-size:10px;letter-spacing:.11em;text-transform:uppercase;font-weight:580;color:var(--muted)}
.ex-head h2{font:340 clamp(34px,5.2vw,54px)/1.02 var(--display);letter-spacing:-.015em;margin:4px 0 6px}
.ex-head p{margin:0;color:var(--muted);font-size:14px;max-width:48ch}
.ex-stat{text-align:right;flex:none}
.ex-stat b{display:block;font:340 clamp(34px,5vw,50px)/1 var(--display);letter-spacing:-.01em}
.ex-stat span{font-size:11px;color:var(--muted);font-weight:540;letter-spacing:.05em;text-transform:uppercase}
.ex-tools{display:flex;gap:10px;margin-bottom:14px}
.ex-search{flex:1;min-width:0;display:flex;align-items:center;gap:10px;height:46px;padding:0 16px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);color:var(--muted)}
.ex-search:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,transparent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 15%,transparent),var(--glass-sh)}
.ex-search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:14px;color:var(--foreground);outline:0}
.ex-btn{height:46px;padding:0 20px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);font-size:13px;font-weight:530;color:var(--foreground);cursor:pointer;flex:none}
.ex-btn:hover{background:var(--glass-strong)}
.ex-dims{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;margin:0 -2px 12px;padding:2px;border-bottom:1px solid var(--separator)}
.ex-dims::-webkit-scrollbar{display:none}
.ex-dim{flex:none;position:relative;height:40px;padding:0 14px;font-size:13.5px;font-weight:530;color:var(--muted);cursor:pointer;border-radius:12px 12px 0 0;display:inline-flex;align-items:center;gap:7px}
.ex-dim:hover{color:var(--foreground)}
.ex-dim.is-on{color:var(--foreground)}
.ex-dim.is-on::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;border-radius:3px;background:linear-gradient(90deg,#1fcfa3,#2a6cff,#a45cff)}
.ex-dim b{min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--accent);color:var(--accent-foreground);font-size:10.5px;display:inline-grid;place-items:center}
.ex-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.ex-chip{flex:none;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 13px 0 11px;border-radius:999px;background:color-mix(in srgb,var(--surface) 70%,transparent);border:1px solid var(--border);font-size:13px;font-weight:520;color:var(--foreground);cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s}
.ex-chip:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(30,60,130,.12)}
.ex-chip:active{transform:scale(.97)}
.ex-chip.is-on{background:var(--foreground);color:var(--background);border-color:transparent}
.ex-chip em{font-style:normal;font-size:11px;font-weight:580;opacity:.55}
.ex-ce{font-style:normal;font-size:17px;line-height:1;display:inline-block}
.ex-sw,.ex-gd{width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.ex-state-in{color:var(--muted);font-size:13px;padding:8px 2px}
.ex-sel{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px}
.ex-sel:empty{display:none}
.ex-sc{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 11px;border-radius:999px;background:color-mix(in srgb,var(--accent) 13%,transparent);font-size:12.5px;font-weight:530;color:var(--foreground);cursor:pointer}
.ex-sc small{font-size:10.5px;font-weight:540;color:var(--muted);letter-spacing:.02em}
.ex-sc svg{opacity:.5}.ex-sc:hover svg{opacity:1}
.ex-clear{height:30px;padding:0 10px;font-size:12.5px;font-weight:540;color:var(--accent);cursor:pointer}
.ex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:640px){.ex-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}}
@media (min-width:900px){.ex-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1240px){.ex-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.ex-card{position:relative;display:block;width:100%;aspect-ratio:4/5;border-radius:22px;overflow:hidden;background:var(--default);cursor:pointer;text-align:left;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s}
.ex-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1);animation:exfade .5s ease}
@keyframes exfade{from{opacity:0}to{opacity:1}}
.ex-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(30,60,130,.24)}
.ex-card:hover img{transform:scale(1.07)}
.ex-card:active{transform:scale(.98)}
.ex-card:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:2px}
.ex-cap{position:absolute;left:0;right:0;bottom:0;padding:54px 14px 13px;background:linear-gradient(transparent,rgba(8,14,34,.8));color:#fff;pointer-events:none}
.ex-cap b{display:block;font-size:14px;font-weight:560;line-height:1.2}
.ex-cap i{display:block;font:italic 340 14.5px/1.25 var(--serif);opacity:.86;margin-top:1px}
.ex-dot{position:absolute;top:12px;right:12px;width:11px;height:11px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2.5px rgba(255,255,255,.9);pointer-events:none}
.ex-sk{pointer-events:none;background:linear-gradient(110deg,var(--default) 30%,color-mix(in srgb,var(--default) 35%,#fff) 50%,var(--default) 70%);background-size:220% 100%;animation:idsh 1.3s linear infinite}
@keyframes idsh{from{background-position:120% 0}to{background-position:-120% 0}}
.ex-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:56px 16px;text-align:center}
.ex-empty b{font:340 28px/1.1 var(--display)}
.ex-empty span{color:var(--muted);font-size:13.5px}
.ex-empty .ex-btn{margin-top:8px}
.ex-sent{height:2px}
@media (min-width:1000px){.app:has(#detail.shown) #v-ident{padding-right:392px!important}}
@media (max-width:820px){
  .ex{padding:112px 14px 96px}
  .ex-head p{display:none}
  .ex-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-14px;padding-right:14px}
  .ex-chips::-webkit-scrollbar{display:none}
  .ex-card{border-radius:20px}
}
@media (max-width:820px){
  .ex-head{margin-bottom:12px}
  .ex-head h2{font-size:30px;margin:2px 0 0}
  .ex-stat b{font-size:34px}
  .ex-tools{margin-bottom:8px}
  .ex-search,.ex-btn{height:42px}
  .ex-sel{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-bottom:10px}
  .ex-sel::-webkit-scrollbar{display:none}
  .ex-sc,.ex-clear{flex:none}
}

/* ---- Keşfet: ikonlar, üst çubuk, arama, zemin ---- */
.ex-ce{display:inline-grid;place-items:center;color:var(--muted);transition:color .15s}
.ex-ce .xi{display:block}
.ex-chip:hover .ex-ce{color:var(--foreground)}
.ex-chip.is-on .ex-ce{color:inherit}
/* kaydırınca içerik üst çubuğun altında karışmasın: tam genişlik, bulanık yarı opak şerit */
body:has(#v-ident.active) .topbar::before{content:"";position:absolute;left:-14px;right:-14px;top:-14px;height:76px;z-index:-1;pointer-events:none;
  background:color-mix(in srgb,var(--background) 84%,transparent);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);border-bottom:1px solid var(--separator)}
/* sayfanın kendi araması var: üstteki ikinci arama kutusunu bu görünümde gizle */
body:has(#v-ident.active) .searchbox{display:none}
/* nokta deseni Keşfet'te kapalı */
#stage:has(#v-ident.active) .dotcv{display:none}
@media (max-width:820px){
  body:has(#v-ident.active) .topbar::before{left:-8px;right:-8px;top:-8px;bottom:-8px;height:auto;background:color-mix(in srgb,var(--background) 90%,transparent)}
}
body:has(#v-ident.active) .topbar::before{background:color-mix(in srgb,var(--background) 90%,transparent)}
@media (max-width:820px){body:has(#v-ident.active) .topbar::before{background:color-mix(in srgb,var(--background) 97%,transparent)}}

/* =========================================================
   Keşfet: açılıp kapanan sol filtre paneli
   ========================================================= */
body:has(#v-ident.active) .badge-anchor,body:has(#v-ident.active) .side{display:none!important}
.ex-fbtn{display:inline-flex;align-items:center;gap:8px}
.ex-fbtn.is-on{background:var(--foreground);color:var(--background)}
.ex-fbtn b{min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--accent);color:var(--accent-foreground);font-size:10.5px;display:inline-grid;place-items:center}
.ex-body{display:grid;grid-template-columns:minmax(0,1fr)}
.ex-main{min-width:0}
.ex-fp{display:none;flex-direction:column;background:color-mix(in srgb,var(--surface) 93%,transparent);border:1px solid var(--glass-brd);border-radius:26px;box-shadow:var(--glass-sh);overflow:hidden}
.ex.fp-open .ex-fp{display:flex}
.ex-fph{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 14px 8px 20px}
.ex-fph b{font:340 26px/1 var(--display)}
.ex-fph>span{display:inline-flex;align-items:center;gap:6px}
.ex-x{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--default);color:var(--foreground);cursor:pointer}
.ex-fpb{overflow:auto;flex:1;padding:0 12px 12px;scrollbar-width:thin}
.ex-fs{border-top:1px solid var(--separator)}
.ex-fs:first-child{border-top:0}
.ex-fh{width:100%;display:flex;align-items:center;gap:8px;padding:14px 8px;font-size:13.5px;font-weight:540;text-align:left;color:var(--foreground);cursor:pointer}
.ex-fh b{min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--accent);color:var(--accent-foreground);font-size:10.5px;display:inline-grid;place-items:center}
.ex-chev{margin-left:auto;color:var(--muted);transition:transform .2s}
.ex-fs.is-open .ex-chev{transform:rotate(180deg)}
.ex-fb{display:flex;flex-wrap:wrap;gap:6px;padding:0 4px 14px}
.ex-fb .ex-chip{height:34px;font-size:12.5px;padding:0 11px 0 9px;gap:7px}
.ex-fb .ex-chip em{margin-left:1px}
.ex-fpf{display:none;padding:10px 14px 14px;border-top:1px solid var(--separator)}
.ex-fpf .button{width:100%;height:46px}
.ex-backdrop{display:none}
@media (min-width:821px){
  .ex.fp-open .ex-body{grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}
  .ex-fp{position:sticky;top:88px;max-height:calc(100vh - 106px)}
}
@media (max-width:820px){
  .ex{padding-top:78px!important}
  .ex-fp{position:fixed;left:0;right:0;bottom:0;z-index:95;max-height:84vh;border-radius:28px 28px 0 0;display:flex;transform:translateY(106%);transition:transform .32s cubic-bezier(.2,.8,.2,1);box-shadow:0 -20px 60px rgba(10,20,50,.3)}
  .ex.fp-open .ex-fp{transform:none}
  .ex-fpf{display:block}
  .ex.fp-open .ex-backdrop{display:block;position:fixed;inset:0;z-index:90;background:rgba(8,14,34,.42);animation:exfade .25s}
  .ex-fph{padding-top:18px}
  .ex-fb{padding-bottom:12px}
}
@media (max-width:820px){.ex-fp{background:var(--surface)}}

/* =========================================================
   CANLILARIN SOYAĞACI — yeni âlem renkleri ve bitkiye özgü alanlar
   ========================================================= */
:root,[data-theme="light"]{
  --k8:#e03131;--k8m:#ff8787;--k8r:#ffd8a8;
  --k9:#8d5524;--k9m:#d2a679;--k9r:#f3e5d0;
  --k10:#5c940d;--k10m:#a9e34b;--k10r:#f4fce3;
  --k11:#0ca678;--k11m:#63e6be;--k11r:#c3fae8;
  --k12:#ae3ec9;--k12m:#e599f7;--k12r:#ffe3f1;
}
[data-theme="dark"]{
  --k8:#ff6b6b;--k8m:#e03131;--k8r:#ffc9c9;
  --k9:#e0a66a;--k9m:#a8743f;--k9r:#f1dcc0;
  --k10:#c0eb75;--k10m:#7fb800;--k10r:#f1fbc4;
  --k11:#38d9a9;--k11m:#12b886;--k11r:#c3fae8;
  --k12:#da77f2;--k12m:#ae3ec9;--k12r:#fcc2d7;
}
.plant-media.np .plant-media__organs{display:none}

/* =========================================================
   ÂLEM SEÇİCİ · TEMA · RENK AÇIKLAMASI · ALT ARAÇLAR · GERÇEK HARİTA
   ========================================================= */
.searchbox{flex:1 1 180px;min-width:140px;max-width:340px}
.kswitch{display:flex;gap:2px;padding:4px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);flex:none;pointer-events:auto}
.ks-b{height:38px;min-width:38px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;color:var(--muted);cursor:pointer;transition:background .18s,color .18s;padding:0}
.ks-b:hover{color:var(--foreground);background:var(--default)}
.ks-b.is-on{background:var(--foreground);color:var(--background)}
.themetop{width:46px;height:46px;border-radius:50%;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);color:var(--foreground);flex:none;display:grid;place-items:center;cursor:pointer}
.themetop:hover{background:var(--glass-strong)}
@media (max-width:1350px){.brandbar__text{display:none}.brandbar{padding-right:6px}}
@media (max-width:1100px){.searchbox{min-width:110px}}

/* renk açıklaması: sol altta, araç çubuğunun üstünde */
.legend{display:block!important;left:18px;bottom:78px;padding:0;overflow:hidden;pointer-events:auto!important;border-radius:22px;max-width:min(300px,calc(100vw - 36px))}
.lg-h{display:flex;align-items:center;gap:9px;width:100%;padding:10px 14px;font-size:12.5px;font-weight:540;color:var(--foreground);cursor:pointer;text-align:left}
.lg-h svg{margin-left:auto;transition:transform .2s;color:var(--muted)}
.legend:not(.open) .lg-h svg{transform:rotate(180deg)}
.lg-pre{display:inline-flex}
.lg-pre i{width:11px;height:11px;border-radius:50%;margin-left:-3px;border:2px solid var(--surface);background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 45%,#fff))}
.lg-pre i:first-child{margin-left:0}
.legend.open .lg-pre{display:none}
.lg-b{display:none;padding:0 14px 12px}
.legend.open .lg-b{display:flex;flex-direction:column;gap:7px}
.legend.open .lg-h{padding-bottom:6px}
.lg-i{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:450}
.lg-i i{width:13px;height:13px;border-radius:50%;flex:none;background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 45%,#fff) 70%,color-mix(in srgb,var(--c) 15%,#fff))}
.lg-n{margin-top:3px;font-size:10.5px;color:var(--muted);line-height:1.4}
@media (max-height:640px){.legend.open .lg-b{max-height:36vh;overflow:auto}}

/* alt araç çubuğu: Günün canlısı + Rastgele + zoom; Keşfet'te de görünür */
.tools #dailybtn.button,.tools #rndbtn.button,.tools #allbtn.button{width:auto;min-width:36px;padding:0 14px 0 11px;gap:7px;border-radius:999px}
#stage:has(#v-ident.active) .tools{display:flex}
#hint{bottom:80px}
@media (max-width:820px){
  .tools .tl{display:none}
  .tools #dailybtn.button,.tools #rndbtn.button,.tools #allbtn.button{width:36px;padding:0}
  .legend{left:10px;bottom:12px}
  #hint{bottom:70px}
}

/* gerçek dünya haritası */
.dist-land{fill:color-mix(in srgb,var(--muted) 24%,var(--surface));stroke:none}
.dist-border{fill:none;stroke:color-mix(in srgb,var(--surface) 90%,transparent);stroke-width:.45;stroke-linejoin:round}
.dist-map{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),color-mix(in srgb,var(--accent) 13%,var(--surface)))}
.dist-grid{stroke:color-mix(in srgb,var(--accent) 12%,transparent);stroke-width:.5;stroke-dasharray:2 4}
.dist-dot{fill:var(--accent);stroke:var(--surface);stroke-width:.8;opacity:.9}
.dist-map svg{display:block;width:100%;height:auto}

/* mobil: üst çubuk üç satır (arama · âlem seçici · sekmeler) */
@media (max-width:820px){
  .topbar #themeTop{order:2;width:42px;height:42px}
  .topbar .kswitch{order:3;width:100%;justify-content:space-between}
  .topbar .kswitch .ks-b{flex:1;height:36px}
  .topbar .tabs{order:4}
  body:has(#v-ident.active) .topbar .kswitch{order:1;flex:1;width:auto}
  body:has(#v-ident.active) .topbar #themeTop{order:2}
  .ex{padding-top:118px!important}
  body:has(#v-ident.active) .ex{padding-top:118px!important}
  #v-list{padding-top:0}
}
.dist-dot{r:3.6px;fill:var(--accent);stroke:var(--surface);stroke-width:1;opacity:.95}
[data-theme="dark"] .dist-land{fill:color-mix(in srgb,var(--foreground) 17%,var(--surface))}
[data-theme="dark"] .dist-border{stroke:color-mix(in srgb,var(--foreground) 10%,transparent)}

/* =========================================================
   TREE OF LIFE — araç kümesi · ipucu · ok · hakkında · açıklama · menü
   ========================================================= */
/* üst araç kümesi (tema · dil · ses · hakkında) */
.tbtools{display:flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);flex:none;pointer-events:auto}
.tb-btn{min-width:38px;height:38px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--muted);cursor:pointer;padding:0;transition:background .18s,color .18s}
.tb-btn:hover{color:var(--foreground);background:var(--default)}
.tb-btn[aria-pressed="true"]{color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.tb-lang{padding:0 11px 0 11px}
.tb-lang b{font-size:11.5px;font-weight:600;letter-spacing:.04em}
.tb-more{display:none}
.themetop{display:none}
@media (max-width:820px){
  .tb-opt{display:none}.tb-more{display:inline-flex}
  .topbar .tbtools{order:2}
  body:has(#v-ident.active) .topbar .tbtools{order:2}
}

/* açılır menüler */
.popm{position:fixed;z-index:160;min-width:230px;max-width:min(320px,calc(100vw - 20px));padding:8px;border-radius:20px;background:var(--surface);border:1px solid var(--border);box-shadow:0 24px 60px rgba(10,20,50,.28);animation:exfade .15s ease}
.popm[hidden]{display:none}
.popm__h{padding:8px 10px 6px;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.popm__i{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 12px;border-radius:12px;font-size:13.5px;font-weight:500;color:var(--foreground);text-align:left;cursor:pointer}
.popm__i:hover{background:var(--default)}
.popm__i.on{background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent)}
.popm__i em{font-style:normal;font-size:11px;font-weight:580;color:var(--muted)}
.popm__n{margin:6px 10px 6px;font-size:11.5px;line-height:1.5;color:var(--muted)}

/* ipucu: 1 saniye bekler */
#dtip{position:fixed;z-index:200;max-width:270px;padding:9px 13px;border-radius:14px;background:var(--foreground);color:var(--background);font-size:12.5px;line-height:1.5;font-weight:440;box-shadow:0 14px 34px rgba(8,14,34,.35);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .16s,transform .16s;visibility:hidden}
#dtip.on{opacity:1;transform:none;visibility:visible}
#toast{position:fixed;left:50%;bottom:92px;z-index:210;transform:translate(-50%,10px);padding:10px 18px;border-radius:999px;background:var(--foreground);color:var(--background);font-size:13px;font-weight:500;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 14px 34px rgba(8,14,34,.3)}
#toast.on{opacity:1;transform:translate(-50%,0)}

/* düğüm oku: üzerine gelince çıkar, tüm alt dalları açar */
.xa{opacity:0;transition:opacity .15s,transform .15s;cursor:pointer;pointer-events:none;transform-box:fill-box}
.nd:hover .xa,.nd.sel .xa{opacity:1;pointer-events:all}
.xa circle{fill:var(--surface);stroke:var(--c);stroke-width:1.6;filter:drop-shadow(0 2px 5px rgba(10,20,50,.22))}
.xa path{fill:none;stroke:var(--c);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.xa:hover circle{fill:var(--c)}.xa:hover path{stroke:#fff}
.cv.lite .xa{display:none}

/* filtre menüsü: sade ve okunaklı yüzey */
.side .drawer__dialog{background:color-mix(in srgb,var(--surface) 96%,transparent)!important}
.side .drawer__dialog .msec h3{letter-spacing:.07em}
#filters h4{display:flex;align-items:center;gap:8px;margin-top:20px}
#filters h4 .h4i{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:8px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent)}
#filters .fi{border-radius:12px;transition:background .15s}
#filters .fi:hover{background:var(--default)}
#filters .fi .fico{display:inline-grid;place-items:center;color:var(--muted)}
.app:has(.side.show) .legend{opacity:0;pointer-events:none}
.ex-hi{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:9px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);flex:none}

/* renk açıklaması: altta ortada, üzerine gelince açılır */
.legend{display:block!important;left:50%!important;right:auto!important;bottom:18px!important;transform:translateX(-50%);padding:0!important;overflow:visible!important;border-radius:999px;max-width:none!important;pointer-events:auto!important;z-index:12}
.lg-h{display:flex;align-items:center;gap:9px;padding:10px 16px;font-size:12.5px;font-weight:540;color:var(--foreground);cursor:default;white-space:nowrap;outline:none}
.lg-pre{display:inline-flex}
.lg-pre i{width:11px;height:11px;border-radius:50%;margin-left:-3px;border:2px solid var(--surface);background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 45%,#fff))}
.lg-pre i:first-child{margin-left:0}
.lg-b{display:none;position:absolute;left:50%;bottom:100%;transform:translateX(-50%);padding-bottom:12px;width:max-content;max-width:min(360px,calc(100vw - 28px))}
.legend:hover .lg-b,.legend:focus-within .lg-b,.legend.open .lg-b{display:block}
.lg-card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;padding:14px 18px;border-radius:22px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:0 20px 50px rgba(10,20,50,.22);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.lg-card .lg-n{grid-column:1/-1;margin-top:4px}
.lg-i{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:470;white-space:nowrap}
.lg-i i{width:13px;height:13px;border-radius:50%;flex:none;background:radial-gradient(circle,var(--c),color-mix(in srgb,var(--c) 45%,#fff) 70%,color-mix(in srgb,var(--c) 15%,#fff))}
.lg-n{font-size:10.5px;color:var(--muted);line-height:1.4}
@media (max-width:1200px){.tools .tl{display:none}.tools #dailybtn.button,.tools #rndbtn.button,.tools #allbtn.button{width:36px;padding:0}}

/* harita ve fotoğraf: yakınlaştırma bölmesinde harita */
#zpane .zmapw{position:absolute;display:none}
#zpane.is-map{background:var(--surface-tertiary,#e8eefc)}
#zpane .zm{width:100%;height:100%;border-radius:0}
.dist-map{cursor:zoom-in;position:relative;overflow:hidden}
.dist-map .zlens{position:absolute;pointer-events:none}

/* hakkında penceresi */
.about{position:fixed;inset:0;z-index:180;display:grid;place-items:center;padding:16px;background:rgba(8,14,34,.5);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:exfade .2s ease}
.about[hidden]{display:none}
.about__card{position:relative;width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:30px 30px 26px;border-radius:30px;background:var(--surface);box-shadow:var(--overlay-shadow,0 30px 80px rgba(0,0,0,.35))}
.about__x{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:var(--default);color:var(--foreground);font-size:14px;cursor:pointer}
.about__eyebrow{font-size:10px;letter-spacing:.11em;text-transform:uppercase;font-weight:580;color:var(--muted)}
.about__card h2{font:340 46px/1 var(--display);letter-spacing:-.015em;margin:6px 0 10px}
.about__lead{margin:0 0 18px;font-size:14.5px;line-height:1.6;color:var(--muted)}
.about__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:6px}
.about__grid>div{padding:14px 16px;border-radius:18px;background:var(--default)}
.about__grid small{display:block;font-size:11px;font-weight:540;color:var(--muted);margin-bottom:4px}
.about__grid b{font:340 22px/1.15 var(--display)}
.about__card h3{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:20px 0 8px}
.about__contact{display:flex;gap:8px;flex-wrap:wrap;font-size:13.5px}
.about__contact a{padding:9px 16px;border-radius:999px;background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent);font-weight:530;text-decoration:none}
.about__contact .muted{color:var(--muted)}
.about__src,.about__note{margin:0;font-size:12.5px;line-height:1.6;color:var(--muted)}
.about__note{margin-top:14px;padding:12px 14px;border-radius:14px;background:color-mix(in srgb,#ff9a3d 14%,transparent)}
.about__note b{color:var(--foreground)}
body.about-open{overflow:hidden}
.tts-share{width:34px;height:34px;border-radius:50%;display:inline-grid;place-items:center;color:var(--muted);cursor:pointer;flex:none}
.tts-share:hover{background:var(--default);color:var(--foreground)}
@media (max-width:820px){.about__grid{grid-template-columns:1fr}.about__card{padding:26px 22px 22px}.about__card h2{font-size:38px}}
.lg-card{background:color-mix(in srgb,var(--surface) 96%,transparent)!important}
.legend:hover~#hint,.stage:has(.legend:hover) #hint{opacity:0}

/* =========================================================
   ALT ÇUBUK · SES · YARATICILAR · KARŞILAŞTIR · SEKME İKONLARI
   ========================================================= */
#hint{display:none!important}
.bbar{position:absolute;left:18px;right:18px;bottom:18px;z-index:12;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:10px;pointer-events:none}
.bbar>*{pointer-events:auto}
.bbar .tools{position:static!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0;justify-self:start}
.bbar .legend{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0;justify-self:center}
.bbright{justify-self:end;display:flex;align-items:center;gap:8px}
@media (min-width:1000px){
  .app:has(#detail.shown) .bbar{right:410px}
  .app:has(#detail.shown) .tools .tl{display:none}
  .app:has(#detail.shown) .tools #dailybtn.button,.app:has(#detail.shown) .tools #rndbtn.button,.app:has(#detail.shown) .tools #allbtn.button{width:36px;padding:0}
}
.lg-card{grid-template-columns:repeat(2,max-content)!important}
.ambw{display:flex;align-items:center;height:46px;padding:0 4px 0 6px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur)}
.amb-vol{width:0;opacity:0;margin:0;transition:width .25s,opacity .2s,margin .25s;accent-color:var(--accent);height:4px;cursor:pointer}
.ambw:hover .amb-vol,.ambw:focus-within .amb-vol{width:92px;opacity:1;margin:0 8px 0 4px}
.bb-btn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--foreground);cursor:pointer;flex:none}
.bb-btn:hover{background:var(--default)}
.bb-btn[aria-pressed="true"]{color:var(--accent)}
.bb-btn.waiting{animation:ambpulse 1.8s ease-in-out infinite}
@keyframes ambpulse{50%{opacity:.4}}
.bb-about{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 16px 0 14px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);color:var(--foreground);font-size:13px;font-weight:520;cursor:pointer}
.bb-about:hover{background:var(--glass-strong)}
@media (max-width:1200px){.bb-l{display:none}.bb-about{width:46px;padding:0;justify-content:center}}
@media (hover:none){.amb-vol{display:none}}
@media (max-width:820px){
  .bbar{left:10px;right:10px;bottom:12px}
  .bbar .tools{position:absolute!important;right:0!important;bottom:62px!important;left:auto!important}
  .app:has(#detail.shown) .bbar{right:10px}
  .lg-card{grid-template-columns:max-content!important}
}

/* sol menü: diğer yüzeyler gibi saydam ve bulanık; Filtreler düğmesinde oval yok */
.side .drawer__dialog{background:var(--glass-strong)!important;backdrop-filter:blur(38px) saturate(1.7)!important;-webkit-backdrop-filter:blur(38px) saturate(1.7)!important}
#ftog,#ftog:hover{background:transparent!important;border-color:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#ftog:hover{color:var(--accent)}

/* sekmeler: ikon + etiket */
.tabs__tab .tabi{flex:none;opacity:.9}
.tab-b{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 5px;border-radius:99px;background:var(--accent);color:var(--accent-foreground);font:580 10px/1 var(--sans);font-style:normal}
.tabs__tab[data-selected="true"] .tab-b{background:#fff;color:#0b1430}
.tab-b[hidden]{display:none}
@media (max-width:1560px){.brandbar__text{display:none}}
.tb-more,.tb-opt{display:none!important}

/* Keşfet ve Karşılaştır ortak sayfa düzeni */
body:has(#v-ident.active,#v-compare.active) .badge-anchor,body:has(#v-ident.active,#v-compare.active) .side{display:none!important}
body:has(#v-ident.active,#v-compare.active) .searchbox{display:none}
#stage:has(#v-compare.active) .dotcv{display:none}
body:has(#v-compare.active) .topbar::before{content:"";position:absolute;left:-14px;right:-14px;top:-14px;height:76px;z-index:-1;pointer-events:none;background:color-mix(in srgb,var(--background) 90%,transparent);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);border-bottom:1px solid var(--separator)}
@media (min-width:1000px){.app:has(#detail.shown) #v-compare{padding-right:392px!important}}
@media (max-width:820px){
  body:has(#v-compare.active) .topbar::before{left:-8px;right:-8px;top:-8px;bottom:-8px;height:auto;background:color-mix(in srgb,var(--background) 97%,transparent)}
  body:has(#v-compare.active) .topbar .kswitch{order:1;flex:1;width:auto}
  body:has(#v-compare.active) .topbar .tbtools{order:2}
}

/* KARŞILAŞTIR görünümü */
#v-compare{position:absolute;inset:0;display:none;overflow:auto;padding:0!important;background:transparent!important}
#v-compare.active{display:block}
.cp{max-width:1240px;margin:0 auto;padding:86px 22px 130px}
.cp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:16px}
.cp-eyebrow{font-size:10px;letter-spacing:.11em;text-transform:uppercase;font-weight:580;color:var(--muted)}
.cp-head h2{font:340 clamp(34px,5vw,52px)/1.02 var(--display);letter-spacing:-.015em;margin:4px 0 6px}
.cp-head p{margin:0;color:var(--muted);font-size:14px;max-width:52ch}
.cp-stat{text-align:right;flex:none}
.cp-stat b{display:block;font:340 clamp(34px,5vw,50px)/1 var(--display)}
.cp-stat span{font-size:11px;color:var(--muted);font-weight:540;letter-spacing:.05em;text-transform:uppercase}
.cp-add{position:relative;display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap}
.cp-add .ex-search{flex:1;min-width:220px}
.cp-res{position:absolute;left:0;top:calc(100% + 8px);width:min(540px,100%);z-index:30;background:var(--surface);border:1px solid var(--border);border-radius:20px;box-shadow:0 24px 60px rgba(10,20,50,.28);padding:6px}
.cp-res[hidden]{display:none}
.cp-res button{display:flex;align-items:baseline;gap:10px;width:100%;padding:10px 14px;border-radius:12px;text-align:left;cursor:pointer}
.cp-res button:hover{background:var(--default)}
.cp-res b{font-size:14px;font-weight:540}.cp-res i{font:italic 340 14px var(--serif);color:var(--muted)}
.cp-none{padding:14px;color:var(--muted);font-size:13.5px}
.cp-empty{text-align:center;padding:44px 16px 20px}
.cp-eic{display:inline-grid;place-items:center;width:72px;height:72px;border-radius:24px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);margin-bottom:12px}
.cp-empty h3{font:340 34px/1.1 var(--display);margin:0 0 8px}
.cp-empty p{margin:0 auto;max-width:52ch;color:var(--muted);font-size:14px;line-height:1.6}
.cp-sug{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:20px}
.cp-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);font-size:13px;font-weight:520;color:var(--foreground);cursor:pointer}
.cp-chip:hover{background:var(--glass-strong)}
.cp-chip span{color:var(--muted)}
.cp-chip--s{padding:8px 14px;font-weight:450;cursor:default}
.cp-chip--s em{font-style:normal;color:var(--accent);font-weight:580;margin-left:6px}
.cp-chips{display:flex;flex-wrap:wrap;gap:8px}
.cp-hint{margin:0 0 18px;padding:12px 16px;border-radius:16px;background:color-mix(in srgb,var(--accent) 10%,transparent);font-size:13.5px;color:var(--foreground)}
.cp-sec{margin-bottom:26px}
.cp-sec h3,.cp-th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600;margin:0 0 8px}
.cp-note{margin:0 0 10px;font-size:13.5px;color:var(--muted)}.cp-note b{color:var(--foreground)}
.cp-clado{overflow:auto;border-radius:24px;background:var(--glass-strong);border:1px solid var(--glass-brd);padding:10px 14px;box-shadow:var(--glass-sh)}
.cp-clado svg path{fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.cp-clado .cl-b{fill:var(--surface);stroke:var(--muted);stroke-width:2}
.cp-clado .cl-s{font:540 13px var(--sans);fill:var(--foreground)}
.cp-clado .cl-n{font:500 11px var(--sans);fill:var(--muted)}
.cp-scroll{overflow-x:auto;border-radius:26px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh)}
.cp-table{min-width:calc(150px + var(--n)*186px);padding:16px}
.cp-r{display:grid;grid-template-columns:150px repeat(var(--n),minmax(170px,1fr));gap:0 12px;align-items:stretch;border-top:1px solid var(--separator)}
.cp-hd{align-items:end;padding-bottom:12px;border-top:0}
.cp-l{padding:12px 10px 12px 4px;font-size:12.5px;font-weight:540;color:var(--muted);display:flex;align-items:center;gap:8px}
.cp-ti{display:inline-grid;place-items:center;color:var(--muted)}
.cp-c{padding:12px 8px;font-size:13.5px;display:flex;flex-direction:column;gap:2px;justify-content:center;border-radius:10px}
.cp-c b{font-weight:530}.cp-c i{font:italic 340 14px var(--serif);color:var(--muted)}
.cp-r.same .cp-c{background:color-mix(in srgb,#22c08a 12%,transparent)}
.cp-r.same .cp-l{color:#0d8a5f}
.cp-c.yes{color:#0d8a5f;align-items:center}.cp-c.no{color:var(--muted);align-items:center;opacity:.5}
.cp-n{font-size:12.5px;line-height:1.55;color:var(--muted);justify-content:flex-start;align-items:flex-start}
.cp-th{padding:20px 4px 6px;margin:0;border-top:1px solid var(--separator)}
.cp-h{position:relative}
.cp-x{position:absolute;top:8px;right:8px;z-index:3;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.92);color:#1b2a52;font-size:12px;box-shadow:0 2px 8px rgba(0,0,0,.2);cursor:pointer}
.cp-card{display:block;width:100%;text-align:left;cursor:pointer}
.cp-ph{position:relative;display:block;aspect-ratio:4/5;border-radius:20px;overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 18%,var(--surface)),var(--default));margin-bottom:10px}
.cp-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:exfade .4s}
.cp-card b{display:block;font-size:15px;font-weight:560}.cp-card i{display:block;font:italic 340 15px var(--serif);color:var(--muted)}
@media (max-width:820px){.cp{padding:118px 14px 110px}.cp-head p{display:none}}
.side .drawer__dialog{background:var(--glass)!important}
.cp-ph{aspect-ratio:1/1!important}
/* alt çubuk: sütun yerleşimi sabit (araçlar mobilde serbest kalsa da ortadaki kart ortada kalır) */
.bbar .tools{grid-column:1}
.bbar .legend{grid-column:2}
.bbar .bbright{grid-column:3}
/* karşılaştır: etiket sütunu sabit kalır, mobilde dar */
.cp-l{position:sticky;left:0;z-index:2;background:color-mix(in srgb,var(--surface) 90%,transparent)}
@media (max-width:820px){
  .cp-table{min-width:calc(96px + var(--n)*160px);padding:12px}
  .cp-r{grid-template-columns:96px repeat(var(--n),minmax(148px,1fr));gap:0 8px}
  .cp-l{font-size:11.5px;padding-right:6px}
}
@media (max-width:820px){
  .topbar .searchbox{flex:1 1 0!important;min-width:0!important;max-width:none!important}
  .tb-btn{min-width:34px;height:36px}
  .tb-lang{padding:0 8px}
  #ftog{padding:0 10px 0 8px!important}
}

/* seçili filtre etiketi: dolu, okunaklı, onay işaretli */
#db .chip.chip--primary.chip--accent{background:var(--accent)!important;color:var(--accent-foreground,#fff)!important;border-color:transparent!important;box-shadow:0 4px 12px color-mix(in srgb,var(--accent) 38%,transparent);gap:5px}
#db .chip.chip--primary.chip--accent .chip__label{color:inherit!important;font-weight:540}
#db .chip.chip--primary.chip--accent::before{content:"";width:11px;height:11px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/contain no-repeat}

/* =========================================================
   TREE OF LIFE — akıcı etiketler · açılış · soy hattı · karşılaştırma tepsisi
   ========================================================= */
/* seçili olan büyür ve adını gösterir, diğerleri ikona küçülür (âlemler ve görünümler) */
.tabs__tab,.ks-b{display:inline-flex;align-items:center;gap:0}
.ks-b{padding:0 11px;min-width:38px}
.tabs__tab>span,.ks-b>span{display:inline-block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;margin-left:0;font-size:12.5px;font-weight:540;transition:max-width .34s cubic-bezier(.2,.8,.2,1),opacity .22s,margin .3s}
.tabs__tab[data-selected="true"]>span,.ks-b.is-on>span{max-width:150px;opacity:1;margin-left:8px}
.ks-b.is-on{padding:0 15px 0 12px}
.tabs__tab .tabi{flex:none}

/* soy hattı: düğme + vurgu */
.xt{opacity:0;transition:opacity .15s;cursor:pointer;pointer-events:none;transform-box:fill-box}
.nd:hover .xt,.nd.sel .xt{opacity:1;pointer-events:all}
.xt circle{fill:var(--surface);stroke:var(--c);stroke-width:1.6;filter:drop-shadow(0 2px 5px rgba(10,20,50,.22))}
.xt path{fill:none;stroke:var(--c);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.xt:hover circle{fill:var(--c)}.xt:hover path{stroke:#fff}
.cv.lite .xt{display:none}
.trace-mode .lk:not(.hl){opacity:.1!important;transition:opacity .35s}
.trace-mode .nd:not(.onp){opacity:.16;transition:opacity .35s}
.trace-mode .nd.onp text{font-weight:600}
.trace-mode .lk.hl{stroke-width:4}

/* açılış animasyonu */
#splash{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 42%,color-mix(in srgb,var(--background) 92%,#7a6cff) 0,var(--background) 64%);overflow:hidden;transition:opacity .75s ease,transform .95s cubic-bezier(.7,0,.2,1),filter .75s}
#splash.out{opacity:0;transform:scale(1.07);filter:blur(10px);pointer-events:none}
.sp-net{position:absolute;width:min(94vmin,780px);height:auto;left:50%;top:50%;transform:translate(-50%,-50%);opacity:.9}
.sp-net line{stroke:var(--c);stroke-width:1.7;stroke-linecap:round;opacity:.55;stroke-dasharray:1;stroke-dashoffset:1;animation:spDraw 1.15s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:var(--d)}
.sp-net circle{fill:var(--c);opacity:0;transform-box:fill-box;transform-origin:center;animation:spDot .6s cubic-bezier(.3,1.6,.5,1) forwards;animation-delay:calc(var(--d) + .8s)}
@keyframes spDraw{to{stroke-dashoffset:0}}
@keyframes spDot{from{opacity:0;transform:scale(0)}to{opacity:.95;transform:scale(1)}}
.sp-core{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.sp-logo{width:96px;height:96px;filter:drop-shadow(0 16px 34px rgba(122,108,255,.5));animation:spLogo 1.05s cubic-bezier(.2,1.2,.3,1) .1s both}
.sp-logo .sp-v{stroke-dasharray:1;stroke-dashoffset:1;animation:spDraw 1s ease .7s forwards}
@keyframes spLogo{from{opacity:0;transform:scale(.35) rotate(-30deg)}to{opacity:1;transform:none}}
.sp-title{margin:0;display:flex;gap:.01em;overflow:hidden;padding:.08em .12em;font:340 clamp(48px,9.5vw,96px)/1 var(--display);letter-spacing:-.015em;color:var(--foreground)}
.sp-title span{display:inline-block;opacity:0;transform:translateY(70%) rotate(5deg);animation:spLetter .85s cubic-bezier(.2,.9,.2,1) forwards;animation-delay:calc(.55s + var(--i)*.055s)}
.sp-title .sp-sp{width:.28em;animation:none;opacity:1;transform:none}
@keyframes spLetter{to{opacity:1;transform:none}}
.sp-sub{margin:0;font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-weight:540;color:var(--muted);opacity:0;animation:spFade .9s ease 1.4s forwards}
@keyframes spFade{to{opacity:1}}
.sp-bar{position:absolute;left:50%;bottom:11vh;width:130px;height:3px;border-radius:3px;background:color-mix(in srgb,var(--foreground) 10%,transparent);transform:translateX(-50%);overflow:hidden}
.sp-bar i{display:block;height:100%;background:linear-gradient(90deg,#1fcfa3,#2a6cff,#a45cff);transform:scaleX(0);transform-origin:left;animation:spBar 2.6s cubic-bezier(.4,0,.2,1) .2s forwards}
@keyframes spBar{to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.sp-net,.sp-bar{display:none}.sp-title span,.sp-sub,.sp-logo,.sp-logo .sp-v{animation:none;opacity:1;transform:none;stroke-dashoffset:0}}

/* yaratıcılar: iletişim ve roller */
.about__grid p{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.about__contact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.about__contact .wa{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:18px;background:color-mix(in srgb,#25d366 15%,transparent);color:#128c4a;text-decoration:none;font-weight:500}
.about__contact .wa:hover{background:color-mix(in srgb,#25d366 24%,transparent)}
.about__contact .wa span{display:flex;flex-direction:column;line-height:1.25}
.about__contact .wa b{font-size:14px;color:var(--foreground)}
.about__contact .wa small{font-size:12px;color:var(--muted);font-weight:420}
[data-theme="dark"] .about__contact .wa{color:#4fe08c}
@media (max-width:560px){.about__contact{grid-template-columns:1fr}}

/* karşılaştırma tepsisi (galeri / ayrıntı paneli) */
.cpt{position:fixed;left:50%;bottom:86px;transform:translateX(-50%);z-index:70;display:flex;align-items:center;gap:10px;max-width:min(860px,calc(100vw - 24px));padding:8px 10px 8px 14px;border-radius:999px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:0 18px 50px rgba(10,20,50,.26);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);animation:cptIn .3s cubic-bezier(.2,.9,.3,1)}
.cpt[hidden]{display:none}
@keyframes cptIn{from{opacity:0;transform:translate(-50%,14px)}}
@media (min-width:1000px){body:has(#detail.shown) .cpt{left:calc(50% - 196px)}}
.cpt-i{display:grid;place-items:center;color:var(--accent);flex:none}
.cpt-l{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;min-width:0}
.cpt-l::-webkit-scrollbar{display:none}
.cpt-c{display:inline-flex;align-items:center;gap:7px;padding:3px 4px 3px 3px;border-radius:999px;background:var(--default);flex:none}
.cpt-ph{width:26px;height:26px;border-radius:50%;overflow:hidden;background:var(--c);flex:none}
.cpt-ph img{width:100%;height:100%;object-fit:cover;display:block}
.cpt-c b{font-size:12.5px;font-weight:540;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cpt-c button{width:20px;height:20px;border-radius:50%;font-size:10px;color:var(--muted);cursor:pointer}
.cpt-c button:hover{background:var(--surface);color:var(--foreground)}
.cpt-m{font-size:12.5px;color:var(--muted);white-space:nowrap;padding-left:4px}
.cpt-add,.cpt-go{height:36px;padding:0 15px;border-radius:999px;font-size:13px;font-weight:540;cursor:pointer;flex:none;white-space:nowrap}
.cpt-add{background:var(--default);color:var(--foreground)}
.cpt-go{background:var(--accent);color:var(--accent-foreground,#fff)}
.cpt-go[disabled]{opacity:.4;pointer-events:none}
.cpt-x{width:30px;height:30px;border-radius:50%;color:var(--muted);cursor:pointer;flex:none}
.cpt-x:hover{background:var(--default);color:var(--foreground)}
@media (max-width:820px){.cpt{bottom:76px;padding:7px 8px 7px 12px}.cpt-m{display:none}.cpt-c b{max-width:70px}}

/* Keşfet kartında karşılaştır düğmesi ve seçim hâli */
.ex-cmp{position:absolute;top:10px;left:10px;z-index:3;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.92);color:#1b2a52;font-size:12px;font-weight:540;box-shadow:0 3px 12px rgba(0,0,0,.22);opacity:0;transform:translateY(-4px);transition:opacity .18s,transform .18s}
.ex-cmp em{font-style:normal}
.ex-card:hover .ex-cmp,.ex-card:focus-visible .ex-cmp,.cmp-mode .ex-cmp{opacity:1;transform:none}
@media (hover:none){.ex-cmp{opacity:1;transform:none;width:30px;padding:0;justify-content:center}.ex-cmp em{display:none}}
.ex-cmp:hover{background:var(--accent);color:#fff}
.ex-chk{position:absolute;top:10px;left:10px;z-index:4;width:30px;height:30px;border-radius:50%;display:none;place-items:center;background:var(--accent);color:#fff;box-shadow:0 3px 12px rgba(0,0,0,.28)}
.ex-card.is-cmp{outline:3px solid var(--accent);outline-offset:-3px}
.ex-card.is-cmp .ex-chk{display:grid}.ex-card.is-cmp .ex-cmp{display:none}
.cmp-mode .ex-card:not(.is-cmp):hover{outline:3px dashed color-mix(in srgb,var(--accent) 70%,transparent);outline-offset:-3px}

/* karşılaştırma çekmecesi */
.cps{position:fixed;inset:0;z-index:170;display:grid;place-items:center;padding:16px;background:rgba(8,14,34,.5);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:exfade .2s ease}
.cps[hidden]{display:none}
.cps__card{position:relative;width:min(1200px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:28px 28px 30px;border-radius:30px;background:var(--surface);box-shadow:var(--overlay-shadow,0 30px 80px rgba(0,0,0,.35))}
.cps__x{position:absolute;top:14px;right:14px;z-index:5;width:38px;height:38px;border-radius:50%;background:var(--default);color:var(--foreground);font-size:14px;cursor:pointer}
.cps .cp{max-width:none;padding:0}
.cps .cp-head{padding-right:46px}
.cps .cp-head h2{font-size:clamp(30px,4vw,44px)}
.cps .cp-scroll,.cps .cp-clado{background:color-mix(in srgb,var(--default) 55%,transparent);box-shadow:none}
@media (max-width:820px){.cps{padding:0}.cps__card{width:100%;max-height:100vh;height:100vh;border-radius:0;padding:22px 14px 26px}}
.sp-title{text-shadow:0 0 22px var(--background),0 0 8px var(--background),0 0 3px var(--background)}
.cp-ph{aspect-ratio:auto!important;height:200px}
@media (max-width:820px){.cp-ph{height:150px}}
.ks-b svg,.tabs__tab svg{flex:none}
@media (max-width:820px){
  .topbar .kswitch .ks-b{flex:1 1 0!important;min-width:0;padding:0!important}
  .topbar .kswitch .ks-b.is-on{flex:2.5 1 0!important;padding:0 8px!important}
  .tabs__tab{flex:1 1 0!important;min-width:0;padding:0 4px!important;justify-content:center}
  .tabs__tab[data-selected="true"]{flex:2.9 1 0!important}
  .tabs__tab>span,.ks-b>span{font-size:12px}
}
.sp-logo{width:124px;height:124px}
.sp-core{gap:20px}

/* daha hafif yazılar: Wikipedia metni, notlar ve diyagram etiketleri */
.wiki-info__body p,.wiki-full p,.note{font-weight:340}
[data-theme="dark"] .wiki-info__body p,[data-theme="dark"] .wiki-full p,[data-theme="dark"] .note{font-weight:260;color:color-mix(in srgb,var(--foreground) 86%,var(--muted));font-synthesis:none}
.nd text{font-weight:370;letter-spacing:.012em}
.nd.sp text{font-weight:340}
[data-theme="dark"] .nd text{font-weight:320}
[data-theme="dark"] .nd.sp text{font-weight:290}
.nd.sel text,.nd.onp text{font-weight:500}
[data-theme="dark"] .nd.sel text{font-weight:470}
/* Wikipedia kartı ile yerel not birbirine karışmasın */
.wiki-info{margin:16px 0 14px!important;padding:14px 0 12px;border-top:1px solid var(--separator)!important;border-bottom:1px solid var(--separator)!important}
.wiki-info__lang{font-weight:540;color:var(--muted)}

/* odak modu (K): yalnızca ağaç kalır */
.topbar,.bbar,#detail,.cpt,.side{transition:opacity .4s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
body.zen .topbar,body.zen .bbar,body.zen #detail,body.zen .cpt,body.zen .side,body.zen .legend,body.zen #toast{opacity:0!important;pointer-events:none!important}
body.zen .topbar{transform:translateY(-14px)}
body.zen .bbar{transform:translateY(14px)}
body.zen #zpane{display:none!important}
.bb-zen{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 12px 0 14px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-brd);box-shadow:var(--glass-sh);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);color:var(--foreground);font-size:13px;font-weight:520;cursor:pointer}
.bb-zen:hover{background:var(--glass-strong)}
kbd,.bb-zen kbd,#zenBack kbd{font:580 11px/1 var(--sans);min-width:22px;height:22px;display:inline-grid;place-items:center;border-radius:7px;background:var(--default);color:var(--muted);border:1px solid var(--border);padding:0 6px}
@media (max-width:1200px){.bb-zen .bb-l{display:none}}
@media (hover:none){.bb-zen{width:46px;padding:0;justify-content:center}.bb-zen kbd{display:none}}
#zenBack{position:fixed;left:50%;bottom:20px;transform:translate(-50%,10px);z-index:90;display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 14px 0 16px;border-radius:999px;background:var(--glass-strong);border:1px solid var(--glass-brd);box-shadow:0 14px 38px rgba(10,20,50,.25);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);color:var(--foreground);font-size:13px;font-weight:520;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .5s ease,transform .5s ease}
body.zen #zenBack{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
body.zen.zen-dim #zenBack{opacity:.28}
body.zen.zen-dim #zenBack:hover{opacity:1}
@media (hover:none){#zenBack kbd{display:none}}
@media (max-width:820px){.bb-zen{display:none}}
.wiki-info__foot{flex-wrap:wrap;row-gap:6px}
.wiki-info__lang{flex:1 1 100%;line-height:1.4}
.wiki-info__source{white-space:nowrap}
.wiki-info__warn{display:flex;gap:9px;align-items:flex-start;padding:10px 12px;margin:2px 0 10px;border-radius:14px;background:color-mix(in srgb,#f5a524 15%,transparent);color:color-mix(in srgb,#9a5b00 85%,var(--foreground));font-size:12.5px;line-height:1.5}
.wiki-info__warn svg{flex:none;margin-top:1px}
[data-theme="dark"] .wiki-info__warn{color:#ffcc7a}
.wiki-info__tr{display:inline-flex;align-items:center;gap:7px;margin:10px 0 2px;min-height:36px;padding:7px 14px;border-radius:999px;background:var(--default);color:var(--foreground);font-size:13px;font-weight:500;text-decoration:none}
.wiki-info__tr:hover{background:color-mix(in srgb,var(--accent) 16%,var(--default))}