*{box-sizing:border-box}:root{--color-background: #F5F6F7;--color-border: #B9BFC4;--color-text: #333333;--color-h2: #394856;--color-h3: #617c92;--color-primary: #394856;--color-secondary: #eeaacc;--border-radius: .75rem;font-family:ヒラギノ角ゴ ProN W3,Hiragino Kaku Gothic ProN,メイリオ,Meiryo,sans-serif;line-height:1.5;font-weight:400;color:var(--color-text);background-color:var(--color-background);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;overflow:hidden}.header{padding:.5rem 20%;background-color:var(--color-background);border-bottom:solid 1px var(--color-border)}.header h1{font-size:1rem;font-weight:500}button{background-color:var(--color-primary);color:#fff;border:none;border-radius:var(--border-radius);cursor:pointer;transition:filter .2s}button:hover{filter:brightness(1.4)}a{color:var(--color-primary);text-decoration:dashed underline 1px;transition:filter .2s}a:hover{filter:brightness(1.4)}textarea,input[type=text]{border:solid 1px var(--color-border);border-radius:var(--border-radius);font-size:1.05rem;font-family:inherit;resize:none}textarea:focus,input[type=text]:focus{outline:solid 2px var(--color-primary)}.container{margin:0 20%;height:calc(100vh - 3.34rem);display:grid;grid-template-columns:1fr 2fr;grid-gap:1rem}.container h2{font-size:1.1rem;font-weight:500;color:var(--color-h2)}.container h2{font-size:1.1rem;font-weight:500;color:var(--color-h2);padding:.5rem 0;border-bottom:solid 1px var(--color-border);position:sticky;top:0;left:0;background-color:var(--color-background)}.container h3{font-size:1rem;font-weight:500;color:var(--color-h3);margin-bottom:.5rem}.container p{margin-top:.5rem}.container>div{height:100%;padding-bottom:2rem;display:flex;flex-direction:column;gap:1rem;overflow-y:auto}.create-container #newPost{width:calc(100% - 4px);height:8rem;padding:.5rem;margin:0 2px}.create-container #postButton{width:100%;padding:.5rem;margin-top:.5rem}.create-container .create-bottom{display:grid;grid-template-columns:2fr 1fr;align-items:center;gap:1rem}.create-container .create-bottom #name{width:calc(100% - 4px);padding:.2rem .5rem;margin:.5rem 2px}.create-container .create-bottom div{width:100%;display:flex;align-items:flex-end;justify-content:flex-end}.create-container .create-bottom div p{text-align:right;margin:0}.create-container .create-bottom div #textCount{font-size:1.5rem;margin-right:.3rem;line-height:1.6rem}.links-container img{width:70%;border:solid 1px var(--color-border);border-radius:var(--border-radius)}.posts-container #posts{display:flex;flex-direction:column-reverse;gap:1rem}.posts-container #posts .post{padding:.5rem 1rem;border:solid 1px var(--color-border);border-radius:var(--border-radius);background-color:#fff}.posts-container #posts .post header{display:flex;align-items:center;justify-content:space-between;margin:.3rem 0 .5rem}.posts-container #posts .post header div{display:flex;align-items:center;justify-content:flex-start;gap:1rem;flex:1}.posts-container #posts .post header img{width:2.5rem;border-radius:50%}.posts-container #posts .post header .name{font-size:1rem;font-weight:700;color:var(--color-h2);margin:0}.posts-container #posts .post header .date{font-size:.8rem;color:var(--color-h3);margin:0}.posts-container #posts .post .text{margin-bottom:.5rem}#stdOut{position:fixed;width:30rem;height:20rem;bottom:0;right:0;z-index:99;margin:1rem;background-color:#000000e0;box-shadow:#000 0 0 10px;border-radius:1rem;padding:.5rem 1rem;color:#fff;overflow:auto;font-family:monospace;white-space:pre}#stdOut p{margin:.1rem 0}