:root{--primary-blue:#0056b3;--dark-blue:#004085;--light-blue:#007bff;--bg-gradient:linear-gradient(180deg, #0056b3 0%, #003d80 100%);--white:#fff;--text-main:#fff;--text-muted:#ffffffb3;--card-bg:#ffffff1a;--card-hover:#ffffff26;--card-border:#fff3;--success:#28a745;--danger:#dc3545;--warning:#ffc107}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-gradient);max-width:100vw;color:var(--text-main);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}input,select{outline:none;font-family:inherit}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.3s ease-out forwards fadeIn}.glass{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);border:1px solid var(--card-border);border-radius:16px}.container{flex-direction:column;gap:2rem;max-width:500px;min-height:100vh;margin:0 auto;padding:2rem 1rem;display:flex}.header{flex-direction:column;align-items:center;gap:.5rem;margin-bottom:1rem;display:flex}.logo{letter-spacing:-1px;align-items:center;gap:.75rem;font-size:2.5rem;font-weight:800;display:flex}.logo svg{width:48px;height:48px}.email-box{justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem;font-size:1.1rem;font-weight:500;display:flex}.action-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.action-card{flex-direction:column;align-items:center;gap:1rem;padding:2rem 1rem;transition:all .2s;display:flex}.action-card:hover{background:var(--card-hover);transform:translateY(-2px)}.action-card svg{stroke-width:2.5px;width:32px;height:32px}.action-card span{font-size:1rem;font-weight:600}.inbox-section{flex-direction:column;flex:1;gap:1rem;display:flex}.inbox-header{justify-content:space-between;align-items:center;padding:0 .5rem;display:flex}.message-item{cursor:pointer;flex-direction:column;gap:.5rem;padding:1rem;transition:background .2s;display:flex}.message-item:hover{background:var(--card-hover)}.message-item .from{font-size:.9rem;font-weight:700}.message-item .subject{font-size:1rem;font-weight:500}.message-item .time{color:var(--text-muted);align-self:flex-end;font-size:.8rem}.empty-state{color:var(--text-muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:4rem 2rem;display:flex}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal-content{flex-direction:column;gap:1.5rem;width:100%;max-width:450px;padding:2rem;display:flex}.form-group{flex-direction:column;gap:.5rem;display:flex}.form-group label{font-size:.9rem;font-weight:600}.input-field{border:1px solid var(--card-border);color:#fff;background:#ffffff1a;border-radius:8px;padding:.75rem 1rem;font-size:1rem}.input-field option{color:#fff;background:#003d80}.btn{text-align:center;border-radius:10px;padding:.875rem;font-weight:700;transition:opacity .2s}.btn:active{opacity:.8}.btn-primary{background:var(--success)}.btn-secondary{background:var(--warning);color:#333}.btn-outline{border:1px solid var(--card-border);background:#ffffff1a}.message-detail{flex-direction:column;gap:1.5rem;display:flex}.message-detail-header{border-bottom:1px solid var(--card-border);flex-direction:column;gap:.5rem;padding-bottom:1rem;display:flex}.body-content{overflow-wrap:break-word;background:#ffffff0d;border-radius:8px;padding:1rem;font-size:.95rem;line-height:1.5}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.email-text{word-break:break-all;font-size:1.25rem}.history-trigger{color:var(--text-muted);opacity:.8;align-items:center;gap:.25rem;font-size:.75rem;transition:opacity .2s;display:flex}.history-trigger:hover{opacity:1}.sync-status{color:var(--text-muted);font-size:.8rem}.inbox-container{flex-direction:column;flex:1;display:flex;overflow:hidden}.message-list{flex-direction:column;display:flex;overflow-y:auto}.skeleton-container{flex-direction:column;gap:1.5rem;padding:1rem;display:flex}.skeleton-item{flex-direction:column;gap:.5rem;display:flex}.skeleton-line{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a 50%,#ffffff0d 75%) 0 0/200% 100%;border-radius:4px;animation:1.5s infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.info-section{flex-direction:column;gap:2rem;padding-bottom:4rem;display:flex}.info-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.info-card{text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem;display:flex}.info-icon{width:32px;height:32px;color:var(--warning)}.faq-container{flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.faq-list{flex-direction:column;gap:.5rem;display:flex}.faq-item{border-bottom:1px solid var(--card-border);padding:.5rem 0}.faq-item:last-child{border-bottom:none}.faq-item summary{cursor:pointer;justify-content:space-between;align-items:center;padding:.5rem 0;font-weight:600;list-style:none;display:flex}.faq-item summary:after{content:"+";font-size:1.2rem}.faq-item[open] summary:after{content:"−"}.faq-item p{color:var(--text-muted);padding:.5rem 0 1rem;font-size:.9rem;line-height:1.6}.history-drawer{z-index:1001;border-left:1px solid var(--card-border);border-radius:0;flex-direction:column;gap:1.5rem;width:85%;max-width:350px;padding:2rem 1.5rem;display:flex;position:absolute;top:0;bottom:0;right:0}.history-list{flex-direction:column;gap:.75rem;display:flex;overflow-y:auto}.history-item{border:1px solid var(--card-border);cursor:pointer;background:#ffffff0d;border-radius:12px;justify-content:space-between;align-items:center;padding:1rem;transition:all .2s;display:flex}.history-item:hover{background:#ffffff1a;transform:translate(-4px)}.history-item.active{border-color:var(--warning);background:#ffc1071a}.history-item .email{text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;font-weight:500;overflow:hidden}.footer{text-align:center;color:var(--text-muted);flex-direction:column;gap:1rem;margin-top:2rem;font-size:.85rem;display:flex}.footer-links{justify-content:center;gap:1.5rem;display:flex}.footer-links a{align-items:center;gap:.4rem;transition:color .2s;display:flex}.footer-links a:hover{color:#fff}@media (max-width:480px){.info-grid{grid-template-columns:1fr}}