/* MODERA v9 — ahşap ana ekran (referans görsel birebir) */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@600;700;800&display=swap');

:root,
html[data-mr-theme="wood"],
html:not([data-mr-theme]),
html[data-mr-theme="forest"],
html[data-mr-theme="spotlight"],
html[data-mr-theme="classic"]{
  --mr-ink:#2a1a0e;
  --mr-wood-deep:#3d2614;
  --mr-wood-mid:#c9b089;
  --mr-wood-light:#efe2c8;
  --mr-wood-pale:#f7ecd6;
  --mr-wood-panel:#e6d3b4;
  --mr-line:rgba(40,22,10,.22);
  --mr-header-bg:#e6d3b4;
  --mr-home-bg:url('assets/brand/wood-grain.svg') repeat,#e6d3b4;
  --mr-tile-face:linear-gradient(145deg,#f7ecd6 0%,#efe0c4 42%,#e2cfaa 100%);
  --mr-dock:0px;
}

/* —— Üst bar + reklam: sticky (boşluk yok) —— */
html body #mainApp>header.top{
  position:sticky!important;
  top:0!important;
  width:100%!important;
  margin:0!important;
  z-index:200!important;
  background:url('assets/brand/wood-grain.svg') repeat,#d8b687!important;
  background-size:280px 280px!important;
  border-bottom:0!important;
  box-shadow:none!important;
  color:var(--mr-ink)!important;
  padding:max(6px,env(safe-area-inset-top,0px)) 10px 8px!important;
}
html body #mainApp{
  padding-top:0!important;
  box-sizing:border-box!important;
  background:url('assets/brand/wood-grain.svg') repeat,#d8b687!important;
  background-size:280px 280px!important;
}
html body #mainApp>.screen{
  scroll-margin-top:0;
  padding-top:0!important;
  margin-top:0!important;
}
html body #mainApp>header.top .brand,
html body #mainApp>header.top .brandWrap b,
html body #mainApp>header.top .head .brand{
  color:var(--mr-ink)!important;
  font-family:Manrope,system-ui,sans-serif!important;
  font-weight:800!important;
  letter-spacing:.04em!important;
  font-size:clamp(17px,4.2vw,20px)!important;
}
html body #mainApp>header.top .sub{
  color:rgba(58,36,20,.72)!important;
  font-size:9px!important;
  font-weight:700!important;
  max-width:min(210px,46vw)!important;
}
html body #mainApp>header.top .logo{
  border-radius:10px!important;
  border:1px solid rgba(70,42,20,.25)!important;
  box-shadow:0 2px 0 rgba(255,245,220,.4) inset,0 3px 8px rgba(60,35,15,.2)!important;
  background:#e8d4b0!important;
}
/* Üstte yalnızca 4 ikon kalsın (görseldeki gibi) */
html body #mainApp>header.top .right>.profile,
html body #mainApp>header.top .right>.moderaQuickSettings,
html body #mainApp>header.top .right>.headerLogout,
html body #mainApp>header.top .right>#guestLoginButton{
  display:none!important;
}
html body #mainApp>header.top #moderaHeaderActions{
  display:flex!important;gap:7px;align-items:center;
}
html body #mainApp>header.top .moderaHeaderIcon{
  width:40px!important;height:40px!important;min-width:40px!important;
  border-radius:11px!important;padding:0!important;
  display:grid!important;place-items:center!important;
  background:var(--mr-tile-face)!important;
  border:1px solid rgba(70,42,20,.22)!important;
  box-shadow:
    0 1px 0 rgba(255,248,230,.7) inset,
    0 3px 0 rgba(120,80,40,.35),
    0 6px 10px rgba(60,35,15,.18)!important;
  color:var(--mr-ink)!important;
}
html body #mainApp>header.top .moderaHeaderIcon svg{
  width:20px!important;height:20px!important;stroke:currentColor;fill:none;stroke-width:1.8;
}
html body #mainApp>header.top .moderaHeaderIcon:after{display:none!important}

/* Reklam bandı */
html body #mainApp>header.top #moderaGlobalAdHost.moderaGlobalAdHost{display:block!important;padding:10px 10px 0!important}
#mainApp #moderaGlobalAdHost>#adSlider.adSlider[hidden]{display:none!important;height:0!important;min-height:0!important;max-height:0!important}
html body #mainApp>header.top #moderaGlobalAdHost>#adSlider:not([hidden]){
  height:72px!important;min-height:72px!important;max-height:72px!important;
  border-radius:14px!important;overflow:hidden!important;
  border:1px solid rgba(70,42,20,.2)!important;
}
#mainApp #moderaGlobalAdHost>#moderaAdStandby{
  display:none;align-items:center;justify-content:center;gap:12px;
  box-sizing:border-box;width:100%;height:72px;min-height:72px;
  border:1px solid rgba(70,42,20,.22);border-radius:14px;
  background:linear-gradient(120deg,#f6ecd8,#ead4b0);
  color:rgba(58,36,20,.7);font:700 12px/1.4 Manrope,system-ui,sans-serif;
}
#mainApp #moderaGlobalAdHost:has(>#adSlider[hidden])>#moderaAdStandby{display:flex!important}

/* Alt dock tamamen kapalı */
html body #moderaAppDock,
body.mr-no-dock #moderaAppDock{
  display:none!important;height:0!important;min-height:0!important;
  visibility:hidden!important;pointer-events:none!important;
}
html body #mainApp{padding-bottom:0!important}

/* —— Ana ekran —— */
#mainApp:has(#home.active){padding-bottom:0!important}
#mainApp #home.screen.active{
  display:flex!important;flex-direction:column!important;box-sizing:border-box!important;
  height:auto!important;min-height:0!important;
  padding:6px 8px 12px!important;
  overflow:visible!important;
  border:0!important;
  background:url('assets/brand/wood-grain.svg') repeat,#d8b687!important;
  background-size:280px 280px!important;
}
#home .mr-hero,#home>.grid,.mr-nav{display:none!important}
#home.screen.active > .grid{display:none!important;height:0!important}

#home .mr-home{
  width:100%!important;max-width:none!important;margin:0!important;padding:0!important;
  color:var(--mr-ink);font-family:Manrope,system-ui,sans-serif;
}
#home .mr-featured{display:grid;gap:10px;margin-bottom:10px}
#home .mr-tools{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px;
  margin:0!important;
}

/* Referans: ikon SOL, yazı SAĞ */
#home .mr-tool{
  position:relative;isolation:isolate;min-width:0;min-height:56px;
  box-sizing:border-box;display:flex;flex-direction:row;
  align-items:center;justify-content:flex-start;gap:8px;
  padding:8px;text-decoration:none;text-align:left;
  color:var(--mr-ink)!important;
  border-radius:14px;
  border:1px solid rgba(40,22,10,.18)!important;
  background:var(--mr-tile-face)!important;
  box-shadow:
    2px 2px 0 rgba(255,250,240,.92) inset,
    -3px -4px 6px rgba(40,22,10,.22) inset,
    4px 5px 0 rgba(40,22,10,.28),
    8px 14px 18px rgba(28,16,8,.55),
    2px 3px 6px rgba(40,22,10,.38);
  transform:translateY(0);
  transition:transform .12s ease,box-shadow .12s ease;
  -webkit-tap-highlight-color:transparent;
}
#home .mr-tool:active{
  transform:translateY(2px);
  box-shadow:
    3px 4px 8px rgba(40,22,10,.35) inset,
    1px 1px 0 rgba(40,22,10,.25),
    3px 5px 8px rgba(40,22,10,.38);
}
#home .mr-tool-wide{
  flex-direction:row;justify-content:flex-start;gap:12px;
  min-height:52px;padding:10px 12px;text-align:left;
}
#home .mr-tool-icon{
  display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;
  color:var(--mr-wood-deep);
  filter:drop-shadow(0 1px 0 rgba(255,245,220,.35));
}
#home .mr-tool-wide .mr-tool-icon{width:40px;height:40px;flex-basis:40px}
#home .mr-ico{width:100%;height:100%;display:block;color:var(--mr-wood-deep)}
#home .mr-tool-text{display:flex;flex-direction:column;gap:1px;min-width:0;align-items:flex-start}
#home .mr-tool-wide .mr-tool-text{align-items:center;flex:0 1 auto}
#home .mr-tool-label{
  font:800 10px/1.12 Manrope,system-ui,sans-serif;
  letter-spacing:.01em;color:var(--mr-ink)!important;
  text-wrap:balance;
}
#home .mr-tool-wide .mr-tool-label{font-size:12px;letter-spacing:.02em;text-align:center;width:max-content;max-width:100%}
#home .mr-tool-sub{
  font:700 9px/1.15 Manrope,system-ui,sans-serif;
  color:rgba(58,36,20,.62);
}
#home .mr-tool-wide .mr-tool-sub{text-align:center;width:100%}
#home .mr-tool-number,#home .mr-tool-arrow{display:none!important}

@media(min-width:700px){
  #home .mr-home{max-width:720px;margin:0 auto!important}
  #home .mr-tool{min-height:72px;padding:12px 14px}
  #home .mr-tool-label{font-size:12px}
  #home .mr-tool-wide .mr-tool-label{font-size:15px}
  #home .mr-tool-icon{width:42px;height:42px}
}

@media(max-width:360px){
  #home .mr-tools{gap:8px}
  #home .mr-tool{min-height:84px;padding:10px 6px;border-radius:14px}
  #home .mr-tool-label{font-size:10px}
  #home .mr-tool-icon{width:38px;height:38px}
}