
#game-layer{background:#120b26}
#game-back,#template-finish{display:none!important}
.title-art{width:min(90%,390px);max-height:12svh}
.preview-stage{width:min(46%,205px);aspect-ratio:1/1.25}
.end-stage{width:min(48%,215px);aspect-ratio:1/1.25}
.end-card h1{font-size:clamp(23px,6cqw,34px)}
#game-layer .wrap,#game-layer .game{width:100%;height:100%}

/* v33: keep a comfortable gap between photo controls and the recipient fields. */
#start-form .fields{margin-top:20px}

/* Photo mask positioning is handled explicitly in screens.js; never anchor it to the modal/page. */
#editor-stage .photo-mask,.preview-stage .photo-mask,.end-stage .photo-mask{position:absolute}


/* v34: use the user's exact hollow-face shape and make photo dragging feel native. */
#editor-stage,#editor-stage *{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
#editor-stage .mascot,#editor-stage .photo-mask,#editor-stage .photo-mask img{pointer-events:none}
#remove-photo-inline{display:block;margin:12px auto 0;padding:4px 0;line-height:1.2}
#start-form .fields{margin-top:16px}

/* v35: exact user-made face opening is clipped with inline polygon, avoiding mobile mask-image failures. */
.photo-mask{background:transparent!important}
