/* V2: Zeus-inspired desktop composition, tight tile template, imperial-red base */
:root{--jade:#166b54;--dark:#210506;--red:#a51f1c;--gold:#f5d36c;--cream:#fff8df}
html,body{background:#210506}
.game{background:radial-gradient(circle at 50% 35%,rgba(255,201,77,.24),transparent 31%),linear-gradient(180deg,#5d0e10 0%,#891719 48%,#340708 100%)}
.scene:before{background:linear-gradient(90deg,rgba(37,2,4,.62),transparent 21% 79%,rgba(37,2,4,.62)),radial-gradient(circle at 50% 45%,transparent 0 28%,rgba(29,1,2,.45) 78%)}
.mountains{opacity:.62;filter:sepia(1) saturate(1.5) hue-rotate(318deg)}
.mist{background:rgba(255,206,151,.13)}
.pagoda,.pagoda:before{filter:sepia(1) saturate(2) hue-rotate(320deg)}
.icon-btn{background:radial-gradient(circle at 35% 30%,#c43a31,#7d1112 65%,#3b0708);box-shadow:inset 0 0 0 2px #7b4612,0 4px 0 #401006,0 0 16px rgba(255,176,65,.3)}
.reel-crown{background:linear-gradient(#c12722,#781012);border-color:#f2cf69}
.mult-steps b{background:#52090b}.mult-steps b.active{background:radial-gradient(circle,#fff5a8,#e4a726 58%,#8a4910)}
.reel-shell{background:linear-gradient(145deg,#ffe28b 0,#9a5917 6%,#e1ad43 11%,#7d1011 17%,#a61918 83%,#e1ad43 89%,#935516 95%,#ffe28b)}
.reels{gap:2px;padding:4px;background:linear-gradient(rgba(66,5,7,.96),rgba(38,3,5,.98)),repeating-linear-gradient(90deg,transparent 0 19%,rgba(255,229,171,.04) 20%);box-shadow:inset 0 0 28px #190001,inset 0 0 0 2px #e8c56e}
.tile-face{width:97%;height:96%;max-width:none;border-radius:8px}
.controls{background:linear-gradient(180deg,rgba(104,10,12,.62),rgba(45,3,5,.96));border-top-color:rgba(255,214,105,.34)}
.small-btn,.auto{background:linear-gradient(145deg,#bd3029,#7a1112 57%,#3f0708);box-shadow:inset 0 0 0 2px #74400f,inset 0 7px 10px rgba(255,255,255,.1),0 5px 0 #421006,0 8px 12px #180001}
.auto.active{background:linear-gradient(145deg,#db4639,#941415)}
.message{color:#ffe7a5}
@media(max-width:600px) and (orientation:portrait){
 .tile-face{width:97%;height:96%}
 .reels{gap:2px;padding:4px}
 .controls{background:linear-gradient(180deg,rgba(130,17,19,.72),rgba(52,4,6,.97))}
}
@media(max-width:370px){.reels{gap:1px;padding:3px}.tile-face{width:98%;height:97%}}
@media(min-width:700px) and (orientation:landscape){
 .game{grid-template-columns:210px minmax(0,700px) 210px;grid-template-rows:1fr;justify-content:center;column-gap:0}
 .topbar{grid-column:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:26px 10px 18px;gap:18px;background:linear-gradient(90deg,rgba(47,3,5,.38),rgba(83,8,10,.16),transparent)}
 .brand{order:-1;width:200px;height:145px;flex:none}
 .brand small{font-size:10px}.brand strong{font-size:40px}.brand span{right:2px;top:32px;width:38px;height:38px;font-size:19px}
 .stage{grid-column:2;min-width:0;padding:18px 10px 12px;justify-content:center}
 .reel-crown,.reel-shell{width:min(680px,100%)}
 .reel-shell{height:min(70vh,540px);min-height:390px}
 .message{height:32px;margin-top:5px}
 .controls{grid-column:3;width:210px;height:100%;padding:24px 18px;display:flex;flex-direction:column;justify-content:center;gap:22px;border-left:1px solid rgba(245,211,108,.28);box-shadow:inset 12px 0 25px rgba(29,1,2,.22)}
 .meters{width:100%;display:grid;grid-template-columns:1fr;gap:22px;margin:0}
 .meter,.meter.win{text-align:left;margin:0;padding-left:8px}
 .meter span{font-size:9px}.meter strong{font-size:19px}
 .actions{width:100%;height:auto;margin:0;display:grid;grid-template-columns:48px 86px 48px;grid-template-rows:auto 86px 48px;justify-content:center;align-items:center;gap:12px 8px}
 .bet{grid-column:1/-1;grid-row:1;text-align:center;justify-self:center}
 .bet span{font-size:9px}.bet strong{font-size:20px}
 #betMinus{grid-column:1;grid-row:2;justify-self:center}
 .spin{grid-column:2;grid-row:2;justify-self:center;width:86px;height:86px}
 #betPlus{grid-column:3;grid-row:2;justify-self:center}
 .auto{grid-column:2;grid-row:3;justify-self:center}
 .small-btn,.auto{width:48px;height:48px}
 .tile-face{width:98%;height:97%}
 .reels{gap:2px;padding:4px}
}
@media(min-width:1400px) and (orientation:landscape){
 .game{grid-template-columns:230px 740px 230px}
 .reel-crown,.reel-shell{width:720px}
 .reel-shell{height:min(72vh,570px)}
 .controls{width:230px}
}
@media(min-width:700px) and (max-height:680px) and (orientation:landscape){
 .game{grid-template-columns:180px minmax(0,650px) 190px}
 .topbar{padding-top:12px;gap:12px}.brand{width:172px;height:118px}.brand strong{font-size:34px}.brand span{top:27px;width:33px;height:33px;font-size:16px}
 .stage{padding-block:10px}.reel-shell{height:calc(100vh - 92px);min-height:350px;max-height:500px}
 .controls{width:190px;padding:14px 12px;gap:12px}.meters{gap:12px}.actions{grid-template-columns:44px 78px 44px;grid-template-rows:auto 78px 44px;gap:8px 6px}.spin{width:78px;height:78px}.small-btn,.auto{width:44px;height:44px}
}
