.basic-canvas { position: relative; z-index: 1; width: min(100%,750px,calc((100svh - env(safe-area-inset-top) - env(safe-area-inset-bottom))*750/1206)); aspect-ratio:750/1206; container-type:inline-size; margin-block:auto; }
.basic-art { position:absolute; left:0; width:100%; height:auto; pointer-events:none; }
.heading { top:7.4626865672%; }
.form-art { top:24.8756218905%; }
#basic-form { position:absolute; inset:0; }
#basic-form fieldset { border:0; margin:0; padding:0; }
#guest-name { position:absolute; left:14.1333333333%; top:37.3963515755%; width:70.8%; height:5.7213930348%; border:0; border-radius:1.6cqw; padding:0 2.1333333333cqw; background:transparent; color:#325e50; font:500 3.4666666667cqw/1.3 "Songti SC","SimSun",serif; }
#guest-name:focus, #guest-name.has-value { background: url('https://1500065981.vod-qcloud.com/968a96ddvodbj1500065981/aea53f6d5001834827747908159/BnDiyCLOXHwA.webp') center/100% 100% no-repeat; }
.identity { position:absolute; top:53.0679933665%; width:30.9333333333%; height:5.7213930348%; border-radius:1.6cqw; cursor:pointer; }
.bamboo { left:14.1333333333%; }
.non-bamboo { left:54%; }
.identity input { appearance:none; -webkit-appearance:none; position:absolute; inset:0; margin:0; width:100%; height:100%; border:0; border-radius:inherit; cursor:pointer; background:transparent; }
.identity input:checked { box-shadow:inset 0 0 0 2px #406958; background:#40695818; }
.confirm { position:absolute; left:36.8%; top:65.008291874%; width:26.4%; height:5.0580431177%; border:0; border-radius:10cqw; cursor:pointer; background:transparent; }
.confirm:active { box-shadow:inset 0 0 0 100vmax #ffffff30; }
#basic-form :focus-visible { outline:2px solid #a98748; outline-offset:3px; }
#form-status { position:absolute; left:14.1333333333%; top:71%; width:70.8%; margin:0; text-align:center; color:#604b28; font: max(12px,2.5cqw)/1.5 sans-serif; }

/* Match the identity selection highlight while editing the name. */
#basic-form #guest-name:focus { outline:none; box-shadow:inset 0 0 0 2px #406958, inset 0 0 0 100vmax #40695818; }

/* Fixed image lettering keeps the step button consistent across devices. */
#basic-form .confirm { background:transparent;padding:0; }
#basic-form .confirm img { display:block;width:100%;height:100%;pointer-events:none; }
#basic-form .confirm:active img { opacity:.85; }