:root{color-scheme:light;--navy:#06133a;--blue:#074cd7;--ink:#101b35;--muted:#586780;--line:#dce5f3}
*{box-sizing:border-box}
html{min-height:100%;background:var(--navy)}
body{margin:0;min-height:100svh;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:radial-gradient(ellipse at 80% 0%,#174d9b 0,transparent 55%),linear-gradient(145deg,#0a225f,var(--navy) 70%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}
.card{width:min(100%,400px);padding:28px 26px 24px;border-radius:30px;background:#fff;box-shadow:0 28px 90px #0005;position:relative;border:1px solid #ffffff6b}
.card:before{content:"";position:absolute;left:26px;right:26px;top:0;height:3px;background:linear-gradient(90deg,transparent,#0868f2,transparent)}
.brand{text-align:center;padding-bottom:24px}
.logo{display:block;width:100%;max-width:310px;height:auto;margin:0 auto 10px}
.brand p{margin:0;font-size:1rem;line-height:1.55;color:var(--muted);font-weight:500}
.actions{display:grid;gap:12px}
a{-webkit-tap-highlight-color:transparent;text-decoration:none;color:inherit;touch-action:manipulation}
.action{display:flex;align-items:center;justify-content:center;gap:12px;min-height:62px;border:1px solid var(--line);border-radius:16px;background:#f5f8ff;font-size:1rem;font-weight:650;transition:background .16s,transform .16s,box-shadow .16s}
.primary{background:linear-gradient(110deg,#074cd7,#0868f2);color:#fff;border:0;box-shadow:0 8px 20px #074cd72b}
.google{background:#fff;color:var(--navy)}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{flex-direction:column;gap:9px;min-height:96px;color:var(--navy)}
svg{width:23px;height:23px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.dot{fill:currentColor;stroke:none}
.tile svg{color:var(--blue);width:25px;height:25px}
footer{border-top:1px solid var(--line);margin-top:24px;padding-top:18px;text-align:center}
.location{display:flex;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-size:.875rem;margin:0 0 12px}
.location svg{height:16px;width:16px}
.save{display:flex;justify-content:center;align-items:center;gap:8px;min-height:44px;font-size:.9375rem;font-weight:650;color:var(--blue);border-radius:12px}
.save svg{height:20px;width:20px}
a:focus-visible{outline:3px solid #0868f2;outline-offset:4px}
@media(hover:hover){.action:hover{transform:translateY(-2px);box-shadow:0 6px 18px #06133a12}.primary:hover{background:#0643bd}.save:hover{background:#f5f8ff}}
.action:active{transform:scale(.98)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.toast{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:16px;right:16px;margin:auto;max-width:400px;padding:12px 16px;border-radius:12px;background:#06133a;color:#fff;box-shadow:0 8px 24px #0003;text-align:center;font-size:.875rem;z-index:5}
@media(max-height:680px){.card{padding:18px 22px 16px;border-radius:24px}.brand{padding-bottom:16px}.logo{max-width:270px;margin-bottom:6px}.brand p{line-height:1.4}.actions,.pair{gap:10px}.action{min-height:54px}.tile{min-height:78px;gap:6px}footer{margin-top:16px;padding-top:12px}.location{margin-bottom:5px}}
@media(max-height:540px){body{padding:10px}.card{padding:12px 20px}.logo{max-width:215px;margin-bottom:2px}.brand{padding-bottom:10px}.brand p{font-size:.875rem}.actions,.pair{gap:8px}.action{min-height:46px;font-size:.875rem}.tile{min-height:60px;flex-direction:row}.tile svg{width:20px;height:20px}footer{margin-top:10px;padding-top:8px}.save{min-height:38px}}
@media(prefers-reduced-motion:reduce){.action{transition:none}}
.save{min-height:56px;font-size:1rem;background:#eaf2ff;border:1px solid #b6cdf7;border-radius:16px;font-weight:700;gap:10px}
.save svg{width:23px;height:23px}
@media(min-height:700px){.card{min-height:min(740px,calc(100svh - 40px));display:flex;flex-direction:column;justify-content:center;padding-top:32px;padding-bottom:28px}.brand{padding-bottom:28px}.actions{gap:16px}.action{min-height:70px}.tile{min-height:112px}.pair{gap:16px}footer{margin-top:28px;padding-top:20px}.location{margin-bottom:16px}}
@media(max-height:540px){.save{min-height:44px;font-size:.875rem}}
/* Identidade premium: azul profundo, brilho discreto e símbolo original. */
body{background:radial-gradient(ellipse at 100% 0%,#0868f255,transparent 55%),radial-gradient(ellipse at 0% 100%,#074cd733,transparent 60%),linear-gradient(145deg,#0a225f,#030a21 80%)}
.card{isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 100% 0%,#e4efff 0,transparent 55%),linear-gradient(155deg,#fff 38%,#f5f9ff 100%);border-color:#ffffffb3;box-shadow:0 30px 90px #0005,0 0 0 6px #ffffff05}
.card:before{left:0;right:0;height:4px;background:linear-gradient(90deg,#074cd7,#00a9ff,#074cd7);z-index:2}
.card:after{content:"";position:absolute;z-index:-1;pointer-events:none;width:420px;height:540px;right:-250px;top:140px;background:url('assets/logo.png') no-repeat -30px 0;background-size:1700px auto;opacity:.045;transform:rotate(-14deg)}
.brand p{color:#405779}
.action{box-shadow:0 4px 14px #06133a05;border-color:#cdddf4}
.primary{background:linear-gradient(120deg,#087b49,#0b9258);box-shadow:0 10px 24px #087b492e;position:relative;border:1px solid #ffffff30}
.primary svg{width:26px;height:26px}
.google{background:#ffffffed}
.google-icon{flex-shrink:0;object-fit:contain}
.tile{background:linear-gradient(145deg,#fff,#edf4ff);border-color:#c9dcf7}
#instagram{background:linear-gradient(145deg,#fff,#fff3f8);border-color:#ecd4e7}
.tile .instagram-icon{stroke:url('#instagram-gradient');width:29px;height:29px}
.instagram-icon .dot{fill:url('#instagram-gradient')}
.save{background:linear-gradient(115deg,#0a225f,#074cd7);color:white;border:1px solid #1d58c0;box-shadow:0 8px 22px #074cd71f}
.location{color:#526683}
footer{border-top-color:#cbdcf4}
@media(hover:hover){.primary:hover{background:linear-gradient(120deg,#06683c,#087b49)}.save:hover{background:linear-gradient(115deg,#06133a,#0643bd)}}
@media(max-height:540px){.tile .instagram-icon{width:23px;height:23px}.primary svg{width:23px;height:23px}}