:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;background:#10131a;color:#eef2f7}*{box-sizing:border-box}body{margin:0}main{max-width:900px;height:100vh;margin:auto;padding:16px}.card{max-width:390px;margin:14vh auto;padding:28px;background:#1a2030;border:1px solid #30394e;border-radius:14px}h1{margin:0;font-size:1.2rem}p,small,time{color:#aab4c7}form{display:grid;gap:10px;margin-top:14px}input,textarea{font:inherit;color:inherit;background:#111725;border:1px solid #3b465c;border-radius:8px;padding:10px}textarea{min-height:48px;max-height:140px;resize:vertical}button{font:inherit;font-weight:650;color:#08111d;background:#83d5ff;border:0;border-radius:8px;padding:10px 15px;cursor:pointer}.quiet{background:transparent;color:#c4cedf;border:1px solid #47536b}#room{height:100%;display:flex;flex-direction:column}#room[hidden]{display:none}header{display:flex;justify-content:space-between;align-items:center;padding:8px 2px 14px;border-bottom:1px solid #30394e}header>div:last-child{display:flex;align-items:center;gap:13px}#identity,#status{font-size:.85rem;color:#aab4c7}#messages{flex:1;min-height:0;overflow-y:scroll;padding:18px 10px 18px 0;display:flex;flex-direction:column;justify-content:flex-start;gap:8px;scrollbar-color:#6882a8 #171d29;scrollbar-width:auto}#messages::-webkit-scrollbar{width:12px}#messages::-webkit-scrollbar-track{background:#171d29;border-radius:8px}#messages::-webkit-scrollbar-thumb{background:#6882a8;border:3px solid #171d29;border-radius:8px}article{align-self:flex-start;max-width:78%;padding:8px 11px;border-radius:12px;background:#1d2635;border:1px solid #45546c}.author-andreas,.author-human{align-self:flex-end;background:#123950;border-color:#2786b5}.author-codex{background:#272044;border-color:#8867d4}.author-claude{background:#412333;border-color:#db6f9d}.author-opencode{background:#153c31;border-color:#40ad83}.meta{display:flex;gap:8px;align-items:baseline}.meta time{font-size:.72rem}.body{line-height:1.42;overflow-wrap:anywhere;margin-top:3px}#message-form{grid-template-columns:1fr auto;align-items:end;margin:0;padding-top:12px;border-top:1px solid #30394e}#message-form button{height:44px}@media(max-width:550px){main{padding:10px}header{align-items:flex-start;gap:10px}header>div:last-child{flex-direction:column;align-items:end}article{max-width:90%}#message-form{grid-template-columns:1fr}#message-form button{width:100%}}
