:root{font-family:Tahoma,"Leelawadee UI",sans-serif;color:#20233b;background:#eef0fb;font-size:20px;line-height:1.65;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100vh;padding:48px 20px}main{max-width:560px;margin:0 auto;background:white;border:1px solid #d9dcef;border-radius:24px;padding:36px;box-shadow:0 16px 48px #24286a12}.brand{font-size:18px;font-weight:700;text-decoration:none;letter-spacing:.08em}h1{font-size:30px;line-height:1.4;margin:20px 0}p{margin:16px 0}a{color:#312e81}label{display:block;font-weight:700}input,button{font:inherit;width:100%;min-height:56px;border-radius:12px}input{border:2px solid #8186ac;padding:10px;text-align:center;font-size:36px;letter-spacing:.2em;margin:12px 0 20px}button{background:#312e81;color:white;border:0;padding:12px 18px;cursor:pointer;font-weight:700}button:disabled{opacity:.65;cursor:wait}:focus-visible{outline:3px solid #6366f1;outline-offset:4px}.hint{color:#505675;font-size:18px}#issued-code{display:block;font-size:48px;font-weight:700;letter-spacing:.12em;color:#312e81;text-align:center}#status{color:#9b1c31;font-weight:700;overflow-wrap:anywhere}[hidden]{display:none!important}@media(max-width:420px){body{padding:20px 12px}main{padding:24px}h1{font-size:28px}}
#issued-code{padding:40px 0;margin:8px 0}
@media(max-width:420px){#issued-code{padding:32px 0}}
.login-success{text-align:center;padding:28px 0 32px;outline:none}.success-mark{display:block;width:144px;height:144px;margin:0 auto 24px;overflow:visible;animation:success-pop .45s ease-out both}.success-mark circle{fill:#e8f8ef;stroke:#15935b;stroke-width:3}.success-mark path{fill:none;stroke:#15935b;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:75;stroke-dashoffset:0;animation:success-draw .6s .2s ease-out both}.login-success h2{color:#147a4d;font-size:30px;margin:0}.login-success p{color:#505675}.login-success button{margin-top:16px}@keyframes success-pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes success-draw{from{stroke-dashoffset:75}to{stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){.success-mark,.success-mark path{animation:none}}
@supports (-webkit-touch-callout:none){#issued-code .code-separator{display:inline-block;width:.3em;letter-spacing:0}}
.code-field{position:relative;margin:12px 0 20px}.code-field input{margin:0;color:transparent;caret-color:transparent;-webkit-text-fill-color:transparent}.code-slots{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.12em;font-size:36px;pointer-events:none}.code-slot{position:relative;display:flex;align-items:center;justify-content:center;width:.7em;height:1.15em;font-variant-numeric:tabular-nums;line-height:1}.code-slot:nth-child(4){margin-left:.2em}.code-slot.empty:before{content:"";width:6px;height:6px;border-radius:50%;background:#a0a4b9}.code-slot.selected{background:#dfe3ff;border-radius:4px}
.auth-methods{display:flex;gap:8px;margin:24px 0}.auth-methods button{font-size:17px;min-height:48px;padding:10px 8px;background:#f0f1f8;color:#505675}.auth-methods button[aria-pressed="true"]{background:#312e81;color:#fff}#qr-login-panel{text-align:center}#qr-login-panel h2,#qr-confirm-panel h2{font-size:24px;margin:14px 0 8px}#qr-login-panel>p{font-size:17px;margin:10px 0}.login-qr{width:232px;max-width:100%;margin:12px auto;background:white}.login-qr svg,.install-staff svg{display:block;width:100%;height:auto;shape-rendering:crispEdges}.qr-lifetime{display:block;width:210px;max-width:100%;height:5px;accent-color:#6158b5;border:0;margin:8px auto}.pairing{font-variant-numeric:tabular-nums;letter-spacing:.04em;color:#312e81;font-weight:700}.install-staff{display:flex;gap:14px;align-items:center;border-top:1px solid #e4e6f0;margin-top:26px;padding-top:20px;font-size:14px;color:#656b82}.install-staff>a{flex:0 0 100px}.install-staff p{margin:5px 0;line-height:1.5}.install-staff strong{font-size:16px}.install-staff a{overflow-wrap:anywhere}.qr-consent{display:flex;align-items:flex-start;gap:12px;font-size:18px;font-weight:400;margin:22px 0}.qr-consent input{width:22px;min-width:22px;height:22px;min-height:22px;margin:4px 0;padding:0;accent-color:#312e81}.qr-signin{display:block;padding:14px;text-align:center;margin:20px 0}.secondary{background:#eef0f8;color:#414769;margin-top:12px}@media(max-width:380px){.install-staff{gap:8px}.install-staff>a{flex-basis:88px}}
.qr-lifetime::-webkit-progress-bar{background:#ebeaf5;border-radius:4px}.qr-lifetime::-webkit-progress-value{background:#6158b5;border-radius:4px}.qr-lifetime::-moz-progress-bar{background:#6158b5;border-radius:4px}

#qr-scanner{padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid #e4e6f0}#qr-scanner h2{font-size:23px}#qr-camera{display:block;width:100%;max-height:380px;object-fit:cover;border-radius:14px;background:#171727;margin-top:16px}#qr-scan-status{font-size:17px;color:#505675}
button{display:flex;align-items:center;justify-content:center;gap:.45em}.button-icon{display:block;flex:0 0 1.15em;width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.button-label{min-width:0}.auth-methods button{gap:.3em}.auth-methods .button-icon{flex-basis:1.05em;width:1.05em;height:1.05em}
.issue-methods button{flex:1;min-width:0;width:auto;font-size:16px;white-space:nowrap}.issue-methods button[aria-selected="true"]{background:#312e81;color:#fff}body[data-mode="issue"] #qr-scanner{border-bottom:0;padding-bottom:0;margin-bottom:24px}@media(max-width:360px){.issue-methods{gap:6px}.issue-methods button{font-size:14px;padding:10px 6px}}