*{margin:0;padding:0;box-sizing:border-box;font-family:Roboto,sans-serif}body{background:#ddd;width:100%;font-family:Roboto,sans-serif;margin:0}.container{width:100%;max-width:800px;margin:0 auto;min-height:100vh;background:#fff;border-radius:0;overflow:hidden;padding:0}.header{background:#7695ec;width:100%;height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 37px;color:#fff}.header h3{margin:0;font-size:22px;font-weight:600;line-height:1}.home-main-content{padding:24px;background:#fff}.post{border:1px solid #ccc;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 2px 6px #0000000d}.post-header{background:#7695ec;color:#fff;height:48px;padding:0 16px;display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:16px}.post-header h4{margin:0;font-size:18px;font-weight:700}.post-actions{display:flex;gap:12px}.post-actions button{background:none;border:none;color:#fff;cursor:pointer}.post-info{display:flex;justify-content:space-between;color:#777;font-size:14px;margin-bottom:12px;flex-wrap:wrap;gap:8px}.posts-list{display:flex;flex-direction:column;gap:16px;margin-top:16px}.post-body{padding:16px}.create-post{display:flex;flex-direction:column;gap:8px;background:#fff;padding:24px;border:1px solid #ccc;border-radius:8px;margin-top:16px}input{width:100%;height:32px;border-radius:8px;border:1px solid #777777;padding:0 12px;display:flex;align-items:center;font-size:14px}input,textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:6px}button{align-self:flex-end;background:#7695ec;color:#fff;border:none;padding:8px 20px;border-radius:6px;cursor:pointer}button:disabled{background:#ccc}.btn-logout{background:transparent;color:#fff;border:1px solid white;padding:6px 16px;border-radius:8px;font-weight:700;cursor:pointer;transition:all .2s ease;transform:translateY(-8);align-self:center;display:flex;align-items:center;justify-content:center;gap:8px}.btn-logout:hover{background:#ffffff1a}.logout-icon{display:none}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#777c;display:flex;justify-content:center;align-items:center;z-index:9999}.modal-content{background:#fff;padding:24px;border-radius:16px;width:90%;max-width:660px}.modal-content h3{font-weight:700;font-size:22px;margin-bottom:40px}.modal-actions{display:flex;justify-content:flex-end;gap:16px;margin-top:24px}.modal-actions button{align-self:auto}.btn-cancel{border:1px solid #999999;border-radius:8px;background:#fff;padding:8px 32px;font-weight:700;cursor:pointer;color:#000}.btn-delete{background:#ff5151;color:#fff;border:none;border-radius:8px;padding:8px 32px;font-weight:700;cursor:pointer}.post-actions{display:flex;gap:20px;align-items:center}.icon-btn{background:transparent;border:none;cursor:pointer;padding:0;display:flex;align-items:center;transition:transform .1s ease,opacity .2s}.icon-btn:hover{opacity:.8}.icon-btn:active{transform:scale(.9)}.edit-form{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.edit-form label{font-size:16px;color:#000}.btn-save{background-color:#47b960;color:#fff;padding:8px 32px;border-radius:8px}.btn-save:disabled{background-color:#ccc}.login-page{background:#fff;border:1px solid #777777;border-radius:16px;padding:24px;width:100%;max-width:500px;display:flex;flex-direction:column;gap:10px}.login-page h2{margin:0;font-size:22px}.login-page p{margin:14px 0 0}.login-wrapper{height:100vh;display:flex;justify-content:center;align-items:center;background:#ddd}input{width:100%;border-radius:8px;border:1px solid #777777;padding:0 12px}.btn-enter{width:111px;height:32px;background:#7695ec;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:700}.btn-enter:hover{background-color:#5a7cdb;justify-content:flex-end}.actions{display:flex;justify-content:flex-end;width:100%;margin-top:10px}@media(max-width:768px){.container{margin:20px 12px}.header{font-size:20px;padding-left:16px}.post-header h4{font-size:16px}}@media(max-width:480px){.login-page{width:90%;padding:20px}.login-page h2{font-size:18px}.btn-enter{width:100%;height:38px}.actions{justify-content:center}.container{margin:0;border-radius:0}.header{height:60px;padding-left:20px}.home-main-content{padding:16px}.create-post{padding:16px;margin-top:0;border-left:none;border-right:none;border-radius:0}.post-body{padding:12px}.modal-content{padding:20px}.modal-content h3{font-size:18px}button{padding:8px 16px}.post-header{height:auto;padding:12px}.post-header h4{font-size:15px}.logout-text{display:none}.logout-icon{display:block}.btn-logout{padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.5)}}