:root{color-scheme:light;--blue:#185897;--blue-dark:#104678;--coral:#ff7676;--ink:#192b42;--muted:#69798c;--line:#e2e8f0;--green:#238568;--font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;font-family:var(--font);color:var(--ink);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:var(--blue)}.portal-page{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 93% 10%,#fff1f0 0,transparent 37%),radial-gradient(ellipse at 0 80%,#eaf2fb 0,transparent 42%),#f7f9fc}.site-header{width:min(1160px,100%);margin:0 auto;padding:27px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:inline-flex;align-items:center;gap:11px;color:var(--blue);text-decoration:none;line-height:1.3;font-size:15px;font-weight:650;letter-spacing:-.25px}.brand img{width:34px;height:38px}.brand>span>span{display:block}.private-badge{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#53718d;background:#fff9;border:1px solid #dce6f0;border-radius:30px;padding:6px 12px;white-space:nowrap}svg{stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.private-badge svg{width:14px;height:14px}.portal-main{width:min(1040px,100%);margin:24px auto 46px;padding:0 28px;flex:1}.page-heading{text-align:center;margin:0 auto 30px;max-width:760px}.eyebrow{display:block;color:var(--blue);font-size:10px;font-weight:750;letter-spacing:1.9px}.page-heading h1{font-size:38px;line-height:1.18;letter-spacing:-1.6px;font-weight:650;margin:12px 0 13px}.page-heading>p{color:var(--muted);font-size:15px;margin:0}.setup-card{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);border:1px solid #dce5ef;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 18px 55px -30px #153e6b35}.setup-steps{padding:32px 34px 35px}.card-intro{display:flex;align-items:center;gap:14px;margin-bottom:30px}.notes-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:48px;background:#fff4ce;border:1px solid #f1e4bf;border-radius:12px;box-shadow:0 2px 6px #a3781a0a;overflow:hidden}.notes-icon svg{width:32px;height:37px;stroke:none}.card-intro h2{font-size:17px;line-height:1.4;letter-spacing:-.4px;margin:0 0 4px;font-weight:650}.card-intro p{color:var(--muted);font-size:12px;margin:0}.step{display:flex;gap:15px}.step-number{width:29px;height:29px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff0f0;color:#b64449;border:1px solid #ffdadb;font-weight:650;font-size:12px;margin-top:1px}.step-muted{background:#edf3fa;color:var(--blue);border-color:#dce7f4}.step-content{flex:1}.step h3{font-size:16px;line-height:1.45;letter-spacing:-.3px;margin:1px 0 8px;font-weight:650}.step p{font-size:13px;line-height:1.65;color:var(--muted);margin:0 0 18px}.step-divider{height:1px;background:var(--line);margin:25px 0 25px 44px}.button{display:inline-flex;justify-content:center;align-items:center;gap:18px;border:1px solid transparent;border-radius:9px;font-size:13px;font-weight:600;line-height:1.3;padding:12px 18px;cursor:pointer;text-decoration:none;transition:background .15s,box-shadow .15s,transform .15s;min-height:43px}.button:hover{transform:translateY(-1px)}.button:focus-visible,a:focus-visible{outline:3px solid #ffaaa9;outline-offset:3px}.button-primary{background:var(--blue);color:#fff;box-shadow:0 4px 9px #18589719}.button-primary:hover{background:var(--blue-dark);box-shadow:0 5px 12px #18589728}.button-secondary,.button-small{background:#fff;border-color:#cbd9e8;color:var(--blue)}.button-secondary:hover,.button-small:hover{background:#f0f5fb;border-color:#a2bad4}.connection-summary{background:linear-gradient(155deg,#f1f6fc,#f7faff);padding:34px 29px;border-left:1px solid #e1e9f3}.summary-icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:#e3edf9;border:1px solid #d4e3f5;border-radius:12px;color:var(--blue);margin-bottom:22px}.summary-icon svg{width:22px;height:22px}.connection-summary .eyebrow{font-size:9px;letter-spacing:1.4px;color:#6a87a8}.connection-summary h2{font-size:25px;line-height:1.25;letter-spacing:-.9px;margin:9px 0 13px;font-weight:600;color:#234b77}.connection-summary>p{font-size:13px;color:#6a7f96;line-height:1.75;margin:0}.summary-divider{height:1px;background:#dce6f2;margin:23px 0 21px}.connection-summary h3{font-size:11px;font-weight:650;color:#536d89;margin:0 0 12px}.permission-list{padding:0;list-style:none;font-size:12px;color:#365774;margin:0}.permission-list li{display:flex;align-items:center;gap:8px;margin:9px 0}.permission-check{color:var(--green);font-size:13px}.apple-note{display:flex;gap:8px;margin-top:24px;padding-top:18px;border-top:1px solid #dce6f2;color:#7c8fa3}.apple-note>svg{width:14px;height:14px;flex-shrink:0;margin-top:3px}.apple-note p{font-size:10px;line-height:1.75;margin:0}.site-footer{padding:10px 25px 26px;text-align:center;display:flex;flex-direction:column;align-items:center;color:#8190a0;font-size:11px;gap:2px}.footer-assurance{display:flex;align-items:center;gap:6px;font-size:12px;color:#577b72;font-weight:550}.footer-assurance svg{width:13px;height:13px}.footer-detail{font-size:10px;color:#8a97a7}.footer-company{font-size:9px;letter-spacing:.3px;margin-top:14px;color:#9ba6b4}.welcome-card,.message-card{max-width:620px;margin:0 auto;text-align:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:38px;box-shadow:0 18px 55px -30px #153e6b35}.welcome-card>.notes-icon{width:58px;height:63px;margin:2px 0 13px}.welcome-card h2{font-size:24px;letter-spacing:-.7px;margin:6px 0 10px}.welcome-card>p{color:var(--muted);font-size:14px;max-width:390px;margin:0 auto 24px}.welcome-card>.quiet-copy{font-size:11px;margin:20px auto 0}.message-card p{color:var(--muted);font-size:14px}.status-label{display:block;color:var(--green);font-size:9px;font-weight:650;letter-spacing:1.3px;margin:8px 0 13px}.small-notice{margin-top:27px;padding-top:19px;border-top:1px solid var(--line);font-size:11px;color:#7c8a9a}.viewer-page{background:#f3f6fa;min-height:100vh;display:flex;flex-direction:column}.viewer-page .site-header{max-width:none;padding:15px 25px;background:#fff;border-bottom:1px solid var(--line)}.viewer-main{display:flex;flex:1;min-height:0;padding:18px 22px}.browser-shell{display:flex;flex:1;min-width:0;flex-direction:column;background:#fff;border:1px solid #d7e0ec;border-radius:14px;overflow:hidden;box-shadow:0 5px 20px #17385b08}.browser-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#fff;border-bottom:1px solid var(--line)}.browser-title{display:flex;align-items:center;gap:9px;line-height:1.4}.browser-title .notes-icon{width:28px;height:31px;border-radius:7px}.browser-title .notes-icon svg{width:23px;height:26px}.browser-title strong{font-size:12px;font-weight:650}.browser-title>div>span{font-size:10px;color:var(--muted);display:block}.browser-actions{display:flex;align-items:center;gap:8px}.button-small{padding:7px 10px;min-height:32px;font-size:10px;gap:4px}.browser-status{font-size:10px;color:#7c8da0;margin-right:5px}.browser-status[data-state=connected]{color:var(--green)}.browser-status[data-state=failed]{color:#b64449}.browser-stage{position:relative;flex:1;min-height:560px;background:#20252b;overflow:hidden}.browser-stage:fullscreen{width:100vw;height:100vh}.viewer-page:has(.browser-shell){height:100vh}.viewer-page .site-footer{padding:0 15px 12px;gap:0}.viewer-page .footer-detail,.viewer-page .footer-company{display:none}.viewer-page .footer-assurance{font-size:10px}#browser-screen{position:absolute;inset:0}#browser-screen canvas{display:block}.browser-overlay{position:absolute;inset:0;background:#f7f9fc;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px}.browser-overlay h1{font-size:22px;letter-spacing:-.6px;font-weight:600;margin:18px 0 8px}.browser-overlay p{font-size:13px;color:var(--muted);max-width:340px;margin:0 0 20px}.connection-spinner{height:29px;width:29px;border:2px solid #d7e5f4;border-top-color:var(--blue);border-radius:50%;animation:spin .8s linear infinite}[hidden]{display:none!important}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(min-width:1300px){.portal-main{margin-top:48px}.page-heading{margin-bottom:38px}.page-heading h1{font-size:42px}.setup-steps{padding:38px 40px}.connection-summary{padding:38px 32px}}
@media(max-width:760px){.site-header{padding:20px 22px}.brand{font-size:12px;gap:9px}.brand img{width:29px;height:33px}.private-badge{padding:5px 8px;font-size:10px;gap:5px}.private-badge svg{width:12px}.portal-main{margin:16px auto 30px;padding:0 20px}.page-heading{margin-bottom:24px}.page-heading h1{font-size:31px;letter-spacing:-1.15px}.page-heading>p{font-size:13px;max-width:340px;margin:auto}.setup-card{grid-template-columns:1fr}.setup-steps{padding:27px}.connection-summary{border-left:0;border-top:1px solid #e1e9f3;padding:23px 27px}.summary-icon{float:right;width:35px;height:35px;margin:0}.connection-summary h2{font-size:22px;margin-bottom:9px}.connection-summary>p{font-size:12px;max-width:380px}.summary-divider{margin:17px 0}.connection-summary h3{margin-bottom:8px}.permission-list{display:flex;flex-wrap:wrap;gap:4px 18px}.permission-list li{margin:3px 0}.apple-note{margin-top:17px;padding-top:13px}.apple-note p{font-size:10px}.welcome-card,.message-card{padding:28px}.site-footer{padding-bottom:20px}.viewer-page .site-header{padding:13px 16px}.viewer-main{padding:10px}.browser-toolbar{padding:10px;align-items:flex-start}.browser-actions{flex-wrap:wrap;justify-content:flex-end;gap:5px}.browser-status{width:100%;text-align:right}.browser-stage{min-height:420px}.viewer-page .private-badge{font-size:9px}.viewer-page .brand{font-size:10px}}
@media(max-width:390px){.private-badge{font-size:0;padding:7px}.brand{font-size:11px}.page-heading h1{font-size:27px}.setup-steps{padding:22px 19px}.card-intro h2{font-size:15px}.card-intro p{font-size:11px}.step{gap:11px}.step-number{width:25px;height:25px}.step p{font-size:12px}.step-divider{margin-left:36px}.button{font-size:12px;padding:11px 14px}.button-small{padding:6px 8px;font-size:9px}}
