:root{color-scheme:dark;font-family:ui-monospace,"Courier New",monospace}
*{box-sizing:border-box}
html,body,#world{width:100%;height:100%;margin:0;overflow:hidden}
body{background:linear-gradient(#78b8e8 0 55%,#b6dc8b);color:#fff}
#world{display:block;touch-action:none}
.hud{position:fixed;z-index:5;inset:0 0 auto;display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:16px;padding:max(16px,env(safe-area-inset-top)) 18px 16px;background:linear-gradient(rgba(4,9,5,.85),transparent)}
.title{text-align:center;text-shadow:3px 3px #111}
.title span,.title small{display:block;color:#d8e1d9;font-size:11px;letter-spacing:.12em}
.title strong{display:block;font-size:clamp(20px,4vw,36px);text-transform:uppercase}
.mc-button{border:3px solid #171717;outline:2px solid #aaa;background:linear-gradient(#737373,#555);box-shadow:inset 0 3px rgba(255,255,255,.25),inset 0 -4px rgba(0,0,0,.3),3px 3px #000;color:#fff;padding:10px 14px;font:700 13px inherit;text-decoration:none;text-shadow:2px 2px #222;cursor:pointer}
.mc-button:hover{outline-color:#b8ffbf;background:linear-gradient(#4d9757,#357b41)}
.loading{position:fixed;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);min-width:240px;border:4px solid #171717;outline:2px solid #aaa;background:#242924;padding:20px;text-align:center;box-shadow:6px 6px #000}
.loading strong,.loading span{display:block}
.loading span{margin-top:10px;color:#8eff9e}
.loading.hidden{display:none}
.controls{position:fixed;z-index:5;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(620px,calc(100% - 24px));border:2px solid #526157;background:rgba(5,11,7,.82);padding:10px 14px;text-align:center;text-shadow:2px 2px #000}
.controls b,.controls span{display:block}
.controls b{font-size:11px;color:#7cff90;letter-spacing:.16em}
.controls span{font-size:11px;margin-top:3px}
@media(max-width:620px){.hud{grid-template-columns:1fr 1fr;padding:14px 12px}.title{grid-column:1/-1;grid-row:1}.hud .mc-button{grid-row:2;text-align:center;padding:9px 7px}.title strong{font-size:20px}.title small{font-size:9px}.controls{bottom:12px}.controls span{font-size:9px}}
