@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--bg:#f7f8fd;--surface:#fff;--ink:#17213c;--muted:#68748e;--line:#e5e9f3;--soft:#f0f2fa;--accent:#6252e8;--accent-hover:#5040cd;--tint:#f0edff;--green:#16845d;--shadow:0 8px 28px #27386b05}
:root[data-theme=dark]{color-scheme:dark;--bg:#101522;--surface:#192031;--ink:#edf0fc;--muted:#acb6d0;--line:#303950;--soft:#242d42;--accent:#9b8dff;--accent-hover:#b5aaff;--tint:#2c2647;--green:#76d5af;--shadow:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 Manrope,system-ui,sans-serif}a{color:var(--accent)}button,input,textarea{font:inherit}button,a,input,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.wrap{max-width:1440px;margin:auto;padding-inline:40px}.site-header{background:var(--surface);border-bottom:1px solid var(--line)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:86px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}.brand-mark{color:var(--accent);font-size:29px;letter-spacing:-4px;font-weight:800;width:44px}.brand strong{display:block;font-size:23px;letter-spacing:-.9px;line-height:1.2}.brand small{font-size:12px;color:var(--muted)}.header-nav{display:flex;align-items:center;gap:32px;margin-left:auto}.header-nav a{font-size:14px;font-weight:600;color:var(--muted);text-decoration:none}.header-nav a:hover{color:var(--accent)}.icon-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)}main{padding-block:46px 56px}.hero{display:grid;grid-template-columns:1.7fr 1fr;align-items:center;gap:40px;margin-bottom:32px}.hero-main{display:flex;gap:24px;align-items:flex-start}.hero-icon{width:92px;height:92px;border-radius:26px;background:linear-gradient(140deg,#7c6af4,#5645d8);box-shadow:0 9px 22px #6252e826;display:grid;place-items:center;color:white;flex-shrink:0}.hero-icon svg{width:45px;height:45px;stroke-width:1.5}.eyebrow{font-size:11px;letter-spacing:1.7px;font-weight:800;color:var(--accent);text-transform:uppercase;margin-bottom:4px}h1{font-size:clamp(34px,3.5vw,48px);line-height:1.15;letter-spacing:-1.8px;font-weight:800}.intro{font-size:17px;color:var(--muted);max-width:590px;margin-top:10px}.benefits{display:flex;gap:20px;flex-wrap:wrap;margin-top:18px;font-size:13px;color:var(--muted)}.benefits span{display:flex;align-items:center;gap:7px}.benefits svg{width:16px;height:16px;color:var(--green)}.privacy-note{background:var(--tint);border:1px solid color-mix(in srgb,var(--accent) 10%,transparent);border-radius:17px;padding:23px;display:flex;gap:15px;align-items:flex-start}.privacy-note .round-icon{background:var(--accent);color:var(--surface)}.round-icon{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:var(--tint);color:var(--accent)}.privacy-note h2{font-size:16px;color:var(--accent);margin-bottom:5px}.privacy-note p{font-size:14px;color:var(--muted);line-height:1.65}.panel{background:var(--surface);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow)}.address-panel{padding:24px 26px;margin-bottom:22px}.address-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}.address-top label{font-weight:700;font-size:15px}.status-pill{font-size:12px;font-weight:700;display:flex;gap:7px;align-items:center;color:var(--muted);background:var(--soft);padding:5px 11px;border-radius:30px;white-space:nowrap}.status-pill:before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor}.status-pill[data-state=active]{color:var(--green);background:color-mix(in srgb,var(--green) 9%,var(--surface))}.status-pill[data-state=error]{color:#b85c39}.address-row{display:flex;gap:12px;align-items:stretch}.address-field{min-width:0;flex:1;background:var(--soft);border:1px solid var(--line);border-radius:11px;display:flex;gap:13px;align-items:center;padding:14px 18px}.address-field>svg{color:var(--muted)}#address{font-size:clamp(14px,1.45vw,20px);font-weight:700;letter-spacing:-.3px;overflow-wrap:anywhere;user-select:all;min-width:0}.button{border:1px solid var(--line);background:var(--surface);color:var(--ink);display:inline-flex;gap:9px;align-items:center;justify-content:center;padding:13px 19px;font-size:14px;font-weight:700;border-radius:11px;white-space:nowrap}.button:not(:disabled):hover{background:var(--soft);border-color:var(--accent)}.button.primary{background:var(--accent);border-color:var(--accent);color:white}.button.primary:not(:disabled):hover{background:var(--accent-hover)}.button.soft{background:var(--tint);border-color:transparent;color:var(--accent)}.verification-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:14px}.verification-row:has(#verification:empty){gap:0}#verification-status{font-size:13px;color:var(--muted)}.expiry-row{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);margin-top:20px;padding-top:17px}.timer{display:flex;align-items:center;gap:10px;flex-shrink:0}.timer>svg{color:var(--accent)}#countdown{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}.timer small{color:var(--muted);font-size:12px}#expiry-note{font-size:12px;color:var(--muted);margin-left:auto}#remaining{width:130px;height:5px;appearance:none;border:0;border-radius:10px;overflow:hidden;background:var(--soft);accent-color:var(--accent)}#remaining::-webkit-progress-bar{background:var(--soft)}#remaining::-webkit-progress-value{background:var(--accent);border-radius:10px}.status-line{display:flex;gap:9px;align-items:center;margin:0 2px 17px;font-size:13px;color:var(--muted)}.status-line svg{width:16px;height:16px;color:var(--accent)}.workspace{display:grid;grid-template-columns:minmax(280px,.82fr) minmax(0,1.55fr);gap:20px;align-items:stretch}.inbox-panel{overflow:hidden;min-width:0}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:21px 22px 15px}.panel-header h2{font-size:17px;display:flex;gap:9px;align-items:center}#mail-count{font-size:12px;border-radius:6px;padding:1px 7px;color:var(--accent);background:var(--tint)}.auto-refresh{font-size:12px;color:var(--muted);display:flex;gap:6px;align-items:center}.auto-refresh svg{width:14px;height:14px;color:var(--accent)}.search-wrap{margin:0 20px 12px;position:relative}.search-wrap svg{position:absolute;left:13px;top:13px;width:17px;height:17px;color:var(--muted)}#search{width:100%;background:var(--soft);border:1px solid var(--line);border-radius:9px;padding:10px 12px 10px 39px;font-size:14px;color:var(--ink)}#sync{font-size:11px;color:var(--muted);padding:0 22px 15px;border-bottom:1px solid var(--line)}#messages{padding:9px;min-height:340px;max-height:560px;overflow:auto}.message{display:flex;gap:12px;border:1px solid transparent;background:transparent;border-radius:10px;width:100%;text-align:left;padding:17px 12px;color:var(--ink)}.message+.message{border-top-color:var(--line)}.message:hover{background:var(--soft)}.message[aria-pressed=true]{background:var(--tint);border-color:color-mix(in srgb,var(--accent) 12%,transparent)}.sender-avatar{width:37px;height:37px;display:grid;place-items:center;background:var(--soft);border:1px solid var(--line);border-radius:12px;font-size:14px;font-weight:800;color:var(--accent);flex-shrink:0}.message-content{display:block;min-width:0;flex:1}.message-heading{display:flex;gap:8px;align-items:center;justify-content:space-between}.message-from{font-size:14px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-time{font-size:10px;color:var(--muted);white-space:nowrap}.message-subject{font-size:13px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}.message-preview{display:block;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px}.empty-list{min-height:290px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--muted);font-size:14px;gap:12px}.empty-list:before{content:'✉';font-size:30px;display:grid;place-items:center;width:66px;height:66px;border-radius:22px;background:var(--soft);color:var(--accent)}.reader{min-width:0;display:flex;flex-direction:column;min-height:490px}.reader-header{padding:22px 25px 17px;border-bottom:1px solid var(--line)}#subject{font-size:19px;line-height:1.4;overflow-wrap:anywhere}#sender{font-size:13px;color:var(--muted);margin-top:5px;overflow-wrap:anywhere}.reader-tools{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.reader-tools .button{font-size:12px;padding:7px 12px;border-radius:7px}.reader-tools #save-mail{margin-left:auto}#send-note{font-size:11px;color:var(--muted);margin-top:10px}.reader-main{padding:25px;flex:1;display:flex;flex-direction:column}.reader-empty{text-align:center;margin:auto;padding:40px 15px;color:var(--muted)}.reader-empty .empty-envelope{display:grid;place-items:center;border-radius:23px;background:var(--tint);color:var(--accent);width:78px;height:78px;margin:0 auto 20px;transform:rotate(-7deg)}.empty-envelope svg{width:35px;height:35px}.reader-empty h3{font-size:20px;color:var(--ink);margin-bottom:8px}.reader-empty p{font-size:14px;max-width:320px;margin:auto}#body{white-space:pre-wrap;overflow-wrap:anywhere;font:15px/1.85 Manrope,system-ui,sans-serif;margin:0;color:var(--ink)}#codes{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px}#codes:empty{display:none}#codes button{background:var(--tint);color:var(--accent);border:1px solid var(--line);border-radius:7px;padding:8px 12px;font-size:13px}#compose{padding:20px 25px;background:var(--soft);border-bottom:1px solid var(--line)}#compose label{display:block;font-size:13px;font-weight:700}#compose input,#compose textarea{width:100%;padding:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:8px;margin:6px 0 14px;font-size:16px}.actions{display:flex;gap:10px;flex-wrap:wrap}.feature-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:31px 5px;border-bottom:1px solid var(--line);margin-bottom:26px}.feature-strip>div{display:flex;gap:13px;align-items:flex-start}.feature-strip h3{font-size:14px;margin-bottom:3px}.feature-strip p{font-size:13px;color:var(--muted);max-width:280px}.renewal{display:flex;gap:22px;align-items:center;padding:21px 24px;background:var(--surface);border:1px dashed var(--line);border-radius:13px}.renewal h2{font-size:15px}.renewal p{font-size:13px;color:var(--muted);margin-top:3px}.soon{margin-left:auto;color:var(--muted);font-size:11px;border-radius:30px;background:var(--soft);padding:5px 12px;white-space:nowrap}.guide{max-width:880px;margin:55px auto 0}.guide h2{font-size:25px;letter-spacing:-.5px;margin:28px 0 14px}.guide p{font-size:15px;line-height:1.85;color:var(--muted);margin-bottom:17px}.guide details{border-bottom:1px solid var(--line);padding:18px 0}.guide summary{font-size:15px;font-weight:700;cursor:pointer}.guide details p{margin:12px 0 0}.site-footer{border-top:1px solid var(--line);padding-block:23px;font-size:13px;color:var(--muted)}.site-footer .wrap{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}.site-footer a{color:var(--muted);text-decoration:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip{position:absolute;top:-80px;left:20px;background:var(--surface);padding:10px;z-index:5}.skip:focus{top:10px}
@media(min-width:1100px){.privacy-note{margin-left:10px}.address-row .button{min-width:115px}}
@media(max-width:1100px){.wrap{padding-inline:26px}.hero{grid-template-columns:1fr}.privacy-note{display:none}.address-row{flex-wrap:wrap}.address-field{flex-basis:60%}.workspace{grid-template-columns:minmax(260px,.85fr) minmax(0,1.25fr)}.auto-refresh{font-size:10px}.hero-main{gap:20px}}
@media(max-width:760px){.wrap{padding-inline:18px}.header-inner{min-height:76px;gap:14px}.header-nav{gap:17px}.header-nav a{font-size:12px}.header-nav a:not(:first-child){display:none}.brand strong{font-size:20px}.brand small{font-size:10px}.brand-mark{font-size:24px;width:33px}.brand{gap:8px}.icon-button{width:36px;height:36px}main{padding-top:29px}.hero{margin-bottom:24px}.hero-main{gap:15px}.hero-icon{width:60px;height:60px;border-radius:18px;margin-top:5px}.hero-icon svg{width:31px;height:31px}h1{font-size:34px;letter-spacing:-1px}.intro{font-size:15px}.eyebrow{font-size:9px}.benefits{gap:10px 15px;font-size:11px}.address-panel{padding:19px 17px}.address-top{gap:10px}.address-top label{font-size:13px}.status-pill{font-size:10px}.address-field{flex-basis:100%;padding:15px 12px}#address{font-size:15px}.address-row{gap:9px}.address-row .button{flex:1;font-size:12px;padding:11px 10px}.address-row .button svg{width:16px;height:16px}.expiry-row{flex-wrap:wrap;gap:8px 15px}.timer{gap:7px}#countdown{font-size:18px}#remaining{flex:1;min-width:70px}#expiry-note{flex-basis:100%;margin:0;font-size:11px}.workspace{grid-template-columns:1fr;gap:16px}#messages{min-height:160px;max-height:290px}.empty-list{min-height:160px}.reader{min-height:370px}.reader-header{padding:20px}.reader-main{padding:20px}.reader-tools #save-mail{margin-left:0}.feature-strip{grid-template-columns:1fr;gap:22px;padding:28px 5px}.feature-strip p{max-width:none}.renewal{padding:18px;align-items:flex-start;gap:13px}.renewal .round-icon{display:none}.soon{font-size:10px}.guide{margin-top:35px}.guide h2{font-size:22px}.reader-empty{padding:25px 5px}#search{font-size:16px}}
@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s,border-color .15s,color .15s}}

/* Comfortable reading sizes for message content and supporting copy. */
.message-from{font-size:16px}.message-subject{font-size:15px}.message-preview{font-size:14px}.message-time{font-size:12px}
#body,.guide p{font-size:16px}#sync,#send-note,.auto-refresh{font-size:12px}.status-line,#verification-status{font-size:14px}

@media(min-width:761px){main{padding-top:32px}.hero{margin-bottom:26px}.address-panel{padding:20px 24px}.expiry-row{margin-top:15px;padding-top:13px}.verification-row{margin-top:10px}}