:root{--bg0: #0f1c18;--bg1: #1a2f28;--ink: #e8f0ec;--muted: #9bb0a6;--accent: #c4f061;--line: rgba(232, 240, 236, .12);--danger: #ff8f7a;--font-display: "Fraunces", Georgia, serif;--font-body: "IBM Plex Sans", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font-body);color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,#2a4a3c 0%,transparent 55%),radial-gradient(900px 500px at 100% 0%,#3a2e1a 0%,transparent 50%),linear-gradient(165deg,var(--bg0),var(--bg1));background-attachment:fixed}.shell{min-height:100vh;padding:1.5rem}.hero{max-width:40rem;margin:12vh auto 0;animation:rise .7s ease-out both}.eyebrow{margin:0 0 .75rem;letter-spacing:.14em;text-transform:uppercase;font-size:.75rem;color:var(--accent)}.brand{margin:0;font-family:var(--font-display);font-size:clamp(3.2rem,10vw,5.5rem);font-weight:700;line-height:.95;letter-spacing:-.03em}.lede{margin:1.25rem 0 2rem;font-size:1.15rem;line-height:1.5;color:var(--muted);max-width:28rem}.open-form{display:flex;flex-wrap:wrap;gap:.75rem;align-items:stretch}.address-field{display:flex;align-items:center;flex:1 1 16rem;min-width:0;border:1px solid var(--line);background:#08100e8c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:0 .9rem}.address-field input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:1.1rem;padding:.95rem .35rem .95rem 0;outline:none}.domain{color:var(--muted);white-space:nowrap;font-size:.95rem}button{border:0;background:var(--accent);color:#132018;font:inherit;font-weight:600;padding:.95rem 1.35rem;cursor:pointer;transition:transform .15s ease,filter .15s ease}button:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)}button:disabled{opacity:.6;cursor:default}button.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}.mailbox{max-width:52rem;margin:0 auto;animation:rise .45s ease-out both}.mailbox-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}.mailbox-header h1{margin:.35rem 0 .25rem;font-family:var(--font-display);font-size:clamp(1.4rem,3vw,2rem);font-weight:600;word-break:break-all}.back{color:var(--accent);text-decoration:none;font-size:.9rem}.meta{margin:0;color:var(--muted);font-size:.9rem}.status{color:var(--muted)}.status.error{color:var(--danger)}.message-list{list-style:none;margin:0;padding:0}.message-row{display:grid;grid-template-columns:minmax(8rem,.9fr) minmax(0,1.4fr) auto;gap:.75rem 1rem;align-items:baseline;padding:1rem .15rem;border-bottom:1px solid var(--line);color:inherit;text-decoration:none;transition:background .15s ease}.message-row:hover{background:#c4f0610f}.from{color:var(--muted);font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.subject{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.when{color:var(--muted);font-size:.85rem;white-space:nowrap}.message-body .headers{margin:0 0 1.5rem;display:grid;gap:.65rem}.message-body .headers>div{display:grid;grid-template-columns:3.5rem 1fr;gap:.75rem}.message-body dt{margin:0;color:var(--muted);font-size:.85rem}.message-body dd{margin:0;word-break:break-word}.text{margin:0;padding:1.25rem;white-space:pre-wrap;word-break:break-word;font-family:var(--font-body);font-size:.98rem;line-height:1.55;background:#08100e8c;border:1px solid var(--line)}.attachments{margin:0 0 1.25rem}.attachments h2{margin:0 0 .6rem;font-family:var(--font-display);font-size:1.05rem;font-weight:600}.attachments ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}.attachments li{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:baseline}.attachments a{color:var(--accent);text-decoration:none}.attachments a:hover{text-decoration:underline}.att-meta{color:var(--muted);font-size:.85rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:720px){.message-row{grid-template-columns:1fr auto;grid-template-areas:"from when" "subject subject"}.from{grid-area:from}.subject{grid-area:subject}.when{grid-area:when}}