:root{color-scheme:dark;font-family:monospace}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:#10142e;color:#dff1ff;font-family:monospace;-webkit-text-size-adjust:100%;padding:0 max(6px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))}
#myoujou{width:min(100%,960px);margin:0 auto}
#mj{width:100%;max-width:960px;height:auto;max-height:calc(100vh - 178px);object-fit:contain;display:block;margin:0 auto;image-rendering:pixelated;background:#10142e;touch-action:none}
.mj-title{font-size:13px;letter-spacing:2px;text-align:center;margin:8px 0 6px;color:#dff1ff}
.mj-when{min-height:13px;font-size:11px;text-align:center;margin:6px 8px;color:#9fc8ff}
.mj-hud{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:8px}
.mj-btn{font-size:11px;padding:7px 12px;border:2px solid #dff1ff;color:#dff1ff;text-decoration:none;background:#2a2450}
.mj-btn-nokosu{border-color:#7fd9e8;color:#7fd9e8;background:#10142e;font-family:monospace;cursor:pointer}
.mj-hud [hidden]{display:none}
.mj-panel{max-width:640px;margin:4px auto 24px;padding:8px 12px;border-top:2px solid #2a2450;min-height:56px}
.mj-head{font-size:12px;margin:4px 0;color:#9fc8ff}
.mj-body{font-size:11px;line-height:1.7;margin:4px 0;word-break:break-word}
@media (max-width:480px){.mj-body{font-size:10px}}