.device-demo{display:flex;align-items:center;gap:18px;justify-content:center;margin:30px 0}.screen{width:240px;height:320px;flex-shrink:0;background:white;border:1px solid #d2dce9;box-shadow:0 20px 50px #3e587425;position:relative;overflow:hidden}.status{height:28px;padding:5px 12px;display:flex;justify-content:space-between;font-size:10px;color:#7a8ba3}#face{height:234px;padding:8px 14px;overflow:auto;font-size:13px;text-align:center}#face h2{font-size:19px}.profile-avatar{width:76px;height:76px;margin:14px auto 6px;background:#edf1f7;border-radius:50%;display:grid;place-items:center;color:#8c9bb1}.profile h2{margin:10px 0}.profile p{font-size:11px;color:#9aa7b9}.dock{position:absolute;bottom:0;left:0;width:240px;height:56px;border-top:1px solid #dde4ef;display:flex;align-items:center;background:#f1f5fa;gap:4px;padding:4px}.dock span{flex:1;font-size:12px;text-align:center;padding:10px 0;color:#8595ac;border-radius:7px}.dock .selected{background:#5976a6;color:white}.keys{display:flex;flex-direction:column;gap:30px}.keys button{width:48px;height:45px;padding:0;font-size:13px;background:#e4eaf3;color:#516b91;border:1px solid #ccd7e7}.whale{width:112px;height:112px;object-fit:contain;display:block;margin:auto}#face p{overflow-wrap:anywhere}main{max-width:750px;text-align:center}main h1{font-size:28px}.device-demo+ p{max-width:480px;margin:20px auto}

#face h2{margin:3px 0 6px;font-size:18px}.whale{width:100px;height:100px}#face>p{font-size:11px;margin:8px 0}

.screen{background:radial-gradient(ellipse at 15% 30%,#064668aa,transparent 60%),linear-gradient(#071c36,#073e5c);color:#eafaff;border-color:#1c4862;box-shadow:0 18px 50px #061e3d38}.status{color:#def4ff;font-weight:600;height:28px;font-size:14px;padding:3px 12px}#face{height:226px;padding:8px 10px}.identity{display:grid;grid-template-columns:104px 1fr;align-items:start;gap:4px;text-align:left;padding-top:23px}.identity>img{width:108px;height:116px;object-fit:contain;margin-top:12px}.identity h2{font-size:20px!important;letter-spacing:.2px;text-shadow:0 0 8px #c8ffff66;margin:0 0 13px!important}.identity strong{display:block;color:#5cffa5;font-size:13px}.identity b{display:block;color:#5cffa5;font-size:27px;line-height:1.15;text-shadow:0 0 8px #5cffa5aa}.identity span{font-size:12px}.token-track{height:6px;background:#1e7183;border:1px solid #369ca9;border-radius:9px;margin:8px 0}.home-state{font-size:11px;color:#95c5d6;text-align:left;padding-top:15px}.dock{height:66px;background:#07334c;border-top:1px solid #24607a;gap:7px;padding:6px}.dock span{border:1px solid #256a7b;border-radius:8px;background:#082c46;color:#badde7;height:52px;padding:4px 0;font-weight:600;line-height:1.25;font-size:17px}.dock span small{display:block;font-size:11px;font-weight:400;line-height:1.5;margin-top:3px}.dock .selected{border-color:#50ffad;color:#6affb8;background:#0b4a50;box-shadow:0 0 8px #4bff9e88,inset 0 0 8px #45ff9f20}.dock span:only-child{flex:1}.screen #face>h2{color:#effcff}.screen #face>p:not(.home-state){color:#b4dce9}

.identity{padding-top:17px}.home-state{padding-top:0!important;margin:9px 0 0!important}