/* ============================================================ SahaxEmoji = Noto Color Emoji (COLRv1), SIL Open Font License 1.1 Lisans metni: assets/fonts/OFL.txt (OFL geregi pakette bulunmali). Fontu DEGISTIRME: OFL'in Reserved Font Name kurali geregi degistirilmis surum "Noto" adini tasiyamaz. Degistirmiyoruz, CSS takma adi kullaniyoruz. Amac: emojinin isletim sistemine gore degismesini onlemek — ayni forma herkeste ayni gorunsun. ============================================================ */ @font-face { font-family: 'SahaxEmoji'; src: url('assets/fonts/NotoColorEmoji.woff2') format('woff2'); font-display: block; font-weight: normal; font-style: normal; } .sahax-emoji-sprite { display: inline-block; flex: 0 0 auto; pointer-events: none; image-rendering: auto; } /* Eski motorlar icin bitmap (CBDT) surum. 9 MB oldugu icin SADECE tespit betigi COLRv1'in bos cizdigini gorurse indirilir (o zamana kadar hicbir element bu aileyi kullanmaz, dolayisiyla tarayici dosyayi cekmez). */ @font-face { font-family: 'SahaxEmojiBmp'; src: url('assets/fonts/NotoColorEmoji-bmp.woff2') format('woff2'); font-display: block; font-weight: normal; font-style: normal; } /* fontembed-v3 (04.09.2026): forma yazi logosu fontlari (cosmetics.js LOGO_FONTS) da gomuldu  forma editoru artik cevrimdisi da dogru cizer. */ @font-face { font-family: 'Anton'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Anton-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Anton'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Anton-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Audiowide'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Audiowide-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Audiowide'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Audiowide-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Bangers'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Bangers-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Bangers'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Bangers-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Bebas Neue'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/BebasNeue-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Bebas Neue'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/BebasNeue-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Caveat'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Caveat-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Caveat'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Caveat-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Dancing Script'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/DancingScript-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Dancing Script'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/DancingScript-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Great Vibes'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/GreatVibes-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Great Vibes'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/GreatVibes-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Pacifico'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Pacifico-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Pacifico'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Pacifico-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Permanent Marker'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/PermanentMarker-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Righteous'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Righteous-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Righteous'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Righteous-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Russo One'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/RussoOne-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Russo One'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/RussoOne-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Satisfy'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Satisfy-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Shadows Into Light'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/ShadowsIntoLight-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Shadows Into Light'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/ShadowsIntoLight-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* fontembed-v2 (04.09.2026): Studio font seciciyle gelen aileler de gomuldu (Rajdhani/Poppins/Orbitron ek agirliklar + Press Start 2P). */ @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Orbitron-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Orbitron-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Orbitron-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 800; font-display: swap; src: url(assets/fonts/Orbitron-800-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 900; font-display: swap; src: url(assets/fonts/Orbitron-900-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Poppins-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Poppins-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Poppins-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Poppins-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Poppins-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Poppins-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Poppins-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Poppins-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; font-display: swap; src: url(assets/fonts/Poppins-800-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; font-display: swap; src: url(assets/fonts/Poppins-800-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Press Start 2P'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/PressStart2P-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Press Start 2P'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/PressStart2P-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Rajdhani-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Rajdhani-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Rajdhani-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Rajdhani-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Rajdhani-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Rajdhani-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Rajdhani-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Rajdhani-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* fontembed-v1 (04.09.2026) — Google Fonts pakete gomuldu. Onceden index.html fonts.googleapis.com'a baglaniyordu: internet yokken yazi tipi bozuluyor, her acilista Google'a kullanici IP'si gidiyordu. Sadece latin + latin-ext subsetleri (TR + EN). Lisans: OFL, bkz OFL.txt */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300; font-display: swap; src: url(assets/fonts/Inter-300-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300; font-display: swap; src: url(assets/fonts/Inter-300-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Inter-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Inter-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Inter-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Inter-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Inter-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Inter-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Inter-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Inter-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Orbitron-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Orbitron-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Orbitron-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 900; font-display: swap; src: url(assets/fonts/Orbitron-900-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Outfit-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 400; font-display: swap; src: url(assets/fonts/Outfit-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Outfit-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Outfit-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 800; font-display: swap; src: url(assets/fonts/Outfit-800-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Outfit'; font-style: normal; font-weight: 800; font-display: swap; src: url(assets/fonts/Outfit-800-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Rajdhani-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 500; font-display: swap; src: url(assets/fonts/Rajdhani-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Rajdhani-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 600; font-display: swap; src: url(assets/fonts/Rajdhani-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Rajdhani-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Rajdhani'; font-style: normal; font-weight: 700; font-display: swap; src: url(assets/fonts/Rajdhani-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } :root { --bg-dark-base: #030712; --bg-dark-surface: #090f1d; --bg-dark-surface-2: #111a2e; --glass-bg: rgba(9, 15, 29, 0.65); --glass-border: rgba(255, 255, 255, 0.07); --glass-border-focus: rgba(0, 240, 255, 0.35); --glass-blur: 16px; --glass-saturate: 190%; --accent-cyan: #00f0ff; --accent-purple: #bd00ff; --accent-pink: #ff007f; --accent-gold: #ffd700; --accent-emerald: #39ff14; --accent-blue: #3b82f6; --line-color: rgba(255, 255, 255, 0.09); --text-main: #ffffff; --text-sub: #94a3b8; --text-muted: #64748b; /* Calisan emoji fontu calisma aninda secilir (index.html tespit betigi). COLRv1 desteklemeyen motorlarda glif BOS cizilirdi; artik otomatik bitmap surume, o da olmazsa sistem emojisine geciyor. */ --font-emoji: 'SahaxEmoji'; --font-inter: 'Inter', var(--font-emoji), sans-serif; --font-outfit: 'Outfit', var(--font-emoji), sans-serif; --font-orbitron: 'Orbitron', var(--font-emoji), sans-serif; /* Map legacy and sx variables */ --bg: var(--bg-dark-base); --panel: var(--bg-dark-surface); --panel-2: var(--bg-dark-surface-2); --line: var(--line-color); --text: var(--text-main); --muted: var(--text-sub); --blue: var(--accent-blue); --red: #ef4444; --green: #22c55e; --yellow: var(--accent-gold); --app-vw: 100vw; --app-vh: 100dvh; --sx-bg: var(--bg-dark-base); --sx-surface: var(--glass-bg); --sx-surface-2: var(--bg-dark-surface-2); --sx-cyan: var(--accent-cyan); --sx-blue: var(--accent-blue); } * { box-sizing: border-box; } html, body { margin: 0; min-height: 100%; background: var(--bg); color: var(--text); font-family: var(--font-inter); } body { min-height: 100dvh; overflow: hidden !important; overscroll-behavior: none; touch-action: pan-x pan-y; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; } .hidden { display: none !important; } .app, .flow, .flow-card, .field-card, .canvas-wrap, .mobile-nav, .mobile-nav-right, .team-lobby-overlay, .team-lobby-popup, .mobile-popup, .hud, button, [role="button"], .play-choice { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; } button, input, select { font: inherit; } button { min-height: 48px; border: 0; border-radius: 8px; color: white; background: #334155; font-weight: 850; cursor: pointer; touch-action: manipulation; transition: transform 0.1s ease, background 0.15s ease; } button:active:not(:disabled) { transform: scale(0.96); } button:disabled { cursor: not-allowed; opacity: 0.48; } input, select { width: 100%; min-height: 40px; border: 1px solid var(--line); border-radius: 8px; background: #08111f; color: var(--text); padding: 9px 10px; outline: none; } input, textarea, select, [contenteditable="true"] { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; } input[type="range"] { padding: 0; min-height: 26px; accent-color: #38bdf8; } .app { width: min(100%, 1280px); margin: 0 auto; padding: 14px; } .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 12px; } .brand-head { display: flex; align-items: center; gap: 12px; min-width: 0; } .brand-logo { width: clamp(70px, 10vw, 112px); height: auto; flex: 0 0 auto; transform: translateX(7.5%); filter: drop-shadow(0 14px 24px rgba(14, 165, 233, 0.26)); } .brand-copy { min-width: 0; } h1 { margin: 0 0 5px; font-size: clamp(1.45rem, 2.6vw, 2.25rem); line-height: 1.05; letter-spacing: 0; } .sub { margin: 0; color: var(--muted); font-size: 0.92rem; line-height: 1.4; } .pill { display: inline-flex; align-items: center; min-height: 36px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); padding: 7px 10px; color: #dbeafe; font-size: 0.86rem; font-weight: 800; white-space: nowrap; } #connectionPill { display: none; } .layout { display: grid; grid-template-columns: minmax(0, 1fr) 350px; gap: 12px; align-items: start; } .field-card, .side { border: 1px solid var(--line); border-radius: 8px; background: var(--panel); box-shadow: 0 22px 44px rgba(0, 0, 0, 0.28); } .field-card { position: relative; } .field-head { display: flex; justify-content: center; align-items: center; padding: 6px 10px; border-bottom: 0; pointer-events: none; z-index: 12; } .field-head[hidden] { display: none !important; } .match-head-inner { position: relative; display: flex; justify-content: center; align-items: center; } .match-bar { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border-radius: 8px; background: rgba(8, 17, 31, 0.88); border: 1px solid rgba(255,255,255,0.16); padding: 5px 8px; box-shadow: 0 10px 26px rgba(0,0,0,0.32); pointer-events: auto; } .score { display: flex; align-items: center; justify-content: center; min-width: 58px; min-height: 34px; border-radius: 7px; background: rgba(2, 6, 23, 0.82); font-size: 1.55rem; font-weight: 950; letter-spacing: 0; border: 1px solid rgba(255,255,255,0.1); } .match-clock { min-width: 86px; min-height: 34px; display: grid; place-items: center; border-radius: 7px; background: rgba(15, 23, 42, 0.9); color: #f8fafc; font-size: 1.25rem; font-weight: 950; font-variant-numeric: tabular-nums; border: 1px solid rgba(255,255,255,0.12); } .match-meta { position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 8px; color: #f8fafc; font-size: 0.74rem; font-weight: 900; letter-spacing: 0; white-space: nowrap; text-shadow: 0 2px 8px rgba(2, 6, 23, 0.75); pointer-events: none; } .match-status { display: inline-flex; align-items: center; gap: 6px; min-height: 0; padding: 0; color: inherit; white-space: nowrap; } .ping-dot { width: 8px; height: 8px; border-radius: 50%; background: #94a3b8; box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.16); } .ping-dot.good { background: #22c55e; box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.18); } .ping-dot.mid { background: #eab308; box-shadow: 0 0 0 2px rgba(234, 179, 8, 0.2); } .ping-dot.bad { background: #ef4444; box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2); } .connection-badge { color: #f8fafc; } .danger-time, .match-clock.danger-time { animation: scoreAlarm 1s ease infinite; border-color: rgba(239, 68, 68, 0.6); color: #fecaca; } @keyframes scoreAlarm { 0%, 100% { background: #08111f; } 50% { background: rgba(185, 28, 28, 0.22); } } .score.blue { color: var(--team-home-bright, #6cf7ff); } .score.red { color: var(--team-away-bright, #ff6fdb); } .mini { color: var(--muted); font-size: 0.84rem; line-height: 1.35; } .canvas-wrap { position: relative; overflow: hidden; touch-action: none; -webkit-user-select: none; user-select: none; background: var(--green); } canvas { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: var(--green); transform: translateX(var(--field-x-offset, 0px)); transition: transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .avatar-field-preview-canvas, .custom-jersey-preview, .market-player-canvas, .market-cosmetic-canvas { background: transparent !important; aspect-ratio: auto !important; } .hud { position: absolute; left: 10px; bottom: 10px; font-weight: 700; border-radius: 8px; background: rgba(0, 0, 0, 0.48); padding: 6px 10px; color: #e2e8f0; font-size: 0.9rem; pointer-events: none; z-index: 4; } .pass-request-button { position: absolute; top: 13%; right: 4.7%; width: var(--pass-btn-size, clamp(56px, 7.4vw, 86px)); height: var(--pass-btn-size, clamp(56px, 7.4vw, 86px)); min-height: 0; border-radius: 50%; border: 2px solid var(--pass-btn-border-color, rgba(245, 158, 11, 0.7)); background: var(--pass-btn-bg, rgba(245, 158, 11, 0.08)); color: var(--pass-btn-color, #fff7ad); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28); z-index: 5; pointer-events: auto; touch-action: none; user-select: none; -webkit-user-select: none; display: flex; align-items: center; justify-content: center; padding: 0; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); backdrop-filter: blur(4px); opacity: var(--pass-btn-opacity, 0.8); } .pass-request-button:active, .pass-request-button.active { background: rgba(245, 158, 11, 0.24) !important; border-color: rgba(251, 191, 36, 1) !important; color: #fff !important; box-shadow: 0 0 16px rgba(250, 204, 21, 0.4) !important; } .pass-request-button.hidden { display: none; } .dribble-button { position: absolute; top: calc(13% + clamp(66px, 8.8vw, 102px)); right: 5.2%; width: var(--sprint-btn-size, clamp(56px, 7.4vw, 86px)); height: var(--sprint-btn-size, clamp(56px, 7.4vw, 86px)); min-height: 0; border-radius: 50%; border: 2px solid var(--sprint-btn-border-color, rgba(6, 182, 212, 0.7)); background: var(--sprint-btn-bg, rgba(6, 182, 212, 0.08)); color: var(--sprint-btn-color, #e0f2fe); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28); z-index: 5; pointer-events: auto; touch-action: none; user-select: none; -webkit-user-select: none; display: flex; align-items: center; justify-content: center; padding: 0; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); backdrop-filter: blur(4px); opacity: var(--sprint-btn-opacity, 0.8); } .dribble-button.ready { background: rgba(6, 182, 212, 0.08) !important; border-color: rgba(6, 182, 212, 0.7) !important; color: #e0f2fe !important; } .dribble-button.active { background: rgba(34, 197, 94, 0.28) !important; border-color: rgba(34, 197, 94, 1) !important; color: #fff !important; box-shadow: 0 0 16px rgba(34, 197, 94, 0.4) !important; } .dribble-button.cooldown { background: rgba(15, 23, 42, 0.45) !important; border-color: rgba(148, 163, 184, 0.4) !important; color: #94a3b8 !important; opacity: 0.65; } .dribble-button.hidden { display: none; } .action-btn-container { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; gap: 2px; } .action-btn-icon { width: clamp(20px, 2.8vw, 32px); height: clamp(20px, 2.8vw, 32px); stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.2s ease; } .pass-request-button:active .action-btn-icon, .dribble-button:active .action-btn-icon { transform: scale(1.15); } .action-btn-label { font-size: clamp(0.52rem, 0.78vw, 0.66rem); font-weight: 850; text-transform: uppercase; letter-spacing: 0.2px; white-space: nowrap; } .advanced-aim-arrow { position: absolute; left: 0; top: 0; width: 1px; height: 1px; z-index: 10; pointer-events: none; opacity: 0; transform-origin: 0 50%; } .advanced-aim-arrow.show { opacity: 1; } .advanced-aim-arrow::before { content: ""; position: absolute; left: 0; top: calc(var(--aim-thickness, 26px) / -2); width: var(--aim-len, 80px); height: var(--aim-thickness, 26px); border-radius: 999px 12px 12px 999px; background: linear-gradient(90deg, rgba(255,255,255,0.04), var(--aim-color, #ff1744)), linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0)); clip-path: polygon(0 38%, calc(100% - 22px) 18%, 100% 50%, calc(100% - 22px) 82%, 0 62%); box-shadow: 0 0 18px var(--aim-glow, rgba(255, 23, 68, 0.34)), 0 0 20px rgba(2, 6, 23, 0.44); } .advanced-aim-arrow::after { display: none; } .advanced-move-arrow { position: absolute; left: 0; top: 0; width: 1px; height: 1px; z-index: 9; pointer-events: none; opacity: 0; transform-origin: 0 50%; } .advanced-move-arrow.show { opacity: 1; } .advanced-move-arrow::before { content: ""; position: absolute; left: 0; top: calc(var(--move-arrow-thickness, 26px) / -2); width: var(--move-arrow-len, 70px); height: var(--move-arrow-thickness, 26px); border-radius: 999px 12px 12px 999px; background: linear-gradient(90deg, rgba(255,255,255,0.02), var(--move-arrow-color, #00d2ff)), linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0)); clip-path: polygon(0 38%, calc(100% - 22px) 18%, 100% 50%, calc(100% - 22px) 82%, 0 62%); box-shadow: 0 0 18px var(--move-arrow-glow, rgba(0, 210, 255, 0.34)), 0 0 20px rgba(2, 6, 23, 0.44); } .advanced-move-arrow::after { display: none; } .ping-badge { position: absolute; left: 10px; bottom: 46px; border-radius: 6px; background: rgba(0, 0, 0, 0.38); padding: 4px 8px; color: #94a3b8; font-size: 0.72rem; font-weight: 700; pointer-events: none; z-index: 4; } .canvas-score-overlay { position: absolute; top: 8px; right: 8px; display: flex; align-items: center; gap: 6px; background: rgba(2, 6, 23, 0.78); border: 1px solid rgba(255,255,255,0.2); border-radius: 10px; padding: 4px 10px; font-size: 1.4rem; font-weight: 950; z-index: 4; pointer-events: none; } .canvas-score-overlay .s-blue { color: #60a5fa; } .canvas-score-overlay .s-dash { color: #64748b; margin: 0 4px; } .canvas-score-overlay .s-red { color: #fb7185; } .mobile-joystick { display: none; position: absolute; left: 16px; bottom: 16px; width: calc(var(--joystick-size, 120px) * var(--joystick-scale, 1)); height: calc(var(--joystick-size, 120px) * var(--joystick-scale, 1)); border: 2.5px solid var(--joystick-color, rgba(255, 255, 255, 0.45)); border-radius: 50%; background: radial-gradient(circle at center, rgba(255, 255, 255, 0.18), rgba(2, 6, 23, 0.42)), rgba(2, 6, 23, 0.28); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.38); pointer-events: auto; touch-action: none; z-index: 2; opacity: var(--joystick-opacity, 0.78); } #leftJoystick { --joystick-size: var(--left-joystick-size, 120px); --joystick-opacity: var(--left-joystick-opacity, 0.78); --joystick-color: var(--left-joystick-color, rgba(255, 255, 255, 0.45)); } #rightJoystick { --joystick-size: var(--right-joystick-size, 120px); --joystick-opacity: var(--right-joystick-opacity, 0.78); --joystick-color: var(--right-joystick-color, rgba(255, 255, 255, 0.45)); } .joystick-knob { position: absolute; left: 50%; top: 50%; width: calc(clamp(32px, 6vmin, 48px) * var(--joystick-scale, 1)) !important; height: calc(clamp(32px, 6vmin, 48px) * var(--joystick-scale, 1)) !important; border: 2px solid rgba(255, 255, 255, 0.85); border-radius: 50%; background: rgba(37, 99, 235, 0.94); transform: translate(-50%, -50%); box-shadow: 0 8px 24px rgba(37, 99, 235, 0.45); } .mobile-joystick.active { display: block; transform: translate(-50%, -50%); z-index: 11; } .mobile-joystick.aim-only { opacity: 0 !important; pointer-events: none !important; } .mobile-joystick.active.aim-only { display: block !important; width: clamp(48px, 10vmin, 74px) !important; height: clamp(48px, 10vmin, 74px) !important; border: 2px solid rgba(125, 211, 252, 0.88) !important; background: radial-gradient(circle at center, rgba(125, 211, 252, 0.22), rgba(14, 165, 233, 0.08) 58%, rgba(2, 6, 23, 0.22)), rgba(2, 6, 23, 0.16) !important; box-shadow: 0 0 18px rgba(56, 189, 248, 0.34), 0 8px 22px rgba(2, 6, 23, 0.34) !important; transform: translate(-50%, -50%) !important; opacity: 0.58 !important; z-index: 11 !important; } .mobile-joystick.aim-only .joystick-knob { display: none; } .mobile-joystick.hide-knob .joystick-knob { display: none !important; } .mobile-joystick.active .joystick-knob { background: rgba(59, 130, 246, 0.96); } .mobile-panel-tabs { display: none; } .rotate-overlay { display: none; } .rotate-overlay.show { position: fixed; inset: 0; display: flex !important; align-items: center; justify-content: center; z-index: 10000; background: rgba(2, 6, 23, 0.88); pointer-events: auto !important; } .shoot { min-height: 58px; background: #1d4ed8; font-size: 1rem; } .ready, #readyMobileButton { background: linear-gradient(135deg, #facc15, #ca8a04); color: #111827; box-shadow: 0 4px 14px rgba(250,204,21,0.32); } .ready:hover, #readyMobileButton:hover { background: linear-gradient(135deg, #fde047, #eab308); } .ready.is-ready, #readyMobileButton.is-ready { background: linear-gradient(135deg, #22c55e, #15803d); color: #ffffff; box-shadow: 0 4px 14px rgba(34,197,94,0.34); } .ready.is-ready:hover, #readyMobileButton.is-ready:hover { background: linear-gradient(135deg, #4ade80, #16a34a); } .danger { background: linear-gradient(135deg, #b91c1c, #991b1b); } .danger:hover { background: linear-gradient(135deg, #dc2626, #b91c1c); } .blue-btn { background: linear-gradient(135deg, #2563eb, #1d4ed8); box-shadow: 0 4px 14px rgba(37,99,235,0.3); } .blue-btn:hover { background: linear-gradient(135deg, #3b82f6, #2563eb); } .yellow-btn { background: #b45309; } .side { display: grid; gap: 10px; padding: 10px; } .section { border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); padding: 11px; } .section h2 { margin: 0 0 10px; font-size: 1rem; letter-spacing: 0; } [data-panel="room"] { gap: 7px; } [data-panel="room"] h2 { margin-bottom: 6px; font-size: 0.9rem; } [data-panel="room"] button { min-height: 34px; padding: 6px 8px; font-size: 0.76rem; line-height: 1.12; font-weight: 800; } [data-panel="room"] input { min-height: 34px; padding: 7px 8px; font-size: 0.78rem; } #startMatchButton { min-height: 36px !important; padding: 7px 8px !important; font-size: 0.8rem !important; } #teamChangeRow button, #joinSpectatorRow button { min-height: 32px; font-size: 0.74rem; } #roomInfo { font-size: 0.72rem; line-height: 1.25; } #playersBox { gap: 5px; } #playersBox .player-line { padding: 5px 7px; font-size: 0.74rem; line-height: 1.2; } .row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .row.single { grid-template-columns: 1fr; } .stack { display: grid; gap: 8px; } .mode-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .tab-button { min-height: 40px; background: rgba(8, 17, 31, 0.72); color: #cbd5e1; border: 1px solid rgba(255,255,255,0.1); transition: background 0.15s, color 0.15s, transform 0.1s; } .tab-button.active { border-color: rgba(134, 239, 172, 0.9); background: linear-gradient(180deg, #4ade80, #16a34a); color: #04120a; box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2), 0 12px 24px rgba(34, 197, 94, 0.18); } .room-list, .chat-log { display: grid; gap: 8px; max-height: 220px; overflow: auto; } .mobile-popup .room-list, .mobile-popup .room-list-section, .mobile-popup .flow-list { max-height: none; overflow: visible; } .room-item, .chat-line { border-radius: 8px; background: rgba(8, 17, 31, 0.62); padding: 9px; } .room-main { display: flex; justify-content: space-between; gap: 10px; align-items: start; } .room-title, .chat-name { font-weight: 850; } .room-meta, .chat-text { color: #cbd5e1; font-size: 0.82rem; line-height: 1.35; } .badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; } .badge { border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 8px; padding: 3px 6px; color: #dbeafe; font-size: 0.72rem; font-weight: 800; display: inline-flex; align-items: center; gap: 4px; } .room-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 8px; } .room-actions button { min-height: 34px; font-size: 0.8rem; } .player-line, .history-line, .leader-line { display: flex; justify-content: space-between; gap: 10px; border-radius: 8px; background: rgba(8, 17, 31, 0.62); padding: 8px 9px; color: #e2e8f0; font-size: 0.86rem; } .muted { color: var(--muted); } .settings-grid { display: grid; gap: 9px; } .team-selector { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; } .team-card { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 8px; border: 2px solid var(--line); border-radius: 10px; background: rgba(8, 17, 31, 0.62); cursor: pointer; transition: border-color 0.18s, background 0.18s, transform 0.12s; touch-action: manipulation; -webkit-user-select: none; user-select: none; } .team-card:active { transform: scale(0.96); } .team-card.selected { border-color: #f8fafc; background: rgba(24, 36, 56, 0.78); } .team-card.auto-card.selected { border-color: #facc15; background: rgba(32, 28, 8, 0.72); } .team-dot { width: 36px; height: 36px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.65); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28); } .team-dot.blue { background: var(--team-home, #00E5FF); } .team-dot.red { background: var(--team-away, #FF2BD6); } /* Takim kimlik renkleri — Ayarlar > Goruntu > Takim Renkleri ile degisir. Degiskenler client_v2.js applyTeamColorVars() tarafindan yazilir, palet assets/cosmetics.js (SahaxTeamColors) icinde. */ .score.blue, .score-pill.blue { color: var(--team-home-bright, #6cf7ff) !important; } .score.red, .score-pill.red { color: var(--team-away-bright, #ff6fdb) !important; } .team-column.blue { border-color: rgba(var(--team-home-rgb, 0,229,255),0.45) !important; } .team-column.red { border-color: rgba(var(--team-away-rgb, 255,43,214),0.45) !important; } .team-column.blue .team-column-title { background: var(--team-home-deep, #00b8d4) !important; color: var(--team-home-contrast, #04232b) !important; } .team-column.red .team-column-title { background: var(--team-away-deep, #c0148f) !important; color: var(--team-away-contrast, #ffffff) !important; } .team-dot.random-dot { background: conic-gradient(var(--team-home, #00E5FF) 0deg 180deg, var(--team-away, #FF2BD6) 180deg 360deg); border-color: #facc15; } .team-label { color: #f8fafc; font-size: 0.78rem; font-weight: 850; text-align: center; line-height: 1.2; } .setting label { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 4px; color: #dbeafe; font-size: 0.84rem; font-weight: 800; } .summary { display: grid; gap: 7px; color: #e2e8f0; font-size: 0.88rem; } .toast { position: fixed; left: 50%; top: 20px; bottom: auto; transform: translateX(-50%) translateY(-12px); max-width: min(90vw, 520px); border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 10px; background: rgba(2, 6, 23, 0.96); color: white; padding: 12px 18px; font-size: 0.9rem; font-weight: 700; opacity: 0; pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease; z-index: 50; box-shadow: 0 8px 28px rgba(0,0,0,0.4); text-align: center; } .toast.visible { opacity: 1; transform: translateX(-50%) translateY(0); } .flow { position: fixed; inset: 0; z-index: 12; display: grid; place-items: center; padding: 18px; background: linear-gradient(rgba(8, 17, 31, 0.72), rgba(8, 17, 31, 0.9)), #16a34a; } .flow.hidden { display: none; } .flow-card.hidden { display: none; } .flow-card { width: min(460px, 100%); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 14px; background: rgba(16, 24, 39, 0.97); padding: 20px; box-shadow: 0 24px 56px rgba(0, 0, 0, 0.5); } .flow-card h2 { margin: 0 0 8px; font-size: 1.45rem; } .flow-card p { margin: 0 0 12px; color: var(--muted); line-height: 1.4; } .flow-actions { display: grid; gap: 9px; } .flow-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; } .play-setup { width: min(520px, 100%); } .play-setup-grid { display: grid; gap: 14px; } #playRoomPasswordSection { order: 80; } #screenPlaySetup .play-actions { order: 90; } .play-option-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .play-option-grid.single { grid-template-columns: 1fr; } .play-option-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); } .play-option-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); } .play-option-grid .wide-choice { grid-column: 1 / -1; } .play-choice { position: relative; min-height: 48px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 8px; background: rgba(8, 17, 31, 0.68); color: #e2e8f0; padding: 9px 10px; line-height: 1.12; overflow-wrap: anywhere; } .play-choice.selected { border-color: rgba(250, 204, 21, 0.78); background: rgba(30, 41, 59, 0.96); color: #ffffff; box-shadow: 0 8px 22px rgba(250, 204, 21, 0.16); } .play-choice.selected::before { content: "✓"; position: absolute; right: 8px; top: 6px; color: #facc15; font-weight: 950; } .play-training-options { margin-top: 10px; padding: 10px; border: 1px solid rgba(96,165,250,0.22); border-radius: 8px; background: rgba(15, 23, 42, 0.42); } .play-section-title { margin: 0 0 7px; color: #dbeafe; font-size: 0.82rem; font-weight: 900; } .play-actions { display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px; } .flow-list { display: grid; gap: 8px; max-height: min(42vh, 300px); overflow: auto; margin: 10px 0; } #screenSpectator { width: min(980px, 100%); } .flow-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; } .flow-card-head h2 { margin: 0 !important; } .flow-top-back { width: auto !important; min-height: 36px !important; padding: 7px 12px !important; border-radius: 10px !important; flex: 0 0 auto; font-size: 0.86rem !important; } #screenSpectator .flow-list { max-height: min(68vh, 560px); margin: 0; padding-right: 2px; } .confirm-modal { position: fixed; inset: 0; z-index: 99999 !important; display: grid; place-items: center; padding: 18px; background: rgba(2, 6, 23, 0.58); } .confirm-modal.hidden { display: none; } .confirm-card { width: min(340px, 100%); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 8px; background: rgba(16, 24, 39, 0.98); padding: 16px; text-align: center; } .confirm-card h2 { margin: 0 0 8px; font-size: 1.25rem; } .confirm-card p { margin: 0 0 14px; color: var(--muted); } /* Splash screen */ .splash { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; height: 100dvh; z-index: 30; background: #020712; overflow: hidden; padding: 0; margin: 0; box-sizing: border-box; } .splash.hidden { display: none; } .splash-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .splash-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; background: #020712; pointer-events: none; /* introplay-v1: Chromium (Android WebView) DURAKLATILMIS bir