/* A single course stage with controls resting in the camera's safe margins. */
.game-shell.immersive-game{display:flex;flex-direction:column;height:var(--viewport-height);min-height:0;max-width:1600px;overflow:hidden;padding:var(--safe-top) max(8px,var(--safe-right)) var(--safe-bottom) max(8px,var(--safe-left));background:#edf6e6;gap:0}
.immersive-game .game-header{height:auto;min-height:60px;padding:4px 4px;flex-shrink:0;gap:6px}.immersive-game .game-header h1{font-size:20px}.immersive-game .game-header h1 strong{font-size:26px}.immersive-game .game-header h1 span{font-size:15px}.immersive-game .game-header small{font-size:15px}.immersive-game .game-header-right{margin:0 0 0 auto;gap:0}.immersive-game .game-header-right>.icon-button:last-child{display:inline-flex}.immersive-game .game-header .icon-button{width:44px;min-width:44px;min-height:44px}.immersive-game .game-progress{margin:1px 4px 6px;flex-shrink:0}.immersive-game .game-status{position:static;max-width:800px;width:100%;grid-template-columns:1.3fr 1fr .7fr;gap:12px;margin:0 auto;padding:0 8px 8px;flex-shrink:0}.immersive-game .game-status small{font-size:15px}.immersive-game .game-status strong{font-size:25px}.immersive-game .game-status strong span{font-size:15px}.immersive-game .game-layout{display:block!important;position:relative;flex:1;min-height:0;width:100%;height:auto;gap:0}
.game-shell.immersive-game .field-area{display:block;position:absolute;inset:0;min-height:0;height:100%;width:100%;border-radius:18px;background:var(--course-grass,#a8c782);overflow:hidden}.game-shell.immersive-game .map-wrapper{position:absolute;inset:0;width:100%;height:100%;padding:0!important;min-height:0;max-height:none}.game-shell.immersive-game #course-map{touch-action:none;user-select:none;cursor:grab;display:block;width:100%;height:100%}.game-shell.immersive-game #course-map:active{cursor:grabbing}
.immersive-game .field-toolbar{position:absolute;top:8px;left:10px;right:10px;display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:0;background:transparent;pointer-events:none;z-index:2}.immersive-game .field-toolbar>*{pointer-events:auto}.immersive-game .field-toolbar .terrain-readout{position:static;display:flex;flex:0 1 auto;min-width:0;max-width:calc(100% - 142px);min-height:44px;padding:6px 9px;border:1px solid #c5d7b7;background:#f5faedee;box-shadow:0 2px 6px #32562412;border-radius:12px;justify-content:center;gap:0}.immersive-game .terrain-readout span,.immersive-game .terrain-readout strong{display:block;font-size:15px;line-height:1.4}.map-tools{display:flex;gap:4px;align-items:center;flex-shrink:0}.map-tools button{min-width:40px;min-height:44px;border-radius:12px;background:#f5faedf5;color:#254c35;border:1px solid #bfd3b0;font-size:25px;font-weight:700;line-height:1}.map-tools button[data-action="zoom"]{font-size:16px;min-width:50px;padding:4px 6px}
.immersive-game .joystick-dock{position:absolute;right:16px;bottom:16px;z-index:3;display:block;min-height:0;width:auto;padding:0;background:transparent;overflow:visible;align-self:auto}.immersive-game .joystick-console{display:flex;flex-direction:column;gap:5px;width:auto;max-width:none;margin:0;--stick-size:clamp(130px,36vw,166px)}.immersive-game .joystick{width:var(--stick-size);height:var(--stick-size);flex-shrink:0;border:3px solid #eaf5dce6;box-shadow:0 3px 18px #264b3a26,inset 0 1px 7px #43674c20;background:radial-gradient(circle at center,#e4f2d9ee 0 31%,#f4fce4de 32% 50%,transparent 51%),conic-gradient(#2c9250 var(--charge,0%),#d9eacddc 0)}.immersive-game .stick-thumb{width:60px;height:60px;left:calc(50% - 30px);top:calc(50% - 30px)}.immersive-game .stick-readout{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:7px;background:#f8fff1eb;color:#2a6540;border:1px solid #c2d8ae;border-radius:20px;padding:2px 15px;min-height:38px;box-shadow:0 2px 5px #32502410}.immersive-game .stick-readout strong{font-size:25px;line-height:1.2}.immersive-game .stick-readout strong small{font-size:16px}.immersive-game .stick-readout>span:not(.sr-only){font-size:16px}.immersive-game .stick-instruction{font-size:18px}
.immersive-game .dock-action{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(88%,330px);min-width:0;z-index:4}.help-actions{display:grid;gap:10px;margin:22px 0}.game-shell .sr-only{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:400px){.immersive-game .game-header{min-height:62px}.immersive-game .game-header h1 span{display:block;margin:0;font-size:14px}.immersive-game .game-header h1{font-size:18px}.immersive-game .game-header small{font-size:14px}.immersive-game .game-status{gap:8px;padding-bottom:5px}.immersive-game .game-status small{font-size:14px}.immersive-game .game-status strong{font-size:23px}.immersive-game .terrain-readout span,.immersive-game .terrain-readout strong{font-size:14px}.immersive-game .joystick-dock{right:10px;bottom:12px}.immersive-game .field-toolbar{left:8px;right:8px;gap:5px}.immersive-game .field-toolbar .terrain-readout{max-width:calc(100% - 134px);padding:5px 6px}.map-tools{gap:3px}.map-tools button{min-width:38px}}
@media(max-height:700px) and (orientation:portrait){.immersive-game .joystick-console{--stick-size:130px}.immersive-game .joystick-dock{bottom:10px;right:12px}.immersive-game .field-toolbar .terrain-readout span{display:none}.immersive-game .game-header{min-height:56px}.immersive-game .game-status{padding-bottom:4px}}
@media(orientation:landscape) and (max-height:540px){.game-shell.immersive-game{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.8fr);grid-template-rows:54px 7px minmax(0,1fr);column-gap:12px}.immersive-game .game-header{grid-column:1;grid-row:1;min-height:0;height:54px;padding:0;gap:2px}.immersive-game .game-header h1{font-size:19px}.immersive-game .game-header h1 span{display:none}.immersive-game .game-header small{font-size:14px}.immersive-game .game-status{grid-column:2;grid-row:1;padding:2px 0;align-self:center;gap:4px}.immersive-game .game-status small{font-size:14px}.immersive-game .game-status strong{font-size:23px}.immersive-game .game-status strong span{font-size:14px}.immersive-game .game-progress{grid-column:1/-1;grid-row:2;margin:0 0 3px}.immersive-game .game-layout{grid-column:1/-1;grid-row:3}.immersive-game .joystick-console{--stick-size:128px}.immersive-game .joystick-dock{right:16px;bottom:10px}.immersive-game .field-toolbar{right:182px;left:8px;top:6px}.immersive-game .field-toolbar .terrain-readout span{display:none}.immersive-game .field-toolbar .terrain-readout strong{font-size:14px}.immersive-game .stick-readout{min-height:34px}.immersive-game .stick-readout strong{font-size:22px}}
@media(orientation:landscape) and (max-height:360px){.immersive-game .game-status strong{font-size:21px}.immersive-game .game-header .icon-button{min-width:40px;width:40px}.immersive-game .game-header-right{gap:0}}

/* Ground grid: fixed screen-width lines stay legible while pinching the map. */
.terrain-grid path,.terrain-flow path{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.terrain-grid-edge{stroke:#305b3c;stroke-width:2.2px;opacity:.36}.terrain-grid-line{stroke:#f4ffdc;stroke-width:1px;opacity:.78}
.terrain-grid-major .terrain-grid-edge{stroke-width:3px;opacity:.42}.terrain-grid-major .terrain-grid-line{stroke-width:1.4px;opacity:.9}
.terrain-flow-track{stroke:#2c5839;stroke-width:1.5px;opacity:.58}
.terrain-flow-dot{fill:#fffde4;stroke:#204e36;stroke-width:1px;vector-effect:non-scaling-stroke;transform-box:view-box;transform-origin:0 0;animation:terrain-downhill var(--flow-duration) linear var(--flow-delay) infinite}
@keyframes terrain-downhill{0%{transform:translate(calc(-1 * var(--flow-x)),calc(-1 * var(--flow-y)));opacity:0}15%,85%{opacity:1}100%{transform:translate(var(--flow-x),var(--flow-y));opacity:0}}
@media(prefers-reduced-motion:reduce){.terrain-flow-dot{animation:none;transform:translate(calc(.65 * var(--flow-x)),calc(.65 * var(--flow-y)))}}
.terrain-key{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px 0;font-size:18px;font-weight:700;color:#315438}.terrain-key i{width:110px;height:22px;border-radius:6px;border:1px solid #759453;background:linear-gradient(90deg,#74974e,#d6e4a0)}

/* Mesh is transparent and all boundary decoration sits below the ball and cup layers. */
.ob-fence{pointer-events:none}.ob-fence-shadow{fill:none;stroke:#173c31;stroke-width:1.2;opacity:.17}
.ob-fence-panel{fill:#244e45;opacity:.22}.ob-fence-mesh{opacity:.85}
.ob-fence-rail{fill:none;stroke:#365851;stroke-width:1.35px;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.ob-boundary-line{fill:none;stroke:#fff7df;stroke-width:1.6px;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.ob-stake-body{fill:none;stroke:#d62f37;stroke-width:3.4px;vector-effect:non-scaling-stroke;stroke-linecap:round}
.ob-stake-cap{fill:none;stroke:#ffe5da;stroke-width:2px;vector-effect:non-scaling-stroke;stroke-linecap:round}

/* Stake color describes the crossing rule; mesh exists only on solid net sections. */
.ob-stake-outline{fill:none;stroke:#314a49;stroke-width:5px;vector-effect:non-scaling-stroke;stroke-linecap:round}.stake-white .ob-stake-body{stroke:#fffdf0}.stake-white .ob-stake-cap{stroke:#dce8e7}.boundary-red{stroke:#e0494b;stroke-width:2px}.boundary-white{stroke:#fffdf0}.impact-ring{fill:none;stroke:#fff9ad;stroke-width:3px;vector-effect:non-scaling-stroke;pointer-events:none}

/* High-contrast mouse locator for desktop aiming and joystick dragging. */
@media (hover:hover) and (pointer:fine){.game-shell.immersive-game .field-area,.game-shell.immersive-game #course-map,.game-shell.immersive-game .joystick,.game-shell.immersive-game .joystick.dragging{cursor:url('../assets/ui/aim-cursor.svg') 16 16,crosshair}}
