@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;800&display=swap";:root{--primary:#ffd100;--bg:#111;--bg-card:#1a1a1a;--bg-inbox:#222;--text-main:#fff;--text-muted:#a0a0a0;--border:#333}*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,sans-serif}body{background-color:var(--bg);color:var(--text-main);min-height:100vh}.container{max-width:800px;margin:0 auto;padding:2rem 1rem}.header{text-align:center;margin-bottom:2rem}.header h1{color:var(--text-main);font-size:2.5rem;font-weight:800}.header h1 span{color:var(--primary)}.header p{color:var(--text-muted);font-size:1.1rem}.email-card{background-color:var(--bg-card);border:1px solid var(--border);border-radius:16px;margin-bottom:2rem;padding:2rem;box-shadow:0 10px 30px #00000080}.email-display-container{background-color:var(--bg);border:2px solid var(--border);cursor:pointer;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding:1rem 1.5rem;transition:all .2s;display:flex}.email-display-container:hover{border-color:var(--primary)}.email-display{color:var(--primary);word-break:break-all;font-size:1.8rem;font-weight:700}.copy-hint{color:var(--text-muted);align-items:center;gap:.5rem;font-size:.9rem;display:flex}.actions{flex-wrap:wrap;gap:1rem;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-size:1rem;font-weight:600;transition:all .2s;display:flex}.btn-primary{background-color:var(--primary);color:#000}.btn-primary:hover{background-color:#e6bd00;transform:translateY(-2px)}.btn-secondary{color:var(--text-main);border:1px solid var(--border);background-color:#0000}.btn-secondary:hover{background-color:var(--border)}.btn-danger{color:#ff4d4d;background-color:#0000;border:1px solid #ff4d4d}.btn-danger:hover{background-color:#ff4d4d1a}.inbox-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.inbox-header h2{font-size:1.5rem;font-weight:700}.inbox-list{flex-direction:column;gap:1rem;display:flex}.inbox-item{background-color:var(--bg-card);border:1px solid var(--border);cursor:pointer;border-radius:12px;padding:1.5rem;transition:all .2s}.inbox-item:hover{border-color:var(--primary);transform:translate(5px)}.inbox-item-header{color:var(--text-muted);justify-content:space-between;margin-bottom:.5rem;font-size:.9rem;display:flex}.inbox-item-sender{color:var(--primary);font-weight:600}.inbox-item-subject{color:var(--text-main);margin-bottom:.5rem;font-size:1.2rem;font-weight:700}.inbox-item-preview{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;overflow:hidden}.inbox-empty{text-align:center;background-color:var(--bg-card);border:1px dashed var(--border);color:var(--text-muted);border-radius:12px;padding:3rem 1rem}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#000c;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--bg-card);border:1px solid var(--border);border-radius:16px;width:90%;max-width:450px;padding:2rem;animation:.3s slideUp;box-shadow:0 15px 40px #0009}.modal-content h3{margin-bottom:1.5rem;font-size:1.4rem}.form-group{margin-bottom:1.5rem}.form-group label{color:var(--text-muted);margin-bottom:.5rem;display:block}.input-group{gap:.5rem;display:flex}.form-control{background-color:var(--bg);border:1px solid var(--border);width:100%;color:var(--text-main);border-radius:8px;outline:none;padding:.8rem 1rem;font-family:inherit;font-size:1rem}.form-control:focus{border-color:var(--primary)}.flex-1{flex:1}.modal-actions{gap:1rem;margin-top:2rem;display:flex}.reader-view{background-color:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:2rem}.reader-header{border-bottom:1px solid var(--border);margin-bottom:2rem;padding-bottom:1rem}.reader-title{margin-bottom:1rem;font-size:1.8rem}.reader-meta{color:var(--text-muted);flex-direction:column;gap:.3rem;display:flex}.reader-body{white-space:pre-wrap;font-size:1.05rem;line-height:1.8}.btn-back{color:var(--primary);cursor:pointer;background:0 0;border:none;margin-bottom:1rem;font-size:1rem;font-weight:600;display:inline-block}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=600px){.email-display{font-size:1.3rem}.actions,.input-group{flex-direction:column}}