html,body{padding:0;margin:0}#root{display:grid;grid-template-columns:100vw;grid-template-rows:7vh 1fr auto;min-height:100vh}#root header{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:8px}#root header .unvisable{display:none}#root header .title{font-style:italic;text-decoration:none;color:inherit;cursor:pointer}#root header .account-management{display:flex;column-gap:8px}#root footer{display:flex;flex-direction:column;align-items:start;padding:8px}#Index{display:flex;justify-content:center;align-items:start}#Index main{border-radius:5px;height:min-content;border:3px black solid;display:grid;grid-template-columns:100%;width:80%;max-width:550px;grid-template-rows:1fr auto;height:600px;max-height:80vh;min-height:250px}#Index main .message-list{display:flex;justify-content:start;flex-direction:column;overflow-y:auto;row-gap:10px;align-items:start;padding:5px 25px}#Index main .message-list .message .text{border-radius:3px;background-color:#000;color:#fff;padding:3px;width:max-content}#Index main .message-list .message.mine{align-self:flex-end}#Index main form{height:auto;border-top:solid 3px black;padding:5px;box-sizing:border-box;display:flex;align-items:start;column-gap:7px}#Index main form .text-border{flex-grow:1;box-sizing:border-box;border:1px solid black;border-radius:3px;padding:3px}#Index main form .text-border textarea{border:none;box-sizing:border-box;width:100%;resize:none;scroll-behavior:auto;padding:0}#Index main form .text-border textarea:focus{border-bottom:1px solid black;outline:none}#Index main form input[type=submit]{border-radius:3px;padding:4px;box-sizing:border-box;background-color:#0ff;box-shadow:0 4px 6px #0003;border:none}#login{display:flex;justify-content:center;align-items:start}#login form{display:flex;flex-direction:column;align-items:start}#signin{text-align:center}#signin main{display:inline-flex;text-align:start;flex-direction:column}#signin main form{display:flex;flex-direction:column}