/* القنص — v152 batch 1: fixed 16:9 stage between two side rails, compact landscape lobby, cartridge ammo. */
html.sayd-playing{overflow:hidden!important}
#saydRoot,#saydRoot *{box-sizing:border-box}
#saydRoot{--sd-rail:clamp(96px,13vw,150px);position:fixed;inset:0;z-index:9000;height:100dvh;background:#0c1b20;color:#fff5d8;font-family:var(--n-ui,'Tahoma',sans-serif);display:grid;grid-template-rows:48px minmax(0,1fr) auto;overflow:hidden;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
#saydRoot button{font:inherit;cursor:pointer;border:1px solid #b8a36b;border-radius:12px;color:#fff3cd;background:#152a30;padding:8px 15px}
#saydRoot button:disabled{opacity:.5;cursor:default}
#saydRoot [hidden]{display:none!important}

/* header */
.sd-head{display:flex;align-items:center;gap:14px;padding:5px 14px;background:#0a1923;box-shadow:0 1px 0 #887849;z-index:2}
.sd-head strong{font-size:22px;color:#f5d381}
.sd-round{font-size:13px;flex:1}
.sd-clock{font:bold 20px ui-monospace,monospace;color:#fff}
.sd-head .sd-back{font-size:26px;line-height:1;padding:0 14px}
.sd-head .sd-end{font-size:12px;padding:6px 10px;background:#552d2d;border-color:#b7836f}

/* main + panels */
.sd-main{min-height:0;display:flex;align-items:center;justify-content:center;position:relative;background:linear-gradient(#0d2028b8,#0a1823eb),url(/game/sayd/landscape-v147.webp) center/cover}
.sd-panel{width:min(680px,94%);max-height:100%;overflow:auto;padding:20px;text-align:center}
.sd-panel h1{font-size:clamp(26px,4vw,42px);margin:10px 0;color:#ffe2a3}
.sd-panel p{color:#c4d5d5;font-size:15px;line-height:1.7;margin:12px 0}
.sd-badge{color:#78d8bd;font-size:14px}
.sd-species,.sd-members{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:14px}
.sd-species span,.sd-members span{border:1px solid #4a656a;border-radius:12px;background:#18373c;padding:8px 14px}
.sd-species b{color:#f5d381;margin-right:12px}
#saydRoot .sd-primary{background:linear-gradient(#ffdf8f,#d5a63d);color:#172526;font-weight:bold;min-width:200px;padding:12px 24px}
.sd-hint{font-size:12px!important}
.sd-share{margin-top:8px}
.sd-share .dg-invite{justify-content:center}

/* footer: a real bar for results, a floating notice line while lobby/play (frees stage height) */
.sd-foot{background:#0a1923;padding:5px 12px;min-height:30px;z-index:2}
.sd-scores{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.sd-scores span{font-size:12px;border:1px solid #365159;padding:3px 10px;border-radius:9px}
.sd-scores .me{border-color:#e2bc65}
.sd-scores b{color:#7cd9bc;margin-right:8px}
.sd-notice{display:block;text-align:center;font-size:11px;color:#f5d381}
.sd-notice:empty{display:none}
.sd-ph-play .sd-foot,.sd-ph-lobby .sd-foot{position:absolute;left:0;right:0;bottom:0;background:none;padding:0 8px 3px;min-height:0;pointer-events:none;text-align:center}
.sd-ph-play .sd-scores,.sd-ph-lobby .sd-scores{display:none}
.sd-ph-play .sd-notice,.sd-ph-lobby .sd-notice{display:inline-block;background:#0a1923ea;border:1px solid #887849;border-radius:10px;padding:2px 12px}
.sd-ph-play .sd-notice:empty,.sd-ph-lobby .sd-notice:empty{display:none}

/* play: [ammo rail | 16:9 stage | scores rail]. The stage never stretches; drawing, touch and server hit-tests share its 0..1 space. */
.sd-play{width:100%;height:100%;display:grid;grid-template-columns:var(--sd-rail) minmax(0,1fr) var(--sd-rail);grid-template-rows:minmax(0,1fr);direction:ltr;position:relative;min-height:0}
.sd-rail{direction:rtl;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:8px 6px;min-height:0;overflow:hidden;background:#0a1923d9}
.sd-stagewrap{display:grid;place-items:center;min-width:0;min-height:0;container-type:size}
.sd-field{position:relative;width:100%;height:100%;overflow:hidden;box-shadow:0 0 30px #0005}
@supports (container-type:size){.sd-field{width:min(100cqw,calc(100cqh*16/9));height:auto;aspect-ratio:16/9}}
.sd-field canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair;user-select:none;-webkit-user-select:none}
.sd-countdown{position:absolute;inset:0;display:grid;place-items:center;background:#0a182355;text-shadow:0 4px 10px #000;font-size:clamp(24px,6vw,64px);text-align:center;padding:15px;pointer-events:none}
.sd-toast{position:absolute;top:10px;left:50%;transform:translateX(-50%);font-size:18px;font-weight:bold;color:#fff8da;text-shadow:0 2px 6px #000;pointer-events:none;white-space:nowrap}

/* ammo: six cartridges + tidy counter */
.sd-ammo{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%}
.sd-shells{display:grid;grid-template-columns:repeat(3,15px);gap:5px}
.sd-shell{position:relative;width:15px;height:34px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#f0695a 0 60%,#e0bb62 60% 100%);box-shadow:inset 0 2px 0 #ffffff59,0 2px 0 #4a3a12;transition:opacity .25s,filter .25s,transform .25s}
.sd-shell::after{content:'';position:absolute;left:4px;right:4px;bottom:3px;height:4px;border-radius:2px;background:#0000003d}
.sd-shell.is-spent{opacity:.24;filter:grayscale(1);transform:translateY(2px)}
.sd-count{display:flex;align-items:baseline;gap:4px;direction:ltr;line-height:1}
.sd-count b{font-size:28px;color:#ffdf8f;min-width:1ch;text-align:center}
.sd-count span{font-size:13px;color:#9ebabc}
.sd-ammo-label{font-size:11px;color:#9ebabc;text-align:center}
.sd-ammo.is-empty .sd-count b{color:#ff8a7a}
.sd-ammo.is-empty .sd-ammo-label{color:#ffb0a4}
.sd-ammo.is-reloading .sd-ammo-label{color:#8ce3c5}
#saydRoot #sdReload{width:100%;min-height:42px;padding:6px 8px;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
#saydRoot #sdReload.pulse{background:linear-gradient(#ffdf8f,#d5a63d);color:#172526;font-weight:bold;animation:sdpulse 1s ease-in-out infinite}
@keyframes sdpulse{50%{box-shadow:0 0 0 6px #ffdf8f33}}

/* scores rail */
.sd-side-scores{display:flex;flex-direction:column;gap:4px;width:100%}
.sd-side-row{display:flex;justify-content:space-between;align-items:center;gap:6px;width:100%;border:1px solid #365159;border-radius:8px;padding:3px 7px;font-size:12px}
.sd-side-row.me{border-color:#e2bc65;background:#2a3a2f}
.sd-side-row span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sd-side-row b{color:#7cd9bc;flex-shrink:0}
.sd-combo{font-size:12px;color:#8ce3c5;text-align:center}
.sd-combo:empty{display:none}
#saydRoot .sd-tap-hint{color:#ffe7a2;font-size:11px;line-height:1.5;text-align:center}

/* results */
.sd-standings{max-width:560px;margin:auto}
.sd-standing{display:grid;grid-template-columns:30px 1fr 90px 60px;gap:12px;text-align:right;align-items:center;padding:10px;border-bottom:1px solid #385156}
.sd-standing.me{color:#ffe3a4}
.sd-standing small{font-size:12px;color:#91c6bf}
.sd-standing strong{color:#8ee0c8}
.sd-award{color:#f6d591!important}
.sd-results .sd-secondary{margin-right:8px}

/* rotate hint (portrait) */
.sd-rotate{display:none}
@media(orientation:portrait){
 .sd-rotate{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;background:linear-gradient(#0b1b28df,#0b1b28f8);z-index:3;text-align:center;padding:20px}
 .sd-rotate b{font-size:64px;color:#f1d38c}.sd-rotate strong{font-size:26px}.sd-rotate span{font-size:14px;color:#bed4d1}
 .sd-head{gap:8px}.sd-head strong{font-size:18px}.sd-panel{padding:16px}
}

/* landscape phones: two-column lobby so the start button is always on screen, no scrolling.
   Colours/borders stay the shared unified-lobby look; only its spacing is tightened (it forces sizes with !important, so ids are used). */
@media(orientation:landscape) and (max-height:560px){
 #saydRoot .sd-main:has(.sd-lobby){padding:8px 12px!important}
 #saydRoot .sd-lobby.nl-unified-lobby{width:min(900px,100%)!important;max-width:900px!important;padding:10px 18px!important;border-radius:20px!important;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:4px 22px;align-items:center}
 .sd-lobby h1{font-size:clamp(22px,7vh,32px);margin:4px 0}
 .sd-lobby p{font-size:12.5px;margin:6px 0;line-height:1.55}
 .sd-lobby .sd-species{margin:8px 0;gap:6px}.sd-lobby .sd-species span{padding:5px 10px;font-size:13px}
 #saydRoot .nl-unified-lobby .sd-members{margin:0 0 8px!important;gap:6px!important}
 #saydRoot .nl-unified-lobby .sd-members>span{min-height:30px!important;padding:3px 10px!important;font-size:13px}
 #saydRoot .nl-unified-lobby .sd-primary{width:100%!important;min-height:44px!important;margin:6px auto!important;padding:6px 16px!important}
 #saydRoot .nl-unified-lobby .sd-share{margin-top:6px!important;padding-top:8px!important}
 #saydRoot .nl-unified-lobby .sd-share .dgl-share button{min-height:36px!important;font-size:12.5px!important;white-space:nowrap;padding:0 4px!important}
 .sd-lobby .sd-hint{display:none}
}
@media(orientation:landscape) and (max-height:420px){
 #saydRoot{grid-template-rows:38px minmax(0,1fr) auto}
 .sd-head{gap:12px;padding:3px 10px}.sd-head strong{font-size:18px}.sd-head button{padding:4px 12px!important}
 .sd-panel{padding:10px}.sd-panel h1{font-size:28px;margin:5px}.sd-panel p{font-size:13px;margin:8px}
 .sd-species,.sd-members{margin:8px}.sd-foot{padding:3px 10px}.sd-standing{padding:6px}.sd-share{margin:4px}
 .sd-rail{gap:6px;padding:6px 4px}.sd-shell{height:30px}.sd-count b{font-size:24px}
}
@media(orientation:landscape) and (max-height:330px){
 #saydRoot .sd-main:has(.sd-lobby){padding:4px 10px!important}
 #saydRoot .sd-lobby.nl-unified-lobby{padding:6px 14px!important;gap:2px 16px}
 .sd-lobby h1{font-size:20px;margin:2px 0}.sd-lobby .sd-badge{font-size:11px}
 .sd-lobby p{font-size:11px;margin:3px 0;line-height:1.45}
 .sd-lobby .sd-species{margin:4px 0}.sd-lobby .sd-species span{padding:3px 8px;font-size:11.5px}
 #saydRoot .nl-unified-lobby .sd-members{margin:0 0 4px!important;gap:4px!important}
 #saydRoot .nl-unified-lobby .sd-members>span{min-height:24px!important;padding:1px 8px!important;font-size:11.5px}
 #saydRoot .nl-unified-lobby .sd-primary{min-height:36px!important;margin:3px auto!important;padding:3px 14px!important}
 #saydRoot .nl-unified-lobby .sd-share{margin-top:3px!important;padding-top:5px!important}
 #saydRoot .nl-unified-lobby .sd-share .dgl-share button{min-height:30px!important;font-size:11.5px!important}
 .sd-rail{gap:4px;padding:4px}.sd-shell{height:24px;width:13px}.sd-shells{grid-template-columns:repeat(3,13px);gap:4px}.sd-count b{font-size:20px}.sd-ammo-label,.sd-tap-hint{display:none}
 #saydRoot #sdReload{min-height:32px}.sd-side-row{font-size:10.5px;padding:2px 6px}.sd-side-scores{gap:3px}.sd-combo{font-size:10px}
 .sd-countdown{font-size:clamp(20px,5vw,40px)}
}
@media(orientation:landscape) and (max-height:380px){.sd-tap-hint{display:none}}