/* Compact control console: stable geometry from ready through pause/result. */
.login-page .mission-panel{--mission-control-height:156px;grid-template-rows:auto minmax(0,1fr) var(--mission-control-height) 48px;transition:grid-template-rows .36s cubic-bezier(.4,0,.2,1)}
.login-page .mission-panel.keypad-hidden{--mission-control-height:0px}
.login-page .mission-panel .mission-keypad{grid-row:3;overflow:hidden;opacity:1;transform:translateY(0);transition:opacity .2s ease,transform .36s cubic-bezier(.4,0,.2,1)}
.login-page .mission-panel.keypad-hidden .mission-keypad{opacity:0;transform:translateY(8px);pointer-events:none}
.mission-keypad>*{flex-shrink:0}
.login-page .mission-panel .mission-footer{grid-row:4;min-height:48px;padding-top:4px;gap:8px}
.login-page #mission-keypad-toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:0;padding:7px 8px;border:1px solid #a8b79c88;border-radius:9px;background:#fff9;color:#48634f;font-size:12px;font-weight:600;letter-spacing:0;white-space:nowrap}
.login-page #mission-keypad-toggle svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.login-page #mission-keypad-toggle[aria-expanded=false]{background:#dfede1;border-color:#8eaf96;color:#2e6546}
.login-page #mission-keypad-toggle:hover{background:#f8fbf4}
.login-page #mission-keypad-toggle:focus-visible{outline:3px solid #e2a22a;outline-offset:2px}
.mission-icon-library{position:absolute;overflow:hidden;pointer-events:none}
.login-page .mission-panel .mission-keypad{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;box-sizing:border-box;height:100%;min-height:0;margin:0;padding:8px 0 3px;gap:5px}
.mission-keypad-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.mission-keypad-heading{min-width:0;color:#355349;flex:1}
.mission-keypad-heading>strong{display:flex;align-items:center;gap:6px;font-size:11px;line-height:1.3;letter-spacing:.8px;white-space:nowrap}
.mission-keypad-heading>strong>i{width:6px;height:6px;border-radius:50%;background:#9cae9b;flex:none}
.mission-keypad-heading>strong>span{font-size:10px;letter-spacing:0;font-weight:600;color:#5e7563;padding:2px 6px;border-radius:20px;background:#f5f8f1;border:1px solid #c9d6c4}
.login-page .mission-keypad .mission-instructions{display:block;width:auto;min-height:14px;min-width:0;margin-top:4px;color:#687b69;font-size:11px;line-height:1.35;flex:none}
.mission-keypad[data-state=running] .mission-keypad-heading>strong>i{background:#439674;box-shadow:0 0 0 3px #43967415}
.mission-keypad[data-state=paused] .mission-keypad-heading>strong>i{background:#cb983b}
.mission-keypad.is-warning .mission-instructions{color:#a06d25;font-weight:650}
.mission-keypad-utilities{display:flex;gap:5px;flex:none}
.login-page .mission-keypad .mission-utility{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #b6c6b4;border-radius:10px;min-width:72px;min-height:48px;height:48px;padding:7px 10px;background:#f3f6ef;color:#4e6757;font-size:11px;font-weight:600;cursor:pointer;box-shadow:0 2px 4px #3c584306}
.mission-control-icon{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mission-utility .mission-control-icon{width:18px;height:18px}
.mission-utility .mission-icon-on{display:none}
.mission-utility[data-sound=on] .mission-icon-on,.mission-utility[data-paused=true] .mission-icon-on{display:block}
.mission-utility[data-sound=on] .mission-icon-off,.mission-utility[data-paused=true] .mission-icon-off{display:none}
.login-page .mission-keypad .mission-utility[aria-pressed=true]{background:#dcece0;border-color:#7eaa91;color:#32694b}
.login-page .mission-keypad .mission-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;gap:12px;align-items:stretch;flex-direction:row;flex-wrap:nowrap}
.mission-keypad-group{min-width:0}
.mission-keypad-group-label{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:5px;font-size:10px;font-weight:700;line-height:1.2;letter-spacing:1px;color:#647a67}
.mission-keypad-group-label small{font-size:9px;letter-spacing:0;font-weight:500;color:#81917c}
.login-page .mission-keypad .mission-control-primary,.login-page .mission-keypad .mission-control-combat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;align-items:stretch}
.login-page .mission-keypad .mission-actions .mission-keypad-key{--key-color:#3d654f;--key-border:#afc5ac;--key-bg:#f5f8ef;--key-active:#426f59;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;width:100%;height:72px;min-height:48px;margin:0;padding:6px 4px 7px;border:1px solid var(--key-border);border-radius:11px;background:var(--key-bg);color:var(--key-color);box-shadow:0 3px 0 #cad5c575,0 4px 9px #36544308;line-height:1;white-space:nowrap;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer;transition:background .12s,border-color .12s,box-shadow .12s,transform .12s}
.login-page .mission-keypad .mission-keypad-key>strong{display:flex;align-items:center;justify-content:center;gap:4px;margin:0;font-size:14px;font-weight:700;line-height:1.15}
.mission-keypad-meta{display:flex;align-items:center;justify-content:center;gap:4px;max-width:100%;min-height:12px}
.mission-keypad-meta small{font-size:10px;font-weight:500;line-height:1.15;font-variant-numeric:tabular-nums;color:inherit;opacity:.85}
.mission-keypad-meta kbd{display:inline-block;background:#ffffff85;color:inherit;box-shadow:0 1px 0 #35523d25;border:1px solid currentColor;border-color:color-mix(in srgb,currentColor 20%,transparent);border-radius:4px;padding:1px 3px;font:600 9px/1.1 system-ui;letter-spacing:.2px}
.login-page .mission-keypad #mission-shoot{--key-color:#fff;--key-border:#286d98;--key-bg:linear-gradient(155deg,#348ab5,#24638c);--key-active:#174c73}
.login-page .mission-keypad #mission-shoot kbd{background:#ffffff20;border-color:#ffffff45}
.login-page .mission-keypad #mission-missile{--key-color:#805c23;--key-border:#d5bb83;--key-bg:#fbf1d8;--key-active:#a87829}
.login-page .mission-keypad #mission-guard{--key-color:#256f6b;--key-border:#94c6bb;--key-bg:#e2f2eb;--key-active:#2a837c}
.login-page .mission-keypad #mission-jump{--key-color:#5c4c20;--key-border:#deb550;--key-bg:#f6ca66;--key-active:#b98a2e}
.mission-ammo-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border-radius:50%;padding:0 3px;background:#e7d3a0;font-size:11px;font-variant-numeric:tabular-nums;color:#6e501e}
.login-page .mission-keypad .mission-keypad-key[aria-pressed=true]{background:var(--key-active)!important;color:white!important;border-color:var(--key-active);transform:translateY(1px);box-shadow:0 1px 0 #243d3120,0 0 0 2px #ffffff99}
.login-page .mission-keypad .mission-keypad-key:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #243d3120}
.login-page .mission-keypad button:disabled{opacity:.68;cursor:default;box-shadow:0 1px 0 #cad5c560}
.login-page .mission-keypad[data-state=paused] .mission-keypad-key:disabled{opacity:.8}
.login-page .mission-keypad button:focus-visible{outline:3px solid #e2a22a;outline-offset:3px;z-index:1}
.mission-keypad-meter{position:absolute;bottom:0;left:7px;width:calc(100% - 14px);height:3px;margin:0;border:0;border-radius:5px;overflow:hidden;accent-color:var(--key-color);pointer-events:none}
.mission-keypad-meter::-webkit-progress-bar{background:#345c4f12}.mission-keypad-meter::-webkit-progress-value{background:currentColor}
.login-page .mission-keypad .mission-keypad-key.is-empty{--key-color:#94695a;--key-bg:#f3e9e1;--key-border:#d6bdad}
@media(hover:hover){.login-page .mission-keypad .mission-keypad-key:hover:not(:disabled){border-color:var(--key-color);box-shadow:0 3px 0 #cad5c575,0 0 0 2px #ffffffaa}.login-page .mission-keypad .mission-utility:hover:not(:disabled){background:#fff}}
@media(max-width:991px){.login-page .mission-panel{grid-template-rows:auto minmax(0,1fr) var(--mission-control-height) 48px}}
@media(max-width:600px){
    .login-page .mission-panel{--mission-control-height:240px}
    .login-page .mission-panel .mission-keypad{padding-top:8px;gap:6px}
    .login-page .mission-keypad .mission-actions{grid-template-columns:minmax(0,1fr);gap:8px}
    .login-page .mission-keypad .mission-actions .mission-keypad-key{height:66px;gap:3px;padding-top:4px;padding-bottom:6px}
    .mission-keypad-group-label{margin-bottom:5px;font-size:10px}.mission-keypad-group-label small{font-size:9px}
    .mission-keypad-heading>strong{font-size:10px;letter-spacing:.6px;gap:5px}.mission-keypad-heading>strong>span{font-size:9px;padding:2px 5px}
    .login-page .mission-keypad .mission-instructions{font-size:10px;line-height:1.3}
    .login-page .mission-keypad .mission-utility{min-width:54px;width:54px;padding:5px;font-size:9px;flex-direction:column;gap:3px}
    .mission-keypad-top{gap:8px}.mission-keypad-utilities{gap:4px}
    .mission-keypad .mission-control-icon{width:20px;height:20px}.mission-utility .mission-control-icon{width:17px;height:17px}
}
@media(max-height:650px) and (max-width:600px){
    .login-page .mission-panel{--mission-control-height:172px}
    .login-page .mission-panel .mission-keypad{padding-top:6px;gap:4px}
    .mission-keypad-group-label{display:none}
    .login-page .mission-keypad .mission-actions{gap:6px}
    .login-page .mission-keypad .mission-actions .mission-keypad-key{height:50px;display:grid;grid-template-columns:17px minmax(0,1fr);grid-template-rows:18px 16px;gap:1px 3px;padding:6px}
    .mission-keypad-key>.mission-control-icon{grid-row:1;width:17px;height:17px}
    .mission-keypad-key>.mission-keypad-meta{grid-column:1/-1;gap:3px}
    .login-page .mission-keypad .mission-keypad-key>strong{font-size:12px}.mission-keypad-meta small{font-size:9px}.mission-keypad-meta kbd{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.login-page .mission-keypad button,.login-page .mission-panel,.login-page .mission-panel .mission-keypad{transition:none}}
