:root{
  --cm-bg:#eef7de;
  --cm-bg-soft:#f7fbef;
  --cm-panel:#ffffff;
  --cm-panel-muted:#fbfdf7;
  --cm-border:#d6e6b9;
  --cm-border-strong:#c4dc92;
  --cm-text:#4d4d43;
  --cm-text-soft:#7f7c6d;
  --cm-title:#5f5b4f;
  --cm-brand:#cbe65a;
  --cm-brand-strong:#b8d94a;
  --cm-brand-soft:#eef9bd;
  --cm-danger:#f6d5df;
  --cm-danger-border:#efb8c9;
  --cm-sidebar-w:224px;
  --cm-header-h:72px;
  --cm-main-gutter:16px;
  --cm-radius:16px;
  --cm-shadow:0 10px 30px rgba(155, 181, 96, 0.12);
  --cm-shadow-soft:0 4px 16px rgba(155, 181, 96, 0.08);
  --cm-z-header:30;
  --cm-z-sidebar:40;
  --cm-z-overlay:80;
}

*{ box-sizing:border-box; }
html,body{ min-height:100%; }
body.cm-body{
  margin:0;
  min-height:100vh;
  background:#f3f7ea;
  color:var(--cm-text);
  font:14px/1.5 "Manrope","Segoe UI",system-ui,sans-serif;
}

.sr-only{
  position:absolute !important;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0;
}

.mi{
  font-family:"Material Symbols Outlined";
  font-weight:400;
  font-style:normal;
  font-size:18px;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  direction:ltr;
  -webkit-font-feature-settings:'liga';
  -webkit-font-smoothing:antialiased;
  vertical-align:-3px;
}

.cm-is-loading{ overflow:hidden; }
.cm-loading-overlay{
  position:fixed;
  inset:0;
  z-index:calc(var(--cm-z-overlay) + 20);
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(87, 101, 46, 0.24);
  backdrop-filter:blur(4px);
}
.cm-loading-overlay.is-open{ display:flex; }
.cm-loading-card{
  width:min(520px, calc(100vw - 32px));
  display:flex;
  gap:16px;
  padding:18px;
  border:1px solid rgba(255,255,255,.65);
  border-radius:20px;
  background:rgba(255,255,255,.9);
  box-shadow:0 24px 60px rgba(114, 138, 57, 0.18);
}
.cm-loading-mark{
  width:56px;
  height:56px;
  position:relative;
  flex:0 0 56px;
}
.cm-loading-orbit{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:2px solid rgba(184,217,74,.35);
  animation:cm-spin 1.2s linear infinite;
}
.cm-loading-orbit:before{
  content:"";
  position:absolute;
  top:-5px;
  left:50%;
  width:10px;
  height:10px;
  border-radius:50%;
  transform:translateX(-50%);
  background:var(--cm-brand-strong);
  box-shadow:0 0 14px rgba(184,217,74,.5);
}
.cm-loading-core{
  position:absolute;
  inset:10px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #fffef0, rgba(203,230,90,.9) 58%, rgba(184,217,74,.34));
  animation:cm-pulse 1.1s ease-in-out infinite;
}
.cm-loading-title{
  font-weight:800;
  color:var(--cm-title);
}
.cm-loading-subtitle{
  margin-top:4px;
  color:var(--cm-text-soft);
  font-size:13px;
}
.cm-loading-dots{
  margin-top:10px;
  height:10px;
  width:64px;
  position:relative;
}
.cm-loading-dots:before,
.cm-loading-dots:after{
  content:"";
  position:absolute;
  top:50%;
  width:8px;
  height:8px;
  border-radius:50%;
  transform:translateY(-50%);
  background:var(--cm-brand-strong);
  animation:cm-dots 1s ease-in-out infinite;
}
.cm-loading-dots:after{
  animation-delay:.15s;
  opacity:.72;
}

@keyframes cm-spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}
@keyframes cm-pulse{
  0%,100%{ transform:scale(1); opacity:.94; }
  50%{ transform:scale(1.06); opacity:.82; }
}
@keyframes cm-dots{
  0%{ left:0; }
  50%{ left:42px; }
  100%{ left:0; }
}

body.cm-body > .cm-app{
  position:relative;
  display:grid;
  grid-template-columns:var(--cm-sidebar-w) 1fr;
  grid-template-rows:var(--cm-header-h) 1fr;
  grid-template-areas:
    "sidebar header"
    "sidebar main";
  min-height:100vh;
}

.cm-sidebar{
  grid-area:sidebar;
  position:sticky;
  top:0;
  height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--cm-panel);
  border-right:1px solid rgba(194, 213, 137, 0.5);
  box-shadow:4px 0 14px rgba(155, 181, 96, 0.05);
  z-index:var(--cm-z-sidebar);
}
.cm-sidebar__overlay{
  display:none;
}
.cm-sidebar__mobile-top{
  display:none;
}
.cm-sidebar__logo{
  display:flex;
  align-items:center;
  min-height:90px;
  padding:18px 28px 14px;
  border-bottom:1px solid rgba(194, 213, 137, 0.34);
}
.cm-logo{
  position:relative;
  display:inline-grid;
  gap:0;
  color:#b74873;
  line-height:.9;
  text-decoration:none;
}
.cm-logo__cm{
  font-size:28px;
  font-weight:800;
  letter-spacing:-.05em;
  text-transform:lowercase;
}
.cm-logo__unco{
  font-size:33px;
  font-weight:800;
  letter-spacing:-.06em;
  color:#9bc63f;
  text-transform:lowercase;
}
.cm-logo:after{
  content:"";
  position:absolute;
  top:4px;
  right:-12px;
  width:14px;
  height:14px;
  border-radius:2px 10px 2px 10px;
  transform:rotate(32deg);
  background:linear-gradient(180deg, #a9d55d 0%, #7eb031 100%);
}

.cm-sidebar__nav{
  flex:1 1 auto;
  padding:22px 20px;
  overflow:auto;
}
.cm-navgroup + .cm-navgroup{ margin-top:24px; }
.cm-navgroup__title{
  margin:0 0 12px;
  padding:0 10px;
  font-size:13px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#bdb9ae;
}
.cm-navgroup__list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:4px;
}
.cm-navgroup__mobile-profile{
  display:none;
}
.cm-navlink{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:38px;
  padding:9px 14px;
  border:1px solid transparent;
  border-radius:6px;
  color:var(--cm-text);
  text-decoration:none;
  font-weight:600;
}
.cm-navlink .mi{
  font-size:19px;
  color:#5a5a52;
}
.cm-navlink:hover{
  background:#f8fbf0;
  border-color:#e8f2d1;
}
.cm-navlink.active{
  background:linear-gradient(180deg, #effcbb 0%, #e7f89c 100%);
  border-color:#d6ea77;
  box-shadow:0 6px 16px rgba(187, 214, 78, 0.18);
}
.cm-navlink.active::after{
  content:"";
  position:absolute;
  right:11px;
  top:50%;
  width:8px;
  height:8px;
  margin-top:-4px;
  border-radius:50%;
  background:#d4387e;
}
.cm-sidebar__footer{
  padding:16px 24px 22px;
  border-top:1px solid rgba(194, 213, 137, 0.34);
  color:#b1b09f;
  font-size:12px;
  font-weight:700;
}

.cm-header{
  grid-area:header;
  position:sticky;
  top:0;
  z-index:var(--cm-z-header);
  display:flex;
  align-items:center;
  gap:14px;
  height:var(--cm-header-h);
  padding:0 28px 0 22px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(194, 213, 137, 0.42);
  box-shadow:0 8px 20px rgba(155, 181, 96, 0.06);
}
.cm-header__logo{
  display:none;
  position:relative;
  gap:0;
  color:#b74873;
  line-height:.9;
  text-decoration:none;
}
.cm-burger{
  display:none;
  width:40px;
  height:40px;
  padding:0;
  border:1px solid var(--cm-border);
  border-radius:12px;
  background:#fff;
  color:var(--cm-title);
  cursor:pointer;
}
.cm-burger__glyph{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
  width:20px;
}
.cm-burger__line{
  display:block;
  width:100%;
  height:2px;
  border-radius:999px;
  background:#33352d;
}
.cm-burger__line--short{
  width:10px;
}
.cm-header__store{
  display:flex;
  align-items:center;
  min-width:0;
  width:min(320px, 30vw);
}
.cm-store-select{
  width:100%;
  min-height:44px;
  padding:0 42px 0 14px;
  border:1px solid var(--cm-border);
  border-radius:6px;
  background:
    linear-gradient(45deg, transparent 50%, #908b7d 50%) calc(100% - 18px) calc(50% - 2px)/8px 8px no-repeat,
    linear-gradient(135deg, #908b7d 50%, transparent 50%) calc(100% - 12px) calc(50% - 2px)/8px 8px no-repeat,
    #fff;
  appearance:none;
  color:var(--cm-text);
  font:600 14px/1.2 inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.cm-store-select:focus{
  outline:none;
  border-color:var(--cm-border-strong);
  box-shadow:0 0 0 3px rgba(203,230,90,.22);
}
.cm-header__right{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:10px;
}
.cm-header__lang,
.cm-header__profile,
.cm-header__logout{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:40px;
  padding:0 6px;
  border:0;
  background:transparent;
  color:var(--cm-text);
  text-decoration:none;
  font:700 14px/1 inherit;
}
.cm-header__lang,
.cm-header__logout{
  cursor:pointer;
}
.cm-header__lang .mi,
.cm-header__profile .mi,
.cm-header__logout .mi{
  color:#5e5b50;
}
.cm-header__logout{
  padding-left:8px;
  border-left:1px solid rgba(194, 213, 137, 0.55);
}
.cm-header__profile.active{
  color:#d4387e;
}

.cm-main{
  grid-area:main;
  position:relative;
  padding:var(--cm-main-gutter);
  background:
    linear-gradient(180deg, rgba(246,251,235,.42), rgba(238,247,222,.42)),
    url("/cm/assets/images/cm-bg-pattern.png");
  background-repeat:no-repeat, no-repeat;
  background-size:auto, cover;
  background-position:0 0, center center;
}
.cm-main::before{
  content:"";
  position:absolute;
  inset:10px 8px 12px;
  border:1px solid rgba(194, 213, 137, 0.54);
  border-radius:18px;
  box-shadow:inset 0 0 0 1px rgba(245,250,231,.78);
  pointer-events:none;
}
.cm-main > *{
  position:relative;
  z-index:1;
}

.cm-page{
  padding:28px;
  background:var(--cm-panel);
  border:1px solid var(--cm-border);
  border-radius:var(--cm-radius);
  box-shadow:var(--cm-shadow-soft);
}

.card,
.cm-card{
  background:var(--cm-panel);
  border:1px solid var(--cm-border);
  border-radius:var(--cm-radius);
  box-shadow:var(--cm-shadow-soft);
}

.title{
  margin:0;
  color:var(--cm-title);
  font-size:31px;
  line-height:1.15;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:-.03em;
}

.muted{
  color:var(--cm-text-soft);
}

.row{
  display:flex;
  align-items:center;
  gap:10px;
}
.row.space{
  justify-content:space-between;
}
.row-nowrap{
  display:flex;
  align-items:center;
  gap:10px;
}
.spacer{
  flex:1 1 auto;
}

.btn,
button.btn,
.cm-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:32px;
  padding:0 16px;
  border:1px solid var(--cm-border-strong);
  border-radius:6px;
  background:#fffef5;
  color:var(--cm-title);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset;
  font:800 14px/1 inherit;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.btn:hover,
.cm-btn:hover{
  background:#f8fddf;
  border-color:#bfdc6c;
}
.btn.primary,
.btn.icon.primary,
.cm-btn.primary{
  background:linear-gradient(180deg, var(--cm-brand) 0%, var(--cm-brand-strong) 100%);
  border-color:var(--cm-brand-strong);
}
.btn.primary.ghost{
  background:#fffef5;
  border-color:var(--cm-border-strong);
}
.btn.ghost{
  background:#fff;
}
.btn.danger{
  background:#fff6f8;
  border-color:var(--cm-danger-border);
}
.btn.icon{
  gap:6px;
}
.btn.small{
  min-height:30px;
  padding:0 12px;
  font-size:13px;
}
.btn[disabled],
.cm-btn[disabled]{
  opacity:.55;
  cursor:not-allowed;
  box-shadow:none;
}

.in,
.sel,
.inp,
input[type="text"],
input[type="date"],
input[type="number"],
input[type="search"],
select,
textarea{
  min-height:32px;
  border:1px solid var(--cm-border);
  border-radius:6px;
  background:#fff;
  color:var(--cm-text);
  font:600 14px/1.3 inherit;
}
input[type="text"],
input[type="date"],
input[type="number"],
input[type="search"],
select,
textarea,
.in,
.sel,
.inp{
  padding:8px 12px;
}
textarea{
  resize:vertical;
}
input:focus,
select:focus,
textarea:focus,
.in:focus,
.sel:focus,
.inp:focus{
  outline:none;
  border-color:var(--cm-border-strong);
  box-shadow:0 0 0 3px rgba(203,230,90,.2);
}

.table-wrap{
  overflow:auto;
  border:1px solid rgba(214, 230, 185, 0.9);
  border-radius:12px;
  background:rgba(255,255,255,.94);
}
table{
  width:100%;
  border-collapse:collapse;
}
th,td{
  padding:11px 12px;
  border-bottom:1px solid rgba(214, 230, 185, 0.7);
  vertical-align:middle;
}
thead th{
  background:#fbfdf7;
  color:#a0b45f;
  font-size:13px;
  font-weight:800;
}

.chip,
.badge,
.pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:26px;
  padding:0 10px;
  border:1px solid var(--cm-border);
  border-radius:999px;
  background:#fff;
  color:var(--cm-title);
  font-size:12px;
  font-weight:700;
}

.modal .dialog,
.cm-modal__dialog{
  border:1px solid var(--cm-border);
  border-radius:18px;
  box-shadow:0 24px 70px rgba(104, 121, 57, 0.2);
}

@media (max-width: 1180px){
  .cm-header{
    padding-inline:18px;
  }
  .cm-header__store{
    min-width:260px;
  }
}

@media (max-width: 1024px){
  body.cm-body > .cm-app{
    grid-template-columns:1fr;
    grid-template-areas:
      "header"
      "main";
  }
  .cm-sidebar__overlay{
    position:fixed;
    inset:0;
    z-index:calc(var(--cm-z-sidebar) - 1);
    display:block;
    border:0;
    padding:0;
    background:rgba(67, 70, 56, 0.28);
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease;
  }
  .cm-sidebar{
    position:fixed;
    left:auto;
    right:0;
    top:0;
    transform:translateX(100%);
    transition:transform .22s ease;
    width:min(74vw, 290px);
    max-width:290px;
    border-right:0;
    border-left:1px solid rgba(194, 213, 137, 0.58);
    box-shadow:-24px 0 48px rgba(84, 97, 43, 0.2);
  }
  body.cm-body > .cm-app.is-sidebar-open .cm-sidebar{
    transform:translateX(0);
  }
  body.cm-body > .cm-app.is-sidebar-open .cm-sidebar__overlay{
    opacity:1;
    pointer-events:auto;
  }
  .cm-burger{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .cm-main{
    padding:12px;
  }
  .cm-main::before{
    inset:6px;
  }
}

@media (max-width: 760px){
  .cm-header{
    gap:10px;
    height:auto;
    min-height:56px;
    padding:0 14px;
    flex-wrap:nowrap;
  }
  .cm-header__logo{
    display:inline-grid;
    flex:0 0 auto;
    margin-right:8px;
  }
  .cm-header__store{
    order:0;
    flex:1 1 auto;
    min-width:0;
    width:auto;
  }
  .cm-header__right{
    display:none;
  }
  .cm-store-select{
    min-height:36px;
    padding:0 34px 0 11px;
    border-color:#d9dfcf;
    font-size:12px;
    font-weight:400;
    border-radius:4px;
    background:
      linear-gradient(45deg, transparent 50%, #5e5b50 50%) calc(100% - 17px) calc(50% - 1px)/6px 6px no-repeat,
      linear-gradient(135deg, #5e5b50 50%, transparent 50%) calc(100% - 12px) calc(50% - 1px)/6px 6px no-repeat,
      #fff;
  }
  .cm-burger{
    order:3;
    display:inline-flex;
    width:36px;
    height:36px;
    flex:0 0 36px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  .cm-burger__glyph{
    width:28px;
    gap:5px;
  }
  .cm-burger__line{
    height:2.25px;
    background:#33352d;
  }
  .cm-burger__line--short{
    width:14px;
  }
  .cm-sidebar{
    width:min(74vw, 290px);
    max-width:290px;
    background:#fff;
  }
  .cm-sidebar__mobile-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:82px;
    padding:22px 18px 18px 28px;
    border-bottom:1px solid rgba(194, 213, 137, 0.42);
  }
  .cm-sidebar__lang,
  .cm-sidebar__close{
    display:inline-flex;
    align-items:center;
    gap:4px;
    min-height:32px;
    padding:0;
    border:0;
    background:transparent;
    color:#3f4038;
    font:500 15px/1.2 inherit;
    cursor:pointer;
  }
  .cm-sidebar__lang .mi,
  .cm-sidebar__close .mi{
    font-size:21px;
    color:#3f4038;
    vertical-align:0;
  }
  .cm-sidebar__close .mi{
    font-size:34px;
  }
  .cm-sidebar__logo{
    display:none;
  }
  .cm-sidebar__nav{
    padding:22px 0 20px;
  }
  .cm-navgroup + .cm-navgroup{
    margin-top:18px;
  }
  .cm-navgroup__title{
    margin:0 0 10px;
    padding:0 28px;
    font-size:17px;
    font-weight:700;
    letter-spacing:0;
    color:#c5c5c5;
  }
  .cm-navgroup__list{
    gap:0;
  }
  .cm-navgroup__mobile-profile{
    display:block;
    margin-top:18px;
  }
  .cm-navlink{
    min-height:66px;
    padding:0 28px;
    border:0;
    border-radius:0;
    font-size:16px;
    font-weight:500;
    color:#43443a;
  }
  .cm-navlink .mi{
    width:24px;
    font-size:24px;
    color:#43443a;
  }
  .cm-navlink:hover{
    background:#fafcf4;
    border-color:transparent;
  }
  .cm-navlink.active{
    background:linear-gradient(180deg, #efffc0 0%, #ecffae 100%);
    border-color:transparent;
    box-shadow:none;
  }
  .cm-navlink.active::after{
    right:16px;
    width:11px;
    height:11px;
    margin-top:-5.5px;
    background:#ce0e72;
  }
  .cm-sidebar__footer{
    display:none;
  }
  .cm-main{
    padding:10px;
  }
  .cm-main::before{
    inset:0;
    border-radius:0;
    border:0;
    box-shadow:none;
  }
  .title{
    font-size:25px;
  }
}

@media (max-width: 520px){
  .cm-header__profile span:last-child{
    display:none;
  }
  .cm-header__logout{
    padding-left:0;
    border-left:0;
  }
  .cm-sidebar__logo{
    min-height:80px;
    padding-inline:20px;
  }
  .cm-logo__cm{ font-size:24px; }
  .cm-logo__unco{ font-size:29px; }
  .cm-header__logo .cm-logo__cm{ font-size:24px; }
  .cm-header__logo .cm-logo__unco{ font-size:29px; }
  .cm-header__logo:after{
    top:3px;
    right:-9px;
    width:11px;
    height:11px;
  }
}

@media (max-width: 360px){
  .cm-header{
    gap:8px;
    padding:0 10px;
  }
  .cm-header__logo{
    margin-right:2px;
  }
  .cm-header__logo .cm-logo__cm{
    font-size:20px;
  }
  .cm-header__logo .cm-logo__unco{
    font-size:24px;
  }
  .cm-header__logo:after{
    top:2px;
    right:-7px;
    width:9px;
    height:9px;
  }
  .cm-header__store{
    min-width:0;
  }
  .cm-store-select{
    min-height:34px;
    padding:0 28px 0 9px;
    font-size:11px;
  }
  .cm-burger{
    width:32px;
    height:32px;
    flex:0 0 32px;
  }
  .cm-burger__glyph{
    width:22px;
    gap:4px;
  }
  .cm-burger__line--short{
    width:11px;
  }
}