/* ozelbuyu.craftavia.net — büyü rehberi (craftavia.net çerçevesi içinde, her kural #ob altında) */
#ob{
  --zemin:#F5F0E7; --kagit:#FBF7EF; --kart:#FCF8F1; --cizgi:#E4D7C1; --cizgi-koyu:#D3C2A4; --yumusak:#F1E8D8;
  --yazi:#3A2B1C; --soluk:#6E5C47; --soluk2:#8C7A64; --altin:#C9A25B; --altin-acik:#D3AA6D; --vurgu:#A97424;
  --kahve:#6B4A2C; --kahve-koyu:#4E3520; --yesil:#2E7D3A; --kirmizi:#B23A2E;
  --serif:Merriweather,Georgia,"Times New Roman",serif;
  color:var(--yazi);font-size:14px;line-height:1.5;padding-bottom:28px
}
#ob *,#ob *::before,#ob *::after{box-sizing:border-box}
#ob h1,#ob h2,#ob h3,#ob h4,#ob p,#ob dl,#ob dd,#ob ol,#ob ul,#ob figure,#ob blockquote{margin:0}
#ob a{color:inherit}
#ob img{image-rendering:pixelated}
#ob [hidden]{display:none!important}
#ob .ik{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-3px}

/* ── Sayfa başlığı ── */
#ob .ob-bas{padding:4px 2px 18px}
#ob .ob-yol{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--soluk);margin-bottom:10px}
#ob .ob-yol a{text-decoration:none;color:var(--vurgu);font-weight:600}
#ob .ob-yol a:hover{text-decoration:underline}
#ob .ob-yol .ik{width:20px;height:20px;color:var(--kahve)}
#ob .ob-yol-ok{color:var(--soluk2)}
#ob .ob-bas-ic{display:flex;align-items:center;gap:18px}
#ob .ob-bas-kitap{width:84px;height:84px;flex:none;filter:drop-shadow(0 4px 6px rgba(80,50,20,.25))}
#ob .ob-bas-yazi{flex:1;min-width:0}
#ob .ob-bas h1{font:900 40px/1.1 var(--serif);color:#2E2116;display:flex;align-items:center;gap:6px}
#ob .ob-parilti{width:40px;height:32px;fill:var(--altin);stroke:none;flex:none}
#ob .ob-bas-yazi p{font-size:16px;color:var(--soluk);margin-top:6px}
#ob .ob-soz{text-align:right;flex:none}
#ob .ob-soz blockquote{font:italic 400 16px/1.45 var(--serif);color:var(--soluk2)}
#ob .ob-soz-sus{display:flex;align-items:center;gap:8px;margin-top:8px;color:var(--altin);font-size:10px;justify-content:flex-end}
#ob .ob-soz-sus::before,#ob .ob-soz-sus::after{content:"";width:46px;height:1px;background:var(--cizgi-koyu)}
#ob .ob-soz-sus i{font-style:normal}

/* ── Sekmeler ── */
#ob .ob-sekmeler{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-bottom:18px}
#ob .ob-sekmeler a{display:flex;align-items:center;justify-content:center;gap:12px;height:54px;padding:0 10px;text-decoration:none;
  background:var(--kagit);border:1px solid var(--cizgi);border-radius:6px;font-size:16px;font-weight:700;color:var(--yazi);
  box-shadow:0 1px 2px rgba(80,60,30,.05)}
#ob .ob-sekmeler a img{width:30px;height:30px}
#ob .ob-sekmeler a:hover{background:#FFFDF8;border-color:var(--cizgi-koyu)}
#ob .ob-sekmeler a[aria-current="page"]{background:var(--kahve);border:2px solid var(--altin);color:#FFF3DE;
  box-shadow:inset 0 0 0 1px rgba(255,230,180,.18),0 3px 10px rgba(78,53,32,.25)}

/* ── Panel (genel kutu) ── */
#ob .panel{background:var(--kagit);border:1px solid var(--cizgi);border-radius:8px;padding:20px 22px;margin-bottom:16px;box-shadow:0 1px 3px rgba(80,60,30,.06)}
#ob .panel-baslik{font:700 21px var(--serif);color:var(--yazi);margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--cizgi)}
#ob .panel-ust{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--vurgu);margin-bottom:6px}
#ob .panel-not{color:var(--soluk);margin-bottom:14px;max-width:860px}
#ob .slot{flex:none;display:grid;place-items:center;width:44px;height:44px;background:#EBDDC2;border:2px solid #A88456;border-radius:4px;box-shadow:inset 0 0 0 2px #F6EBD5}
#ob .slot img{width:28px;height:28px}

/* düğmeler */
#ob .pbtn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border-radius:6px;text-decoration:none;cursor:pointer;
  background:var(--kart);border:1px solid var(--cizgi-koyu);color:var(--yazi);font-weight:800;font-size:14px}
#ob .pbtn img{width:22px;height:22px}
#ob .pbtn:hover{background:#FFFDF8}
#ob .pbtn-altin{background:var(--kahve);border:2px solid var(--altin);color:#FFF3DE}
#ob .pbtn-altin:hover{background:var(--kahve-koyu)}

/* komut */
#ob .kmt{display:inline-block;font:600 13px/1.4 ui-monospace,Consolas,monospace;color:var(--yazi);background:var(--yumusak);border:1px solid var(--cizgi);border-radius:5px;padding:1px 7px;cursor:pointer;white-space:nowrap}
#ob .kmt:hover{border-color:var(--altin)}

/* ── Genel bakış ── */
#ob .giris{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:28px;align-items:center;padding:26px}
#ob .giris-baslik{font:900 30px/1.2 var(--serif);color:var(--yazi);margin-bottom:10px}
#ob .giris-yazi>p:not(.panel-ust){font-size:15.5px;color:var(--soluk);max-width:540px}
#ob .giris-sayilar{display:flex;gap:8px;margin:18px 0;flex-wrap:wrap}
#ob .giris-sayilar div{background:var(--kart);border:1px solid var(--cizgi);border-radius:6px;padding:6px 14px}
#ob .giris-sayilar b{font:900 18px var(--serif);margin-right:6px}
#ob .giris-sayilar span{color:var(--soluk);font-size:13.5px}
#ob .giris-btn{display:flex;gap:10px;flex-wrap:wrap}
#ob .giris-ornek .kart{cursor:pointer}
#ob .nadirlik-sira{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
#ob .nadirlik-sira button{all:unset;box-sizing:border-box;cursor:pointer;background:var(--kart);border:1px solid var(--cizgi);border-left:4px solid var(--gk);border-radius:6px;padding:9px 11px;display:flex;flex-direction:column;gap:1px}
#ob .nadirlik-sira button:hover{background:#FFFDF8;border-color:var(--cizgi-koyu);border-left-color:var(--gk)}
#ob .nadirlik-sira b{font:700 14px var(--serif);color:var(--gk)}
#ob .nadirlik-sira span{font-size:12px;color:var(--soluk)}
#ob .uclu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#ob .kutu-bas{display:flex;align-items:center;gap:12px;margin-bottom:10px}
#ob .kutu-bas h2{font:700 18px var(--serif)}
#ob .kutu p{color:var(--soluk);font-size:14px}

/* ── Büyüler: filtre + sonuçlar ── */
#ob .rehber-duzen{display:grid;grid-template-columns:310px minmax(0,1fr);gap:16px;align-items:start}
#ob .filtre{position:sticky;top:12px;padding:6px 14px 14px;display:flex;flex-direction:column;max-height:calc(100vh - 24px);margin:0}
#ob .filtre-ic{overflow-y:auto;min-height:0;margin:0 -8px;padding:0 8px;scrollbar-width:thin;scrollbar-color:var(--cizgi-koyu) transparent}
#ob .filtre-ac{display:none}
#ob .grup{border-bottom:1px solid var(--cizgi)}
#ob .grup summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;padding:12px 2px;font-size:12.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--yazi)}
#ob .grup summary::-webkit-details-marker{display:none}
#ob .grup summary img{width:18px;height:18px}
#ob .grup summary .ok{margin-left:auto;color:var(--soluk);transition:transform .15s}
#ob .grup[open] summary .ok{transform:rotate(180deg)}
#ob .ara{display:block;margin:0 0 12px}
#ob .ara input{width:100%;height:38px;border:1px solid var(--cizgi-koyu);border-radius:6px;background:#FFFDF8;padding:0 12px;font:inherit;font-size:13.5px;color:var(--yazi);outline:none}
#ob .ara input:focus{border-color:var(--altin);box-shadow:0 0 0 3px rgba(201,162,91,.18)}
#ob .ara input::placeholder{color:var(--soluk2)}
#ob .dugmeler{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:0 0 12px}
#ob .dugmeler-genis{grid-template-columns:1fr}
#ob .fbtn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:7px;min-height:30px;padding:3px 8px;min-width:0;
  background:#F4ECDD;border:1px solid #DCCDB3;border-radius:4px;font-size:12px;font-weight:700;color:var(--yazi);line-height:1.1}
#ob .fbtn img{width:20px;height:20px;flex:none}
#ob .fbtn .ik{width:16px;height:16px;color:var(--altin)}
#ob .fbtn span{overflow-wrap:normal}
#ob .fbtn small{margin-left:auto;font-size:11px;font-weight:600;color:var(--soluk2);flex:none}
#ob .fbtn:hover{background:#FBF4E6;border-color:var(--cizgi-koyu)}
#ob .fbtn[aria-pressed="true"]{background:var(--kahve);border-color:var(--kahve-koyu);color:#FFF3DE}
#ob .fbtn[aria-pressed="true"] small{color:#E8D5B3}
#ob .fbtn .kare{width:13px;height:13px;flex:none;background:var(--gk);border:1px solid rgba(0,0,0,.25);border-radius:2px}
#ob .filtre-alt{padding-top:14px}
#ob .sifirla{all:unset;box-sizing:border-box;cursor:pointer;width:100%;height:42px;display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--kirmizi);border:1px solid #8E2B21;border-radius:6px;color:#FFF;font-size:13px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
#ob .sifirla:hover{background:#9F3127}

#ob .sonuc-bas{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--kagit);border:1px solid var(--cizgi);border-radius:8px;padding:0 10px 0 16px;height:52px;margin-bottom:12px;box-shadow:0 1px 3px rgba(80,60,30,.06)}
#ob .sonuc-bas h2{display:flex;align-items:center;gap:10px;font:700 18px var(--serif);color:var(--yazi)}
#ob .sonuc-bas h2 .ik{color:var(--kahve)}
#ob .sonuc-sag{display:flex;align-items:center;gap:4px;font-size:14px;color:var(--soluk)}
#ob #sonuc-say{margin-right:8px}
#ob .ok-btn{all:unset;cursor:pointer;width:30px;height:30px;display:grid;place-items:center;border-radius:6px;color:var(--yazi)}
#ob .ok-btn:hover{background:var(--yumusak)}
#ob .ok-btn:disabled{opacity:.3;cursor:default;background:none}

/* ── Büyü kartı ── */
#ob .kartlar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#ob .kart{cursor:pointer;display:flex;flex-direction:column;min-width:0;background:var(--kart);border:1px solid var(--cizgi-koyu);border-radius:6px;padding:12px 14px 10px;color:var(--yazi);
  box-shadow:0 1px 3px rgba(80,60,30,.07);transition:box-shadow .15s,border-color .15s}
#ob .kart:hover{border-color:var(--altin);box-shadow:0 6px 18px rgba(80,60,30,.13)}
#ob .kart:focus-visible{outline:3px solid var(--altin);outline-offset:2px}
#ob .k-ust{display:flex;gap:12px;align-items:flex-start;padding-bottom:10px;border-bottom:1px solid var(--cizgi);margin-bottom:9px}
#ob .k-ikon{flex:none;width:50px;height:50px;display:grid;place-items:center;background:#EBDDC2;border:2px solid #A88456;border-radius:4px;box-shadow:inset 0 0 0 2px #F6EBD5}
#ob .k-ikon img{width:32px;height:32px}
#ob .k-bas{flex:1;min-width:0;padding-top:2px}
#ob .k-ad{font:700 17px/1.2 var(--serif);color:var(--yazi);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ob .k-etiket{display:flex;gap:5px;margin-top:6px;flex-wrap:wrap}
#ob .k-etiket span{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:800;letter-spacing:.05em;line-height:1;padding:4px 6px;border-radius:3px;text-transform:uppercase;
  background:#EADBC0;color:#6B5232;border:1px solid #D8C6A5}
#ob .k-etiket span.r{background:var(--gk);color:#FFF;border-color:rgba(0,0,0,.12)}
#ob .k-etiket span.r i{width:7px;height:7px;background:rgba(255,255,255,.85);border-radius:1px}
#ob .yildiz{flex:none;margin-left:2px;width:26px;height:26px;display:grid;place-items:center;border-radius:5px;color:var(--altin);cursor:pointer}
#ob .yildiz .ik{width:19px;height:19px;stroke-width:1.8}
#ob .yildiz:hover{background:var(--yumusak)}
#ob .yildiz.acik .ik{fill:var(--altin)}
#ob .k-acik{font-size:13.5px;color:var(--yazi);min-height:40px}
#ob .k-deger{display:grid;grid-template-columns:1fr auto;row-gap:1px;margin:8px 0 0;font-size:13px}
#ob .k-deger dt{color:var(--soluk)}
#ob .k-deger dd{margin:0;text-align:right;font-weight:700;color:var(--yesil)}
#ob .elmas{font-style:normal;font-size:11px;margin-right:4px;color:var(--yesil)}
#ob .k-alt{display:flex;align-items:center;gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid var(--cizgi);font-size:12.5px;color:var(--soluk)}
#ob .k-alt .ik{width:17px;height:17px;color:var(--soluk2)}
#ob .bos{grid-column:1/-1;background:var(--kart);border:1px solid var(--cizgi);border-radius:8px;padding:34px;text-align:center;color:var(--soluk)}

/* eşya kartı */
#ob .esya-kart{cursor:default}
#ob .esya-kart:hover{border-color:var(--cizgi-koyu);box-shadow:0 1px 3px rgba(80,60,30,.07)}
#ob .k-fiyat{display:flex;align-items:center;gap:6px;margin-top:9px;padding-top:8px;border-top:1px solid var(--cizgi);font-weight:800;font-size:14px;color:var(--yesil)}
#ob .k-fiyat img{width:18px;height:18px}
#ob .k-fiyat small{font-weight:500;font-size:12px;color:var(--soluk);margin-left:4px}

/* sayfalama */
#ob .sayfalar{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:18px}
#ob .sayfalar button{all:unset;cursor:pointer;min-width:34px;height:34px;display:grid;place-items:center;padding:0 6px;box-sizing:border-box;
  background:var(--kagit);border:1px solid var(--cizgi);border-radius:6px;font-weight:700;font-size:14px;color:var(--yazi)}
#ob .sayfalar button:hover{background:#FFFDF8;border-color:var(--cizgi-koyu)}
#ob .sayfalar button[aria-current="page"]{background:var(--kahve);border-color:var(--altin);color:#FFF3DE}
#ob .sayfalar button:disabled{opacity:.35;cursor:default}
#ob .sayfalar .bosluk{color:var(--soluk2);align-self:center;padding:0 2px}

/* ── Rozetler (detay) ── */
#ob .bayraklar{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
#ob .bayrak{font-size:10.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:3px 6px;border-radius:3px;border:1px solid var(--cizgi);background:var(--yumusak);color:var(--soluk)}
#ob .b-ruh{background:#F7E6E1;border-color:#EBCBC3;color:#9C3B2E}
#ob .b-yuk{background:#E6EEF4;border-color:#C9D9E6;color:#2F5F86}
#ob .b-cak{background:#F5EAD7;border-color:#E6D2AE;color:#8A5A14}

/* ── Tablolar ── */
#ob .tablo-kap{overflow-x:auto;background:var(--kart);border:1px solid var(--cizgi);border-radius:6px}
#ob .tablo{width:100%;border-collapse:collapse;min-width:740px;color:var(--yazi);font-size:14px}
#ob .tablo th{text-align:left;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--soluk);padding:10px 14px;border-bottom:1px solid var(--cizgi);background:var(--yumusak)}
#ob .tablo td{padding:10px 14px;border-bottom:1px solid var(--cizgi);white-space:nowrap}
#ob .tablo tr:last-child td{border-bottom:0}
#ob .tablo .t-ad{font:700 15px var(--serif);color:var(--gk)}
#ob .tablo .sol{color:var(--soluk);font-size:12.5px}
#ob .bar{display:inline-block;width:100px;height:8px;background:var(--yumusak);border-radius:4px;position:relative;overflow:hidden;margin-right:8px;vertical-align:0}
#ob .bar i{position:absolute;top:0;bottom:0;background:var(--gk);border-radius:4px}
#ob .notlar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:20px}

/* ── Rehber / komutlar ── */
#ob .adimlar{list-style:none;padding:0;display:grid;gap:8px;counter-reset:a}
#ob .adimlar li{counter-increment:a;display:flex;gap:14px;align-items:center;background:var(--kart);border:1px solid var(--cizgi);border-radius:6px;padding:12px 14px}
#ob .adimlar h3{font:700 16px var(--serif);margin-bottom:2px}
#ob .adimlar h3::before{content:counter(a) ". ";color:var(--vurgu)}
#ob .adimlar p{color:var(--soluk);font-size:14px}
#ob .komutlar{display:grid;gap:8px}
#ob .komutlar div{display:grid;grid-template-columns:130px 1fr;gap:14px;align-items:center;background:var(--kart);border:1px solid var(--cizgi);border-radius:6px;padding:10px 14px}
#ob .komutlar .kmt{justify-self:start;font-size:14px;padding:3px 9px}
#ob .komutlar p{color:var(--soluk)}

/* ── Detay penceresi ── */
#ob .detay{padding:0;border:0;background:transparent;width:min(580px,calc(100vw - 24px));max-height:calc(100vh - 32px);overflow:visible}
#ob .detay::backdrop{background:rgba(46,33,22,.5)}
#ob .detay .kart{cursor:default;width:100%;max-height:calc(100vh - 32px);overflow-y:auto;padding:16px 18px;box-shadow:0 20px 60px rgba(46,33,22,.35)}
#ob .detay .kart:hover{border-color:var(--cizgi-koyu)}
#ob .detay .kart>*{flex-shrink:0}
#ob .detay .k-acik{font-size:14.5px}
#ob .kapat{all:unset;cursor:pointer;width:28px;height:28px;display:grid;place-items:center;border-radius:5px;color:var(--soluk);font-size:16px;border:1px solid var(--cizgi)}
#ob .kapat:hover{background:var(--yumusak);color:var(--yazi)}
#ob .d-liste{margin:6px 0 0;padding:0;list-style:none;font-size:13px;color:var(--soluk)}
#ob .d-liste li{padding-left:14px;position:relative;margin-bottom:2px}
#ob .d-liste li::before{content:"▸";position:absolute;left:0;color:var(--vurgu)}
#ob .d-bolum{margin-top:14px}
#ob .d-bolum h4{margin:0 0 7px;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--yazi);display:flex;align-items:center;gap:8px}
#ob .d-bolum h4::after{content:"";flex:1;height:1px;background:var(--cizgi)}
#ob .etkiler{display:flex;flex-direction:column;gap:4px}
#ob .etki{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:12.5px}
#ob .etki b{font-size:12px;color:var(--soluk);margin-right:2px;min-width:62px}
#ob .etki span{background:var(--yumusak);border:1px solid var(--cizgi);border-radius:4px;padding:0 6px;line-height:20px;color:var(--yazi)}
#ob .d-tablo-kap{overflow-x:auto;border:1px solid var(--cizgi);border-radius:6px}
#ob .d-tablo{width:100%;border-collapse:collapse;font-size:13px}
#ob .d-tablo th{background:var(--yumusak);text-align:left;font-size:11.5px;font-weight:800;color:var(--soluk);padding:6px 10px;border-bottom:1px solid var(--cizgi)}
#ob .d-tablo td{padding:5px 10px;border-bottom:1px solid var(--yumusak);font-weight:700;color:var(--yesil)}
#ob .d-tablo td:first-child{color:var(--gk);font-family:var(--serif)}
#ob .d-tablo tr:last-child td{border-bottom:0}
#ob .d-kural{display:grid;grid-template-columns:110px 1fr;gap:8px;align-items:start;padding:6px 0;border-bottom:1px dashed var(--cizgi);font-size:13px}
#ob .d-kural:last-child{border-bottom:0}
#ob .d-kural>span{color:var(--soluk);padding-top:3px}
#ob .d-kural>div{display:flex;flex-wrap:wrap;gap:4px}
#ob .d-not{flex-basis:100%;color:var(--soluk);font-size:12px}
#ob .blink{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:2px 8px 2px 4px;background:var(--kart);border:1px solid var(--cizgi-koyu);border-left:3px solid var(--gk);border-radius:4px;font-weight:700;font-size:12.5px;color:var(--yazi)}
#ob .blink img{width:16px;height:16px}
#ob .blink:hover{background:#FFFDF8;border-color:var(--altin);border-left-color:var(--gk)}
#ob .blink-v{cursor:default;padding-left:8px;border-left-width:1px}
#ob .blink-v small{font-weight:400;font-size:11px;color:var(--soluk)}
#ob .kirmizi{font-style:normal;color:var(--kirmizi)}
#ob .d-alt{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding-top:10px;border-top:1px solid var(--cizgi);font-size:12.5px;color:var(--soluk)}

/* bildirim */
#ob .bildirim{position:fixed;left:50%;bottom:22px;transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:.18s;z-index:2000;
  background:var(--kahve);color:#FFF3DE;border:1px solid var(--altin);border-radius:8px;padding:9px 15px;font-weight:700;font-size:14px}
#ob .bildirim.acik{opacity:1;transform:translate(-50%,0)}

/* ── Duyarlı ── */
@media (max-width:1180px){
  #ob .kartlar{grid-template-columns:repeat(2,minmax(0,1fr))}
  #ob .nadirlik-sira{grid-template-columns:repeat(4,minmax(0,1fr))}
  #ob .ob-sekmeler a{font-size:14px;gap:8px}
  #ob .ob-sekmeler a img{width:24px;height:24px}
}
@media (max-width:900px){
  #ob .ob-soz{display:none}
  #ob .ob-sekmeler{grid-template-columns:repeat(3,minmax(0,1fr))}
  #ob .giris{grid-template-columns:1fr;padding:20px}
  #ob .uclu,#ob .notlar{grid-template-columns:1fr;gap:0}
  #ob .rehber-duzen{grid-template-columns:1fr}
  #ob .filtre{position:static;max-height:none;padding:4px 14px}
  #ob .filtre-ac{all:unset;box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;cursor:pointer;width:100%;padding:10px 2px;font-size:13px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
  #ob .filtre-ac::after{content:"▾"}
  #ob .filtre-ac[aria-expanded="true"]::after{content:"▴"}
  #ob .filtre:not(.acik) .filtre-ic,#ob .filtre:not(.acik) .filtre-alt{display:none}
  #ob .filtre.acik{padding-bottom:14px}
  #ob .dugmeler{grid-template-columns:repeat(3,minmax(0,1fr))}
  #ob .dugmeler-genis{grid-template-columns:1fr}
}
@media (max-width:640px){
  #ob .ob-bas h1{font-size:30px}
  #ob .ob-bas-kitap{width:60px;height:60px}
  #ob .ob-bas-yazi p{font-size:14px}
  #ob .ob-sekmeler{grid-template-columns:repeat(2,minmax(0,1fr))}
  #ob .ob-sekmeler a{height:46px;font-size:13.5px;justify-content:flex-start;padding:0 12px}
  #ob .kartlar{grid-template-columns:1fr}
  #ob .nadirlik-sira{grid-template-columns:repeat(2,minmax(0,1fr))}
  #ob .dugmeler{grid-template-columns:repeat(2,minmax(0,1fr))}
  #ob .komutlar div{grid-template-columns:1fr;gap:4px}
  #ob .panel{padding:14px}
  #ob .giris-baslik{font-size:24px}
  #ob .sonuc-bas{padding:0 6px 0 12px}
  #ob .sonuc-bas h2{font-size:16px}
  #ob #sonuc-say{font-size:12.5px;margin-right:2px}
}

/* craftavia.net bağlantı rengini !important ile veriyor; sekme ve düğme bağlantılarında kendi rengimiz */
#ob .ob-sekmeler a,#ob .pbtn{color:var(--yazi)!important;text-decoration:none!important}
#ob .ob-sekmeler a[aria-current="page"],#ob .pbtn-altin{color:#FFF3DE!important}
#ob .ob-yol a{color:var(--vurgu)!important}