/* The Desk Config panels (.dcp-*) — verbatim from the classic Desk (index.html), shared by the workspace's dialog
   (the footer's Nav button) and Back End → Settings, which draws the same panels on a page. */
    .dcp-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 14px 18px 10px; border-bottom: 1px solid #30363d; flex-shrink: 0;
    }
    .dcp-title { font-size: 15px; font-weight: 700; color: #e6edf3; display: flex; align-items: center; gap: 8px; }
    .dcp-close { background: none; border: none; color: #8b949e; font-size: 20px; cursor: pointer; padding: 2px 6px; border-radius: 6px; line-height: 1; }
    .dcp-close:hover { color: #e6edf3; background: #21262d; }
    .dcp-tabs { display: flex; gap: 0; border-bottom: 1px solid #30363d; flex-shrink: 0; }
    .dcp-tab {
      padding: 9px 18px; font-size: 12px; font-weight: 600; color: #8b949e;
      background: none; border: none; cursor: pointer; border-bottom: 2px solid transparent;
      margin-bottom: -1px; white-space: nowrap;
    }
    .dcp-tab.active { color: #58a6ff; border-bottom-color: #58a6ff; }
    .dcp-body { flex: 1; overflow-y: auto; padding: 16px 18px; }
    .dcp-panel { display: none; }
    .dcp-panel.active { display: block; }
    .dcp-section-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #8b949e; margin: 0 0 8px; }
    .dcp-mod-row {
      display: flex; align-items: center; gap: 10px;
      padding: 7px 10px; border-radius: 8px; margin-bottom: 2px;
      background: #21262d; cursor: grab;
    }
    .dcp-mod-row svg { color: #8b949e; flex-shrink: 0; }
    .dcp-mod-name { flex: 1; font-size: 13px; color: #e6edf3; }
    .dcp-mod-toggle { position: relative; display: inline-flex; width: 36px; height: 20px; flex-shrink: 0; cursor: pointer; }
    .dcp-mod-toggle input { opacity: 0; width: 0; height: 0; position: absolute; }
    .dcp-mod-toggle-track {
      width: 100%; height: 100%; border-radius: 10px; background: #30363d;
      transition: background 0.15s; display: block;
    }
    .dcp-mod-toggle input:checked + .dcp-mod-toggle-track { background: #238636; }
    .dcp-mod-toggle-thumb {
      position: absolute; top: 2px; left: 2px; width: 16px; height: 16px;
      border-radius: 50%; background: #fff; transition: left 0.15s; pointer-events: none;
    }
    .dcp-mod-toggle input:checked ~ .dcp-mod-toggle-thumb { left: 18px; }
    .dcp-preset-card {
      background: #21262d; border: 1px solid #30363d; border-radius: 10px;
      padding: 12px 14px; margin-bottom: 8px; cursor: pointer;
      transition: border-color 0.15s;
    }
    .dcp-preset-card:hover { border-color: #58a6ff; }
    .dcp-preset-card.active-preset { border-color: #238636; background: rgba(35,134,54,0.1); }
    .dcp-preset-name { font-size: 13px; font-weight: 700; color: #e6edf3; margin-bottom: 3px; }
    .dcp-preset-mods { font-size: 11px; color: #8b949e; }
    .dcp-btn { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 6px 14px; border-radius: 6px; border: 1px solid #30363d; background: #21262d; color: #e6edf3; cursor: pointer; margin-top: 10px; }
    .dcp-btn:hover { border-color: #58a6ff; color: #58a6ff; }
    .dcp-btn-primary { background: #238636; border-color: #238636; color: #fff; }
    .dcp-btn-primary:hover { background: #2ea043; border-color: #2ea043; color: #fff; }
    .dcp-toolbar-row { display: flex; align-items: center; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid #21262d; }
    .dcp-toolbar-label { font-size: 13px; color: #e6edf3; }
    .dcp-toolbar-sub { font-size: 11px; color: #8b949e; margin-top: 2px; }