@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&family=M+PLUS+Rounded+1c:wght@700;800;900&display=swap');
:root{color-scheme:light;touch-action:none;--game-w:min(100vw,calc(100vh * 9 / 16));--control:clamp(74px,15vw,104px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:#391d36;font-family:'M PLUS Rounded 1c','Kosugi Maru',sans-serif}
body{display:grid;place-items:center;background:radial-gradient(circle at 50% 15%,#854d78,#321a31 70%)}
#game-shell{position:relative;width:min(100vw,calc(100vh * 9 / 16));height:min(100vh,calc(100vw * 16 / 9));overflow:hidden;background:#ffeef5;box-shadow:0 0 90px #180914;border-inline:1px solid rgba(255,255,255,.2)}
canvas{display:block;width:100%;height:100%;touch-action:none}
#touch-controls{display:none;position:absolute;inset:0;pointer-events:none}
#touch-controls button{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));pointer-events:auto;width:var(--control);height:var(--control);border:3px solid rgba(255,255,255,.85);border-radius:50%;background:rgba(151,55,103,.44);box-shadow:0 6px 18px rgba(78,23,58,.25),inset 0 0 20px rgba(255,255,255,.22);color:#fff;font:900 30px 'M PLUS Rounded 1c';backdrop-filter:blur(5px);touch-action:none;text-shadow:0 2px #873052}
#touch-controls button:first-child{left:max(22px,env(safe-area-inset-left))}#touch-controls button:last-child{right:max(22px,env(safe-area-inset-right))}
#touch-controls button.pressed{transform:translateY(4px) scale(.96);background:rgba(236,80,142,.72)}
@media(pointer:coarse){#touch-controls.active{display:block}}
@media(min-aspect-ratio:1/1){#game-shell{border-radius:24px;max-height:96vh}}

/* 動画カットシーン（OP・エンディング） */
.cinema-overlay{position:absolute;inset:0;z-index:15;background:#000;display:flex;align-items:center;justify-content:center;cursor:pointer}
.cinema-overlay video{width:100%;height:100%;object-fit:cover}
.cinema-skip{position:absolute;right:16px;bottom:max(14px,env(safe-area-inset-bottom));color:rgba(255,255,255,.9);font:700 14px "M PLUS Rounded 1c",sans-serif;background:rgba(0,0,0,.4);padding:6px 14px;border-radius:999px;pointer-events:none}