:root {
  --bg: #eef2ef;
  --bg-elevated: #fbfcfb;
  --ink: #14201b;
  --muted: #5a6b63;
  --line: #d5ddd8;
  --accent: #0d6b56;
  --accent-soft: rgba(13, 107, 86, 0.1);
  --accent-hover: #095544;
  --danger: #a33b3b;
  --ok: #1f6b3a;
  --shadow: 0 12px 32px rgba(20, 32, 27, 0.07);
  --shadow-hover: 0 18px 40px rgba(20, 32, 27, 0.12);
  --radius: 16px;
  --radius-sm: 10px;
  --font: "Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif;
  --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --topbar-h: 64px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background:
    radial-gradient(900px 420px at 8% -8%, #d9ebe4 0%, transparent 55%),
    radial-gradient(800px 380px at 100% 0%, #e8e4d8 0%, transparent 50%),
    linear-gradient(180deg, #f4f7f5 0%, var(--bg) 40%);
  background-attachment: fixed;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--accent);
  text-decoration: none;
  transition: color 0.2s var(--ease);
}
a:hover { color: var(--accent-hover); }

.icon {
  display: inline-flex;
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
}
.icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* —— Topbar —— */
.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(251, 252, 251, 0.82);
  backdrop-filter: blur(14px) saturate(1.2);
  -webkit-backdrop-filter: blur(14px) saturate(1.2);
  border-bottom: 1px solid rgba(213, 221, 216, 0.85);
  transition: box-shadow 0.25s var(--ease);
}

.topbar.is-scrolled {
  box-shadow: 0 8px 24px rgba(20, 32, 27, 0.06);
}

.topbar-inner {
  max-width: 1160px;
  margin: 0 auto;
  min-height: var(--topbar-h);
  padding: 0.55rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--ink);
  text-decoration: none;
  font-weight: 800;
  letter-spacing: -0.02em;
  white-space: nowrap;
  transition: transform 0.25s var(--ease);
}
.brand:hover {
  transform: translateY(-1px);
  color: var(--ink);
  text-decoration: none;
}

.brand-mark {
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  background: linear-gradient(145deg, #127a63, #0a4f40);
  color: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 6px 14px rgba(13, 107, 86, 0.28);
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
}
.brand:hover .brand-mark {
  transform: rotate(-6deg) scale(1.05);
  box-shadow: 0 8px 18px rgba(13, 107, 86, 0.35);
}
.brand-icon { width: 1.05rem; height: 1.05rem; color: #fff; }
.brand-text { font-size: 1.05rem; }

.nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.25rem;
  flex: 1;
  min-width: 0;
  overflow: visible;
  padding: 0.15rem 0;
  align-items: center;
}

.nav-drop {
  position: relative;
  flex-shrink: 0;
}

.nav-drop-btn {
  border: 0;
  cursor: pointer;
  font: inherit;
}

.nav-caret {
  font-size: 0.7rem;
  opacity: 0.75;
  margin-left: 0.1rem;
  transition: transform 0.2s var(--ease);
}

.nav-drop.is-open .nav-caret {
  transform: rotate(180deg);
}

.nav-drop.is-current > .nav-drop-btn {
  color: var(--ink);
  background: var(--accent-soft);
}

.nav-drop-menu {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  min-width: 13.5rem;
  max-width: min(20rem, 90vw);
  padding: 0.35rem;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(20, 32, 27, 0.14);
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.nav-drop-menu[hidden] {
  display: none;
}

.nav-drop-item {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  color: var(--ink);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 600;
  white-space: nowrap;
}

.nav-drop-item .icon {
  width: 0.95rem;
  height: 0.95rem;
  color: var(--muted);
  flex-shrink: 0;
}

.nav-drop-item:hover {
  background: var(--accent-soft);
  color: var(--ink);
  text-decoration: none;
}

.nav-drop-item:hover .icon {
  color: var(--accent);
}

.nav-drop-item.is-active {
  background: var(--accent);
  color: #fff;
}

.nav-drop-item.is-active .icon {
  color: #fff;
}

.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  padding: 0.45rem 0.7rem;
  border-radius: 999px;
  white-space: nowrap;
  position: relative;
  transition:
    color 0.22s var(--ease),
    background 0.22s var(--ease),
    transform 0.22s var(--ease),
    box-shadow 0.22s var(--ease);
}
.nav-link .icon {
  width: 0.95rem;
  height: 0.95rem;
  transition: transform 0.28s var(--ease), color 0.22s var(--ease);
}
.nav-link:hover {
  color: var(--ink);
  background: var(--accent-soft);
  text-decoration: none;
  transform: translateY(-1px);
}
.nav-link:hover .icon {
  transform: translateY(-2px) scale(1.12);
  color: var(--accent);
}
.nav-link.is-active {
  color: #fff;
  background: var(--accent);
  box-shadow: 0 8px 18px rgba(13, 107, 86, 0.25);
}
.nav-link.is-active .icon {
  color: #fff;
  transform: none;
}
.nav-link.is-active:hover {
  background: var(--accent-hover);
  color: #fff;
}

.topbar-right {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.user-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--muted);
}

.user-avatar {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  display: grid;
  place-items: center;
  font-size: 0.75rem;
  font-weight: 800;
}

.nav-toggle {
  display: none;
  border: 1px solid var(--line);
  background: var(--bg-elevated);
  border-radius: 12px;
  width: 2.6rem;
  height: 2.6rem;
  padding: 0;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  transition: background 0.2s var(--ease), border-color 0.2s var(--ease);
}
.nav-toggle:hover {
  background: #fff;
  border-color: #bcc9c2;
}

.burger {
  width: 1.1rem;
  height: 0.85rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.burger span {
  display: block;
  height: 2px;
  background: var(--ink);
  border-radius: 2px;
  transition: transform 0.28s var(--ease), opacity 0.2s ease;
  transform-origin: center;
}
.nav-toggle.is-open .burger span:nth-child(1) {
  transform: translateY(5.5px) rotate(45deg);
}
.nav-toggle.is-open .burger span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open .burger span:nth-child(3) {
  transform: translateY(-5.5px) rotate(-45deg);
}

.nav-mobile {
  display: none;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.35rem 1rem 1.1rem;
  border-top: 1px solid var(--line);
  animation: slideDown 0.28s var(--ease);
}
.nav-mobile:not([hidden]) { display: flex; }

.nav-mobile-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 0.95rem;
  border-radius: 14px;
  color: var(--ink);
  font-weight: 600;
  text-decoration: none;
  background: transparent;
  transition: background 0.2s var(--ease), transform 0.2s var(--ease);
}
.nav-mobile-link .icon {
  width: 1.35rem;
  height: 1.35rem;
  color: var(--accent);
  transition: transform 0.25s var(--ease);
}
.nav-mobile-link:hover,
.nav-mobile-link.is-active {
  background: var(--accent-soft);
  text-decoration: none;
}
.nav-mobile-link:hover .icon {
  transform: scale(1.12) rotate(-4deg);
}
.nav-mobile-link.is-active {
  background: var(--accent);
  color: #fff;
}
.nav-mobile-link.is-active .icon { color: #fff; }

.nav-mobile-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px dashed var(--line);
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* —— Main —— */
.main {
  max-width: 1160px;
  margin: 0 auto;
  padding: 1.25rem 1.25rem 2.5rem;
}

.page-head,
.hero-home {
  margin-bottom: 1rem;
}

.eyebrow {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
}

.page-head h1,
.hero-home h1 {
  margin: 0 0 0.25rem;
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.lede {
  margin: 0;
  color: var(--muted);
  max-width: 40rem;
  line-height: 1.45;
  font-size: 0.95rem;
}

/* —— Cards —— */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.75rem;
}

.card-grid-fit {
  align-content: start;
}

.panel-card {
  --delay: 0ms;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0.9rem 1rem;
  box-shadow: var(--shadow);
  color: inherit;
  transition:
    transform 0.25s var(--ease),
    border-color 0.25s var(--ease),
    box-shadow 0.25s var(--ease),
    background 0.25s var(--ease);
}
.panel-card:hover {
  transform: translateY(-2px);
  border-color: #b7cfc6;
  box-shadow: var(--shadow-hover);
  background: #fff;
}

.panel-head {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.panel-icon {
  width: 1.15rem;
  height: 1.15rem;
  flex-shrink: 0;
  color: var(--accent);
  opacity: 0.75;
  display: grid;
  place-items: center;
  transition: opacity 0.2s var(--ease), transform 0.25s var(--ease);
}
.panel-icon .icon {
  width: 1.05rem;
  height: 1.05rem;
}
.panel-card:hover .panel-icon {
  opacity: 1;
  transform: scale(1.08);
}

.panel-head h2 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--ink);
}

.panel-desc {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
  flex: 1;
}

.panel-cta {
  align-self: flex-start;
  margin-top: 0.15rem;
  padding: 0.4rem 0.9rem;
  font-size: 0.88rem;
  text-decoration: none;
}
.panel-cta:hover {
  text-decoration: none;
  color: #fff;
}

.reveal {
  animation: riseIn 0.45s var(--ease) both;
  animation-delay: var(--delay, 0ms);
}

@keyframes riseIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

.muted { color: var(--muted); }
.small { font-size: 0.85rem; }

/* —— Buttons —— */
.btn {
  border: 1px solid var(--line);
  background: var(--bg-elevated);
  color: var(--ink);
  border-radius: 11px;
  padding: 0.5rem 0.95rem;
  cursor: pointer;
  font: inherit;
  font-weight: 650;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  transition:
    transform 0.2s var(--ease),
    background 0.2s var(--ease),
    border-color 0.2s var(--ease),
    box-shadow 0.2s var(--ease),
    color 0.2s var(--ease);
}
.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(20, 32, 27, 0.08);
}
.btn:active { transform: translateY(0); }

.btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.btn-primary:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
  color: #fff;
}

.btn-danger {
  background: #fff5f5;
  border-color: #e8b4b4;
  color: var(--danger);
}
.btn-danger:hover { background: #ffe8e8; }

.btn-ghost {
  background: transparent;
}
.btn-ghost:hover {
  background: var(--accent-soft);
  border-color: transparent;
}

.btn-sm {
  padding: 0.35rem 0.7rem;
  font-size: 0.85rem;
}

.btn-icon .icon {
  width: 1rem;
  height: 1rem;
}

.inline { display: inline; }

.stack {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}

label {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--ink);
}

input[type="text"],
input[type="password"],
input[type="url"] {
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 0.65rem 0.8rem;
  font: inherit;
  font-weight: 500;
  background: #fff;
  transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
input:focus {
  outline: none;
  border-color: #8fb8ab;
  box-shadow: 0 0 0 4px rgba(13, 107, 86, 0.12);
}

.check {
  flex-direction: row;
  align-items: center;
  gap: 0.45rem;
  font-weight: 500;
}

.form-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 1rem;
}
.form-row.compact { margin-bottom: 0.6rem; }

.alert {
  padding: 0.8rem 0.95rem;
  border-radius: 12px;
  margin-bottom: 1rem;
  animation: riseIn 0.35s var(--ease);
}
.alert-ok {
  background: #e8f6ec;
  color: var(--ok);
  border: 1px solid #b7dfc2;
}
.alert-error {
  background: #fdecec;
  color: var(--danger);
  border: 1px solid #efc0c0;
}

/* —— Login —— */
.login-body {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 1.25rem;
  background:
    radial-gradient(700px 360px at 15% 10%, #d5ebe3 0%, transparent 55%),
    radial-gradient(600px 320px at 90% 90%, #ebe6d8 0%, transparent 50%),
    var(--bg);
}

.login-card {
  width: min(400px, 100%);
  background: rgba(251, 252, 251, 0.94);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 1.75rem 1.6rem;
  box-shadow: var(--shadow-hover);
  animation: riseIn 0.5s var(--ease);
  backdrop-filter: blur(8px);
}
.login-card h1 {
  margin: 0 0 0.25rem;
  font-family: var(--font-display);
  font-size: 1.85rem;
  font-weight: 600;
}
.login-card .btn-primary {
  width: 100%;
  padding: 0.75rem;
  margin-top: 0.25rem;
}

/* —— Embed / links —— */
.embed-wrap {
  background: #111;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--line);
  min-height: min(78vh, 900px);
  box-shadow: var(--shadow);
}
.embed-wrap iframe {
  width: 100%;
  height: min(78vh, 900px);
  min-height: 560px;
  border: 0;
  display: block;
  background: #f3f3f3;
}
.embed-help {
  margin-top: 0.85rem;
  font-size: 0.88rem;
  line-height: 1.45;
  max-width: 52rem;
}
.embed-help code {
  font-size: 0.82em;
  background: rgba(20, 32, 27, 0.06);
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
}
.page-head-compact {
  margin-bottom: 0.85rem;
}
.page-head-compact .lede {
  margin-top: 0.35rem;
}

.page-head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.dash-open {
  display: flex;
  justify-content: flex-start;
  padding: 0.5rem 0 1rem;
}

.btn-xl {
  padding: 1.05rem 1.6rem;
  font-size: 1.15rem;
  border-radius: 14px;
  min-width: min(100%, 320px);
  gap: 0.65rem;
  box-shadow: 0 12px 28px rgba(13, 107, 86, 0.22);
}
.btn-xl .icon {
  width: 1.35rem;
  height: 1.35rem;
}
.btn-xl:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(13, 107, 86, 0.28);
}

.link-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.55rem;
}

/* Modal */
body.modal-open { overflow: hidden; }

.modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 0.6rem;
}
.modal[hidden] { display: none !important; }

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 32, 27, 0.45);
  backdrop-filter: blur(3px);
  animation: riseIn 0.2s var(--ease);
}

.modal-dialog {
  position: relative;
  z-index: 1;
  width: min(440px, 100%);
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow-hover);
  padding: 1.15rem 1.2rem 1.25rem;
  animation: riseIn 0.28s var(--ease);
}

.modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}
.modal-head-text {
  min-width: 0;
  flex: 1;
}
.modal-head h2 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1.25;
  word-break: break-word;
}
.modal-head .small {
  margin: 0.35rem 0 0;
}
.modal-x {
  flex-shrink: 0;
}

.tool-panel {
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.15rem 1.25rem 1.25rem;
  box-shadow: var(--shadow);
  max-width: 720px;
}
.tool-panel h2 {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  font-weight: 800;
}
.tool-steps {
  margin: 0 0 0.85rem;
  padding-left: 1.2rem;
  display: grid;
  gap: 0.45rem;
  line-height: 1.45;
}
.tool-panel .muted { margin: 0; }

.file-drop {
  display: grid;
  gap: 0.35rem;
  justify-items: start;
  padding: 1rem 1.05rem;
  border: 1.5px dashed var(--line-strong, var(--line));
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg) 70%, var(--bg-elevated));
  cursor: pointer;
}
.file-drop input[type="file"] {
  width: 100%;
  font-size: 0.92rem;
}
.file-drop-title { font-weight: 700; }
.file-drop-hint { font-size: 0.88rem; }

.modal-body select {
  width: 100%;
  font: inherit;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.cf-tx-table select.cf-article-select {
  width: auto;
  max-width: 18rem;
  padding: 0.3rem 0.4rem;
  border-radius: 8px;
}

.link-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.link-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.85rem 1rem;
  align-items: start;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.05rem 1.15rem;
  box-shadow: var(--shadow);
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease), border-color 0.25s var(--ease);
}
.link-item:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-hover);
  border-color: #b7cfc6;
}
.link-item-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.link-delete {
  margin-top: 0.45rem;
}
.link-manage {
  max-width: 520px;
}
.link-manage .stack .btn {
  align-self: flex-start;
}
.link-item-icon {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 12px;
  background: var(--accent-soft);
  color: var(--accent);
  display: grid;
  place-items: center;
  transition: transform 0.28s var(--ease), background 0.28s var(--ease), color 0.28s var(--ease);
}
.link-item:hover .link-item-icon {
  transform: scale(1.08);
  background: var(--accent);
  color: #fff;
}
.link-title {
  font-weight: 750;
  font-size: 1.05rem;
  color: var(--ink);
  transition: color 0.2s var(--ease);
}
.link-item:hover .link-title { color: var(--accent); }
.link-desc {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
}

.empty-state {
  background: var(--bg-elevated);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  padding: 2.25rem 1.5rem;
  text-align: center;
}

/* —— Admin —— */
.admin-grid {
  display: grid;
  gap: 1.25rem;
}

.admin-block {
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.25rem 1.3rem;
  box-shadow: var(--shadow);
  transition: box-shadow 0.25s var(--ease);
}
.admin-block:hover { box-shadow: var(--shadow-hover); }
.admin-block h2 {
  margin: 0 0 0.85rem;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.admin-block h3 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
}
.admin-form {
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--line);
}

.user-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0.95rem;
  margin-bottom: 0.75rem;
  background: #fff;
  transition: border-color 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.user-card:hover {
  border-color: #c5d4cd;
  box-shadow: 0 8px 20px rgba(20, 32, 27, 0.05);
}
.user-card-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.6rem;
  flex-wrap: wrap;
}

.badge {
  font-size: 0.72rem;
  font-weight: 700;
  background: var(--accent-soft);
  color: var(--accent);
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
}

.access-form {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.access-pages {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.25rem 0.75rem;
  padding: 0.5rem 0;
}
.access-pages.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

.admin-link-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.admin-link-list li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--line);
}

/* —— Mobile —— */
@media (max-width: 920px) {
  .nav-label { display: none; }
  .nav-caret { display: none; }
  .nav-link {
    padding: 0.55rem;
    border-radius: 12px;
  }
  .nav-link .icon { width: 1.25rem; height: 1.25rem; }
  .user-name { display: none; }
}

@media (max-width: 760px) {
  :root { --topbar-h: 58px; }

  .nav,
  .topbar-right { display: none; }

  .nav-toggle { display: inline-flex; margin-left: auto; }

  .main { padding: 1.25rem 1rem 2.5rem; }

  .card-grid {
    grid-template-columns: 1fr;
    gap: 0.65rem;
  }

  .panel-card {
    padding: 0.85rem 0.95rem;
  }

  .panel-head h2 {
    font-size: 1.1rem;
  }

  .page-head-row .btn {
    width: 100%;
  }
  .main.cf-report-main .page-head-row .cf-head-actions .btn {
    width: auto;
  }
  .btn-xl {
    width: 100%;
    min-width: 0;
  }
  .embed-wrap iframe {
    height: 70vh;
    min-height: 420px;
  }
  .embed-wrap { min-height: 70vh; }

  .form-row {
    flex-direction: column;
    align-items: stretch;
  }
  .form-row .btn,
  .form-row input {
    width: 100%;
  }

  .admin-link-list li {
    flex-direction: column;
    gap: 0.65rem;
  }

  .login-card { padding: 1.4rem 1.2rem; }

  .btn-icon span { display: none; }
  .nav-mobile-footer .btn-icon span { display: inline; }
}

.modal-dialog-wide {
  width: min(96vw, 640px);
  max-height: min(92vh, 900px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 1rem 1.1rem 1.05rem;
}

.cf-modal-dialog.modal-dialog-wide {
  width: min(96vw, 80rem);
  max-width: calc(100vw - 1.2rem);
  height: auto;
  max-height: calc(100dvh - 1.2rem);
  padding: 0.55rem 0.7rem 0.6rem;
}

.cf-modal-dialog .modal-head {
  margin-bottom: 0.4rem;
}

.cf-modal-dialog .modal-head h2 {
  font-size: 0.98rem;
}

.cf-modal-dialog .modal-head .small {
  margin-top: 0.15rem;
  font-size: 0.8rem;
}

.cf-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* —— Cashflow report page —— */
.main.cf-report-main {
  max-width: none;
  width: 100%;
  height: calc(100dvh - var(--topbar-h));
  min-height: calc(100dvh - var(--topbar-h));
  padding-top: 0.7rem;
  padding-bottom: 0.7rem;
  padding-left: clamp(0.75rem, 2.5vw, 2rem);
  padding-right: clamp(0.75rem, 2.5vw, 2rem);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.cf-report-page {
  width: 100%;
  max-width: none;
  flex: 1 1 0%;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.main.cf-report-main .page-head {
  flex-shrink: 0;
  margin-bottom: 0;
  align-items: flex-start;
  gap: 0.75rem 1.25rem;
}

.main.cf-report-main .page-head-row {
  flex-wrap: nowrap;
  align-items: center;
}

.main.cf-report-main .page-head-main {
  flex: 0 0 auto;
  min-width: 0;
}

.main.cf-report-main .page-head .cf-filters-bar {
  flex: 1 1 auto;
  min-width: 8rem;
}

.main.cf-report-main .page-head h1 {
  font-size: clamp(1.15rem, 2vw, 1.4rem);
}

.main.cf-report-main .lede {
  max-width: 42rem;
  font-size: 0.86rem;
  margin-bottom: 0;
}

.main.cf-report-main .alert {
  flex-shrink: 0;
  margin-bottom: 0;
  padding: 0.55rem 0.75rem;
}

.cf-head-actions {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.3rem 0.4rem;
  max-width: none;
  padding: 0.22rem 0.4rem;
  background: color-mix(in srgb, var(--bg-elevated) 90%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
}

.cf-head-actions-meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.3rem 0.45rem;
}

.cf-head-actions .cf-tree-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.cf-head-actions .btn {
  width: auto;
}

#cf-refresh-btn.is-busy {
  opacity: 0.72;
  pointer-events: none;
}

.cf-chrome {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.45rem;
  width: 100%;
  z-index: 15;
}

.cf-chrome:has(> .cf-filters-panel[hidden]:only-child) {
  display: contents;
}

.cf-filters-bar {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
}

.cf-filters-stats {
  font-size: 0.82rem;
}

.cf-filters-panel {
  width: 100%;
}

.cf-filters-panel[hidden] {
  display: none;
}

.cf-filters-toggle[aria-expanded="true"] {
  background: var(--accent-soft);
  color: var(--ink);
}

.cf-toolbar {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
  align-items: center;
  width: 100%;
  max-width: 100%;
  margin-bottom: 0;
  padding: 0.45rem 0.7rem;
  font-size: 0.86rem;
  box-sizing: border-box;
  background: color-mix(in srgb, var(--bg-elevated) 92%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
}

.cf-toolbar-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 0.55rem;
  margin-left: auto;
}

.cf-initial-plan-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem 0.75rem;
  width: 100%;
}

.cf-grand {
  font-size: 0.86rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.cf-grand strong {
  font-weight: 800;
  letter-spacing: -0.01em;
}

.cf-morning {
  width: 100%;
  align-self: stretch;
  padding: 0.35rem 0.55rem 0.4rem;
  background: color-mix(in srgb, var(--bg-elevated) 88%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
}

.cf-morning-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.28rem;
}

.cf-morning-title {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--muted);
}

.cf-morning-total {
  font-size: 0.82rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.cf-morning-total.is-neg,
.cf-morning-val.is-neg { color: var(--danger); }
.cf-morning-total.is-pos,
.cf-morning-val.is-pos { color: var(--ok); }

.cf-morning-cols {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.55rem 0.85rem;
  overflow: visible;
}

.cf-morning-col {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
}

.cf-morning-col-title {
  font-size: 0.68rem;
  font-weight: 750;
  color: var(--ink);
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-bottom: 0.12rem;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 75%, transparent);
  margin-bottom: 0.05rem;
}

.cf-morning-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem;
  min-width: 0;
}

.cf-morning-acc {
  font-size: 0.7rem;
  font-weight: 550;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.cf-morning-val {
  flex: 0 0 auto;
  font-size: 0.74rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
  color: var(--ink);
}

.cf-morning-mini {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.35rem 0.85rem;
  margin: 0.05rem 0 0.4rem;
  padding: 0.28rem 0 0.38rem;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}

.cf-morning-mini-item {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}

.cf-morning-mini-label {
  font-size: 0.66rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
}

.cf-morning-mini-val {
  font-size: 0.88rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.cf-morning-mini-val.is-neg { color: var(--danger); }
.cf-morning-mini-val.is-pos { color: var(--ok); }

.cf-kpi-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem 0.85rem;
  width: 100%;
  margin: 0;
  padding: 0.65rem 0.85rem;
  background: color-mix(in srgb, var(--bg-elevated) 92%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow);
  box-sizing: border-box;
}

.cf-kpi-item {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  min-width: 0;
}

.cf-kpi-label {
  font-size: 0.72rem;
  line-height: 1.25;
  color: var(--muted);
  font-weight: 650;
}

.cf-kpi-value {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.cf-kpi-value.is-neg,
.cf-kpi-pair strong.is-neg { color: var(--danger); }
.cf-kpi-value.is-pos,
.cf-kpi-pair strong.is-pos { color: var(--ok); }

.cf-kpi-pair {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.25rem 0.85rem;
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 600;
}

.cf-kpi-pair strong {
  display: inline-block;
  margin-left: 0.3rem;
  font-size: 0.95rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}

.pf-cash-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem 0.85rem;
  width: 100%;
  margin: 0 0 0.55rem;
  padding: 0.65rem 0.85rem;
  background: color-mix(in srgb, var(--bg-elevated) 92%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow);
}

.pf-cash-item {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  min-width: 0;
}

.pf-cash-label {
  font-size: 0.72rem;
  line-height: 1.25;
  color: var(--muted);
  font-weight: 650;
}

.pf-cash-value {
  font-size: 1.05rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.pf-cash-value.is-neg,
.pf-cash-pair strong.is-neg { color: var(--danger); }
.pf-cash-value.is-pos,
.pf-cash-pair strong.is-pos { color: var(--ok); }

.pf-cash-pair {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.25rem 0.85rem;
  font-size: 0.78rem;
  color: var(--muted);
  font-weight: 600;
}

.pf-cash-pair strong {
  display: inline-block;
  margin-left: 0.3rem;
  font-size: 0.95rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}

.cf-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(10rem, 1fr));
  gap: 0.45rem 0.75rem;
  width: 100%;
  margin: 0 0 0.55rem;
  padding: 0.55rem 0.7rem;
  background: color-mix(in srgb, var(--bg-elevated) 92%, var(--accent-soft));
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow);
}

.cf-summary-item {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}

.cf-summary-label {
  font-size: 0.72rem;
  line-height: 1.25;
  color: var(--muted);
  font-weight: 600;
}

.cf-summary-value {
  font-size: 0.98rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  text-align: right;
}

.cf-summary-value.is-neg { color: var(--danger); }
.cf-summary-value.is-pos { color: var(--ok); }

.cf-tree-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.cf-tree-actions .btn {
  padding: 0.28rem 0.55rem;
  font-size: 0.75rem;
}

.cf-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.55rem 0.85rem;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0.55rem 0.7rem;
  margin-bottom: 0;
  box-shadow: var(--shadow);
  width: fit-content;
  max-width: 100%;
  font-size: 0.82rem;
}

.cf-filter-block {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0;
  border-bottom: 0;
  min-width: 0;
}

.cf-filter-title {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.cf-mode-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.7rem;
}

.cf-mode-row .check {
  font-size: 0.8rem;
}

.cf-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(9.5rem, 12rem));
  gap: 0.35rem 0.55rem;
}

.cf-filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  align-items: center;
  padding-bottom: 0.1rem;
}

.cf-filter-actions .btn {
  padding: 0.4rem 0.75rem;
  font-size: 0.82rem;
}

.cf-filters .form-row.compact {
  margin-bottom: 0;
  gap: 0.35rem;
}

.cf-filters label {
  font-size: 0.78rem;
  gap: 0.2rem;
}

.cf-filters select,
.cf-filters input[type="date"],
.cf-filters input[type="search"],
.cf-filters input[type="text"] {
  min-width: 0;
  width: auto;
  max-width: 12rem;
  padding: 0.35rem 0.45rem;
  font-size: 0.8rem;
  border-radius: 8px;
}

.cf-filters .cf-filter-grid select,
.cf-filters .cf-filter-grid input {
  width: 100%;
  max-width: none;
}

.cf-sticky-col {
  position: sticky;
  left: 0;
  background: var(--bg-elevated);
  z-index: 2;
}

.cf-table thead .cf-sticky-col {
  background: #e4ebe7;
  z-index: 5;
}

.cf-table tfoot .cf-sticky-col {
  background: #e8eeea;
  z-index: 6;
}

.cf-table tfoot .is-neg,
.cf-tx-table .is-neg { color: var(--danger); }
.cf-table tfoot .is-pos,
.cf-tx-table .is-pos { color: var(--ok); }

.cf-table-wrap {
  flex: 1 1 0%;
  min-height: 0;
  min-width: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  width: 100%;
  max-width: 100%;
}

.cf-table,
.cf-tx-table {
  border-collapse: collapse;
  font-size: 0.8rem;
}

.cf-table {
  --cf-grid: color-mix(in srgb, var(--line) 88%, #fff);
  --cf-row-alt: rgba(20, 32, 27, 0.028);
  --cf-row-alt-solid: #f3f5f4;
  --cf-num-col: 7.75rem;
  --cf-article-col: 32rem;
  --cf-struct-col: 0rem;
  border: 0;
  width: max-content;
  min-width: 0;
  table-layout: fixed;
  /* separate + spacing 0: sticky thead/tfoot work reliably (collapse breaks bottom sticky) */
  border-collapse: separate;
  border-spacing: 0;
}

.cf-table tbody tr.is-tree-hidden {
  display: none;
}

.cf-table .cf-sticky-col {
  min-width: var(--cf-article-col);
  width: var(--cf-article-col);
  max-width: var(--cf-article-col);
}

.cf-table .cf-total-col {
  position: sticky;
  left: calc(var(--cf-article-col) + var(--cf-struct-col));
  z-index: 2;
  background: var(--bg-elevated);
  box-shadow: 6px 0 10px -8px rgba(20, 32, 27, 0.28);
}

.cf-table .cf-struct-col {
  position: sticky;
  left: var(--cf-article-col);
  z-index: 2;
  width: var(--cf-struct-col);
  min-width: var(--cf-struct-col);
  max-width: var(--cf-struct-col);
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-size: 0.68rem;
  letter-spacing: -0.03em;
  background: var(--bg-elevated);
  box-shadow: inset -1px 0 0 color-mix(in srgb, var(--line) 70%, transparent);
  padding-left: 0.15rem;
  padding-right: 0.15rem;
}

.cf-dds-table {
  --cf-struct-col: 3.35rem;
  --cf-month-struct-col: 3.1rem;
  --cf-article-col: 20rem;
  table-layout: fixed;
}

.cf-dds-table .cf-sticky-col,
.cf-dds-table .cf-struct-col,
.cf-dds-table .cf-total-col {
  z-index: 2;
}

.cf-dds-table thead .cf-sticky-col {
  z-index: 6;
}

.cf-dds-table thead .cf-struct-col {
  z-index: 6;
  background: #e4ebe7;
}

.cf-dds-table thead .cf-total-col {
  z-index: 7;
  background: #e4ebe7;
}

.cf-dds-table tfoot .cf-sticky-col,
.cf-dds-table tfoot .cf-struct-col {
  z-index: 6;
  background: #e8eeea;
}

.cf-dds-table tfoot .cf-total-col {
  z-index: 7;
  background: #e8eeea;
}

.cf-dds-table tbody tr:nth-child(even) .cf-sticky-col,
.cf-dds-table tbody tr:nth-child(even) .cf-struct-col,
.cf-dds-table tbody tr:nth-child(even) .cf-total-col {
  background: var(--cf-row-alt-solid);
}

.cf-dds-table tbody tr:nth-child(odd) .cf-sticky-col,
.cf-dds-table tbody tr:nth-child(odd) .cf-struct-col,
.cf-dds-table tbody tr:nth-child(odd) .cf-total-col {
  background: var(--bg-elevated);
}

.cf-dds-table .cf-month-struct-col {
  width: var(--cf-month-struct-col);
  min-width: var(--cf-month-struct-col);
  max-width: var(--cf-month-struct-col);
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-size: 0.68rem;
  letter-spacing: -0.03em;
  color: #5a6a62;
  background: color-mix(in srgb, var(--bg-elevated) 90%, #d7e0da);
  padding-left: 0.15rem;
  padding-right: 0.15rem;
}

.cf-dds-table thead .cf-month-struct-col {
  font-size: 0.72rem;
  font-weight: 700;
  vertical-align: bottom;
}

.cf-dds-table tbody tr:nth-child(even) .cf-month-struct-col {
  background: color-mix(in srgb, var(--cf-row-alt-solid) 88%, #d7e0da);
}

.cf-dds-table.cf-hide-month-struct .cf-month-struct-col {
  display: none;
}

.cf-table thead .cf-struct-col {
  background: #e4ebe7;
  z-index: 5;
  font-size: 0.72rem;
  white-space: normal;
  line-height: 1.2;
  vertical-align: bottom;
}

.cf-table tbody tr:nth-child(even) .cf-struct-col {
  background: var(--cf-row-alt-solid);
}

.cf-table tbody tr:nth-child(odd) .cf-struct-col {
  background: var(--bg-elevated);
}

.cf-table tfoot .cf-struct-col {
  background: #e8eeea;
  z-index: 6;
  text-align: center;
}

.cf-table thead .cf-total-col {
  background: #e4ebe7;
  z-index: 5;
}

.cf-table tbody tr:nth-child(even) .cf-total-col {
  background: var(--cf-row-alt-solid);
}

.cf-table tbody tr:nth-child(odd) .cf-total-col {
  background: var(--bg-elevated);
}

.cf-table tfoot .cf-total-col {
  background: #e8eeea;
  z-index: 5;
}

.cf-table th.num,
.cf-table td.num {
  width: var(--cf-num-col);
  min-width: var(--cf-num-col);
  max-width: var(--cf-num-col);
}

.cf-table th,
.cf-table td {
  padding: 0.28rem 0.45rem;
  border: 0;
  border-right: 1px solid var(--cf-grid, var(--line));
  border-bottom: 1px solid var(--cf-grid, var(--line));
  text-align: left;
  vertical-align: middle;
}

.cf-table tr > :first-child {
  border-left: 1px solid var(--cf-grid, var(--line));
}

.cf-table thead tr:first-child > * {
  border-top: 1px solid var(--cf-grid, var(--line));
}

.cf-tx-table th,
.cf-tx-table td {
  padding: 0.28rem 0.45rem;
  border: 1px solid var(--cf-grid, var(--line));
  text-align: left;
  vertical-align: middle;
}

.cf-table thead th {
  background: #e4ebe7;
  border-bottom: 2px solid #b8c7bf;
  position: sticky;
  top: 0;
  z-index: 3;
  color: #3d4f46;
  font-weight: 800;
  box-shadow: 0 2px 0 rgba(20, 32, 27, 0.06);
  vertical-align: bottom;
}

.cf-month-name {
  display: block;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
  font-style: normal;
}

.cf-month-bal {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.02rem;
  margin-top: 0.18rem;
  font-size: 0.62rem;
  font-weight: 500;
  font-style: italic;
  line-height: 1.15;
  color: #718178;
  letter-spacing: 0;
}

.cf-month-bal em {
  font-style: italic;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.cf-table tbody tr:nth-child(even) {
  background: var(--cf-row-alt);
}

.cf-table tbody tr:nth-child(even) .cf-sticky-col {
  background: var(--cf-row-alt-solid);
}

.cf-table tbody tr:nth-child(odd) .cf-sticky-col {
  background: var(--bg-elevated);
}

.cf-table tfoot th {
  background: #e8eeea;
  border-top: 2px solid #b8c7bf;
  border-bottom: 1px solid var(--cf-grid, var(--line));
  font-weight: 800;
  position: sticky;
  bottom: 0;
  z-index: 3;
  box-shadow: 0 -3px 10px -4px rgba(20, 32, 27, 0.2);
}

.cf-table th,
.cf-tx-table th {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.cf-table thead th {
  color: #2f3f37;
}

.cf-table tfoot th {
  color: #2f3f37;
}

.cf-tx-table th {
  color: var(--muted);
  position: sticky;
  top: 0;
  z-index: 1;
  background: #eef2ef;
}

.cf-tx-table th.cf-tx-sortable {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.cf-tx-table th.cf-tx-sortable:hover {
  color: var(--ink);
}

.cf-tx-table th.cf-tx-sortable::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.35em;
  vertical-align: middle;
  border-left: 0.28em solid transparent;
  border-right: 0.28em solid transparent;
  opacity: 0.35;
}

.cf-tx-table th.cf-tx-sortable[data-sort="amount"]::after {
  border-top: 0.35em solid currentColor;
}

.cf-tx-table th.cf-tx-sortable[data-sort="counterparty"]::after {
  border-bottom: 0.35em solid currentColor;
}

.cf-tx-table th.cf-tx-sortable.is-sorted {
  color: var(--ink);
}

.cf-tx-table th.cf-tx-sortable.is-sorted::after {
  opacity: 0.9;
}

.cf-table .num,
.cf-tx-table .num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding-right: 1rem;
}

.cf-table td.num .cf-amount-btn,
.cf-table td.num > .muted,
.cf-table tfoot th.num > span {
  display: inline-block;
  width: 100%;
  text-align: right;
}

.cf-article {
  font-weight: 650;
  min-width: 12rem;
  max-width: none;
  word-break: break-word;
}

.cf-article-inner {
  display: flex;
  align-items: flex-start;
  gap: 0.35rem;
  min-width: 0;
}

.cf-tree-toggle {
  flex-shrink: 0;
  width: 1.1rem;
  height: 1.1rem;
  margin-top: 0.02rem;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: 1;
  cursor: pointer;
}

.cf-tree-toggle:hover {
  background: rgba(255, 255, 255, 0.18);
}

.cf-tree-spacer {
  flex-shrink: 0;
  width: 1.1rem;
}

.cf-row-label {
  min-width: 0;
}

.cf-sum {
  display: inline-block;
  width: 100%;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
}

.cf-row-activity td {
  background: #0d6b56 !important;
  color: #f4faf7;
  font-size: 0.84rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

.cf-row-activity .cf-sticky-col,
.cf-row-activity .cf-struct-col,
.cf-row-activity .cf-total-col,
.cf-row-activity .cal-prev-col {
  background: #0d6b56 !important;
}

.cf-row-activity .cf-sum,
.cf-row-activity .cf-sum.is-pos {
  color: #e8fff4;
}

.cf-row-activity .cf-sum.is-neg {
  color: #ffd0d0;
}

.cf-row-activity .muted {
  color: rgba(244, 250, 247, 0.45);
}

.cf-row-attribute td {
  font-size: 0.78rem;
  font-weight: 800;
}

.cf-row-attribute.is-inflow td {
  background: #dcefe3 !important;
  color: #1b5c32;
}

.cf-row-attribute.is-inflow .cf-sticky-col,
.cf-row-attribute.is-inflow .cf-struct-col,
.cf-row-attribute.is-inflow .cf-total-col,
.cf-row-attribute.is-inflow .cal-prev-col {
  background: #dcefe3 !important;
}

.cf-row-attribute.is-outflow td {
  background: #f3dfe0 !important;
  color: #8a3030;
}

.cf-row-attribute.is-outflow .cf-sticky-col,
.cf-row-attribute.is-outflow .cf-struct-col,
.cf-row-attribute.is-outflow .cf-total-col,
.cf-row-attribute.is-outflow .cal-prev-col {
  background: #f3dfe0 !important;
}

.cf-row-attribute:not(.is-inflow):not(.is-outflow) td {
  background: #eee8dc !important;
  color: #5a4e38;
}

.cf-row-attribute:not(.is-inflow):not(.is-outflow) .cf-sticky-col,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) .cf-struct-col,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) .cf-total-col,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) .cal-prev-col {
  background: #eee8dc !important;
}

.cf-row-group td {
  background: #e4eee9 !important;
  color: #1f3d33;
  font-size: 0.76rem;
  font-weight: 750;
}

.cf-row-group .cf-sticky-col,
.cf-row-group .cf-struct-col,
.cf-row-group .cf-total-col,
.cf-row-group .cal-prev-col {
  background: #e4eee9 !important;
}

.cf-row-article .cf-row-label {
  font-weight: 550;
  color: #2a3832;
}

.cf-row-activity .cf-article { padding-left: 0.55rem; }
.cf-row-attribute .cf-article { padding-left: 1.15rem; }
.cf-row-group .cf-article { padding-left: 1.75rem; }
.cf-row-article .cf-article { padding-left: 2.45rem; }

.cf-amount-btn {
  border: none;
  background: transparent;
  color: var(--accent);
  font: inherit;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  padding: 0.05rem 0;
  border-radius: 5px;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: background 0.2s var(--ease), color 0.2s var(--ease);
}
.cf-amount-btn:hover {
  background: var(--accent-soft);
  text-decoration: none;
}
.cf-amount-btn.is-neg { color: var(--danger); }
.cf-amount-btn.is-pos { color: var(--ok); }

.cf-tx-wrap {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}

.cf-modal-dialog .cf-tx-wrap {
  overflow: auto;
}

.cf-tx-table {
  width: 100%;
  table-layout: fixed;
  font-size: 0.75rem;
}

.cf-modal-dialog .cf-tx-table {
  min-width: 0;
}

.cf-modal-dialog .cf-tx-table th,
.cf-modal-dialog .cf-tx-table td {
  padding: 0.22rem 0.4rem;
  vertical-align: middle;
}

.cf-tx-table .is-neg { color: var(--danger); font-weight: 700; }
.cf-tx-table .is-pos { color: var(--ok); font-weight: 700; }

.cf-tx-org td {
  padding: 0.55rem 0.65rem 0.25rem;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink);
  background: color-mix(in srgb, var(--accent-soft) 55%, var(--bg-elevated));
  border-top: 1px solid var(--line);
}

.cf-tx-section td {
  padding: 0.28rem 0.65rem 0.22rem 0.85rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  background: color-mix(in srgb, var(--bg-elevated) 94%, var(--line));
}

.cf-tx-section-in td { color: var(--ok); }
.cf-tx-section-out td { color: var(--danger); }

.cf-tx-subtotal td {
  padding-top: 0.15rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  background: color-mix(in srgb, var(--bg-elevated) 96%, var(--line));
}

.cf-tx-subtotal-label {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
  text-align: right;
}

.cf-tx-subtotal .num {
  font-weight: 800;
}

.cf-tx-table .cf-col-bank {
  max-width: 7.5rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cf-tx-table tbody tr.cf-tx-org:first-child td {
  border-top: none;
}

.cf-tx-table .cf-col-date {
  white-space: nowrap;
  width: 6.5%;
}
.cf-tx-table .num {
  width: 8%;
}
.cf-tx-table .cf-purpose {
  min-width: 0;
  max-width: none;
  width: 30%;
  word-break: break-word;
}
.cf-tx-table td:nth-child(4),
.cf-tx-table th:nth-child(4) {
  width: 14%;
}
.cf-tx-table td:nth-child(5),
.cf-tx-table th:nth-child(5) {
  width: 12%;
}
.cf-tx-table td:nth-child(6),
.cf-tx-table th:nth-child(6) {
  width: 18%;
}
.cf-tx-table td:nth-child(7),
.cf-tx-table th:nth-child(7) {
  width: 9%;
  max-width: 7.5rem;
}
.cf-tx-table td:nth-child(8),
.cf-tx-table th:nth-child(8) {
  width: 5.5%;
}

.cf-article-cell {
  overflow: visible;
}

.cf-combo {
  position: relative;
}

.cf-combo-input {
  width: 100%;
  min-width: 0;
  font: inherit;
  font-size: 0.75rem;
  padding: 0.2rem 0.35rem;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: #fff;
}

.cf-combo-input::placeholder {
  color: var(--muted);
  font-style: italic;
}

.cf-combo-list {
  overflow: auto;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-hover);
  padding: 0.2rem;
}

.cf-combo-option {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 0.78rem;
  padding: 0.35rem 0.5rem;
  border-radius: 7px;
  cursor: pointer;
  color: var(--ink);
}

.cf-combo-option:hover,
.cf-combo-option:focus,
.cf-combo-option.is-active {
  background: var(--accent-soft);
  outline: none;
}

.cf-combo-option.is-empty {
  color: var(--muted);
  font-style: italic;
}

.cf-combo-empty {
  padding: 0.45rem 0.55rem;
  color: var(--muted);
  font-size: 0.78rem;
}

@media (max-width: 920px) {
  .cf-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .modal {
    padding: 0.5rem;
    place-items: center;
  }

  .cf-modal-dialog,
  .cf-modal-dialog.modal-dialog-wide {
    width: min(100%, 96vw);
    height: auto;
    max-width: calc(100vw - 1rem);
    max-height: calc(100dvh - 1rem);
    margin: 0;
    border-radius: 14px;
  }

  .cf-tx-wrap {
    max-height: none;
    flex: 1 1 auto;
  }

  .cf-col-desktop {
    display: none !important;
  }

  .cf-modal-dialog .cf-tx-table {
    table-layout: auto;
    width: max-content;
    min-width: 100%;
  }

  .cf-tx-table .cf-purpose {
    min-width: 9rem;
    max-width: 16rem;
    width: auto;
  }

  .cf-combo-input {
    min-width: 8rem;
  }

  .cf-filters {
    padding: 0.55rem 0.65rem;
    width: 100%;
  }

  .cf-filter-grid {
    grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
    width: min(100%, 28rem);
  }

  .cf-filter-actions .btn {
    flex: 1 1 auto;
    justify-content: center;
  }

  .cf-table {
    font-size: 0.74rem;
    --cf-num-col: 6.85rem;
    --cf-article-col: 18rem;
  }

  .cf-table th,
  .cf-table td {
    padding: 0.24rem 0.35rem;
  }

  .cf-month-bal {
    font-size: 0.56rem;
  }

  .cf-table .num {
    padding-right: 0.35rem;
  }
}

@media (max-width: 760px) {
  .cf-summary {
    grid-template-columns: 1fr;
  }

  .main.cf-report-main {
    height: auto;
    min-height: calc(100dvh - var(--topbar-h));
    overflow: visible;
  }

  .cf-report-page {
    min-height: 0;
    height: auto;
    overflow: visible;
    flex: 1 1 auto;
  }

  .cf-table-wrap {
    flex: none;
    max-height: min(70vh, 36rem);
  }

  .cf-mode-row {
    flex-direction: column;
    gap: 0.35rem;
  }

  .cf-filter-grid {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .cf-filters .form-row.compact {
    flex-direction: column;
    align-items: stretch;
  }

  .cf-filters select,
  .cf-filters input[type="date"],
  .cf-filters input[type="search"],
  .cf-filters input[type="text"] {
    max-width: none;
    width: 100%;
  }

  .cf-tx-table {
    font-size: 0.78rem;
  }

  .cf-tx-table th,
  .cf-tx-table td {
    padding: 0.45rem 0.5rem;
  }

  .modal-head h2 {
    font-size: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* Plan/fact & payment calendar */
.pf-table,
.cal-table {
  table-layout: auto;
  width: max-content;
  min-width: max-content;
}

.pf-table {
  --cf-num-col: 7.35rem;
  --cf-pct-col: 4.35rem;
  --cf-struct-col: 4.2rem;
  --cf-article-col: 18rem;
  --pf-stick-span: calc(3 * var(--cf-num-col) + var(--cf-pct-col));
}

.pf-table th.num:not(.pf-pct):not(.pf-month-head),
.pf-table td.num:not(.pf-pct),
.pf-table tfoot th.num:not(.pf-pct) {
  width: var(--cf-num-col);
  min-width: var(--cf-num-col);
  max-width: var(--cf-num-col);
}

.pf-table th.pf-pct,
.pf-table td.pf-pct,
.pf-table tfoot th.pf-pct {
  width: var(--cf-pct-col);
  min-width: var(--cf-pct-col);
  max-width: var(--cf-pct-col);
}

.pf-table .pf-sticky-head {
  position: sticky;
  left: var(--cf-article-col);
  z-index: 6;
  min-width: var(--pf-stick-span);
  box-shadow: 6px 0 10px -8px rgba(20, 32, 27, 0.28);
  background: #dfe8e3;
}

.pf-table .pf-stick {
  position: sticky;
  z-index: 2;
  background: #dfe8e3;
}

.pf-table .pf-stick-0 { left: var(--cf-article-col); }
.pf-table .pf-stick-1 { left: calc(var(--cf-article-col) + var(--cf-num-col)); }
.pf-table .pf-stick-2 { left: calc(var(--cf-article-col) + 2 * var(--cf-num-col)); }
.pf-table .pf-stick-3 {
  left: calc(var(--cf-article-col) + 3 * var(--cf-num-col));
  box-shadow: 6px 0 10px -8px rgba(20, 32, 27, 0.28);
}

.pf-table thead .pf-stick {
  background: #dfe8e3;
  z-index: 6;
}

.pf-table thead tr:first-child .cf-sticky-col {
  z-index: 7;
}

.pf-table thead tr:nth-child(2) .pf-stick {
  z-index: 6;
}

.pf-table tbody tr:nth-child(even) .pf-stick {
  background: color-mix(in srgb, var(--cf-row-alt-solid) 70%, #dfe8e3);
}

.pf-table tbody tr:nth-child(odd) .pf-stick {
  background: color-mix(in srgb, var(--bg-elevated) 55%, #dfe8e3);
}

.pf-table tfoot .pf-stick {
  background: #e8eeea;
  z-index: 6;
}

.pf-table .cf-row-activity .pf-stick {
  background: #0d6b56 !important;
}

.pf-table .cf-row-attribute.is-inflow .pf-stick {
  background: #dcefe3 !important;
}

.pf-table .cf-row-attribute.is-outflow .pf-stick {
  background: #f3dfe0 !important;
}

.pf-table .cf-row-attribute:not(.is-inflow):not(.is-outflow) .pf-stick {
  background: #eee8dc !important;
}

.pf-table .cf-row-group .pf-stick {
  background: #e4eee9 !important;
}

.pf-table thead tr:first-child th {
  top: 0;
  z-index: 4;
}

.pf-table thead tr:nth-child(2) th {
  top: 1.85rem;
  z-index: 3;
  font-size: 0.68rem;
  font-weight: 700;
  padding-top: 0.18rem;
  padding-bottom: 0.18rem;
}

.pf-table thead tr:nth-child(2) .cf-sticky-col {
  z-index: 5;
}

.pf-table tfoot th {
  z-index: 4;
}

.pf-table tfoot .cf-sticky-col {
  z-index: 6;
}

.pf-table .pf-sub {
  color: #5a6a62;
}

.pf-table .pf-month-head {
  text-align: left !important;
  letter-spacing: -0.01em;
  padding-left: 0.45rem;
  border-left: 2px solid color-mix(in srgb, var(--line) 85%, #2f4a3c);
  border-right: 2px solid color-mix(in srgb, var(--line) 85%, #2f4a3c);
}

.pf-table th.num.pf-month-head {
  text-align: left !important;
}

.pf-table .pf-struct-head {
  font-size: 0.72rem;
  line-height: 1.2;
  vertical-align: bottom;
  white-space: normal;
  min-width: var(--cf-struct-col);
  max-width: 5rem;
  text-align: center;
}

.pf-table .pf-block-total,
.pf-table th.pf-block-total,
.pf-table td.pf-block-total,
.pf-table tfoot th.pf-block-total {
  background: color-mix(in srgb, #dfe8e3 70%, transparent);
}

.pf-table .pf-block-0,
.pf-table th.pf-block-0,
.pf-table td.pf-block-0,
.pf-table tfoot th.pf-block-0 {
  background: color-mix(in srgb, #e8eef8 55%, transparent);
}

.pf-table .pf-block-1,
.pf-table th.pf-block-1,
.pf-table td.pf-block-1,
.pf-table tfoot th.pf-block-1 {
  background: color-mix(in srgb, #f3eee6 60%, transparent);
}

.pf-table th.pf-block-end,
.pf-table td.pf-block-end,
.pf-table tfoot th.pf-block-end {
  border-right: 2px solid color-mix(in srgb, var(--line) 85%, #2f4a3c);
}

.pf-table th.pf-block-start,
.pf-table td.pf-block-start,
.pf-table tfoot th.pf-block-start {
  border-left: 2px solid color-mix(in srgb, var(--line) 85%, #2f4a3c);
}

.pf-table th.pf-block-total:not(.pf-block-end),
.pf-table td.pf-block-total:first-of-type,
.pf-table th.pf-sub.pf-block-total:first-of-type {
  border-left: 2px solid color-mix(in srgb, var(--line) 85%, #2f4a3c);
}

.pf-table th.num,
.pf-table td.num,
.pf-table tfoot th.num {
  box-sizing: border-box;
  overflow: hidden;
  text-align: right;
  padding-left: 0.25rem;
  padding-right: 0.35rem;
}

.pf-table td.pf-struct,
.pf-table th.pf-struct,
.pf-table tfoot th.pf-struct {
  min-width: var(--cf-struct-col);
  max-width: 5rem;
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: #5a6a62;
  background: color-mix(in srgb, var(--bg-elevated) 88%, #d7e0da);
}

.pf-table td.num .cf-amount-btn,
.pf-table td.num .cf-sum,
.pf-table td.num > .muted,
.pf-table tfoot th.num > span {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.pf-table th.pf-pct,
.pf-table td.pf-pct,
.pf-table tfoot th.pf-pct {
  width: var(--cf-pct-col);
  min-width: var(--cf-pct-col);
  max-width: var(--cf-pct-col);
  text-align: center;
}

.pf-table td.pf-pct .cf-sum,
.pf-table td.pf-pct > .muted,
.pf-table tfoot th.pf-pct,
.pf-table tfoot th.pf-pct > span {
  text-align: center;
}

.pf-aux {
  font-size: 0.68rem;
  font-style: italic;
  font-weight: 550 !important;
  color: #718178;
}

.cal-table .cal-prev-col {
  --cf-prev-col: 5.5rem;
  position: sticky;
  left: var(--cf-article-col);
  z-index: 2;
  box-sizing: border-box;
  min-width: var(--cf-prev-col);
  width: var(--cf-prev-col);
  max-width: var(--cf-prev-col);
  background: color-mix(in srgb, #e4ebe7 72%, #fff);
  border-right: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}

.cal-table th.cal-prev-col .cf-month-name {
  white-space: normal;
  line-height: 1.15;
  font-size: 0.68rem;
}

.cf-table.cal-table {
  --cf-num-col: 6.75rem;
  --cf-article-col: 16rem;
  --cf-prev-col: 5.5rem;
  table-layout: auto;
}

/* Итого справа от «Статья» + «Факт пред. месяца» */
.cf-table.cal-table .cf-total-col {
  left: calc(var(--cf-article-col) + var(--cf-prev-col));
}

.cf-table.cal-table thead .cf-sticky-col {
  z-index: 6;
}

.cf-table.cal-table thead .cal-prev-col {
  background: #e4ebe7;
  z-index: 6;
}

.cf-table.cal-table thead .cf-total-col {
  z-index: 7;
}

.cf-table.cal-table tbody tr:nth-child(even) .cal-prev-col {
  background: color-mix(in srgb, var(--cf-row-alt-solid) 85%, #e4ebe7);
}

.cf-table.cal-table tbody tr:nth-child(odd) .cal-prev-col {
  background: color-mix(in srgb, var(--bg-elevated) 88%, #e4ebe7);
}

.cf-table.cal-table tfoot .cal-prev-col {
  background: #e8eeea;
  z-index: 6;
}

.cf-table.cal-table tfoot .cf-sticky-col,
.cf-table.cal-table tfoot .cf-total-col {
  z-index: 6;
}

.cf-table.cal-table tfoot .cf-total-col {
  z-index: 7;
}

.main.cf-report-main.cal-flush-left {
  padding-left: 0;
}

.main.cf-report-main.cal-flush-left .page-head,
.main.cf-report-main.cal-flush-left .alert,
.main.cf-report-main.cal-flush-left .cf-chrome,
.main.cf-report-main.cal-flush-left .cf-toolbar.cal-toolbar,
.main.cf-report-main.cal-flush-left .empty-state {
  padding-left: clamp(0.75rem, 2.5vw, 2rem);
}

.cal-toolbar {
  flex-direction: row;
  align-items: center;
  gap: 0.45rem 0.75rem;
  margin-bottom: 0.45rem;
}

.cal-toolbar .muted {
  flex: 1 1 12rem;
  min-width: 0;
}

.cal-toolbar .cf-tree-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: auto;
}

.cal-toolbar .cf-toolbar-right {
  margin-left: auto;
  width: auto;
  justify-content: flex-end;
}

@media (max-width: 760px) {
  .main.cf-report-main.cal-flush-left .cf-summary {
    grid-template-columns: 1fr;
    margin-bottom: 0.45rem;
  }
}

.cf-table-wrap.cal-edge {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: none;
}

.cf-table.cal-table th.num,
.cf-table.cal-table td.num,
.cf-table.cal-table tfoot th.num {
  box-sizing: border-box;
  overflow: hidden;
  padding: 0.22rem 0.28rem;
  padding-right: 0.28rem;
  text-align: right;
}

.cf-table.cal-table .cf-month-name {
  display: block;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-align: right;
}

.cf-table.cal-table .cf-month-bal {
  max-width: 100%;
  overflow: hidden;
  font-size: 0.52rem;
  letter-spacing: -0.03em;
  gap: 0;
  align-items: flex-end;
}

.cf-table.cal-table .cf-month-bal em {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
}

.cf-table.cal-table .cf-month-bal em.is-neg {
  color: var(--danger);
  font-weight: 800;
}

.cf-table.cal-table .cf-month-bal em.is-plan-neg {
  background: color-mix(in srgb, var(--danger) 14%, transparent);
  border-radius: 3px;
  padding: 0 0.1rem;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 35%, transparent);
}

.cf-table.cal-table th.cal-day.is-plan:has(.is-plan-neg) {
  background: color-mix(in srgb, var(--danger) 8%, transparent);
}

.cf-table.cal-table td.num .cf-amount-btn,
.cf-table.cal-table td.num .cf-sum,
.cf-table.cal-table td.num > .muted,
.cf-table.cal-table tfoot th.num > span {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.7rem;
  letter-spacing: -0.025em;
  padding-left: 0;
  padding-right: 0;
  text-align: right;
}

.cal-table.cal-hide-fact col.is-fact-col {
  visibility: collapse;
  width: 0;
  min-width: 0;
  max-width: 0;
}

.cal-table .cal-day.is-plan {
  background: #eef4fb;
}

.cal-table .cal-day.is-fact {
  background: #e4ebe7;
}

.cal-table .cal-day.is-today {
  box-shadow: inset 0 -2px 0 #2f6fed;
}

.cal-table td.is-plan-cell {
  background: color-mix(in srgb, #eef4fb 55%, transparent);
}

.cal-table .cal-weekday {
  font-size: 0.72em;
  font-weight: 650;
  letter-spacing: 0.02em;
  text-transform: lowercase;
  color: color-mix(in srgb, var(--muted) 80%, var(--ink));
  opacity: 0.9;
}

.cal-table th.cal-day.is-weekend .cal-weekday {
  color: color-mix(in srgb, var(--muted) 55%, #7a6f64);
}

.cal-table th.cal-day.is-weekend,
.cal-table td.is-weekend-col,
.cal-table tfoot th.is-weekend-col {
  background: #f1eee8;
}

.cal-table th.cal-day.is-plan.is-weekend {
  background: #eceae5;
}

.cal-table th.cal-day.is-fact.is-weekend {
  background: #ebe9e4;
}

.cal-table td.is-plan-cell.is-weekend-col {
  background: color-mix(in srgb, #eceae5 72%, transparent);
}

/* Beat input[type=text] specificity so large login-form padding doesn't clip values */
input[type="text"].cf-plan-amount,
input[type="date"].cf-plan-date {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.2rem 0.3rem;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  box-shadow: none;
}

input[type="date"].cf-plan-date {
  max-width: 9.5rem;
}

input[type="text"].cf-plan-amount {
  max-width: 7.5rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.cf-modal-dialog .cf-tx-table .num {
  width: 10%;
  min-width: 5.5rem;
}

/* —— Day plan report —— */
.main.day-plan-main {
  max-width: none;
  width: 100%;
  padding-top: 0.85rem;
  padding-bottom: 2rem;
}

.day-plan-page {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-inline: clamp(0.35rem, 1.5vw, 1rem);
}

.day-plan-bar {
  position: sticky;
  top: var(--topbar-h);
  z-index: 12;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  padding: 0.65rem 0.85rem;
  background: color-mix(in srgb, var(--bg-elevated) 92%, #e8f0ec);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
}

.day-plan-back {
  flex-shrink: 0;
}

.day-plan-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
}

.day-plan-refresh {
  flex-shrink: 0;
  font-size: 0.78rem;
  white-space: nowrap;
}

.day-plan-nav {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  flex: 1;
  min-width: 0;
  justify-content: center;
}

.day-plan-heading {
  text-align: center;
  min-width: 0;
}

.day-plan-heading h1 {
  margin: 0;
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.day-plan-meta {
  margin: 0.25rem 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem 0.75rem;
  font-size: 0.8rem;
  color: var(--muted);
  font-weight: 600;
}

.day-plan-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem 0.45rem;
  border-radius: 6px;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.day-plan-badge.is-plan {
  background: #e8f0fb;
  color: #2f5fad;
}

.day-plan-badge.is-fact {
  background: #e4ebe7;
  color: #3d5a4c;
}

.day-plan-flow {
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  color: var(--ink);
}

.day-plan-flow.is-pos { color: var(--ok); }
.day-plan-flow.is-neg { color: var(--danger); }

.day-plan-board {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.85rem;
  overflow-x: visible;
  padding-bottom: 0.15rem;
  align-items: stretch;
  width: 100%;
}

.day-plan-org {
  flex: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  background: #fff;
  border: 1px solid #d5ddd8;
  border-radius: 14px;
  box-shadow: 0 1px 0 rgba(20, 32, 27, 0.04);
  display: flex;
  flex-direction: column;
  min-height: 12rem;
}

.day-plan-org-head {
  padding: 0.85rem 0.95rem 0.75rem;
  border-bottom: 1px solid #e4ebe7;
  background: linear-gradient(180deg, #f7faf8 0%, #fff 100%);
  border-radius: 14px 14px 0 0;
}

.day-plan-org-head h2 {
  margin: 0 0 0.55rem;
  font-size: 0.98rem;
  font-weight: 800;
  letter-spacing: -0.015em;
  line-height: 1.3;
  color: var(--ink);
}

.day-plan-balances,
.day-plan-org-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.45rem 0.35rem;
}

.day-plan-org-stats {
  grid-template-columns: 1fr;
}

@media (min-width: 420px) {
  .day-plan-org-stats {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 720px) {
  .day-plan-org-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/*
  5 организаций в ряд только когда ширины реально хватает (~≥1940).
  На 1800–1936 колонки ещё слишком узкие: шапка с остатками ломается.
*/
@media (min-width: 1940px) {
  .day-plan-board {
    flex-direction: row;
    gap: clamp(0.55rem, 1.2vw, 0.85rem);
    overflow-x: visible;
    padding-bottom: 0.35rem;
  }

  .day-plan-org {
    flex: 1 1 0;
    width: auto;
    max-width: none;
    min-width: 0;
  }

  .day-plan-org-head {
    padding: 0.7rem 0.65rem 0.6rem;
  }

  .day-plan-org-head h2 {
    font-size: 0.88rem;
    margin-bottom: 0.45rem;
  }

  /* 2×2: длинные подписи («Запланированные поступления») не рвут строку */
  .day-plan-org-stats {
    grid-template-columns: 1fr 1fr;
    gap: 0.4rem 0.4rem;
  }

  .day-plan-bal-label {
    font-size: 0.55rem;
    letter-spacing: 0.02em;
  }

  .day-plan-bal-val {
    font-size: 0.78rem;
  }
}

@media (min-width: 2200px) {
  .day-plan-org-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .day-plan-org-head {
    padding: 0.85rem 0.95rem 0.75rem;
  }

  .day-plan-org-head h2 {
    font-size: 0.98rem;
  }

  .day-plan-bal-label {
    font-size: 0.62rem;
  }

  .day-plan-bal-val {
    font-size: clamp(0.78rem, 1.1vw, 0.92rem);
  }
}

.day-plan-bal {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.day-plan-bal-label {
  font-size: 0.62rem;
  font-weight: 650;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1.25;
  hyphens: auto;
}

.day-plan-bal-val {
  font-size: clamp(0.78rem, 1.6vw, 0.92rem);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #5a6a62;
  letter-spacing: -0.01em;
  word-break: break-word;
}

.day-plan-bal.is-closing .day-plan-bal-val {
  font-weight: 800;
  color: var(--ink);
}

.day-plan-bal-val.is-pos { color: var(--ok); }
.day-plan-bal-val.is-neg { color: var(--danger); }

.day-plan-org-body {
  padding: 0.55rem 0.75rem 0.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
  min-width: 0;
}

.day-plan-org-empty {
  margin: 0.35rem 0 0.5rem;
  font-size: 0.82rem;
  text-align: center;
  padding: 0.75rem 0.35rem;
}

.day-plan-payments-wrap {
  min-width: 0;
}

.day-plan-payments-head {
  display: none;
}

.day-plan-article-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}

.day-plan-article-name {
  font-size: 0.82rem;
  font-weight: 750;
  color: var(--ink);
  line-height: 1.3;
  min-width: 0;
}

.day-plan-article-total {
  flex-shrink: 0;
  font-size: 0.84rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.day-plan-article-total.is-pos,
.day-plan-pay-sum.is-pos,
.day-plan-org-foot .is-pos { color: var(--ok); }

.day-plan-article-total.is-neg,
.day-plan-pay-sum.is-neg,
.day-plan-org-foot .is-neg { color: var(--danger); }

.day-plan-payments {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.day-plan-pay {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.4rem 0.5rem;
  border-radius: 8px;
  background: #f4f7f5;
  border: 1px solid #e6ece8;
}

.day-plan-pay-sum {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-size: 0.86rem;
  flex-shrink: 0;
}

.day-plan-pay-cp {
  font-size: 0.78rem;
  font-weight: 650;
  color: #3d4f46;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.day-plan-pay-purpose,
.day-plan-pay-note {
  margin: 0;
  font-size: 0.72rem;
  line-height: 1.35;
  color: #5a6a62;
  word-break: break-word;
}

.day-plan-pay-note {
  color: #8a9690;
  font-style: italic;
}

@media (max-width: 1099px) {
  .day-plan-pay {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.15rem 0.45rem;
    align-items: baseline;
  }

  .day-plan-pay-sum {
    grid-column: 1;
  }

  .day-plan-pay-cp {
    grid-column: 2;
    text-align: right;
  }

  .day-plan-pay-purpose,
  .day-plan-pay-note {
    grid-column: 1 / -1;
  }

  .day-plan-pay-purpose {
    margin-top: 0.1rem;
  }
}

@media (min-width: 1100px) {
  .day-plan-payments-head {
    display: grid;
    grid-template-columns: 5.5rem minmax(4.5rem, 1fr) minmax(7rem, 2.2fr);
    gap: 0.45rem 0.55rem;
    padding: 0 0.5rem 0.25rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
  }

  .day-plan-pay {
    display: grid;
    grid-template-columns: 5.5rem minmax(4.5rem, 1fr) minmax(7rem, 2.2fr);
    gap: 0.35rem 0.55rem;
    align-items: start;
  }

  .day-plan-pay-sum {
    grid-column: 1;
  }

  .day-plan-pay-cp {
    font-size: 0.8rem;
    color: var(--ink);
    white-space: normal;
    grid-column: 2;
  }

  .day-plan-pay-purpose {
    font-size: 0.84rem;
    line-height: 1.4;
    color: var(--ink);
    grid-column: 3;
  }

  .day-plan-pay-note {
    grid-column: 1 / -1;
    font-size: 0.72rem;
    padding-top: 0.15rem;
    border-top: 1px dashed #e4ebe7;
    margin-top: 0.1rem;
  }
}

/* Столбик организаций: шире колонка назначения, чуть крупнее текст */
@media (min-width: 1100px) and (max-width: 1939.98px) {
  .day-plan-org-head {
    padding: 0.95rem 1.1rem 0.85rem;
  }

  .day-plan-org-body {
    padding: 0.65rem 1rem 0.45rem;
  }

  .day-plan-payments-head,
  .day-plan-pay {
    grid-template-columns: 6.75rem minmax(9rem, 0.85fr) minmax(14rem, 2.6fr);
    gap: 0.4rem 0.75rem;
  }

  .day-plan-pay-sum {
    font-size: 0.9rem;
  }

  .day-plan-pay-cp {
    font-size: 0.84rem;
  }

  .day-plan-pay-purpose {
    font-size: 0.9rem;
    line-height: 1.45;
  }

  .day-plan-article-name {
    font-size: 0.88rem;
  }
}

.day-plan-org-foot {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.95rem;
  border-top: 1px solid #e4ebe7;
  font-size: 0.78rem;
  font-weight: 650;
  color: var(--muted);
  background: #f7faf8;
  border-radius: 0 0 14px 14px;
}

.day-plan-org-foot strong {
  font-size: 0.9rem;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}

.day-plan-empty {
  text-align: center;
  padding: 2.5rem 1rem;
}

.cal-day-link {
  color: inherit;
  text-decoration: none;
  display: block;
  border-radius: 4px;
  margin: -0.1rem -0.15rem;
  padding: 0.1rem 0.15rem;
  transition: background 0.15s var(--ease), color 0.15s var(--ease);
}

.cal-day-link:hover {
  background: color-mix(in srgb, #2f6fed 14%, transparent);
  color: #1d4fbf;
  text-decoration: none;
}

.cal-table .cal-day .cal-day-link .cf-month-name {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
}

@media (max-width: 760px) {
  .day-plan-bar {
    top: 0;
    position: static;
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
  }

  .day-plan-nav {
    width: 100%;
  }

  .day-plan-actions {
    width: 100%;
  }
}

@media (min-width: 761px) {
  .day-plan-bar {
    flex-wrap: nowrap;
  }

  .day-plan-actions {
    display: contents;
  }

  .day-plan-back {
    order: 1;
  }

  .day-plan-nav {
    order: 2;
    flex: 1;
  }

  .day-plan-refresh {
    order: 3;
  }
}

@media print {
  .topbar,
  .day-plan-back,
  .day-plan-refresh,
  .day-plan-nav > .btn {
    display: none !important;
  }

  .main.day-plan-main {
    padding: 0;
  }

  .day-plan-bar {
    position: static;
    box-shadow: none;
    border: 0;
    background: transparent;
    padding: 0 0 0.75rem;
  }

  .day-plan-board {
    display: block;
    overflow: visible;
  }

  .day-plan-org {
    width: 100%;
    max-width: none;
    break-inside: avoid;
    margin-bottom: 0.85rem;
    box-shadow: none;
  }
}

/* Desktop reports: full summary on wide, collapsed strip + table-first on ≤1936 */
.cf-desk-summary {
  flex-shrink: 0;
  width: 100%;
  margin: 0;
}

.cf-desk-summary-bar {
  display: none;
}

.cf-desk-summary-body {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

@media (min-width: 1940px) {
  .main.cf-report-main .page-head-row {
    align-items: flex-start;
  }

  details.cf-desk-summary:not([open]) > .cf-desk-summary-body {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
  }
}

@media (max-width: 1939.98px) {
  .main.cf-report-main:not(.cf-mobile-report) {
    height: calc(100dvh - var(--topbar-h));
    min-height: calc(100dvh - var(--topbar-h));
    overflow: hidden;
  }

  .main.cf-report-main:not(.cf-mobile-report) .cf-report-page {
    gap: 0.4rem;
  }

  .main.cf-report-main:not(.cf-mobile-report) .page-head {
    align-items: center;
    gap: 0.35rem 0.65rem;
  }

  .main.cf-report-main:not(.cf-mobile-report) .page-head .lede {
    display: none;
  }

  .main.cf-report-main:not(.cf-mobile-report) .page-head h1 {
    font-size: 1.12rem;
    white-space: nowrap;
  }

  .main.cf-report-main:not(.cf-mobile-report) .cf-head-actions .btn {
    padding: 0.22rem 0.45rem;
    font-size: 0.72rem;
  }

  .cf-desk-summary {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-elevated) 88%, var(--accent-soft));
  }

  .cf-desk-summary-bar {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.35rem 0.65rem;
    cursor: pointer;
    list-style: none;
  }

  .cf-desk-summary-bar::-webkit-details-marker {
    display: none;
  }

  .cf-desk-summary-bar::before {
    content: "▸";
    margin-right: 0.35rem;
    color: var(--muted);
    font-size: 0.7rem;
  }

  .cf-desk-summary[open] .cf-desk-summary-bar::before {
    content: "▾";
  }

  .cf-desk-summary-title {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--muted);
  }

  .cf-desk-summary-total {
    font-size: 0.86rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
  }

  .cf-desk-summary-total.is-neg { color: var(--danger); }
  .cf-desk-summary-total.is-pos { color: var(--ok); }

  .cf-desk-summary:not([open]) > .cf-desk-summary-body {
    display: none;
  }

  .cf-desk-summary[open] > .cf-desk-summary-body {
    padding: 0 0.55rem 0.55rem;
    border-top: 1px solid color-mix(in srgb, var(--line) 75%, transparent);
  }

  .main.cf-report-main:not(.cf-mobile-report) .cf-table-wrap {
    flex: 1 1 0%;
    min-height: 0;
    max-height: none;
    overflow: auto;
  }

  .main.cf-report-main:not(.cf-mobile-report) .pf-table .pf-stick,
  .main.cf-report-main:not(.cf-mobile-report) .pf-table .pf-sticky-head,
  .main.cf-report-main:not(.cf-mobile-report) .cf-dds-table .cf-struct-col,
  .main.cf-report-main:not(.cf-mobile-report) .cf-dds-table .cf-total-col {
    position: static;
    left: auto;
    box-shadow: none;
  }
}

/* Phone UA: compact DDS / plan-fact (see pages._is_mobile_request) */
.main.cf-report-main.cf-mobile-report {
  height: calc(100dvh - var(--topbar-h));
  min-height: calc(100dvh - var(--topbar-h));
  overflow: hidden;
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.cf-mobile-report .cf-report-page {
  gap: 0.3rem;
  height: 100%;
  overflow: hidden;
}

.cf-mobile-report .page-head {
  gap: 0;
  margin: 0;
}

.cf-mobile-report .page-head .lede {
  display: none;
}

.cf-mobile-report .cf-mobile-toolbar {
  display: none;
}

.cf-mobile-report .page-head-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem;
}

.cf-mobile-report .page-head-title-row h1 {
  margin: 0;
  min-width: 0;
  font-size: 1.05rem;
  line-height: 1.2;
}

.cf-mobile-report .page-head-title-row .btn {
  flex-shrink: 0;
  width: auto;
  min-width: 2.1rem;
  padding: 0.22rem 0.4rem;
  font-size: 0.95rem;
  white-space: nowrap;
}

.cf-mobile-report .cf-chrome {
  gap: 0;
}

.cf-mobile-report .cf-table-wrap {
  flex: 1 1 0%;
  min-height: 0;
  max-height: none;
  overflow: auto;
  overflow-x: hidden;
}

.cf-mobile-report .cf-table {
  width: 100%;
  table-layout: fixed;
  font-size: 0.72rem;
}

.cf-mobile-report .cf-dds-table {
  --cf-article-col: 0;
  --cf-struct-col: 0;
  --cf-month-struct-col: 0;
  --cf-num-col: 5.85rem;
  width: 100%;
}

.cf-mobile-report .cf-table th,
.cf-mobile-report .cf-table td {
  padding: 0.28rem 0.3rem;
  word-break: break-word;
}

.cf-mobile-report .cf-sticky-col {
  position: static;
  left: auto;
  z-index: auto;
}

.cf-mobile-report .cf-dds-table col.cf-mcol-num {
  width: var(--cf-num-col);
}

.cf-mobile-report .cf-dds-table .cf-sticky-col {
  width: auto;
  min-width: 0;
  max-width: none;
}

.cf-mobile-report .cf-dds-table th.num,
.cf-mobile-report .cf-dds-table td.num {
  width: var(--cf-num-col);
  min-width: var(--cf-num-col);
  max-width: var(--cf-num-col);
  padding-left: 0.12rem;
  padding-right: 0.2rem;
}

.cf-mobile-report .cf-article-inner {
  display: flex;
  align-items: flex-start;
  gap: 0.15rem;
}

.cf-mobile-report .cf-row-label {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1 1 auto;
  min-width: 0;
}

.cf-mobile-report .cf-amount-btn {
  font-size: inherit;
  padding: 0;
}

.cf-mobile-report .cf-morning-mobile {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--bg-elevated) 88%, var(--accent-soft));
}

.cf-mobile-report .cf-morning-summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.28rem 0.5rem;
  cursor: pointer;
  list-style: none;
}

.cf-mobile-report .cf-morning-summary::-webkit-details-marker {
  display: none;
}

.cf-mobile-report .cf-morning-summary::before {
  content: "▸";
  margin-right: 0.3rem;
  color: var(--muted);
  font-size: 0.65rem;
}

.cf-mobile-report .cf-morning-mobile[open] .cf-morning-summary::before {
  content: "▾";
}

.cf-mobile-report .cf-morning-mobile .cf-morning-title {
  font-size: 0.64rem;
}

.cf-mobile-report .cf-morning-mobile .cf-morning-total {
  font-size: 0.78rem;
}

.cf-mobile-report .cf-morning-cols-stack {
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.65rem;
  padding: 0 0.55rem 0.55rem;
  border-top: 1px solid color-mix(in srgb, var(--line) 75%, transparent);
}

.cf-mobile-report .cf-morning-cols-stack .cf-morning-col {
  flex: none;
  width: 100%;
  min-width: 0;
}

.cf-mobile-report .cf-modal-dialog-mobile {
  width: 100%;
  max-width: 100%;
  max-height: calc(100dvh - 0.75rem);
  margin: 0;
  border-radius: 12px;
}

.cf-mobile-report .cf-modal-body {
  padding: 0.5rem 0.55rem 0.65rem;
  min-height: 0;
}

.cf-mobile-report .cf-tx-wrap {
  overflow: auto;
  max-height: calc(100dvh - 7.5rem);
  border: none;
  background: transparent;
}

.cf-mobile-report .cf-tx-cards {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.cf-mobile-report .cf-tx-cards-empty {
  margin: 0.5rem 0;
  font-size: 0.82rem;
}

.cf-mobile-report .cf-tx-card-group + .cf-tx-card-group {
  margin-top: 0.15rem;
  padding-top: 0.55rem;
  border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
}

.cf-mobile-report .cf-tx-card-org-title {
  margin: 0 0 0.35rem;
  font-size: 0.8rem;
  font-weight: 750;
  color: var(--ink);
}

.cf-mobile-report .cf-tx-card-section {
  margin: 0 0 0.25rem;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
}

.cf-mobile-report .cf-tx-card-section-in { color: var(--ok); }
.cf-mobile-report .cf-tx-card-section-out { color: var(--danger); }

.cf-mobile-report .cf-tx-cards-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.cf-mobile-report .cf-tx-card {
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
  background: #f4f7f5;
  border: 1px solid #e6ece8;
}

.cf-mobile-report .cf-tx-card-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}

.cf-mobile-report .cf-tx-card-date {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--muted);
  flex-shrink: 0;
}

.cf-mobile-report .cf-tx-card-sum {
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-size: 0.86rem;
  text-align: right;
  flex-shrink: 0;
}

.cf-mobile-report .cf-tx-card-sum.is-neg { color: var(--danger); }
.cf-mobile-report .cf-tx-card-sum.is-pos { color: var(--ok); }

.cf-mobile-report .cf-tx-card-cp {
  font-size: 0.78rem;
  font-weight: 650;
  color: #3d4f46;
  word-break: break-word;
}

.cf-mobile-report .cf-tx-card-purpose {
  font-size: 0.72rem;
  line-height: 1.35;
  color: #5a6a62;
  word-break: break-word;
}

.cf-mobile-report .cf-tx-card-org {
  font-size: 0.68rem;
  color: var(--muted);
}

.cf-mobile-report .cf-tx-card-subtotal {
  margin-top: 0.2rem;
  padding: 0 0.1rem;
  font-size: 0.72rem;
  font-weight: 700;
  text-align: right;
  color: var(--ink);
}

.cf-mobile-report .cf-tx-card-subtotal.is-neg { color: var(--danger); }
.cf-mobile-report .cf-tx-card-subtotal.is-pos { color: var(--ok); }

.cf-mobile-report .pf-table {
  --cf-article-col: 0;
  --cf-num-col: 5.4rem;
  --cf-pct-col: 0;
  width: 100%;
  font-size: 0.72rem;
}

.cf-mobile-report .pf-table .cf-sticky-col {
  width: auto;
  min-width: 0;
  max-width: none;
}

.cf-mobile-report .pf-table .cf-article {
  font-size: 0.72rem;
}

.cf-mobile-report .pf-table col.cf-mcol-num {
  width: var(--cf-num-col);
}

.cf-mobile-report .pf-table th.num,
.cf-mobile-report .pf-table td.num,
.cf-mobile-report .pf-table tfoot th.num {
  width: var(--cf-num-col);
  min-width: var(--cf-num-col);
  max-width: var(--cf-num-col);
  padding-left: 0.08rem;
  padding-right: 0.1rem;
  white-space: nowrap;
  position: static;
  left: auto;
  font-size: 0.56rem;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.cf-mobile-report .pf-table .num {
  padding-right: 0.1rem;
}

.cf-mobile-report .pf-table td.num .cf-amount-btn,
.cf-mobile-report .pf-table td.num .cf-sum,
.cf-mobile-report .pf-table td.num > .muted,
.cf-mobile-report .pf-table tfoot th.num > span {
  font-size: inherit;
  font-weight: 700;
  letter-spacing: inherit;
}

.cf-mobile-report .pf-table .pf-stick {
  position: static;
  left: auto;
  box-shadow: none;
}

/* Soft traffic-light signals (plan/fact % and DDS month structure). */
.cf-table td.cf-sig-green,
.cf-table td.cf-sig-green.pf-stick,
.cf-table td.cf-sig-green.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(even) td.cf-sig-green.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(odd) td.cf-sig-green.cf-month-struct-col,
.cf-row-attribute.is-inflow td.cf-sig-green,
.cf-row-attribute.is-outflow td.cf-sig-green,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) td.cf-sig-green,
.cf-row-group td.cf-sig-green,
.pf-table .cf-row-attribute.is-inflow td.cf-sig-green.pf-stick,
.pf-table .cf-row-attribute.is-outflow td.cf-sig-green.pf-stick,
.pf-table .cf-row-group td.cf-sig-green.pf-stick,
.pf-table tbody tr:nth-child(even) td.cf-sig-green.pf-stick,
.pf-table tbody tr:nth-child(odd) td.cf-sig-green.pf-stick {
  background: #e7f1ea !important;
}

.cf-table td.cf-sig-yellow,
.cf-table td.cf-sig-yellow.pf-stick,
.cf-table td.cf-sig-yellow.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(even) td.cf-sig-yellow.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(odd) td.cf-sig-yellow.cf-month-struct-col,
.cf-row-attribute.is-inflow td.cf-sig-yellow,
.cf-row-attribute.is-outflow td.cf-sig-yellow,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) td.cf-sig-yellow,
.cf-row-group td.cf-sig-yellow,
.pf-table .cf-row-attribute.is-inflow td.cf-sig-yellow.pf-stick,
.pf-table .cf-row-attribute.is-outflow td.cf-sig-yellow.pf-stick,
.pf-table .cf-row-group td.cf-sig-yellow.pf-stick,
.pf-table tbody tr:nth-child(even) td.cf-sig-yellow.pf-stick,
.pf-table tbody tr:nth-child(odd) td.cf-sig-yellow.pf-stick {
  background: #f3edd8 !important;
}

.cf-table td.cf-sig-red,
.cf-table td.cf-sig-red.pf-stick,
.cf-table td.cf-sig-red.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(even) td.cf-sig-red.cf-month-struct-col,
.cf-dds-table tbody tr:nth-child(odd) td.cf-sig-red.cf-month-struct-col,
.cf-row-attribute.is-inflow td.cf-sig-red,
.cf-row-attribute.is-outflow td.cf-sig-red,
.cf-row-attribute:not(.is-inflow):not(.is-outflow) td.cf-sig-red,
.cf-row-group td.cf-sig-red,
.pf-table .cf-row-attribute.is-inflow td.cf-sig-red.pf-stick,
.pf-table .cf-row-attribute.is-outflow td.cf-sig-red.pf-stick,
.pf-table .cf-row-group td.cf-sig-red.pf-stick,
.pf-table tbody tr:nth-child(even) td.cf-sig-red.pf-stick,
.pf-table tbody tr:nth-child(odd) td.cf-sig-red.pf-stick {
  background: #f4e6e6 !important;
}