/* Source artwork is rendered intact; HTML supplies the live controls and legal text. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body{background:#e7f7f8}.shell{position:relative;width:min(100vw,calc(100dvh * 4 / 3));max-width:1365px;aspect-ratio:4/3;min-height:0;height:auto;display:block;padding:0;background:url('inside.png') center/100% 100% no-repeat;color:#252525}
body[data-screen=welcome] .shell{background-image:url('intro.png')}body[data-screen=success] .shell{background-image:url('success.png')}
.mode{position:fixed;inset:0 0 auto;z-index:10;font-size:10px;padding:5px 12px;background:#00343ded;letter-spacing:.2px}
.topbar{position:absolute;inset:4% 5% auto 6.7%;min-height:0;height:20%;display:block;pointer-events:none}.brand{position:absolute;left:0;top:10%;width:32%;height:75%;pointer-events:auto}.topbar #logout{position:absolute;right:0;top:0;font-size:11px;min-height:28px;padding:4px 12px;background:#ffffffaa;pointer-events:auto}
.hero,.panel,.success{position:absolute;inset:0;margin:0;max-width:none;width:100%;min-height:0;display:block;padding:0;animation:none!important}.hero{pointer-events:none}.hero button{pointer-events:auto}
button{font-size:16px;min-height:46px;padding:10px 19px}button span{font-size:23px}#start{position:absolute;left:6.65%;top:80.9%;width:22.5%;min-width:220px}#next-person{position:absolute;left:6.65%;top:85%;margin:0;font-size:13px;min-height:42px}
.panel h1{position:absolute;left:7.5%;top:30.8%;font-size:clamp(24px,3.05vw,40px);line-height:1.2;letter-spacing:-.8px;margin:0;color:#252525}
#entry-form{position:absolute;inset:0}.fields{position:absolute;left:7.35%;right:8.05%;top:41.8%;margin:0;gap:22px 3.9%;grid-template-columns:1fr 1fr}.fields label{font-size:clamp(18px,2vw,25px);font-weight:800;color:#252525}.fields input{height:48px;min-height:48px;background:#ffffff4d;border:2px solid #fff;margin-top:10px;border-radius:28px;font-size:20px;padding:8px 20px}.fields input:read-only{background:#ffffff4d}#details .actions{position:absolute;left:7.4%;top:80.5%;margin:0;gap:16px}#details .reset{font-size:12px;min-height:36px;padding:6px 14px;background:#ffffff70}.demo-note{position:absolute;left:7.5%;top:36%;font-size:12px!important;margin:0!important;padding:5px 10px;border-radius:7px}
#terms h1{top:26.8%;left:7%}.legal-scroll{position:absolute;left:7%;right:7.5%;top:33.5%;height:43.5%;margin:0;padding:0 18px 12px 0;border:0;border-radius:0;background:transparent;scrollbar-color:#00505b white;scrollbar-width:thin}.legal-text{font-size:16px;line-height:1.6;color:#18383e}.legal-scroll h2{font-size:20px}.consents{position:absolute;left:7.3%;top:81%;max-width:61%}.check{font-size:14px;gap:10px;margin:8px 0}.check input{width:21px;height:21px;min-height:21px;flex-basis:21px}.check span{line-height:1.3}#terms .actions{position:absolute;right:7.3%;top:82%;margin:0;gap:7px;max-width:28%;justify-content:flex-end}#terms .actions>button:first-child{order:0;width:160px}#terms .text-button{font-size:11px;min-height:28px;padding:4px 9px;order:2}#terms .actions>a{font-size:11px;order:1}
.shell footer{position:absolute;inset:auto 4% 1.5%;font-size:10px;border:0;padding:0;margin:0;gap:10px;color:#00343d}.shell footer a{font-size:10px}.notice,.connection{position:absolute;z-index:8;left:7%;right:7%;top:22%;margin:0;padding:10px 16px;font-size:14px}.connection{top:14%}
#login{left:7%;right:7%;top:26%;bottom:8%;width:auto;background:#ffffffc9;border:1px solid #fff;border-radius:22px;padding:22px 32px;overflow:auto}#login h1{position:static;font-size:28px}#login p{font-size:15px;margin:8px 0}#login .eyebrow{font-size:11px}#login form{max-width:450px}#login label{margin:16px 0;font-size:16px}#login input{height:44px;min-height:44px}#login #demo-login{margin-top:14px}#login .quiet{font-size:11px;margin:14px 0}body[data-screen=login] .shell footer{display:none}
.topbar{z-index:4}#start,#submit{white-space:nowrap;font-size:14px;gap:16px}
/* Actual controls: text and CSS arrow stay inside the button in every state. */
button{max-width:100%;min-width:0;line-height:1.3;white-space:normal;overflow-wrap:break-word}
button .button-label{font-size:inherit;line-height:1.3;min-width:0;white-space:normal}
button .button-arrow{display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px;border:1.4px solid currentColor;border-radius:50%;font-size:inherit}
.button-arrow::after{content:"";width:8px;height:8px;border-top:1.4px solid currentColor;border-right:1.4px solid currentColor;transform:translateX(-2px) rotate(45deg)}
#start,#submit,#continue,#next-person{gap:14px;white-space:normal;min-height:46px;padding:10px 18px}
#submit{width:max-content;min-width:229px}#continue{width:160px}
#success .commit-status{position:absolute;top:79%;left:6.65%;width:max-content;max-width:43%;margin:0;padding:6px 10px;font-size:12px;line-height:1.4;background:#ffffffb8;border-radius:8px;text-align:left}
@media(orientation:portrait),(max-width:620px){
 .shell{width:100%;max-width:none;aspect-ratio:auto;min-height:100dvh;background-image:linear-gradient(to bottom,transparent calc(75vw - 90px),#d5eff2 75vw),url('inside.png');background-size:100% 100%,100% auto;background-position:top;background-color:#d5eff2;padding:23% 7% 72px}body[data-screen=welcome] .shell,body[data-screen=success] .shell{aspect-ratio:4/3;min-height:0;height:auto;padding:0;background-size:100% 100%}
 body[data-screen=welcome],body[data-screen=success]{padding-top:10dvh}
 .topbar{top:30px;left:7%;right:5%;height:16%}.topbar #logout{top:0;right:0}.hero{position:absolute;min-height:0}.hero #start{top:80%;left:6.7%;font-size:12px;min-height:40px;min-width:0;width:42%;padding:8px 12px;gap:12px}
 .panel{position:relative;inset:auto}.panel h1{position:static;font-size:28px;margin:36px 0 24px}#entry-form{position:static}.fields{position:static;grid-template-columns:1fr;gap:20px}.fields label{font-size:19px}.fields input{height:54px}.demo-note{position:static;margin:0 0 22px!important;font-size:12px!important}.legal-scroll{position:static;height:42dvh;min-height:260px;background:#ffffff80;padding:16px;border-radius:16px}.consents{position:static;max-width:none;margin-top:20px}.check{font-size:15px;margin:16px 0}#terms .actions,#details .actions{position:static;max-width:none;justify-content:initial;margin-top:26px}.actions button{width:auto}#terms .actions>button:first-child{width:160px}.shell footer{position:absolute;bottom:18px;left:7%;right:7%;font-size:9px}.shell footer a{font-size:9px}.notice,.connection{position:fixed;top:30px;left:5%;right:5%;font-size:13px}.connection{top:75px}
 #login{position:relative;inset:auto;margin:30px 0;width:100%;padding:22px}#login h1{font-size:25px}#next-person{font-size:10px;min-height:34px;top:84%;padding:7px 12px;gap:8px}body[data-screen=welcome] footer,body[data-screen=success] footer{bottom:-55px}body[data-screen=success] .success{position:absolute;inset:0;min-height:0}
}
@media(orientation:portrait),(max-width:620px){.hero #start{width:min(42%,229px)}}
@media(max-width:620px){body:not([data-screen=welcome]):not([data-screen=success]) .topbar #logout{top:40px;min-height:32px}}

/* Tablet touch targets also cover the secondary controls. */
.topbar #logout,#terms .text-button,#details .reset{min-height:44px;padding:10px 14px}