:root{--tlo:#fff;--tlo-boczne:#f4f6f8;--tekst:#1b1f24;--cichy:#6a737d;--akcent:#2f6fde;--moj-dymek:#dfeafc;--dymek:#eef0f2;--ramka:#d8dde3;--blad:#c62828;color:var(--tekst);background:var(--tlo);font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--tlo:#15181c;--tlo-boczne:#1d2126;--tekst:#e6e9ed;--cichy:#9aa4af;--akcent:#6b9cf5;--moj-dymek:#23395f;--dymek:#262b31;--ramka:#333a42;--blad:#ff6b6b}}*{box-sizing:border-box}body{background:var(--tlo);margin:0}button,input{font:inherit}input{border:1px solid var(--ramka);background:var(--tlo);color:var(--tekst);border-radius:8px;min-width:0;padding:8px 10px}button{background:var(--akcent);color:#fff;cursor:pointer;border:0;border-radius:8px;padding:8px 14px}button:disabled{opacity:.5;cursor:default}button.link{color:var(--akcent);background:0 0;padding:4px}.glowny{padding:12px 24px;font-size:1.1rem}.srodek{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100vh;padding:16px;display:flex}.cichy,.cicho{color:var(--cichy)}.blad{color:var(--blad);margin:4px 0;font-size:.9rem}.uklad{height:100vh;display:flex}.boczny{background:var(--tlo-boczne);border-right:1px solid var(--ramka);flex-direction:column;flex-shrink:0;gap:12px;width:280px;padding:12px;display:flex;overflow-y:auto}.naglowek{justify-content:space-between;align-items:center;gap:8px;padding:4px 0;display:flex}.nowa{flex-wrap:wrap;gap:6px;display:flex}.nowa input{flex:1}.nowa .blad{width:100%}.lista{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.pozycja{text-align:left;width:100%;color:var(--tekst);background:0 0}.pozycja:hover{background:var(--dymek)}.pozycja.wybrana{background:var(--moj-dymek)}.rozmowa{flex-direction:column;flex:1;min-width:0;padding:12px 16px;display:flex}.rozmowa .srodek{flex:1;min-height:auto}.wiadomosci{flex-direction:column;flex:1;gap:6px;padding:8px 0;display:flex;overflow-y:auto}.dymek{background:var(--dymek);white-space:pre-wrap;overflow-wrap:anywhere;border-radius:12px;align-self:flex-start;max-width:75%;padding:8px 12px}.dymek.moj{background:var(--moj-dymek);align-self:flex-end}.autor{color:var(--cichy);margin-bottom:2px;font-size:.8rem}.czas{color:var(--cichy);text-align:right;margin-top:2px;font-size:.7rem}.pisanie{gap:8px;display:flex}.pisanie input{flex:1}@media (width<=640px){.uklad{flex-direction:column;height:auto;min-height:100vh}.boczny{border-right:0;border-bottom:1px solid var(--ramka);width:100%;max-height:40vh}.rozmowa{height:60vh}}