@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: block; src: url("/assets/fonts/IBMPlexSans-Regular-Latin1.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: block; src: url("/assets/fonts/IBMPlexSans-Regular-Latin2.woff2") format("woff2"); unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: block; src: url("/assets/fonts/IBMPlexSans-Regular-Pi.woff2") format("woff2"); unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: block; src: url("/assets/fonts/IBMPlexSans-Bold-Latin1.woff2") format("woff2"); unicode-range: U+0000, U+000D, U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: block; src: url("/assets/fonts/IBMPlexSans-Bold-Latin2.woff2") format("woff2"); unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 700; font-display: block; src: url("/assets/fonts/IBMPlexSans-Bold-Pi.woff2") format("woff2"); unicode-range: U+0E3F, U+2000-200D, U+2015, U+2028-2029, U+202F, U+2032-2033, U+2070, U+2074-2079, U+2080-2089, U+2113, U+2116, U+2126, U+212E, U+2150-2151, U+2153-215E, U+2190-2199, U+21A9-21AA, U+21B0-21B3, U+21B6-21B7, U+21BA-21BB, U+21C4, U+21C6, U+2202, U+2206, U+220F, U+2211, U+2215, U+221A, U+221E, U+222B, U+2248, U+2260, U+2264-2265, U+25CA, U+2713, U+274C, U+2B0E-2B11, U+ECE0, U+EFCC, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: block; src: url("/assets/fonts/IBMPlexMono-Regular-Latin1.woff2") format("woff2"); unicode-range: U+0020-007E, U+00A0-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122, U+2212, U+FB01-FB02; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: block; src: url("/assets/fonts/IBMPlexMono-Regular-Latin2.woff2") format("woff2"); unicode-range: U+0100-0101, U+0104-0130, U+0132-0151, U+0154-017F, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01FA-01FF, U+0218-021B, U+0237, U+0259, U+1E80-1E85, U+1E9E, U+20A1, U+20A4, U+20A6, U+20A8-20AA, U+20AD-20AE, U+20B1-20B2, U+20B4-20B5, U+20B8-20BA, U+20BD, U+20BF; }

/* celilozuak.com · Takımyıldız giriş sayfası. Satır içi stil yok; hareketler prefers-reduced-motion'a uyar. */
:root {
  --bg: #04060B; --text: #E8EEF6; --dim: #8A96A8; --faint: #4B5566; --line: rgba(120,150,210,.16);
  --cy: #3FE0D0; --vi: #8B7CFF; --pk: #FF6FB5;
  --sans: "IBM Plex Sans", system-ui, sans-serif; --mono: "IBM Plex Mono", ui-monospace, monospace;
  --ease: cubic-bezier(.2,.75,.2,1);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { background: var(--bg); color: var(--text); font: 400 17px/1.65 var(--sans); overflow-x: hidden; -webkit-font-smoothing: antialiased; }
html.intro-on body { overflow: hidden; }
a { color: inherit; }
::selection { background: rgba(63,224,208,.3); }
.skip { position: absolute; left: -9999px; z-index: 100; }
.skip:focus { left: 16px; top: 16px; background: var(--cy); color: #000; padding: 8px 12px; }
:focus-visible { outline: 2px solid var(--cy); outline-offset: 3px; border-radius: 4px; }
#ad:focus { outline: none; }

/* güvenlik zamanlayıcısı: site.js yüklenemezse giriş 7 sn sonra kendiliğinden kalkar, ad ve cümle görünür */
@keyframes gizle { to { opacity: 0; visibility: hidden; } }
@keyframes goster { to { opacity: 1; transform: none; } }

/* giriş */
#intro { display: none; position: fixed; inset: 0; z-index: 50; background: var(--bg); transition: opacity .8s var(--ease), visibility .8s; }
html.intro-on #intro { display: block; animation: gizle .6s 7s forwards; }
#intro.out { display: block; }
#intro.out { opacity: 0; visibility: hidden; }
#ic { position: absolute; inset: 0; width: 100%; height: 100%; }
#boot { position: absolute; left: 32px; bottom: 32px; margin: 0; padding: 0; list-style: none; font: 13px/1.7 var(--mono); color: var(--dim); transition: opacity .5s; }
#boot.gizli { opacity: 0; }
#boot li { opacity: 0; transform: translateY(6px); animation: bootIn .25s var(--ease) forwards; }
#boot .ok { color: var(--cy); }
#boot .hd { color: var(--text); }
@keyframes bootIn { to { opacity: 1; transform: none; } }
#atla { position: absolute; right: 28px; bottom: 28px; background: rgba(255,255,255,.06); color: var(--text); border: 1px solid var(--line); border-radius: 999px; padding: 10px 16px; font: 400 14px var(--sans); cursor: pointer; display: inline-flex; gap: 10px; align-items: center; }
#atla:hover { background: rgba(255,255,255,.12); }
#atla kbd { font: 11px var(--mono); border: 1px solid var(--line); border-radius: 4px; padding: 1px 5px; color: var(--dim); }

/* arka plan ağı ve imleç ışığı */
#bg { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; opacity: 0; transition: opacity 1.4s var(--ease); pointer-events: none; }
html.ready #bg { opacity: 1; }
.glow { position: fixed; left: 0; top: 0; width: 560px; height: 560px; margin: -280px 0 0 -280px; border-radius: 50%; pointer-events: none; z-index: 1; background: radial-gradient(circle, rgba(63,224,208,.10), rgba(139,124,255,.06) 40%, transparent 70%); transform: translate3d(-999px,-999px,0); }

/* kahraman */
.hero { position: relative; z-index: 2; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 80px 8vw 120px; max-width: 1500px; margin: 0 auto; }
#ad { margin: 0; font: 700 clamp(64px, 11vw, 168px)/1 var(--sans); letter-spacing: -.045em; color: #fff; }
#ad .w { display: inline-block; background: linear-gradient(180deg, #fff 30%, #B9C6DA); -webkit-background-clip: text; background-clip: text; color: transparent; }
html.intro-on #ad { opacity: 0; animation: goster .6s 7s forwards; }
.lead { margin: 28px 0 0; font-size: clamp(18px, 1.6vw, 22px); color: #B9C4D4; max-width: 720px; }
html.js .lead { transition: opacity 1s .15s var(--ease), transform 1s .15s var(--ease); }
html.intro-on .lead { opacity: 0; transform: translateY(18px); animation: goster .8s 7s forwards; }

@media (max-width: 900px) {
  .hero { padding: 80px 20px 110px; }
  .glow { display: none; }
  #boot { left: 18px; bottom: 80px; font-size: 12px; }
  #atla { right: 18px; bottom: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .lead, #ad { opacity: 1 !important; transform: none !important; }
  .glow { display: none; }
}

/* 404 */
body.yok .hero { padding-top: 60px; }
.kod { margin: 0 0 8px; font: 14px var(--mono); color: var(--cy); letter-spacing: .1em; }
.yok-b { margin: 0; font: 700 clamp(40px, 6vw, 72px)/1.05 var(--sans); letter-spacing: -.03em; }
.yok-l { margin: 24px 0 0; font-size: 18px; }
.yok-l a { color: var(--cy); text-underline-offset: 4px; }