.ddcp-launch { margin: 0 0 20px; display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.ddcp-launch .ddcp-open { display: flex; align-items: center; justify-content: center; gap: 10px; background: #111827; color: #fff; border: 0; cursor: pointer; padding: 14px 22px; border-radius: 6px; font-weight: 700; font-size: 1em; width: 100%; }
.ddcp-launch .ddcp-open:hover { background: #16234a; color: #fff; }
.ddcp-launch__hint { font-size: 0.85em; text-align: center; align-self: center; padding-bottom: 2px; border-bottom: 2px solid #4caf50; }
.ddcp-noscroll, .ddcp-noscroll body { overflow: hidden; }
.ddcp-modal { position: fixed; inset: 0; z-index: 100000; display: none; }
.ddcp-modal--open { display: block; }
.ddcp-backdrop { position: absolute; inset: 0; background: rgba(10, 14, 28, 0.82); }
.ddcp-dialog { position: relative; margin: 3vh auto; width: min(1060px, 94vw); max-height: 94vh; background: #fff; border-radius: 8px; box-shadow: 0 18px 60px rgba(0,0,0,0.4); overflow: auto; } .ddcp-modal .ddcp-close { position: absolute; top: 8px; right: 10px; z-index: 2; border: 1px solid #e2e4ea !important; background: #fff !important; color: #444 !important; border-radius: 50% !important; width: 36px; height: 36px; padding: 0 !important; font-size: 22px; line-height: 1; cursor: pointer; }
.ddcp-modal .ddcp-close:hover { color: #000 !important; border-color: #bbb !important; }
.ddcp-body { display: grid; grid-template-columns: minmax(0, 46%) minmax(0, 1fr); gap: 26px; padding: 26px; }
.ddcp-stagewrap { min-width: 0; }
.ddcp-stage { position: relative; width: fit-content; max-width: 100%; margin: 0 auto; overflow: hidden; border-radius: 4px; box-shadow: 0 4px 18px rgba(0,0,0,0.25); user-select: none; touch-action: none; }
.ddcp-img { display: block; max-width: 100%; max-height: 78vh; width: auto; height: auto; pointer-events: none; }
.ddcp-watermark { position: absolute; inset: 0; pointer-events: none; z-index: 3; background-repeat: repeat; }
.ddcp-el { position: absolute; z-index: 2; transform: translate(-50%, -50%); cursor: grab; padding: 0.15em 0.2em; overflow-wrap: break-word; text-shadow: 0 1px 6px rgba(0,0,0,0.35); -webkit-user-select: none; user-select: none; }
.ddcp-el::after { content: ""; position: absolute; inset: -12px; } .ddcp-el--dragging { cursor: grabbing; }
.ddcp-el--selected { outline: 2px dashed rgba(255,255,255,0.95); outline-offset: 4px; }
.ddcp-el--placeholder { opacity: 0.55; }
.ddcp-movebadge { display: none; position: absolute; top: 50%; right: -16px; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: #fff; color: #16234a; box-shadow: 0 1px 6px rgba(0,0,0,0.35); align-items: center; justify-content: center; pointer-events: none; z-index: 4; }
.ddcp-el--selected .ddcp-movebadge { display: flex; }
.ddcp-panel { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.ddcp-panel__head { padding-right: 44px; }
.ddcp-heading { margin: 0 0 4px; font-size: 1.3em; }
.ddcp-subhead { margin: 0; font-size: 0.85em; opacity: 0.75; }
.ddcp-fields { display: flex; flex-direction: column; gap: 10px; }
.ddcp-fieldrow { display: flex; flex-direction: column; gap: 4px; font-size: 0.85em; font-weight: 600; border-left: 3px solid transparent; padding-left: 8px; margin-left: -11px; }
.ddcp-fieldrow--selected { border-left-color: #4caf50; }
.ddcp-fieldrow--selected > span::after { content: " ✓ selected"; color: #2e7d32; font-weight: 700; font-size: 0.85em; }
.ddcp-fieldhint { font-weight: 400; opacity: 0.65; }
.ddcp-input { width: 100%; padding: 10px 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 15px; font-weight: 400; }
.ddcp-input:focus { border-color: #4caf50; outline: none; box-shadow: 0 0 0 2px rgba(76,175,80,0.18); }
.ddcp-controls { display: flex; flex-direction: column; gap: 10px; padding: 14px; background: #fff; border: 1px solid #e2e4ea; border-radius: 8px; }
.ddcp-controls__label { font-size: 0.82em; opacity: 0.85; }
.ddcp-controls__label strong { color: #16234a; }
.ddcp-controls__row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ddcp-size { flex: 1; min-width: 110px; accent-color: #4caf50; }
.ddcp-size-val { min-width: 40px; text-align: center; font-size: 0.85em; font-weight: 700; border: 1px solid #e2e4ea; border-radius: 6px; padding: 6px 4px; }
.ddcp-modal .ddcp-size-minus, .ddcp-modal .ddcp-size-plus { width: 44px; height: 44px; border: 1px solid #ccc !important; background: #fff !important; color: #16234a !important; border-radius: 6px !important; padding: 0 !important; font-size: 20px; line-height: 1; cursor: pointer; }
.ddcp-modal .ddcp-size-minus:hover, .ddcp-modal .ddcp-size-plus:hover { border-color: #4caf50 !important; }
.ddcp-modal .ddcp-reset-el, .ddcp-modal .ddcp-reset-all { border: 1px solid #ccc !important; background: #fff !important; color: #333 !important; border-radius: 6px !important; padding: 8px 14px !important; font-size: 0.85em; cursor: pointer; }
.ddcp-modal .ddcp-reset-el:hover, .ddcp-modal .ddcp-reset-all:hover { border-color: #16234a !important; }
.ddcp-ctl-lab { font-size: 0.82em; opacity: 0.85; min-width: 74px; }
.ddcp-modal .ddcp-align { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #ccc !important; background: #fff !important; color: #333 !important; border-radius: 6px !important; padding: 0 !important; cursor: pointer; }
.ddcp-modal .ddcp-align:hover { border-color: #4caf50 !important; }
.ddcp-modal .ddcp-align--active { border-color: #4caf50 !important; color: #2e7d32 !important; background: #eef9ef !important; box-shadow: inset 0 0 0 1px #4caf50; }
.ddcp-swatches { display: inline-flex; gap: 10px; align-items: center; }
.ddcp-modal .ddcp-swatch { width: 30px; height: 30px; border-radius: 50% !important; border: 2px solid #d5d8de !important; padding: 0 !important; cursor: pointer; }
.ddcp-modal .ddcp-swatch:hover { border-color: #9aa0ab !important; }
.ddcp-modal .ddcp-swatch--active { border-color: #4caf50 !important; box-shadow: 0 0 0 2px rgba(76,175,80,0.35); }
.ddcp-admin-sep { width: 100%; font-weight: 700; margin-top: 4px; }
.ddcp-modal .ddcp-clear-swatches { border: 1px solid #ccc !important; background: #fff !important; color: #333 !important; border-radius: 6px !important; padding: 4px 10px !important; font-size: 0.9em; cursor: pointer; }
.ddcp-fitnote { font-size: 0.78em; opacity: 0.7; margin: 0; text-align: center; }
.ddcp-modal .ddcp-buy { background: #2f9e44 !important; color: #fff !important; border: 0 !important; padding: 15px 20px !important; border-radius: 6px !important; font-weight: 700; font-size: 1em; cursor: pointer; }
.ddcp-modal .ddcp-buy:hover { background: #268a3a !important; }
.ddcp-modal .ddcp-cancel { background: none !important; border: 0 !important; color: #555 !important; text-decoration: underline; cursor: pointer; font-size: 0.9em; padding: 2px !important; align-self: center; box-shadow: none !important; }
.ddcp-modal .ddcp-cancel:hover { color: #000 !important; }
.ddcp-disclaimer { font-size: 0.78em; opacity: 0.7; margin: 0; border-top: 1px solid #eee; padding-top: 10px; }
.ddcp-adminpanel { display: flex; flex-wrap: wrap; gap: 8px 14px; padding: 12px; background: #fff7e6; border: 1px dashed #d9a62e; border-radius: 6px; font-size: 0.8em; }
.ddcp-adminpanel label { display: flex; align-items: center; gap: 6px; }
.ddcp-adminpanel input[type="number"] { width: 64px; }
.ddcp-adminpanel .ddcp-save-config { width: 100%; }
.ddcp-save-msg { font-weight: 700; color: #1a7a2e; }
@media (max-width: 860px) {
.ddcp-dialog { margin: 0; width: 100vw; height: 100vh; max-height: none; border-radius: 0; }
.ddcp-body { grid-template-columns: 1fr; gap: 14px; padding: 14px 14px 28px; }
.ddcp-img { max-height: 46vh; } .ddcp-panel__head { order: -2; }
.ddcp-controls { order: -1; }
.ddcp-panel__head { padding-right: 44px; }
.ddcp-subhead { display: none; }
.ddcp-controls { padding: 10px; }
}