/* Shared palette with Website/public/assets/styles.css: midnight / frost / aged brass. */
#touch-controls,#touch-editor{
  --touch-night:#0b131d;--touch-panel:#111e2a;--touch-text:#e9e9df;--touch-muted:#afbbc6;
  --touch-gold:#c6ac7b;--touch-gold-light:#e0c796;--touch-line:rgba(174,153,112,.3);
  color:var(--touch-text);font-family:"Lato","Segoe UI",Arial,sans-serif;
}
#touch-controls{display:none;position:fixed;inset:0;z-index:5;pointer-events:none;user-select:none;--stick-size:128px;--stick-opacity:.6}
.mobile #touch-controls{display:block}
#touch-controls button,#touch-editor button{
  min-height:44px;min-width:44px;padding:8px 12px;color:var(--touch-text);
  background:rgba(13,24,35,.94);border:1px solid #7d7766;border-radius:4px;
  touch-action:manipulation;box-shadow:inset 0 0 0 2px #080f1733,0 2px 8px #0005;
  -webkit-tap-highlight-color:transparent;
}
#touch-controls button.active{background:#233f54;border-color:var(--touch-gold-light);box-shadow:inset 0 0 0 2px #c6ac7b1a,0 2px 8px #0005}
#touch-controls button:active,#touch-editor button:active{background:#294358;border-color:var(--touch-gold-light)}
#touch-controls button:focus-visible,#touch-controls select:focus-visible,#touch-controls summary:focus-visible,#touch-editor :focus-visible{outline:2px solid var(--touch-gold-light);outline-offset:2px}
#touch-controls button:disabled{opacity:.5}
#touch-controls [hidden],#touch-editor[hidden]{display:none!important}
#touch-tools{position:absolute;top:max(8px,env(safe-area-inset-top));right:max(8px,env(safe-area-inset-right));display:flex;gap:6px;pointer-events:auto}
#touch-fullscreen{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(8px,env(safe-area-inset-left));pointer-events:auto}
#touch-fullscreen svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
#touch-window-tools{position:absolute;left:max(8px,env(safe-area-inset-left));top:calc(max(8px,env(safe-area-inset-top)) + 50px);display:flex;gap:6px;pointer-events:auto}
#touch-window-tools button{font-size:13px}
#touch-stick{position:absolute;left:max(16px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));width:var(--stick-size);aspect-ratio:1;border:2px solid var(--touch-gold);border-radius:50%;background:var(--touch-panel);opacity:var(--stick-opacity);pointer-events:auto;touch-action:none}
#touch-stick::before{content:"";position:absolute;inset:12.5%;border:1px dashed #afbbc6;border-radius:50%}
#touch-stick::after{content:"";position:absolute;inset:30%;border:1px dotted #afbbc6;border-radius:50%;pointer-events:none}
#touch-handle{position:absolute;left:50%;top:50%;width:38%;height:38%;margin:-19%;border-radius:50%;background:linear-gradient(135deg,#dce5ea,#9baebe);border:1px solid var(--touch-gold);box-shadow:0 2px 8px #0008;pointer-events:none}
#touch-actions{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:auto}
#touch-actions #touch-targets{min-width:88px;min-height:56px;font-weight:600;border-color:var(--touch-gold);background:rgba(19,37,52,.96)}
#touch-actions #touch-targets.active{background:#294358;border-color:var(--touch-gold-light)}
#touch-actions #touch-war{min-width:60px}
#touch-actions #touch-war.active{background:linear-gradient(110deg,#603032,#402427);border-color:#987753;color:#e6d4b2}
.stick-right #touch-stick{left:auto;right:max(16px,env(safe-area-inset-right))}
.stick-right #touch-actions{right:auto;left:max(16px,env(safe-area-inset-left));align-items:flex-start}
body:not(.in-game) .world-control{display:none!important}
#touch-hint{position:absolute;left:50%;top:calc(max(8px,env(safe-area-inset-top)) + 100px);transform:translateX(-50%);max-width:calc(100% - 24px);width:max-content;padding:10px 12px;background:var(--touch-panel);border:1px solid var(--touch-line);border-radius:4px;text-align:center;font-size:13px;line-height:1.45;box-shadow:0 3px 16px #0006}
#touch-hint:empty{display:none}
.hud-open #touch-tools,.hud-open #touch-fullscreen,.hud-open #touch-window-tools,.hud-open #touch-stick,.hud-open #touch-actions{visibility:hidden}
#touch-panel{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;background:rgba(3,8,14,.7);pointer-events:auto}
#touch-sheet{width:min(420px,100%);max-height:calc(100dvh - max(8px,env(safe-area-inset-top)));overflow:auto;overscroll-behavior:contain;touch-action:pan-y;outline:none;padding:12px max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border:1px solid var(--touch-line);border-bottom:0;border-radius:6px 6px 0 0;background:linear-gradient(130deg,#132534,#0b1722);box-shadow:0 -8px 32px #0006}
.sheet-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;position:sticky;top:-12px;background:#132534;z-index:1;padding:4px 0 10px;margin-bottom:12px;border-bottom:1px solid var(--touch-line)}
.sheet-heading h2{margin:0;font-family:"EB Garamond",Georgia,"Times New Roman",serif;font-size:26px;font-weight:400;line-height:1.2}
#touch-panel-close{font-size:24px;line-height:1;padding:4px}
.touch-menu-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin:4px 0 12px}
.touch-menu-grid button{text-align:left;font-size:14px;line-height:1.4;overflow-wrap:anywhere}
#touch-preferences{border-top:1px solid var(--touch-line);padding:10px 0}
#touch-preferences summary{min-height:44px;cursor:pointer;padding:10px 0;color:var(--touch-gold-light)}
#touch-preferences label{display:block;margin:12px 0;font-size:14px}
#touch-preferences output{float:right;color:var(--touch-gold-light)}
#touch-preferences input{width:100%;min-height:32px;margin:4px 0 0;accent-color:var(--touch-gold);touch-action:pan-x}
#touch-controls select{display:block;width:100%;min-height:44px;background:var(--touch-night);color:var(--touch-text);border:1px solid #7d7766;border-radius:4px;font:inherit;padding:8px;margin-top:8px;color-scheme:dark}
.touch-note{font-size:13px;line-height:1.5;color:var(--touch-muted);margin:8px 0 12px}
.touch-menu-footer{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border-top:1px solid var(--touch-line);padding-top:14px;margin-top:16px;font-size:14px}
.touch-menu-footer #touch-language{width:auto;min-width:112px;margin:0}
.touch-menu-footer #touch-logout{grid-column:1/-1;width:100%;text-align:left;color:var(--touch-gold-light)}
#touch-logout-content .touch-note{font-size:15px;margin:8px 0 20px}
#touch-controls #touch-logout-confirm{background:linear-gradient(110deg,#603032,#402427);border-color:#987753;color:#e6d4b2;text-align:center}
#touch-logout-cancel{text-align:center}
#touch-editor{position:fixed;z-index:12;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:calc(var(--keyboard-bottom,0px) + max(8px,env(safe-area-inset-bottom)));max-height:var(--keyboard-height,100dvh);overflow:auto;overscroll-behavior:contain;background:var(--touch-panel);border:1px solid var(--touch-line);border-radius:4px;display:flex;flex-wrap:wrap;align-items:center;padding:6px;gap:6px}
#touch-editor label{flex:1;min-width:160px}
#touch-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#touch-text,#touch-multiline{display:block;width:100%;font:16px "Segoe UI",Arial,sans-serif;padding:10px;border:1px solid #7d7766;border-radius:4px;background:var(--touch-night);color:var(--touch-text);caret-color:var(--touch-gold-light)}
#touch-editor input[hidden],#touch-editor textarea[hidden]{display:none}
#touch-editor button{padding:10px}
#touch-editor #touch-submit{color:#171b20;border-color:#c7b182;background:linear-gradient(120deg,#d8c191,#b69b67)}
#touch-text-error{flex-basis:100%;font-size:14px;color:#f5bcad;margin:0}
#touch-text-error:empty{display:none}
