@font-face{font-family:"Fredoka";src:url("/static/fredoka.woff2") format("woff2");font-weight:300 700;font-display:swap}
:root{
  --font:"Fredoka","Trebuchet MS",sans-serif;
  --line:#4a2810;--line2:#2c1607;
  --cream:#fff1d2;--gold:#ffd23f;--gold2:#ffb81c;--green-t:#8cf26f;
  --safe-top:env(safe-area-inset-top,0px);--safe-bot:env(safe-area-inset-bottom,0px);
  --hdr:58px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:#2b170a;color:#fff;font-family:var(--font);font-weight:600;overscroll-behavior:none;-webkit-font-smoothing:antialiased}
body{user-select:none;-webkit-user-select:none}
input{user-select:text;-webkit-user-select:text;font-family:var(--font)}
button{font-family:var(--font)}
#app{position:fixed;inset:0;overflow:hidden}
img{-webkit-user-drag:none;user-select:none}
.ico{display:inline-block;vertical-align:middle;object-fit:contain;flex:none}
.ts{text-shadow:0 2px 0 var(--line2),0 0 3px var(--line2),1px 1px 0 var(--line2),-1px -1px 0 var(--line2),1px -1px 0 var(--line2),-1px 1px 0 var(--line2)}
.t-gold{color:var(--gold)}.t-green{color:var(--green-t)}.t-red{color:#ff6a5c}.t-or{color:#ffb020}
.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:url(/static/img/grass.webp) 0 0/256px;font-size:20px}
.loading img{width:150px;animation:bob 1.2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* ------------- materials */
.wood{position:relative;background:url(/static/img/wood_light.webp?v=4) 0 0/640px;border:3px solid var(--line);border-radius:18px;
  box-shadow:inset 0 2px 0 rgba(255,225,170,.45),inset 0 -3px 0 rgba(0,0,0,.25),0 4px 0 rgba(0,0,0,.35),0 8px 14px rgba(0,0,0,.25)}
.wood.glow{box-shadow:0 0 0 3px #ffe17a,0 0 18px #ffd23f88,0 4px 0 rgba(0,0,0,.35)}
.inset{background:rgba(48,23,6,.62);border-radius:12px;box-shadow:inset 0 3px 4px rgba(0,0,0,.45),0 1px 0 rgba(255,220,160,.25)}
.cream{text-shadow:none!important;background:linear-gradient(#fff6df,#f6dfae);color:#5a3412;border:2px solid #b07b3c;border-radius:12px;box-shadow:inset 0 -2px 0 rgba(0,0,0,.1)}
.green-card{position:relative;background:linear-gradient(180deg,#4bb04f,#2f8a35);border:3px solid #1d5e22;border-radius:18px;box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 4px 0 rgba(0,0,0,.35)}
.blue-card{position:relative;background:linear-gradient(180deg,#2f80b3,#1e5d8a);border:3px solid #123c5c;border-radius:18px;box-shadow:inset 0 2px 0 rgba(255,255,255,.25),0 4px 0 rgba(0,0,0,.35)}

/* ------------- buttons */
.btn{--c1:#5fb6f5;--c2:#2b79c9;--c3:#174d8a;display:inline-flex;align-items:center;justify-content:center;gap:6px;position:relative;cursor:pointer;
  border:2px solid rgba(255,255,255,.75);border-radius:12px;padding:8px 14px;color:#fff;font-weight:700;font-size:19px;line-height:1.1;
  background:linear-gradient(180deg,var(--c1) 0%,var(--c2) 100%);box-shadow:0 3px 0 var(--c3),0 5px 6px rgba(0,0,0,.35),inset 0 -3px 0 rgba(0,0,0,.12);
  text-shadow:0 1px 1px rgba(0,0,0,.45);transition:transform .08s,box-shadow .08s,filter .15s}
.btn:after{content:"";position:absolute;left:6px;right:6px;top:3px;height:42%;border-radius:9px 9px 14px 14px;background:linear-gradient(rgba(255,255,255,.45),rgba(255,255,255,.05));pointer-events:none}
.btn:active{transform:translateY(3px);box-shadow:0 0 0 var(--c3),0 1px 2px rgba(0,0,0,.35)}
.btn[disabled]{filter:grayscale(.75) brightness(.85);pointer-events:none}
.btn.red{--c1:#ff6b5e;--c2:#d1281e;--c3:#7c120c}
.btn.green{--c1:#7fd66f;--c2:#33983a;--c3:#1b5e20}
.btn.yellow{--c1:#ffd95a;--c2:#f6a81a;--c3:#9b5e00}
.btn.dark{--c1:#7a4a22;--c2:#4f2c10;--c3:#2a1606;border-color:rgba(255,220,160,.35)}
.btn.full{width:100%}.btn.sm{padding:5px 10px;font-size:15px;border-radius:10px}.btn.lg{padding:11px 16px;font-size:21px}
.rbtn{width:34px;height:34px;padding:0;border-radius:50%;font-size:22px}
.round-ico{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;cursor:pointer;border:2px solid #fff;font-weight:700;font-size:20px;box-shadow:0 3px 0 rgba(0,0,0,.35)}
.round-ico.info{background:radial-gradient(circle at 35% 30%,#ffe27a,#f2a400)}
.round-ico.close{background:radial-gradient(circle at 35% 30%,#ff8a80,#d32f2f);font-size:18px}

/* ------------- header / nav */
.header{position:absolute;left:0;right:0;top:0;height:calc(var(--hdr) + var(--safe-top));padding:calc(6px + var(--safe-top)) 8px 6px;z-index:40;display:flex;align-items:center;gap:8px;pointer-events:none}
.header.solid{background:url(/static/img/wood_light.webp?v=4) 0 -40px/600px;border-bottom:3px solid var(--line);box-shadow:inset 0 -8px 10px rgba(0,0,0,.25),0 3px 6px rgba(0,0,0,.4)}
.header.solid:before,.header.solid:after{content:"";position:absolute;bottom:-17px;width:22px;height:14px;background:linear-gradient(135deg,#9aa4ad,#5c656d);clip-path:polygon(0 0,100% 0,0 100%);border-top:2px solid #3d444a}
.header.solid:before{left:2px}.header.solid:after{right:2px;transform:scaleX(-1)}
.header>*{pointer-events:auto}
.wallet{display:flex;align-items:center;gap:5px;min-width:0;flex:0 1 auto;overflow:hidden;padding:4px 5px;border-radius:14px;background:url(/static/img/wood_light.webp?v=4) 0 0/400px;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35),inset 0 2px 0 rgba(255,225,170,.4)}
.bal{position:relative;display:flex;align-items:center;gap:3px;min-width:92px;height:30px;padding:0 8px 0 30px;border-radius:9px;background:rgba(48,23,6,.7);box-shadow:inset 0 2px 4px rgba(0,0,0,.55);font-size:17px;font-weight:700}
.bal img{position:absolute;left:-6px;top:50%;transform:translateY(-50%);width:34px;height:34px}
.bal.bucks{color:#9ef27f}.bal.coins{color:#ffe08a}
.plus{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;cursor:pointer;color:#fff;font-size:24px;font-weight:700;line-height:1;
  background:radial-gradient(circle at 35% 30%,#ffe27a,#f2a400);border:2px solid #fff6d0;box-shadow:0 2px 0 #9b5e00}
.hdr-right{margin-left:auto;display:flex;gap:6px;flex:none}
.sq-btn{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35),inset 0 2px 0 rgba(255,255,255,.35)}
.sq-btn.gold{background:linear-gradient(#ffd75a,#e8a000)}.sq-btn.wd{background:url(/static/img/wood_light.webp?v=4) 0 0/400px}
.sq-btn img{width:32px;height:32px}
.sidenav{position:absolute;right:0;bottom:calc(8px + var(--safe-bot));z-index:45;display:flex;flex-direction:column;align-items:center;gap:2px;width:58px;transition:transform .3s}
.nav-item{position:relative;width:56px;height:54px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;cursor:pointer;transition:transform .15s}
.nav-item img{width:42px;height:38px;filter:drop-shadow(0 2px 1px rgba(0,0,0,.45));transition:transform .2s}
.nav-item span{margin-top:-6px;font-size:12px;font-weight:700}
.nav-item.on img{transform:scale(1.18) translateY(-2px)}
.nav-item.on span{color:#ffe08a}
.nav-item:active{transform:scale(.9)}
.sidenav .items{display:flex;flex-direction:column;gap:2px;transition:max-height .3s,opacity .3s;max-height:400px;overflow:hidden}
.sidenav.collapsed .items{max-height:0;opacity:0}
.nav-toggle{width:42px;height:42px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;background:url(/static/img/wood_light.webp?v=4) 0 0/400px;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35);margin-top:4px}
.nav-toggle i{width:12px;height:12px;border-right:4px solid #fff;border-bottom:4px solid #fff;transform:rotate(45deg) translate(-2px,-2px);border-radius:2px;filter:drop-shadow(0 1px 0 #000)}
.sidenav.collapsed .nav-toggle i{transform:rotate(-135deg) translate(-2px,-2px)}

/* ------------- pages */
.page{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;background:#3a1f0b url(/static/img/wood_dark.webp) center top/100% auto repeat-y;padding:calc(var(--hdr) + var(--safe-top) + 10px) 62px calc(110px + var(--safe-bot)) 10px}
.page-title{margin-right:-52px}
.page:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,transparent 50%,rgba(0,0,0,.45));z-index:0}
.page>*{position:relative;z-index:1}
.page-title{text-align:center;font-size:26px;font-weight:700;margin:0 0 8px}
.anim-in{animation:pin .28s ease-out}
@keyframes pin{from{opacity:0;transform:translateY(10px)}}
.panel{padding:12px;margin-bottom:12px}
.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.panel-head h3,.panel h3{margin:0;font-size:24px;text-align:center;font-weight:700}
.tabs{display:flex;gap:4px;padding:5px;margin-bottom:12px;border-radius:14px;background:url(/static/img/wood_light.webp?v=4) 0 0/560px;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35)}
.tabs .tb{flex:1;position:relative;display:flex;border-radius:10px;background:rgba(48,23,6,.55);box-shadow:inset 0 2px 4px rgba(0,0,0,.5)}
.tabs button{flex:1;border:none;background:transparent;color:#fff;font-size:18px;font-weight:700;padding:8px 2px;cursor:pointer;border-radius:9px;position:relative;z-index:1;transition:color .2s}
.tabs button.on{background:url(/static/img/wood_light.webp?v=4) 0 -30px/400px;box-shadow:inset 0 2px 0 rgba(255,230,180,.5),0 2px 3px rgba(0,0,0,.4);border:2px solid #6b3e18}
.row{display:flex;align-items:center;gap:8px}
.prow{display:flex;align-items:center;gap:10px;padding:5px 12px 5px 6px;margin:7px 0;font-size:19px;font-weight:700}
.prow img{width:36px;height:36px;margin:-6px 0}
.prow .r{margin-left:auto;font-size:13px;opacity:.95}
/* 14.10 hesaplayıcı gelir satırları: etiket | altın+nakit | ≈ $ (tek satır, taşma yok) */
.prow.crow{display:grid;grid-template-columns:54px 1fr auto;gap:4px;align-items:center;font-size:14px;padding:6px 10px 6px 8px}
.prow.crow img{width:18px;height:18px;margin:0 1px;vertical-align:-4px}
.prow.crow .cv{white-space:nowrap;text-align:center;font-size:13.5px}
.prow.crow .cd{white-space:nowrap;font-size:14px;font-weight:800}
.lbl{text-align:center;font-size:20px;font-weight:700;margin:8px 0 4px}
.bar{position:relative;height:30px;margin:4px 0 10px;overflow:hidden}
.bar i{position:absolute;left:0;top:0;bottom:0;border-radius:12px;background:linear-gradient(#9ad65a,#5ea52d);box-shadow:inset 0 2px 0 rgba(255,255,255,.35);transition:width .5s}
.bar span{position:relative;display:block;text-align:center;line-height:30px;font-size:18px;font-weight:700}
.muted{opacity:.8;font-size:14px}
.center{text-align:center}
.goback{position:fixed;left:50%;bottom:calc(14px + var(--safe-bot));transform:translateX(-50%);z-index:44;padding:6px 8px;border-radius:16px;background:url(/static/img/wood_light.webp?v=4) 0 0/400px;border:3px solid var(--line);box-shadow:0 4px 0 rgba(0,0,0,.4)}
.goback .btn{width:230px}
.input{width:100%;border:none;outline:none;color:#fff;font-size:17px;font-weight:600;padding:12px;text-align:center}
.input::placeholder{color:#d9b98e;font-size:14px}
.field{font-size:19px;font-weight:700;text-align:center;margin:10px 0 5px}
.amount{display:flex;align-items:center;gap:8px}
.amount .val{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:44px;font-size:24px;font-weight:700;color:#ffe08a}
.amount .val input{width:120px;background:transparent;border:none;outline:none;color:#ffe08a;font-size:24px;font-weight:700;text-align:center}
.qbtn{width:44px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:26px;cursor:pointer;color:#fff;background:linear-gradient(#5d3615,#3d200a);border:2px solid #7b4b22;box-shadow:0 3px 0 #1c0d03}
.qbtn:active{transform:translateY(2px);box-shadow:none}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:8px 0}
.quick .qbtn{width:auto;font-size:16px;font-weight:700}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:12px;border-radius:6px;background:rgba(48,23,6,.65);box-shadow:inset 0 2px 3px rgba(0,0,0,.5);margin:12px 0}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe27a,#e09a00);border:3px solid #6b3e18;box-shadow:0 2px 3px rgba(0,0,0,.5)}
.chip{background:#3c8f2e;border-radius:8px;padding:2px 7px;font-size:13px;color:#d9ffcf;border:1px solid #9ee08a}
.receive{display:flex;align-items:center;justify-content:center;gap:8px;font-size:20px;font-weight:700;padding:8px;margin:6px 0}
.receive img{width:30px;height:30px}
.list-card{display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:10px;cursor:pointer;transition:transform .12s}
.list-card:active{transform:scale(.98)}
.list-card .ic{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(48,23,6,.55);box-shadow:inset 0 2px 4px rgba(0,0,0,.5)}
.list-card .ic img{width:46px;height:46px}
.list-card .t{font-size:20px;font-weight:700;line-height:1.1}
.list-card .s{font-size:15px;opacity:.95;margin-top:2px}
.task{padding:10px 12px;margin-bottom:10px}
.task .top{display:flex;gap:12px;align-items:center}
.task .tim{width:58px;height:58px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(48,23,6,.55);box-shadow:inset 0 2px 4px rgba(0,0,0,.5)}
.task .tim img{width:46px;height:46px}
.task .title{font-size:18px;font-weight:700;line-height:1.15}
.stars{display:flex;gap:2px}
.stars i{width:30px;height:30px;background:url(/static/img/star.webp) center/contain no-repeat;filter:brightness(.25) sepia(1) saturate(.6);opacity:.9}
.stars i.on{filter:none}
.reward{display:inline-flex;align-items:center;gap:4px;color:#ffd23f;font-weight:700;font-size:20px}
.reward img{width:24px;height:24px}
.unit-card{padding:10px 12px 12px;margin-bottom:12px}
.unit-card h4{margin:0 0 6px;text-align:center;font-size:24px}
.unit-card .body{display:flex;gap:12px;align-items:center}
.unit-card .pic{width:84px;height:84px;flex:none;border-radius:14px;display:flex;align-items:center;justify-content:center}
.unit-card .pic img{width:70px;height:70px}
.qty{display:flex;align-items:center;justify-content:space-between;padding:4px;margin-top:6px}
.qty span{font-size:22px;font-weight:700}
.ybtn{width:46px;height:34px;border-radius:17px;display:flex;align-items:center;justify-content:center;font-size:26px;color:#fff;cursor:pointer;background:linear-gradient(#ffd95a,#f2a400);border:2px solid #fff4c4;box-shadow:0 2px 0 #9b5e00;font-weight:700}
.pack{padding:12px;margin-bottom:14px}
.pack .content{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 12px;padding:10px}
.pack .it{position:relative;display:flex;flex-direction:column;align-items:center;font-size:17px;font-weight:700}
.pack .it img{width:46px;height:46px}
.pack .it b{margin-top:-8px}
.pack .info{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0}
.pack .info div{padding:6px;text-align:center;font-size:17px;font-weight:700}
.table{width:100%;border-collapse:collapse;font-size:16px}
.table td,.table th{padding:7px 6px;text-align:left}
.table th{font-weight:700;opacity:.9}
.table tr+tr td{border-top:1px solid rgba(255,255,255,.12)}
.pager{display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding:5px;border-radius:12px;background:rgba(10,30,50,.45)}
.pager .btn{padding:4px 10px}
.ava{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex:none;overflow:hidden;background:linear-gradient(#e2574c,#b0332a)}
.ava img{width:100%;height:100%;object-fit:cover}
.menu-item{display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;margin-bottom:9px;font-size:19px;font-weight:700;cursor:pointer;border-radius:12px;background:linear-gradient(#6b3d17,#4f2a0c);border:2px solid #2c1607;box-shadow:inset 0 2px 0 rgba(255,220,160,.2),0 3px 0 rgba(0,0,0,.4)}
.switch{margin-left:auto;width:52px;height:28px;border-radius:14px;background:rgba(48,23,6,.7);position:relative;cursor:pointer;box-shadow:inset 0 2px 3px rgba(0,0,0,.5)}
.switch i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#d9b98e;transition:left .2s}
.switch.on{background:#3c9a32}.switch.on i{left:27px;background:#fff}
.test-banner{position:fixed;left:6px;bottom:calc(4px + var(--safe-bot));z-index:300;background:#c62b23d0;border-radius:8px;padding:1px 7px;font-size:10px;font-weight:700;pointer-events:none}

/* ------------- modal */
.modal-wrap{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(10,5,0,.35);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:fade .18s}
@keyframes fade{from{opacity:0}}
.modal{width:100%;max-width:370px;max-height:86vh;overflow:auto;padding:14px;animation:pop .25s cubic-bezier(.2,1.4,.4,1)}
@keyframes pop{from{transform:scale(.7);opacity:0}}
.modal .mtitle{text-align:center;font-size:26px;font-weight:700;margin:2px 36px 10px}
.modal .mclose{position:absolute;right:10px;top:10px;z-index:2}
.modal .mbody{padding:12px 14px;font-size:17px;line-height:1.35;text-align:center}
.modal .mbody p{margin:5px 0}
.modal .macts{display:flex;gap:8px;margin-top:12px}
.modal .macts .btn{flex:1}
.modal .bow{position:absolute;left:50%;top:-62px;transform:translateX(-50%);width:110px}
.welcome{margin-top:40px;overflow:visible}.welcome .mtitle{margin-top:34px}
.welcome .big{display:flex;align-items:center;justify-content:center;gap:10px;font-size:46px;font-weight:700;color:#ffd23f}
.welcome .big img{width:52px}
.toast{position:fixed;left:50%;top:calc(76px + var(--safe-top));transform:translateX(-50%);z-index:200;padding:9px 16px;font-size:16px;font-weight:700;border-radius:14px;max-width:90%;text-align:center;background:rgba(40,20,5,.92);border:2px solid #ffd23f;animation:fade .2s}
.fly{position:fixed;z-index:400;width:34px;height:34px;pointer-events:none;transition:transform .9s cubic-bezier(.5,-0.3,.6,1),opacity .9s}

/* ------------- farm */
/* 14.10: çim zemini kaydırma kabına değil, haritanın içindeki .grass katmanına çizilir → iOS'ta
   esneme (rubber-band) anında zemin yayılmaz; kabın düz yeşili yalnız taşma anında görünür. */
.farm{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;background:#62a83a;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.map .grass{position:absolute;left:-80px;right:-80px;top:-56px;bottom:0;background:url(/static/img/grass.webp) 0 0/240px;pointer-events:none}
.map{position:relative;width:390px;max-width:100%;margin:56px auto 0;height:1880px}
/* Dar ekranlarda (360/320 px) harita 390 px tasarımına göre küçültülür: bant ve "Yükselt" düğmesi yan menünün altına girmez. */
@media (max-width:374px){.map{zoom:.92}}
@media (max-width:339px){.map{zoom:.82}}
.sp{position:absolute;pointer-events:none;filter:drop-shadow(0 6px 4px rgba(0,40,0,.28))}
.road{position:absolute;left:-20px;right:-20px;top:212px;height:70px;background:linear-gradient(#e5c78c,#d6b072);border-top:4px solid #b88f52;border-bottom:4px solid #b88f52;border-radius:30px;box-shadow:inset 0 4px 6px rgba(0,0,0,.12)}
.bld{position:absolute;z-index:3}
.bld>img{width:100%;display:block;filter:drop-shadow(0 6px 4px rgba(0,30,0,.3))}
.bld .btn{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;z-index:2}
.bld .btn:active{transform:translateX(-50%) translateY(3px)}
.shop-b{left:6px;top:110px;width:150px}.shop-b .btn{top:-6px}
.barn-b{right:52px;top:76px;width:168px}.barn-b .btn{bottom:16px}
.wh-badge{position:absolute;right:76px;top:50px;z-index:5;display:flex;align-items:center;gap:6px;padding:4px 12px 4px 6px;font-size:19px;font-weight:700;border-radius:12px;background:url(/static/img/wood_light.webp?v=4) 0 0/400px;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35)}
.wh-badge>div{min-width:70px;padding:1px 6px;border-radius:7px}
.wh-badge img{width:28px;height:28px}
.truck{position:absolute;left:128px;top:196px;width:100px;z-index:4;transition:left 1s}
.truck img{width:100%;filter:drop-shadow(0 5px 3px rgba(0,0,0,.3))}
.truck.go{animation:drive 6s ease-in-out infinite}
@keyframes drive{0%{transform:translate(0,0)}40%{transform:translate(-26px,8px)}50%{transform:translate(-26px,8px) rotate(-1deg)}90%{transform:translate(0,0)}}
.truck.go img{animation:rumble .25s linear infinite}
@keyframes rumble{50%{transform:translateY(-1.5px)}}
.delivery{position:absolute;left:118px;top:120px;z-index:8;padding:5px 8px;text-align:center;font-size:15px;font-weight:700;color:#5a3412}
.delivery .btn{margin-top:3px;padding:3px 10px;font-size:15px}
.chest-b{position:absolute;left:142px;top:282px;width:120px;z-index:5;cursor:pointer}
.chest-b img{width:100%;animation:glow 2.2s ease-in-out infinite}
@keyframes glow{50%{filter:drop-shadow(0 0 10px #ffe56b) drop-shadow(0 4px 3px rgba(0,0,0,.3))}}
.chest-b .lbl2{position:absolute;left:-74px;top:26px;transform:rotate(-22deg);padding:3px 12px;font-size:20px;font-weight:700;color:#ffe08a;border-radius:10px;background:url(/static/img/wood_light.webp?v=4) 0 0/400px;border:3px solid var(--line);box-shadow:0 3px 0 rgba(0,0,0,.35)}
.conveyor{position:absolute;right:52px;width:44px;top:250px;bottom:40px;z-index:2;cursor:pointer;border-radius:6px;
  background:linear-gradient(90deg,#596670 0 6px,#a9b8c2 6px 9px,#8597a3 9px calc(100% - 9px),#a9b8c2 calc(100% - 9px) calc(100% - 6px),#596670 calc(100% - 6px));box-shadow:0 0 0 2px #39434a,4px 6px 0 rgba(0,40,0,.25)}
.conveyor .belt{position:absolute;left:9px;right:9px;top:0;bottom:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 3px,transparent 3px 22px)}
.conveyor.run .belt{animation:belt .37s linear infinite}
@keyframes belt{from{background-position:0 0}to{background-position:0 -22px}}
.conv-item{position:absolute;left:5px;width:34px;height:34px;opacity:0;will-change:transform;filter:drop-shadow(0 2px 1px rgba(0,0,0,.35))}
.plot{position:absolute;left:0;width:300px;height:260px}
.plot .pen{position:absolute;left:0;top:30px;width:300px;filter:drop-shadow(0 8px 5px rgba(0,40,0,.3))}
.plot .clearing{position:absolute;left:10px;top:56px;width:250px;opacity:.95}
.plot .animal{position:absolute;width:62px;transform-origin:50% 100%;animation:idle 2.6s ease-in-out infinite;filter:drop-shadow(0 4px 2px rgba(0,0,0,.3));z-index:2}
.plot .animal.walk{animation:wander 9s ease-in-out infinite}
@keyframes idle{0%,100%{transform:translateY(0) scaleY(1)}50%{transform:translateY(-3px) scaleY(1.03)}}
@keyframes wander{0%,100%{transform:translateX(-14px) scaleX(1)}40%{transform:translateX(14px) scaleX(1)}50%{transform:translateX(14px) scaleX(-1)}90%{transform:translateX(-14px) scaleX(-1)}}
.sign{position:absolute;left:52px;top:0;width:150px;z-index:4;padding:7px 8px 8px;text-align:center}
.sign:before,.sign:after{content:"";position:absolute;bottom:-34px;width:10px;height:34px;background:linear-gradient(90deg,#6b3e18,#8a5526,#5b3213);border:2px solid var(--line);border-top:none;z-index:-1}
.sign:before{left:24px}.sign:after{right:24px}
.sign .r1{display:flex;align-items:center;gap:6px;justify-content:center}
.sign .r1 .av{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center}
.sign .r1 .av img{width:36px;height:36px}
.sign .t1{font-size:19px;font-weight:700;line-height:1}
.sign .t2{font-size:19px;font-weight:700;color:#ffe08a;display:flex;align-items:center;gap:3px}
.sign .t2 img{width:20px}
.sign .btn{width:100%;margin-top:6px;padding:5px}
.board{position:absolute;left:30px;top:0;z-index:4;padding:6px 10px;font-size:17px;font-weight:700;border-radius:12px}
.board div{display:flex;align-items:center;gap:6px;line-height:1.25}
.board img{width:24px;height:24px}
.plot .plus{position:absolute;left:180px;top:6px;z-index:4;width:36px;height:36px;font-size:28px}
/* 14.10 18:40 KADO: boru ağıldan bandın kenarına kadar uzanır, ucunda flanşlı ağız; ürün buradan banda kayar */
.pipe{position:absolute;left:258px;top:150px;width:36px;height:14px;z-index:1;background:linear-gradient(#d3dce2,#8d9ba5 55%,#6c7a84);border:2px solid #4b565e;border-right:0;border-radius:7px 0 0 7px;box-shadow:0 3px 2px rgba(0,40,0,.3)}
.pipe .spout{position:absolute;right:-3px;top:-6px;width:9px;height:22px;border-radius:3px;background:linear-gradient(90deg,#5d6a73,#a7b4bd 45%,#5d6a73);border:2px solid #3b454c;box-sizing:border-box}
.bubble{position:absolute;left:4px;right:120px;z-index:30;display:flex;align-items:flex-start;animation:pop .3s}
/* Çiftlik eğitim baloncuğu: haritanın üstünde sabit, ekranın altında (yan menüye ve uyarı rozetine çarpmaz,
   tarla/ağıl dokunmalarını örtmez; harita altında kaydırılabilir). */
.bubble.fixed{position:fixed;left:6px;right:74px;bottom:calc(64px + var(--hx,0px) + var(--safe-bot));z-index:33;max-width:330px}
.bubble.fixed .txt{font-size:14.5px;padding:14px 10px 9px}
.bubble>img{width:74px;margin-right:-10px;margin-top:-10px;z-index:2;filter:drop-shadow(0 3px 2px rgba(0,0,0,.3))}
.bubble .txt{position:relative;flex:1;padding:16px 12px 10px;font-size:15.5px;font-weight:600;color:#4a2810;line-height:1.25}
.bubble .nm{position:absolute;left:14px;top:-14px;padding:1px 10px;font-size:14px;font-weight:700;color:#fff;border-radius:9px;background:#6b3e18;border:2px solid #fff3d0}
.bubble .x{position:absolute;right:-12px;top:-14px;width:30px;height:30px;font-size:15px}
.hl{animation:hl 1.1s ease-in-out infinite}
@keyframes hl{50%{box-shadow:0 0 0 4px #fff,0 0 22px 6px #fffbe0,0 3px 0 var(--c3)}}
.focus{outline:4px solid rgba(255,255,255,.9);outline-offset:6px;border-radius:20px;animation:fpulse 1.2s infinite}
@keyframes fpulse{50%{outline-color:rgba(255,255,255,.3)}}
.contest-card{position:absolute;left:8px;top:2px;z-index:35;width:168px;padding:6px 8px 16px;text-align:center;cursor:pointer;border-radius:14px;
  background:linear-gradient(#ef4b3f,#b8231a);border:3px solid #ffd23f;box-shadow:0 3px 0 rgba(0,0,0,.35),inset 0 2px 0 rgba(255,255,255,.35)}
.contest-card .amt{display:flex;align-items:center;justify-content:center;gap:6px;font-size:26px;font-weight:700;color:#ffe08a}
.contest-card .amt img{width:32px}
.contest-card .tm{position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);display:flex;gap:4px;align-items:center;white-space:nowrap;padding:1px 9px;font-size:14px;font-weight:700;border-radius:10px;background:#1d4e78;border:2px solid #fff}
.ftd-bar{position:absolute;right:8px;top:6px;z-index:35;width:188px;display:flex;align-items:center;gap:6px;padding:4px 5px;cursor:pointer;border-radius:14px}
.ftd-bar .pb{flex:1;position:relative;height:16px;border-radius:8px;background:rgba(48,23,6,.6);overflow:hidden;box-shadow:inset 0 2px 3px rgba(0,0,0,.5)}
.ftd-bar .pb i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#9ad65a,#4f9a26)}
.ftd-bar img{width:34px;margin:-8px -4px -6px -2px;position:relative;z-index:2}
/* 14.10 KADO: küçük, şık uyarı rozeti (sağ üst, bandın yanında) */
.hints{position:fixed;left:8px;bottom:calc(30px + var(--safe-bot));z-index:34;display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.hint{display:flex;align-items:center;gap:6px;max-width:300px;white-space:nowrap;padding:4px 5px 4px 10px;font-size:12.5px;font-weight:700;color:#ffe7a8;border-radius:20px;background:rgba(40,20,5,.86);border:2px solid #ffd23f;box-shadow:0 3px 0 rgba(0,0,0,.35)}
.hint .btn.xs{padding:3px 9px;font-size:12px;border-radius:12px;min-height:0;line-height:1.2}
.hint .x{width:18px;height:18px;font-size:10px;flex:none}
/* bant başında sabit Yükselt (+) düğmesi (14.10 18:40 KADO: kaydırınca peşinden gelmesin, yukarıda dursun) */
.conv-track{position:absolute;right:52px;width:44px;top:244px;z-index:5;pointer-events:none}
.conv-up{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;pointer-events:auto;cursor:pointer}
.conv-up .plus{width:34px;height:34px;font-size:26px}
.conv-up.alert .plus{animation:pulse 1.1s ease-in-out infinite;box-shadow:0 0 0 3px #e2574c,0 2px 0 #9b5e00}
@keyframes pulse{50%{transform:scale(1.12)}}
.conv-up .tag{font-size:10px;font-weight:800;color:#fff;background:rgba(40,20,5,.82);border:1.5px solid #ffd23f;border-radius:8px;padding:1px 5px;line-height:1.2;white-space:nowrap}

/* ------------- wheel */
.wheel-wrap{position:relative;width:min(94vw,370px);aspect-ratio:1;margin:0 auto 6px;border-radius:50%;padding:14px;
  background:radial-gradient(circle,#c8892d 60%,#8a5420 61%,#f4c75e 64%,#b07020 68%,#e8b34c 72%,#8a5420 75%);box-shadow:0 8px 14px rgba(0,0,0,.5)}
.wheel-wrap.teal{background:radial-gradient(circle,#2bb59e 60%,#14675a 61%,#8ef0dc 64%,#1b8d7a 70%,#6ad8c3 73%,#14675a 75%)}
/* Kısa/dar ekranlarda çark yan menünün altına girmesin: içerik genişliğine sığar */
@media (max-width:374px),(max-height:700px){.wheel-wrap{width:min(100%,370px)}}
.wheel-svg{width:100%;height:100%;border-radius:50%;box-shadow:0 0 0 3px rgba(0,0,0,.35)}
.wheel-pointer{position:absolute;left:50%;top:-6px;transform:translateX(-50%);width:44px;height:52px;z-index:3;background:linear-gradient(#ffe8a0,#d9a030);clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 3px 2px rgba(0,0,0,.5))}
.wheel-wrap.teal .wheel-pointer{background:linear-gradient(#c9fff3,#3bc4aa)}
.wheel-center{position:absolute;left:50%;top:50%;width:70px;height:70px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe9a3,#c98a20 70%,#7a4a10);border:4px solid #6b3e10;box-shadow:0 3px 6px rgba(0,0,0,.5)}
.wheel-wrap.teal .wheel-center{background:radial-gradient(circle at 35% 30%,#c9fff3,#2bb59e 70%,#14675a);border-color:#0e4a40}
.jackpot{text-align:center;font-size:24px;font-weight:700;margin-bottom:8px}
.livebet{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:8px}
.livebet>div{min-width:0}.livebet>div>b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.livebet .chip{flex-shrink:0}   /* 21.10 QA D8: 320 px'te rozet taşmasın */
.lot-status{padding:16px 12px;text-align:center;font-size:19px;font-weight:700;margin-bottom:12px}
.lot-status:before{content:"";position:absolute;top:-3px;left:50%;transform:translateX(-50%);border-left:14px solid transparent;border-right:14px solid transparent;border-top:18px solid #ffb81c}
.ftd-step{display:flex;align-items:center;gap:10px;padding:10px;margin:7px 0;border-radius:14px;font-size:17px;font-weight:700;color:#4a2810;background:#dcc796;border:2px solid #b49352}
.ftd-step.done{background:linear-gradient(#b6e88f,#8fcf62);border-color:#4f9a26}
.ftd-step .n{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;background:#3c8f2e;border:2px solid #fff;flex:none}
.ftd-step img{width:38px;height:38px}
.ftd-pack{flex:1;padding:8px 4px;border-radius:14px;text-align:center;cursor:pointer;color:#4a2810;font-weight:700;background:#ecd9ad;border:3px solid #b49352}
.ftd-pack.on{background:#c6eda6;border-color:#3c8f2e;transform:scale(1.04)}
.ftd-pack img{width:42px}
.hero{position:relative;overflow:hidden;border-radius:14px;border:3px solid #ffd23f;aspect-ratio:16/8.5;background:url(/static/img/contest.webp) center/cover}
.hero .ht{position:absolute;right:10px;top:10px;width:58%;text-align:center}
.hero .ht b{display:block;font-size:24px;color:#ffe08a;line-height:1.05}
.score-rules{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:8px 0}
.score-rules div{display:flex;flex-direction:column;align-items:center;padding:6px 2px;font-size:13px;text-align:center}
.score-rules img{width:44px;height:44px}

a.btn{text-decoration:none}
.list-card .ic{font-size:30px}
/* 15.10 (reis): üst barda bakiyelerin dolar karşılığı (küçük ikinci satır) */
.bal .col{display:flex;flex-direction:column;align-items:flex-start;line-height:1;cursor:pointer}
.bal .usd{font-size:9.5px;font-weight:600;color:#fff;opacity:.82;margin-top:2px;letter-spacing:.2px;white-space:nowrap}
/* 16.10 QA: meşgul göstergesi (istek sürerken), yan menü etiketleri sığsın */
@keyframes spin{to{transform:rotate(360deg)}}
body.busy::after{content:"";position:fixed;right:14px;top:calc(var(--hdr) + var(--safe-top) + 10px);width:22px;height:22px;border:3px solid #ffe08a;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite;z-index:999;pointer-events:none}
.nav-item span{max-width:58px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.3px}