/* Layout based on the user's reference of the TSE simulator. */
#simulator{background:#f3f4f6;padding:14px 24px;color:#222c30}
.sim-top,.sim-help,.sim-bottom,#record-info{max-width:800px;margin-left:auto;margin-right:auto}
.sim-top{margin-bottom:14px}.sim-top>span{font-size:10px;letter-spacing:.8px;text-align:center}
.machine{width:100%;max-width:800px;display:block;padding:0 82px 54px;background:#eef0e4;border:1px solid #8b9085;border-radius:20px;box-shadow:inset 7px 0 0 #f8f9f2,inset 9px 0 0 #b7bbae,inset -7px 0 0 #f8f9f2,inset -9px 0 0 #b7bbae,0 6px 9px #0003;position:relative;overflow:hidden}
.machine:before,.machine:after{content:'';position:absolute;width:9px;height:20px;border:1px solid #9da292;background:#eef0e4;bottom:155px;left:7px;pointer-events:none}.machine:after{left:auto;right:7px}
.screen-frame{background:#080908;padding:7px 16px 8px;border-radius:0;box-shadow:0 0 0 1px #383b34}
#steps{display:flex;max-width:none;margin:0;background:white;gap:0;font-family:Arial,sans-serif}
#steps span{display:flex;align-items:center;justify-content:center;flex:1;padding:5px 3px 5px 7px;min-height:27px;background:#d1d1d1;color:#686868;border-radius:0;font-size:10px;line-height:1.1;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%,8px 50%);margin-left:-5px}
#steps span:first-child{clip-path:polygon(0 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,0 100%);margin-left:0;padding-left:3px}#steps span.active{background:#111;color:white;font-weight:700}#steps span.done{background:#b5b5b5;color:#444}
.training-label{background:#fff;color:#7b7b7b;font:700 14px Arial,sans-serif;text-align:center;padding:0 0 4px}
.screen{font-family:Arial,sans-serif;background:#fff;min-height:310px;padding:8px 10px 12px;color:#050505}
.screen h2{font-family:Arial,sans-serif;font-size:25px;line-height:1.2;letter-spacing:0;margin:7px 0 14px;font-weight:700}
.digits{gap:4px;margin:3px 0 22px}.digits span{width:29px;height:37px;border:1px solid #565656;font-size:28px}
.candidate-info strong{font-family:Arial,sans-serif}.screen-bottom{font-size:11px;border-color:#aaa;line-height:1.5}.screen small{font-size:11px}.screen .end{font-family:Arial,sans-serif}
.keypad-panel{display:grid;grid-template-columns:minmax(130px,1fr) 196px 86px;gap:16px;align-items:center;margin-top:48px;position:relative}
.machine-brand{display:flex;flex-direction:column;justify-content:center;align-self:end;text-align:left;letter-spacing:.4px;font-size:15px;color:#7c8375;padding:14px 10px;border:2px solid #a3a799;border-radius:4px;box-shadow:inset 1px 1px 1px #fff,1px 1px 0 #fff;text-shadow:1px 1px #fff;min-height:96px;margin-bottom:42px;position:relative}
.machine-brand:after{content:'';height:33px;border:2px solid #a3a799;border-radius:4px;position:absolute;left:-2px;right:-2px;bottom:-44px;box-shadow:inset 1px 1px #fff,1px 1px #fff}.machine-brand b{font-size:21px;font-weight:500;letter-spacing:3px}.machine-brand small{font-size:10px;letter-spacing:0;margin-top:3px}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:11px 10px;padding:0;margin:0;max-width:none;width:100%}
.keys button{font-family:Arial,sans-serif;font-weight:400;border:2px solid #9ea5a2;background:linear-gradient(115deg,#435965,#344954);height:46px;padding:1px 5px;font-size:29px;line-height:1;color:#f4f5f2;border-radius:8px;box-shadow:inset 1px 1px 2px #ffffff4d,0 2px 3px #0004;display:flex;align-items:center;justify-content:space-between}
.keys button small{font-size:18px;color:#859393;margin:0 3px 0 0;text-shadow:1px 1px 0 #1c3239}
.actions{display:grid;grid-template-rows:46px 46px 103px;gap:11px;margin:0;align-items:stretch;width:100%;max-width:none}
.actions button{font-family:'Arial Narrow',Arial,sans-serif;font-size:15px;font-weight:400;line-height:1;min-height:0!important;padding:5px 1px;border:2px solid #92968c;border-radius:8px;box-shadow:inset 1px 1px 2px #ffffff70,0 2px 4px #0004;color:#050505;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.actions button:after{content:'';width:36px;height:13px;background:radial-gradient(circle,#4a4b44 1px,transparent 1.6px) 0 0/6px 5px;opacity:.65}.actions .blank{background:linear-gradient(#fff,#eeeee9)}.actions .correct{background:linear-gradient(#ff2916,#f11408)}.actions .confirm{background:#00bf55!important;min-height:0!important;font-size:14px}
.sim-help{background:#4a82b0;color:white;border:1px solid #3b6c91;border-radius:5px;margin-top:18px;padding:12px 18px;text-align:center}.sim-help p{font-weight:400}.sim-help>span{color:#e7f0f8}.sim-bottom{color:#546373}.orange{background:#ff4934}.green{background:#50d786}
/* The landing preview uses the same vertical screen and right-hand actions. */
.hero-art{min-height:520px}.mini-machine{display:block;max-width:395px;width:100%;align-self:center;padding:0 38px 30px;background:#eef0e4;transform:rotate(-3deg);margin:28px auto;border:1px solid #999f92;border-bottom-width:3px;box-shadow:inset 4px 0 #f8f9f2,inset -4px 0 #f8f9f2,8px 17px 24px #34452b33}
.mini-screen{background:#fff;border:10px solid #070807;min-height:185px;padding:12px 8px}.mini-screen strong{font-family:Arial,sans-serif;font-size:18px;margin:9px 0 13px}.mini-screen small{font-family:Arial,sans-serif;font-size:8px}.mini-line{margin-top:28px}.mini-panel{display:grid;grid-template-columns:1fr 100px 49px;gap:8px;margin-top:24px;align-items:center}.mini-panel>b{font-size:8px;text-align:left;border:1px solid #a1a798;padding:8px 3px;color:#7c8375;margin:0}.mini-keys{gap:5px;margin:0}.mini-keys i{background:#3d5460;box-shadow:0 1px 2px #0005;font-size:17px;padding:2px 3px;text-align:left;border:1px solid #a0a7a6}.mini-actions{display:grid;grid-template-rows:25px 25px 55px;gap:5px;margin:0}.mini-actions i{font-family:Arial,sans-serif;font-size:6px;display:grid;place-items:center;padding:0;border:1px solid #92968c;border-radius:4px;box-shadow:0 1px 2px #0004}.mini-actions i:nth-child(2){background:#ff2010}.mini-actions i:nth-child(3){background:#00bf55}
@media(min-width:601px) and (max-height:850px){.machine{max-width:700px;padding:0 58px 30px}.screen{min-height:260px}.keypad-panel{margin-top:26px}.sim-top{margin-bottom:8px}.sim-help{margin-top:12px;padding:6px 12px}.sim-help p{margin:4px 0}}
@media(max-width:900px){.hero-art{padding:16px}.mini-machine{padding-left:20px;padding-right:20px}.mini-panel{grid-template-columns:minmax(40px,1fr) 100px 49px;gap:6px}}
@media(max-width:600px){#simulator{padding:8px 10px}.sim-top>span{margin:3px 0 0;font-size:9px}.machine{padding:0 14px 26px;border-radius:14px;overflow:visible}.machine:before,.machine:after{display:none}.screen-frame{padding:6px 7px 7px}.screen{min-height:260px;padding:10px 7px}.screen h2{font-size:23px;margin:9px 0 16px}.screen-bottom{font-size:10px}.training-label{font-size:12px;padding:3px 0}#steps{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:2px}#steps span{min-height:22px;font-size:9px;padding:3px;clip-path:none!important;margin:0}.keypad-panel{display:grid;grid-template-columns:minmax(0,196px) 82px;justify-content:center;gap:15px;margin-top:25px}.machine-brand{display:none}.keys{max-width:none;gap:11px 8px}.keys button{height:46px;font-size:28px;padding:3px 6px}.keys button small{font-size:16px;margin:0}.actions{grid-template-rows:46px 46px 103px;gap:11px}.actions button{font-size:14px;padding:3px 0}.actions .confirm{font-size:13px}.sim-help{margin-top:14px;padding:8px 10px;font-size:13px}.sim-help>span{display:none}.sim-bottom{gap:8px;font-size:10px}.hero-art{min-height:470px}.mini-machine{max-width:340px;padding:0 28px 25px;margin:25px auto}.mini-panel{grid-template-columns:1fr 100px 49px}.mini-screen{min-height:180px}.candidate-info{gap:10px}.candidate-info p{font-size:12px}}
@media(max-width:350px){.keypad-panel{grid-template-columns:minmax(0,170px) 75px;gap:10px}.keys button{padding:3px}.actions button{font-size:12px}.actions .confirm{font-size:12px}.mini-machine{padding-left:18px;padding-right:18px}}

.candidate-info{justify-content:space-between;align-items:flex-start}.candidate-info>div{flex:1;min-width:0}.candidate-info img{order:2;width:96px;height:96px;flex-shrink:0;object-fit:contain;background:#f2f2f2;border:1px solid #aaa;margin-left:10px}.photo-unavailable{order:2;width:96px;font:12px Arial,sans-serif;color:#555}.candidate-info strong{overflow-wrap:anywhere}@media(max-width:600px){.candidate-info img{width:80px;height:80px;margin-left:4px}.candidate-info strong{font-size:16px}}

#support-dialog{max-width:620px}#support-dialog input:not([type=checkbox]){width:100%;margin:7px 0 14px}#support-dialog .consent{display:flex;gap:12px;align-items:start;font-size:14px;line-height:1.6;margin:20px 0}#support-consent{width:20px;height:20px;flex-shrink:0;margin-top:4px}#support-review{padding-left:22px;font-size:14px;line-height:1.8}#support-privacy{padding:14px;background:#eaf0e5;border-radius:6px}#support-status{font-weight:600}#share-support{font-family:Arial,sans-serif;font-size:15px;line-height:1.5;text-align:center;justify-content:center;margin:12px 0 18px;padding:14px;background:#10bf61;color:#062b16;box-shadow:0 0 0 0 rgba(16,191,97,.58);animation:share-support-pulse 1.55s ease-out infinite}#share-support:hover{background:#21d977;filter:none}@keyframes share-support-pulse{0%{background:#10bf61;box-shadow:0 0 0 0 rgba(16,191,97,.6);transform:scale(1)}55%{background:#21d977;box-shadow:0 0 0 14px rgba(16,191,97,0);transform:scale(1.022)}100%{background:#10bf61;box-shadow:0 0 0 0 rgba(16,191,97,0);transform:scale(1)}}#screen:has(#share-support) .end{font-size:64px}
#send-support:not(:disabled){background:#10bf61;color:#062b16;box-shadow:0 0 0 0 rgba(16,191,97,.58);animation:confirm-support-pulse 1.45s ease-out infinite}#send-support:not(:disabled):hover{background:#21d977;filter:none}@keyframes confirm-support-pulse{0%{box-shadow:0 0 0 0 rgba(16,191,97,.6);transform:scale(1)}65%{box-shadow:0 0 0 13px rgba(16,191,97,0);transform:scale(1.018)}100%{box-shadow:0 0 0 0 rgba(16,191,97,0);transform:scale(1)}}@media(prefers-reduced-motion:reduce){#share-support,#send-support:not(:disabled){animation:none}}