/* Nerddi OS Run 53 · Command Center Controller
   Ergonomic visual/spacing pass only. Existing input, pairing and transport logic remains authoritative. */

@media(orientation:landscape){
  .controller-app[data-game-skin="botzwar"]{
    --run53-grip-left:clamp(150px,20vw,208px);
    --run53-grip-right:clamp(150px,20vw,208px);
    --run53-stick-y:56%;
    --run53-face-rotate:-5deg;
    --run53-z-offset-x:14px;
    --run53-both-gap:12px;
  }

  /* One molded chassis instead of three square columns. */
  .controller-app[data-game-skin="botzwar"] .controller-stage[data-controldeck-chassis="gamepad"] .controldeck-gamepad{
    grid-template-columns:var(--run53-grip-left) minmax(0,1fr) var(--run53-grip-right)!important;
    gap:0!important;
    padding:3px 5px 5px!important;
    border-radius:32px 32px 48px 48px!important;
    overflow:visible!important;
    background:
      linear-gradient(112deg,#ffffff0b,transparent 14%,transparent 86%,#ffffff08),
      radial-gradient(ellipse at 50% 12%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 38%),
      linear-gradient(155deg,#121e29 0,#03080d 48%,#0b141d 100%)!important;
    box-shadow:inset 0 2px 0 #ffffff16,inset 0 -20px 42px #000a,0 14px 32px #000b,0 0 34px color-mix(in srgb,var(--accent) 10%,transparent)!important;
  }
  .controller-app[data-game-skin="botzwar"] .controller-stage[data-controldeck-chassis="gamepad"] .controldeck-gamepad:before{
    content:"";position:absolute;z-index:0;inset:2px;border-radius:30px 30px 46px 46px;pointer-events:none;
    border:1px solid color-mix(in srgb,var(--accent) 18%,#1c3546);
    box-shadow:inset 0 0 0 1px #ffffff06,0 0 22px color-mix(in srgb,var(--accent) 6%,transparent);
  }

  /* Sculpted grips: wide at the shoulders, tapered at the waist, flared where palms sit. */
  .controller-app[data-game-skin="botzwar"] .deck-wing{position:relative;z-index:2;min-width:0;overflow:visible!important;padding:0 5px 7px!important}
  .controller-app[data-game-skin="botzwar"] .deck-left{
    clip-path:polygon(0 0,100% 0,96% 17%,91% 28%,92% 73%,100% 90%,88% 100%,16% 99%,4% 90%,0 69%);
    padding-right:8px!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-right{
    clip-path:polygon(0 0,100% 0,100% 69%,96% 90%,84% 99%,12% 100%,0 90%,8% 73%,9% 28%,4% 17%);
    padding-left:8px!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-left:after,.controller-app[data-game-skin="botzwar"] .deck-right:after{
    content:"";position:absolute;z-index:0;inset:28px 0 2px;pointer-events:none;opacity:.6;
    background:repeating-linear-gradient(120deg,#ffffff05 0 1px,transparent 1px 6px);
    mask-image:linear-gradient(#000,transparent 92%);
  }

  .controller-app[data-game-skin="botzwar"] .deck-left-body,
  .controller-app[data-game-skin="botzwar"] .deck-right-body{
    height:100%;min-height:0!important;border-radius:44px 24px 60px 30px!important;
    border:1px solid color-mix(in srgb,var(--accent) 22%,#1b3648)!important;
    background:
      radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 48%),
      radial-gradient(ellipse at 50% 95%,#172736 0,#071018 42%,transparent 72%),
      linear-gradient(145deg,#0c1822,#02070c 72%)!important;
    box-shadow:inset 0 0 0 7px #050b11,inset 0 0 52px #000c,0 0 0 1px #ffffff06,0 10px 28px #0009!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-right-body{border-radius:24px 44px 30px 60px!important}

  /* Shoulder paddles are wide, sloped, and easier to hit with index fingers. */
  .controller-app[data-game-skin="botzwar"] .deck-shoulders{gap:7px!important;padding:0 3px 3px;align-items:start}
  .controller-app[data-game-skin="botzwar"] .deck-shoulder{
    min-width:0!important;width:50%;height:34px!important;min-height:34px!important;padding:3px 5px!important;
    border-radius:15px 15px 11px 11px!important;transform:skewX(-7deg);
    border-color:#345064!important;background:linear-gradient(180deg,#152432,#071018 70%,#020507)!important;
    box-shadow:inset 0 2px 0 #ffffff12,inset 0 -10px 16px #0008,0 7px 16px #0008!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-right .deck-shoulder{transform:skewX(7deg)}
  .controller-app[data-game-skin="botzwar"] .deck-shoulder b,.controller-app[data-game-skin="botzwar"] .deck-shoulder small{transform:skewX(7deg)}
  .controller-app[data-game-skin="botzwar"] .deck-right .deck-shoulder b,.controller-app[data-game-skin="botzwar"] .deck-right .deck-shoulder small{transform:skewX(-7deg)}
  .controller-app[data-game-skin="botzwar"] .deck-shoulder b{font-size:8px!important}
  .controller-app[data-game-skin="botzwar"] .deck-shoulder small{font-size:4px!important}

  /* Direction mode selector gets a proper hardware strip above the thumb well. */
  .controller-app[data-game-skin="botzwar"] .deck-direction-module{padding:8px 8px 5px!important;gap:6px!important;grid-template-rows:auto minmax(0,1fr)!important}
  .controller-app[data-game-skin="botzwar"] .deck-direction-selector>div{gap:5px!important}
  .controller-app[data-game-skin="botzwar"] .deck-direction-selector button{
    min-height:28px!important;padding:0 7px!important;font-size:5px!important;border-radius:999px!important;
    background:linear-gradient(180deg,#101e29,#04090e)!important;box-shadow:inset 0 1px 0 #ffffff10,0 5px 10px #0008;
  }

  /* Lower the stick into the natural left-thumb resting arc. */
  .controller-app[data-game-skin="botzwar"] .deck-direction-stack{position:relative!important;overflow:visible!important}
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="stick"] .virtual-stick{
    transform:translateY(calc((var(--run53-stick-y) - 50%) * .9));
  }
  .controller-app[data-game-skin="botzwar"] .deck-left-body .stick-rings{
    width:min(29vh,146px)!important;max-width:92%!important;
    outline:7px solid #02060a!important;outline-offset:5px!important;
    box-shadow:0 0 0 1px #26485b,0 0 26px color-mix(in srgb,var(--accent) 16%,transparent),inset 0 0 18px #000!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-left-body .stick-knob{
    width:min(11.5vh,66px)!important;height:min(11.5vh,66px)!important;
    box-shadow:0 10px 24px #000c,inset 0 2px 0 #ffffff13,inset 0 0 18px #0007,0 0 18px color-mix(in srgb,var(--accent) 13%,transparent)!important;
  }

  /* Both mode uses two distinct thumb-safe wells instead of overlapping the same square. */
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="both"] .deck-direction-stack{
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)!important;gap:var(--run53-both-gap)!important;padding:5px 2px 0!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="both"] .virtual-stick{transform:translate(-3px,8px)}
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="both"] .master-direction-control{transform:translate(2px,-3px)}
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="both"] .virtual-stick .stick-rings,
  .controller-app[data-game-skin="botzwar"] .deck-direction-module[data-direction-mode="both"] .master-direction-pad{width:min(16vh,88px)!important}

  /* D-pad keys become larger, rounded hardware pads. */
  .controller-app[data-game-skin="botzwar"] .master-direction-pad{width:min(28vh,144px)!important;gap:5px!important}
  .controller-app[data-game-skin="botzwar"] .master-direction-pad .deck-dpad-key{
    border-radius:12px!important;min-width:36px;min-height:36px;background:linear-gradient(145deg,#263846,#071017)!important;
  }

  /* Right thumb arc: larger cluster, more separation, slight ergonomic rotation. */
  .controller-app[data-game-skin="botzwar"] .deck-right-body{place-items:center!important;padding:10px 8px 6px!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-cluster{
    width:min(31vh,158px)!important;max-width:96%!important;transform:translate(-2px,9px) rotate(var(--run53-face-rotate));overflow:visible!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-face{
    width:39%!important;min-width:44px;min-height:44px;aspect-ratio:1!important;padding:5px!important;
    border-width:2px!important;border-color:#38596d!important;
    background:radial-gradient(circle at 34% 24%,#273c4c,#0a141d 56%,#020507 100%)!important;
    box-shadow:0 10px 20px #000d,inset 0 2px 0 #ffffff18,inset 0 -10px 18px #0009,0 0 16px color-mix(in srgb,currentColor 16%,transparent)!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-face strong{font-size:clamp(19px,5.4vh,32px)!important}
  .controller-app[data-game-skin="botzwar"] .deck-face span{font-size:5px!important;top:calc(100% + 4px)!important;background:#010407e8!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-triangle{left:30.5%!important;top:-1%!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-circle{right:-1%!important;top:30.5%!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-cross{left:30.5%!important;bottom:-1%!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-square{left:-1%!important;top:30.5%!important}
  .controller-app[data-game-skin="botzwar"] .deck-face-z{
    width:35%!important;min-width:48px!important;min-height:48px!important;
    right:calc(-10% - var(--run53-z-offset-x))!important;top:-13%!important;
    transform:rotate(calc(var(--run53-face-rotate) * -1));
    border-color:#6c5a31!important;background:radial-gradient(circle at 36% 26%,#4a3a15,#19150b 58%,#040403 100%)!important;
    box-shadow:0 10px 24px #000d,inset 0 2px 0 #ffffff1b,0 0 22px #f4b94222!important;
  }

  /* Center display gets a polished command-screen bezel and softly pinched waist. */
  .controller-app[data-game-skin="botzwar"] .deck-center{z-index:3!important;padding:1px 0 2px!important;overflow:visible!important}
  .controller-app[data-game-skin="botzwar"] .deck-screen{
    border-radius:24px!important;border:1px solid #2b566b!important;
    box-shadow:inset 0 0 0 3px #03070b,inset 0 0 60px #000d,0 12px 26px #000c,0 0 24px color-mix(in srgb,var(--accent) 10%,transparent)!important;
  }
  .controller-app[data-game-skin="botzwar"] .deck-screen:before{
    content:"";position:absolute;z-index:7;left:10%;right:10%;top:-5px;height:5px;border-radius:50%;pointer-events:none;
    background:linear-gradient(90deg,transparent,#304e60 18%,#76d8e75c 50%,#304e60 82%,transparent);
  }
  .controller-app[data-game-skin="botzwar"] .deck-computer-dock{
    width:min(64%,360px)!important;margin:0 auto!important;padding:2px 8px!important;border-radius:20px 20px 9px 9px!important;
    background:linear-gradient(180deg,#111e28,#03080c)!important;border:1px solid #1d394a!important;box-shadow:0 7px 18px #0009!important;
  }

  /* Small landscape phones: keep the ergonomic proportions without stealing the command screen. */
  @media(max-height:430px){
    .controller-app[data-game-skin="botzwar"]{--run53-grip-left:clamp(132px,19vw,174px);--run53-grip-right:clamp(132px,19vw,174px)}
    .controller-app[data-game-skin="botzwar"] .deck-shoulder{height:30px!important;min-height:30px!important}
    .controller-app[data-game-skin="botzwar"] .deck-direction-selector button{min-height:23px!important;font-size:4px!important}
    .controller-app[data-game-skin="botzwar"] .deck-left-body .stick-rings{width:min(25vh,116px)!important}
    .controller-app[data-game-skin="botzwar"] .deck-face-cluster{width:min(27vh,126px)!important;transform:translate(-1px,6px) rotate(var(--run53-face-rotate))}
    .controller-app[data-game-skin="botzwar"] .deck-face{min-width:44px;min-height:44px}
    .controller-app[data-game-skin="botzwar"] .deck-face-z{min-width:45px!important;min-height:45px!important;right:calc(-8% - var(--run53-z-offset-x))!important}
  }
}