@media (max-width:480px){.game-header{padding:56px 10px 8px}.home-btn{width:40px;height:40px;font-size:1.2rem;top:10px;left:10px}}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;font-family:'Zen Maru Gothic',sans-serif;user-select:none}
body{background:linear-gradient(135deg,#0d1b2a 0%,#1b263b 45%,#415a77 100%);touch-action:none}
.home-btn{position:fixed;top:12px;left:12px;width:48px;height:48px;background:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:1.4rem;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.25);z-index:9999;border:3px solid #e91e63}

#game-container{width:100%;height:100%;display:flex;flex-direction:row;align-items:stretch;position:relative;overflow:hidden}
/* 左パネル：12_maze_trace と同寸（220px / padding 14 / gap 12） */
.side-panel{width:220px;flex-shrink:0;display:flex;flex-direction:column;padding:14px;gap:12px;background:rgba(255,255,255,.85);backdrop-filter:blur(6px);overflow-y:auto}
.game-header{display:flex;flex-direction:column;gap:8px}
.title-badge{background:#fff;padding:8px 12px;border-radius:16px;font-weight:700;font-size:.88rem;box-shadow:0 2px 0 #cfd8dc;display:flex;align-items:center;gap:6px}
.level-pill{background:#e91e63;color:#fff;padding:6px 14px;border-radius:14px;font-weight:700;font-size:.85rem;text-align:center;box-shadow:0 2px 0 #ad1457}

.stat-section{background:#fff;border-radius:14px;padding:10px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.stat-title{font-size:.75rem;font-weight:700;color:#37474f;margin-bottom:4px}
.big-stat{font-size:1.5rem;font-weight:900;color:#e91e63;text-align:center}

.side-actions{display:flex;flex-direction:column;gap:8px}
.side-btn{font-family:inherit;font-weight:700;font-size:.85rem;padding:10px;border-radius:14px;border:none;background:#e91e63;color:#fff;box-shadow:0 3px 0 #ad1457;cursor:pointer;text-align:center}
.side-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #ad1457}
.side-btn.secondary{background:#78909c;box-shadow:0 3px 0 #546e7a;color:#fff}
.side-btn.secondary:active{box-shadow:0 1px 0 #546e7a}
.side-hint{font-size:.72rem;color:#555;text-align:center;line-height:1.35}

.game-panel{flex:1;display:flex;flex-direction:row;align-items:stretch;justify-content:center;padding:4px;min-width:0;min-height:0}
.game-wrap{flex:1;min-width:0;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;container-type:size;container-name:block-area}
#game-canvas{display:block;border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.45);touch-action:none;max-width:100%;max-height:100%}

.feedback{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.88);color:#fff;padding:22px 36px;border-radius:20px;font-size:clamp(2.2rem,8vw,3.5rem);font-weight:900;z-index:5000;max-width:92%;text-align:center;letter-spacing:.05em;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.feedback.hidden{display:none!important}

.overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:10000;padding:16px}
.overlay.hidden{display:none!important}
.overlay-card{background:#fff;border-radius:24px;padding:22px 18px;max-width:320px;width:100%;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.25)}
.overlay-title{font-size:1.35rem;font-weight:900;color:#37474f;margin-bottom:8px}
.overlay-sub{font-size:.9rem;color:#666;margin-bottom:14px}
.overlay-btn{display:block;width:100%;font-family:inherit;font-weight:700;padding:14px;border-radius:18px;border:none;background:#e91e63;color:#fff;font-size:1.02rem;margin-bottom:10px;cursor:pointer;box-shadow:0 4px 0 #ad1457}
.overlay-btn.secondary{background:#b0bec5;box-shadow:0 4px 0 #78909c;color:#333}
.overlay-btn:active{transform:translateY(2px)}

.stage-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.stage-list button{font-family:inherit;font-weight:700;padding:10px;border-radius:12px;border:none;background:#fce4ec;color:#c2185b;cursor:pointer;font-size:.88rem}
.stage-list button:active{background:#f8bbd0}

@media (orientation:portrait){
  #game-container{flex-direction:column}
  .side-panel{width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px}
  .game-header{flex-direction:row;align-items:center;gap:8px}
  .stat-section{flex:1;min-width:90px}
  .side-actions{flex-direction:row;flex-wrap:wrap}
  .side-hint{display:none}
  .game-panel{flex:1;min-height:0;min-width:0}
}
@media screen and (max-height: 500px) {
  #game-container {
    margin-left: 80px !important;
    width: calc(100% - 80px) !important;
    flex-direction: row !important;
  }
  .side-panel{width:160px;padding:8px !important;gap:8px}
  .game-header{gap:4px}
  .title-badge{font-size:.72rem;padding:4px 8px}
  .level-pill{font-size:.7rem;padding:4px 10px}
  .stat-section{padding:6px}
  .stat-title{font-size:.65rem;margin-bottom:2px}
  .big-stat{font-size:1.2rem}
  .side-btn{padding:8px;font-size:.75rem}
  .side-hint{display:none}
  .overlay-card { padding: 12px 15px !important; max-width: 480px !important; }
  .stage-list { grid-template-columns: repeat(5, 1fr) !important; gap: 5px !important; }
  .stage-list button { padding: 6px !important; font-size: 0.75rem !important; }
  .game-panel { padding: 6px; min-height: 0; }
}