/* lastikcin.com — sunucu tarafinda uretilen inis sayfalari (/lastik/, /marka/)
   Tasarim belirtecleri app.css ile ayni; bu dosya SPA'dan bagimsizdir ki
   arama motoru sayfayi JS/stil beklemeden tam olarak gorsun. */
:root{
  --bg:#0a0c0f; --bg2:#0f1216; --panel:#13171c; --panel2:#191e25;
  --line:#252b34; --line2:#323a45;
  --text:#e9edf2; --muted:#8b95a3; --dim:#5d6672;
  --neon:#2ff0c2; --neon-2:#38b6ff; --neon-ink:#03261d;
  --LA:#1fa84f; --LB:#7cc242; --LC:#e8cc1a; --LD:#f7931e; --LE:#e8412c;
  --r:16px;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 var(--font);
     -webkit-text-size-adjust:100%}
a{color:var(--neon-2);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}

/* ---- ust seritte marka + arama ---- */
.hd{display:flex;gap:16px;align-items:center;flex-wrap:wrap;
    padding:14px 20px;border-bottom:1px solid var(--line);background:var(--bg2);
    position:sticky;top:0;z-index:5}
.bd{color:var(--text);font-size:20px;font-weight:700;letter-spacing:-.02em}
.bd b{color:var(--neon)}
.bd:hover{text-decoration:none}
.sr{display:flex;flex:1 1 260px;min-width:0;gap:8px}
.sr input{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line2);
          color:var(--text);border-radius:999px;padding:9px 16px;font:15px var(--font)}
.sr input:focus{outline:none;border-color:var(--neon)}
.sr button{background:var(--neon);color:var(--neon-ink);border:0;border-radius:999px;
           padding:9px 20px;font:600 15px var(--font);cursor:pointer}

/* ---- govde ---- */
.wr{max-width:1060px;margin:0 auto;padding:22px 20px 40px}
.bc{color:var(--dim);font-size:13px;margin-bottom:14px}
.bc a{color:var(--muted)}
.bc b{color:var(--text);font-weight:600}
h1{font-size:clamp(24px,4.4vw,34px);line-height:1.2;letter-spacing:-.02em;margin:0 0 10px}
h2{font-size:19px;letter-spacing:-.01em;margin:32px 0 10px;
   padding-top:14px;border-top:1px solid var(--line)}
.lead{color:var(--muted);margin:0 0 18px;max-width:70ch}
.lead b{color:var(--text)}
.uyari{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r);
       padding:12px 16px;color:var(--muted);font-size:14px;margin:0 0 18px}

/* ebat okumasi */
.ok{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 22px}
.ok span{background:var(--panel);border:1px solid var(--line);border-radius:999px;
         padding:6px 14px;font-size:13px;color:var(--muted)}
.ok b{color:var(--text)}

/* ---- tablo ---- */
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.t{width:100%;border-collapse:collapse;min-width:620px}
.t th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;
      color:var(--dim);font-weight:600;padding:12px 14px;border-bottom:1px solid var(--line2);
      background:var(--panel2);white-space:nowrap}
.t td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.t tr:last-child td{border-bottom:0}
.t tr:hover td{background:var(--panel2)}
.t .c{text-align:center}
.t .r{text-align:right;white-space:nowrap}
.t .u{min-width:230px}
.u img{width:46px;height:46px;object-fit:contain;border-radius:8px;background:#fff;
       vertical-align:middle;margin-right:10px;float:left}
.u span{display:block;overflow:hidden}
.u b{display:block;font-size:15px;font-weight:600}
.u i{display:block;font-style:normal;font-size:12.5px;color:var(--dim);margin-top:1px}
.t s{display:block;color:var(--dim);font-size:12.5px;font-weight:400}

/* etiket harfleri ve rozetler */
.t em{font-style:normal;display:inline-block;margin:1px 2px;border-radius:5px;
      font-size:11.5px;font-weight:700;padding:2px 6px;background:var(--line2);color:var(--text)}
.t em.LA{background:var(--LA);color:#062d14}
.t em.LB{background:var(--LB);color:#0e2906}
.t em.LC{background:var(--LC);color:#2b2500}
.t em.LD{background:var(--LD);color:#2e1a00}
.t em.LE{background:var(--LE);color:#2e0603}
.t em.db{background:transparent;border:1px solid var(--line2);color:var(--muted);font-weight:600}
.t em.rz{background:transparent;border:1px solid var(--neon-2);color:var(--neon-2);font-weight:600}

.al{display:inline-block;background:var(--neon);color:var(--neon-ink);border-radius:999px;
    padding:7px 15px;font-weight:600;font-size:14px;white-space:nowrap}
.al:hover{text-decoration:none;filter:brightness(1.1)}

/* ---- baglanti bulutlari ---- */
.cip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.cip a{background:var(--panel);border:1px solid var(--line2);border-radius:999px;
       padding:6px 13px;color:var(--text);font-size:14px}
.cip a:hover{border-color:var(--neon);text-decoration:none}
.cip.say a i{font-style:normal;color:var(--dim);font-size:12px;margin-left:5px}
.cip a.az{opacity:.5;border-style:dashed}

.dip{margin-top:26px}
.dip.not{color:var(--dim);font-size:13px;max-width:70ch}
.btn{display:inline-block;border:1px solid var(--line2);border-radius:999px;
     padding:9px 18px;color:var(--text);font-weight:600;font-size:14px;margin:0 6px 8px 0}
.btn:hover{border-color:var(--neon);text-decoration:none}

/* ---- dip ---- */
.ft{border-top:1px solid var(--line);padding:22px 20px 34px;background:var(--bg2);
    color:var(--dim);font-size:13px}
.ft nav{max-width:1060px;margin:0 auto 10px;display:flex;gap:16px;flex-wrap:wrap}
.ft p{max-width:1060px;margin:0 auto 8px;line-height:1.5}

@media(max-width:560px){
  .wr{padding:16px 14px 32px}
  .hd{padding:12px 14px}
  .u img{width:38px;height:38px;margin-right:8px}
  .t th,.t td{padding:9px 10px}
}