#arcade-dialog{
  box-sizing:border-box;width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:24px;
  background:#fffaff;color:#51456d;border:3px solid #eadcf7;border-radius:28px;box-shadow:0 18px 60px #78669a44;
}
#arcade-dialog::backdrop{background:#33264d66}
#arcade-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#arcade-title{margin:0;color:#70549b;font-size:28px}
#arcade-dialog button{
  box-sizing:border-box;min-width:0;min-height:54px;padding:12px 18px;border:3px solid #dacaf0;border-radius:18px;
  background:#f2edff;color:#5d4b83;font:inherit;font-size:20px;cursor:pointer;touch-action:manipulation;
}
#arcade-dialog button:hover:not(:disabled){filter:brightness(.98);transform:translateY(-1px)}
#arcade-dialog button:disabled{cursor:default;opacity:.68}
#arcade-dialog button:focus-visible,#arcade-dialog input:focus-visible{outline:4px solid #f4bd62;outline-offset:2px}
#arcade-close,#arcade-restart{background:#fff0f4!important;border-color:#f2c9d5!important;font-size:17px!important}
#arcade-instructions{margin:14px 0 6px;font-size:17px;line-height:1.5}
#arcade-score{margin:0 0 14px;color:#9a6d35;font-weight:700;font-size:18px}
#arcade-board{
  box-sizing:border-box;display:block;min-width:0;min-height:210px;overflow:hidden;padding:16px;
  border:3px dashed #e6d9f4;border-radius:22px;background:#f8f5ff;
}
#arcade-board p{margin:10px 0;text-align:center;color:#7757a0}
#arcade-board button[data-state=matched],#arcade-board button[data-state=done]{background:#fff0c9;border-color:#f1d184}
#arcade-board .arcade-go{background:#8bd8a2;border-color:#4ba96a;color:#174d2a}
#arcade-restart{display:block;margin:18px auto 0}

.memory-game{display:grid;gap:12px;min-width:0}
.memory-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
.memory-levels{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.memory-controls .memory-start{align-self:center}
.arcade-footer,.arcade-ranking-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.arcade-footer{margin-top:16px;flex-wrap:wrap}
.arcade-ranking-actions:empty{display:none}
#arcade-dialog [hidden]{display:none!important}
.ranking-reset-confirm{max-width:calc(100vw - 56px);padding:20px;border:3px solid #dacaf0;border-radius:20px;background:#fffaff;color:#51456d}
.ranking-reset-confirm::backdrop{background:#33264d88}
.ranking-reset-confirm button{margin:4px}
#arcade-board .memory-level,#arcade-board .memory-start{min-height:48px;padding:8px 6px;font-size:16px}
#arcade-board [aria-pressed=true]{background:#d9cdf7;border-color:#8a70ba;color:#3f2d64;box-shadow:inset 0 0 0 1px #8a70ba}
.memory-grid{
  display:grid;grid-template-columns:repeat(var(--memory-columns,1),minmax(0,1fr));grid-template-rows:repeat(var(--memory-rows,1),minmax(44px,auto));
  gap:7px;min-width:0;
}
#arcade-board .memory-card{position:relative;min-width:0;min-height:54px;overflow:hidden;padding:4px;background:#e5f6f2;border-color:#bde3da;font-size:28px}
.memory-card[data-state=hidden]{background:#dcd4f5!important}
.memory-card[data-state=hidden] .memory-picture{visibility:hidden}
.memory-card[data-state=hidden]::after{position:absolute;inset:0;display:grid;place-items:center;content:'?';color:#74639e;font-weight:800}

.baseball-game{display:grid;gap:12px;min-width:0}
.baseball-levels,.baseball-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.baseball-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
#arcade-board .baseball-level,#arcade-board .baseball-actions button{min-height:48px;padding:8px 6px;font-size:16px}
.baseball-form{display:grid;gap:8px}
#baseball-input{box-sizing:border-box;width:100%;min-width:0;padding:11px;border:3px solid #d5c8e9;border-radius:14px;background:#fff;color:#46375f;text-align:center;font:inherit;font-size:28px;letter-spacing:.18em}
#arcade-board .baseball-feedback{min-height:24px;margin:0;font-size:16px}

.star-path-game,.space-signal-game{display:grid;justify-items:center;gap:10px}
#arcade-board .star-path-help,#arcade-board .space-signal-game p{max-width:430px;margin:0;font-size:15px;line-height:1.45}
.star-path-levels,.star-path-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
#arcade-board .star-path-levels button,#arcade-board .star-path-actions button{min-width:85px;min-height:44px;padding:6px;font-size:16px}
#arcade-dialog .star-path-game button:hover:not(:disabled),#arcade-dialog .star-path-game button:focus-visible{background:#7051a6;color:#fff;border-color:#56368d;filter:none;transform:none}
.star-path-field{position:relative;width:min(100%,390px);aspect-ratio:1;border:2px solid #dacaf0;border-radius:20px;background:radial-gradient(circle at 50% 42%,#fcfaff,#e9e4f8);touch-action:none}
.star-path-field svg,.star-path-nodes{position:absolute;inset:0;width:100%;height:100%}
.star-path-field svg line{stroke:#b9afd4;stroke-width:1.8;stroke-linecap:round;filter:drop-shadow(0 0 1px #fff)}
.star-path-field svg line.drawn{stroke:#79c5b8;stroke-width:3.2;filter:drop-shadow(0 0 2px #7fe9cc)}
#arcade-board .star-path-node{position:absolute;transform:translate(-50%,-50%);min-width:37px;min-height:37px;width:37px;height:37px;padding:0;border-radius:50%;border:2px solid #c9addd;background:#fff5cd;color:#8461a7;font-size:23px;box-shadow:0 2px 8px #8777aa50}
#arcade-board .star-path-node[data-start]{font-size:11px;font-weight:800;letter-spacing:-.04em}
#arcade-board .star-path-node[data-current]{box-shadow:0 0 0 3px #79c5b8,0 2px 8px #8777aa50}
#arcade-dialog .star-path-game .star-path-node:is(:hover:not(:disabled),:focus-visible){transform:translate(-50%,-50%)}
#arcade-board .space-signal-cue{min-height:23px;color:#54417e;font-weight:800;text-align:center}
.space-signal-pad{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:min(100%,360px)}
#arcade-board .space-signal-cell{
  position:relative;display:grid;place-items:center;align-content:center;gap:1px;min-height:122px;padding:8px;
  overflow:hidden;border:3px solid #d6bd7f;border-radius:17px;color:#fff5d8;
  background:radial-gradient(circle at 50% 35%,var(--signal-glow),transparent 71%),linear-gradient(145deg,var(--signal-top),var(--signal-bottom));
  box-shadow:inset 0 0 0 2px #fff2bd94,inset 0 8px 13px #ffffff26,inset 0 -10px 15px #06102975,0 4px 0 #644d43,0 7px 12px #392d5540;
  text-shadow:0 2px 2px #14152b;transition:filter .12s,box-shadow .12s,transform .12s;
}
#arcade-board .space-signal-cell::before{
  position:absolute;inset:5px;border:1px solid #ffedb179;border-radius:11px;content:'';pointer-events:none;
}
#arcade-board .space-signal-cell[data-signal="0"]{--signal-top:#376dba;--signal-bottom:#172c70;--signal-glow:#89dfff99}
#arcade-board .space-signal-cell[data-signal="1"]{--signal-top:#8752ae;--signal-bottom:#382065;--signal-glow:#df98ff9c}
#arcade-board .space-signal-cell[data-signal="2"]{--signal-top:#238c83;--signal-bottom:#125457;--signal-glow:#6ef5cc9c}
#arcade-board .space-signal-cell[data-signal="3"]{--signal-top:#d77a3a;--signal-bottom:#8e3732;--signal-glow:#ffe47caa}
.space-signal-art{display:block;width:70px;height:70px;filter:drop-shadow(0 3px 2px #101a4866)}
.space-signal-art svg{display:block;width:100%;height:100%}
.space-signal-name{position:relative;color:#fff7d8;font-size:17px;font-weight:800;line-height:1.15;letter-spacing:.08em}
#arcade-board .space-signal-cell.lit{
  filter:brightness(1.3) saturate(1.22);box-shadow:inset 0 0 0 3px #fff8d3,inset 0 0 26px #fff3ba,0 0 0 4px var(--signal-glow),0 0 23px 8px var(--signal-glow);transform:scale(1.045);
}
#arcade-board .space-signal-cell:disabled{opacity:1}
.baseball-game h3{margin:2px 0 0;font-size:17px}
.tetris-game{display:grid;gap:12px}
.tetris-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.tetris-play{display:grid;grid-template-columns:1fr;gap:12px;align-items:start;justify-content:center}
.tetris-grid{display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(20,1fr);width:min(100%,250px);aspect-ratio:1/2;gap:2px;padding:4px;margin:auto;border:3px solid #b5a9d4;border-radius:10px;background:#e9e3f5;box-sizing:border-box}
.tetris-cell{min-width:0;min-height:0;border-radius:3px;background:#faf7ff}
.tetris-cell.filled{background:var(--block-color);border:1px solid #ffffffc8;box-shadow:inset 0 0 5px #fff,inset 0 -3px 4px #ffffff88,0 0 7px var(--block-color)}
.tetris-side{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:4px 8px}.tetris-side p{font-size:15px;line-height:1.4}
.tetris-side>p:nth-child(3),.tetris-side .tetris-controls{grid-column:1/-1}
.tetris-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 6px}
.tetris-control{display:grid;gap:5px;min-width:0;text-align:center}
#arcade-board .tetris-control button{min-height:50px;padding:5px;font-size:15px}
.tetris-control-down{grid-column:1/-1;justify-self:stretch}
.tetris-keys{display:flex;align-items:center;justify-content:center;gap:5px}
.tetris-keys kbd{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:29px;padding:0 4px;box-sizing:border-box;border:1px solid #a491c7;border-bottom:3px solid #7961a9;border-radius:7px;background:#fcfaff;color:#553783;box-shadow:0 2px 4px #5c497333;font-family:inherit;font-size:15px;font-weight:800;line-height:1}
#baseball-attempts{box-sizing:border-box;max-height:190px;overflow:auto;margin:0;padding:0 0 0 30px}
#baseball-attempts li{margin:5px 0;font-size:15px;line-height:1.35}

@media(max-width:430px){
  #arcade-dialog{padding:16px;border-radius:22px}
  #arcade-title{font-size:23px}
  #arcade-dialog button{min-height:48px;padding:9px 10px;font-size:17px}
  #arcade-board{min-width:0;padding:9px}
  #arcade-board .star-path-node{min-width:32px;min-height:32px;width:32px;height:32px;font-size:20px}
  #arcade-board .star-path-node[data-start]{font-size:10px}
  #arcade-board .space-signal-cell{min-height:108px;padding:5px}
  .space-signal-art{width:61px;height:61px}
  .space-signal-name{font-size:16px}
  .memory-controls{grid-template-columns:minmax(0,1fr) auto}
  .memory-grid{gap:4px}
  #arcade-board .memory-card{min-width:0;min-height:44px;padding:1px;font-size:clamp(19px,6vw,25px);border-width:2px;border-radius:11px}
  #arcade-board .memory-level,#arcade-board .memory-start,#arcade-board .baseball-level,#arcade-board .baseball-actions button{padding:6px 3px;font-size:14px}
}
