#root{display:flex;flex-direction:column;max-width:800px;width:100%;height:100%;margin:0 auto;padding:2rem}.logo-container{display:flex;justify-content:center;margin-bottom:2rem}.logo{width:8em}.mailbox-container{display:flex;gap:1em}.mailbox{flex:1;text-align:center;padding:.5em 0;border-radius:8px;border:1px solid transparent;background-color:#f9f9f977;font-size:1.5em}.mailbox:focus{outline:1px auto #f1f1f1}.icon{height:1.5em}.mail-container{display:flex;align-items:start;flex-direction:column;margin-top:2em;padding:1em;flex:1;border-radius:8px;background-color:#f9f9f977}.mail-container-header{width:100%;padding:.5em 0;margin-bottom:1em;font-size:1.2em;text-align:center}.mail-placeholder{display:flex;justify-content:center;align-items:center;flex:1;align-self:stretch}.mail-list-container{align-self:stretch;list-style:none}.mail-item-outer-container:not(:last-of-type){margin-bottom:1em}.mail-item-container{padding:1em;border-radius:8px;background-color:#f9f9f977}.mail-item-container:hover{background-color:#f9f9f9;cursor:pointer}.mail-title{font-size:1.1rem;margin-bottom:.25em}.mail-info-container{display:flex;justify-content:space-between;font-size:.8rem}.mail-detail-outer-container{position:fixed;top:0;bottom:0;left:0;right:0;display:flex;justify-content:center;align-items:center;background-color:#0006}.mail-detail-container{width:800px;min-height:600px;display:flex;flex-direction:column;justify-content:start;background-color:#f9f9f9;border-radius:8px}.mail-detail-header-container{display:flex;justify-content:space-between;align-items:center;padding:1rem}.mail-detail-header-title{font-size:1.1rem;flex:1;padding-left:2rem;text-align:center}.mail-detail-header-close{width:2rem;border-radius:8px}.mail-detail-header-close:hover{background-color:#f1f1f1;cursor:pointer}.mail-detail-content-placeholder{flex:1;display:flex;justify-content:center;align-items:center}.mail-detail-content-container{padding:1rem;display:flex;flex-direction:column;flex:1}.mail-detail-header{padding:1rem;background-color:#f1f1f1;border-radius:8px;margin-bottom:1rem}.mail-detail-subject{font-size:1.1rem;font-weight:600;margin-bottom:.25em}.mail-detail-info{display:flex;justify-content:space-between;font-size:.8rem}.mail-detail-content{padding:1rem;border-radius:8px;background-color:#f1f1f1;flex:1}*{padding:0;margin:0;box-sizing:border-box}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;background:linear-gradient(to right,#ec6ead,#3494e6);height:100%}body{min-width:320px;min-height:100vh;height:100%}button{display:flex;align-items:center;gap:.5em;border-radius:8px;border:1px solid transparent;outline:none;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#f9f9f9;cursor:pointer;transition:border-color .25s}button:hover{background-color:#f1f1f1;border-color:#fff}iframe{border:none}