:root{--body-width: 30rem;--pad: 4px}main{display:flex;flex-direction:column;align-items:center;gap:6px;>hr{width:100%;border-top:1px solid var(--border-color)}}#timeline{display:flex;flex-grow:1;flex-basis:0;flex-direction:column;gap:8px;&:before{content:"";flex-grow:1}}#controller{justify-content:center}#post{padding:4px 0 12px;>*:not(hr){padding:0 var(--pad)}>hr{width:calc(100% - var(--pad) * 2);margin:0 var(--pad);border-top:1px dashed var(--border-color)}input{padding:0 4px}input[name=rcpt]{width:0;flex-grow:1;translate:-2px}.rcpt{width:0;padding-left:4px;display:flex;align-items:center;gap:4px;color:unset;overflow:hidden;transition:width .2s;&.on{width:6rem}}.body{width:var(--body-width);min-height:3rlh;max-height:8rlh}.eno:not(:has(+.on)){color:var(--border-color)}menu{gap:4px;.submit{padding:0 6px;border:1px var(--border-color);border-style:none solid;border-radius:4px}}}.talk,#post{display:flex;flex-direction:column;gap:4px;>:where(div,menu){display:flex;align-items:center}.name{flex-grow:1;font-weight:400}:where(.eno,.rcpt,.timestamp,.location){font-size:85%;align-self:center}:where(.timestamp,.location){color:var(--border-color)}}.talk{width:var(--body-width);padding:var(--pad);border-width:1px;border-style:solid none;>*:first-child{padding-bottom:2px;border-bottom:1px dashed var(--border-color);gap:4px}.body{word-break:break-all;.anchor{cursor:pointer;color:var(--link-color);text-decoration-line:underline}}.rcpt:empty{.eno:has(~&){color:var(--border-color)}img:has(~&){display:none}}&.ghost{opacity:.6}}