.arc-shell { grid-template-rows: auto minmax(0, 1fr); }
.arc-shell .game-stage { width: 100%; height: 100%; }
.arc-toolbar {
  z-index: 10; position: relative; width: 100%; min-height: 54px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px 18px; border-bottom: 1px solid #3a4567; background: #0d1424;
  font-family: system-ui, sans-serif; font-size: 13px;
}
.arc-brand { display: flex; align-items: center; gap: 10px; margin-right: auto; }
.arc-brand img { flex: none; image-rendering: pixelated; }
.arc-brand strong { color: #a4c7ff; letter-spacing: 2px; }
.arc-brand span { border: 1px solid #465b82; padding: 3px 6px; color: #aab9d2; }
.arc-toolbar p { margin: 0; color: #b8c4dd; }
.arc-toolbar button, .arc-toolbar summary {
  cursor: pointer; border: 1px solid #586c93; color: #d7e5ff; background: #1c2b45;
  padding: 7px 10px; border-radius: 3px; font: inherit;
}
.arc-toolbar button:disabled { opacity: .45; cursor: default; }
.arc-toolbar button:focus-visible, .arc-toolbar summary:focus-visible { outline: 2px solid #aacdff; outline-offset: 2px; }
.arc-toolbar a { color: #a4c7ff; }
.arc-panel {
  position: absolute; right: 16px; top: calc(100% + 10px); width: min(420px, calc(100vw - 32px));
  max-height: 65vh; overflow-y: auto; padding: 20px; background: #101a2bee;
  border: 1px solid #6379a1; border-radius: 4px; box-shadow: 0 16px 48px #000a;
  display: grid; gap: 14px; line-height: 1.7;
}
.arc-panel h1 { margin: 0; color: #edf4ff; font-size: 18px; }
.arc-record { border-top: 1px solid #34425f; padding: 12px 0; overflow-wrap: anywhere; }
.arc-record button { margin: 8px 0 0 12px; }
@media (max-width: 640px) {
  .arc-toolbar { gap: 8px; padding: 8px 10px; font-size: 12px; }
  #arc-wallet-status { width: 100%; order: 5; }
  .arc-brand strong { letter-spacing: 1px; }
}