.bottom-nav.m51-besedka-nav { grid-template-columns: repeat(5,minmax(0,1fr)) !important; }
.bottom-nav.m51-besedka-nav .nav-btn { min-width: 0; padding-inline: 2px !important; }
.bottom-nav .m51-besedka-nav-icon > svg { width: 26px; height: 26px; }
#m51-besedka-unread[hidden], .m51-besedka [hidden] { display: none !important; }

html.m51-besedka-screen,
body.m51-besedka-open { overflow: hidden; overscroll-behavior: none; }
body.m51-besedka-open { padding-bottom: 0 !important; }
body.m51-besedka-open .app-shell {
  display: flex;
  flex-direction: column;
  height: var(--m51-room-height,100vh);
  height: var(--m51-room-height,100dvh);
  min-height: 0 !important;
  overflow: hidden;
  padding-bottom: var(--m51-room-nav,calc(var(--bottom-nav-h,82px) + max(env(safe-area-inset-bottom),var(--m51-system-nav-reserve,0px)) + 7px)) !important;
  background:
    radial-gradient(ellipse at 1% 5%,#b8d6f76e 0,transparent 56%),
    linear-gradient(165deg,#e7f2ff,#f7fbff 65%,#edf4fc) !important;
}
body.m51-besedka-open .app-shell > .topbar {
  flex: 0 0 auto;
  width: 100%;
  margin-bottom: 0 !important;
}
body.m51-besedka-open .topbar .topbar-row { flex-wrap: nowrap !important; gap: 7px; }
body.m51-besedka-open .topbar .logo-box { flex: 1 1 auto !important; min-width: 0; }
body.m51-besedka-open .topbar .user-pill {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 43%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}
body.m51-besedka-open.keyboard-open .app-shell { padding-bottom: max(6px,env(safe-area-inset-bottom)) !important; }
body.m51-besedka-open.keyboard-open .m51-besedka-pin { display: none; }
body.m51-besedka-open #m51GlobalProblemDock,
body.m51-besedka-open #m51-install-card { display: none !important; }

body.m51-besedka-open .app-shell > .m51-besedka {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: 520px;
  padding-top: 9px !important;
  padding-bottom: 2px !important;
  color: #102b47;
}
.m51-besedka-feed {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  overflow-anchor: none;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding: 0 3px 7px;
}
.m51-besedka-jump {
  align-self: flex-end;
  flex: 0 0 auto;
  min-height: 44px;
  margin: 4px 3px 0;
  padding: 5px 12px;
  border: 1px solid #a9c6e4;
  border-radius: 999px;
  background: #e5f2ff;
  color: #123e69;
  font: 800 12px/1.2 system-ui,sans-serif;
  box-shadow: 0 2px 6px #123e691a;
}
.m51-besedka-pin {
  flex: 0 0 auto;
  margin-bottom: 5px;
  border: 1px solid #e8c181;
  border-radius: 13px;
  background: linear-gradient(120deg,#fff7e7,#ffe5b8);
  box-shadow: 0 3px 8px #a1611618;
}
.m51-besedka-pin summary {
  display: grid;
  grid-template-columns: 31px minmax(0,1fr) 15px;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 5px 10px;
  color: #153454;
  list-style: none;
  cursor: pointer;
}
.m51-besedka-pin summary::-webkit-details-marker { display: none; }
.m51-besedka-pin-icon {
  display: grid;
  place-items: center;
  height: 31px;
  border-radius: 9px;
  background: #ffba60;
}
.m51-besedka-pin summary small { display: block; color: #804403; font-size: 11px; }
.m51-besedka-pin summary b {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}
.m51-besedka-chevron {
  width: 8px;
  height: 8px;
  border-right: 2px solid #804403;
  border-bottom: 2px solid #804403;
  transform: rotate(45deg);
}
.m51-besedka-pin[open] .m51-besedka-chevron { transform: rotate(225deg); }
.m51-besedka-pin-body {
  max-height: min(24vh,146px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 1px 10px 7px 48px;
  color: #1b3e60;
  font-size: 13px;
}
.m51-besedka-pin p, .m51-besedka-list p { margin: 4px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.m51-besedka-list { list-style: none; margin: 4px 0 8px; padding: 0; display: grid; gap: 10px; }
.m51-besedka-list li { min-width: 0; }
.m51-besedka-day {
  display: flex;
  justify-content: center;
  margin: 2px 0 8px;
}
.m51-besedka-day span {
  padding: 3px 9px;
  border: 1px solid #bed4eb;
  border-radius: 999px;
  background: #dbeafe;
  color: #1c4b74;
  font-size: 11px;
  font-weight: 760;
}
.m51-besedka-message { display: flex; align-items: flex-start; gap: 7px; width: fit-content; max-width: 94%; }
.m51-besedka-own .m51-besedka-message { flex-direction: row-reverse; margin-inline-start: auto; }
.m51-besedka-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  height: 32px;
  border: 2px solid #fff;
  border-radius: 11px;
  background: linear-gradient(145deg,#337ebc,#164a78);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  box-shadow: 0 3px 6px #16447030;
}
.m51-besedka-tone-1 { background: linear-gradient(145deg,#23877d,#115751); }
.m51-besedka-tone-2 { background: linear-gradient(145deg,#785cb3,#453175); }
.m51-besedka-tone-admin { background: linear-gradient(145deg,#ffc671,#ff9221); color: #532b07; }
.m51-besedka-list article {
  min-width: 0;
  padding: 7px 9px 3px;
  border: 1px solid #bfd8ef;
  border-radius: 5px 16px 16px;
  background: linear-gradient(150deg,#f8fcff,#e4f1ff);
  box-shadow: 0 3px 8px #183d6b17,inset 0 1px 0 #fff;
}
.m51-besedka-own article {
  border-radius: 16px 5px 16px 16px;
  border-color: #edc388;
  background: linear-gradient(150deg,#fff5e4,#ffdfae);
  box-shadow: 0 3px 8px #97561619,inset 0 1px 0 #fff9;
}
.m51-besedka-list article > header { display: flex; flex-wrap: wrap; gap: 2px 7px; align-items: baseline; }
.m51-besedka-list article > header b { overflow-wrap: anywhere; color: #153e67; font-size: 13px; }
.m51-besedka-list article > header time { margin-inline-start: auto; color: #496582; font-size: 11px; }
.m51-besedka-list article > header .m51-besedka-admin { color: #8a4404; font-size: 10px; font-weight: 800; }
.m51-besedka-new { display: block; text-align: center; font-size: 12px; font-weight: 750; color: #8a4907; margin: 2px 0 5px; }
.m51-besedka-actions { display: flex; justify-content: space-between; align-items: center; gap: 5px; margin: 1px 0 0; }
.m51-besedka-actions button, .m51-besedka-pin button, .m51-besedka-page button {
  appearance: none;
  min-height: 34px;
  padding: 3px 3px;
  border: 0;
  background: transparent;
  color: #245b91;
  font: 750 11px/1.2 system-ui,sans-serif;
}
.m51-besedka-menu { position: relative; margin-inline-start: auto; }
.m51-besedka-menu summary {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  color: #245b91;
  list-style: none;
  cursor: pointer;
}
.m51-besedka-menu summary::-webkit-details-marker { display: none; }
.m51-besedka-menu summary svg { width: 19px; height: 19px; }
.m51-besedka-menu[open] summary { background: #d9eafa; }
.m51-besedka-menu > div {
  position: absolute;
  z-index: 4;
  inset: auto 0 calc(100% + 4px) auto;
  min-width: 112px;
  padding: 3px;
  border: 1px solid #c9dbee;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 6px 15px #0c30542b;
}
.m51-besedka-menu > div button { display: block; width: 100%; padding-inline: 8px; text-align: start; }
.m51-besedka-page { text-align: center; }

.m51-besedka-quote, .m51-besedka-draft-quote {
  margin: 5px 0;
  padding: 4px 7px;
  border-inline-start: 3px solid #438dcc;
  border-radius: 4px 8px 8px 4px;
  background: #cee5fb9a;
  color: #365773;
  font-size: 11px;
  overflow-wrap: anywhere;
}
.m51-besedka-own .m51-besedka-quote, .m51-besedka-draft-quote {
  border-inline-start-color: #e1861f;
  background: #ffd3948f;
  color: #694521;
}
.m51-besedka-quote b, .m51-besedka-draft-quote b { display: block; color: inherit; }
.m51-besedka-draft-quote { display: flex; gap: 7px; align-items: center; justify-content: space-between; }
.m51-besedka-draft-quote > div { min-width: 0; }
.m51-besedka-draft-quote span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.m51-besedka-draft-quote button {
  flex: 0 0 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #8a4404;
  font-size: 22px;
}
.m51-besedka-status { flex: 0 0 auto; color: #405d79; margin: 7px 0; font-size: 13px; }
.m51-besedka-status:empty { display: none; }
.m51-besedka-form { flex: 0 0 auto; padding-top: 5px; }
.m51-besedka-quote-link {
  display: block;
  width: 100%;
  min-height: 44px;
  border-block: 0;
  border-inline-end: 0;
  text-align: start;
  font: inherit;
  font-size: 11px;
}
.m51-besedka-found article {
  outline: 2px solid #ec9c3a;
  outline-offset: 1px;
  background: #fff1d4;
}
.m51-besedka-compose {
  display: grid;
  grid-template-columns: minmax(0,1fr) 46px;
  gap: 6px;
  align-items: center;
  padding: 5px;
  border: 1px solid #bcd5ed;
  border-radius: 17px;
  background: #f8fbff;
  box-shadow: 0 5px 12px #214b7022;
}
.m51-besedka-compose textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  padding: 12px 8px;
  resize: vertical;
  font-size: 16px;
  line-height: 22px;
  border: 0;
  border-radius: 12px;
  background: #f8fbff;
  color: #12314f;
}
.m51-besedka-compose textarea::placeholder { color: #54708b; }
.m51-besedka-compose .btn {
  display: grid !important;
  place-items: center;
  width: 46px !important;
  height: 46px;
  min-width: 0 !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
}
.m51-besedka-compose .btn svg { width: 22px; height: 22px; }
@media (pointer: coarse) {
  .m51-besedka-compose textarea { resize: none; }
  .m51-besedka-actions button, .m51-besedka-pin button, .m51-besedka-page button { min-height: 44px; }
  .m51-besedka-menu summary { width: 44px; height: 44px; }
}
@media (max-width: 380px) {
  .bottom-nav.m51-besedka-nav { padding-inline: 4px !important; }
  .bottom-nav.m51-besedka-nav .m51-nav-label { font-size: 10px !important; white-space: nowrap; }
}