/* Private Sandbox UI. Removing this file and sandbox.js removes the feature's
   presentation without changing the Classic/Beta screens. */
#sandboxUI { position:absolute; inset:0; z-index:1600; pointer-events:none; font-family:Arial,sans-serif; color:#e9f8ff; }
#sandboxUI button, #sandboxUI input, #sandboxUI select { font:inherit; }
#sandboxUI button { min-height:44px; border:1px solid #2f7896; border-radius:9px; background:linear-gradient(#174866,#0c2e47); color:#eefbff; padding:7px 14px; font-weight:700; }
#sandboxUI button:active, #sandboxUI button.selected { background:linear-gradient(#3bb7dc,#18749c); }
#sandboxUI button:disabled { opacity:.48; }
#sandboxUI .sandboxPrimary { border-color:#7fe8ff; background:linear-gradient(#26b6d8,#14779f); }
#sandboxUI .sandboxDanger { border-color:#d66a70; background:linear-gradient(#a74250,#712838); }
.sandboxPowerJog { position:absolute; left:calc(50% - 159px); bottom:88px; z-index:10; display:none; width:400px; height:44px; box-sizing:border-box; border:1px solid rgba(103,221,245,.78); border-radius:22px; background:linear-gradient(180deg,rgba(11,46,68,.94),rgba(4,24,39,.96)); pointer-events:auto; touch-action:none; box-shadow:0 3px 14px rgba(0,0,0,.56),inset 0 1px rgba(255,255,255,.16); }
body.sandbox-active .sandboxPowerJog { display:block; }
.sandboxPowerJogRail { position:absolute; left:17px; right:17px; top:50%; height:8px; transform:translateY(-50%); border:1px solid rgba(120,210,232,.5); border-radius:8px; background:linear-gradient(90deg,#193d5b,#2a7995 49%,#47bdd5 50%,#2a7995 51%,#193d5b); box-shadow:inset 0 2px 4px rgba(0,0,0,.7); pointer-events:none; }
.sandboxPowerJogRail::after { content:""; position:absolute; left:50%; top:-5px; width:2px; height:16px; transform:translateX(-50%); border-radius:2px; background:#e8fbff; opacity:.82; }
#sandboxUI #sandboxPowerJogKnob { position:absolute; left:50%; top:50%; width:44px; height:44px; min-width:44px; min-height:44px; box-sizing:border-box; transform:translate(-50%,-50%); border:2px solid #d9faff; border-radius:50%; padding:0; background:radial-gradient(circle at 35% 28%,#d7fbff 0 9%,#58d5ed 12%,#1681a9 54%,#093d5e 100%); box-shadow:0 2px 8px rgba(0,0,0,.7),inset 0 -4px 7px rgba(0,18,38,.48); touch-action:none; }
#sandboxUI #sandboxPowerJogKnob::after { content:""; position:absolute; left:50%; top:50%; width:15px; height:5px; transform:translate(-50%,-50%); border-left:4px solid rgba(255,255,255,.88); border-right:4px solid rgba(255,255,255,.88); }
#sandboxUI #sandboxPowerJogKnob:focus-visible { outline:3px solid #fff06c; outline-offset:2px; }
.sandboxOverlay { position:absolute; inset:0; width:100%; height:600px; pointer-events:auto; z-index:20; }
.sandboxOverlay.hidden, .sandboxPlacementHint.hidden { display:none !important; }
.sandboxShade { position:absolute; inset:0; width:100%; height:100%; min-height:0 !important; border:0 !important; border-radius:0 !important; background:rgba(1,11,21,.72) !important; backdrop-filter:blur(2px); }
.sandboxPanel { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); box-sizing:border-box; width:520px; max-height:560px; overflow:hidden; border:2px solid #65d5ed; border-radius:16px; background:linear-gradient(155deg,#103a54,#061f35 70%); box-shadow:0 18px 60px rgba(0,0,0,.65),inset 0 0 0 2px rgba(255,255,255,.06); }
.sandboxPanel > header { min-height:66px; display:flex; align-items:center; justify-content:space-between; gap:14px; box-sizing:border-box; padding:10px 14px; border-bottom:1px solid rgba(126,222,246,.28); background:rgba(6,29,47,.72); }
.sandboxPanel header span, .sandboxConfirmPanel > span { display:block; color:#7ee8ff; font-size:11px; font-weight:800; letter-spacing:1.2px; }
.sandboxPanel h2 { margin:2px 0 0; font-size:23px; line-height:1.05; }
.sandboxPanel h3 { margin:0 0 9px; font-size:17px; }
.sandboxPanel p { margin:5px 0 10px; color:#b7ceda; font-size:13px; line-height:1.3; }
.sandboxScroll { max-height:492px; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:12px; }
.sandboxCard { margin:0 0 11px; padding:12px; border:1px solid rgba(103,197,222,.28); border-radius:12px; background:rgba(0,17,30,.44); }
.sandboxCard > button { margin:5px 7px 0 0; }
.sandboxCard label { display:grid; gap:6px; margin:10px 0; color:#dff5fb; font-size:14px; font-weight:700; }
.sandboxCard label > span { display:flex; justify-content:space-between; }
.sandboxCard input[type="range"] { width:100%; height:32px; accent-color:#44c9ed; }
.sandboxCard input[type="number"], .sandboxCard select, .sandboxStatsFields input { min-height:44px; box-sizing:border-box; border:1px solid #397e99; border-radius:8px; background:#061a2b; color:#fff; padding:7px 10px; font-size:17px; }
.sandboxSwitch { grid-template-columns:auto 1fr; align-items:center; }
.sandboxSwitch input { width:25px; height:25px; accent-color:#36c5e8; }
.sandboxChoiceGrid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.sandboxChoiceGrid button { padding-inline:5px; }
#sandboxActivePlayer { margin-bottom:8px; color:#8ceaff; font-size:16px; font-weight:800; }
.sandboxPlayerRow, .sandboxForceRow { min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:8px; box-sizing:border-box; margin:5px 0; padding:5px 6px 5px 10px; border-radius:8px; background:rgba(87,158,183,.13); }
.sandboxPlayerRow.active { box-shadow:inset 3px 0 #55dcf4; }
.sandboxPlayerRow button, .sandboxForceRow button { min-width:88px; }
.sandboxPlayerActions { display:flex; align-items:center; gap:7px; }
.sandboxPlayerActions button { margin:0; }
#sandboxActiveForces.empty { padding:12px 3px 3px; color:#8fa9b5; }
.sandboxResetCard { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.sandboxResetCard h3 { width:100%; }
.sandboxPlacementHint { position:absolute; left:50%; top:15px; transform:translateX(-50%); z-index:50; min-width:350px; min-height:54px; box-sizing:border-box; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:11px; padding:7px 8px 7px 15px; border:2px solid #78e8ff; border-radius:12px; background:rgba(5,31,49,.95); pointer-events:auto; box-shadow:0 9px 30px rgba(0,0,0,.55); }
.sandboxPlacementHint strong { font-size:16px; }
.sandboxPlacementHint span { color:#c8e3ec; font-size:13px; }
.sandboxPickerPanel { width:660px; }
.sandboxMobileGrid { height:400px; box-sizing:border-box; display:grid; grid-template-columns:repeat(5,1fr); gap:8px; overflow-y:auto; overscroll-behavior:contain; padding:12px; -webkit-overflow-scrolling:touch; }
.sandboxMobileGrid button { min-height:108px !important; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; padding:4px !important; }
.sandboxMobileGrid canvas { width:92px; height:70px; pointer-events:none; }
.sandboxMobileGrid strong { font-size:12px; line-height:1.05; }
.sandboxPickerPanel > footer, .sandboxStatsPanel > footer, .sandboxConfirmPanel > footer { min-height:64px; display:flex; align-items:center; justify-content:flex-end; gap:9px; box-sizing:border-box; padding:9px 14px; border-top:1px solid rgba(126,222,246,.25); }
#sandboxMobileMessage { margin-right:auto; color:#ffd784; font-size:13px; }
.sandboxStatsPanel { display:flex; flex-direction:column; width:510px; height:560px; }
.sandboxStatsPanel > header, .sandboxStatsPanel > footer { flex:0 0 auto; }
.sandboxStatsFields { flex:1 1 auto; min-height:0; display:grid; grid-template-columns:1fr 1fr; grid-auto-rows:max-content; align-content:start; gap:10px 14px; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; padding:15px; }
.sandboxStatsFields label { display:grid; gap:5px; font-size:13px; font-weight:700; }
.sandboxConfirmPanel { width:430px; padding:18px; }
.sandboxConfirmPanel h2 { margin:5px 0 8px; }
.sandboxConfirmPanel p { min-height:42px; }
.sandboxConfirmPanel > footer { margin:12px -18px -18px; }
.sandboxModelChoices { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:8px 0; }
.sandboxModelChoices button { min-width:0; margin:0 !important; padding-inline:6px !important; }
.sandboxModelChoices button[data-model="ofboundpc"] { grid-column:1 / -1; }
.sandboxModelCard #sandboxModelStatus { min-height:34px; margin:8px 0; }
#sandboxOpenAdvanced { width:100%; margin:2px 0 0 !important; }
.sandboxAdvancedPanel { display:flex; flex-direction:column; width:650px; height:560px; }
.sandboxAdvancedPanel > header, .sandboxAdvancedPanel > footer { flex:0 0 auto; }
.sandboxAdvancedPanel > footer { min-height:64px; display:flex; align-items:center; justify-content:flex-end; gap:9px; box-sizing:border-box; padding:9px 14px; border-top:1px solid rgba(126,222,246,.25); }
.sandboxAdvancedScroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y; padding:12px; }
.sandboxAdvancedSummary, .sandboxAdvancedTelemetry { box-sizing:border-box; margin:0 0 11px; padding:12px; border:1px solid rgba(103,197,222,.32); border-radius:12px; background:rgba(0,17,30,.52); }
.sandboxAdvancedSummary { display:grid; grid-template-columns:1fr auto; gap:5px 12px; }
.sandboxAdvancedSummary strong { color:#e7fbff; font-size:18px; }
.sandboxAdvancedSummary > span { align-self:start; border:1px solid #4d879c; border-radius:999px; padding:3px 8px; color:#a8c2ce; font-size:10px; font-weight:900; letter-spacing:.7px; }
.sandboxAdvancedSummary > span.modified { border-color:#ffbe61; color:#ffda92; }
.sandboxAdvancedSummary p { grid-column:1 / -1; margin:2px 0 0; }
.sandboxAdvancedGroup { margin:0 0 10px; border:1px solid rgba(103,197,222,.28); border-radius:12px; background:rgba(0,17,30,.44); overflow:hidden; }
.sandboxAdvancedGroup[hidden] { display:none; }
.sandboxAdvancedGroup > summary { min-height:48px; box-sizing:border-box; display:flex; align-items:center; padding:8px 13px; color:#e8fbff; font-size:17px; font-weight:900; cursor:pointer; list-style:none; touch-action:manipulation; }
.sandboxAdvancedGroup > summary::-webkit-details-marker { display:none; }
.sandboxAdvancedGroup > summary::after { content:"+"; margin-left:auto; color:#6fe7ff; font-size:24px; }
.sandboxAdvancedGroup[open] > summary::after { content:"−"; }
.sandboxAdvancedGroup > p { margin:0; padding:0 13px 9px; }
.sandboxAdvancedFields { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding:0 10px 11px; }
.sandboxAdvancedField { position:relative; display:grid; grid-template-columns:1fr 112px; gap:6px 10px; box-sizing:border-box; min-height:164px; padding:10px; border:1px solid rgba(94,180,205,.23); border-radius:9px; background:rgba(5,29,45,.72); }
.sandboxAdvancedField[data-field-scope="mobile"]::before { content:attr(data-mobile-name); position:absolute; right:8px; top:5px; max-width:95px; overflow:hidden; color:#70cde4; font-size:9px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.sandboxAdvancedFieldHeading { align-self:center; display:grid; gap:2px; padding-top:5px; }
.sandboxAdvancedFieldHeading strong { font-size:13px; line-height:1.1; }
.sandboxAdvancedFieldHeading small { color:#73d9f1; font-size:10px; }
.sandboxAdvancedField input[type="number"] { align-self:center; width:112px; min-height:44px; box-sizing:border-box; border:1px solid #397e99; border-radius:8px; background:#061a2b; color:#fff; padding:7px 8px; font-size:16px; font-weight:800; text-align:right; }
.sandboxAdvancedFieldSlider { grid-column:1 / -1; min-width:0; min-height:44px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px; }
.sandboxAdvancedFieldSlider input[type="range"] { width:100%; min-width:0; min-height:44px; height:44px; margin:0; padding:0; border:0; background:transparent; accent-color:#4ad3ef; touch-action:pan-x; }
.sandboxAdvancedFieldBound { color:#7fcde0; font-size:9px; font-weight:900; letter-spacing:.3px; white-space:nowrap; }
.sandboxAdvancedField p { grid-column:1 / -1; margin:0; color:#a9c4d0; font-size:11px; line-height:1.25; }
.sandboxAdvancedTelemetry h3 { margin:0 0 7px; font-size:17px; }
.sandboxAdvancedTelemetry p { margin:0; }
.sandboxAdvancedTelemetry pre { margin:0; color:#dff8ff; font:700 12px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
#sandboxAdvancedMessage { flex:1 1 auto; color:#ffe099; font-size:12px; }

body.sandbox-active #gameChatLog,
body.sandbox-active #gameChatComposer,
body.sandbox-active #turn_timer,
body.sandbox-active #turns_list,
body.sandbox-active #btnPass,
body.sandbox-active #battleItems,
body.sandbox-active #uiGoldReadout,
body.sandbox-active #battleModePanel { display:none !important; }
body.sandbox-active #gameChatButton { display:block !important; min-width:70px; min-height:44px; background:linear-gradient(#2ac5e5,#126c94); color:#fff; font-size:15px; font-weight:900; border:2px solid #b8f5ff; border-radius:10px; }
body.sandbox-active #stage { background:#04131f; }

body.sandbox-create-mode #lobbySideActions,
body.sandbox-create-mode #lobbyTopBar,
body.sandbox-create-mode #lobbyHeaderActions,
body.sandbox-create-mode #lobbyMainPanel,
body.sandbox-create-mode #lobbyChatPanel { visibility:hidden; }
body.sandbox-create-mode #lobbyShell { background:linear-gradient(145deg,#082f48,#031827); }
body.sandbox-create-mode #createRoomTitleField,
body.sandbox-create-mode #CreateRoomTraining,
body.sandbox-create-mode #createRoomSizeSelector,
body.sandbox-create-mode #createRoomModeSelector,
body.sandbox-create-mode #createClassicOptions { display:none !important; }
body.sandbox-create-mode #dialogCreateRoom { min-height:390px; }
body.sandbox-create-mode #CreateRoomModeIcon { margin:18px auto 8px; }

.device-phone #sandboxUI button { min-height:72px; border-radius:12px; padding:10px 18px; font-size:19px; }
.device-phone .sandboxPowerJog { left:calc(50% - 183px); bottom:104px; width:460px; height:72px; border-radius:36px; }
.device-phone .sandboxPowerJogRail { left:27px; right:27px; height:11px; }
.device-phone .sandboxPowerJogRail::after { top:-8px; height:25px; width:3px; }
.device-phone #sandboxUI #sandboxPowerJogKnob { width:72px; height:72px; min-width:72px; min-height:72px; border-width:3px; padding:0; }
.device-phone #sandboxUI #sandboxPowerJogKnob::after { width:22px; height:7px; border-left-width:5px; border-right-width:5px; }
.device-phone .sandboxPanel { width:720px; max-height:576px; border-radius:20px; }
.device-phone .sandboxPanel > header { min-height:84px; padding:10px 18px; }
.device-phone .sandboxPanel h2 { font-size:30px; }
.device-phone .sandboxPanel header span, .device-phone .sandboxConfirmPanel > span { font-size:14px; }
.device-phone .sandboxScroll { max-height:492px; padding:14px; }
.device-phone .sandboxCard { padding:15px; margin-bottom:13px; }
.device-phone .sandboxCard h3 { font-size:23px; }
.device-phone .sandboxCard p, .device-phone .sandboxCard label { font-size:18px; }
.device-phone .sandboxCard input[type="number"], .device-phone .sandboxCard select, .device-phone .sandboxStatsFields input { min-height:72px; font-size:22px; }
.device-phone .sandboxPlayerRow, .device-phone .sandboxForceRow { min-height:72px; font-size:19px; }
.device-phone #sandboxActivePlayer { font-size:22px; }
.device-phone .sandboxPlacementHint { top:14px; min-width:620px; min-height:72px; }
.device-phone .sandboxPlacementHint strong { font-size:21px; }
.device-phone .sandboxPlacementHint span { font-size:17px; }
.device-phone .sandboxPickerPanel { width:900px; }
.device-phone .sandboxMobileGrid { height:410px; grid-template-columns:repeat(6,1fr); gap:10px; }
.device-phone .sandboxMobileGrid button { min-height:124px !important; padding:4px !important; font-size:16px; }
.device-phone .sandboxMobileGrid strong { font-size:16px; }
.device-phone .sandboxPickerPanel > footer, .device-phone .sandboxStatsPanel > footer { min-height:82px; }
.device-phone .sandboxStatsPanel { width:700px; height:576px; }
.device-phone .sandboxStatsFields { gap:12px 18px; padding:18px; }
.device-phone .sandboxStatsFields label { font-size:18px; }
.device-phone .sandboxConfirmPanel { width:620px; }
.device-phone .sandboxConfirmPanel p { font-size:18px; }
.device-phone .sandboxModelChoices { gap:12px; }
.device-phone .sandboxModelCard #sandboxModelStatus { min-height:48px; }
.device-phone .sandboxAdvancedPanel { width:900px; height:576px; }
.device-phone .sandboxAdvancedPanel > footer { min-height:82px; padding:8px 18px; }
.device-phone .sandboxAdvancedScroll { padding:14px; }
.device-phone .sandboxAdvancedSummary, .device-phone .sandboxAdvancedTelemetry { padding:15px; margin-bottom:13px; }
.device-phone .sandboxAdvancedSummary strong { font-size:24px; }
.device-phone .sandboxAdvancedSummary > span { padding:5px 11px; font-size:13px; }
.device-phone .sandboxAdvancedSummary p, .device-phone .sandboxAdvancedGroup > p { font-size:17px; }
.device-phone .sandboxAdvancedGroup { margin-bottom:13px; border-radius:15px; }
.device-phone .sandboxAdvancedGroup > summary { min-height:72px; padding:10px 17px; font-size:23px; }
.device-phone .sandboxAdvancedGroup > summary::after { font-size:31px; }
.device-phone .sandboxAdvancedGroup > p { padding:0 17px 12px; }
.device-phone .sandboxAdvancedFields { gap:12px; padding:0 13px 14px; }
.device-phone .sandboxAdvancedField { grid-template-columns:1fr 160px; min-height:232px; padding:14px; gap:8px 13px; border-radius:12px; }
.device-phone .sandboxAdvancedField[data-field-scope="mobile"]::before { right:11px; top:7px; max-width:140px; font-size:12px; }
.device-phone .sandboxAdvancedFieldHeading strong { font-size:18px; }
.device-phone .sandboxAdvancedFieldHeading small { font-size:14px; }
.device-phone .sandboxAdvancedField input[type="number"] { width:160px; min-height:72px; padding:9px 12px; font-size:22px; }
.device-phone .sandboxAdvancedFieldSlider { min-height:72px; gap:12px; }
.device-phone .sandboxAdvancedFieldSlider input[type="range"] { min-height:72px; height:72px; }
.device-phone .sandboxAdvancedFieldBound { font-size:13px; letter-spacing:.4px; }
.device-phone .sandboxAdvancedField p { font-size:15px; }
.device-phone .sandboxAdvancedTelemetry h3 { font-size:23px; }
.device-phone .sandboxAdvancedTelemetry pre { font-size:16px; }
.device-phone #sandboxAdvancedMessage { font-size:16px; }
.device-phone body.sandbox-active #gameChatButton { min-width:100px; min-height:68px; font-size:21px; }