:root{
  --bg:#0f1115; --kart:#171a21; --kart2:#11141a; --cizgi:#2a2f3a; --yazi:#e8eaf0;
  --soluk:#98a1b1; --sari:#ffc21a; --yesil:#39c07c; --kirmizi:#ef5b5b; --turuncu:#f0a33a;
  --golge:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--yazi);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
button,input,textarea,a{font:inherit;color:inherit}
button{cursor:pointer}
.gizli{display:none!important}
code{color:var(--sari);font-size:12.5px}

.ust{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 18px;background:rgba(15,17,21,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--cizgi)}
.marka{display:flex;align-items:baseline;gap:12px;min-width:0}
.logo{font-weight:800;letter-spacing:.12em;color:var(--sari);font-size:17px}
.alt{color:var(--soluk);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ikon-btn,.geri{border:1px solid var(--cizgi);background:var(--kart);border-radius:10px;padding:9px 14px;min-height:42px}
.ikon-btn:hover,.geri:hover{border-color:var(--sari)}

.liste{max-width:1180px;margin:0 auto;padding:18px}
.arac-cubugu{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
#ara{flex:1 1 260px;min-width:200px;background:var(--kart);border:1px solid var(--cizgi);border-radius:12px;padding:12px 14px;min-height:46px;outline:none}
#ara:focus{border-color:var(--sari)}
.cipler{display:flex;gap:8px;flex-wrap:wrap}
.cipler button{border:1px solid var(--cizgi);background:transparent;color:var(--soluk);border-radius:999px;padding:8px 13px;min-height:40px}
.cipler button.aktif{background:var(--sari);color:#111;border-color:var(--sari);font-weight:700}

.kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.kart{background:var(--kart);border:1px solid var(--cizgi);border-radius:14px;overflow:hidden;text-align:left;padding:0;transition:transform .15s,border-color .15s}
.kart:hover{transform:translateY(-2px);border-color:#4a5264}
.kart .res{height:150px;background:#0c0e12;display:flex;align-items:center;justify-content:center}
.kart .res img{max-width:100%;max-height:100%;object-fit:contain}
.kart .govde{padding:11px 13px 13px}
.kart h2{font-size:15px;margin:5px 0 4px;font-weight:650;line-height:1.3}
.kart .kucuk{color:var(--soluk);font-size:12.5px}
.kod{display:inline-block;background:var(--sari);color:#111;border-radius:6px;padding:1px 8px;font-weight:800;font-size:13px}
.rozet{white-space:nowrap}
.b{display:inline-block;border-radius:999px;padding:3px 10px;font-size:11.5px;font-weight:700}
.b.ok{background:rgba(57,192,124,.16);color:var(--yesil)}
.b.warn{background:rgba(240,163,58,.16);color:var(--turuncu)}
.b.bad{background:rgba(239,91,91,.16);color:var(--kirmizi)}
.b.muted{background:#252a34;color:var(--soluk)}
.dipnot{color:var(--soluk);font-size:12.5px;margin:16px 2px 0}

.detay{max-width:1180px;margin:0 auto;padding:14px 18px 30px}
.detay-ust{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.detay-baslik{flex:1;min-width:220px}
.detay-baslik h1{font-size:22px;margin:7px 0 3px;line-height:1.25}

.sekmeler{display:flex;gap:6px;overflow-x:auto;margin:16px 0 12px;padding-bottom:2px;border-bottom:1px solid var(--cizgi)}
.sekmeler button{white-space:nowrap;background:transparent;border:0;border-bottom:3px solid transparent;color:var(--soluk);padding:10px 13px;min-height:44px}
.sekmeler button.aktif{color:var(--yazi);border-bottom-color:var(--sari);font-weight:700}

.panel{background:var(--kart);border:1px solid var(--cizgi);border-radius:14px;padding:12px}
.ucb-arac,.dxf-arac,.cizim-arac{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.segment{display:inline-flex;background:var(--kart2);border:1px solid var(--cizgi);border-radius:10px;padding:3px;gap:3px}
.segment button{border:0;background:transparent;color:var(--soluk);border-radius:8px;padding:8px 12px;min-height:38px}
.segment button.aktif{background:var(--sari);color:#111;font-weight:700}
.mini{display:inline-flex;align-items:center;border:1px solid var(--cizgi);background:var(--kart2);border-radius:9px;padding:8px 12px;min-height:38px;color:var(--yazi);text-decoration:none}
.mini:hover{border-color:#4a5264}
.mini.vurgu{border-color:var(--sari);color:var(--sari)}
.mini.aktif{background:var(--sari);color:#111;border-color:var(--sari)}
.dosya{position:relative;overflow:hidden}

.ucb-kap{position:relative;height:min(62vh,560px);min-height:320px;background:#0b0d11;border-radius:12px;overflow:hidden;touch-action:none}
#ucb-tuval{display:block;width:100%;height:100%}
.yukleniyor{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--soluk);z-index:2;pointer-events:none}
.ucb-ipucu{position:absolute;left:12px;bottom:10px;color:#7d8798;font-size:12px;pointer-events:none}

.dxf-kap{height:min(68vh,620px);overflow:auto;background:#0b0d11;border-radius:12px;display:flex;align-items:center;justify-content:center;padding:10px}
#dxf-resim{width:100%;height:100%;object-fit:contain;transform-origin:center center;transition:transform .08s linear}
.lejant{color:var(--soluk);font-size:12px;display:inline-flex;align-items:center;gap:6px;margin-left:auto}
.lejant i{width:16px;height:0;border-top:2px solid var(--yazi);display:inline-block}
.lejant i.bukum{border-top:2px dashed var(--sari)}

.gorsel-izgara{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.gorsel-izgara{grid-template-columns:1fr}}
.gorsel-kart{margin:0;background:var(--kart2);border:1px solid var(--cizgi);border-radius:12px;overflow:hidden;cursor:pointer}
.gorsel-kart img{display:block;width:100%;height:280px;object-fit:contain;background:#0b0d11}
.gorsel-kart figcaption{padding:9px 12px;color:var(--soluk);font-size:12.5px}
.gorsel-kart .ciz{color:var(--sari);float:right}

.cizim-kap{position:relative;display:inline-block;max-width:100%;background:#0b0d11;border-radius:12px;overflow:hidden;touch-action:none;line-height:0}
.cizim-kap img{display:block;max-width:100%;max-height:62vh;width:auto;height:auto;margin:0 auto}
#cizim-tuval{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;touch-action:none}
.cizim-kap img.dxf{width:100%;height:auto;max-height:none}
.cizim-bos{display:none;position:absolute;inset:0;align-items:center;justify-content:center;color:var(--soluk);font-size:13px;line-height:1.4;padding:20px;text-align:center}
.cizim-kap.bos .cizim-bos{display:flex}
.cizim-kap.bos img{visibility:hidden;min-height:220px}
.ayrac{width:1px;height:26px;background:var(--cizgi)}
#cizim-renk{width:44px;height:40px;background:var(--kart2);border:1px solid var(--cizgi);border-radius:9px;padding:3px}
#cizim-kalinlik{width:110px;accent-color:var(--sari)}
.cizim-alt{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.kayit-durum{color:var(--soluk);font-size:12.5px;flex:1}
.not-alan{display:block;margin-top:12px}
.not-alan span{display:block;color:var(--soluk);font-size:12.5px;margin-bottom:6px}
#not-metin{width:100%;background:var(--kart2);border:1px solid var(--cizgi);border-radius:10px;padding:12px;resize:vertical;outline:none}
#not-metin:focus{border-color:var(--sari)}

.aciklama{max-width:860px;padding:4px 4px 10px}
.aciklama h3,.aciklama h4,.aciklama h5{margin:20px 0 8px;line-height:1.3}
.aciklama h3{font-size:19px;color:var(--sari)}
.aciklama p,.aciklama li{color:#c7ceda}
.aciklama ul{padding-left:20px}
.aciklama table{border-collapse:collapse;width:100%;font-size:13.5px;margin:10px 0}
.aciklama th,.aciklama td{border:1px solid var(--cizgi);padding:7px 9px;text-align:left}
.aciklama code{background:#252a34;border-radius:4px;padding:1px 4px}
.alt-bilgi{max-width:1180px;margin:0 auto;padding:16px 18px 26px;color:#6f7889;font-size:11.5px;display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}