/* Aurora NOVA Builder — dark pro editor (loads last, overrides light shell bleed) */

body.nova-app {
 background: #05070f !important;
 color: #e8edf9 !important;
}

body.nova-app::before {
 background:
  radial-gradient(760px 520px at 8% 4%, rgba(15, 211, 182, 0.13), transparent 62%),
  radial-gradient(760px 560px at 94% 96%, rgba(245, 196, 82, 0.1), transparent 62%) !important;
}

body.nova-app.aurora-has-shell {
 background: #05070f !important;
}

body.nova-app .nova-shell {
 gap: 0.5rem;
 padding: 0.5rem;
 width: 100%;
 max-width: 100%;
 height: calc(100dvh - var(--aurora-shell-h, 42px));
 box-sizing: border-box;
 min-height: 0;
}

body.nova-app .nova-shell > .flex.min-h-0 {
 min-height: 0;
 flex: 1;
}

/* Header icon buttons */
.nova-header-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 2.125rem;
 height: 2.125rem;
 padding: 0;
 border: 1px solid rgba(255, 255, 255, 0.1);
 border-radius: 0.5rem;
 background: rgba(255, 255, 255, 0.03);
 color: #93a1c4;
 cursor: pointer;
 transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.nova-header-btn svg {
 width: 1rem;
 height: 1rem;
 pointer-events: none;
}

.nova-header-btn:hover {
 background: rgba(255, 255, 255, 0.08);
 color: #e8edf9;
 border-color: rgba(53, 226, 200, 0.35);
}

.nova-header-btn.is-ok {
 color: #7ff3e4;
 border-color: rgba(53, 226, 200, 0.45);
 background: rgba(53, 226, 200, 0.12);
}

.nova-header-meta {
 display: inline-flex;
 align-items: center;
 padding: 0.35rem 0.6rem;
 border-radius: 0.5rem;
 border: 1px solid rgba(255, 255, 255, 0.08);
 background: rgba(255, 255, 255, 0.04);
 font-size: 11px;
 font-weight: 600;
 color: #93a1c4;
}

.nova-export-btn {
 display: inline-flex;
 align-items: center;
 gap: 0.35rem;
}

.nova-export-btn svg {
 pointer-events: none;
}

/* Slide strip controls */
#slideStrip {
 display: flex;
 align-items: center;
 gap: 0.35rem;
 flex-wrap: nowrap;
}

.nova-slide-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 0.25rem;
 min-width: 2rem;
 height: 2rem;
 padding: 0 0.55rem;
 border: 1px solid rgba(255, 255, 255, 0.1);
 border-radius: 0.5rem;
 background: rgba(255, 255, 255, 0.03);
 color: #93a1c4;
 font-size: 10px;
 font-weight: 600;
 cursor: pointer;
}

.nova-slide-btn svg {
 width: 0.85rem;
 height: 0.85rem;
}

.nova-slide-btn:hover {
 border-color: rgba(53, 226, 200, 0.35);
 color: #7ff3e4;
 background: rgba(53, 226, 200, 0.08);
}

.nova-slide-btn-danger:hover {
 border-color: rgba(244, 63, 94, 0.35);
 color: #fda4af;
 background: rgba(244, 63, 94, 0.1);
}

/* Cloud version rows */
.nova-version-row {
 display: flex;
 align-items: center;
 gap: 0.35rem;
 padding: 0.45rem 0.55rem;
 border-radius: 0.55rem;
 border: 1px solid rgba(255, 255, 255, 0.08);
 background: rgba(255, 255, 255, 0.02);
 font-size: 11px;
}

.nova-version-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 1.75rem;
 height: 1.75rem;
 padding: 0;
 border: none;
 border-radius: 0.4rem;
 background: transparent;
 color: #93a1c4;
 cursor: pointer;
}

.nova-version-btn svg {
 width: 0.85rem;
 height: 0.85rem;
}

.nova-version-btn:hover {
 background: rgba(255, 255, 255, 0.08);
 color: #e8edf9;
}

.nova-version-btn.danger:hover {
 color: #fda4af;
 background: rgba(244, 63, 94, 0.1);
}

/* Tenant / lang popovers on dark builder */
body.nova-app .aurora-tenant-menu,
body.nova-app .aurora-lang-dropdown,
body.nova-app .aurora-lang-menu {
 background: rgba(13, 19, 36, 0.98) !important;
 border-color: rgba(255, 255, 255, 0.1) !important;
 color: #e8edf9 !important;
 box-shadow: 0 16px 40px -16px rgba(0, 0, 0, 0.85) !important;
}

body.nova-app .aurora-tenant-trigger,
body.nova-app .aurora-lang-trigger {
 border-color: rgba(255, 255, 255, 0.1) !important;
 background: rgba(255, 255, 255, 0.04) !important;
 color: #93a1c4 !important;
}

/* Toolhub dock on builder */
body.nova-app .aurora-dock-expanded {
 background: rgba(5, 7, 15, 0.96) !important;
 border-color: rgba(255, 255, 255, 0.12) !important;
}

body.nova-app .aurora-dock-chip:hover {
 border-color: rgba(53, 226, 200, 0.45) !important;
 background: rgba(53, 226, 200, 0.1) !important;
}

body.nova-app .glass {
 background: rgba(13, 19, 36, 0.78) !important;
 backdrop-filter: blur(22px) saturate(160%) !important;
 border: 1px solid rgba(255, 255, 255, 0.08) !important;
 box-shadow: 0 16px 40px -24px rgba(0, 0, 0, 0.85) !important;
 color: #e8edf9 !important;
}

body.nova-app .glass-soft {
 background: rgba(19, 27, 50, 0.62) !important;
 backdrop-filter: blur(14px) !important;
 border: 1px solid rgba(255, 255, 255, 0.07) !important;
}

body.nova-app .fld {
 border: 1px solid rgba(255, 255, 255, 0.1) !important;
 background: rgba(8, 12, 24, 0.72) !important;
 color: #e8edf9 !important;
}

body.nova-app .fld:focus {
 border-color: rgba(53, 226, 200, 0.65) !important;
 box-shadow: 0 0 0 3px rgba(15, 211, 182, 0.12) !important;
}

body.nova-app .text-mist-300 { color: #93a1c4 !important; }
body.nova-app .text-mist-400 { color: #6b7aa1 !important; }
body.nova-app .text-mist-200 { color: #c3cde6 !important; }
body.nova-app .text-volt-300 { color: #7ff3e4 !important; }

body.nova-app #canvasWrap {
 background:
  radial-gradient(ellipse at 50% 0%, rgba(15, 211, 182, 0.06), transparent 55%),
  #080c18 !important;
 border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body.nova-app #deviceViewport {
 background: transparent !important;
}

body.nova-app #deviceFrame.is-sim {
 background: #080c18 !important;
 border-color: rgba(255, 255, 255, 0.12) !important;
}

body.nova-app .block.sel {
 border-color: rgba(53, 226, 200, 0.85) !important;
 box-shadow: 0 0 0 1px rgba(53, 226, 200, 0.35), 0 0 46px -14px rgba(15, 211, 182, 0.8) !important;
}

body.nova-app .tab-btn.active,
body.nova-app .dev-btn.active,
body.nova-app .slide-tab.active {
 background: rgba(53, 226, 200, 0.14) !important;
 color: #7ff3e4 !important;
 border-color: rgba(53, 226, 200, 0.38) !important;
}

#libPanel,
#inspPanel {
 width: 17.5rem;
}

#inspPanel {
 width: 20rem;
}

#leftTabs,
#rightTabs {
 display: flex;
 flex-wrap: nowrap;
 gap: 0.25rem;
 overflow-x: auto;
 padding-bottom: 0.15rem;
 scrollbar-width: none;
}

#leftTabs::-webkit-scrollbar,
#rightTabs::-webkit-scrollbar {
 display: none;
}

#leftTabs .tab-btn,
#rightTabs .tab-btn {
 flex: 0 0 auto;
 padding: 0.4rem 0.55rem;
 font-size: 9px;
 letter-spacing: 0.12em;
 border-radius: 0.45rem;
 color: #93a1c4;
 background: rgba(255, 255, 255, 0.03);
 border: 1px solid rgba(255, 255, 255, 0.08);
}

#leftTabs .tab-btn.active,
#rightTabs .tab-btn.active {
 color: #7ff3e4;
 background: rgba(53, 226, 200, 0.14);
 border-color: rgba(53, 226, 200, 0.38);
 box-shadow: inset 0 0 0 1px rgba(53, 226, 200, 0.12);
}

#canvas {
 padding-top: 1.25rem;
}

.block {
 overflow: visible;
}
.block .nova-block-tools {
 position: absolute;
 left: 50%;
 top: -0.15rem;
 right: auto;
 z-index: 30;
 display: flex;
 align-items: center;
 gap: 2px;
 padding: 4px;
 border-radius: 0.6rem;
 border: 1px solid rgba(255, 255, 255, 0.14);
 background: rgba(5, 7, 15, 0.96);
 backdrop-filter: blur(18px) saturate(150%);
 box-shadow:
  0 10px 28px -8px rgba(0, 0, 0, 0.9),
  0 0 0 1px rgba(53, 226, 200, 0.08),
  inset 0 1px 0 rgba(255, 255, 255, 0.07);
 opacity: 0;
 transform: translate(-50%, -6px);
 transition: opacity 0.18s ease, transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
 pointer-events: none;
}

.block:hover .nova-block-tools,
.block.sel .nova-block-tools {
 opacity: 1;
 transform: translate(-50%, -100%);
 pointer-events: auto;
}

.nova-tool-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 2.125rem;
 height: 2.125rem;
 padding: 0;
 border: none;
 border-radius: 0.42rem;
 background: transparent;
 color: #93a1c4;
 cursor: pointer;
 transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease;
}

.nova-tool-btn svg {
 width: 1rem;
 height: 1rem;
 pointer-events: none;
}

.nova-tool-btn:hover {
 background: rgba(255, 255, 255, 0.09);
 color: #e8edf9;
}

.nova-tool-btn:active {
 transform: scale(0.94);
}

.nova-tool-btn.nova-tool-dup:hover {
 color: #7ff3e4;
 background: rgba(53, 226, 200, 0.14);
}

.nova-tool-btn.nova-tool-del:hover {
 color: #fda4af;
 background: rgba(244, 63, 94, 0.14);
}

.nova-tool-btn.handle {
 cursor: grab;
}

.nova-tool-btn.handle:active {
 cursor: grabbing;
}

.nova-tool-sep {
 width: 1px;
 height: 1.35rem;
 margin: 0 2px;
 background: rgba(255, 255, 255, 0.12);
 flex-shrink: 0;
}

/* Properties panel */
.nova-inspector-empty {
 display: grid;
 place-items: center;
 min-height: 14rem;
 padding: 1.5rem 1rem;
 text-align: center;
}

.nova-inspector-empty-icon {
 display: grid;
 place-items: center;
 width: 3.25rem;
 height: 3.25rem;
 margin: 0 auto 0.75rem;
 border-radius: 0.75rem;
 border: 1px solid rgba(255, 255, 255, 0.1);
 background: rgba(255, 255, 255, 0.04);
 color: #6b7aa1;
}

.nova-inspector-empty-icon svg {
 width: 1.25rem;
 height: 1.25rem;
}

.nova-prop-head {
 display: flex;
 align-items: flex-start;
 gap: 0.65rem;
 padding: 0.75rem 0.85rem;
 border-radius: 0.65rem;
 border: 1px solid rgba(255, 255, 255, 0.08);
 background: linear-gradient(135deg, rgba(53, 226, 200, 0.08), rgba(255, 255, 255, 0.02));
}

.nova-prop-head-icon {
 display: grid;
 place-items: center;
 width: 2.25rem;
 height: 2.25rem;
 flex-shrink: 0;
 border-radius: 0.55rem;
 background: rgba(53, 226, 200, 0.12);
 color: #7ff3e4;
}

.nova-prop-head-icon svg {
 width: 1rem;
 height: 1rem;
}

.nova-prop-head-meta {
 min-width: 0;
}

.nova-prop-head-title {
 font-size: 12.5px;
 font-weight: 700;
 color: #e8edf9;
 line-height: 1.25;
}

.nova-prop-head-id {
 margin-top: 0.15rem;
 font-size: 10px;
 color: #6b7aa1;
 font-family: ui-monospace, monospace;
}

.nova-prop-group {
 margin-bottom: 0.85rem;
}

.nova-prop-group-title {
 margin-bottom: 0.45rem;
 padding-left: 0.15rem;
 font-size: 9px;
 font-weight: 700;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: #6b7aa1;
}

.nova-prop-group-body {
 display: flex;
 flex-direction: column;
 gap: 0.65rem;
 padding: 0.65rem;
 border-radius: 0.65rem;
 border: 1px solid rgba(255, 255, 255, 0.06);
 background: rgba(255, 255, 255, 0.02);
}

.nova-field label,
.nova-field-label {
 display: block;
 margin-bottom: 0.3rem;
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.04em;
 color: #93a1c4;
 text-transform: none;
}

.nova-field .fld,
#rightPanel .fld {
 width: 100%;
 border-radius: 0.5rem;
 border: 1px solid rgba(255, 255, 255, 0.1);
 background: rgba(8, 12, 24, 0.65);
 padding: 0.5rem 0.65rem;
 font-size: 12px;
 color: #e8edf9;
 transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.nova-field .fld:hover,
#rightPanel .fld:hover {
 border-color: rgba(255, 255, 255, 0.16);
}

.nova-field .fld:focus,
#rightPanel .fld:focus {
 outline: none;
 border-color: rgba(53, 226, 200, 0.65);
 box-shadow: 0 0 0 3px rgba(15, 211, 182, 0.12);
 background: rgba(8, 12, 24, 0.85);
}

.nova-field-nested {
 padding: 0.55rem;
 border-radius: 0.5rem;
 border: 1px dashed rgba(255, 255, 255, 0.08);
 background: rgba(255, 255, 255, 0.02);
}

.nova-prop-actions {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 0.45rem;
 margin-top: 0.25rem;
}

.nova-prop-actions .nova-action-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 0.35rem;
 padding: 0.55rem 0.75rem;
 border-radius: 0.55rem;
 border: 1px solid rgba(255, 255, 255, 0.1);
 font-size: 11px;
 font-weight: 600;
 cursor: pointer;
 transition: all 0.15s ease;
}

.nova-action-btn svg {
 width: 0.9rem;
 height: 0.9rem;
}

.nova-action-btn-dup {
 color: #7ff3e4;
 background: rgba(53, 226, 200, 0.06);
}

.nova-action-btn-dup:hover {
 border-color: rgba(53, 226, 200, 0.35);
 background: rgba(53, 226, 200, 0.12);
}

.nova-action-btn-del {
 color: #fda4af;
 background: rgba(244, 63, 94, 0.06);
}

.nova-action-btn-del:hover {
 border-color: rgba(244, 63, 94, 0.35);
 background: rgba(244, 63, 94, 0.12);
}

/* Layer list */
.nova-layer-row {
 display: flex;
 align-items: center;
 gap: 0.35rem;
 padding: 0.45rem 0.5rem;
 border-radius: 0.55rem;
 border: 1px solid rgba(255, 255, 255, 0.07);
 background: rgba(255, 255, 255, 0.02);
 transition: border-color 0.15s ease, background 0.15s ease;
}

.nova-layer-row.active {
 border-color: rgba(53, 226, 200, 0.38);
 background: rgba(53, 226, 200, 0.08);
}

.nova-layer-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 1.65rem;
 height: 1.65rem;
 padding: 0;
 border: none;
 border-radius: 0.38rem;
 background: transparent;
 color: #93a1c4;
 cursor: pointer;
 transition: background 0.12s ease, color 0.12s ease;
}

.nova-layer-btn svg {
 width: 0.8rem;
 height: 0.8rem;
}

.nova-layer-btn:hover {
 background: rgba(255, 255, 255, 0.08);
 color: #e8edf9;
}

.nova-layer-btn.on {
 color: #7ff3e4;
}

.nova-layer-btn.dup:hover {
 color: #7ff3e4;
}

.nova-layer-btn.del:hover {
 color: #fda4af;
}

/* Element library cards */
.wcard {
 border: 1px solid rgba(255, 255, 255, 0.07);
 border-radius: 0.65rem !important;
}

.wcard:hover {
 border-color: rgba(53, 226, 200, 0.45);
}

@media (max-width: 1024px) {
 #libPanel,
 #inspPanel {
  width: 14rem;
 }
}

@media (max-width: 768px) {
 #inspPanel {
  width: min(18rem, 88vw);
 }
}