:root{font-family:system-ui,-apple-system,sans-serif;color:#1a1a2e;background:#e7ebef;font-size:14px}*{box-sizing:border-box}body{margin:0 auto;max-width:520px;min-height:100vh;background:#f0f2f5}header{background:linear-gradient(135deg,#0a1628,#14304d);color:#fff;display:flex;gap:10px;align-items:center;padding:16px;position:sticky;top:0;z-index:5}header strong{font-size:16px}header small{display:block;font-size:10px;color:#7ec8e3;margin-top:2px}.brandmark{font-size:20px;border:1.5px solid #8ba9c3;border-radius:6px;padding:0 5px}.pill{margin-left:auto;white-space:nowrap;border-radius:20px;background:#e8f5e9;color:#226a36;padding:5px 8px;font-size:10px}main{padding:0 16px 76px}.welcome{text-align:center;padding:32px 0 18px}.welcome-icon{width:68px;height:68px;background:linear-gradient(135deg,#0a1628,#14304d);color:white;font-size:36px;border-radius:18px;margin:0 auto 16px;padding-top:7px}h1{font-size:23px;margin:0 0 8px}p{font-size:12px;line-height:1.6;color:#647184}.welcome p{margin:0}.role{display:flex;width:100%;background:#fff;border:1.5px solid #e0e5eb;border-radius:12px;padding:18px 14px;gap:12px;text-align:left;align-items:center;color:#19304b;margin:12px 0}.role>span:nth-child(2){flex:1}.role strong{font-size:15px}.role small{display:block;font-weight:400;font-size:11px;color:#7a8590;margin-top:4px}.role-icon{font-size:20px;width:34px;height:34px;text-align:center;border-radius:50%;padding-top:2px}.blue{color:#1565c0;background:#e3f2fd}.green{color:#2e7d32;background:#e8f5e9}.installbox{background:#fff8e1;border:1px solid #ffe082;border-radius:10px;padding:14px;margin-top:24px;font-size:12px}.installbox p{font-size:11px;color:#6d4c00;margin:6px 0 0}.card{background:white;border-radius:12px;padding:16px;margin:12px 0;border:1px solid #e5e8ec}h2{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#14304d;margin:0 0 12px}label{display:block;font-size:12px;font-weight:500;color:#555;margin:12px 0}label span{color:#dc2626}input,textarea{display:block;width:100%;font:inherit;color:#26374a;background:#fafafa;border:1px solid #d7dde3;border-radius:8px;padding:12px 11px;margin-top:6px;font-size:16px}input:focus,textarea:focus{outline:2px solid #5284ad;outline-offset:1px}textarea{resize:vertical}button{font-family:inherit;font-size:12px;font-weight:600;padding:11px 13px;border-radius:8px;border:0;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.primary{color:white;background:linear-gradient(135deg,#0a1628,#14304d)}.secondary{background:#e8eff6;color:#14304d;border:1px solid #d2dfeb}.wide{width:100%;padding:13px}.textbutton{background:none;color:#32618a;padding:6px}.toolbar,.userbar{display:flex;align-items:center;gap:10px;justify-content:space-between}.toolbar h2{margin:0}.userbar{font-size:11px;margin:14px 0;color:#69788a;overflow-wrap:anywhere}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.stats div{background:#fff;border:1px solid #e4e8ed;border-radius:10px;text-align:center;padding:12px 5px}.stats strong{font:700 23px ui-monospace,monospace;color:#1565c0;display:block}.stats div:first-child strong{color:#df6b0d}.stats div:nth-child(2) strong{color:#2e7d32}.stats small{display:block;font-size:9px;text-transform:uppercase;color:#85909a;margin-top:5px}#tabs{display:flex;gap:6px;margin-bottom:16px}#tabs button{flex:1;color:#536b83;background:#e5eaf0;padding:11px 5px;font-size:11px}#tabs button.selected{background:#14304d;color:white}.bottomnav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;display:flex;background:#fff;border-top:1px solid #e4e7ec;padding:7px 4px max(10px,env(safe-area-inset-bottom));z-index:10}.bottomnav button{flex:1;font-size:20px;background:none;color:#14304d;padding:2px}.bottomnav small{display:block;font-size:10px;margin-top:3px;font-weight:500}.record{background:#fff;border:1px solid #e3e7eb;border-radius:10px;margin:9px 0;padding:14px;overflow-wrap:anywhere}.record strong{font-size:13px;color:#14304d}.record p{margin:8px 0;white-space:pre-wrap;color:#45586d}.record small{font-size:10px;color:#7a8796}.badge{float:right;padding:3px 8px;border-radius:20px;background:#e8f5e9;color:#2e7d32;font-size:10px}.badge.pending{background:#fff3e0;color:#e65100}.report-id{font-family:ui-monospace,monospace;font-size:10px;color:#1565c0;margin-bottom:7px}.record summary{font-size:11px;color:#1565c0;cursor:pointer;margin-top:10px}.record dl,.confirmation dl{margin:12px 0;font-size:12px}.record dt,.confirmation dt{color:#8792a0;margin-top:8px}.record dd,.confirmation dd{margin:3px 0;overflow-wrap:anywhere;white-space:pre-wrap}.hint{font-size:11px}.center{text-align:center}.columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.confirmation{text-align:center;padding:28px 16px}.confirmation h2{font-size:18px;text-transform:none;letter-spacing:0;color:#2e7d32}.confirmation dl{text-align:left;padding:12px;background:#f8fafb;border-radius:8px}.successmark{font-size:32px;width:60px;height:60px;background:#e8f5e9;color:#2e7d32;border-radius:50%;margin:0 auto 16px;padding-top:5px}.backupbox{font-size:11px;color:#52728f;margin-top:15px}.readiness{font-size:10px;text-align:center;color:#667e93}#message:empty{display:none}#message{background:#fff8df;border:1px solid #e4cf90;padding:13px;border-radius:8px;white-space:pre-line;color:#614d18;margin-top:16px}footer{text-align:center;color:#8a95a0;font-size:10px;line-height:1.7;margin:26px 0 10px}[hidden]{display:none!important}@media(min-width:600px){body{box-shadow:0 0 50px #18304818}}@media(prefers-reduced-motion:no-preference){.card,.record{animation:appear .2s ease-out}@keyframes appear{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:none}}}
