/* menü çubuğu: macOS menü çubuğunun ölçüleri (24px, 13px SF, seçimde sistem mavisi).
   Bağlantılar HTML'de duruyor (arama motoru görür); JS yalnız aç/kapa, klavye ve saat. */
:root{--mb-h:24px;--mb-blue:#2f7fe0;--mb-ink:#1c2b3a}
body{padding-top:var(--mb-h)}
.mb{
  position:fixed;top:0;left:0;right:0;z-index:100;height:var(--mb-h);
  display:flex;align-items:center;gap:0;padding:0 8px;
  font:400 13px/1 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;
  color:var(--mb-ink);user-select:none;-webkit-user-select:none;
}
/* bulanıklık ayrı katmanda: çubuğun kendisi backdrop kökü olmasın ki açılan menüler de arkalarını bulanıklaştırabilsin */
.mb::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:rgba(255,255,255,.14);-webkit-backdrop-filter:saturate(190%) blur(30px);backdrop-filter:saturate(190%) blur(30px)}
.mb a{color:inherit;text-decoration:none}
.mb-logo{display:flex;align-items:center;justify-content:center;width:30px;height:20px;border-radius:4px;margin-right:2px}
.mb-logo img{width:18px;height:18px;display:block}
.mb-logo:hover,.mb-logo:focus-visible{background:rgba(0,0,0,.08);outline:0}
.mb-m{position:relative}
.mb-t{
  all:unset;box-sizing:border-box;height:20px;padding:0 9px;border-radius:4px;
  display:flex;align-items:center;cursor:default;white-space:nowrap;
}
.mb-t.mb-app{font-weight:700}
.mb-t:hover{background:rgba(0,0,0,.06)}
.mb-t[aria-expanded="true"],.mb-t:focus-visible{background:rgba(0,0,0,.12);outline:0}
.mb-sp{flex:1}
.mb-hi{padding:0 9px;white-space:nowrap}

/* açılan menü */
.mb-d{
  position:absolute;top:calc(100% + 3px);left:0;min-width:220px;padding:5px;
  display:none;flex-direction:column;
  background:rgba(246,250,253,.7);-webkit-backdrop-filter:saturate(190%) blur(30px);backdrop-filter:saturate(190%) blur(30px);
  border-radius:7px;box-shadow:0 0 0 .5px rgba(0,0,0,.18),0 10px 30px rgba(20,50,80,.22);
}
.mb-m.open>.mb-d{display:flex;animation:mbIn .12s ease-out}
@keyframes mbIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.mb-d a,.mb-i{
  all:unset;box-sizing:border-box;display:flex;align-items:center;gap:6px;
  min-height:22px;padding:3px 10px;border-radius:4px;cursor:default;white-space:nowrap;color:var(--mb-ink);
}
.mb-d a:hover,.mb-d a:focus-visible,.mb-i:not(.off):hover,.mb-i:focus-visible{
  background:var(--mb-blue);color:#fff;outline:0
}
.mb-d a:hover .k,.mb-d a:focus-visible .k,.mb-i:hover .k{color:rgba(255,255,255,.85)}
.mb-d a[aria-current="page"]{font-weight:600}
a.mb-t[aria-current="page"]{background:rgba(0,0,0,.08)}
.mb-i.off{color:#9aa8b5}
.k{margin-left:auto;padding-left:24px;color:#8796a5;font-size:12px}
.mb-g{display:block;height:6px}
.mb-d .n{display:inline-block;min-width:20px;color:#8796a5;font-variant-numeric:tabular-nums}
.mb-d a:hover .n,.mb-d a:focus-visible .n{color:rgba(255,255,255,.8)}


.mb-spot{padding:0 8px}
.mb-spot svg{display:block}

/* Spotlight (Damla 19 Eki: "apple gibi olsun"): macOS Spotlight paneli; bulanıklık ve yuvarlak köşe yalnız burada */
.spot-bg{position:fixed;inset:0;z-index:1000}
.spot-bg[hidden]{display:none}
.spot{
  position:absolute;left:50%;top:22vh;transform:translateX(-50%);
  width:min(640px,calc(100vw - 24px));overflow:hidden;
  background:rgba(242,242,247,.72);-webkit-backdrop-filter:saturate(180%) blur(40px);backdrop-filter:saturate(180%) blur(40px);
  border-radius:16px;box-shadow:0 0 0 .5px rgba(0,0,0,.2),0 24px 80px rgba(0,0,0,.28),0 4px 14px rgba(0,0,0,.08);
  font:400 14px/1.3 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;color:#1d1d1f;
  animation:spotIn .16s ease-out;
}
@keyframes spotIn{from{opacity:0;transform:translateX(-50%) scale(.97)}to{opacity:1;transform:translateX(-50%)}}
.spot-f{display:flex;align-items:center;gap:12px;height:56px;padding:0 18px}
.spot-f svg{width:21px;height:21px;flex:none;color:#6e6e73}
.spot-f input{all:unset;flex:1;min-width:0;height:100%;font-size:22px;font-weight:400;letter-spacing:-.01em;color:#1d1d1f;caret-color:var(--mb-blue)}
.spot-f input::placeholder{color:rgba(60,60,67,.45)}
.spot-r{border-top:.5px solid rgba(0,0,0,.12);padding:6px;max-height:min(440px,58vh);overflow-y:auto;overscroll-behavior:contain}
.spot-r[hidden]{display:none}
.spot-i{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:14px;align-items:baseline;
  padding:7px 12px;border-radius:9px;cursor:default}
.spot-n,.spot-s{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.spot-n{font-size:14px;font-weight:500}
.spot-k{font-size:11px;color:#86868b}
.spot-s{grid-column:1 / -1;font-size:12px;color:#6e6e73;margin-top:1px}
.spot-i[aria-selected="true"]{background:var(--mb-blue)}
.spot-i[aria-selected="true"] .spot-n,.spot-i[aria-selected="true"] .spot-k,.spot-i[aria-selected="true"] .spot-s{color:#fff}
.spot-i[aria-selected="true"] .spot-k,.spot-i[aria-selected="true"] .spot-s{color:rgba(255,255,255,.85)}
.spot-no{padding:12px;font-size:13px;color:#86868b}

/* dar ekran: menüler çubuğun altında tam genişlik; alt menü yerinde açılır */
@media (max-width:640px){
  .mb{padding:0 4px}
  .mb-t{padding:0 7px}
  .mb-t.mb-app{display:none}
  .mb-hi{display:none}
  .spot{top:calc(var(--mb-h) + 14px)}
  .spot-f{height:52px;padding:0 14px}
  .spot-f input{font-size:20px}
  .mb-m{position:static}
  .mb-d{position:fixed;top:calc(var(--mb-h) + 2px);left:6px;right:6px;min-width:0;max-height:72vh;overflow-y:auto;overscroll-behavior:contain}
  .mb-d{background:rgba(246,250,253,.9)}
  .mb-d a,.mb-i{min-height:40px;font-size:15px}
  .mb-d .k{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:14px}
}
@media (prefers-reduced-motion:reduce){.mb-m.open>.mb-d,.spot{animation:none}}
html{scroll-padding-top:var(--mb-h)}