:root{
      --dc_bg:#07070b;
      --dc_text:#ececf5;
      --dc_muted:#9b9bb5;

      --dc_border: rgba(38,38,58,.95);
      --dc_shadow: 0 12px 30px rgba(0,0,0,.35);

      --dc_good_bg: rgba(56,211,159,.14);
      --dc_good_bd: rgba(56,211,159,.35);

      --dc_warn_bg: rgba(246,196,92,.14);
      --dc_warn_bd: rgba(246,196,92,.35);

      --dc_bad_bg: rgba(255,107,107,.13);
      --dc_bad_bd: rgba(255,107,107,.35);

      --dc_excess_bg: rgba(168, 120, 255, .14);
      --dc_excess_bd: rgba(168, 120, 255, .42);

      --dc_header_h: 0px;
      --dc_sticky_top: 12px;
    }

    *{box-sizing:border-box}
    body{
      margin:0;
      background:
        radial-gradient(1200px 700px at 20% -10%, rgba(56,211,159,.09), transparent 60%),
        radial-gradient(900px 600px at 110% 0%, rgba(246,196,92,.07), transparent 55%),
        var(--dc_bg);
      color:var(--dc_text);
      font:13px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Arial;
    }

    .dc_wrap{
    position: relative;
    max-width: 1320px;
    margin: 0 auto;
    padding: 14px;
    padding-top: calc(14px + var(--dc_header_h));
    z-index: 12;
    }

    .dc_topbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:10px}
    .dc_brand{display:flex;flex-direction:column;gap:2px}
    .dc_brandTitle{margin:0;font-size:18px;letter-spacing:.2px}
    .dc_brandSub{color:var(--dc_muted);font-size:12px}

    .dc_controls{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;align-items:center}

    button,select,input,textarea{
      background:rgba(12,12,20,.9);
      color:var(--dc_text);
      border:1px solid var(--dc_border);
      border-radius:12px;
      padding:9px 10px;
      outline:none;
      box-shadow:none;
    }
    select,input{min-height:34px}
    textarea{min-height:120px;width:100%;resize:vertical}
    select:disabled,input:disabled,button:disabled{opacity:.55;cursor:not-allowed}
    button{cursor:pointer}

    button.dc_btnPrimary{
      border-color:rgba(56,211,159,.55);
      background:linear-gradient(180deg, rgba(56,211,159,.18), rgba(56,211,159,.10));
    }
    button.dc_btnPrimary:hover{filter:brightness(1.06)}
    button.dc_btnSecondary{
      border-color:rgba(246,196,92,.55);
      background:linear-gradient(180deg, rgba(246,196,92,.16), rgba(246,196,92,.08));
    }
    button.dc_btnSecondary:hover{filter:brightness(1.06)}
    button.dc_btnDanger{
      border-color:rgba(255,107,107,.55);
      background:linear-gradient(180deg, rgba(255,107,107,.14), rgba(255,107,107,.08));
    }
    button.dc_btnDanger:hover{filter:brightness(1.06)}

    .dc_grid{display:grid;grid-template-columns: 2fr 1fr;gap:10px}
    @media (max-width: 1100px){.dc_grid{grid-template-columns:1fr}}

    .dc_card{
      background:linear-gradient(180deg, rgba(16,16,26,.85), rgba(12,12,20,.75));
      border:1px solid var(--dc_border);
      border-radius:18px;
      box-shadow:var(--dc_shadow);
      padding:10px;
    }
    .dc_cardTitle{margin:0 0 8px 0;font-size:13px;color:#dcdcf0;font-weight:650;letter-spacing:.2px}

    .dc_items{display:flex;flex-direction:column;gap:10px}

    .dc_item{
      border:1px solid var(--dc_border);
      border-radius:18px;
      padding:10px;
      background:linear-gradient(180deg, rgba(12,12,20,.65), rgba(10,10,16,.55));
    }
    .dc_item.dc_stateGood{background:linear-gradient(180deg, rgba(56,211,159,.12), rgba(10,10,16,.55)); border-color: var(--dc_good_bd)}
    .dc_item.dc_stateWarn{background:linear-gradient(180deg, rgba(246,196,92,.12), rgba(10,10,16,.55)); border-color: var(--dc_warn_bd)}
    .dc_item.dc_stateBad{background:linear-gradient(180deg, rgba(255,107,107,.11), rgba(10,10,16,.55)); border-color: var(--dc_bad_bd)}

    .dc_itemHead{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start;justify-content:space-between}
    .dc_itemLeft{display:flex;flex-direction:column;gap:6px;min-width:240px}
    .dc_titleRow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
    .dc_itemTitle{font-weight:720;font-size:13px}

    .dc_tag{
      display:inline-flex;align-items:center;gap:6px;
      padding:3px 9px;border-radius:999px;border:1px solid var(--dc_border);
      background:rgba(23,23,37,.85);
      color:var(--dc_muted);font-size:12px
    }
    .dc_tag.dc_tagGood{border-color:var(--dc_good_bd); color:#c8f7e7; background:rgba(56,211,159,.10)}
    .dc_tag.dc_tagWarn{border-color:var(--dc_warn_bd); color:#ffe7b3; background:rgba(246,196,92,.10)}
    .dc_tag.dc_tagBad{border-color:var(--dc_bad_bd); color:#ffd0d0; background:rgba(255,107,107,.09)}
    .dc_tag.dc_tagExcess{border-color:var(--dc_excess_bd); color:#eadcff; background:rgba(168,120,255,.10)}

    .dc_meta{display:flex;gap:6px;flex-wrap:wrap}
    .dc_formRow{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
    .dc_field{display:flex;flex-direction:column;gap:5px}
    .dc_field label{font-size:11px;color:var(--dc_muted)}
    .dc_field .dc_sm{width:86px}
    .dc_field .dc_md{width:150px}

    .dc_check{
      display:flex;align-items:center;gap:8px;
      padding:7px 10px;border-radius:12px;border:1px solid var(--dc_border);
      background:rgba(12,12,20,.85)
    }
    .dc_check label{font-size:12px;color:#d7d7ee}

    .dc_slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
    @media (max-width: 920px){.dc_slots{grid-template-columns:1fr}}

    .dc_slot{
      border:1px solid var(--dc_border);
      border-radius:16px;
      padding:9px;
      background:rgba(8,8,14,.55);
      position: relative;
    }
    .dc_slot.dc_stateGood{background:rgba(56,211,159,.10); border-color:var(--dc_good_bd)}
    .dc_slot.dc_stateWarn{background:rgba(246,196,92,.10); border-color:var(--dc_warn_bd)}
    .dc_slot.dc_stateBad{background:rgba(255,107,107,.09); border-color:var(--dc_bad_bd)}
    .dc_slot.dc_isExRed{
      background: linear-gradient(180deg, var(--dc_excess_bg), rgba(8,8,14,.55));
      border-color: var(--dc_excess_bd);
    }
    .dc_excessBadge{
      position:absolute;
      right:10px;
      bottom:10px;
      font-size:10px;
      padding:3px 8px;
      border-radius:999px;
      border:1px solid var(--dc_excess_bd);
      background:rgba(168,120,255,.10);
      color:#eadcff;
    }

    .dc_slotTop{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
    .dc_slotTag{font-size:11px;color:var(--dc_muted);padding:3px 8px;border-radius:999px;border:1px solid var(--dc_border);background:rgba(23,23,37,.85)}
    .dc_lock{display:flex;align-items:center;gap:6px;color:var(--dc_muted);font-size:12px}

    .dc_slotGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
    .dc_span2{grid-column:1 / -1}
    .dc_mini{font-size:11px;color:var(--dc_muted)}

    .dc_totals{overflow:auto;border-radius:14px;border:1px solid var(--dc_border)}
    table{width:100%;border-collapse:collapse;background:rgba(10,10,16,.45)}
    th,td{padding:8px 8px;border-top:1px solid var(--dc_border);text-align:left;white-space:nowrap}
    th{color:var(--dc_muted);font-weight:650;font-size:12px;background:rgba(12,12,20,.65); position: sticky; top: 0}
    td.dc_num, th.dc_num{text-align:right}

    .dc_sideGrid{display:grid;grid-template-columns:1fr;gap:10px}
    .dc_sideSticky{
      position: sticky;
      top: calc(var(--dc_header_h) + var(--dc_sticky_top));
      align-self: start;
    }
    @media (max-width: 1100px){
      .dc_sideSticky{position: static}
    }

    .dc_jsonBtns{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
  
    .dc_slot.dc_hasMod{
      border-color: rgba(120,180,255,.55);
      background: linear-gradient(180deg, rgba(120,180,255,.10), rgba(8,8,14,.55));
    }


    .dc_slot.dc_isExRedRemovable{
      background: linear-gradient(180deg, rgba(168,120,255,.22), rgba(8,8,14,.55));
      border-color: rgba(168,120,255,.70);
      box-shadow: 0 0 0 2px rgba(168,120,255,.16) inset;
    }
    .dc_slot.dc_isExRedReducible{
      background: linear-gradient(180deg, rgba(120,180,255,.18), rgba(8,8,14,.55));
      border-color: rgba(120,180,255,.70);
      box-shadow: 0 0 0 2px rgba(120,180,255,.14) inset;
    }
    .dc_excessBadge{
      display:inline-flex;
      align-items:center;
      gap:6px;
      font-weight:650;
    }
    .dc_excessBadge b{font-weight:750}
    .dc_legendList{display:flex;flex-direction:column;gap:8px}
    .dc_legendRow{display:flex;gap:10px;align-items:flex-start}
    .dc_swatch{width:14px;height:14px;border-radius:5px;border:1px solid var(--dc_border);margin-top:2px}
    .dc_swatch.good{background:rgba(56,211,159,.18);border-color:var(--dc_good_bd)}
    .dc_swatch.warn{background:rgba(246,196,92,.18);border-color:var(--dc_warn_bd)}
    .dc_swatch.bad{background:rgba(255,107,107,.16);border-color:var(--dc_bad_bd)}
    .dc_swatch.fill{background:rgba(120,180,255,.14);border-color:rgba(120,180,255,.55)}
    .dc_swatch.exrem{background:rgba(168,120,255,.22);border-color:rgba(168,120,255,.70)}
    .dc_swatch.exred{background:rgba(120,180,255,.18);border-color:rgba(120,180,255,.70)}
    .dc_legendText{color:var(--dc_muted);font-size:12px;line-height:1.35}


    .dc_slot.dc_isExcessRemovable .dc_excessBadge{
      border-color: rgba(168,120,255,.80);
      background: rgba(168,120,255,.16);
      color:#f0e7ff;
    }
    .dc_slot.dc_isExcessReducible .dc_excessBadge{
      border-color: rgba(120,180,255,.80);
      background: rgba(120,180,255,.14);
      color:#e6f1ff;
    }


    .dc_slotTop{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
    }
    .dc_slotIconWrap{
      flex:1;
      display:flex;
      justify-content:center;
      pointer-events:none;
      min-height: 36px;
    }
    .dc_slotIcon{
      width:50px;
      height:50px;
      object-fit:contain;
      filter: drop-shadow(0 10px 14px rgba(0,0,0,.45));
      opacity:.96;
    }


/* ===== Навигация по предметам ===== */

.dc_itemNav {
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap:8px;
  margin-bottom:12px;
}

.dc_itemNavBtn {
  all:unset;

  background:rgba(12,12,20,.9);
  border:1px solid var(--dc_border);
  border-radius:14px;
  padding:4px;
  cursor:pointer;
  transition:.18s ease;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}

.dc_itemNavBtn img{
  width:30px;
  height:30px;
  object-fit:contain;
  pointer-events:none;
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.45));
}

.dc_navOverflow{
  border-color:#ff6b6b !important;
  box-shadow:0 0 0 2px rgba(255,107,107,.35);
}

.dc_navExcess{
  border-color:#a878ff !important;
  box-shadow:0 0 0 2px rgba(168,120,255,.35);
}


.dc_navGreen{
  border-color:#38d39f !important;
  box-shadow:0 0 0 2px rgba(56,211,159,.35);
}

.dc_navYellow{
  border-color:#f6c45c !important;
  box-shadow:0 0 0 2px rgba(246,196,92,.35);
}

.dc_navPurple{
  border-color:#a878ff !important;
  box-shadow:0 0 0 2px rgba(168,120,255,.35);
}

.dc_navRed{
  border-color:#ff6b6b !important;
  box-shadow:0 0 0 2px rgba(255,107,107,.35);
}

/* Totals table cap overflow */
.dc_capOverflow{
  color:#ff6b6b !important;
  font-weight:700;
}

.dc_lang{display:flex;gap:6px;align-items:center}
.dc_langBtn{
  width:38px;height:34px;padding:0;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;
}
.dc_langBtn.isActive{
  border-color: rgba(56,211,159,.7);
  box-shadow: 0 0 0 2px rgba(56,211,159,.18) inset;
}