/* Shared panel controls extracted from former global CSS. */

/* ─────────────────────────────────────────────────────────────
   Extracted ownership rules — 2026-06-29 CSS architecture cleanup.
   Moved out of global CSS without changing declaration values.
   ───────────────────────────────────────────────────────────── */
.icon-btn {
  width: 24px; height: 24px; border-radius: 50%;
  background: transparent; border: 1px solid var(--rule);
  color: var(--ink-2);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 0.14s, color 0.14s, border-color 0.14s,
              transform 0.12s var(--ease-out);
}@media (hover: hover) and (pointer: fine){
.icon-btn:hover {
    background: var(--ink-2);
    color: var(--panel);
    border-color: var(--ink-2);
  }
}
.icon-btn:active    { transform: scale(0.92); }.icon-btn:disabled  { opacity: 0.28; cursor: not-allowed; }.section-label {
  display: flex; justify-content: space-between; align-items: baseline;
  border-bottom: 1px solid var(--rule-soft);
  padding-bottom: 6px; margin-bottom: 12px;
}.section-label .name {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--ink-2);
}.section-label .value {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-dim);
}.swatches { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }.swatch {
  width: 34px; height: 34px;
  border: 1.5px solid rgba(20, 20, 42, 0.14);
  cursor: pointer; position: relative;
  transition: transform 0.14s var(--ease-out);
  border-radius: 50%;
}@media (hover: hover) and (pointer: fine){
.swatch:hover { transform: translateY(-2px) scale(1.08); }
}
.swatch:active            { transform: scale(0.93); }.swatch.active            { outline: 2.5px solid var(--nurr-blue); outline-offset: 3px; }.swatch input[type="color"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }.swatch.add {
  background: transparent; border: 1.5px dashed var(--rule);
  color: var(--ink-faint);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
}@media (hover: hover) and (pointer: fine){
.swatch.add:hover { color: var(--accent); border-color: var(--accent); }
}
.swatch.remove-target:hover::after {
  content: ""; position: absolute; top: -3px; right: -3px;
  width: 11px; height: 11px;
  background: var(--accent); border: 1.5px solid var(--panel); border-radius: 50%;
}.btn-row { display: flex; gap: 8px; margin-top: 14px; }.btn {
  flex: 1; padding: 10px 14px;
  background: rgba(255, 255, 255, 0.52);
  border: 1px solid var(--rule);
  color: var(--ink-2);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
  cursor: pointer;
  /* Specific properties, never `all` */
  transition: background 0.15s, color 0.15s, border-color 0.15s,
              transform 0.12s var(--ease-out);
  border-radius: 999px;
}@media (hover: hover) and (pointer: fine){
.btn:hover { background: var(--ink-2); color: var(--panel); border-color: var(--ink-2); }
}
.btn:active { transform: scale(0.97); }.btn.primary {
  background: rgba(255, 255, 255, 0.88);
  color: var(--ink-2);
  border-color: rgba(255, 255, 255, 0.5);
  font-size: 12px; letter-spacing: 0.10em; font-weight: 500;
}@media (hover: hover) and (pointer: fine){
.btn.primary:hover { background: var(--ink-2); color: rgba(255,255,255,0.9); border-color: var(--ink-2); }
}
.btn.active {
  background: var(--ink-2); color: var(--panel); border-color: var(--ink-2);
}.btn-italic {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-style: normal;
  font-weight: 300;
  text-transform: none; letter-spacing: 0; font-size: 16px;
}.seg {
  display: flex; background: transparent;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}.seg-opt {
  flex: 1; padding: 10px 6px;
  background: transparent; border: none; border-right: 1px solid var(--rule);
  color: var(--ink-dim);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 11px; letter-spacing: 0.11em; text-transform: uppercase;
  cursor: pointer;
  transition: background 0.14s, color 0.14s;
}.seg-opt:last-child          { border-right: none; }.seg-opt.active              { background: var(--ink-2); color: var(--panel); }@media (hover: hover) and (pointer: fine){
.seg-opt:hover:not(.active) { color: var(--ink); background: rgba(20,20,42,0.08); }
}
.help {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px; line-height: 1.42;
  color: var(--ink-dim);
  margin-top: 18px; padding-top: 14px;
  border-top: 1px solid var(--rule-soft);
}.help em { color: var(--accent); font-style: normal; }.help kbd {
  display: inline-block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; padding: 1px 5px;
  border: 1px solid var(--rule); border-radius: 3px;
  color: var(--ink); margin: 0 1px;
  background: rgba(255, 255, 255, 0.3);
}.nature-thumb {
  aspect-ratio: 1; overflow: hidden;
  background: var(--panel-2); border: 1px solid transparent;
  cursor: pointer; position: relative;
  transition: border-color 0.14s;
  border-radius: 2px;
}.nature-thumb.active { border-color: var(--ink-2); }.nature-thumb.active::after {
  content: ""; position: absolute; inset: 0;
  box-shadow: inset 0 0 0 2px var(--ink-2);
}.nature-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }.drop-zone {
  border: 1px dashed var(--rule); padding: 14px;
  text-align: center; color: var(--ink-dim);
  font-size: 12px; line-height: 1.45;
  cursor: pointer;
  transition: border-color 0.18s, background 0.18s, color 0.18s;
  margin-top: 10px; border-radius: 6px;
}@media (hover: hover) and (pointer: fine){
.drop-zone:hover {
    border-color: var(--accent);
    color: var(--ink);
    background: var(--accent-soft);
  }
}
.drop-zone.dragover {
  border-color: var(--accent); color: var(--ink); background: var(--accent-soft);
}.drop-zone strong { color: var(--ink-2); font-weight: 600; }.drop-zone .code {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; background: var(--panel-2); padding: 2px 5px;
  color: var(--ink-2); border-radius: 2px;
}.folder-widget {
  margin-top: 12px; padding: 12px 13px;
  border: 1px solid var(--rule-soft);
  background: rgba(255, 255, 255, 0.18);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px; line-height: 1.38; color: var(--ink-dim);
  border-radius: 6px;
}.folder-widget p { margin: 7px 0; }.folder-widget code {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; background: rgba(20,20,42,0.1);
  padding: 2px 5px; color: var(--nurr-blue); border-radius: 2px;
}.toggle-row { display: flex; gap: 8px; }@media (prefers-reduced-motion: reduce){
.btn, .icon-btn   { transition: background 0.1s, color 0.1s; }.swatch           { transition: none; }
}
.panel > input,
.panel > textarea,
.panel > select,
.panel > button:not(.icon-btn):not(.btn),
.panel-body > input:not([type="range"]):not([type="color"]):not([type="text"]):not([type="search"]),
.panel-body > textarea,
.panel-body > select,
input[type="file"],
.panel input[type="file"],
.panel-body input[type="file"] {
  display: none !important;
  position: fixed !important;
  left: -100vw !important;
  top: -100vh !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}.panel-body > .btn-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,0.18);
}.panel-body > .btn-row .btn{
  flex:0 0 auto;
  min-width:56px;
  height:32px;
  padding:7px 11px;
  font-size:12px;
  line-height:1;
  white-space:nowrap;
}.panel-body > .btn-row .btn:not(.primary){
  min-width:112px;
}.panel-body > .btn-row .btn-italic{
  font-size:13px;
  font-weight:400;
}.collection-actions .btn{
  flex:0 0 auto;
  min-width:auto;
  padding:7px 10px;
  font-size:11px;
  line-height:1;
}.panel-header::after,
.section-label::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 1px;
  background: rgba(10,5,64,.14);
  pointer-events: none;
}.section-label { position: relative; border-bottom: 0 !important; padding-bottom: 13px !important; }.section-label::after { left: 0; right: 0; bottom: 0; }.panel-body > .btn-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}.panel-body > .btn-row .btn:not(.primary) {
  grid-column: 1 / -1 !important;
  min-height: 38px !important;
}.panel-body > .btn-row .btn.primary {
  width: 100% !important;
  min-height: 34px !important;
}.swatches { align-items: center; gap: 13px !important; }.swatch-wrap {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  cursor: grab;
  flex: 0 0 auto;
}.swatch-wrap:active { cursor: grabbing; }.swatch-wrap.dragging { opacity: .55; }.swatch-wrap .swatch {
  width: 42px !important;
  height: 42px !important;
  display: block !important;
  border-radius: 50% !important;
}.swatch-remove {
  position: absolute !important;
  top: -6px !important;
  right: -6px !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: 999px !important;
  background: rgba(8,1,95,.82) !important;
  color: #fff !important;
  font-size: 11px !important;
  line-height: 14px !important;
  text-align: center !important;
  z-index: 4 !important;
  cursor: pointer !important;
  opacity: .92 !important;
}.swatch-remove:hover { opacity: 1 !important; transform: scale(1.04); }.collection-actions .btn {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}.collection-actions .btn:last-child { text-transform: none !important; }.collection-actions .btn {
  font-family: inherit !important;
  font-size: 11px !important;
  line-height: 1 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-style: normal !important;
  padding: 8px 12px !important;
}.panel-header::after,
.section-label::after {
  content: "";
  position: absolute;
  left: 22px; right: 22px; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(20, 12, 80, 0.12) 20%, rgba(20, 12, 80, 0.12) 80%, transparent);
  pointer-events: none;
}.section-label { position: relative; border-bottom: 0 !important; padding-bottom: 13px !important; }.section-label::after { left: 0; right: 0; }.panel-body > .btn-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
}.panel-body > .btn-row .btn:not(.primary) {
  grid-column: 1 / -1 !important;
  min-height: 38px !important;
}.panel-body > .btn-row .btn.primary {
  width: 100% !important; min-height: 34px !important;
}.btn {
  background: rgba(255, 255, 255, 0.52) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 1px 3px rgba(8,4,48,0.08) !important;
}.btn:hover { background: rgba(20, 12, 80, 0.82) !important; }.btn.primary {
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(255, 255, 255, 0.90) !important;
  box-shadow: 0 2px 8px rgba(8,4,48,0.10) !important;
}.icon-btn {
  background: rgba(255, 255, 255, 0.44) !important;
  border-color: rgba(255, 255, 255, 0.72) !important;
}.icon-btn:hover {
  background: rgba(20, 12, 80, 0.82) !important;
  border-color: rgba(20, 12, 80, 0.82) !important;
}@media (min-width: 821px){
.panel .section-label .name  {
    color: rgba(255, 255, 255, 0.84) !important;
    letter-spacing: 0.09em !important;
  }.panel .section-label .value {
    color: rgba(245, 244, 255, 0.54) !important;
    font-variant-numeric: tabular-nums;
  }.panel .section-label::after {
    background: linear-gradient(90deg, transparent,
      rgba(255,255,255,0.11) 22%, rgba(255,255,255,0.11) 78%, transparent) !important;
  }.panel .icon-btn {
    background: rgba(255,255,255,0.10) !important;
    border-color: rgba(255,255,255,0.20) !important;
    color: rgba(255,255,255,0.90) !important;
  }.panel .icon-btn:hover {
    background: rgba(255,255,255,0.20) !important;
    border-color: rgba(255,255,255,0.34) !important;
    color: #fff !important;
  }.panel .btn {
    background: rgba(255,255,255,0.10) !important;
    border-color: rgba(255,255,255,0.20) !important;
    color: rgba(255,255,255,0.92) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.14) !important;
  }.panel .btn:hover  { background: rgba(255,255,255,0.20) !important; color: #fff !important; }.panel .btn.active { background: rgba(255,255,255,0.22) !important; color: #fff !important; }.panel .btn.primary {
    background: rgba(255,255,255,0.88) !important;
    color: rgba(8,6,20,0.96) !important;
    border-color: rgba(255,255,255,0.94) !important;
    font-weight: 500 !important;
  }.panel .btn.primary:hover { background: #fff !important; color: #000 !important; }.panel .swatch-wrap .swatch {
    border-color: rgba(255,255,255,0.26) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.16), 0 2px 8px rgba(0,0,0,0.22) !important;
  }.panel .swatch.active  { outline: 2px solid #fff !important; outline-offset: 3px !important; }.panel .swatch.add     { background: rgba(255,255,255,0.07) !important; border: 1.5px dashed rgba(255,255,255,0.26) !important; color: rgba(255,255,255,0.52) !important; }.panel .swatch.add:hover { border-color: var(--accent) !important; color: var(--accent) !important; }.panel .seg          { border-color: rgba(255,255,255,0.11) !important; }.panel .seg-opt      { color: rgba(245,244,255,0.48) !important; border-right-color: rgba(255,255,255,0.11) !important; }.panel .seg-opt.active { background: rgba(255,255,255,0.18) !important; color: #fff !important; }.panel .seg-opt:hover:not(.active) { background: rgba(255,255,255,0.09) !important; color: rgba(255,255,255,0.82) !important; }.panel .help {
    color: rgba(245,244,255,0.54) !important;
    border-top-color: rgba(255,255,255,0.10) !important;
  }.panel .help em { color: var(--accent) !important; }.panel .help kbd {
    border-color: rgba(255,255,255,0.16) !important;
    background: rgba(255,255,255,0.08) !important;
    color: rgba(245,244,255,0.75) !important;
  }.panel .drop-zone {
    border-color: rgba(255,255,255,0.16) !important;
    color: rgba(245,244,255,0.48) !important;
  }.panel .drop-zone:hover {
    border-color: var(--accent) !important;
    background: rgba(255,45,114,0.08) !important;
    color: rgba(245,244,255,0.80) !important;
  }.panel .panel-body > .btn-row { border-top-color: rgba(255,255,255,0.10) !important; }
}
.panel-tabs {
  display: flex;
  border-bottom: 1px solid var(--rule);
  flex-shrink: 0;
}.panel-tab {
  flex: 1;
  padding: 9px 4px 8px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--ink-dim); background: transparent; border: none;
  border-bottom: 2px solid transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: color 0.14s ease, border-color 0.14s ease;
}.panel-tab:hover { color: var(--ink); }.panel-tab.active { color: var(--ink); border-bottom-color: var(--ink-2); font-weight: 700; }.create-dl-row .btn { flex: 1; }.create-secondary-row .btn { flex: 1; font-size: 11px; }.panel:not(.collapsed) .panel-header,
.panel:not(.collapsed) .panel-tabs {
  flex: 0 0 auto !important;
}.panel .panel-tab.active { color: rgba(10,8,26,0.96) !important; }.panel-header,
.panel-tabs{ flex:0 0 auto !important; }.panel:not(.collapsed) .panel-tabs{ height:36px !important; min-height:36px !important; }.panel .section-label{ margin-bottom:12px !important; }.panel .section-label .value,
.panel .panel-tab:not(.active){ color:var(--nurr-panel-ink-soft) !important; }.panel .panel-tab,
.panel .panel-tab.active{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  color:rgba(12,10,28,0.72) !important;
}.panel .panel-tab.active{
  color:rgba(12,10,28,0.94) !important;
  border-bottom:2px solid rgba(12,10,28,0.88) !important;
}.panel:not(.collapsed) .icon-btn {
  width: 29px !important;
  height: 29px !important;
  min-width: 29px !important;
  border-radius: 50% !important;
  padding: 0 !important;
  color: rgba(255,255,255,0.92) !important;
  background: rgba(255,255,255,0.15) !important;
  border: 1px solid rgba(255,255,255,0.56) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.38) !important;
}.panel:not(.collapsed) .icon-btn:hover {
  background: rgba(255,255,255,0.28) !important;
  color: #fff !important;
}.panel:not(.collapsed) .panel-tabs {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  height: 40px !important;
  border-bottom: 1px solid var(--nurr-glass-rule) !important;
  background: rgba(255,255,255,0.04) !important;
}.panel:not(.collapsed) .panel-tab {
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--nurr-ink-soft) !important;
  box-shadow: none !important;
  font: 800 10px/40px "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
}.panel:not(.collapsed) .panel-tab.active {
  color: var(--nurr-ink) !important;
  background: rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 -2px 0 rgba(20,18,34,0.86) !important;
}.panel:not(.collapsed) .btn-row,
.panel:not(.collapsed) .create-dl-row,
.panel:not(.collapsed) .create-secondary-row {
  gap: 8px !important;
  margin: 10px 0 0 !important;
}.mode-nature .nature-thumb,
.mode-nature .drop-zone {
  box-shadow: none !important;
  border-color: rgba(20,18,34,0.16) !important;
}.panel:not(.collapsed) .swatches { gap: 10px !important; }.panel:not(.collapsed) .swatch {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.52),
    inset 0 -8px 16px rgba(0,0,0,0.10) !important;
}.panel:not(.collapsed) .swatch .remove,
.panel:not(.collapsed) .swatch-remove {
  box-shadow: none !important;
}.panel:not(.collapsed) .icon-btn[disabled]{ opacity:.32 !important; }.panel:not(.collapsed) .panel-tabs{
  height:50px !important;
  min-height:50px !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  border-bottom:1px solid var(--nx-line) !important;
  background:transparent !important;
}.panel:not(.collapsed) .panel-tab{
  height:50px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--nx-ink-soft) !important;
  font:800 10px/50px var(--nx-font) !important;
  letter-spacing:.17em !important;
  text-transform:uppercase !important;
  box-shadow:inset -1px 0 0 var(--nx-line-soft) !important;
}.panel:not(.collapsed) .panel-tab:last-child{ box-shadow:none !important; }.panel:not(.collapsed) .panel-tab.active{
  color:var(--nx-ink) !important;
  box-shadow:inset 0 -1.5px 0 var(--nx-ink), inset -1px 0 0 var(--nx-line-soft) !important;
}.panel:not(.collapsed) .panel-tab .tab-count{
  height:15px !important;
  min-width:15px !important;
  margin-left:6px !important;
  border-radius:999px !important;
  background:var(--nx-milk) !important;
  color:#050505 !important;
  font:700 8px/15px var(--nx-font) !important;
  letter-spacing:0 !important;
}.panel:not(.collapsed) .section-label .name{ color:var(--nx-ink) !important; }.panel:not(.collapsed) .create-dl-row .btn,
.panel:not(.collapsed) .create-secondary-row .btn{ width:100% !important; }.panel:not(.collapsed) .swatch{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  overflow:visible !important;
}.panel:not(.collapsed) .swatch .remove,
.panel:not(.collapsed) .swatch-remove{
  width:18px !important;
  height:18px !important;
  right:-8px !important;
  top:-7px !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.96) !important;
  color:#050505 !important;
  border:0 !important;
  box-shadow:none !important;
}@media (max-height:760px){
.panel:not(.collapsed) .panel-tabs{ height:44px !important; min-height:44px !important; }.panel:not(.collapsed) .panel-tab{ height:44px !important; line-height:44px !important; }
}
.panel:not(.collapsed) .panel-tabs{
  height:38px !important;
  min-height:38px !important;
  border-bottom:1px solid var(--nx-line-soft) !important;
}.panel:not(.collapsed) .panel-tab{
  height:38px !important;
  line-height:38px !important;
  font:800 9px/38px var(--nx-font) !important;
  letter-spacing:.14em !important;
  box-shadow:inset -1px 0 0 var(--nx-line-soft) !important;
}.panel:not(.collapsed) .panel-tab.active{
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.75), inset -1px 0 0 var(--nx-line-soft) !important;
}.panel:not(.collapsed) .create-layer-row .btn{ font-size:7.5px !important; letter-spacing:.08em !important; }.panel:not(.collapsed) .swatch{
  width:44px !important;
  height:44px !important;
  min-width:44px !important;
  border:1px solid rgba(255,255,255,.52) !important;
}.panel:not(.collapsed) .swatch .remove,
.panel:not(.collapsed) .swatch-remove{
  width:15px !important;
  height:15px !important;
  right:-5px !important;
  top:-5px !important;
  background:rgba(255,255,255,.90) !important;
  font-size:10px !important;
}.panel:not(.collapsed) .nature-thumb{
  aspect-ratio:4/3 !important;
  border:1px solid var(--nx-line-soft) !important;
  border-radius:0 !important;
  background:rgba(0,0,0,.16) !important;
}.panel:not(.collapsed) .nature-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  background:rgba(0,0,0,.14) !important;
}.panel:not(.collapsed) .nature-thumb.active{ border-color:rgba(255,255,255,.50) !important; }.panel:not(.collapsed) .nature-thumb.active::after{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.30) !important; }.panel:not(.collapsed) .drop-zone,
.panel:not(.collapsed) .folder-widget{
  border:1px solid var(--nx-line-soft) !important;
  background:rgba(255,255,255,.045) !important;
  border-radius:0 !important;
  padding:12px !important;
  color:var(--nx-ink-soft) !important;
}.panel:not(.collapsed) .folder-widget p{ margin:6px 0 !important; }@media (max-height:760px){
.panel:not(.collapsed) .panel-tabs{ height:36px !important; min-height:36px !important; }.panel:not(.collapsed) .panel-tab{ height:36px !important; line-height:36px !important; }
}
.panel:not(.collapsed) .icon-btn{ width:18px !important; height:18px !important; min-width:18px !important; }.panel:not(.collapsed) .icon-btn svg{ width:15px !important; height:15px !important; }.panel:not(.collapsed) .panel-tabs{ height:38px !important; min-height:38px !important; border-bottom:1px solid var(--nx-line-soft) !important; }.panel:not(.collapsed) .panel-tab{ height:38px !important; font:800 8px/38px var(--nx-font) !important; letter-spacing:.16em !important; box-shadow:inset -1px 0 0 var(--nx-line-faint) !important; }.panel:not(.collapsed) .panel-tab.active{ box-shadow:inset 0 -1px 0 currentColor, inset -1px 0 0 var(--nx-line-faint) !important; }.panel.tone-light:not(.collapsed) .panel-title-nymph,
.panel.tone-light:not(.collapsed) .section-label .name,
.panel.tone-light:not(.collapsed) .section-label .value,
.panel.tone-light:not(.collapsed) .panel-tab,
.panel.tone-light:not(.collapsed) .icon-btn{ color:var(--nx-ink) !important; }.panel:not(.collapsed) .swatch{
  width:38px !important; height:38px !important; min-width:38px !important;
  border:1px solid rgba(255,255,255,.36) !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.04), inset 0 0 0 1px rgba(255,255,255,.13) !important;
}.panel:not(.collapsed) .swatch .remove,
.panel:not(.collapsed) .swatch-remove{ width:13px !important; height:13px !important; top:-4px !important; right:-4px !important; font-size:9px !important; }.panel:not(.collapsed) .create-layer-row .btn{ font-size:7px !important; letter-spacing:.06em !important; }.panel:not(.collapsed) .nature-thumb{ aspect-ratio:1/1 !important; background:rgba(255,255,255,.04) !important; overflow:hidden !important; }.panel:not(.collapsed) .nature-thumb img{ object-fit:cover !important; width:100% !important; height:100% !important; }.panel:not(.collapsed) .create-dl-row .btn{ font-size:7.2px !important; letter-spacing:.08em !important; padding:0 5px !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }.panel:not(.collapsed) .create-layer-row .btn{ font-size:6.8px !important; letter-spacing:.04em !important; }.panel:not(.collapsed) .panel-title-nymph,
.panel:not(.collapsed) .section-label,
.panel:not(.collapsed) .btn,
.panel:not(.collapsed) .seg-opt,
.panel:not(.collapsed) .panel-tab{
  transition: color 260ms ease, background-color 260ms ease, border-color 260ms ease, opacity 260ms ease !important;
}.panel:not(.collapsed) .swatch-wrap{
  width:38px !important;
  height:38px !important;
  flex:0 0 38px !important;
  position:relative !important;
  display:block !important;
  overflow:visible !important;
}.panel:not(.collapsed) .swatch,
.panel:not(.collapsed) button.swatch,
.panel:not(.collapsed) .swatch.remove-target,
.panel:not(.collapsed) .swatch.add{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  border-radius:50% !important;
  padding:0 !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:38px !important;
  font-size:24px !important;
  box-sizing:border-box !important;
  vertical-align:top !important;
  position:relative !important;
  inset:auto !important;
}.panel:not(.collapsed) .swatch.add{
  color:var(--nx-ink-soft) !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid var(--nx-line-soft) !important;
  transform:none !important;
}.panel:not(.collapsed) .swatch-remove{
  position:absolute !important;
  top:-8px !important;
  right:-8px !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  border-radius:50% !important;
  padding:0 !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font:800 12px/18px var(--nx-font) !important;
  letter-spacing:0 !important;
  text-align:center !important;
  background:rgba(255,255,255,.94) !important;
  color:rgba(0,0,0,.78) !important;
  border:0 !important;
  box-shadow:0 1px 4px rgba(0,0,0,.18) !important;
  transform:none !important;
}.panel:not(.collapsed) .swatch.add{ font-size:22px !important; line-height:38px !important; }.panel:not(.collapsed) .swatch-remove{ line-height:18px !important; border-radius:50% !important; }.panel .swatches{ display:flex !important; align-items:center !important; gap:11px !important; flex-wrap:nowrap !important; }.panel .swatch-wrap{ position:relative !important; width:38px !important; height:38px !important; flex:0 0 38px !important; }.panel .swatch,
.panel .swatch.add{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  flex:0 0 38px !important;
  border-radius:50% !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
}.panel .swatch.add{ font:300 22px/38px var(--nx-font, "Helvetica Neue", Helvetica, Arial, sans-serif) !important; }.panel .swatch-remove{
  position:absolute !important;
  top:-7px !important;
  right:-7px !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  font:800 12px/18px var(--nx-font, "Helvetica Neue", Helvetica, Arial, sans-serif) !important;
  text-align:center !important;
}