:root {
  --lm-cmp-ink: #1f2d2a;
  --lm-cmp-paper: #f6f4ef;
  --lm-cmp-line: #d8ddd9;
  --lm-cmp-accent: #f15a24;
  --lm-cmp-focus: #0b6f6a;
}

.lm-cmp,
.lm-cmp * {
  box-sizing: border-box;
  font-family: "Century Gothic", CenturyGothic, Arial, sans-serif;
}

.lm-cmp[hidden] { display: none !important; }

.lm-cmp-banner {
  position: fixed;
  z-index: 2147483000;
  right: 24px;
  bottom: 24px;
  width: min(560px, calc(100vw - 48px));
  padding: 28px;
  color: var(--lm-cmp-ink);
  background: rgba(246, 244, 239, .98);
  border: 1px solid var(--lm-cmp-line);
  border-left: 4px solid var(--lm-cmp-accent);
  box-shadow: 0 18px 55px rgba(19, 35, 31, .18);
}

.lm-cmp h2,
.lm-cmp h3 { margin: 0 0 12px; color: var(--lm-cmp-ink); line-height: 1.2; }
.lm-cmp p { margin: 0 0 18px; color: #43514e; font-size: 15px; line-height: 1.65; }
.lm-cmp a { color: var(--lm-cmp-ink); text-underline-offset: 3px; }

.lm-cmp-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.lm-cmp-button {
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid var(--lm-cmp-ink);
  background: transparent;
  color: var(--lm-cmp-ink);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  cursor: pointer;
}

.lm-cmp-button:hover { border-color: var(--lm-cmp-accent); color: var(--lm-cmp-accent); }
.lm-cmp-button:focus-visible,
.lm-cmp-toggle:focus-visible { outline: 3px solid var(--lm-cmp-focus); outline-offset: 3px; }

.lm-cmp-manage {
  position: fixed;
  z-index: 2147482998;
  left: 18px;
  bottom: 18px;
  min-height: 42px;
  padding: 8px 14px;
  border: 1px solid var(--lm-cmp-ink);
  background: var(--lm-cmp-paper);
  color: var(--lm-cmp-ink);
  font: 700 12px/1.2 "Century Gothic", CenturyGothic, Arial, sans-serif;
  cursor: pointer;
}

.lm-cmp-backdrop {
  position: fixed;
  z-index: 2147483001;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(18, 30, 27, .58);
}

.lm-cmp-panel {
  width: min(720px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  overflow: auto;
  padding: 30px;
  background: var(--lm-cmp-paper);
  border: 1px solid var(--lm-cmp-line);
  border-top: 4px solid var(--lm-cmp-accent);
}

.lm-cmp-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 22px;
  align-items: start;
  padding: 18px 0;
  border-top: 1px solid var(--lm-cmp-line);
}

.lm-cmp-row p { margin: 6px 0 0; }
.lm-cmp-toggle { width: 22px; height: 22px; accent-color: var(--lm-cmp-accent); }
.lm-cmp-status { margin-top: 16px; font-size: 12px; color: #65716e; }

@media (max-width: 620px) {
  .lm-cmp-banner { right: 12px; bottom: 12px; width: calc(100vw - 24px); padding: 22px; }
  .lm-cmp-actions { grid-template-columns: 1fr; }
  .lm-cmp-panel { padding: 22px; max-height: calc(100vh - 24px); }
  .lm-cmp-backdrop { padding: 12px; }
  .lm-cmp-manage { left: 12px; bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .lm-cmp *, .lm-cmp *::before, .lm-cmp *::after { scroll-behavior: auto !important; transition: none !important; }
}
