
/* FIREFLY ARCADE library and focused game window */
.arcade-library{margin:1.25rem 0 2rem;padding:1rem;border:1px solid var(--line,#285a49);border-radius:24px;background:linear-gradient(145deg,rgba(22,37,34,.98),rgba(23,24,39,.98));}
.arcade-library-top{display:flex;align-items:end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.arcade-library-top h3{margin:.25rem 0}
.arcade-search-label{display:grid;gap:.35rem;min-width:min(100%,220px);font-size:.82rem;color:var(--muted,#a6b9b0)}
.arcade-search-label input{width:100%;min-height:44px;padding:.65rem .8rem;border:1px solid var(--line,#285a49);border-radius:12px;background:#171d20;color:var(--text,#eef8f1)}
.arcade-categories{display:flex;gap:.5rem;overflow-x:auto;padding:.25rem 0 .85rem;scrollbar-width:thin}
.arcade-categories button{flex:0 0 auto;border:1px solid var(--line,#285a49);border-radius:999px;padding:.65rem .9rem;background:#20252a;color:var(--text,#eef8f1);font-weight:650}
.arcade-categories button.active{background:linear-gradient(110deg,#65d49b,#42d9c0);border-color:transparent;color:#09221b}
.arcade-game-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.arcade-game-card{display:flex;align-items:center;gap:.8rem;min-width:0;text-align:left;padding:1rem;border:1px solid rgba(89,151,125,.42);border-radius:18px;background:linear-gradient(145deg,#242832,#1b2028);color:#eef8f1;cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
.arcade-game-card:hover,.arcade-game-card:focus-visible{border-color:#63dfbb;box-shadow:0 0 0 2px rgba(99,223,187,.14);transform:translateY(-2px);outline:none}
.arcade-game-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;background:linear-gradient(145deg,rgba(102,91,195,.3),rgba(65,206,177,.16));font-size:1.65rem}
.arcade-game-card-copy{display:grid;gap:.25rem;min-width:0}
.arcade-game-card-copy strong{font-size:1rem}
.arcade-game-card-copy small{color:#aab4b3;line-height:1.35}
.arcade-game-card-copy em{font-style:normal;color:#70dfc0;font-size:.72rem;letter-spacing:.04em}
.arcade-game-arrow{margin-left:auto;color:#7be2c7;font-size:1.3rem}
.arcade-game-modal[hidden]{display:none!important}
.arcade-game-modal{position:fixed;z-index:10050;inset:0;background:rgba(3,8,11,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:stretch;justify-content:center;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.arcade-game-dialog{width:min(100%,980px);height:100%;max-height:100dvh;display:flex;flex-direction:column;background:#0b1513;border-left:1px solid rgba(82,167,129,.45);border-right:1px solid rgba(82,167,129,.45);overflow:hidden}
.arcade-modal-header{position:relative;z-index:2;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;background:rgba(9,22,18,.98);border-bottom:1px solid rgba(82,167,129,.35)}
.arcade-modal-header h3{margin:.2rem 0 0;font-size:1.2rem}
.arcade-close{flex:0 0 auto;min-height:42px;padding:.55rem .8rem;border:1px solid #398365;border-radius:12px;background:#202b29;color:#eaf8f0;font-weight:700}
.arcade-modal-body{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:1rem;touch-action:pan-y}
.arcade-modal-body>.arcade-game-content{display:none!important;margin:0 auto;max-width:900px}
.arcade-modal-body>.arcade-game-content.arcade-game-active{display:block!important}
body.arcade-modal-open{overflow:hidden!important;position:fixed;width:100%;overscroll-behavior:none}
@media(max-width:600px){.arcade-game-list{grid-template-columns:1fr}.arcade-library{padding:.8rem}.arcade-modal-body{padding:.65rem}.arcade-modal-header{padding:.7rem .8rem}.arcade-modal-header h3{font-size:1.05rem}.arcade-game-card{padding:.85rem}}
@media(min-width:760px){.arcade-game-list{grid-template-columns:repeat(3,minmax(0,1fr))}.arcade-game-modal{padding:1.5rem}.arcade-game-dialog{border-radius:22px;border:1px solid rgba(82,167,129,.5);height:calc(100dvh - 3rem)}}

/* BUILD 175: Arcade is a dedicated app view; favourites are the only dashboard entry point. */
.arcade-view{padding-bottom:2rem}
.arcade-game-entry{position:relative;min-width:0}
.arcade-game-entry .arcade-game-card{width:100%;min-height:104px;padding-right:3.2rem}
.arcade-favorite-toggle{position:absolute;z-index:1;right:.55rem;top:.55rem;width:38px;height:38px;border:1px solid rgba(235,207,115,.5);border-radius:12px;background:rgba(20,25,31,.94);color:#f0d477;font-size:1.55rem;line-height:1;cursor:pointer}
.arcade-favorite-toggle[aria-pressed="true"]{background:rgba(91,73,35,.45);color:#ffdc69}
.dashboard-arcade-favorites-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-top:.75rem}
.dashboard-arcade-favorite{display:flex;align-items:center;gap:.55rem;min-width:0;padding:.75rem;border:1px solid rgba(89,151,125,.45);border-radius:14px;background:#20272a;color:#eef8f1;text-align:left;font-weight:700;cursor:pointer}
.dashboard-arcade-favorite span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.dashboard-arcade-favorite-star{color:#f0d477}
@media(max-width:600px){.dashboard-arcade-favorites-list{grid-template-columns:1fr}}

/* BUILD 178 — new standalone arcade titles */
.arcade-canvas{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain;background:#080d1d;border:1px solid rgba(130,120,255,.45);border-radius:18px;touch-action:pan-y;}
.space-invaders-canvas{aspect-ratio:4/5;}
.galaxy-dash-canvas{aspect-ratio:18/25;}
.si-controls,.gd-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin:.8rem 0;}
.gd-controls{grid-template-columns:repeat(4,minmax(0,1fr));}
.si-controls button,.gd-controls button{min-height:52px;padding:.55rem .35rem;font-weight:800;touch-action:manipulation;}
.si-controls button:active,.gd-controls button:active{transform:scale(.97);filter:brightness(1.18);}
@media(max-width:420px){.gd-controls{grid-template-columns:repeat(2,minmax(0,1fr));}.arcade-canvas{max-height:66vh;}}

/* BUILD 179 — iPhone/mobile canvas fit and horizontal overflow repair */
.arcade-game-dialog,
.arcade-modal-body,
.arcade-modal-body > .arcade-game-content {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}
.arcade-modal-body { overflow-x: hidden; }
.arcade-modal-body > .arcade-game-content.arcade-game-active {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow: hidden;
}
.arcade-game-content .section-heading,
.arcade-game-content .game-hud,
.arcade-game-content .game-actions,
.arcade-game-content .si-controls,
.arcade-game-content .gd-controls { min-width: 0; max-width: 100%; }
.arcade-canvas {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: min(100%, 520px) !important;
  height: auto !important;
  max-height: min(64dvh, 680px) !important;
  margin: .75rem auto !important;
  object-fit: contain;
}
@media (max-width: 600px) {
  .arcade-game-dialog { width: 100vw; max-width: 100vw; }
  .arcade-modal-body { padding-left: 10px; padding-right: 10px; }
  .arcade-modal-body > .arcade-game-content.arcade-game-active { padding: 12px !important; }
  .arcade-canvas { max-width: 100% !important; max-height: 58dvh !important; }
}

/* BUILD 187 — Void Frontier mobile HUD and scene visibility repair */
.arcade-game-content.void-frontier { min-width:0; }
.arcade-game-content.void-frontier .vf-hud {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem;
}
.arcade-game-content.void-frontier .vf-hud>div { min-width:0; overflow:hidden; }
.arcade-game-content.void-frontier .vf-hud small {
  display:block; white-space:normal; overflow-wrap:anywhere; word-break:normal;
  line-height:1.25; min-height:2.5em; font-size:clamp(.62rem,2.2vw,.76rem);
}
.arcade-game-content.void-frontier .vf-hud strong,
.arcade-game-content.void-frontier .vf-hud span { overflow-wrap:anywhere; }
.arcade-game-content.void-frontier .vf-resources {
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem;
}
.arcade-game-content.void-frontier .vf-resources>div { min-width:0; overflow-wrap:anywhere; }
.arcade-game-content.void-frontier .vf-scene-wrap { min-height:190px; }
.arcade-game-content.void-frontier #vfScene {
  display:block; width:100%; height:auto; min-height:150px; aspect-ratio:760/390;
  background:linear-gradient(145deg,#0b1530,#111126);
}
.gd-hud,.si-hud { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.45rem; margin:.7rem 0; }
.gd-hud span,.si-hud span { padding:.55rem; border:1px solid rgba(89,151,125,.4); border-radius:10px; color:#b8c9c2; min-width:0; }
.gd-hud b,.si-hud b { display:block; color:#effff7; font-size:1.1rem; }
.gd-controls button,.si-controls button { border:1px solid rgba(89,151,125,.5); border-radius:12px; background:#20252a; color:#eef8f1; }
@media(max-width:600px) {
  .arcade-game-content.void-frontier .vf-hud { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .arcade-game-content.void-frontier .vf-resources { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gd-hud,.si-hud { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* BUILD 189 — Void Frontier live combat + galaxy expansion */
.void-frontier .vf-tabs { grid-template-columns:repeat(5,minmax(0,1fr)); }
.void-frontier .vf-live-combat-wrap { margin:1rem 0; padding:.8rem; border:1px solid rgba(112,151,255,.28); border-radius:16px; background:rgba(5,12,28,.72); }
.void-frontier .vf-live-combat-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem; margin-bottom:.65rem; color:#c7d8f3; font-size:.82rem; letter-spacing:.08em; }
.void-frontier #vfCombatCanvas { display:block; width:100%; height:auto; aspect-ratio:720/390; border:1px solid rgba(112,151,255,.3); border-radius:12px; background:#07142b; touch-action:none; }
.void-frontier .vf-combat-touch-controls { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:.8rem; margin-top:.7rem; }
.void-frontier .vf-dpad { display:grid; justify-items:center; gap:.3rem; }
.void-frontier .vf-dpad>div { display:flex; gap:.3rem; }
.void-frontier .vf-dpad button,.void-frontier .vf-combat-quick-actions button { min-width:48px; min-height:46px; border:1px solid rgba(112,151,255,.45); border-radius:12px; background:#202b42; color:#eff7ff; font-size:1.15rem; touch-action:none; }
.void-frontier .vf-combat-quick-actions { display:grid; gap:.45rem; }
.void-frontier .vf-combat-quick-actions button { width:100%; font-weight:700; }
.void-frontier .vf-world-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; margin:1rem 0; }
.void-frontier .vf-world-card { display:grid; grid-template-columns:auto minmax(0,1fr); gap:.55rem; align-items:start; padding:.8rem; border:1px solid var(--border,#315847); border-radius:14px; background:rgba(255,255,255,.035); }
.void-frontier .vf-world-card button { grid-column:1/-1; width:100%; }
.void-frontier .vf-world-icon { font-size:1.8rem; }
.void-frontier .vf-world-copy { min-width:0; }
.void-frontier .vf-world-copy p { color:var(--muted,#aaa); font-size:.84rem; }
@media(max-width:520px) {
 .void-frontier .vf-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .void-frontier .vf-combat-touch-controls { grid-template-columns:1fr; }
 .void-frontier .vf-world-grid { grid-template-columns:1fr; }
}

/* BUILD 194: visible feedback for delegated iOS combat controls */
.void-frontier .vf-input-status{min-height:1.4em;margin:.45rem 0 0;color:#7fe3bd;font-size:.85rem;font-weight:600}
.void-frontier .vf-dpad button{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

/* BUILD 195: visible ship in scanner preview and movement feedback */
.void-frontier .vf-input-status{font-variant-numeric:tabular-nums}

/* BUILD 196 — arcade input and settings */
#arcadePreferencesPanel select{width:100%;min-height:44px;margin:.25rem 0 .85rem;padding:.65rem .75rem;border:1px solid var(--line,#285a49);border-radius:12px;background:#171d20;color:var(--text,#eef8f1)}
#druggieCanvas{touch-action:none;user-select:none;-webkit-user-select:none}
#druggieLeft,#druggieRight,#vfMoveLeft,#vfMoveRight,#vfMoveUp,#vfMoveDown{touch-action:none;user-select:none;-webkit-user-select:none}

/* BUILD 197 — analog Void Frontier joystick */
.vf-virtual-joystick{width:156px;height:178px;margin:16px auto 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;touch-action:none;user-select:none;-webkit-user-select:none;position:relative;z-index:2}
.vf-joystick-base{width:138px;height:138px;border-radius:50%;position:relative;display:grid;place-items:center;background:radial-gradient(circle at 42% 35%,#27395d,#101a32 70%);border:2px solid #4969b0;box-shadow:inset 0 0 22px #080e20,0 0 18px #304d8b66;touch-action:none}
.vf-joystick-base:before{content:"";position:absolute;inset:18px;border:1px dashed #7895c477;border-radius:50%;pointer-events:none}
.vf-joystick-knob{position:absolute;left:50%;top:50%;width:54px;height:54px;border-radius:50%;transform:translate(-50%,-50%);background:linear-gradient(145deg,#83f1c0,#36c8b4);border:2px solid #b7ffe4;box-shadow:0 5px 16px #0008,0 0 18px #4de6ca88;pointer-events:none}
.vf-virtual-joystick.is-active .vf-joystick-knob{background:linear-gradient(145deg,#b4ffe0,#44d9c5)}
.vf-virtual-joystick>span{font-size:10px;font-weight:800;letter-spacing:.16em;color:#8fb5d9}
@media(min-width:760px){.vf-virtual-joystick{width:174px;height:190px}.vf-joystick-base{width:150px;height:150px}}

/* BUILD 198 — center knob within the circular base; robust touch hit area */
.vf-virtual-joystick{position:relative;isolation:isolate}
.vf-joystick-base{flex:0 0 auto;touch-action:none}
.vf-joystick-knob{left:50%;top:50%;will-change:left,top;transition:background .08s}
