@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root { --navy:#062d48; --blue:#075696; --line:#dce6ed; --muted:#58718a; }
* { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body { display:grid; place-items:center; background:#e7eef3; color:var(--navy); font:14px/1.45 'DM Sans',Arial,sans-serif; }
a { text-decoration:none; color:inherit; }
.phone { width:min(100%,390px); height:min(100dvh,850px); min-height:650px; position:relative; overflow:hidden; background:#fff; border:1px solid #183750; border-radius:28px; box-shadow:0 15px 40px #10354a25; }
.view { display:none; height:100%; padding:16px; overflow:hidden; }
body:not(:has(.view:target)) #home,.view:target { display:block; }
.public-brand { display:flex; justify-content:center; align-items:center; gap:10px; min-height:72px; margin-bottom:26px; }
.public-brand img { width:45px; height:45px; object-fit:contain; }.public-brand strong,.public-brand small { display:block; }.public-brand strong { font-size:16px; }.public-brand small { font-size:10px; }.public-brand.compact { min-height:55px; margin-bottom:18px; }.public-brand.compact img { width:39px; height:39px; }.public-brand.compact strong { font-size:13px; }
h1,h2,p { margin-top:0; }.home h1 { font-size:20px; margin:0 0 5px; text-align:center; }.lead { max-width:315px; margin:0 auto 20px; text-align:center; color:var(--muted); font-size:12px; }
.home-scan { min-height:260px; margin-top:12px; display:grid; place-content:center; justify-items:center; gap:10px; border:1px solid #c8dce8; border-radius:14px; background:linear-gradient(#f7fbfd,#fff); color:var(--blue); text-align:center; box-shadow:0 12px 28px #0b4d7610; transition:border-color .2s,transform .2s,box-shadow .2s; }.home-scan:hover { border-color:#6ba6c9; transform:translateY(-2px); box-shadow:0 16px 30px #0b4d761c; }.home-scan:focus-visible { outline:3px solid #69afd5; outline-offset:3px; }.home-scan strong { font-size:17px; font-weight:700; }.home-scan small { color:var(--muted); font-size:12px; }.scan-frame { width:76px; height:76px; display:block; margin-bottom:5px; background:linear-gradient(var(--blue),var(--blue)) left top/20px 3px,linear-gradient(var(--blue),var(--blue)) left top/3px 20px,linear-gradient(var(--blue),var(--blue)) right top/20px 3px,linear-gradient(var(--blue),var(--blue)) right top/3px 20px,linear-gradient(var(--blue),var(--blue)) left bottom/20px 3px,linear-gradient(var(--blue),var(--blue)) left bottom/3px 20px,linear-gradient(var(--blue),var(--blue)) right bottom/20px 3px,linear-gradient(var(--blue),var(--blue)) right bottom/3px 20px; background-repeat:no-repeat; opacity:.7; }.home-note { margin:18px 0; text-align:center; color:#8aa0b2; font-size:11px; }
.scan-header { height:65px; margin:-16px -16px 12px; padding:8px 15px; display:flex; align-items:center; gap:9px; background:linear-gradient(135deg,#075b82,#063e5f); border-radius:0 0 12px 12px; color:white; }.scan-header a { margin-left:auto; padding:7px 10px; border:1px solid #ffffff6b; border-radius:7px; font-size:12px; font-weight:700; white-space:nowrap; }.scan-header a:hover { background:#ffffff25; }.scan-header img { width:37px; height:37px; padding:3px; background:white; border-radius:7px; }.scan-header strong,.scan-header small { display:block; }.scan-header strong { font-size:12px; }.scan-header small { font-size:8px; }.scanner h1 { margin:0 0 13px; text-align:center; font-size:17px; }
.camera-frame { height:min(49dvh,395px); min-height:260px; position:relative; display:grid; place-items:center; overflow:hidden; border-radius:12px; background:linear-gradient(115deg,#536365,#a0a99e 40%,#3a4145); color:white; }.camera-blur { position:absolute; inset:0; background:radial-gradient(circle at 72% 27%,#ffffff72,transparent 28%),radial-gradient(circle at 12% 80%,#203033b0,transparent 40%); filter:blur(15px); }.camera-corners { width:215px; height:215px; z-index:1; display:grid; place-items:center; border:4px solid #22bdf2; border-radius:16px; box-shadow:0 0 0 999px #0004; }.qr-art { width:175px; height:175px; background:repeating-conic-gradient(#163448 0 25%,white 0 50%) 0 0/13px 13px; border:8px solid white; }.camera-frame>span { position:absolute; bottom:18px; z-index:1; font-size:11px; }.scan-instruction { margin:15px 0; text-align:center; color:var(--muted); font-size:11px; }
.btn { min-height:41px; padding:11px 16px; display:block; border-radius:7px; background:linear-gradient(#0e67a7,#064980); color:white; text-align:center; font-size:12px; font-weight:700; }
.result { text-align:center; }.result-symbol { width:39px; height:39px; margin:12px auto 7px; display:grid; place-items:center; border-radius:50%; color:white; font-size:24px; font-weight:800; }.result-symbol.success { background:#13a34d; }.result-symbol.error { background:#e63239; }.result-symbol.warning { background:#f3a418; clip-path:polygon(50% 0,100% 100%,0 100%); border-radius:0; font-size:19px; padding-top:9px; }.result h1 { margin:0 0 8px; font-size:17px; }.result-copy { max-width:290px; margin:0 auto 20px; font-size:13px; color:#385a74; }.person-card { margin:10px 0 15px; padding:12px; border:1px solid var(--line); border-radius:10px; text-align:left; }.person-top { display:flex; gap:10px; align-items:center; padding-bottom:10px; border-bottom:1px solid var(--line); }.portrait { width:63px; height:72px; flex:none; display:grid; place-items:center; border-radius:7px; background:linear-gradient(150deg,#dfc3a4,#6d8580); color:white; font-size:19px; font-weight:800; }.person-top h2 { margin:0 0 3px; font-size:12px; }.person-top p { margin:0; color:var(--muted); font-size:11px; }.person-card dl { margin:8px 0 0; display:grid; grid-template-columns:1fr 1fr; gap:0 7px; font-size:11px; }.person-card dt,.person-card dd { padding:4px 0; border-bottom:1px solid #edf2f5; }.person-card dt { color:var(--muted); }.person-card dd { margin:0; font-weight:700; }.status-red { padding:2px 8px; border-radius:99px; background:#ffebed; color:#c72031; }.alert { padding:17px 13px; border-radius:10px; font-size:12px; }.error-alert { background:#fff0f1; color:#a93744; }.result-actions { margin-top:20px; }.text-link { display:block; margin-top:14px; color:var(--blue); font-size:12px; font-weight:700; }
@media(max-width:430px) { body { background:#fff; }.phone { width:100%; height:100dvh; min-height:0; border:0; border-radius:0; box-shadow:none; }.camera-frame { min-height:210px; } }

/* Full-screen public layout. */
html,body { width:100%; height:100%; overflow:hidden; }
body { display:block; background:#fff; }
.phone { width:100%; height:100vh; height:100dvh; min-height:0; border:0; border-radius:0; box-shadow:none; background:radial-gradient(circle at 8% 10%,#eaf5fb,transparent 36%),radial-gradient(circle at 92% 88%,#edf7f5,transparent 34%),#fff; }
.view { width:100%; height:100%; padding:clamp(16px,3vw,32px); overflow:hidden; }
body:not(:has(.view:target)) #home,.home:target { display:flex; flex-direction:column; align-items:center; justify-content:center; }
.home .public-brand,.home h1,.home .lead,.home .home-scan,.home .home-note { width:min(100%,620px); }
.home .public-brand { margin-bottom:16px; }
.home .lead { max-width:520px; margin-bottom:16px; }
.home-scan { min-height:min(35dvh,310px); }
.scanner h1,.scan-instruction { max-width:720px; margin-left:auto; margin-right:auto; }
.scan-header { height:72px; margin:-32px -32px 16px; border-radius:0; }
.scan-header { display:grid; grid-template-columns:minmax(0,1fr) auto; }
.scan-brand { min-width:0; display:flex; align-items:center; gap:9px; }
.scan-brand img { flex:none; }
.scan-header a { margin-left:0; justify-self:end; }
.camera-frame { width:min(100%,720px); height:min(44dvh,420px); margin:auto; }
.result .public-brand,.result .person-card,.result .alert,.result .result-actions { width:min(100%,520px); margin-left:auto; margin-right:auto; }
@media (max-width:430px) { .scan-header { margin:-16px -16px 12px; } }
@media (max-height:650px) {
  .view { padding-top:8px; padding-bottom:8px; }
  .public-brand { min-height:44px; margin-bottom:7px; }
  .public-brand img { width:34px; height:34px; }
  .public-brand.compact { min-height:39px; margin-bottom:5px; }
  .home .lead { margin-bottom:8px; }
  .home-scan { min-height:130px; margin-top:6px; gap:8px; }
  .scan-frame { width:48px; height:48px; }
  .home-note { margin:7px 0; }
  .scan-header { height:54px; margin-top:-8px; }
  .camera-frame { height:min(36dvh,250px); min-height:155px; }
  .camera-corners { width:150px; height:150px; }
  .qr-art { width:122px; height:122px; }
  .scan-instruction { margin:8px auto; }
  .result-symbol { margin:4px auto; }
  .person-card { padding:7px; margin-top:5px; margin-bottom:7px; }
  .person-top { padding-bottom:4px; }
  .portrait { width:45px; height:49px; }
  .person-card dl { margin-top:3px; }
  .person-card dt,.person-card dd { padding:1px 0; }
  .result-actions { margin-top:7px; }
  .result .btn { min-height:35px; padding:8px; }
  .result .text-link { margin-top:6px; }
}

/* Public home uses the same full-height split design as the login page. */
body:not(:has(.view:target)) #home,.home:target { display:block; }
.home { padding:0; }
.home-layout { width:100%; height:100%; display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr); }
.home-brand-panel { position:relative; min-width:0; padding:clamp(30px,4vw,66px); display:flex; flex-direction:column; overflow:hidden; background:radial-gradient(circle at 85% 15%,#168ca866,transparent 38%),linear-gradient(145deg,#155c72,#0e4b62 48%,#0a3149); color:#fff; }
.home-brand-panel::after { position:absolute; right:-190px; bottom:-250px; width:680px; height:680px; border-radius:50%; background:repeating-radial-gradient(circle,transparent 0 31px,#8ac9d126 32px 33px); content:""; pointer-events:none; }
.home-brand-lockup,.home-identity,.home-brand-footer { position:relative; z-index:1; }
.home-brand-lockup { display:flex; align-items:center; gap:16px; }
.brand-logo { width:82px; height:82px; flex:none; display:grid; place-items:center; border-radius:20px; background:white; box-shadow:0 12px 25px #00223140; }
.brand-logo img { width:68px; height:68px; object-fit:contain; }
.home-brand-lockup strong,.home-brand-lockup small { display:block; }
.home-brand-lockup strong { max-width:205px; font-size:16px; line-height:1.3; }.home-brand-lockup small { margin-top:5px; color:#d0e7eb; font-size:14px; }
.home-identity { margin:auto 0; }
.identity-eyebrow { display:flex; align-items:center; gap:10px; color:#c5e2e8; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.identity-eyebrow i { width:8px; height:8px; border-radius:50%; background:#f3a052; box-shadow:0 0 0 4px #f3a0522b; }
.home-identity h1 { width:auto; margin:25px 0 18px; color:white; font-size:clamp(42px,5.3vw,76px); line-height:1.07; letter-spacing:-.06em; text-align:left; }
.home-identity h1 em { color:#ffc88f; font-style:normal; }.home-identity p { max-width:410px; margin:0; color:#c6e0e5; font-size:16px; line-height:1.7; }
.home-brand-footer { margin:0; color:#bad8dd; font-size:11px; }
.home-action-panel { min-width:0; padding:clamp(28px,4vw,64px); display:flex; flex-direction:column; background:#fff; }
.home-button,.verified-home { min-height:38px; padding:8px 14px; display:inline-flex; align-items:center; gap:8px; align-self:flex-start; border:1px solid #d5e5eb; border-radius:9px; background:#f7fafb; color:#0e5c77; font-size:13px; font-weight:700; }
.home-button:hover,.verified-home:hover { background:#e8f3f6; }
.home-brand-panel .home-button { position:relative; z-index:1; margin-top:24px; border-color:#ffffff70; background:#ffffff1c; color:#fff; }
.home-brand-panel .home-button:hover { background:#ffffff30; }
.home-content { width:min(100%,440px); margin:auto; }
.home-icon { width:70px; height:70px; margin-bottom:25px; display:grid; place-items:center; border:1px solid #d7e9ec; border-radius:18px; background:linear-gradient(145deg,#eff8f8,#e4f1f3); color:#126a83; box-shadow:0 8px 18px #1b61700d; }
.home-icon svg { width:42px; height:42px; }
.form-eyebrow { color:#a85b1d; font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.home-content h2 { margin:12px 0 11px; color:#183b4d; font-size:clamp(34px,3.8vw,52px); line-height:1.12; letter-spacing:-.055em; }.home-content h2 span,.verified-title h1 span { color:#ee842e; }
.home-content>p { max-width:400px; margin:0 0 30px; color:#708596; font-size:15px; line-height:1.7; }
.scan-action { width:100%; min-height:58px; padding:0 21px; display:flex; align-items:center; justify-content:space-between; border-radius:10px; background:linear-gradient(110deg,#116a82,#0a506b); color:white; box-shadow:0 11px 20px #0d5b772e; font-size:15px; font-weight:700; transition:transform .2s,box-shadow .2s; }
.scan-action:hover { transform:translateY(-2px); box-shadow:0 14px 24px #0d5b7742; }.scan-action span:last-child { font-size:22px; font-weight:400; }
.code-verify-form { margin-top:21px; padding-top:17px; border-top:1px solid #e0e9ee; }
.code-verify-form label { display:block; margin-bottom:10px; color:#24495d; font-size:13px; font-weight:700; }
.code-entry-row { display:flex; gap:9px; }
.code-entry-row input { min-width:0; height:48px; flex:1; padding:0 14px; border:1px solid #cbdde6; border-radius:9px; background:#f8fbfc; color:#153b50; font:inherit; font-size:14px; }
.code-entry-row input::placeholder { color:#8aa1af; }
.code-entry-row input:focus { outline:2px solid #77c2d3; outline-offset:1px; border-color:#16738d; background:#fff; }
.code-entry-row button { min-width:102px; padding:0 15px; border:0; border-radius:9px; background:#e7f3f5; color:#0a526c; font:inherit; font-weight:700; cursor:pointer; }
.code-entry-row button:hover { background:#d5ebef; }
.code-entry-row button:focus-visible { outline:3px solid #77c2d3; outline-offset:2px; }
.home-panel-footer { margin:0; color:#9aadb5; font-size:11px; }
.scan-preview-link { width:min(100%,720px); margin:10px auto 0; display:block; color:#0b608d; text-align:center; font-size:12px; font-weight:700; }
.scan-preview-link:hover { text-decoration:underline; }
#qr-reader { position:absolute; inset:0; z-index:2; overflow:hidden; border-radius:14px; }
#qr-reader video { width:100% !important; height:100% !important; object-fit:cover; }
#qr-reader img { max-width:100%; }
.camera-frame>span { z-index:3; pointer-events:none; }
.verified-real-photo { width:100%; height:250px; object-fit:cover; border-radius:11px; }
.verified-loading .verified-main { visibility:hidden; }
.verified-state { width:min(100%,650px); margin:auto; padding:32px; border:1px solid #d7e5eb; border-radius:16px; background:white; text-align:center; box-shadow:0 15px 35px #18485c12; }
.verified-state h1 { margin:0 0 10px; color:#12364a; }.verified-state p { color:#728a98; }.verified-state a { color:#0a658b; font-weight:700; }
@media(max-width:850px) { .verified-real-photo { height:175px; } }
@media(max-width:600px) { .verified-real-photo { height:112px; } }

/* Separate verified identity record. */
.verified-body { background:#f4f8fa; }
.verified-shell { width:100%; height:100vh; height:100dvh; display:flex; flex-direction:column; overflow:hidden; background:radial-gradient(circle at 0 0,#e4f2f4,transparent 34%),#f5f9fa; }
.verified-topbar { min-height:76px; padding:12px clamp(16px,3vw,42px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; background:linear-gradient(115deg,#155c72,#0a3a54); color:#fff; }
.verified-home { justify-self:start; border-color:#ffffff59; background:#ffffff1c; color:#fff; }.verified-home:hover { background:#ffffff30; }
.verified-brand { display:flex; align-items:center; gap:10px; }.verified-brand img { width:46px; height:46px; padding:4px; border-radius:10px; background:white; object-fit:contain; }.verified-brand strong,.verified-brand small { display:block; white-space:nowrap; }.verified-brand strong { font-size:15px; }.verified-brand small { color:#d8eaee; font-size:10px; }
.preview-badge { justify-self:end; padding:6px 10px; border:1px solid #ffffff63; border-radius:99px; color:#dbedf1; font-size:11px; }
.verified-main { width:min(calc(100% - 32px),1120px); min-height:0; margin:auto; padding:18px 0; display:flex; flex-direction:column; justify-content:center; gap:18px; }
.verified-title { display:flex; align-items:center; gap:15px; }.verified-check { width:58px; height:58px; flex:none; display:grid; place-items:center; border-radius:16px; background:#e0f4e9; color:#168552; font-size:30px; font-weight:800; }.verified-title h1 { margin:3px 0 2px; color:#12364a; font-size:clamp(25px,3vw,38px); line-height:1.1; letter-spacing:-.04em; }.verified-title p { margin:0; color:var(--muted); font-size:13px; }
.verified-card { display:grid; grid-template-columns:220px minmax(0,1fr); gap:28px; padding:24px; border:1px solid #d7e5eb; border-radius:16px; background:white; box-shadow:0 15px 35px #18485c12; }
.verified-photo { min-width:0; }.photo-placeholder { width:100%; height:250px; overflow:hidden; border-radius:11px; background:#dbe9ee; }.photo-placeholder svg { width:100%; height:100%; object-fit:cover; }.verified-photo>span { display:block; margin-top:8px; color:#79909c; text-align:center; font-size:10px; }
.verified-info { min-width:0; }.record-label { color:#8b5a2c; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.verified-name { padding-bottom:14px; border-bottom:1px solid #e4edf0; }.verified-name h2 { margin:5px 0 4px; color:#0b3148; font-size:22px; line-height:1.2; }.verified-name p { margin:0; color:var(--muted); font-size:12px; }.verified-name strong { color:#0b4d76; }
.verified-data { margin:18px 0 0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 18px; }.verified-data div { min-width:0; }.verified-data dt { color:#7e929d; font-size:11px; }.verified-data dd { margin:2px 0 0; color:#173a50; font-size:13px; font-weight:700; }
.verified-message { min-height:70px; padding:15px 20px; display:flex; align-items:center; gap:14px; border:1px solid #b9e4cb; border-radius:12px; background:#eaf8ef; color:#185a38; }.verified-message span { width:32px; height:32px; flex:none; display:grid; place-items:center; border-radius:50%; background:#1b9a5c; color:white; font-size:20px; font-weight:800; }.verified-message p { margin:0; font-size:14px; font-weight:700; }
@media (max-width:850px) { .verified-card { grid-template-columns:145px minmax(0,1fr); gap:15px; padding:15px; }.photo-placeholder { height:175px; }.verified-data { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) {
  .home-layout { grid-template-columns:1fr; grid-template-rows:clamp(175px,33dvh,285px) minmax(0,1fr); }
  .home-brand-panel { padding:18px 24px; }
  .brand-logo { width:58px; height:58px; border-radius:15px; }.brand-logo img { width:50px; height:50px; }.home-brand-lockup strong { font-size:13px; }.home-brand-lockup small { font-size:12px; }
  .identity-eyebrow,.home-brand-footer { display:none; }.home-identity h1 { margin:5px 0 6px; font-size:clamp(28px,7vw,40px); }.home-identity h1 br { display:none; }.home-identity h1 em { margin-left:.2em; }.home-identity p { max-width:430px; font-size:12px; line-height:1.4; }
  .home-action-panel { padding:18px 24px 14px; }.home-button { min-height:32px; padding:5px 11px; }.home-icon { width:55px; height:55px; margin-bottom:16px; font-size:29px; }.home-content h2 { font-size:clamp(30px,7vw,39px); }.home-content>p { margin-bottom:18px; font-size:13px; line-height:1.5; }.scan-action { min-height:52px; }.code-verify-form { margin-top:16px; padding-top:13px; }
  .verified-topbar { min-height:65px; grid-template-columns:auto 1fr; }.verified-brand { justify-self:end; }.verified-brand img { width:38px; height:38px; }.verified-brand strong { font-size:12px; }.verified-brand small { font-size:9px; }.preview-badge { display:none; }
  .verified-main { gap:10px; padding:12px 0; }.verified-check { width:44px; height:44px; font-size:24px; }.verified-title h1 { font-size:25px; }.verified-title p { font-size:11px; }
  .verified-card { grid-template-columns:92px minmax(0,1fr); gap:12px; padding:12px; }.photo-placeholder { height:112px; }.verified-photo>span { font-size:9px; }.verified-name { padding-bottom:7px; }.verified-name h2 { font-size:15px; }.verified-name p { font-size:10px; }.verified-data { margin-top:7px; gap:7px 8px; }.verified-data dt { font-size:9px; }.verified-data dd { font-size:11px; }.verified-message { min-height:58px; padding:10px 12px; }.verified-message p { font-size:12px; }
}
@media (max-height:620px) and (max-width:760px) {
  .home-layout { grid-template-rows:92px minmax(0,1fr); }.home-brand-panel { padding:12px 18px; }.home-identity { display:none; }.home-action-panel { padding:10px 18px; }.home-icon { width:43px; height:43px; margin-bottom:8px; font-size:23px; }.home-content h2 { margin:6px 0; font-size:29px; }.home-content>p { margin-bottom:10px; }.home-panel-footer { display:none; }.code-verify-form { margin-top:10px; padding-top:9px; }.code-verify-form label { margin-bottom:6px; font-size:11px; }.code-entry-row input { height:40px; }.code-entry-row button { min-width:86px; }
  .verified-topbar { min-height:54px; padding:6px 12px; }.verified-home { min-height:32px; padding:5px 9px; }.verified-brand img { width:32px; height:32px; }.verified-main { gap:6px; padding:6px 0; }.verified-title h1 { font-size:20px; }.verified-title p { display:none; }.verified-check { width:34px; height:34px; font-size:20px; }.verified-card { padding:8px; gap:8px; }.photo-placeholder { height:80px; }.verified-photo>span { display:none; }.verified-name h2 { font-size:13px; }.verified-data { gap:4px 6px; }.verified-data dt { font-size:8px; }.verified-data dd { margin-top:0; font-size:10px; }.verified-message { min-height:43px; padding:6px 8px; }.verified-message span { width:25px; height:25px; font-size:16px; }.verified-message p { font-size:11px; }
}
@media (max-width:760px) { .home-brand-panel .home-button { margin-top:12px; } }
@media (max-width:760px) { .home-icon svg { width:34px; height:34px; } }
@media (max-width:760px) and (max-height:620px) { .home-brand-panel .home-button { position:fixed; z-index:10; top:103px; left:18px; margin:0; border-color:#d5e5eb; background:#f7fafb; color:#0e5c77; }.home-brand-panel .home-button:hover { background:#e8f3f6; } }
@media (max-width:760px) and (max-height:620px) { .home-icon svg { width:27px; height:27px; } }