/* Quack Shot Arcade — carnival shooting gallery identity + responsive polish */
:root{--qs-safe-l:max(12px,env(safe-area-inset-left,0px));--qs-safe-r:max(12px,env(safe-area-inset-right,0px));--qs-safe-t:max(10px,env(safe-area-inset-top,0px));--qs-safe-b:max(10px,env(safe-area-inset-bottom,0px))}
#screen-start{padding:0;background:linear-gradient(180deg,#89c9d8 0 25%,#e7b75e 25% 100%);overflow:hidden}
#screen-start::before{content:'';position:absolute;left:7%;right:7%;bottom:6%;height:60%;background:repeating-linear-gradient(90deg,#b54a3a 0 10%,#f1dfb0 10% 20%);border:7px solid #4c3024;box-shadow:0 13px 0 #342219;clip-path:polygon(0 20%,8% 7%,16% 20%,24% 7%,32% 20%,40% 7%,48% 20%,56% 7%,64% 20%,72% 7%,80% 20%,88% 7%,96% 20%,100% 13%,100% 100%,0 100%);pointer-events:none}
#screen-start::after{content:'QUACK SHOT  •  3 TICKETS  •  HIT THE GOLD DUCK';position:absolute;left:max(6%,var(--qs-safe-l));top:calc(var(--qs-safe-t) + 2%);padding:.42rem .7rem;background:#f5e9c6;color:#493227;border:3px solid #493227;font:900 .68rem/1 ui-monospace,monospace;letter-spacing:.12em;box-shadow:4px 4px 0 #493227;white-space:nowrap;max-width:calc(100vw - var(--qs-safe-l) - var(--qs-safe-r));overflow:hidden;text-overflow:ellipsis}
#screen-start .panel{position:absolute;inset:0;width:100%;max-width:none;max-height:none;padding:0;background:transparent;border:0;box-shadow:none;text-align:left;overflow:visible}
#screen-start .tag{position:absolute;left:max(7%,var(--qs-safe-l));top:14%;background:#b84535;color:#fff3ca;border-radius:0;padding:.3rem .6rem}
#screen-start .logo{position:absolute;left:max(7%,var(--qs-safe-l));top:21%;margin:0!important;max-width:53%;color:#fff2c7!important;font:900 clamp(3rem,8.5vw,6.2rem)/.77 Impact,sans-serif!important;letter-spacing:-.04em!important;text-shadow:5px 5px 0 #5d3529!important}
#screen-start .subtitle{position:absolute;left:max(7%,var(--qs-safe-l));top:47%;width:min(42vw,500px);margin:0;padding:.65rem .75rem;background:#f2e1b7;color:#453228;border:3px solid #50382b;box-shadow:6px 6px 0 #4a3227;font-weight:800}
#screen-start .btn{position:absolute;right:max(6%,var(--qs-safe-r));width:min(29vw,330px);border-radius:0!important;border:4px solid #493227!important;background:#f1d575!important;color:#3d2b23!important;box-shadow:6px 6px 0 #493227!important;font-weight:900!important;text-transform:uppercase;min-height:44px}
#screen-start #btn-play{top:20%;min-height:74px;background:#b84535!important;color:#fff!important}
#screen-start #btn-modes{top:34%}#screen-start #btn-shop{top:46%}#screen-start #btn-how{top:58%}
#screen-start .best-line{position:absolute;right:max(6%,var(--qs-safe-r));bottom:calc(10% + env(safe-area-inset-bottom,0px));width:min(29vw,330px);padding:.5rem .65rem;background:#493227;color:#f2dfa8;font-family:ui-monospace,monospace;text-align:center}
#screen-start .auth-row{position:absolute;left:max(7%,var(--qs-safe-l));bottom:calc(4% + env(safe-area-inset-bottom,0px));max-width:min(42vw,500px)}
#screen-start .controls-hint{left:max(7%,var(--qs-safe-l));max-width:min(42vw,500px)}
#screen-modes .panel,#screen-shop .panel,#screen-how .panel,#screen-pause .panel,#screen-gameover .panel{background:#f1dfb7!important;color:#443127!important;border-radius:0!important;border:4px solid #4b3429!important;box-shadow:8px 8px 0 #b84535!important;text-align:left!important;max-height:calc(100dvh - var(--qs-safe-t) - var(--qs-safe-b) - 18px);overflow:auto}
#screen-modes,#screen-shop,#screen-how,#screen-pause,#screen-gameover{padding:var(--qs-safe-t) var(--qs-safe-r) var(--qs-safe-b) var(--qs-safe-l)}
#hud{padding-left:var(--qs-safe-l);padding-right:var(--qs-safe-r);padding-top:max(0px,env(safe-area-inset-top,0px))}
.hud-btn,.btn,.auth-link,.fb-btn,.nn-nudge-signup,.nn-nudge-later,.mode-list button,.shop-grid button{min-height:44px}
.hud-btn{min-width:44px}
button,a{touch-action:manipulation}
button:focus-visible,a:focus-visible{outline:3px solid #ffe276;outline-offset:3px}
@media(max-width:680px){
  #screen-start{overflow:auto}
  #screen-start::before{left:-20%;right:-20%;bottom:-6%;height:58%;opacity:.64}
  #screen-start::after{font-size:.52rem;letter-spacing:.07em;padding:.35rem .55rem}
  #screen-start .panel{position:relative;display:grid;grid-template-rows:auto auto auto auto auto auto;align-content:start;gap:8px;min-height:100%;padding:calc(var(--qs-safe-t) + 46px) var(--qs-safe-r) calc(var(--qs-safe-b) + 14px) var(--qs-safe-l);overflow:auto}
  #screen-start .tag,#screen-start .logo,#screen-start .subtitle,#screen-start .btn,#screen-start .best-line,#screen-start .auth-row{position:static;left:auto;right:auto;top:auto;bottom:auto;width:min(92vw,560px);max-width:100%;justify-self:center}
  #screen-start .tag{width:auto;justify-self:start}
  #screen-start .logo{font-size:clamp(2.8rem,15vw,5rem)!important}
  #screen-start .subtitle{font-size:.74rem}
  #screen-start #btn-play,#screen-start #btn-modes,#screen-start #btn-shop,#screen-start #btn-how{position:static;min-height:48px}
  #screen-start #btn-play{min-height:56px}
  #screen-start .best-line{font-size:.66rem}
  #screen-start .auth-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
  #screen-start .controls-hint{position:static!important;width:min(92vw,560px)!important;max-width:100%!important;justify-self:center;margin-top:2px;font-size:.58rem}
  #screen-modes .panel,#screen-shop .panel,#screen-how .panel,#screen-pause .panel,#screen-gameover .panel{width:min(94vw,650px);padding:16px 14px}
  .hud-row{gap:4px}
  .hud-group{gap:4px}
  .hud-label{font-size:.52rem}
  .hud-value{font-size:.8rem}
  .combo-chip{min-width:38px}
}
@media(max-height:520px) and (orientation:landscape){
  #screen-start .panel{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(330px,1.1fr);grid-template-rows:auto auto auto 1fr;gap:6px 16px;padding:calc(var(--qs-safe-t) + 28px) var(--qs-safe-r) var(--qs-safe-b) var(--qs-safe-l)}
  #screen-start .tag{grid-column:1;grid-row:1}
  #screen-start .logo{grid-column:1;grid-row:2;font-size:clamp(2.2rem,11vh,3.4rem)!important}
  #screen-start .subtitle{grid-column:1;grid-row:3;width:100%;font-size:.62rem}
  #screen-start .auth-row{grid-column:1;grid-row:4;width:100%;font-size:.58rem;align-self:start}
  #screen-start #btn-play{grid-column:2;grid-row:1;min-height:48px}
  #screen-start #btn-modes{grid-column:2;grid-row:2}
  #screen-start #btn-shop{grid-column:2;grid-row:3}
  #screen-start #btn-how{grid-column:2;grid-row:4;align-self:start}
  #screen-start .best-line{grid-column:2;grid-row:4;align-self:end;width:100%;font-size:.58rem}
  #screen-start .controls-hint{display:none}
  #screen-start::before{left:43%;right:1%;bottom:-15%;height:85%}
  #screen-modes .panel,#screen-shop .panel,#screen-how .panel,#screen-pause .panel,#screen-gameover .panel{width:min(94vw,860px);padding:12px 16px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}