/* Shared primitives: every editor uses the same kit states and dimensions. */
* { box-sizing: border-box; }
:root { font: var(--nc-body1); font-synthesis: none; color-scheme: light; color: var(--nc-main); background: var(--nc-white); }
body { margin: 0; }
h1, h2, h3, p { margin: 0; }
h1 { font: var(--nc-h3); }
h2 { font: var(--nc-h4); }
h3 { font: var(--nc-h7); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; }
button, input, select, textarea, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--nc-primary-200); outline-offset: 4px; }
.hidden, [hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.nc-icon { display: inline-block; width: 24px; height: 24px; flex: 0 0 24px; background: currentColor; mask: var(--nc-icon) center / contain no-repeat; -webkit-mask: var(--nc-icon) center / contain no-repeat; vertical-align: middle; pointer-events: none; }
.nc-icon-color { background: none; mask: none; -webkit-mask: none; object-fit: contain; }
.nc-tooltip { position: fixed; inset: auto; margin: 0; max-width: min(320px, calc(100vw - 16px)); padding: 6px 8px; border: 0; border-radius: var(--nc-radius-2); background: rgb(0 0 0 / 80%); color: var(--nc-white); font: 400 12px/1.3 var(--nc-font); overflow-wrap: anywhere; }
.button-label { min-width: 0; }
.button, .currency-button, .icon-button, .currency-close {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--nc-space-2);
  min-height: 40px; padding: 0 var(--nc-space-4); border: 1px solid var(--nc-stroke);
  border-radius: var(--nc-control-radius); background: var(--nc-white); color: var(--nc-main);
  font: var(--nc-button); text-decoration: none; white-space: nowrap; flex-shrink: 0;
  transition: background-color .15s, border-color .15s, color .15s;
}
.button:hover:not(:disabled), .currency-button:hover:not(:disabled), .icon-button:hover:not(:disabled) { background: var(--nc-grey-400); }
.button-primary, .currency-primary { background: var(--nc-primary-200); border-color: var(--nc-primary-200); color: var(--nc-white); }
.button-primary:hover:not(:disabled), .currency-primary:hover:not(:disabled) { background: var(--nc-primary-100); border-color: var(--nc-primary-100); }
.button-accent { color: var(--nc-primary-200); border-color: var(--nc-primary-200); }
.button-accent:hover:not(:disabled) { background: var(--nc-primary-700); }
.button:disabled, .currency-button:disabled, .icon-button:disabled { color: var(--nc-stroke); background: var(--nc-white); border-color: var(--nc-stroke); }
.button-primary:disabled, .currency-primary:disabled { color: var(--nc-white); background: var(--nc-stroke); border-color: var(--nc-stroke); }
.nc-with-icon { padding-left: var(--nc-space-3); }
.nc-icon-only, .icon-button:not(.currency-row-button) { width: 40px; height: 40px; padding: 0; }
.icon-button { color: var(--nc-secondary); }
.icon-button:hover:not(:disabled) { color: var(--nc-primary-200); }
.icon-button[data-block-action="delete"]:hover:not(:disabled), #deleteSelected:hover:not(:disabled) { color: var(--nc-alert-200); background: var(--nc-alert-400); border-color: var(--nc-alert-300); }
.currency-close { border: 0; color: var(--nc-secondary); width: 24px; height: 24px; min-height: 24px; padding: 0; }
.currency-close:hover:not(:disabled) { color: var(--nc-main); background: var(--nc-grey-400); }
.currency-link { display: inline-flex; align-items: center; gap: var(--nc-space-1); border: 0; padding: 0; min-height: 24px; color: var(--nc-primary-200); background: transparent; font: var(--nc-body1); text-align: left; }
.currency-link:hover:not(:disabled) { color: var(--nc-primary-100); text-decoration: underline; text-underline-offset: 4px; }
.currency-link:disabled, .currency-close:disabled { color: var(--nc-stroke); }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), select, textarea {
  min-width: 0; width: 100%; height: 48px; padding: var(--nc-space-3) var(--nc-space-4);
  border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius);
  background: var(--nc-white); color: var(--nc-main); font: var(--nc-body1);
  transition: border-color .15s; outline: none;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color: var(--nc-grey-100); }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus, select:focus, textarea:focus { border-color: var(--nc-primary-200); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--nc-primary-200); outline-offset: 2px; }
input::placeholder, textarea::placeholder { color: var(--nc-secondary); opacity: 1; }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):disabled, select:disabled, textarea:disabled { background-color: var(--nc-grey-400); border-color: var(--nc-grey-200); color: var(--nc-grey-100); }
:is(input, select, textarea)[aria-invalid="true"] { border-color: var(--nc-alert-200); }
select:not([size]) { appearance: none; background-image: url('/ui-kit/icons/Chevron-down.svg'); background-repeat: no-repeat; background-position: right 16px center; background-size: 24px 24px; padding-right: 48px; cursor: pointer; }
select:disabled { cursor: default; }
select[size] { height: auto; min-height: 192px; padding: var(--nc-space-2); }
option { font: var(--nc-body1); padding: var(--nc-space-2); }
select[size] option:checked { background: var(--nc-primary-600); color: var(--nc-main); }
textarea { height: auto; min-height: 160px; resize: vertical; }
input[type="date"]::-webkit-calendar-picker-indicator { width: 24px; height: 24px; margin: 0; padding: 0; opacity: 1; background: url('/ui-kit/icons/Calendar.svg') center / 24px no-repeat; cursor: pointer; }
input[type="checkbox"] { appearance: none; width: 20px; height: 20px; margin: 0; flex: 0 0 20px; border: 0; border-radius: var(--nc-checkbox-radius); background: url('/ui-kit/icons/Checkbox-off.svg') center / 20px no-repeat; cursor: pointer; }
input[type="checkbox"]:checked { background-image: url('/ui-kit/icons/Checkbox-on.svg'); }
input[type="checkbox"]:disabled { cursor: default; background-image: url('/ui-kit/icons/Checkbox-off-disabled.svg'); }
input[type="checkbox"]:checked:disabled { background-image: url('/ui-kit/icons/Checkbox-on-disabled.svg'); }
label:has(> input:disabled), label:has(> select:disabled) { color: var(--nc-grey-100); }
input[type="file"] { width: 100%; min-width: 0; height: auto; min-height: 48px; padding: var(--nc-space-2); border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius); background: var(--nc-white); font: var(--nc-body3); color: var(--nc-secondary); }
input[type="file"]::file-selector-button { height: 40px; margin-right: var(--nc-space-3); padding: 0 var(--nc-space-4); border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius); background: var(--nc-white); color: var(--nc-main); font: var(--nc-button); cursor: pointer; }
input[type="file"]::file-selector-button:hover { background: var(--nc-grey-400); }
details { border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius); padding: var(--nc-space-4); margin-top: var(--nc-space-4); }
summary { display: flex; align-items: center; justify-content: space-between; gap: var(--nc-space-2); list-style: none; cursor: pointer; font: var(--nc-s2); color: var(--nc-main); }
summary::-webkit-details-marker { display: none; }
summary::after { content: ''; width: 24px; height: 24px; flex: 0 0 24px; background: url('/ui-kit/icons/Chevron-down.svg') center / contain no-repeat; }
details[open] > summary::after { background-image: url('/ui-kit/icons/Chevron-up.svg'); }
summary:hover { color: var(--nc-primary-200); }
details > :not(summary) { margin-top: var(--nc-space-4); }
dialog { width: 480px; max-width: calc(100vw - 48px); max-height: calc(100dvh - 48px); padding: 0; border: 0; border-radius: var(--nc-modal-radius); background: var(--nc-white); color: var(--nc-main); box-shadow: var(--nc-shadow-400); overflow: auto; overscroll-behavior: contain; }
dialog::backdrop { background: var(--nc-backdrop); }
.currency-header, .dialog-header { display: flex; align-items: center; justify-content: space-between; gap: var(--nc-space-4); padding: var(--nc-space-4) var(--nc-space-6); border-bottom: 1px solid var(--nc-stroke); }
.currency-header h2, .dialog-header h2 { font: var(--nc-h4); }
.currency-body, .dialog-body { padding: var(--nc-space-6); }
.currency-footer, .dialog-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--nc-space-4); margin-top: var(--nc-space-6); }
.currency-footer > .currency-button, .dialog-actions > .button { min-height: 48px; padding: 0 var(--nc-space-6); }
.currency-footer > .nc-with-icon, .dialog-actions > .nc-with-icon { padding-left: var(--nc-space-4); }
.currency-help, .currency-status, .message { font: var(--nc-body3); color: var(--nc-secondary); overflow-wrap: anywhere; }
.currency-help { margin-top: var(--nc-space-2); }
.currency-status:not(:empty), .message:not(:empty) { display: flex; align-items: flex-start; gap: var(--nc-space-2); margin-top: var(--nc-space-4); padding: var(--nc-space-3) var(--nc-space-4); border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius); background: var(--nc-grey-400); color: var(--nc-main); }
.currency-status.error:not(:empty), .message.error:not(:empty) { border-color: var(--nc-alert-300); background: var(--nc-alert-400); }
.currency-status.error:not(:empty)::before, .message.error:not(:empty)::before { content: ''; width: 24px; height: 24px; flex: 0 0 24px; background: var(--nc-alert-200); mask: url('/ui-kit/icons/Warning.svg') center / contain no-repeat; }
.currency-status:empty, .message:empty { display: none; }
.currency-check { display: flex; align-items: flex-start; gap: var(--nc-space-3); font: var(--nc-body3); color: var(--nc-main); }
.currency-check input { margin-top: 0; }
.currency-video { display: block; width: 100%; max-height: 320px; margin-top: var(--nc-space-4); background: var(--nc-main); border-radius: var(--nc-control-radius); }
.nc-select-menu { position: fixed; inset: auto; margin: 0; padding: var(--nc-space-2); border: 1px solid var(--nc-grey-200); border-radius: var(--nc-control-radius); background: var(--nc-white); color: var(--nc-main); box-shadow: var(--nc-shadow-300); overflow: auto; overscroll-behavior: contain; }
.nc-select-menu button { display: flex; align-items: center; justify-content: space-between; gap: var(--nc-space-2); width: 100%; min-height: 40px; padding: var(--nc-space-2) var(--nc-space-3); border: 0; border-radius: var(--nc-radius-2); text-align: left; background: transparent; color: var(--nc-main); font: var(--nc-body1); }
.nc-select-menu button .nc-icon { color: var(--nc-primary-200); }
.nc-select-menu button:hover, .nc-select-menu .nc-option-active { background: var(--nc-primary-700); }
.nc-select-menu button[aria-selected="true"] { background: var(--nc-primary-600); }
.nc-select-menu button:disabled { color: var(--nc-grey-100); }
select[aria-expanded="true"] { border-color: var(--nc-primary-200); background-image: url('/ui-kit/icons/Chevron-up.svg'); }
.nc-media-player { min-width: 0; width: 100%; border: 1px solid var(--nc-stroke); border-radius: var(--nc-control-radius); background: var(--nc-white); overflow: hidden; }
.nc-media-player:has(> .hidden), .nc-media-player:has(> [hidden]) { display: none; }
.nc-media-player > audio { display: none; }
.nc-media-player > video { display: block; width: 100%; max-height: 320px; margin: 0; border-radius: 0; }
.nc-media-controls { display: grid; grid-template-columns: 40px 40px minmax(16px, 1fr) 40px; align-items: center; gap: var(--nc-space-1); padding: var(--nc-space-1); }
.nc-media-controls .icon-button { width: 40px; height: 40px; min-height: 40px; border: 0; }
.nc-media-controls [data-media-action="mute"] { grid-column: 4; grid-row: 1; }
.nc-video-player .nc-media-controls { grid-template-columns: 40px 40px minmax(16px, 1fr) 40px 40px; }
.nc-media-controls [data-media-action="fullscreen"] { grid-column: 5; grid-row: 1; }
.nc-media-seek[type="range"], .nc-media-volume[type="range"] { appearance: none; width: 100%; height: 4px; min-width: 16px; padding: 0; border: 0; border-radius: var(--nc-radius-1); background: var(--nc-grey-200); cursor: pointer; accent-color: var(--nc-primary-200); }
.nc-media-volume { grid-column: 3 / -1; grid-row: 2; }
.nc-media-volume::-webkit-slider-thumb { appearance: none; width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--nc-primary-200); }
.nc-media-volume::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--nc-primary-200); }
.nc-media-seek::-webkit-slider-thumb { appearance: none; width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--nc-primary-200); }
.nc-media-seek::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--nc-primary-200); }
.nc-media-time { grid-column: 1 / 3; grid-row: 2; padding: 0 var(--nc-space-1) var(--nc-space-1); font: var(--nc-body4); color: var(--nc-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; text-align: center; }
.nc-video-player:fullscreen { display: flex; flex-direction: column; background: var(--nc-main); border: 0; border-radius: 0; }
.nc-video-player:fullscreen > video { flex: 1; min-height: 0; max-height: none; object-fit: contain; }
.nc-video-player:fullscreen > .nc-media-controls { flex-shrink: 0; background: var(--nc-white); }
a { color: var(--nc-primary-200); text-underline-offset: 4px; }
a:hover { color: var(--nc-primary-100); }
@media (max-width: 640px) {
  dialog { width: 100% !important; max-width: 100%; max-height: 100dvh; height: 100dvh; margin: 0; border-radius: 0; }
  .currency-header, .dialog-header { padding: var(--nc-space-3) var(--nc-space-4); }
  .currency-header h2, .dialog-header h2 { font: var(--nc-h5); }
  .currency-body, .dialog-body { padding: var(--nc-space-4); }
  .currency-footer, .dialog-actions { flex-wrap: wrap; gap: var(--nc-space-3); }
  .currency-footer > button, .dialog-actions > button { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0s !important; scroll-behavior: auto !important; } }
@media (forced-colors: active) { .nc-icon { background: ButtonText; } input[type="checkbox"] { appearance: auto; } }