/* ⛔ EN KRİTİK KURAL — SİLME. (2026-08-13, canlıda ölçülerek bulundu.) `app.css` şu satırı taşıyor: #autodrops, #eventpresents, #eventtimes, #exchangerates, #fishingdrops, #kingsystem, #miningdrops, #moblist, #pusitems, #premiumgifts, #upgraderates { display:none } Bu, ESKİ rehber sayfasının sekme mekanizmasıydı: bütün bölümler gizlenir, JS biri açardı. Yeni sayfa AYNI id'leri (pusitems/premiumgifts/upgraderates) yeniden kullandığı için o üç bölüm içerik dolu olmasına rağmen `display:none` kalıyordu — ölçüldü: yükseklik 0, metin 21.162 karakter. Sahibin "POWER UP STORE menüsü var ama PUS gelmiyor" dediği hata TAM OLARAK BUDUR. `.gmrreh-shell #id` özgüllüğü (1,1,0) > `#id` (1,0,0), üstelik !important ile sabitlendi. ⚠ Bu üç id'yi yeniden adlandırırsan bu kural da güncellenmeli (çapalar ve JS onlara bakıyor). */ .gmrreh-shell #pusitems, .gmrreh-shell #premiumgifts, .gmrreh-shell #upgraderates { display: block !important; } /* --------------------------------------------------------------------------------------------- OYUNCU REHBERİ — bağımsız stil. Tüm sınıflar `gmrreh-`, tüm veri kancaları `data-gr-*` önekli. Yeni dosya / CDN YOK: sayfanın tamamı bu blokta. İçinde medya sorgusu YOKTUR (Blade direktifi sanar). Palet: zemin #0d0e10 / #131317 · altın #e8c37a / #c9a24a · krem #efe6d2. --------------------------------------------------------------------------------------------- */ body.wok-3d-shell.route-guide { --gr-bg:#0d0e10; --gr-bg2:#131317; --gr-bg3:#181920; --gr-line:rgba(232,195,122,.17); --gr-line2:rgba(232,195,122,.38); --gr-gold:#e8c37a; --gr-gold2:#c9a24a; --gr-cream:#efe6d2; --gr-text:#bdb7ab; --gr-muted:#8b857a; --gr-face:"Segoe UI",Tahoma,Arial,sans-serif; font-family:var(--gr-face) !important; } /* Kabuk sıfırlaması — /download ile aynı reçete (wok-guide.css bilerek yüklenmiyor). */ body.route-guide::before, body.route-guide::after, body.route-guide .cont-items::before { display:none !important; } body.route-guide .main, body.route-guide .cont-items { width:100% !important; max-width:none !important; background:transparent !important; } body.route-guide .cont-items { min-height:calc(100vh - 86px); padding:0 0 82px !important; } body.route-guide .gmrreh, body.route-guide .gmrreh *, body.route-guide .gmrreh-hero, body.route-guide .gmrreh-hero * { box-sizing:border-box; } /* --- HERO ----------------------------------------------------------------------------------- Kap `.guide-hero`dır: tam genişlik afiş + gmr-inner-hero-v1.jpg gmr-unified-page-hero.css'ten gelir (route-guide o dosyada ADIYLA listelidir). Başlık o dosyanın serif/gradyan kuralını EZER — sahip sade sans-serif istedi; wok-download.css:29-33'teki ezme reçetesinin route-guide eşi. */ body.route-guide .gmrreh-hero__in { width:100%; } body.wok-3d-shell.route-guide:not(.route-landing):not(.route-home) h1.gmrreh-hero__title { margin:0 !important; padding:0 !important; color:var(--gr-cream) !important; font-family:var(--gr-face) !important; font-size:clamp(32px,3.4vw,46px) !important; font-weight:750 !important; line-height:1.18 !important; letter-spacing:.015em !important; text-align:center !important; text-transform:none !important; text-shadow:none !important; background:none !important; -webkit-background-clip:initial !important; background-clip:initial !important; -webkit-text-fill-color:var(--gr-cream) !important; filter:none !important; animation:none !important; } body.wok-3d-shell.route-guide p.gmrreh-hero__sub { max-width:720px !important; margin:14px auto 0 !important; color:rgba(232,224,210,.76) !important; font-family:var(--gr-face) !important; font-size:13px !important; font-weight:400 !important; line-height:1.7 !important; text-align:center !important; text-shadow:0 2px 14px rgba(0,0,0,.9) !important; } /* --- SAYFA IZGARASI ------------------------------------------------------------------------- İki sütun medya sorgusuz: flex-wrap. Dar ekranda `.gmrreh-main` alt satıra düşer, ikisi de tam genişlik olur. Dizinin yapışkanlığı dar ekranda JS'in verdiği `.is-narrow` ile kapanır. */ body.route-guide .gmrreh { max-width:1320px; margin:0 auto; /* sol boşluk sabit sosyal rayı (58px) hesaba katar */ padding:0 clamp(14px,3vw,32px) 0 clamp(14px,5.4vw,78px); color:var(--gr-text); font-family:var(--gr-face); font-size:14px; line-height:1.75; } body.route-guide .gmrreh-shell { display:flex; flex-wrap:wrap; align-items:flex-start; gap:24px; } /* --- SOL DİZİN — TEK SÜTUN ------------------------------------------------------------------ ⚠ BURADA grid-template-columns / flex-wrap / float KULLANILMAZ. Liste blok akışındadır: her madde tam genişlikte TEK SATIRDIR; sütun, en uzun başlık (BAŞLANGIÇ İTEMLERİ) tek satıra sığacak şekilde ölçüldü. */ body.route-guide .gmrreh-nav { position:sticky; top:92px; z-index:20; /* 276/308px: en uzun başlık ("BAŞLANGIÇ İTEMLERİ" ≈ 150px @13px/600) ikon+sıra no+boşluklar düşüldükten sonra ~190px'lik metin alanına TEK SATIR sığsın diye ölçüldü. */ flex:1 1 276px; max-width:308px; max-height:calc(100vh - 118px); padding:14px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#6f5527 #0a0a0c; background:linear-gradient(180deg,#131317,#0b0c0e); border:1px solid var(--gr-line); border-radius:10px; box-shadow:0 16px 34px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,246,219,.03); } body.route-guide .gmrreh-shell.is-narrow .gmrreh-nav { position:static; max-width:none; max-height:none; overflow:visible; } body.route-guide .gmrreh-nav::-webkit-scrollbar { width:6px; } body.route-guide .gmrreh-nav::-webkit-scrollbar-track { background:#0a0a0c; } body.route-guide .gmrreh-nav::-webkit-scrollbar-thumb { background:#6f5527; border-radius:8px; } body.route-guide .gmrreh-nav__cap { margin:0 0 12px; padding:0 0 10px; color:var(--gr-gold2); font-size:10px; font-weight:800; letter-spacing:.22em; text-transform:uppercase; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-nav__toggle { display:none; width:100%; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px; padding:10px 12px; color:var(--gr-cream); font-family:var(--gr-face); font-size:13px; font-weight:700; text-align:left; background:#16171c; border:1px solid var(--gr-line2); border-radius:8px; cursor:pointer; } body.route-guide .gmrreh-shell.is-narrow .gmrreh-nav__toggle { display:flex; } body.route-guide .gmrreh-shell.is-narrow .gmrreh-nav__list { display:none; } body.route-guide .gmrreh-shell.is-narrow .gmrreh-nav.is-open .gmrreh-nav__list { display:block; } /* TEK SÜTUN: blok akışı, madde başına tam genişlik. */ body.route-guide .gmrreh-nav__list { display:block; width:100%; margin:0; padding:0; list-style:none; } body.route-guide .gmrreh-nav__list > li { display:block; float:none; width:100%; margin:0 0 5px; padding:0; list-style:none; } body.route-guide .gmrreh-nav__list > li:last-child { margin-bottom:0; } body.route-guide a.gmrreh-nav__link { display:flex; align-items:center; gap:10px; width:100%; min-height:48px; padding:7px 11px; color:var(--gr-text); font-size:13px; font-weight:600; line-height:1.3; text-decoration:none; background:#0e0f12; border:1px solid rgba(232,195,122,.10); border-left:3px solid transparent; border-radius:8px; transition:background .16s ease, border-color .16s ease, color .16s ease; } body.route-guide a.gmrreh-nav__link:hover, body.route-guide a.gmrreh-nav__link:focus { color:var(--gr-cream); text-decoration:none; background:#16171c; border-color:var(--gr-line2); border-left-color:var(--gr-gold2); } body.route-guide a.gmrreh-nav__link.is-active { color:var(--gr-cream); background:linear-gradient(90deg,rgba(201,162,74,.20),rgba(201,162,74,.05)); border-color:var(--gr-line2); border-left-color:var(--gr-gold); } body.route-guide .gmrreh-nav__ico { flex:0 0 28px; display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; } body.route-guide .gmrreh-nav__ico img { width:28px; height:28px; object-fit:contain; } body.route-guide .gmrreh-nav__no { flex:0 0 auto; color:var(--gr-gold2); font-size:11px; font-weight:800; letter-spacing:.06em; } body.route-guide a.gmrreh-nav__link.is-active .gmrreh-nav__no { color:var(--gr-gold); } body.route-guide .gmrreh-nav__txt { flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* --- BÖLÜM KABI ----------------------------------------------------------------------------- */ body.route-guide .gmrreh-main { flex:9 1 620px; min-width:0; } /* Bölümler arası boşluk 30 → 54 px (sahip 2026-08-18: "maddeler arası boşluk biraz daha bırak, okurken araya karışıyor"). Ayrıca bölüm başlığının altı ve paragraf araları da açıldı — asıl karışma bölüm İÇİNDE, sıkışık satırlarda oluyordu. */ body.route-guide .gmrreh-sec { position:relative; /* ayraç bu kutuya göre konumlanır */ margin:0 0 108px; padding:clamp(20px,2.5vw,30px); scroll-margin-top:150px; background:linear-gradient(158deg,rgba(23,24,29,.96),rgba(11,12,14,.97)); border:1px solid var(--gr-line); border-radius:10px; box-shadow:0 18px 40px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,246,219,.025); } body.route-guide .gmrreh-sec:last-child { margin-bottom:0; } /* --- MADDELER ARASI AYRAÇ (sahip 2026-08-18: "araya ayraç ekle, tam belli olsun") ------------ Boşluğun TAM ORTASINDA solan altın çizgi + elmas. Ayrı bir HTML öğesi eklemek yerine pseudo-element: 13 bölümün hepsine elle satır eklemek gerekmiyor ve son bölümde `:not(:last-child)` sayesinde kendiliğinden çıkmıyor. ⚠ `:last-child` eşleşmesini pseudo-element bozmaz, o yüzden aşağıdaki `.gmrreh-main::after` kaydırma payı bu kuralı etkilemez. */ body.route-guide .gmrreh-sec:not(:last-child)::after { content:''; position:absolute; left:12%; right:12%; bottom:-55px; height:1px; background:linear-gradient(90deg, transparent, rgba(201,162,74,.38) 25%, rgba(201,162,74,.38) 75%, transparent); pointer-events:none; } body.route-guide .gmrreh-sec:not(:last-child)::before { content:''; position:absolute; left:50%; bottom:-55px; z-index:1; width:8px; height:8px; margin:0 0 -4px -4px; background:var(--gr-gold, #c9a24a); opacity:.85; transform:rotate(45deg); pointer-events:none; } /* --- SON MADDELERİN TEPEYE ÇIKAMAMASI — ÖLÇÜLMÜŞ HATA (2026-08-18) --------------------------- Sahip: "13 12 11 maddeye basınca madde ortalanmıyor, aşağıda kalıyor." Sebep kaydırma kodu DEĞİLDİ: sayfanın sonunda yeterli yer yoktu. Ölçüm (720 px'lik pencere): belge 13.637 px, en fazla kaydırma 12.917 px, 13. bölümün istediği konum 13.048 px → 131 px ULAŞILAMIYOR. Tarayıcı elinden geleni yapıp sayfa sonuna gidiyor, bölüm de ekranın ortasında/altında kalıyor. Ekran ne kadar uzunsa açık o kadar büyür; 1080 px'lik bir pencerede 11. ve 12. bölümler de düşer — sahibin tarif ettiği tablo tam olarak bu. Çözüm: ana sütunun sonuna kaydırma payı — ve pay EKRAN BOYUNDAN BAĞIMSIZ güvenli olmalı. Gereken pay = ekran − 104 − sonBölümYüksekliği. `100vh − 260px` seçilirse koşul "son bölüm ≥ 156 px" e iner ki her bölüm bundan uzun. (Sabit 70vh denendi: 1440 px'lik ekranda pay yalnız 80 px kalıyordu, 1600 px'te yine açık verirdi.) */ body.route-guide .gmrreh-main::after { content:''; display:block; pointer-events:none; height:max(240px, calc(100vh - 260px)); } body.route-guide .gmrreh-sec__head { display:flex; align-items:center; justify-content:flex-start; gap:12px; flex-wrap:wrap; margin:0 0 18px; padding:0 0 14px; text-align:left; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-sec__ico { flex:0 0 34px; display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; } body.route-guide .gmrreh-sec__ico img { width:34px; height:34px; object-fit:contain; } body.route-guide .gmrreh-sec__no { color:var(--gr-gold2); font-size:12px; font-weight:800; letter-spacing:.14em; } body.route-guide .gmrreh-sec h2.gmrreh-sec__title { flex:0 1 auto; margin:0; padding:0; color:var(--gr-cream); font-family:var(--gr-face); font-size:clamp(17px,1.5vw,21px); font-weight:750; line-height:1.25; letter-spacing:.02em; text-align:left; text-transform:none; text-shadow:none; background:none; -webkit-text-fill-color:var(--gr-cream); } body.route-guide .gmrreh-sec__meta { margin-left:auto; padding:4px 10px; color:var(--gr-gold); font-size:11px; font-weight:700; letter-spacing:.04em; background:rgba(201,162,74,.10); border:1px solid var(--gr-line); border-radius:20px; } /* --- METİN PARÇALARI ------------------------------------------------------------------------ */ body.route-guide .gmrreh-lead { margin:0 0 16px; color:var(--gr-text); font-size:13.5px; } body.route-guide .gmrreh h3.gmrreh-h3 { margin:20px 0 12px; padding:0; color:var(--gr-cream); font-family:var(--gr-face); font-size:15px; font-weight:750; letter-spacing:.02em; text-align:left; text-transform:none; text-shadow:none; background:none; -webkit-text-fill-color:var(--gr-cream); } body.route-guide .gmrreh-sub { margin:18px 0 10px; color:var(--gr-gold2); font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; } body.route-guide .gmrreh-empty { margin:0; padding:16px 18px; color:var(--gr-muted); font-size:13px; background:#0c0d10; border:1px dashed var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-strong { color:var(--gr-cream); font-weight:700; } body.route-guide .gmrreh p { margin:0 0 10px; } /* --- SKİLL AÇMA REHBERİ (09) ------------------------------------------------------------------ Tamamen metin bir bölüm; diğer bölümlerdeki kart diliyle aynı zemin/kenarlık kullanılır ki sayfada yabancı durmasın. "Önemli madde" sahibin isteğiyle RENKLİ bir şerittir. */ body.route-guide .gmrreh-skill { padding:18px 18px 16px; background:linear-gradient(180deg,#15161b,#0d0e11); border:1px solid var(--gr-line); border-radius:10px; } body.route-guide .gmrreh-skill__bas { display:flex; align-items:center; gap:12px; margin:0 0 14px; padding:0 0 12px; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-skill__ico { width:45px; height:45px; flex:0 0 auto; object-fit:contain; image-rendering:auto; filter:drop-shadow(0 3px 8px rgba(0,0,0,.6)); } body.route-guide .gmrreh-skill__bas h3 { margin:0; color:var(--gr-cream); font-family:var(--gr-face); font-size:16px; font-weight:800; letter-spacing:.3px; line-height:1.3; } body.route-guide .gmrreh-skill .gmrreh-lead { margin:0 0 9px; } body.route-guide .gmrreh-skill__onemli { display:flex; align-items:flex-start; gap:9px; margin:14px 0; padding:11px 14px; color:#f3cf8c; font-size:13.5px; font-weight:700; line-height:1.5; background:rgba(201,162,74,.1); border:1px solid rgba(201,162,74,.4); border-left:3px solid var(--gr-gold); border-radius:8px; } body.route-guide .gmrreh-skill__onemli::before { content:'!'; flex:0 0 auto; width:19px; height:19px; margin-top:1px; color:#10110f; font-size:12px; font-weight:900; line-height:19px; text-align:center; background:var(--gr-gold); border-radius:50%; } body.route-guide .gmrreh-skill__altbas { margin:16px 0 9px; color:var(--gr-gold2); font-size:13px; font-weight:800; letter-spacing:.4px; } body.route-guide .gmrreh-skill__liste { margin:0; padding:0; list-style:none; display:grid; gap:7px; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); } body.route-guide .gmrreh-skill__liste li { display:flex; align-items:center; gap:9px; min-height:40px; padding:8px 12px; color:var(--gr-text); font-size:13px; line-height:1.4; background:#0e0f12; border:1px solid var(--gr-line); border-radius:8px; } body.route-guide .gmrreh-skill__liste li::before { content:''; flex:0 0 auto; width:6px; height:6px; background:var(--gr-gold); border-radius:50%; box-shadow:0 0 7px rgba(201,162,74,.75); } /* --- PARCHMENT REHBERİ (10) ------------------------------------------------------------------- Dört seviye yan yana kart olarak. Kartlar eşit yükseklikte değil (içerik farklı) — bilerek, grid `align-items:start` ile üstten hizalanıyor; zorla eşitlemek boş alan yaratıyordu. */ /* KART BOYLARI EŞİT — sahip 2026-08-17: "buradaki kutuları eşitlesene, boylar kötü duruyor". Önce `align-items:start` vardı (içerik farklı diye bilerek); ekranda Parchment 1'in altında kocaman boşluk bırakıyordu. Artık satırdaki kartlar en uzuna göre GERİLİYOR (stretch) ve kart bir flex sütunu olduğu için "Drop Listesi" düğmesi + kırma/yükseltme bloğu `margin-top:auto` ile HEP DİBE yaslanır → kartlar aynı boyda, düğmeler aynı hizada. ⚠ !important: tema `div`lere display/margin dayatıp bu kuralları eziyordu (aynı savaş düğme renginde de yaşandı). */ html body.route-guide .gmrreh-parc { display:grid !important; gap:14px; align-items:stretch !important; grid-template-columns:repeat(auto-fit,minmax(288px,1fr)); margin:16px 0 0; } html body.route-guide .gmrreh-parc__kart { display:flex !important; flex-direction:column !important; padding:16px 16px 14px; background:linear-gradient(180deg,#15161b,#0d0e11); border:1px solid var(--gr-line); border-radius:10px; } /* Düğmeden önceki son içerik ile arada garanti boşluk (auto margin sıfıra düşerse bile). */ html body.route-guide .gmrreh-parc__liste, html body.route-guide .gmrreh-parc__ozet { margin-bottom:14px !important; } body.route-guide .gmrreh-parc__bas { display:flex; align-items:center; gap:11px; margin:0 0 12px; padding:0 0 11px; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-parc__ico { width:45px; height:45px; flex:0 0 auto; object-fit:contain; filter:drop-shadow(0 3px 8px rgba(0,0,0,.6)); } body.route-guide .gmrreh-parc__bas h3 { margin:0; color:var(--gr-gold2); font-family:var(--gr-face); font-size:15px; font-weight:800; letter-spacing:.5px; } body.route-guide .gmrreh-parc__ozet { margin:0 0 12px; color:var(--gr-text); font-size:13px; line-height:1.6; } body.route-guide .gmrreh-parc__gbas { margin:12px 0 7px; color:var(--gr-gold2); font-size:11.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; } body.route-guide .gmrreh-parc__liste { margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:6px; } body.route-guide .gmrreh-parc__liste li { padding:5px 10px; color:var(--gr-cream); font-size:12.5px; line-height:1.35; background:#0e0f12; border:1px solid var(--gr-line); border-radius:16px; } /* Üstten belirgin boşluk — sahip 2026-08-17: "%100 +7 Upgrade Kağıdı … buna yukarıdan boşluk bırak". Ayırıcı çizgiyle birlikte listeden net ayrılıyor. */ html body.route-guide p.gmrreh-parc__ozel { /* ⚠ margin/padding da !important: tema `p`lere margin:0 dayatıyor (ölçüldü: hesaplanan margin-top 0px kalıyordu). */ margin:24px 0 0 !important; padding:14px 13px 10px !important; border-top:1px solid var(--gr-line); color:#a5d98a; font-size:12.5px; font-weight:700; line-height:1.5; background:rgba(147,192,121,.1); border:1px solid rgba(147,192,121,.36); border-left:3px solid #93c079; border-radius:8px; } body.route-guide .gmrreh-parc__alt { display:flex; flex-direction:column; gap:7px; margin:14px 0 0; padding:12px 0 0; border-top:1px solid var(--gr-line); } body.route-guide .gmrreh-parc__rozet { display:flex; align-items:baseline; gap:8px; color:var(--gr-text); font-size:12.5px; line-height:1.45; } body.route-guide .gmrreh-parc__rozet b { flex:0 0 auto; min-width:74px; padding:3px 9px; color:#10110f; font-size:10.5px; font-weight:800; letter-spacing:.5px; text-align:center; text-transform:uppercase; background:linear-gradient(180deg,#e0c073,#c9a24a); border-radius:14px; } body.route-guide .gmrreh-parc__rozet.is-yuk b { color:var(--gr-cream); background:#2a2d36; } /* --- BÖLÜM İÇİ NEFES (2026-08-18) ---------------------------------------------------------- Sahip: "okurken madde içindeki" satırlar birbirine karışıyor. Satır yüksekliği ve paragraf araları açıldı; başlık ile gövde arasına da ayırıcı boşluk kondu. */ body.route-guide .gmrreh-sec .gmrreh-sec__head { margin-bottom:18px !important; padding-bottom:14px; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-sec .gmrreh-lead { margin:0 0 14px !important; line-height:1.75 !important; } body.route-guide .gmrreh-sec .gmrreh-parc__ozet { line-height:1.75 !important; margin-bottom:12px !important; } body.route-guide .gmrreh-sec .gmrreh-parc__gbas { margin-top:18px !important; } body.route-guide .gmrreh-skill__liste { gap:9px !important; } body.route-guide .gmrreh-skill__liste li { line-height:1.55 !important; } /* --- KLASGAME BAKİYE DÜĞMESİ (01 · Power Up Store) ------------------------------------------ Logo koyu zeminde okunsun diye açık bir plaka üstünde. En/boy yazılı → yüklenirken satır zıplamaz (rehberdeki düzen kayması dersinin aynısı). */ body.route-guide a.gmrreh-klas { display:inline-flex; align-items:center; gap:14px; margin:4px 0 18px; padding:10px 18px 10px 14px; text-decoration:none; background:linear-gradient(180deg,#f4f5f7,#dfe2e8); border:1px solid rgba(201,162,74,.55); border-radius:10px; box-shadow:0 10px 24px rgba(0,0,0,.45); transition:filter .16s ease, box-shadow .16s ease; } body.route-guide a.gmrreh-klas:hover { filter:brightness(1.06); box-shadow:0 14px 30px rgba(0,0,0,.55); } body.route-guide a.gmrreh-klas img { display:block; width:150px; height:auto; } body.route-guide a.gmrreh-klas span { padding:7px 14px; color:#10110f; font-family:var(--gr-face); font-size:12.5px; font-weight:800; letter-spacing:.5px; background:linear-gradient(180deg,#e0c073,#c9a24a); border-radius:20px; } @media (max-width:520px){ body.route-guide a.gmrreh-klas { width:100%; justify-content:center; } } /* --- GÖRSELLİ BÖLÜM DÜZENİ (12 Rebirth · 13 Tılsım) ------------------------------------------- Metin solda, görsel sağda küçük bir çerçevede. Sahip: "küçük çerçeve içinde". Görsel sabit bir tavanla sınırlanır (240px) — kaynak 483x576 ve 434x460, tam boy basılsa bölümü ezerdi. En/boy nitelikleri yazılı olduğu için yüklenirken satır ZIPLAMAZ. */ body.route-guide .gmrreh-gorselli { display:flex; flex-wrap:wrap; gap:18px; align-items:flex-start; } body.route-guide .gmrreh-gorselli__yazi { flex:1 1 320px; min-width:0; } body.route-guide .gmrreh-cerceve { flex:0 0 auto; margin:0; padding:8px; background:linear-gradient(180deg,#1b1d24,#101116); border:1px solid var(--gr-line2); border-radius:11px; box-shadow:0 12px 30px rgba(0,0,0,.55); } body.route-guide .gmrreh-cerceve img { display:block; width:auto; height:auto; max-width:240px; max-height:280px; border:1px solid rgba(201,162,74,.35); border-radius:7px; } @media (max-width:620px){ body.route-guide .gmrreh-cerceve { align-self:center; } body.route-guide .gmrreh-cerceve img { max-width:190px; max-height:220px; } } /* Yanma/risk kutusu — yeşil "iyi" kutunun kırmızı karşılığı. */ body.route-guide .gmrreh-hepa__kutu.is-riskli { border-color:rgba(216,140,120,.45); background:rgba(216,140,120,.09); } body.route-guide .gmrreh-hepa__kutu.is-riskli b { color:#f0a08c; } /* --- HEPA EXP ITEM (11) ------------------------------------------------------------------------ */ body.route-guide .gmrreh-hepa__mat { margin:0; padding:0; list-style:none; display:grid; gap:7px; } body.route-guide .gmrreh-hepa__mat li { display:flex; align-items:center; gap:10px; min-height:40px; padding:8px 12px; color:var(--gr-text); font-size:13px; background:#0e0f12; border:1px solid var(--gr-line); border-radius:8px; } body.route-guide .gmrreh-hepa__mat li b { flex:0 0 auto; min-width:34px; padding:2px 8px; color:#10110f; font-size:11.5px; font-weight:800; text-align:center; background:linear-gradient(180deg,#e0c073,#c9a24a); border-radius:12px; } body.route-guide .gmrreh-hepa__oran { display:grid; gap:9px; grid-template-columns:1fr 1fr; margin:15px 0 0; } body.route-guide .gmrreh-hepa__kutu { display:flex; flex-direction:column; align-items:center; gap:3px; padding:12px 10px; color:#8d8578; font-size:11.5px; line-height:1.35; text-align:center; background:#0e0f12; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-hepa__kutu b { color:#e0b24a; font-size:24px; font-weight:800; line-height:1.1; } body.route-guide .gmrreh-hepa__kutu.is-iyi { border-color:rgba(147,192,121,.4); background:rgba(147,192,121,.08); } body.route-guide .gmrreh-hepa__kutu.is-iyi b { color:#a5d98a; } /* --- ORTAK DROP PENCERESİ (chaotic + parchment) ------------------------------------------------ Oran sütunu YOKTUR; liste ad + ikon çiftidir. Pencere `gmrreh-modal` içinde açılır. */ body.route-guide .gmrreh-drop__bas { display:flex; align-items:center; gap:13px; margin:0 0 14px; padding:0 0 13px; border-bottom:1px solid var(--gr-line); } body.route-guide .gmrreh-drop__ico { width:46px; height:46px; flex:0 0 auto; object-fit:contain; border-radius:6px; } body.route-guide .gmrreh-drop__ad { margin:0; color:var(--gr-cream); font-family:var(--gr-face); font-size:16px; font-weight:800; letter-spacing:.3px; } body.route-guide .gmrreh-drop__alt { margin:3px 0 0; color:var(--gr-gold2); font-size:12px; letter-spacing:.3px; } body.route-guide .gmrreh-drop__izgara { display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(216px,1fr)); max-height:60vh; overflow-y:auto; padding:2px; } body.route-guide .gmrreh-drop__oge { display:flex; align-items:center; gap:9px; min-height:44px; padding:7px 10px; background:#0e0f12; border:1px solid var(--gr-line); border-radius:8px; } body.route-guide .gmrreh-drop__oico { width:30px; height:30px; flex:0 0 auto; object-fit:contain; } body.route-guide .gmrreh-drop__obos { width:30px; height:30px; flex:0 0 auto; background:#15161b; border-radius:5px; } body.route-guide .gmrreh-drop__oad { color:var(--gr-text); font-size:12.5px; line-height:1.35; word-break:break-word; } /* Parchment kartındaki "Drop Listesi" düğmesi */ /* Sahip 2026-08-17: "o drop listesi butonunu biraz renkli yap" → altın yerine mor-mavi degrade + parlama; kartın altın tonlarından ayrışsın ve gözle hemen bulunsun. */ /* ⚠ ÖZGÜLLÜK: tema tüm `button`lara koyu degrade veriyor ve düz sınıf seçicisini eziyordu (ölçüldü: hesaplanan arka plan rgb(32,33,38)→rgb(21,22,26) kalıyordu). Bu yüzden `html body.route-guide button.…` (0,3,3) + !important kullanılıyor — nav boşluğunda yaşanan aynı savaşın tekrarı. */ html body.route-guide button.gmrreh-parc__drop { display:flex; align-items:center; justify-content:center; gap:9px; /* margin-top:auto → düğme kartın DİBİNE yaslanır, böylece dört kartta da aynı hizada. */ width:100%; min-height:46px; margin:auto 0 0 !important; padding:10px 14px; color:#fff !important; font-family:var(--gr-face); font-size:13px; font-weight:800; letter-spacing:.6px; background-image:linear-gradient(135deg,#7b4fd4 0%,#4f6fe0 52%,#3aa0d6 100%) !important; background-color:#4f6fe0 !important; border:0 !important; border-radius:9px; cursor:pointer; touch-action:manipulation; box-shadow:0 8px 20px rgba(79,111,224,.34), inset 0 1px 0 rgba(255,255,255,.22) !important; transition:filter .16s ease, box-shadow .16s ease; } html body.route-guide button.gmrreh-parc__drop:hover { filter:brightness(1.12); } html body.route-guide button.gmrreh-parc__drop b { padding:3px 9px; font-size:11.5px; background:rgba(0,0,0,.28); border-radius:12px; } /* --- SEKME / ÇİP / SEÇİCİ -------------------------------------------------------------------- ⚠ DOKUNMA HEDEFİ ≥44px (proje kuralı #3) ve `touch-action:manipulation`: eski sekme 33px yüksekliğindeydi ve aralarında 8px boşluk vardı — parmak kolayca boşluğa kayıyor, `click` olayı düğme yerine KABA düşüyordu (JS'teki `tikBagla` notuna bak: "5-6 kere basınca açılıyor" şikâyetinin ikinci ayağı budur). `manipulation` ayrıca mobildeki çift-dokun-yakınlaştır beklemesini kaldırır → seri dokunuşlar yutulmaz. */ body.route-guide .gmrreh-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; } body.route-guide button.gmrreh-tab { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 13px; color:var(--gr-text); font-family:var(--gr-face); font-size:12.5px; font-weight:700; background:#0e0f12; border:1px solid var(--gr-line); border-radius:8px; cursor:pointer; touch-action:manipulation; transition:background .15s ease, border-color .15s ease, color .15s ease; } body.route-guide button.gmrreh-tab img { width:20px; height:20px; object-fit:contain; } body.route-guide button.gmrreh-tab:hover { color:var(--gr-cream); background:#16171c; border-color:var(--gr-line2); } body.route-guide button.gmrreh-tab.is-on { color:#0d0e10; background:linear-gradient(180deg,#e8c37a,#c9a24a); border-color:#e8c37a; box-shadow:0 6px 16px rgba(201,162,74,.22); } body.route-guide .gmrreh-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; } body.route-guide .gmrreh-chip { display:inline-flex; align-items:center; gap:7px; padding:6px 11px; color:var(--gr-text); font-size:12px; font-weight:600; background:#0f1013; border:1px solid var(--gr-line); border-radius:20px; } body.route-guide .gmrreh-chip img { width:20px; height:20px; object-fit:contain; } body.route-guide .gmrreh-tool { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 16px; } body.route-guide .gmrreh-tool label { margin:0; color:var(--gr-muted); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; } body.route-guide select.gmrreh-sel { min-width:190px; max-width:100%; height:38px; padding:0 12px; color:var(--gr-cream); font-family:var(--gr-face); font-size:13px; background:#0e0f12; border:1px solid var(--gr-line2); border-radius:8px; cursor:pointer; } body.route-guide .gmrreh-pane { display:none; } body.route-guide .gmrreh-pane.is-on { display:block; } /* --- TABLO ----------------------------------------------------------------------------------- */ body.route-guide .gmrreh-scroll { width:100%; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#6f5527 #0a0a0c; } body.route-guide table.gmrreh-tbl { width:100%; margin:0; border-collapse:collapse; font-size:13px; } body.route-guide table.gmrreh-tbl th { padding:10px 12px; color:var(--gr-gold2); font-size:10.5px; font-weight:800; letter-spacing:.14em; text-align:left; text-transform:uppercase; background:#101116; border-bottom:1px solid var(--gr-line); } body.route-guide table.gmrreh-tbl td { padding:9px 12px; color:var(--gr-text); border-bottom:1px solid rgba(232,195,122,.07); vertical-align:middle; } body.route-guide table.gmrreh-tbl tr:last-child td { border-bottom:0; } body.route-guide table.gmrreh-tbl tr:hover td { background:rgba(232,195,122,.04); } body.route-guide table.gmrreh-tbl td.is-name { color:var(--gr-cream); font-weight:600; } body.route-guide table.gmrreh-tbl td.is-mid { text-align:center; } body.route-guide table.gmrreh-tbl tr.is-off td { opacity:.55; } body.route-guide img.gmrreh-ico { width:30px; height:30px; object-fit:contain; vertical-align:middle; } body.route-guide .gmrreh-num { color:var(--gr-muted); font-size:11.5px; } body.route-guide .gmrreh-pct { font-weight:800; } body.route-guide .gmrreh-rate { display:flex; align-items:center; gap:9px; } body.route-guide .gmrreh-rate em { flex:0 0 54px; color:var(--gr-cream); font-style:normal; font-weight:700; } body.route-guide .gmrreh-bar { flex:1 1 auto; min-width:70px; height:6px; background:#191a1f; border-radius:6px; overflow:hidden; } body.route-guide .gmrreh-bar i { display:block; height:100%; border-radius:6px; } body.route-guide .gmrreh-badge { display:inline-block; padding:3px 9px; color:var(--gr-gold); font-size:11px; font-weight:700; background:rgba(201,162,74,.12); border:1px solid var(--gr-line); border-radius:20px; } body.route-guide .gmrreh-badge.is-off { color:var(--gr-muted); background:rgba(255,255,255,.04); } /* --- 01 POWER UP STORE (ürün ızgarası + sayfalar + detay katmanı) ---------------------------- */ body.route-guide .gmrreh-store { display:grid; grid-template-columns:repeat(auto-fill,minmax(clamp(140px,15vw,178px),1fr)); gap:12px; } /* ÜRÜN KARTI ARTIK TIKLANMIYOR (bkz. JS'teki "detay katmanı açılmaz" notu): seçici `button.` değil düz sınıf, imleç DÜZ ve hover'da ZIPLAMA YOK — zıplayan bir kart basma ile bırakma arasında yer değiştirip tıkı da düşürebiliyordu. Kenarlık vurgusu kalıyor ki kart yine de canlı görünsün. */ body.route-guide .gmrreh-prod { display:flex; flex-direction:column; align-items:center; gap:8px; width:100%; padding:14px 10px 12px; color:var(--gr-text); font-family:var(--gr-face); text-align:center; background:linear-gradient(180deg,#15161b,#0d0e11); border:1px solid var(--gr-line); border-radius:9px; cursor:default; transition:border-color .14s ease, box-shadow .14s ease; } body.route-guide .gmrreh-prod:hover { border-color:var(--gr-line2); box-shadow:0 12px 24px rgba(0,0,0,.45); } body.route-guide .gmrreh-prod__ico { display:flex; align-items:center; justify-content:center; width:62px; height:62px; background:#0a0b0d; border:1px solid var(--gr-line); border-radius:8px; } body.route-guide .gmrreh-prod__ico img { max-width:52px; max-height:52px; object-fit:contain; } body.route-guide .gmrreh-prod__ad { display:block; width:100%; color:var(--gr-cream); font-size:12.5px; font-weight:600; line-height:1.35; } body.route-guide .gmrreh-prod__kat { display:block; color:var(--gr-muted); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; } body.route-guide .gmrreh-prod__fiyat { display:inline-block; padding:3px 10px; color:var(--gr-gold); font-size:11.5px; font-weight:800; background:rgba(201,162,74,.12); border:1px solid var(--gr-line); border-radius:20px; } body.route-guide .gmrreh-pager { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:16px 0 0; } body.route-guide button.gmrreh-pg { min-width:44px; height:44px; padding:0 10px; /* ≥44px dokunma hedefi (kural #3) */ color:var(--gr-text); font-family:var(--gr-face); font-size:12.5px; font-weight:700; background:#0e0f12; border:1px solid var(--gr-line); border-radius:7px; cursor:pointer; touch-action:manipulation; } body.route-guide button.gmrreh-pg:hover { color:var(--gr-cream); border-color:var(--gr-line2); } body.route-guide button.gmrreh-pg.is-on { color:#0d0e10; background:linear-gradient(180deg,#e8c37a,#c9a24a); border-color:#e8c37a; } body.route-guide button.gmrreh-pg[disabled] { opacity:.4; cursor:default; } body.route-guide .gmrreh-pgnote { margin-left:6px; color:var(--gr-muted); font-size:11.5px; } /* --- 02 PUS PAKETLERİ ------------------------------------------------------------------------ */ body.route-guide .gmrreh-figure { margin:0; } body.route-guide button.gmrreh-posterbtn { display:block; width:100%; padding:0; background:none; border:0; cursor:zoom-in; } body.route-guide img.gmrreh-poster { display:block; width:100%; max-width:760px; height:auto; margin:0 auto; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-cap { margin:10px 0 0; color:var(--gr-muted); font-size:12px; text-align:center; } /* --- 03 PREMİUM / genel eşya ızgarası -------------------------------------------------------- */ body.route-guide .gmrreh-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(clamp(200px,22vw,260px),1fr)); gap:10px; } body.route-guide .gmrreh-slot { display:flex; align-items:center; gap:11px; padding:10px 12px; background:#0f1013; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-slot img { flex:0 0 36px; width:36px; height:36px; object-fit:contain; } body.route-guide .gmrreh-slot > div { min-width:0; } body.route-guide .gmrreh-slot b { display:block; color:var(--gr-cream); font-size:12.5px; font-weight:600; line-height:1.35; } body.route-guide .gmrreh-slot small { display:block; color:var(--gr-muted); font-size:11px; } body.route-guide .gmrreh-slotno { flex:0 0 36px; display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; color:var(--gr-muted); font-size:12px; background:#0a0b0d; border:1px solid var(--gr-line); border-radius:7px; } /* --- 03 PREMİUM ÖZELLİK KARTLARI — landing'in (src/ui/premiumPage.ts) kardeşi ----------------- 4×1 dener, sığmazsa auto-fit 2'ye sonra 1'e düşer = landing'deki 4×1→2×2 kararının medya sorgusuz karşılığı (JS yok). Hediye bloğundaki `margin-top:auto` kartları eşit boy gösterir. ⛔ Clan Premium'da hediye bloğu HİÇ ÇİZİLMEZ (sahip: "CLAN PRE HEDİYESİ YOK") — gizlenmez. */ body.route-guide .gmrreh-prem { display:grid; grid-template-columns:repeat(auto-fit,minmax(clamp(232px,22vw,300px),1fr)); gap:12px; margin:0 0 24px; } body.route-guide .gmrreh-premc { display:flex; flex-direction:column; gap:12px; padding:14px; background:#0f1013; border:1px solid var(--gr-line); border-radius:12px; } body.route-guide .gmrreh-premh { display:flex; flex-wrap:wrap; align-items:center; gap:10px; } body.route-guide .gmrreh-premh img { flex:0 0 40px; width:40px; height:40px; object-fit:contain; background:#000; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-premad { flex:1 1 auto; min-width:0; color:var(--gr-cream); font-size:16px; font-weight:800; letter-spacing:.02em; overflow-wrap:anywhere; } body.route-guide .gmrreh-premfiyat { flex:0 0 auto; padding:5px 11px; color:var(--gr-gold); font-size:13px; font-weight:800; white-space:nowrap; background:rgba(201,162,74,.12); border:1px solid var(--gr-line2); border-radius:9px; } /* ⚠ `p.` şart: yukarıdaki `.gmrreh p` kuralı (0,2,2), sade sınıf seçicisi (0,2,1) ona yenilir. */ body.route-guide p.gmrreh-premcap { margin:0 0 7px; color:var(--gr-gold2); font-size:10.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; } body.route-guide .gmrreh-premav { padding-left:12px; border-left:2px solid var(--gr-line2); } body.route-guide .gmrreh-premav p { margin:0 0 5px; color:var(--gr-text); font-size:12.5px; line-height:1.5; overflow-wrap:anywhere; } body.route-guide .gmrreh-premav p:last-child { margin-bottom:0; } body.route-guide .gmrreh-premgift { margin-top:auto; padding:10px; background:#0a0b0d; border:1px solid var(--gr-line2); border-radius:11px; box-shadow:inset 0 1px 0 rgba(255,232,181,.05); } body.route-guide .gmrreh-premgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(clamp(56px,6vw,62px),1fr)); gap:6px; justify-items:center; } body.route-guide .gmrreh-premg { display:flex; flex-direction:column; align-items:center; gap:5px; width:100%; min-width:0; } body.route-guide .gmrreh-premico { position:relative; display:flex; align-items:center; justify-content:center; width:56px; max-width:100%; aspect-ratio:1/1; background:#000; border:1px solid var(--gr-line); border-radius:11px; } body.route-guide .gmrreh-premico img { max-width:100%; max-height:100%; object-fit:contain; border-radius:11px; } body.route-guide .gmrreh-premx { position:absolute; right:2px; bottom:2px; padding:1px 4px; color:var(--gr-cream); font-size:10px; font-weight:800; white-space:nowrap; background:rgba(42,29,9,.9); border:1px solid #6b5a2a; border-radius:6px; } body.route-guide .gmrreh-premgad { width:100%; color:var(--gr-muted); font-size:10px; line-height:1.3; text-align:center; overflow-wrap:anywhere; } /* --- 04 FARM --------------------------------------------------------------------------------- */ body.route-guide .gmrreh-card { margin:0 0 14px; padding:14px 16px; background:#0f1013; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-cardhead { display:flex; align-items:center; gap:10px; margin:0 0 8px; } body.route-guide .gmrreh-cardhead img { width:26px; height:26px; object-fit:contain; } body.route-guide .gmrreh-cardhead b { color:var(--gr-cream); font-size:13px; font-weight:750; letter-spacing:.04em; } body.route-guide img.gmrreh-shot { display:block; width:100%; max-width:820px; height:auto; margin:0 0 14px; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide img.gmrreh-shot.is-small { max-width:420px; } body.route-guide .gmrreh-mobs { margin:0 0 14px; padding:14px 16px; background:#0f1013; border:1px solid var(--gr-line); border-radius:9px; } body.route-guide .gmrreh-mobdesc { margin:0 0 10px; color:var(--gr-muted); font-size:12.5px; } body.route-guide .gmrreh-mobrow { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:8px 0; border-top:1px solid rgba(232,195,122,.07); } body.route-guide .gmrreh-mobno { flex:0 0 auto; color:var(--gr-gold2); font-size:11px; font-weight:800; } body.route-guide .gmrreh-mobname { flex:1 1 190px; min-width:0; color:var(--gr-cream); font-size:13px; font-weight:600; } body.route-guide .gmrreh-jobs { flex:1 1 auto; display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; } body.route-guide .gmrreh-job { display:inline-flex; align-items:center; gap:6px; padding:3px 9px; color:var(--gr-text); font-size:11.5px; background:#141519; border:1px solid var(--gr-line); border-radius:20px; } body.route-guide .gmrreh-job img { width:17px; height:17px; object-fit:contain; } body.route-guide .gmrreh-jobpre { color:var(--gr-muted); font-size:11.5px; } body.route-guide .gmrreh-note { color:var(--gr-muted); font-size:11.5px; } /* --- 05 CHAOTIC — KUTU IZGARASI (önce kutular, basınca içi açılır) --------------------------- */ body.route-guide .gmrreh-boxes { display:grid; grid-template-columns:repeat(auto-fill,minmax(clamp(120px,13vw,150px),1fr)); gap:10px; margin:0 0 18px; } body.route-guide button.gmrreh-box { display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 8px 10px; color:var(--gr-text); font-family:var(--gr-face); text-align:center; background:linear-gradient(180deg,#15161b,#0d0e11); border:1px solid var(--gr-line); border-radius:9px; cursor:pointer; transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease; } body.route-guide button.gmrreh-box:hover { transform:translateY(-2px); border-color:var(--gr-line2); box-shadow:0 12px 24px rgba(0,0,0,.45); } body.route-guide button.gmrreh-box.is-on { border-color:var(--gr-gold); box-shadow:0 0 0 1px rgba(232,195,122,.35), 0 12px 24px rgba(0,0,0,.5); } body.route-guide button.gmrreh-box img { width:44px; height:44px; object-fit:contain; } body.route-guide .gmrreh-box__ad { display:block; color:var(--gr-cream); font-size:11.5px; font-weight:600; line-height:1.3; } body.route-guide .gmrreh-box__adet { display:block; color:var(--gr-gold2); font-size:10.5px; font-weight:700; } body.route-guide button.gmrreh-box.is-on .gmrreh-box__adet { color:var(--gr-gold); } /* --- 06 UPGRADE — PARÇA ÇARPANI SATIRI (pieceRates; tabloyu DEĞİŞTİRMEZ, gerekçe aşağıda) --- */ body.route-guide .gmrreh-parca { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 14px; padding:11px 14px; color:var(--gr-cream); font-size:13px; font-weight:600; line-height:1.5; background:rgba(201,162,74,.10); border:1px solid var(--gr-line2); border-radius:9px; } body.route-guide .gmrreh-parca img { flex:0 0 26px; width:26px; height:26px; object-fit:contain; } body.route-guide .gmrreh-parca b { color:var(--gr-gold); font-weight:800; } /* --- 07 BAŞLANGIÇ İTEMLERİ — GERÇEK ENVANTER PENCERESİ --------------------------------------- Landing vitrininin aynısı (GMRGAMEWEB sideMenu.ts `guideInvShotView`): `re_inventory.uif`ten çıkarılmış WebP (397×617 = pencerenin 204..601 kırpması) + aynı koordinatlara konan hücreler. ⚠ ÖLÇEK MEDYA SORGUSUZ ve JS'SİZ: koordinatlar YÜZDE, yazı boyları `cqw` (container-type ile tanımlı). `cqw` yoksa ondan önceki px değeri geçerli kalır — yerleşim yine doğrudur. Yükseklik akıştaki 'den gelir (aspect-ratio'ya bağlı değil). */ body.route-guide .gmrreh-invwin { position:relative; width:100%; max-width:397px; margin:0 0 10px; container-type:inline-size; } body.route-guide img.gmrreh-invbg { display:block; width:100%; height:auto; border-radius:4px; } body.route-guide .gmrreh-invgold { position:absolute; left:17.380%; top:54.133%; width:22.670%; height:2.107%; display:flex; align-items:center; justify-content:flex-end; color:#ebc738; font-size:11px; font-size:2.771cqw; line-height:1; font-variant-numeric:tabular-nums; } /* ⚠ `position:absolute !important` ŞART: `wok-3d.js` her `