@import url("../aliens/styles.css?v=20260711-first-draft");
:root{--yellow:#bca7ff;--blue:#54c7ff}
html,body{width:100%;max-width:100%;height:100%;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%}
.shell{position:relative;left:var(--visual-viewport-offset-left,0);width:min(100%,var(--visual-viewport-width,100%));max-width:100%}
.game,.board-wrap,canvas{min-width:0;max-width:100%}
.board-wrap,canvas,.top-game-actions .small-button,.space-controls .small-button{touch-action:none;-webkit-user-select:none;user-select:none}

.game-logo{background:linear-gradient(90deg,#bca7ff 0%,#54c7ff 42%,#ffd166 76%,#fff8ee 100%);background-clip:text;-webkit-background-clip:text}
.brand-header{grid-template-columns:minmax(0,1fr) auto;gap:8px;text-align:center}
.brand-copy{min-width:0}
.top-game-actions{display:grid;grid-template-columns:repeat(2,40px);gap:5px}
.top-game-actions .small-button{width:40px;min-width:40px;min-height:40px;padding:0}
.space-controls{grid-template-columns:repeat(4,minmax(0,1fr))}
.space-controls .turn-button{font-size:1.45rem;line-height:1}
.board-wrap>.toast{top:auto;bottom:10px;width:calc(100% - 20px);max-width:520px;padding:8px 12px;border:1px solid rgba(84,199,255,.58);border-radius:8px;background:rgba(3,8,22,.84);color:#f4fbff;font-size:clamp(.8rem,3.4vw,1.04rem);line-height:1.25;transform:translateX(-50%);text-shadow:0 2px 10px rgba(0,0,0,.8);box-shadow:0 7px 22px rgba(0,0,0,.32)}
.board-wrap>.toast.pop{animation:spacerocksToastBottom 3000ms ease-in-out forwards!important}
@keyframes spacerocksToastBottom{0%{opacity:0;transform:translate(-50%,8px)}8%,88%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,0)}}
