/* Sıcak gece: tüm sayfaların ortak yazı tipleri, renkleri, ışık böcekleri ve menüsü */
@font-face { font-family:'Fraunces'; src:url(/static/fonts/fraunces-latin-wght-normal.woff2) format('woff2-variations'); font-weight:100 900; font-display:swap; unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fraunces'; src:url(/static/fonts/fraunces-latin-ext-wght-normal.woff2) format('woff2-variations'); font-weight:100 900; font-display:swap; unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Literata'; src:url(/static/fonts/literata-latin-wght-normal.woff2) format('woff2-variations'); font-weight:200 900; font-display:swap; unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Literata'; src:url(/static/fonts/literata-latin-ext-wght-normal.woff2) format('woff2-variations'); font-weight:200 900; font-display:swap; unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2C60-2C7F,U+A720-A7FF; }

:root {
  color-scheme:dark;
  --bg1:#1a1410; --bg2:#2a1d14; --ink:#f3e9dc; --muted:#c2b39f; --gold:#e8b86a; --leaf:#8fbf7a;
  --branch:#8a5a3b; --glass:rgba(34,25,18,.86); --card:rgba(52,38,27,.55); --line:rgba(255,235,205,.15);
  --danger:#f09a9a; --disp:'Fraunces', Georgia, serif; --text:'Literata', Georgia, 'Times New Roman', serif;
  --dock:0px;
}
* { box-sizing:border-box; }
body { margin:0; background:radial-gradient(120% 90% at 50% 0%, var(--bg2), var(--bg1)) fixed var(--bg1); color:var(--ink); font:18px/1.6 var(--text); }
button, input, select, textarea { font:inherit; color:inherit; }
a { color:var(--gold); text-underline-offset:.18em; }
::selection { background:rgba(232,184,106,.35); }
:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
h1, h2, h3 { font-family:var(--disp); font-weight:600; line-height:1.15; }

/* ışık böcekleri */
#sky { position:fixed; inset:0; pointer-events:none; overflow:hidden; }
#sky i { position:absolute; width:4px; height:4px; border-radius:50%; background:var(--gold); box-shadow:0 0 12px 4px rgba(232,184,106,.55); opacity:0; animation:drift var(--d) ease-in-out var(--w) infinite; }
@keyframes drift { 0%{opacity:0; transform:translate(0,0)} 15%{opacity:.9} 50%{transform:translate(var(--x),var(--y))} 85%{opacity:.8} 100%{opacity:0; transform:translate(calc(var(--x)*2),calc(var(--y)*.4))} }

/* üst çubuk */
.topbar { display:flex; gap:14px; align-items:center; padding:8px 14px; min-height:58px; background:var(--glass); backdrop-filter:blur(10px); border:1px solid var(--line); border-radius:16px; z-index:20; }
.logo { display:flex; align-items:center; gap:9px; text-decoration:none; color:var(--ink); font:600 1.2rem/1 var(--disp); white-space:nowrap; }
.logo img { width:30px; height:30px; display:block; }

/* ana menü: geniş ekranda çubuğun içinde, telefonda altta */
.mainnav { margin-left:auto; display:flex; gap:6px; align-items:center; font-size:16px; }
.mainnav > a, .more > summary { display:flex; align-items:center; gap:7px; padding:7px 12px; border-radius:99px; color:var(--muted); text-decoration:none; cursor:pointer; list-style:none; transition:color .2s, background .2s; }
.more > summary::-webkit-details-marker { display:none; }
.mainnav > a:hover, .more > summary:hover, .more[open] > summary { color:var(--ink); background:rgba(255,235,205,.08); }
.mainnav > a.on { color:var(--gold); }
.mainnav > a.add { background:var(--gold); color:#2a1a08; font-weight:600; margin:0 4px; transition:transform .2s; }
.mainnav > a.add:hover { background:var(--gold); color:#2a1a08; transform:translateY(-1px); }
.mainnav .i { width:20px; height:20px; flex:none; }
.more { position:relative; }
.menu { position:absolute; right:0; top:calc(100% + 12px); min-width:250px; padding:6px; background:#2a1d14; border:1px solid var(--line); border-radius:14px; box-shadow:0 16px 40px rgba(0,0,0,.55); }
.menu form { margin:0; }
.menu a, .menu button { display:block; width:100%; padding:11px 12px; border:0; border-radius:9px; background:none; color:var(--ink); text-align:left; text-decoration:none; cursor:pointer; }
.menu a:hover, .menu button:hover { background:rgba(232,184,106,.16); }
.menu small { display:block; color:var(--muted); font-size:.82em; }

/* ortak düğme */
.pill { display:inline-block; background:var(--gold); color:#2a1a08 !important; border:0; border-radius:99px; padding:8px 18px; font-weight:600; cursor:pointer; text-decoration:none; transition:transform .2s; }
.pill:hover { transform:translateY(-1px); }
.pill.big { padding:12px 24px; font-size:1.05em; }

@media (max-width:720px) {
  :root { --dock:calc(64px + env(safe-area-inset-bottom)); }
  /* backdrop-filter altındaki sabit menüyü çubuğa hapseder */
  .topbar { backdrop-filter:none; background:rgba(34,25,18,.96); gap:10px; padding:6px 10px; min-height:52px; }
  .mainnav { position:fixed; left:0; right:0; bottom:0; z-index:30; display:grid; grid-template-columns:repeat(4, 1fr); gap:0; margin:0; padding:0 4px env(safe-area-inset-bottom); height:var(--dock); background:#221912; border-top:1px solid var(--line); font-size:14px; }
  .mainnav > a, .more > summary { flex-direction:column; justify-content:center; gap:3px; height:64px; padding:0; border-radius:0; }
  .mainnav > a:hover, .more > summary:hover, .more[open] > summary { background:none; }
  .mainnav > a.add, .mainnav > a.add:hover { background:none; color:var(--gold); margin:0; transform:none; }
  .mainnav > a.add .i { box-sizing:content-box; width:18px; height:18px; padding:3px 12px; border-radius:99px; background:var(--gold); color:#2a1a08; }
  .more { position:static; }
  .menu { top:auto; bottom:calc(100% + 8px); right:8px; left:8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-delay:0s !important; transition-duration:.01ms !important; }
  #sky { display:none; }
}