*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:#111;background:#fff}a{text-decoration:none;color:inherit}.app{display:flex;min-height:100vh}aside{width:324px;border-right:1px solid #e5e5e5;padding:38px 22px;display:flex;flex-direction:column}.logo{font-size:42px;font-weight:800;color:#009900;letter-spacing:-1.5px;margin:0 16px 50px}.compose{background:#009900;color:white;border-radius:32px;padding:18px;text-align:center;font-size:21px;margin-bottom:26px}nav{display:flex;flex-direction:column;gap:5px}nav a{padding:17px 22px;border-radius:16px;font-size:20px;display:flex;gap:20px}nav a.active{background:#e8f5e8;color:#009900;font-weight:700}.account{margin-top:auto;border-top:1px solid #eee;padding:24px 10px;display:flex;justify-content:space-between;gap:15px;font-size:15px}.account a{color:#009900}main{flex:1}header{height:112px;border-bottom:1px solid #eee;display:flex;align-items:center;padding:0 42px}.search{height:56px;background:#f4f4f5;border-radius:30px;display:flex;align-items:center;padding:0 24px;font-size:32px;color:#666;max-width:710px;flex:1}.search input{border:0;outline:0;background:none;font-size:20px;width:100%;padding-left:12px}.profile{margin-left:auto;position:relative}.profile button{width:58px;height:58px;border:2px solid #009900;border-radius:50%;background:#fff;color:#009900;font-size:28px}.menu{display:none;position:absolute;right:0;top:68px;background:white;border:1px solid #eee;border-radius:14px;box-shadow:0 10px 30px #0002;width:200px;z-index:5}.menu.show{display:block}.menu a{display:block;padding:18px}.tools{height:64px;border-bottom:1px solid #eee;padding:20px 42px;color:#666}section{padding:34px 44px}h1{font-size:36px;margin:0 0 7px}.muted{color:#777}.row{min-height:76px;border-top:1px solid #eee;display:grid;grid-template-columns:30px 35px 300px 1fr 80px;gap:15px;align-items:center;padding:0 12px}.row:hover{background:#fafafa}.row.unread strong{font-weight:800}.star{font-size:25px;color:#888}.row time{color:#777;text-align:right}.empty{padding:50px;color:#888}.page{max-width:1000px;margin:auto;padding:35px 25px}.page>a{color:#009900}.page article{margin-top:25px;border:1px solid #eee;border-radius:18px;padding:30px;box-shadow:0 5px 25px #0000000b}.page form{display:flex;flex-direction:column}.page label{margin:18px 0 7px;font-weight:700}.page input,.page textarea{border:1px solid #ddd;border-radius:12px;padding:14px;font:inherit}.page button,.loginbox button{margin-top:20px;border:0;border-radius:12px;background:#009900;color:#fff;padding:15px;font-weight:700;cursor:pointer}.err,.ok{padding:13px;border-radius:10px;margin:15px 0}.err{background:#fff0f0;color:#a00000}.ok{background:#effbef;color:#087c08}.login{min-height:100vh;background:#f7f8f7;display:grid;place-items:center}.loginbox{width:min(460px,92vw);background:#fff;border-radius:22px;padding:42px;box-shadow:0 12px 45px #0001}.loginbox .logo{text-align:center;margin:0 0 30px}.loginbox label{display:block;margin:20px 0 7px;font-weight:700}.loginbox input{width:100%;padding:14px;border:1px solid #ddd;border-radius:12px}.loginbox button{width:100%;font-size:17px}.center{text-align:center;margin-top:22px}.center a{color:#009900;font-weight:700}@media(max-width:800px){aside{width:240px}.logo{font-size:32px}.row{grid-template-columns:25px 25px 1fr 70px}.row span:nth-child(4){display:none}}@media(max-width:600px){.app{display:block}aside{width:100%;border-right:0;border-bottom:1px solid #eee}.row{grid-template-columns:25px 25px 1fr 65px}header{padding:0 18px}.tools{padding:20px}section{padding:25px 18px}}