:root{
    --bg:#0a0a0d;
    --bg-soft:#111114;
    --card:#16161a;
    --card-2:#1c1c21;
    --border:#2a2a30;
    --orange:#ff7a1a;
    --orange-2:#ff9d3d;
    --orange-dim:#ff7a1a33;
    --orange-glow: 0 0 24px rgba(255,122,26,.35);
    --text:#f4f4f5;
    --text-dim:#a6a6ad;
    --text-faint:#8e8e97; /* #16161a zeminde ~5,6:1 (AA için en az 4,5:1) */
    --green:#3ddc84;
    --red:#ff5d5d;
    --radius:16px;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html,body{height:100%;}
  body{
    background:
      radial-gradient(1100px 600px at 15% -10%, rgba(255,122,26,.14), transparent 60%),
      radial-gradient(900px 500px at 110% 10%, rgba(255,122,26,.08), transparent 55%),
      var(--bg);
    color:var(--text);
    font-family:'Inter','Poppins',sans-serif;
    min-height:100%;
    padding-bottom:60px;
  }
  h1,h2,h3,.brand{font-family:'Poppins',sans-serif;}
  a{color:inherit; text-decoration:none;}
  :where(a,button,input,select,textarea,label,summary,[role="button"]){-webkit-tap-highlight-color:transparent;}
  ::selection{background:var(--orange-dim); color:var(--text);}

  /* ---------- HEADER ---------- */
  header{
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 6vw;
    border-bottom:1px solid var(--border);
    position:sticky; top:0; z-index:50;
    background:rgba(10,10,13,.85);
    backdrop-filter:blur(10px);
  }
  .brand{
    font-size:18px; font-weight:800; letter-spacing:.2px; cursor:pointer;
    display:flex; align-items:center;
    color:inherit;background:transparent;border:0;padding:0;font-family:'Poppins',sans-serif;
  }
  .brand:focus-visible{outline:2px solid var(--orange-2);outline-offset:5px;border-radius:4px;}
  .brand span.hi{color:var(--orange-2);}
  .brand .tld{display:inline-flex; color:var(--orange-2); font-weight:700;}
  .brand .tld-letter{
    display:inline-block;
    opacity:0;
    transform:scale(2.6);
    transform-origin:center bottom;
    animation:tldLetterIn .5s cubic-bezier(.34,1.56,.64,1) forwards;
  }
  @keyframes tldLetterIn{
    0%{opacity:0; transform:scale(2.6);}
    55%{opacity:1;}
    100%{opacity:1; transform:scale(1);}
  }
  .nav-right{display:flex; align-items:center; gap:14px;}
  .crumb-trail{color:var(--text-faint); font-size:13px;}
  .crumb-trail b{color:var(--orange-2); font-weight:600;}
  .home-btn{
    background:transparent; border:1px solid var(--border); color:var(--text-dim);
    font-size:13.5px; font-weight:600; padding:9px 20px; border-radius:999px; cursor:pointer;
    transition:.15s; font-family:inherit;
  }
  .home-btn:hover{border-color:var(--orange-dim); color:var(--orange-2); box-shadow:var(--orange-glow);}

  main{padding:0 6vw;}

  /* ---------- HOME VIEW ---------- */
  .hero{
    text-align:center;
    padding:64px 0 36px;
  }
  .hero h1{
    font-size:clamp(28px,5vw,46px);
    font-weight:800;
    line-height:1.15;
  }
  .hero h1 .accent{
    background:linear-gradient(90deg, var(--orange-2), var(--orange));
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .hero p{
    color:var(--text-dim); margin-top:14px; font-size:16px;
    max-width:640px; margin-left:auto; margin-right:auto;
  }

  .exam-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
    grid-auto-rows:1fr;
    gap:20px;
    max-width:1000px;
    margin:44px auto 20px;
  }
  .exam-card{
    -webkit-tap-highlight-color:transparent;
    display:flex;
    flex-direction:column;
    align-items:center;
    background:linear-gradient(160deg, var(--card), var(--card-2));
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:28px 18px;
    text-align:center;
    cursor:pointer;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    position:relative;
    overflow:hidden;
    color:inherit;
    font:inherit;
    width:100%;
    text-decoration:none;
  }
  .exam-card::before{
    content:"";
    position:absolute; inset:0;
    background:radial-gradient(120px 80px at 50% -10%, rgba(255,122,26,.25), transparent 70%);
    opacity:0; transition:opacity .2s ease;
  }
  .exam-card:hover{
    transform:translateY(-6px);
    border-color:var(--orange-dim);
    box-shadow:0 14px 34px rgba(0,0,0,.45), var(--orange-glow);
  }
  .exam-card:hover::before{opacity:1;}
  .exam-card:focus-visible{outline:3px solid var(--orange-2);outline-offset:3px;}
  .exam-card:active{border-color:var(--orange-2); background:linear-gradient(160deg,rgba(255,122,26,.18),var(--card-2)); box-shadow:inset 0 0 0 1px var(--orange-dim);}
  .exam-card .icon{
    width:fit-content; min-width:52px; height:52px; margin:0 auto 14px; padding:0 14px;
    border-radius:14px; white-space:nowrap;
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg, rgba(255,122,26,.22), rgba(255,122,26,.05));
    border:1px solid var(--orange-dim);
    font-size:22px; font-weight:800; color:var(--orange-2);
  }
  .exam-card .desc{font-size:12.5px; color:var(--text-faint); margin-top:6px; line-height:1.4; min-height:2.8em; flex:1;}
  /* Güncel dönem rozeti (backend/donem.php'den; panelde yeni yıl yayına alınınca kendiliğinden değişir) */
  .donem{display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; letter-spacing:.2px;
    color:var(--orange-2); background:rgba(255,122,26,.10); border:1px solid var(--orange-dim); border-radius:999px; padding:4px 11px; white-space:nowrap;}
  .donem::before{content:""; width:6px; height:6px; border-radius:50%; background:var(--orange-2); box-shadow:0 0 6px var(--orange-2);}
  .donem:empty{display:none;}
  .exam-card .donem{margin-top:12px;}
  @media (max-width:600px){
    .hero{padding:30px 0 12px;}
    .hero p{margin-top:10px;}
    .exam-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:16px;}
    .exam-card{padding:20px 8px; min-width:0; order:4;}
    .exam-card[data-sinav="yks"]{order:1;}
    .exam-card[data-sinav="lgs"]{order:2;}
    .exam-card[data-sinav="dil"]{order:3;}
    .exam-card[data-sinav="msu"]{order:4;}
    .exam-card .donem{font-size:10px; padding:4px 6px; letter-spacing:0; gap:4px;}
  }

  .footer-note{
    text-align:center; color:var(--text-faint); font-size:13px; margin-top:50px;
  }

  /* ---------- SECTION SHELL ---------- */
  @keyframes fadeIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);}}

  .page-title{
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
    margin:34px auto 6px; max-width:680px;
  }
  .page-title h1, .page-title h2{font-size:26px; font-weight:800; flex:1 1 0; min-width:0; white-space:nowrap;} /* sığmazsa bpBaslikSigdir küçültür */
  .page-title .donem{margin-left:auto; flex-shrink:0;}
  @media (min-width:601px){ .page-title{flex-wrap:nowrap;} } /* masaüstü: rozet hep başlığın sağında, aynı satırda */
  @media (max-width:600px){ .page-title{gap:8px; margin-top:16px;} .page-title h1, .page-title h2{flex-basis:100%; text-align:center;} .page-title .donem{order:-1; margin:0 auto;} } /* telefonda rozet ve başlık ortada */
  .page-sub{color:var(--text-faint); font-size:14px; margin:4px auto 30px; max-width:680px;}

  /* Sınav sayfalarının altındaki açıklama metni (SEO + kullanıcıya bilgi) */
  .seo-block{max-width:680px; margin:44px auto 0;}
  .seo-block h2{font-size:18px; font-weight:800; margin-bottom:10px;}
  .seo-block h2 + p{margin-top:0;}
  .seo-block p{color:var(--text-dim); font-size:13.5px; line-height:1.7; margin-bottom:12px;}


  /* ---------- CARDS / PANELS ---------- */
  .panel{
    background:linear-gradient(160deg, var(--card), var(--card-2));
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:26px 24px;
    margin:0 auto 26px;
    max-width:680px;
  }
  .panel h3, .panel h2.panel-baslik{
    font-size:19px; font-weight:700; margin-bottom:4px;
    display:flex; align-items:center; gap:10px;
  }
  .panel h3 .tag{
    font-size:11px; font-weight:700; color:var(--orange-2);
    background:var(--orange-dim); padding:3px 9px; border-radius:999px;
    letter-spacing:.4px;
  }
  .panel h3 .tag.celebrate-btn{
    background:transparent; border:1.5px solid var(--orange); color:var(--orange-2);
    cursor:pointer; font-family:inherit; transition:.15s; margin-left:auto;
  }
  .panel h3 .tag.celebrate-btn:hover{
    background:rgba(255,122,26,.12); color:var(--orange-2);
  }
  .panel h3 .tag.celebrate-btn:active{transform:scale(.96);}
  .panel .hint{color:var(--text-faint); font-size:13px; margin-bottom:18px;}

  /* Diploma notu + "geçen sene yerleştim" tek bir çerçeve içinde, üst üste iki
     satır olarak — mümkün olduğunca az yükseklik kaplayacak şekilde sıkıştırılmış.
     Tek çerçeve zaten .panel tarafından sağlanıyor; burada ikinci bir iç
     çerçeve (arka plan/kenarlık) OLUŞTURMUYORUZ, sadece iki satırı dikey
     olarak diziyoruz ve aralarına ince bir ayraç çizgisi koyuyoruz. */
  .panel-compact{padding-top:14px; padding-bottom:14px;}

  .prefs-box{display:flex; flex-direction:column;}

  .diploma-row{
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    padding:2px 0 10px;
  }
  .diploma-row .stepper-label{font-size:14px; font-weight:700; color:var(--text-dim); flex:1 1 0; min-width:0;}
  .stepper{display:flex; align-items:center; gap:8px;}
  .stepper-btn{
    width:var(--stepper-btn-boy,34px); height:34px; flex-shrink:0; border-radius:9px; border:none; cursor:pointer;
    background:var(--card-2); color:var(--text); font-size:17px; font-weight:700; line-height:1;
    display:flex; align-items:center; justify-content:center; transition:.15s; font-family:inherit;
  }
  .stepper-btn:hover{background:var(--orange-dim); color:var(--orange-2);}
  .stepper-btn:active{transform:scale(.94);}
  .stepper-value-box{
    background:#0d0d10; border:1px solid var(--border); border-radius:9px;
    padding:5px 8px; display:inline-flex; align-items:center; justify-content:center;
  }
  .stepper-value-box input[type=number]{
    width:48px; background:transparent; border:none; outline:none;
    color:var(--orange-2); font-size:16px; font-weight:800; text-align:center;
    font-family:inherit;
  }

  /* Geçen yıl yerleşme sorusu: iki büyük seçenek (telefonda rahat dokunulur) + canlı katkı özeti. */
  .obp-row{display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--border);}
  .obp-soru{font-size:14px;font-weight:700;color:var(--text-dim);}
  .obp-row.obp-onay{display:flex; flex-wrap:nowrap; align-items:flex-start; gap:12px; padding-top:6px; cursor:pointer;}
  .obp-onay-metin{flex:1; min-width:0; white-space:nowrap; font-size:13px; font-weight:600; line-height:1.35; color:var(--text-dim);}
  .obp-onay input{appearance:none; flex-shrink:0; width:20px; height:20px; margin:0 calc((var(--stepper-btn-boy,34px) - 20px) / 2) 0 auto; border:1px solid var(--text-faint); border-radius:4px; background:var(--bg-soft); cursor:pointer;}
  .obp-onay input:checked{background:var(--orange-2); border-color:var(--orange-2);}
  .obp-onay input:checked::after{content:""; display:block; width:6px; height:11px; margin:2px auto; border:solid var(--bg); border-width:0 2px 2px 0; transform:rotate(45deg);}
  .obp-onay input:focus-visible{outline:2px solid var(--orange-2); outline-offset:3px;}
  .obp-soru-kirma{display:none;}
  @media (max-width:600px){
    .obp-row{padding-top:6px; gap:8px; flex-wrap:nowrap;}
    .obp-soru{flex:1; min-width:0; white-space:nowrap; font-size:13px; line-height:1.3;}
    .obp-soru-kirma{display:block;}
    .obp-secenekler{flex-shrink:0;}
    .obp-row .obp-secenek span{min-height:24px; padding:2px 0;}
  }
  /* Hizalama: seçenekler, üstteki stepper ile aynı genişlikte ve "−" işaretinin solundan "+" işaretinin sağına kadar uzanır.
     --stepper-gen: stepper genişliği, --glif-pay: düğme kenarı ile işaret arasındaki boşluk (bkz. .stepper-btn, 640px altında değişir). */
  .prefs-box{--stepper-gen:150px; --glif-pay:11.2px;}
  .obp-secenekler{display:flex;justify-content:space-between;gap:0;width:calc(var(--stepper-gen) - 2 * var(--glif-pay));margin-left:auto;margin-right:var(--glif-pay);}
  .obp-secenek{position:relative;display:block;cursor:pointer;}
  .obp-secenek input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer;}
  .obp-secenek span{display:flex;align-items:center;justify-content:center;gap:7px;min-height:28px;padding:3px 0;text-align:center;
    background:none;border:none;color:var(--text-dim);font-size:13px;font-weight:700;line-height:1;transition:.15s;}
  /* Yuvarlak onay işareti: seçili değilken boş halka, seçiliyken içi dolu. */
  .obp-secenek span::before{content:"";flex:none;width:14px;height:14px;border-radius:50%;border:1.5px solid var(--text-faint);box-sizing:border-box;transition:.15s;}
  .obp-secenek input:checked + span::before{border-color:var(--orange-2);background:var(--orange-2);}
  .obp-secenek:hover span{color:var(--orange-2);}
  .obp-secenek input:checked + span{color:var(--text);}
  .obp-secenek input:focus-visible + span{outline:2px solid var(--orange-2);outline-offset:2px;}
  .obp-ozet{font-size:13px;font-weight:500;color:var(--text-dim);margin-left:4px;}
  @media (max-width:640px){ .obp-ozet{display:block;margin-left:0;margin-top:2px;} }
  .obp-ozet b{color:var(--orange-2);}
  .stepper-value-box input[type=number]::-webkit-outer-spin-button,
  .stepper-value-box input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
  .stepper-value-box input[type=number]{-moz-appearance:textfield;}

  /* ---------- TABLE (net girişi) ---------- */
  .table-wrap{overflow-x:auto; border-radius:12px; border:1px solid var(--border); max-width:520px; margin-left:auto; margin-right:auto;}
  .table-wrap.plain{border:none; border-radius:0; max-width:100%;}
  table.net-table{border-collapse:collapse; width:100%; min-width:340px;}
  table.net-table th, table.net-table td{
    padding:8px 4px; text-align:center;
  }
  table.net-table th:not(:first-child), table.net-table td:not(:first-child){width:70px;}
  table.net-table thead th{
    background:transparent; color:var(--orange-2); font-size:12.5px; font-weight:700;
    padding:6px 4px 12px; border-bottom:1px solid var(--border);
  }
  table.net-table thead th:first-child{color:var(--text-faint); text-align:left; padding-left:4px;}
  table.net-table tbody th{
    text-align:left; padding-left:4px; padding-top:9px; padding-bottom:9px; color:var(--text); font-weight:600;
    background:transparent; white-space:nowrap;
  }
  table.net-table tbody th .ders-name{font-size:13px; font-weight:600; color:var(--text);}
  table.net-table tbody th .ders-count{font-size:11.5px; font-weight:500; color:var(--text-faint); margin-top:1px;}
  /* Bir satır aralıklı koyu/açık: sekmeyle gizlenen satırlar sayıma girmesin diye sınıfı JS verir (bkz. satirlariBoya). */
  table.net-table tbody tr.alt{background:rgba(255,255,255,.025);}
  table.net-table input{
    width:64px; text-align:center;
    background:#0d0d10; border:1px solid var(--border); color:var(--text);
    padding:10px 4px; border-radius:7px; font-size:15px; outline:none;
  }
  table.net-table input:focus{border-color:var(--orange); box-shadow:0 0 0 3px var(--orange-dim);}
  table.net-table input.net-input{
    width:76px;
    color:var(--orange-2); font-weight:700; background:#171012;
    border-color:rgba(255,122,26,.45);
    box-shadow:0 0 9px 1px rgba(255,122,26,.3);
  }
  /* Sayı kutularının yukarı/aşağı okları (bkz. sayiOklariniKur). Tarayıcının kendi okları gizlenir. */
  table.net-table input[type=number]{-moz-appearance:textfield; appearance:textfield;}
  table.net-table .net-input[readonly]{background:rgba(255,122,26,.05); border-color:var(--orange-dim); color:var(--orange-2); cursor:default; box-shadow:none;}
  table.net-table input[type=number]::-webkit-outer-spin-button,
  table.net-table input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
  .sayi-kutu{position:relative; display:inline-block; vertical-align:middle;}
  .sayi-oklar{position:absolute; right:4px; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; gap:3px;
    opacity:0; pointer-events:none; transition:opacity .15s;}
  .sayi-kutu:focus-within .sayi-oklar{opacity:1; pointer-events:auto;}
  .sayi-ok{width:14px; height:9px; padding:0; border:none; background:transparent; cursor:pointer; position:relative; display:block;}
  .sayi-ok::before{content:""; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); border-left:4.5px solid transparent; border-right:4.5px solid transparent;}
  .sayi-ok-yukari::before{border-bottom:6px solid var(--orange-2);}
  .sayi-ok-asagi::before{border-top:6px solid var(--orange-2);}
  .sayi-ok:hover::before{filter:brightness(1.25);}
  .sayi-ok:active::before{transform:translate(-50%,-50%) scale(.85);}
  @media (hover:none){ .sayi-oklar{display:none;} }
  .input-invalid{
    border-color:var(--red) !important; box-shadow:0 0 0 3px rgba(255,93,93,.22) !important;
  }

  .btn-row{display:flex; gap:14px; margin-top:22px; flex-wrap:wrap;}
  .btn{
    border:none; cursor:pointer; font-size:14.5px; font-weight:700;
    padding:13px 26px; border-radius:11px; transition:.15s; font-family:inherit;
  }
  .btn-primary{
    background:linear-gradient(135deg, var(--orange-2), var(--orange));
    color:#1a0d02;
    box-shadow:0 8px 20px rgba(255,122,26,.25);
  }
  .btn-primary:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(255,122,26,.4);}
  .btn-ghost{
    background:transparent; color:var(--text-dim); border:1px solid var(--border);
  }
  .btn-ghost:hover{border-color:var(--red); color:var(--red);}

  .warn{
    display:none; margin-top:14px; padding:10px 14px; border-radius:10px;
    background:rgba(255,93,93,.1); border:1px solid rgba(255,93,93,.3); color:#ff8a8a; font-size:13px;
  }

  /* ---------- RESULTS ---------- */
  .results{display:none; margin-top:6px;}
  .results.show{display:block; animation:fadeIn .3s ease;}
  /* Netler değiştiğinde gösterilen sonuç artık güncel değildir: soluklaştırılır ve
     kartın üstüne uyarı satırı eklenir (bkz. eskimisIsaretle). */
  .results.eskimis .result-block{opacity:.4; filter:saturate(.4);}
  .results.eskimis .result-grid::before{
    content:"Netler değişti — güncel sonuç için Hesapla'ya basın.";
    display:block; grid-column:1/-1; text-align:center; margin-bottom:6px;
    color:var(--orange-2); font-size:12.5px; font-weight:600;
  }

  .rank-table{width:100%; border-collapse:collapse; margin-top:6px;}
  .rank-table th, .rank-table td{
    padding:10px 12px; text-align:center; border-bottom:1px solid var(--border);
  }
  .rank-table th{color:var(--orange-2); font-size:12.5px; font-weight:700; background:var(--bg-soft);}
  .rank-table th:first-child, .rank-table td:first-child{text-align:left; color:var(--text-dim); font-weight:600;}
  .rank-table td{font-size:14px; font-weight:600;}
  .rank-table tbody tr:hover{background:rgba(255,122,26,.05);}

  .type-tabs{display:flex; gap:8px; flex-wrap:wrap;}
  .type-tab{
    background:var(--bg-soft); border:1px solid var(--border); color:var(--text-dim);
    font-size:13px; font-weight:700; padding:8px 16px; border-radius:999px; cursor:pointer;
    transition:.15s; font-family:inherit;
  }
  .type-tab:hover{border-color:var(--orange-dim); color:var(--orange-2);}
  .type-tab.active{
    background:linear-gradient(135deg, var(--orange-2), var(--orange));
    color:#1a0d02; border-color:transparent;
    box-shadow:0 6px 16px rgba(255,122,26,.3);
  }

  .result-grid{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(0,480px)); gap:16px; justify-content:center;
  }
  .result-block{
    background:var(--bg-soft); border:1px solid var(--border); border-radius:12px; padding:18px;
  }
  .result-block h4{
    font-size:15px; font-weight:700; color:var(--text); margin-bottom:12px;
    display:flex; align-items:center; gap:8px;
  }
  .result-block h4 .paylas-grup{margin-left:auto; flex-shrink:0;}
  .puan-turu-baslik{flex:1; min-width:0; font-size:15px; font-weight:700; line-height:1.3;}
  .paylas-grup{display:inline-flex; gap:6px;}
  .paylas-grup .share-btn{margin-left:0;}
  .kart-btn:hover{border-color:var(--orange-2); color:var(--orange-2);}
  .kart-btn:disabled{opacity:.6; cursor:wait;}
  .result-block .mini-scores{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); gap:8px; margin-bottom:14px;}
  .result-block .mini-scores > div{min-width:0; text-align:center;}
  .result-block .mini-scores.mini-scores-dort{grid-template-columns:22% 22% 22% 34%; column-gap:0;}
  .result-block .mini-scores.mini-scores-dort > div{padding:0 3px;}
  .result-block .mini-scores.mini-scores-lgs{grid-template-columns:minmax(0,27fr) minmax(0,27fr) minmax(0,46fr);}
  .result-block .mini-scores .l{font-size:12px; line-height:1.3; min-height:2.6em; color:var(--text-faint);}
  .result-block .mini-scores .v{font-size:18px; font-weight:800; color:var(--orange-2); margin-top:2px;}
  .result-block .rank-table th, .result-block .rank-table td{padding:7px 6px; font-size:12px;}
  .result-block .table-wrap{max-width:none; border:none;}
  .result-block .rank-table .lgs-yil-basliklari th:not(:first-child){min-width:68px;}
  .result-block .rank-table .msu-yil-basliklari th:not(:first-child){min-width:68px;}
  .result-block .rank-table .yks-yil-basliklari th:not(:first-child){min-width:68px;}

  .disclaimer{
    margin-top:8px; font-size:11px; line-height:1.5; color:var(--text-faint); display:flex; gap:8px; align-items:flex-start;
    background:transparent; border:0; padding:0; border-radius:0;
  }
  .disclaimer b{color:inherit; font-weight:400;}

  .share-btn{
    background:transparent; border:1px solid var(--border); color:var(--text-dim);
    font-size:12px; font-weight:700; padding:6px 12px; border-radius:999px; cursor:pointer;
    font-family:inherit; display:inline-flex; align-items:center; gap:6px; margin-left:8px;
  }
  .share-btn:hover{border-color:#3ddc84; color:#3ddc84;}

  .toast{
    position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(20px);
    background:var(--card-2); border:1px solid var(--orange-dim); color:var(--text);
    padding:14px 22px; border-radius:12px; font-size:14px; box-shadow:0 10px 30px rgba(0,0,0,.5);
    opacity:0; pointer-events:none; transition:.25s; z-index:200;
  }
  .toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

  .confetti-piece{
    position:fixed; top:-24px; left:0;
    pointer-events:none; z-index:500;
    animation-name:confettiFall; animation-timing-function:cubic-bezier(.4,.1,.6,.9); animation-fill-mode:forwards;
  }
  @keyframes confettiFall{
    0%{ transform:translateY(0) rotate(0deg); opacity:1; }
    85%{ opacity:1; }
    100%{ transform:translateY(100vh) rotate(600deg); opacity:0; }
  }

  @media (max-width:640px){
    header{padding:18px 5vw;}
  }
  /* Üst şerit: logo ve düğmeler hiçbir genişlikte iki satıra bölünmez; dar ekranda küçülür. */
  header{gap:10px;}
  .brand, .home-btn, .crumb-trail{white-space:nowrap;}
  .brand{flex-shrink:0;}
  @media (max-width:480px){
    .brand{font-size:16px;}
    .nav-right{gap:8px;}
    .crumb-trail{font-size:12px;}
    .home-btn{font-size:12.5px; padding:7px 13px;}
  }
  @media (max-width:360px){
    .brand{font-size:14.5px;}
    .home-btn{font-size:12px; padding:6px 10px;}
  }

  @media (max-width:480px){
    .panel{padding:20px 14px;}
    .panel-compact{padding-top:12px; padding-bottom:12px;}
    .check-row{padding:8px 0 0; gap:8px;}
    .checkbox-visual{width:18px; height:18px;}
    .check-row .check-label{font-size:12.5px;}
    .diploma-row{padding:2px 0 8px; gap:10px;}
    .diploma-row .stepper-label{font-size:13px;}
    .prefs-box{--stepper-gen:136px; --glif-pay:10.6px;}
    .prefs-box{--stepper-btn-boy:32px;}
    .stepper-btn{width:32px; height:32px; font-size:16px;}
    .stepper-value-box{padding:5px 6px;}
    .stepper-value-box input[type=number]{width:42px; font-size:14px;}
    .result-block{padding:14px 12px;}
    table.net-table{min-width:0;}
    table.net-table th:not(:first-child), table.net-table td:not(:first-child){width:auto;}
    table.net-table th, table.net-table td{padding:6px 2px;}
    table.net-table thead th{padding:6px 2px 10px;}
    table.net-table tbody th{padding-left:0; padding-right:2px;}
    table.net-table tbody th .ders-name{font-size:12px;}
    table.net-table tbody th .ders-count{font-size:11px;}
    table.net-table input{width:42px; padding:8px 2px; font-size:14px;}
    table.net-table input.net-input{width:54px;}
    .result-block .mini-scores{gap:6px;}
    .result-block .mini-scores .l{font-size:10px;}
    .result-block .mini-scores .v{font-size:15px;}
    .result-block .rank-table th, .result-block .rank-table td{padding:6px 3px; font-size:12px;}
    .result-block .rank-table td:first-child{font-size:11.5px;}
  }
  .rank-note{margin-top:8px; font-size:12px; line-height:1.5; color:var(--text-faint);}

/* Hareketi azaltmayı seçen kullanıcılar için animasyonlar kapatılır. */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-delay:0s !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .confetti-piece{ display:none !important; }
}

/* ============================================================
   Satır içi style="" yerine sınıflar (CSP: style-src 'self') ve erişilebilirlik
============================================================ */
[hidden]{display:none !important;}
.panel .hint.panel-hint{margin-top:2px;}
.type-tabs.type-tabs-ara{margin-bottom:14px;}
.panel h3.sonuc-baslik{margin-top:26px; font-size:15px; color:var(--text-dim);}
.result-grid.sonuc-izgara{margin-top:14px;}
.disclaimer.disclaimer-ara{margin-top:18px;}
.seo-block.seo-ara{margin-top:34px;}
.ic-baglanti{color:var(--orange-2);}
.brand .tld-letter:nth-child(1){animation-delay:.55s;}
.brand .tld-letter:nth-child(2){animation-delay:.62s;}
.brand .tld-letter:nth-child(3){animation-delay:.69s;}
.brand .tld-letter:nth-child(4){animation-delay:.76s;}
.footer-links{margin-top:8px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.footer-link{color:var(--text-faint); text-decoration:underline;}
.footer-link:hover{color:var(--orange-2);}
.panel.sss-panel{margin-top:44px;}
.faq-list{margin-top:14px; display:flex; flex-direction:column; gap:16px;}
.faq-s{font-weight:700; font-size:14.5px;}
.faq-c{color:var(--text-dim); font-size:13.5px; margin-top:4px;}
.faq-c a{color:var(--orange-2);}
.son-dilim{font-size:11px; color:var(--text-faint);}
.paylas-satiri{display:flex; justify-content:flex-end; margin-bottom:14px;}
.result-block.tam-genislik{grid-column:1 / -1;}
.result-block h4.ara-baslik{margin-top:24px;}
.hesaplaniyor{color:var(--text-faint); font-size:14px;}

/* Klavye ile gezinenler için: ana içeriğe atlama bağlantısı ve görünür odak halkaları */
.atla{position:absolute; left:12px; top:-60px; z-index:1000; padding:10px 16px; border-radius:10px;
  background:var(--orange); color:#1a0d02; font-weight:700; text-decoration:none; transition:top .15s;}
.atla:focus{top:12px;}
a:focus-visible, button:focus-visible, .btn:focus-visible, .type-tab:focus-visible, .share-btn:focus-visible,
.stepper-btn:focus-visible, .sayi-ok:focus-visible, summary:focus-visible{outline:2px solid var(--orange-2); outline-offset:2px;}
.stepper-value-box:focus-within{border-color:var(--orange); box-shadow:0 0 0 3px var(--orange-dim);}

/* ============================================================
   İçerik sayfaları: rehberler, yöntem, puan–sıralama tabloları (bkz. backend/cekirdek/icerik.php)
============================================================ */
.kirinti{max-width:720px; margin:22px auto 0; font-size:13px; color:var(--text-faint);}
.kirinti a{color:var(--text-dim); text-decoration:none;}
.kirinti a:hover{color:var(--orange-2); text-decoration:underline;}
.makale{max-width:720px; margin:14px auto 0; line-height:1.7;}
.makale h1{font-size:28px; font-weight:800; line-height:1.25; margin-bottom:10px;}
.makale h2{font-size:20px; font-weight:800; margin:32px 0 10px;}
.makale h3{font-size:16px; font-weight:700; margin:20px 0 6px;}
.makale p{color:var(--text-dim); font-size:15px; margin-bottom:14px;}
.makale strong{color:var(--text);}
.makale .makale-not{font-size:13px; color:var(--text-faint); margin-bottom:18px;}
.makale .makale-uyari{margin-top:34px; font-size:12.5px; color:var(--text-faint); border-top:1px solid var(--border); padding-top:14px;}
.formul-liste, .ilgili-liste{color:var(--text-dim); font-size:15px; margin:0 0 16px 20px; padding:0;}
.formul-liste li, .ilgili-liste li{margin-bottom:8px;}
.ilgili-liste{list-style:none; margin-left:0; display:flex; flex-wrap:wrap; gap:8px 18px;}
.ilgili-liste li{margin:0;}
.formul-kutu{background:rgba(255,122,26,.08); border:1px solid var(--orange-dim); border-radius:12px; padding:14px 18px; color:var(--text) !important; font-weight:700; font-size:16px !important;}
.tablo-kutu{overflow-x:auto; border:1px solid var(--border); border-radius:12px; margin:0 0 18px; -webkit-overflow-scrolling:touch;}
.siralama-tablo{width:100%; border-collapse:collapse; font-size:14px; min-width:320px;}
.siralama-tablo caption{caption-side:top; text-align:left; padding:12px 14px 8px; font-size:13px; color:var(--text-faint);}
.siralama-tablo th, .siralama-tablo td{padding:8px 14px; text-align:right; border-top:1px solid var(--border); font-variant-numeric:tabular-nums;}
.siralama-tablo thead th{color:var(--orange-2); font-weight:700; background:var(--card-2); position:sticky; top:0;}
.siralama-tablo th[scope=row]{text-align:left; color:var(--text); font-weight:700;}
.siralama-tablo td{color:var(--text-dim);}
.siralama-tablo thead th:first-child, .siralama-tablo tbody th{text-align:left;}
.siralama-tablo tbody tr:nth-child(even){background:rgba(255,255,255,.025);}
.siralama-tablo tbody tr:hover{background:rgba(255,122,26,.06);}
.rehber-blok{max-width:680px; margin:34px auto 0;}
.rehber-blok h2{font-size:18px; font-weight:800; margin-bottom:10px;}
.footer-links.footer-links-ust{margin-top:0; margin-bottom:6px;}
@media (max-width:480px){
  .makale h1{font-size:23px;}
  .makale p, .formul-liste, .ilgili-liste{font-size:14.5px;}
  .siralama-tablo th, .siralama-tablo td{padding:7px 10px;}
}

/* Rehber ve tablolar: gruplu hap bağlantılar (ana sayfa kartı, sınav sayfası alt bloğu, içerik sayfası "ilgili sayfalar") */
.rehber-grup{margin-bottom:16px;}
.rehber-grup:last-child{margin-bottom:0;}
.rehber-grup-baslik{font-size:12px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--text-faint); margin-bottom:8px;}
.rehber-chipler{list-style:none; margin:0 0 14px; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); grid-auto-rows:1fr; gap:8px;}
.rehber-grup .rehber-chipler{margin-bottom:0;}
.rehber-chipler li{margin:0; min-width:0; display:flex;}
.rehber-chipler a{display:flex; align-items:center; justify-content:center; width:100%; min-height:42px; box-sizing:border-box; text-align:center; padding:9px 10px; border:1px solid var(--border); border-radius:999px; background:var(--bg-soft);
  color:var(--text-dim); font-size:13.5px; font-weight:600; line-height:1.3; text-decoration:none; transition:.15s;}
.rehber-chipler a:hover{border-color:var(--orange-dim); color:var(--orange-2); background:rgba(255,122,26,.06);}
.sss-panel .hint + .rehber-grup{margin-top:0;}
@media (max-width:520px){ .rehber-chipler{grid-template-columns:repeat(2, minmax(0, 1fr));} }
@media (max-width:360px){ .rehber-chipler{grid-template-columns:1fr;} }

/* Dokunma vurgusu öğenin mevcut köşe şeklini korur. */
.page-title h1, .page-title h2, .panel h2.panel-baslik{
  font-size:19px;
  font-weight:800;
  line-height:1.3;
}
a:active{color:var(--orange-2);}
button:active:not(:disabled), [role="button"]:active, summary:active,
.home-btn:active, .rehber-chipler a:active{
  border-color:var(--orange-2);
  box-shadow:inset 0 0 0 1px var(--orange-dim), inset 0 0 0 999px rgba(255,122,26,.12);
}