/* ═══ EYLEM RENGİ — "ileri götüren düğme" TEK renkte ═══════════════════════
   (7 Eyl 2026, kullanıcı kararı — gezinti raporu 3. madde.)

   VAKA: Aynı işi yapan "bunu yap" düğmesi ekrandan ekrana kimlik değiştiriyordu:
     · kayıt kartı   → neon camgöbeği DOLGU
     · ilerleme ekle → altın çerçeve
     · yeni kitap    → altın
     · kendi ritmini kur → MAVİ (paletimizde olmayan #4FACFE)
     · analizi bitir → KIRMIZI
   Öğrenci "ileri götüren düğme"yi rengiyle tanıyamıyor, her ekranda yeniden
   arıyordu. Kırmızının kaydetme eyleminde kullanılması ayrıca ürünün kendi
   kuralını çiğniyordu ("KIRMIZI YASAK").

   🔑 KURAL: ALTIN = ilerlet. KIRMIZI = yalnız SİL/GERİ ALINMAZ.
   Kadranın BAŞLAT'ı zaten altın; ekranın ana eylemi de aynı sözü versin.
   Camgöbeği serbest kalıyor ve DURUM rengi oluyor (etkin sekme, ilerleme
   çubuğu, sayılar) — böylece iki renk iki ayrı şey söylüyor.

   ⚠️ ÜÇ ALTIN TONU BİLEREK DURUYOR, ikisi eylem değil:
     · `--ss-ortak` (#F5D67B) ORTAK SAAT hâlidir (oda standardı, bekçili).
     · `#e8d5a8` yazı tonudur.
     · Eylem altını aşağıdaki `--ss-eylem-*` ailesidir (#d4af6a).
   Birini ötekinin yerine kullanma: renk burada süs değil, cümle.
*/

:root {
    --ss-eylem-yazi: #E8D5A8;
    --ss-eylem-dolgu: rgba(212, 175, 106, .16);
    --ss-eylem-cizgi: rgba(212, 175, 106, .48);
    --ss-eylem-dolgu-koyu: rgba(212, 175, 106, .26);

    /* Yıkıcı: yalnız gerçekten silen, geri alınamayan iş. */
    --ss-yikici-yazi: #FF8A80;
    --ss-yikici-dolgu: rgba(244, 67, 54, .16);
    --ss-yikici-cizgi: rgba(244, 67, 54, .45);
}

/* Ekranı İLERİ götüren düğme. */
.ss-birincil {
    background: var(--ss-eylem-dolgu, rgba(212, 175, 106, .16));
    border: 1px solid var(--ss-eylem-cizgi, rgba(212, 175, 106, .48));
    color: var(--ss-eylem-yazi, #E8D5A8);
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
}

.ss-birincil:hover:not(:disabled) {
    background: var(--ss-eylem-dolgu-koyu, rgba(212, 175, 106, .26));
}

/* Hazır değilken: TEK bir sönük hâl — üründe iki ayrı "kapalı" dili vardı
   (biri grileşiyor, öteki neon kalıp saydamlaşıyordu; ikincisi basılacakmış
   gibi duruyordu). */
.ss-birincil:disabled,
.ss-birincil[disabled] {
    background: rgba(255, 255, 255, .05);
    border-color: rgba(255, 255, 255, .12);
    color: #8595B0;
    cursor: default;
}

/* SİLEN düğme. Ayrı renk, çünkü ayrı sonuç: geri alınamaz. */
.ss-yikici {
    background: var(--ss-yikici-dolgu, rgba(244, 67, 54, .16));
    border: 1px solid var(--ss-yikici-cizgi, rgba(244, 67, 54, .45));
    color: var(--ss-yikici-yazi, #FF8A80);
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
}

/* Yan eylem: gerçek bir seçenek ama ana yol değil. Çerçevesi VARDIR —
   pencerede iki seçenek yan yana duruyorsa ikisi de dokunulabilir görünür
   (kullanıcı kararı, 7 Eyl). Sıralamayı çerçeve değil DOLGU kurar. */
.ss-ikincil {
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .14);
    color: #C3D0E4;
    font-family: inherit;
    font-weight: 600;
    cursor: pointer;
}

.ss-ikincil:hover { background: rgba(255, 255, 255, .1); }

/* ═══ ÇIKIŞ YAZIDIR, DÜĞME DEĞİL ═══════════════════════════════════════════
   (7 Eyl 2026, kullanıcı kararı — gezinti raporu 2. madde.)

   VAKA: Altı ekranın dibinde boydan boya bir "çıkış duvarı" vardı ve hepsi
   birbirine benziyordu — "Kapat" (hesap · kitaplık · karne), "Kitaplığa dön",
   "Denemelerime dön". Yanlarında duran ÜRETEN düğmelerle (Kartı kaydet) aynı
   ağırlıktaydılar. Oysa biri iş yapar, öteki yalnız çıkar.

   🔑 KURAL: tek başına duran çıkış YAZIDIR — kutusu yoktur, sola yaslanır,
   ok işareti taşır. Ağırlık ekranın ana eyleminde kalır.
   ⚠️ Dokunma alanı yine 44: yazı olması küçüldüğü anlamına gelmez. Görünen
   boy küçük, parmağın bulduğu alan büyük — dolgu + eksi kenar payı
   (anayasa, ikon maddesi: kaplama dar satırda komşunun dokunuşunu yer). */
.ss-cikis {
    display: block;
    background: none;
    border: none;
    color: #9AABC4;
    font-family: inherit;
    font-size: .85em;
    text-align: left;
    cursor: pointer;
    padding: 13px 10px 13px 0;
    margin-top: 4px;
    min-height: 44px;
}

.ss-cikis:hover { color: #C3D0E4; }