:root{color-scheme:dark;--bg:#050a12;--panel:#081321;--panel2:#0a1828;--line:rgba(91,190,255,.16);--line2:rgba(140,92,255,.23);--text:#e9f7ff;--muted:#7890a3;--cyan:#52d9ff;--violet:#a36bff;--danger:#ff6588;--green:#64ffc0;--shadow:0 18px 48px rgba(0,0,0,.38)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--text)}button,input{font:inherit}.app-shell{height:100%;display:grid;grid-template-rows:58px minmax(0,1fr) 28px;background:radial-gradient(circle at 48% 25%,rgba(32,106,157,.08),transparent 35%),#050a12}.topbar{position:relative;z-index:20;display:grid;grid-template-columns:270px 1fr 180px;align-items:center;padding:0 14px;border-bottom:1px solid var(--line);background:rgba(5,13,23,.96);box-shadow:0 10px 30px rgba(0,0,0,.2)}.brand{display:flex;align-items:center;gap:10px}.home-btn{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;border:1px solid rgba(82,217,255,.28);background:rgba(82,217,255,.06);color:var(--cyan);text-decoration:none;font-size:19px}.brand strong{display:block;font-size:16px;letter-spacing:.03em}.brand strong span{color:var(--cyan)}.brand small{display:block;margin-top:2px;color:var(--muted);font-size:10px;letter-spacing:.04em}.toolbar{justify-self:center;display:flex;gap:8px}.tool-group{display:flex;gap:4px;padding:3px;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018)}.tool-btn{height:32px;display:flex;align-items:center;gap:5px;padding:0 9px;border:1px solid transparent;border-radius:7px;background:transparent;color:#94a8b8;font-size:12px;cursor:pointer;transition:.18s}.tool-btn:hover{color:#fff;background:rgba(82,217,255,.065)}.tool-btn.active{color:var(--cyan);border-color:rgba(82,217,255,.27);background:rgba(82,217,255,.09)}.tool-btn.danger:hover{color:#ff91aa;background:rgba(255,101,136,.08)}.file-btn{position:relative;cursor:pointer}.file-btn input{position:absolute;width:1px;height:1px;opacity:0}.version-pill{justify-self:end;padding:6px 9px;border-radius:999px;border:1px solid rgba(163,107,255,.23);background:rgba(163,107,255,.065);color:#bfa2ff;font-size:10px;letter-spacing:.08em}.workspace{min-height:0;display:grid;grid-template-columns:228px minmax(320px,1fr) 266px}.panel{min-height:0;background:linear-gradient(180deg,rgba(8,19,33,.97),rgba(6,14,25,.98));overflow:auto;scrollbar-width:thin;scrollbar-color:#17415a transparent}.left-panel{border-right:1px solid var(--line)}.right-panel{border-left:1px solid var(--line)}.panel-section{padding:13px 12px;border-bottom:1px solid rgba(105,185,235,.1)}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;color:#9fc8df;font-size:10px;letter-spacing:.13em}.section-title small{color:#536e82;font-size:9px;letter-spacing:.04em;text-transform:none}.primitive-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.primitive-grid button{height:67px;border:1px solid rgba(83,179,237,.13);border-radius:10px;background:linear-gradient(180deg,rgba(21,49,70,.33),rgba(6,18,31,.5));color:#9ab5c6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;font-size:10px;transition:.2s}.primitive-grid button:hover{border-color:rgba(82,217,255,.4);color:#eafaff;box-shadow:inset 0 0 18px rgba(82,217,255,.05)}.primitive-icon{display:block;width:22px;height:22px;border:1.5px solid #59d9ff;filter:drop-shadow(0 0 5px rgba(82,217,255,.28));opacity:.85}.cube-icon{transform:rotate(30deg) skew(-6deg,-6deg)}.plane-icon{height:14px;transform:skew(-25deg)}.sphere-icon{border-radius:50%;box-shadow:inset 5px 0 0 rgba(163,107,255,.15)}.cylinder-icon{border-radius:50%/22%;height:24px}.torus-icon{border-radius:50%;box-shadow:inset 0 0 0 5px #081521}.object-tree{display:flex;flex-direction:column;gap:3px}.tree-item{display:grid;grid-template-columns:24px 1fr 24px;align-items:center;min-height:32px;border:1px solid transparent;border-radius:7px;padding:2px 4px;color:#8ca6b8;font-size:11px;cursor:pointer}.tree-item:hover{background:rgba(255,255,255,.025)}.tree-item.selected{border-color:rgba(82,217,255,.24);background:rgba(82,217,255,.07);color:#e9fbff}.tree-type{color:#5bdfff;text-align:center;font-size:12px}.tree-visible{border:0;background:none;color:#607c90;cursor:pointer}.tree-visible.on{color:#91eaff}.empty-state{padding:16px 6px;color:#52697a;font-size:10px;text-align:center;line-height:1.5}.mini-btn{border:0;background:none;color:#58788d;font-size:9px;cursor:pointer}.mini-btn:hover{color:var(--cyan)}.shortcut-list{display:grid;grid-template-columns:1fr 1fr;gap:6px;color:#5f788a;font-size:9px}.shortcut-list span{display:flex;align-items:center;gap:5px}.shortcut-list kbd{min-width:23px;padding:3px 4px;border-radius:4px;border:1px solid rgba(255,255,255,.08);background:#07101a;color:#91b3c7;text-align:center;font-size:8px}.viewport-wrap{position:relative;min-width:0;min-height:0;background:#02060b;overflow:hidden}.viewport{position:absolute;inset:0;outline:none}.viewport canvas{display:block;width:100%;height:100%}.viewport-overlay{position:absolute;z-index:4;display:flex;gap:6px;pointer-events:none}.top-left{top:10px;left:10px}.bottom-left{left:11px;bottom:10px}.view-chip{padding:5px 7px;border:1px solid rgba(82,217,255,.17);border-radius:5px;background:rgba(4,12,21,.7);backdrop-filter:blur(7px);color:#8bdff6;font-size:9px;letter-spacing:.09em}.view-chip.muted{color:#708898;border-color:rgba(255,255,255,.07)}.hint{color:#526c7f;font-size:9px;background:rgba(3,9,16,.62);padding:5px 7px;border-radius:5px}.axis-legend{position:absolute;right:12px;bottom:10px;display:flex;gap:5px;font-size:10px;font-weight:700}.axis-legend span{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);background:rgba(5,12,20,.72)}.axis-legend .x{color:#ff657d}.axis-legend .y{color:#6bffad}.axis-legend .z{color:#62a5ff}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.field>span{font-size:10px;color:#698296}.field input[type=text],.field input[type=number]{height:29px;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:#07101b;color:#cfe8f5;padding:0 8px;outline:none;font-size:11px}.field input:focus,.vector-row input:focus{border-color:rgba(82,217,255,.45);box-shadow:0 0 0 2px rgba(82,217,255,.06)}.field input:disabled,.vector-row input:disabled{opacity:.38}.transform-block{display:flex;flex-direction:column;gap:4px}.vector-row{display:grid;grid-template-columns:58px repeat(3,1fr);gap:5px;align-items:center}.vector-row label{font-size:9px;color:#71899b}.vector-row input{min-width:0;height:28px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07101b;color:#d0e8f5;text-align:center;font-size:10px;outline:none}.axis-labels{display:grid;grid-template-columns:58px repeat(3,1fr);gap:5px;margin:-2px 0 4px}.axis-labels span{grid-column:auto;text-align:center;color:#40596b;font-size:8px}.axis-labels span:first-child{grid-column:2}.material-grid{display:grid}.field input[type=color]{width:100%;height:31px;padding:3px;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:#07101b}.range-line{display:grid;grid-template-columns:1fr 38px;gap:7px;align-items:center}.range-line input{accent-color:#58d8ff}.range-line output{font-size:9px;text-align:right;color:#7594a7}.switch-row{position:relative;display:flex;justify-content:space-between;align-items:center;min-height:29px;color:#6f8798;font-size:10px;cursor:pointer}.switch-row input{position:absolute;opacity:0}.switch-row i{width:31px;height:17px;border-radius:999px;background:#101d27;border:1px solid rgba(255,255,255,.07);position:relative;transition:.2s}.switch-row i:after{content:"";position:absolute;width:11px;height:11px;left:2px;top:2px;border-radius:50%;background:#526979;transition:.2s}.switch-row input:checked+i{background:rgba(82,217,255,.14);border-color:rgba(82,217,255,.28)}.switch-row input:checked+i:after{left:15px;background:#64ddff;box-shadow:0 0 7px rgba(82,217,255,.45)}.wide-btn{width:100%;height:31px;margin-top:8px;border:1px solid rgba(82,217,255,.16);border-radius:7px;background:rgba(82,217,255,.04);color:#7da9be;font-size:10px;cursor:pointer}.wide-btn:hover{color:#dff8ff;border-color:rgba(82,217,255,.34)}.legacy-link{display:block;margin-top:10px;color:#695f8c;text-align:center;text-decoration:none;font-size:9px}.legacy-link:hover{color:#b799ff}.statusbar{display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-top:1px solid var(--line);background:#050c15;color:#516b7d;font-size:9px}.status-dot{display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:var(--green);box-shadow:0 0 7px rgba(100,255,192,.5)}.json-dialog{width:min(760px,calc(100vw - 30px));padding:0;border:1px solid rgba(82,217,255,.24);border-radius:13px;background:#07111d;color:var(--text);box-shadow:0 30px 90px #000}.json-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}.dialog-card{padding:0}.dialog-card header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line)}.dialog-card header strong{display:block;font-size:13px}.dialog-card header small{display:block;margin-top:2px;color:#617b8d;font-size:9px}.icon-close{border:0;background:none;color:#6d8899;font-size:21px;cursor:pointer}.json-dialog textarea{display:block;width:calc(100% - 24px);height:390px;margin:12px;padding:11px;border:1px solid rgba(82,217,255,.12);border-radius:8px;background:#030811;color:#8fcde7;font:10px/1.5 Consolas,monospace;resize:vertical;outline:none}.dialog-actions{display:flex;justify-content:flex-end;gap:7px;padding:0 12px 12px}.dialog-actions button{padding:8px 10px;border-radius:6px;border:1px solid rgba(82,217,255,.15);background:#0b1b2b;color:#87aabd;font-size:10px;cursor:pointer}
@media(max-width:980px){.topbar{grid-template-columns:220px 1fr}.version-pill{display:none}.toolbar{justify-self:end}.tool-btn span{display:none}.workspace{grid-template-columns:190px minmax(280px,1fr) 230px}.primitive-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){html,body{overflow:auto}.app-shell{height:auto;min-height:100vh;grid-template-rows:auto auto 28px}.topbar{position:sticky;top:0;grid-template-columns:1fr auto;min-height:58px}.brand small{display:none}.toolbar{padding:6px 0;flex-wrap:wrap;justify-content:flex-end}.workspace{display:grid;grid-template-columns:1fr;grid-template-rows:58vh auto auto}.viewport-wrap{grid-row:1}.left-panel{grid-row:2;border-right:0}.right-panel{grid-row:3;border-left:0}.primitive-grid{grid-template-columns:repeat(5,1fr)}.primitive-grid button{height:58px}.help-section{display:none}}

/* DjCreator2 v0.2 */
.create-section{padding-top:10px;padding-bottom:10px}.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:61px;overflow-y:auto;overflow-x:hidden;padding-right:3px;scrollbar-width:thin;scrollbar-color:#17415a transparent}.primitive-grid button{height:61px;min-width:0;gap:5px;padding-top:0;padding-bottom:0}.primitive-icon{position:relative;box-sizing:border-box}.cube-icon{width:18px;height:18px;transform:none;border:1.5px solid #59d9ff}.cube-icon:before{content:"";position:absolute;width:13px;height:13px;left:5px;top:-6px;border:1.5px solid #59d9ff;background:#0b1b29}.cube-icon:after{content:"";position:absolute;left:2px;top:-2px;width:13px;height:13px;border-top:1.5px solid #59d9ff;border-right:1.5px solid #59d9ff;transform:skewY(-38deg) rotate(-1deg);transform-origin:left bottom}.sphere-icon{border-radius:50%;box-shadow:none}.sphere-icon:before{content:"";position:absolute;inset:3px 7px;border-left:1px solid rgba(89,217,255,.9);border-right:1px solid rgba(89,217,255,.9);border-radius:50%}.sphere-icon:after{content:"";position:absolute;left:2px;right:2px;top:9px;height:5px;border-top:1px solid rgba(89,217,255,.9);border-bottom:1px solid rgba(89,217,255,.65);border-radius:50%}.cylinder-icon{height:24px;border-radius:0;border-left:1.5px solid #59d9ff;border-right:1.5px solid #59d9ff;border-top:0;border-bottom:0}.cylinder-icon:before,.cylinder-icon:after{content:"";position:absolute;left:-1.5px;width:22px;height:7px;border:1.5px solid #59d9ff;border-radius:50%}.cylinder-icon:before{top:-2px;background:#0b1b29}.cylinder-icon:after{bottom:-2px}.torus-icon{border-radius:50%;box-shadow:none}.torus-icon:after{content:"";position:absolute;inset:5px;border:1.5px solid #59d9ff;border-radius:50%;background:#081521}.hierarchy-section .object-tree{max-height:172px;overflow-y:auto;padding-right:2px;scrollbar-width:thin;scrollbar-color:#17415a transparent}.tree-item{grid-template-columns:24px 1fr 24px 24px}.tree-delete{border:0;background:none;color:#6e5560;cursor:pointer;font-size:14px;line-height:1}.tree-delete:hover{color:#ff7695}.history-head{margin-top:13px;padding-top:10px;border-top:1px solid rgba(105,185,235,.08);color:#7597aa;font-size:9px;letter-spacing:.11em}.history-list{list-style:none;margin:7px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;counter-reset:item}.history-list li{min-height:21px;display:flex;align-items:center;gap:5px;padding:3px 5px;border-radius:5px;background:rgba(255,255,255,.018);color:#638092;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-list li:not(.history-empty):before{counter-increment:item;content:counter(item);display:grid;place-items:center;flex:0 0 16px;height:16px;border-radius:50%;border:1px solid rgba(82,217,255,.13);color:#7399ae;font-size:8px}.history-empty{color:#425d6e!important;font-style:italic}.history-shortcut-note{margin-top:7px;grid-template-columns:1fr}.history-shortcut-note span{color:#7894a6}.right-panel .field>span{font-size:12px}.right-panel .vector-row label{font-size:11px}.right-panel .axis-labels span{font-size:10px}.right-panel .switch-row{font-size:12px}.right-panel .range-line output{font-size:11px}.geometry-fields{display:grid;grid-template-columns:1fr 1fr;gap:7px}.geometry-field{display:flex;flex-direction:column;gap:4px;min-width:0}.geometry-field span{font-size:11px;color:#71899b}.geometry-field input[type=number]{width:100%;height:29px;min-width:0;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:#07101b;color:#d0e8f5;padding:0 7px;outline:none;font-size:11px}.geometry-field input:focus{border-color:rgba(82,217,255,.45);box-shadow:0 0 0 2px rgba(82,217,255,.06)}.geometry-checkbox{grid-column:1/-1}.geometry-empty{grid-column:1/-1;color:#536e82;font-size:10px;line-height:1.5}.geometry-preset{margin-top:10px;color:#a9dff0}.geometry-preset:not([hidden]){display:block}
@media(max-width:980px){.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:61px}.primitive-grid button{height:61px}.help-section{display:block}}
.primitive-svg{width:25px;height:25px;fill:none;stroke:#59d9ff;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(82,217,255,.28));opacity:.9;flex:0 0 auto}
.tool-btn:disabled{opacity:.32;cursor:default}.tool-btn:disabled:hover{color:#94a8b8;background:transparent}

/* DjCreator2 v0.3 · compactación y paneles plegables */
.panel-section{padding:9px 12px 7px}.section-title{gap:5px;margin-bottom:7px}.section-title>span:first-child{margin-right:auto}.section-body{min-width:0}.panel-section.collapsed{padding-bottom:5px}.panel-section.collapsed>.section-title{margin-bottom:0}.panel-section.collapsed>.section-body{display:none}.collapse-btn{flex:0 0 20px;width:20px;height:20px;padding:0;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:rgba(82,217,255,.025);color:#66869a;display:grid;place-items:center;font-size:14px;line-height:1;cursor:pointer}.collapse-btn:hover{color:#d9f7ff;border-color:rgba(82,217,255,.3);background:rgba(82,217,255,.06)}
.create-section{padding-top:7px;padding-bottom:6px}.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:55px;max-height:117px;gap:7px;overflow-y:auto;overflow-x:hidden;padding-right:3px}.primitive-grid button{height:55px;gap:4px;border-radius:8px}.primitive-svg{width:23px;height:23px}.panel-section .field:last-child,.section-body>.field:last-child{margin-bottom:0}.field{margin-bottom:8px}.wide-btn{margin-top:6px}.legacy-link{margin-top:7px}.history-list{margin-top:4px}.history-shortcut-note{margin-top:5px}.history-section .section-title small{white-space:nowrap}.geometry-fields{gap:6px}.switch-row{min-height:27px}
@media(max-width:980px){.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:117px}}
@media(max-width:720px){.primitive-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:117px}.primitive-grid button{height:55px}.history-section{display:block}}

/* DjCreator2 v0.4 · multiselección y grupos */
.selection-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.compact-action{height:28px;padding:0 6px;border:1px solid rgba(82,217,255,.14);border-radius:6px;background:rgba(82,217,255,.035);color:#7698aa;font-size:10px;cursor:pointer;white-space:nowrap}.compact-action:hover:not(:disabled){color:#dff8ff;border-color:rgba(82,217,255,.32);background:rgba(82,217,255,.07)}.compact-action:disabled{opacity:.34;cursor:default}.selection-note{margin-top:5px;color:#526f82;font-size:9px;line-height:1.35}.selection-section .section-title small{white-space:nowrap}.tree-item.group-row{background:rgba(126,99,255,.035)}.tree-item.group-row .tree-type{color:#a695ff}.tree-name em{margin-left:5px;color:#536e81;font-style:normal;font-size:8px}.tree-child{display:grid;grid-template-columns:13px 18px minmax(0,1fr);align-items:center;min-height:21px;padding:1px 7px 1px 14px;color:#526d80;font-size:9px;border-left:1px solid rgba(126,99,255,.12);margin-left:11px}.tree-child .tree-branch{color:#4f6475}.tree-child .tree-type{font-size:9px;color:#627d90}.tree-child .tree-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-item.selected{box-shadow:inset 2px 0 0 #63dcff}.hierarchy-section .object-tree{max-height:172px}.right-panel .section-title small{max-width:105px;overflow:hidden;text-overflow:ellipsis}.material-grid .field:last-of-type{margin-bottom:6px}
@media(max-width:720px){.selection-actions{grid-template-columns:1fr 1fr}}

/* DjCreator2 v0.5 · bloques laterales compactables */
.workspace{transition:grid-template-columns .16s ease}
.workspace.left-rail{grid-template-columns:44px minmax(320px,1fr) 266px}
.workspace.right-rail{grid-template-columns:228px minmax(320px,1fr) 44px}
.workspace.left-rail.right-rail{grid-template-columns:44px minmax(320px,1fr) 44px}
.panel-block{position:relative}
.block-controls{position:sticky;top:0;z-index:15;display:flex;justify-content:flex-end;gap:4px;height:27px;padding:3px 5px;border-bottom:1px solid rgba(105,185,235,.09);background:rgba(6,15,26,.96);backdrop-filter:blur(6px)}
.block-controls button{width:21px;height:21px;padding:0;border:1px solid rgba(82,217,255,.14);border-radius:5px;background:rgba(82,217,255,.03);color:#66879a;display:grid;place-items:center;cursor:pointer;font-size:15px;line-height:1}
.block-controls button:hover{color:#e0f9ff;border-color:rgba(82,217,255,.32);background:rgba(82,217,255,.07)}
.block-restore-btn{display:none!important}
.panel-icon-btn{display:none;flex:0 0 28px;width:28px;height:28px;padding:0;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:rgba(82,217,255,.025);color:#73a5b9;place-items:center;font-size:15px;line-height:1;cursor:pointer}
.panel-icon-btn:hover{color:#e6fbff;border-color:rgba(82,217,255,.3);background:rgba(82,217,255,.07)}
.panel-block.block-rail{overflow:hidden}
.panel-block.block-rail .block-controls{justify-content:center;padding-left:3px;padding-right:3px}
.panel-block.block-rail .block-hide-btn{display:none}
.panel-block.block-rail .block-restore-btn{display:grid!important}
.panel-block.block-rail .panel-section{padding:3px 7px;border-bottom:0}
.panel-block.block-rail .section-title{justify-content:center;margin:0;min-height:32px}
.panel-block.block-rail .section-title>span,.panel-block.block-rail .section-title>small,.panel-block.block-rail .collapse-btn,.panel-block.block-rail .section-body{display:none!important}
.panel-block.block-rail .panel-icon-btn{display:grid}
.panel-block.block-single .block-restore-btn{display:grid!important}
.panel-block.block-single .panel-section:not(.block-active){padding:3px 7px;border-bottom:0}
.panel-block.block-single .panel-section:not(.block-active) .section-title{justify-content:center;margin:0;min-height:32px}
.panel-block.block-single .panel-section:not(.block-active) .section-title>span,.panel-block.block-single .panel-section:not(.block-active) .section-title>small,.panel-block.block-single .panel-section:not(.block-active) .collapse-btn,.panel-block.block-single .panel-section:not(.block-active) .section-body{display:none!important}
.panel-block.block-single .panel-section:not(.block-active) .panel-icon-btn{display:grid}
.panel-block.block-single .panel-section.block-active .panel-icon-btn{display:none}
.panel-block.block-single .panel-section.block-active{border-bottom:1px solid rgba(105,185,235,.1)}
.version-pill{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:980px){
  .workspace.left-rail{grid-template-columns:44px minmax(280px,1fr) 230px}
  .workspace.right-rail{grid-template-columns:190px minmax(280px,1fr) 44px}
  .workspace.left-rail.right-rail{grid-template-columns:44px minmax(280px,1fr) 44px}
}
@media(max-width:720px){
  .workspace.left-rail,.workspace.right-rail,.workspace.left-rail.right-rail{grid-template-columns:1fr;grid-template-rows:58vh auto auto}
  .panel-block.block-rail{height:42px;min-height:42px;display:flex;align-items:center;overflow-x:auto;overflow-y:hidden}
  .panel-block.block-rail .block-controls{position:sticky;left:0;flex:0 0 34px;width:34px;height:42px;align-items:center;border-bottom:0;border-right:1px solid rgba(105,185,235,.09)}
  .panel-block.block-rail .panel-section{flex:0 0 38px;padding:3px}
  .panel-block.block-rail .section-title{min-height:34px}
}
.section-title>span:first-of-type{margin-right:auto}
.panel-block.block-rail .section-title>span:first-of-type,.panel-block.block-single .panel-section:not(.block-active) .section-title>span:first-of-type{margin-right:0}

/* DjCreator2 v0.6 · acciones contextuales e iconografía compacta */
.tool-svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 15px}
.delete-x-icon{width:16px;height:16px;stroke-width:2}
.tool-btn[hidden]{display:none!important}
.panel-block.block-rail .mini-btn{display:none!important}
.panel-block.block-single .panel-section:not(.block-active) .mini-btn{display:none!important}
.tree-item{grid-template-columns:24px minmax(0,1fr) 24px 24px}
.tree-item.has-tree-action{grid-template-columns:24px minmax(0,1fr) 24px 24px 24px}
.tree-visible,.tree-context-action,.tree-delete{width:24px;height:24px;padding:0;border:0;background:none;display:grid;place-items:center;cursor:pointer}
.tree-visible{color:#607c90}
.tree-visible.on{color:#91eaff}
.tree-visible:hover,.tree-context-action:hover{color:#dffaff;background:rgba(82,217,255,.06);border-radius:5px}
.tree-context-action{color:#8d8de9}
.tree-delete{color:#6e5560;font-size:16px;line-height:1}
.tree-delete:hover{color:#ff7695;background:rgba(255,101,136,.06);border-radius:5px}
.tree-action-svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.eye-svg circle{fill:none}
.block-controls .block-hide-btn,.block-controls .block-restore-btn{font-family:Consolas,monospace;font-weight:700;font-size:16px}

/* DjCreator2 v0.7 · panel flotante, escena compacta y nuevas primitivas */
.workspace{position:relative}
.object-tree{gap:2px}
.tree-item{min-height:28px;padding:0 4px}
.tree-child{min-height:19px;padding-top:0;padding-bottom:0}
.geometry-field input[type=text]{width:100%;height:29px;min-width:0;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:#07101b;color:#d0e8f5;padding:0 7px;outline:none;font-size:11px}
.geometry-text-field{grid-column:1/-1}

.floating-panel-host{position:absolute;top:0;z-index:35;max-height:100%;overflow:auto;pointer-events:none;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.floating-panel-host.left{left:44px;width:228px}
.floating-panel-host.right{right:44px;width:266px}
.floating-panel-host:empty{display:none}
.floating-panel-host .floating-section{pointer-events:auto;margin:4px;border:1px solid rgba(82,217,255,.22);border-radius:8px;background:linear-gradient(180deg,rgba(8,19,33,.985),rgba(6,14,25,.99));box-shadow:0 14px 35px rgba(0,0,0,.42);overflow:hidden}
.floating-panel-host .floating-section>.section-title{margin-bottom:7px}
.floating-panel-host .floating-section .panel-icon-btn{display:none!important}
.floating-panel-host .floating-section.collapsed>.section-body{display:block}
.panel-block.block-rail.block-single{overflow:hidden}
.panel-block.block-rail.block-single .block-restore-btn{display:grid!important}
.block-proxy .panel-icon-btn{display:grid!important}
.block-proxy .section-title{justify-content:center!important;margin:0!important;min-height:32px}

@media(max-width:980px){
  .floating-panel-host.left{width:190px}
  .floating-panel-host.right{width:230px}
}
@media(max-width:720px){
  .floating-panel-host.left,.floating-panel-host.right{left:8px;right:8px;top:46px;width:auto;max-height:calc(100% - 54px)}
  .floating-panel-host .floating-section{margin:0}
}

/* DjCreator2 v0.9 · biblioteca canónica, prefabricados y Forma libre */
.object-category-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:-2px 0 6px}
.category-tab{height:23px;padding:0 7px;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:rgba(82,217,255,.025);color:#68899b;font-size:9px;letter-spacing:.04em;cursor:pointer}
.category-tab:hover{color:#dff8ff;border-color:rgba(82,217,255,.27)}
.category-tab.active{color:#8be7ff;border-color:rgba(82,217,255,.34);background:rgba(82,217,255,.08)}
.primitive-grid>button[hidden]{display:none!important}

/* Forma libre · editor compacto de puntos */
.freepath-controls{display:grid;gap:6px;margin:1px 0 3px}
.freepath-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--muted,#8fa9bc)}
.freepath-summary b{color:var(--text,#eaf7ff);font-size:14px}
.freepath-actions{display:grid;grid-template-columns:1.25fr .85fr .85fr;gap:5px}
.freepath-actions .mini-btn{min-width:0;padding-left:5px;padding-right:5px;white-space:nowrap}

/* DjCreator2 v0.10 · Forma libre Bézier */
.freepath-actions{grid-template-columns:1fr 1fr 1fr;gap:5px}
.freepath-action-btn{
  min-width:0;height:28px;padding:0 6px;border:1px solid rgba(86,214,255,.30);border-radius:6px;
  background:rgba(32,91,116,.30);color:#dff8ff;font-size:11px;font-weight:700;letter-spacing:.015em;
  cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.018)
}
.freepath-action-btn:hover{background:rgba(49,139,175,.38);border-color:rgba(100,226,255,.55)}
.freepath-action-btn.primary{background:rgba(34,129,158,.43);border-color:rgba(95,225,255,.50);color:#f2fdff}
.freepath-action-btn.danger{border-color:rgba(255,119,137,.28);background:rgba(126,43,57,.22);color:#ffd9df}
.freepath-action-btn:disabled{opacity:.34;cursor:not-allowed}
.freepath-tip{font-size:10px;line-height:1.3;color:#7894a5;padding:0 1px 2px}


/* DjCreator2 v0.11 · proyectos múltiples, barra compacta y modal propio */
.app-shell{grid-template-rows:68px minmax(0,1fr) 28px}
.topbar{
  grid-template-columns:230px minmax(0,1fr) 150px;
  grid-template-rows:42px 26px;
  align-items:center;
  padding:0 10px;
}
.brand{grid-column:1;grid-row:1/3;align-self:center}
.toolbar{grid-column:2;grid-row:1;align-self:center;justify-self:center;gap:5px;min-width:0;max-width:100%}
.tool-group{gap:2px;padding:2px;border-radius:7px}
.tool-btn{height:28px;gap:4px;padding:0 6px;border-radius:6px;font-size:12px}
.tool-svg{width:15px;height:15px}
.version-pill{grid-column:3;grid-row:1/3;align-self:center}
.project-tabs-shell{
  grid-column:2;grid-row:2;align-self:end;min-width:0;width:100%;height:26px;
  display:flex;align-items:flex-end;overflow:hidden;
}
.project-tabs{
  width:100%;height:26px;display:flex;align-items:flex-end;gap:2px;overflow-x:auto;overflow-y:hidden;
  scrollbar-width:thin;scrollbar-color:#17415a transparent;padding:0 1px;
}
.project-tab{
  flex:0 0 auto;min-width:104px;max-width:185px;height:24px;display:flex;align-items:center;gap:3px;
  padding:0 4px 0 8px;border:1px solid rgba(82,217,255,.12);border-bottom-color:rgba(82,217,255,.22);
  border-radius:7px 7px 0 0;background:rgba(8,21,35,.72);color:#6f8da0;font-size:10px;cursor:pointer;
  user-select:none;transition:.14s;
}
.project-tab:hover{color:#d8f6ff;background:rgba(17,42,61,.75);border-color:rgba(82,217,255,.24)}
.project-tab.active{color:#ddf8ff;background:#0b1b2a;border-color:rgba(82,217,255,.38);border-bottom-color:#0b1b2a;box-shadow:inset 0 2px 0 rgba(82,217,255,.26)}
.project-tab-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.project-tab-dirty{width:8px;text-align:center;color:#ffcb68;font-size:13px;line-height:1;opacity:0}
.project-tab.dirty .project-tab-dirty{opacity:1}
.project-tab-close{flex:0 0 18px;width:18px;height:18px;display:grid;place-items:center;padding:0;border:0;border-radius:4px;background:transparent;color:#587486;font-size:14px;line-height:1;cursor:pointer}
.project-tab-close:hover{background:rgba(255,101,136,.10);color:#ff8ca4}
.project-tab-editor{min-width:72px;max-width:138px;height:18px;padding:0 4px;border:1px solid rgba(82,217,255,.38);border-radius:4px;background:#06111c;color:#e6faff;font-size:10px;outline:none}
.new-project-btn{color:#9eddf0}

/* Ajuste pendiente de Forma libre: botones más grandes y texto normal. */
.freepath-actions{gap:6px}
.freepath-action-btn{height:34px;padding:0 8px;font-size:11px;font-weight:400;letter-spacing:0}

/* Modal propio: reemplaza alert/confirm para mensajes bloqueantes. */
.app-modal-overlay{
  position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;
  background:rgba(0,0,0,.78);backdrop-filter:blur(4px);
}
.app-modal-overlay[hidden]{display:none!important}
.app-modal-card{
  width:min(440px,calc(100vw - 28px));max-height:min(78vh,560px);overflow:auto;
  border:1px solid rgba(82,217,255,.25);border-radius:12px;background:linear-gradient(180deg,#0a1826,#07111d);
  color:var(--text);box-shadow:0 30px 100px rgba(0,0,0,.72);
}
.app-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid rgba(82,217,255,.12)}
.app-modal-header strong{font-size:13px;letter-spacing:.03em}
.app-modal-close{width:26px;height:26px;padding:0;border:0;border-radius:6px;background:transparent;color:#6f899a;font-size:21px;line-height:1;cursor:pointer}
.app-modal-close:hover{color:#fff;background:rgba(255,255,255,.05)}
.app-modal-message{padding:17px 15px;color:#a5bdca;font-size:11px;line-height:1.65;white-space:pre-line}
.app-modal-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px;padding:0 14px 14px}
.app-modal-actions button{min-height:31px;padding:0 11px;border:1px solid rgba(82,217,255,.16);border-radius:7px;background:#0b1d2c;color:#8faec0;font-size:10px;cursor:pointer}
.app-modal-actions button:hover{color:#ecfbff;border-color:rgba(82,217,255,.34);background:#10283a}
.app-modal-actions button.primary{color:#dffaff;border-color:rgba(82,217,255,.42);background:rgba(40,151,187,.18)}
.app-modal-actions button.danger{color:#ffd7df;border-color:rgba(255,101,136,.30);background:rgba(127,41,58,.18)}
body.modal-open .app-shell{filter:none}

@media(max-width:1180px){
  .topbar{grid-template-columns:190px minmax(0,1fr) 118px;padding:0 7px}
  .brand small{display:none}.version-pill{font-size:9px;padding:5px 7px}
  .tool-btn{padding:0 4px}.toolbar{gap:3px}.tool-group{gap:1px}
}
@media(max-width:980px){
  .app-shell{grid-template-rows:78px minmax(0,1fr) 28px}
  .topbar{grid-template-columns:150px minmax(0,1fr);grid-template-rows:48px 30px;padding:0 6px}
  .brand{grid-column:1;grid-row:1}.toolbar{grid-column:2;grid-row:1;justify-self:start;overflow-x:auto;max-width:100%}
  .version-pill{display:none}.project-tabs-shell{grid-column:1/3;grid-row:2;height:30px}.project-tabs{height:30px}
  .project-tab{height:27px}
}
@media(max-width:720px){
  .app-shell{grid-template-rows:82px minmax(0,1fr) 28px}
  .topbar{grid-template-columns:112px minmax(0,1fr);grid-template-rows:52px 30px}
  .home-btn{width:30px;height:30px}.brand strong{font-size:13px}.tool-btn{height:27px;font-size:11px;padding:0 4px}
  .tool-btn span{display:none}.new-project-btn span{display:inline}.new-project-btn{min-width:84px}
  .project-tab{min-width:96px;max-width:145px}
}


/* DjCreator2 v0.11.1 · selector unificado de proyectos */
.project-tool-group{display:flex;align-items:center;gap:3px;min-width:0}
.project-picker-wrap{position:relative;display:flex;align-items:center;height:28px;min-width:116px;max-width:168px}
.project-picker-label{position:absolute;left:8px;top:50%;transform:translateY(-50%);z-index:1;pointer-events:none;color:#9eddf0;font-size:12px;white-space:nowrap}
.project-picker{width:100%;height:28px;padding:0 24px 0 7px;border:1px solid rgba(82,217,255,.14);border-radius:6px;background:#07131f;color:transparent;font:400 12px/1 system-ui;cursor:pointer;outline:none;appearance:auto}
.project-picker:hover,.project-picker:focus{border-color:rgba(82,217,255,.34);background:#0a1b2a}
.project-picker option,.project-picker optgroup{color:#d9f6ff;background:#07131f;font-size:12px}
.project-picker optgroup{font-weight:700}
.project-picker option{font-weight:400}
.project-picker:focus + *{outline:none}
@media(max-width:900px){
  .project-picker-wrap{min-width:100px;max-width:130px}
  .project-picker-label{font-size:11px}
}


/* DjCreator2 v0.11.2 · enfoque automático y lista ESCENA de cinco filas */
.hierarchy-section .object-tree{
  max-height:172px;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:#17415a transparent;
  scroll-behavior:smooth;
}
.hierarchy-section .tree-item.tree-focus{
  border-color:rgba(82,217,255,.30);
  box-shadow:inset 2px 0 0 #63dcff,0 0 0 1px rgba(82,217,255,.035);
}

/* DjCreator2 v0.12 · clips, keyframes y línea de tiempo */
.app-shell{grid-template-rows:68px minmax(0,1fr) 138px 28px}
.animation-section .section-title{margin-bottom:6px}
.animation-panel-grid{display:flex;flex-direction:column;gap:5px}
.animation-panel-grid .field{margin-bottom:0;gap:4px}
.animation-panel-grid select,.animation-panel-grid input[type=text],.animation-panel-grid input[type=number]{
  width:100%;height:27px;min-width:0;padding:0 6px;border:1px solid rgba(82,217,255,.12);border-radius:5px;
  background:#07101b;color:#cfe8f5;font-size:10px;outline:none
}
.animation-panel-grid select:focus,.animation-panel-grid input:focus{border-color:rgba(82,217,255,.42);box-shadow:0 0 0 2px rgba(82,217,255,.05)}
.animation-panel-grid select:disabled,.animation-panel-grid input:disabled{opacity:.38}
.anim-clip-actions{display:grid;grid-template-columns:1fr 30px;gap:5px;margin-top:-1px}
.anim-clip-actions button,.anim-key-actions button{
  height:28px;padding:0 6px;border:1px solid rgba(82,217,255,.14);border-radius:5px;background:rgba(82,217,255,.035);
  color:#87a9bb;font-size:10px;font-weight:400;cursor:pointer
}
.anim-clip-actions button:hover,.anim-key-actions button:hover{color:#e9fbff;border-color:rgba(82,217,255,.34);background:rgba(82,217,255,.07)}
.anim-clip-actions button.danger:hover{color:#ff9caf;border-color:rgba(255,101,136,.28);background:rgba(255,101,136,.07)}
.anim-clip-actions button:disabled,.anim-key-actions button:disabled{opacity:.32;cursor:not-allowed}
.anim-two-cols{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.anim-key-actions{display:grid;grid-template-columns:1.55fr repeat(3,.72fr) 1.15fr;gap:4px}
.anim-key-actions #animKeyAll{color:#9bdff0}
.anim-subtitle{margin:2px 0 -1px;color:#557386;font-size:8px;letter-spacing:.13em}

.animation-timeline{
  min-height:0;height:138px;border-top:1px solid rgba(82,217,255,.14);background:linear-gradient(180deg,#07131f,#050c15);
  display:grid;grid-template-rows:31px 26px minmax(0,1fr);overflow:hidden;transition:height .16s ease
}
.animation-timeline.collapsed{height:31px;grid-template-rows:31px 0 0}
.animation-timeline.collapsed .anim-scrubber,.animation-timeline.collapsed .anim-timeline-tracks{display:none}
.app-shell:has(.animation-timeline.collapsed){grid-template-rows:68px minmax(0,1fr) 31px 28px}
.anim-timeline-head{display:grid;grid-template-columns:auto minmax(100px,1fr) auto 58px 28px;gap:8px;align-items:center;padding:3px 8px;border-bottom:1px solid rgba(82,217,255,.08)}
.anim-playback-controls{display:flex;gap:3px}
.anim-playback-controls button,.anim-timeline-toggle{
  width:26px;height:24px;padding:0;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:#081725;color:#6f91a4;font-size:11px;cursor:pointer
}
.anim-playback-controls button:hover,.anim-timeline-toggle:hover,.anim-playback-controls button.active{color:#dff9ff;border-color:rgba(82,217,255,.36);background:rgba(82,217,255,.08)}
.anim-playback-controls button:disabled{opacity:.28;cursor:not-allowed}
.anim-timeline-head strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#86adbf;font-size:10px;font-weight:600}
.anim-timeline-head output{color:#68bdd6;font-size:9px;font-variant-numeric:tabular-nums}.anim-speed{height:24px;padding:0 3px;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:#081725;color:#79a2b6;font-size:9px;outline:none}
.anim-scrubber{display:flex;align-items:center;padding:1px 8px 1px 92px;border-bottom:1px solid rgba(82,217,255,.06)}
.anim-scrubber input{width:100%;height:20px;accent-color:#58d8ff;cursor:pointer}
.anim-timeline-tracks{overflow:auto;padding:3px 8px 5px;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.anim-track-row{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;min-height:20px;gap:7px}
.anim-track-label{color:#607f91;font-size:9px;text-align:right}
.anim-track-lane{position:relative;height:14px;border-top:1px solid rgba(82,217,255,.10);border-bottom:1px solid rgba(82,217,255,.035);background:linear-gradient(90deg,rgba(82,217,255,.025),transparent)}
.anim-key-marker{position:absolute;top:50%;width:10px;height:10px;padding:0;border:1px solid rgba(255,255,255,.26);border-radius:1px;background:#4ccde9;transform:translate(-50%,-50%) rotate(45deg);cursor:pointer;box-shadow:0 0 5px rgba(82,217,255,.22)}
.anim-key-marker.rotation{background:#a874ff}.anim-key-marker.scale{background:#73df9d}
.anim-key-marker:hover{z-index:3;box-shadow:0 0 0 2px rgba(255,255,255,.12),0 0 9px currentColor}
.anim-path-segment{position:absolute;top:3px;height:6px;border-radius:4px;background:linear-gradient(90deg,rgba(255,207,91,.45),rgba(255,135,206,.55));border:1px solid rgba(255,220,150,.35)}

@media(max-width:980px){
  .app-shell{grid-template-rows:78px minmax(0,1fr) 126px 28px}
  .app-shell:has(.animation-timeline.collapsed){grid-template-rows:78px minmax(0,1fr) 31px 28px}
  .animation-timeline{height:126px}
}
@media(max-width:720px){
  .app-shell{grid-template-rows:82px 58vh 118px 28px;height:auto;min-height:100vh}
  .app-shell:has(.animation-timeline.collapsed){grid-template-rows:82px 58vh 31px 28px}
  .workspace{grid-row:2;height:58vh;overflow:auto}
  .animation-timeline{grid-row:3;height:118px;position:sticky;bottom:28px;z-index:18}
  .statusbar{grid-row:4}
  .anim-track-row{grid-template-columns:58px minmax(0,1fr)}
  .anim-scrubber{padding-left:72px}
}

/* DjCreator2 v0.13 · biblioteca modular de ejemplos */
.examples-picker-wrap{position:relative;display:flex;align-items:center;height:28px;min-width:92px;max-width:145px}
.examples-picker-label{position:absolute;left:8px;top:50%;transform:translateY(-50%);z-index:1;pointer-events:none;color:#bfa2ff;font-size:12px;white-space:nowrap}
.examples-picker{width:100%;height:28px;padding:0 22px 0 7px;border:1px solid rgba(163,107,255,.18);border-radius:6px;background:#0a1320;color:transparent;font:400 12px/1 system-ui;cursor:pointer;outline:none;appearance:auto}
.examples-picker:hover,.examples-picker:focus{border-color:rgba(190,150,255,.40);background:#11182a}
.project-tab.example{border-color:rgba(190,150,255,.22)}
.project-tab.example.active{border-color:rgba(190,150,255,.46);box-shadow:inset 0 2px 0 rgba(190,150,255,.32)}
.project-tab-example{color:#c8a9ff;font-size:10px;line-height:1}
.anim-track-row.component .anim-track-label{color:#7a6e9c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.anim-key-marker.component{opacity:.86}
.tool-btn:disabled{opacity:.36;cursor:not-allowed}
@media(max-width:1180px){.examples-picker-wrap{min-width:78px}.examples-picker-label{font-size:11px;left:6px}}
@media(max-width:720px){.examples-picker-wrap{min-width:72px}.examples-picker-label{font-size:10px}}

/* DjCreator2 v0.14 · productividad: clipboard, bloqueo, snap y vistas */
.snap-picker-wrap{display:flex;align-items:center;gap:4px;height:28px;padding:0 5px;border:1px solid rgba(82,217,255,.09);border-radius:6px;color:#68889a;font-size:10px;white-space:nowrap}
.snap-picker{height:23px;min-width:62px;padding:0 3px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07131f;color:#9bc4d6;font-size:10px;outline:none}
.snap-picker:focus{border-color:rgba(82,217,255,.34)}
.tree-item{grid-template-columns:18px 22px minmax(0,1fr) auto 22px 22px 20px;min-height:30px;margin-left:calc(var(--tree-depth,0) * 10px);padding:1px 2px;gap:1px}
.tree-item.tree-child{color:#7894a6;background:rgba(255,255,255,.008)}
.tree-item.locked{background:linear-gradient(90deg,rgba(255,196,92,.035),transparent)}
.tree-toggle,.tree-lock{width:18px;height:22px;padding:0;border:0;background:none;color:#587689;cursor:pointer;font-size:11px;display:grid;place-items:center}
.tree-toggle:hover,.tree-lock:hover{color:#dff8ff}.tree-toggle-spacer{width:18px}
.tree-lock{font-size:10px;filter:saturate(.7)}.tree-lock.on{color:#e6bd6f}.tree-lock.inherited{opacity:.58}
.tree-delete:disabled{opacity:.24;cursor:not-allowed}
.tree-name{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tree-name em{margin-left:4px;color:#516e80;font-size:8px;font-style:normal}
.tree-context-action{width:20px;height:20px}
.camera-view-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:7px}
.camera-view-grid button,.camera-saved-row button{height:27px;padding:0 5px;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:rgba(82,217,255,.03);color:#7799aa;font-size:9px;font-weight:400;cursor:pointer}
.camera-view-grid button:hover,.camera-saved-row button:hover{color:#e8fbff;border-color:rgba(82,217,255,.32);background:rgba(82,217,255,.07)}
.camera-saved-row{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:7px}
.camera-saved-row button:disabled{opacity:.3;cursor:not-allowed}
#lockBtn{min-width:0}
@media(max-width:1180px){.snap-picker-wrap>span{display:none}.snap-picker-wrap{padding:0 2px}.snap-picker{min-width:55px}.tool-btn{padding-left:3px;padding-right:3px}}
@media(max-width:720px){.snap-picker-wrap{height:27px}.snap-picker{height:22px;font-size:9px}}

/* DjCreator2 v0.15 · menú compacto + caja de herramientas de iconos */
.app-shell{grid-template-rows:78px minmax(0,1fr) 138px 28px}
.app-shell:has(.animation-timeline.collapsed){grid-template-rows:78px minmax(0,1fr) 31px 28px}
.topbar{
  position:relative;z-index:50;display:grid;
  grid-template-columns:210px minmax(0,1fr) 140px;
  grid-template-rows:22px 30px 26px;
  align-items:center;padding:0 8px;
  border-bottom:1px solid rgba(82,217,255,.12);
  background:rgba(5,13,23,.98);
}
.brand{grid-column:1;grid-row:1/3;align-self:center;gap:7px}
.brand .home-btn{width:30px;height:30px;border-radius:6px}
.brand strong{font-size:14px}.brand small{font-size:9px;margin-top:1px}
.version-pill{grid-column:3;grid-row:1/3;align-self:center;justify-self:end;padding:4px 7px;font-size:9px}

.menu-bar{
  grid-column:2;grid-row:1;align-self:stretch;justify-self:start;
  display:flex;align-items:center;gap:1px;min-width:0;position:relative;
}
.menu-root{position:relative;height:100%;display:flex;align-items:center}
.menu-button{
  height:21px;padding:0 7px;border:0;border-radius:3px;background:transparent;
  color:#8199aa;font-size:11px;font-weight:400;line-height:1;cursor:pointer;white-space:nowrap
}
.menu-button:hover,.menu-button.active{color:#e8faff;background:rgba(82,217,255,.075)}
.menu-direct{margin-left:1px}
.menu-dropdown{
  display:none;position:absolute;left:0;top:21px;z-index:200;min-width:178px;padding:4px;
  border:1px solid rgba(82,217,255,.18);border-radius:6px;background:#07131f;
  box-shadow:0 14px 38px rgba(0,0,0,.55)
}
.menu-dropdown.open{display:block}
.menu-item{
  width:100%;min-height:25px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:3px 7px;border:0;border-radius:4px;background:transparent;color:#8ca7b8;
  font-size:10px;font-weight:400;text-align:left;cursor:pointer;white-space:nowrap
}
.menu-item:hover,.menu-item.active,.menu-item.selected{color:#e9fbff;background:rgba(82,217,255,.085)}
.menu-item.danger:hover{color:#ff9bb0;background:rgba(255,101,136,.08)}
.menu-item kbd,.menu-caption kbd{font:400 8px/1.2 system-ui;color:#506d80}
.menu-divider{height:1px;margin:3px 4px;background:rgba(82,217,255,.10)}
.menu-caption,.menu-list-header{padding:4px 7px 2px;color:#536e80;font-size:8px;letter-spacing:.12em}
.menu-sublist{display:flex;flex-direction:column}
.menu-scroll-list{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.project-menu-list{max-height:130px}
.example-menu-list{max-height:160px}
.project-menu-dropdown{min-width:218px}.examples-menu-dropdown{min-width:212px}
.menu-list-item{
  width:100%;min-height:26px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;
  padding:3px 7px;border:0;border-radius:4px;background:transparent;color:#8da8b9;font-size:10px;text-align:left;cursor:pointer
}
.menu-list-item:hover{color:#e9fbff;background:rgba(82,217,255,.085)}
.menu-list-item span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-list-item small{color:#4d687a;font-size:8px;white-space:nowrap}
.menu-list-empty{padding:8px;color:#4e687a;font-size:9px;text-align:center}

.icon-toolbar{
  grid-column:2;grid-row:2;align-self:center;justify-self:start;display:flex;align-items:center;
  min-width:0;max-width:100%;overflow-x:auto;overflow-y:hidden;gap:0;padding:0 1px;scrollbar-width:none
}
.icon-toolbar::-webkit-scrollbar{display:none}
.icon-tool{
  flex:0 0 26px;width:26px;height:26px;display:grid;place-items:center;padding:0;margin:0;border:0;border-radius:0;
  background:transparent;color:#7591a3;font-size:15px;line-height:1;cursor:pointer
}
.icon-tool:hover{color:#effcff;background:rgba(82,217,255,.07)}
.icon-tool.active{color:#61dcff;background:rgba(82,217,255,.10)}
.icon-tool.danger:hover{color:#ff8fa8;background:rgba(255,101,136,.08)}
.icon-tool:disabled{opacity:.28;cursor:default;background:transparent}
.toolbar-separator{flex:0 0 1px;width:1px;height:17px;margin:0 3px;background:rgba(113,157,183,.28)}
.project-tabs-shell{
  grid-column:1/4;grid-row:3;align-self:end;min-width:0;width:100%;height:26px;
  display:flex;align-items:flex-end;overflow:hidden;padding:0
}
.project-tabs{height:26px}

/* Los controles nativos anteriores permanecen sólo como infraestructura, nunca como UI. */
#projectsCombo[hidden],#examplesCombo[hidden],#snapCombo[hidden],#importInput[hidden]{display:none!important}

/* El panel flotante queda justo al lado de su rail, incluso con ambos bloques reducidos. */
.floating-panel-host{top:0}

@media(max-width:1180px){
  .topbar{grid-template-columns:175px minmax(0,1fr) 110px;padding:0 5px}
  .brand small{display:none}.menu-button{padding:0 5px;font-size:10px}.version-pill{font-size:8px}
}
@media(max-width:980px){
  .app-shell{grid-template-rows:82px minmax(0,1fr) 126px 28px}
  .app-shell:has(.animation-timeline.collapsed){grid-template-rows:82px minmax(0,1fr) 31px 28px}
  .topbar{grid-template-columns:135px minmax(0,1fr);grid-template-rows:24px 32px 26px;padding:0 4px}
  .brand{grid-column:1;grid-row:1/3}.version-pill{display:none}.menu-bar{grid-column:2;grid-row:1;overflow-x:auto}.icon-toolbar{grid-column:2;grid-row:2}
  .project-tabs-shell{grid-column:1/3;grid-row:3}.menu-dropdown{position:fixed;top:24px;left:auto}
}
@media(max-width:720px){
  .app-shell{grid-template-rows:86px 58vh 118px 28px;height:auto;min-height:100vh}
  .app-shell:has(.animation-timeline.collapsed){grid-template-rows:86px 58vh 31px 28px}
  .topbar{grid-template-columns:100px minmax(0,1fr);grid-template-rows:26px 34px 26px}
  .brand strong{font-size:12px}.brand .home-btn{width:27px;height:27px}.menu-button{font-size:9px;padding:0 4px}
  .icon-tool{width:25px;flex-basis:25px;height:25px;font-size:14px}
  .menu-dropdown{top:27px;max-width:calc(100vw - 12px)}
}

/* DjCreator2 v0.16 · toolbar inline + fullscreen + timeline refinements */
.app-shell{grid-template-rows:74px minmax(0,1fr) 150px 28px}
.app-shell:has(.animation-timeline.collapsed){grid-template-rows:74px minmax(0,1fr) 31px 28px}
.topbar{grid-template-columns:210px minmax(0,1fr) 205px;grid-template-rows:44px 30px;padding:0 8px}
.brand{grid-column:1;grid-row:1/2}
.menu-tools-line{grid-column:2;grid-row:1;display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden}
.menu-tools-sep{color:#5d788b;font-size:12px;letter-spacing:-1px;user-select:none}
.menu-bar{grid-column:auto;grid-row:auto;flex:0 1 auto;min-width:0}
.icon-toolbar{grid-column:auto;grid-row:auto;flex:1 1 auto;justify-self:stretch;min-width:0;overflow-x:auto}
.project-tabs-shell{grid-column:1/4;grid-row:2;height:30px}
.top-right-tools{grid-column:3;grid-row:1;justify-self:end;display:flex;align-items:center;gap:6px}
.max-btn{height:24px;display:flex;align-items:center;gap:5px;padding:0 8px;border:1px solid rgba(82,217,255,.18);border-radius:999px;background:rgba(82,217,255,.04);color:#8dbed4;font-size:10px;cursor:pointer}
.max-btn:hover,.max-btn.active{color:#effcff;background:rgba(82,217,255,.09)}
.max-btn .max-icon{font-size:13px;line-height:1}
.version-pill{grid-column:auto;grid-row:auto;max-width:none}
.menu-button,.menu-item{font-size:10px}
.menu-item{justify-content:flex-start}
.menu-item kbd{margin-left:auto}
.icon-tool{font-size:14px}
.icon-tool#lockBtn{font-size:14px}

/* compact animation block */
.animation-panel-grid .field>span,.animation-panel-grid .switch-row{font-size:11px}
.animation-timeline{height:150px;padding:7px 12px 8px}
.anim-scrubber{margin-top:-2px;margin-bottom:4px}
.anim-ruler{position:relative;height:18px;margin:0 0 4px 106px;border-top:1px solid rgba(82,217,255,.12)}
.anim-ruler-tick{position:absolute;top:0;width:1px;height:9px;background:rgba(130,190,220,.25)}
.anim-ruler-tick span{position:absolute;top:8px;left:2px;color:#597487;font-size:8px;line-height:1}
.anim-ruler-current{position:absolute;top:-1px;transform:translateX(-50%);padding:0 3px;border-radius:3px;background:rgba(82,217,255,.1);color:#afe9ff;font-size:8px;line-height:14px;white-space:nowrap}
.anim-track-label{font-size:10px}
.anim-key-marker{width:11px;height:11px}
.anim-key-marker.selected{box-shadow:0 0 0 2px rgba(255,255,255,.4),0 0 12px rgba(82,217,255,.55);z-index:5}
.anim-key-marker.locked{opacity:.45;filter:grayscale(.15)}
.anim-keyframe-editor{display:grid;grid-template-columns:56px 1fr;gap:7px;align-items:start}
.anim-keyframe-tools{display:flex;flex-direction:column;gap:4px}
.anim-keyframe-tools button{height:26px;border:1px solid rgba(82,217,255,.15);border-radius:6px;background:#0a1825;color:#90b3c6;cursor:pointer}
.anim-keyframe-tools .danger{color:#ff9cb0}
.anim-keyframe-tools button:disabled{opacity:.35;cursor:default}
.anim-keyframe-list{display:flex;flex-direction:column;gap:4px;max-height:94px;overflow:auto}
.anim-kf-item{display:grid;grid-template-columns:20px 1fr 18px;align-items:center;height:24px;padding:0 6px;border:1px solid rgba(82,217,255,.1);border-radius:6px;background:#08131d;color:#91afc0;cursor:pointer;font-size:10px;text-align:left}
.anim-kf-item.selected{border-color:rgba(82,217,255,.34);background:rgba(82,217,255,.08);color:#e9fbff}
.anim-kf-item strong{font-weight:500}
.anim-kf-item small{text-align:right;color:#7b98aa}
.anim-kf-empty{padding:7px 6px;color:#526b7c;font-size:9px;text-align:center}
.anim-keyframe-edit .field{margin-bottom:0}
.anim-keyframe-edit input{height:26px}

/* responsive */
@media(max-width:980px){
  .topbar{grid-template-columns:145px minmax(0,1fr) 96px;padding:0 4px}
  .top-right-tools .version-pill{display:none}
  .max-btn span:last-child{display:none}
}
@media(max-width:720px){
  .app-shell{grid-template-rows:88px 58vh 124px 28px}
  .app-shell:has(.animation-timeline.collapsed){grid-template-rows:88px 58vh 31px 28px}
  .topbar{grid-template-columns:100px minmax(0,1fr);grid-template-rows:30px 30px 28px}
  .brand{grid-column:1;grid-row:1/3}
  .menu-tools-line{grid-column:2;grid-row:1/3;flex-direction:column;align-items:stretch;gap:2px}
  .menu-tools-sep{display:none}
  .top-right-tools{display:none}
  .project-tabs-shell{grid-column:1/3;grid-row:3}
}


/* DjCreator2 v0.16.1 · correcciones menú/timeline/keyframes */
.topbar,.menu-tools-line,.menu-bar,.menu-root{overflow:visible!important}
.menu-tools-line{position:relative;z-index:6000}
.menu-bar{position:relative;z-index:7000}
.menu-dropdown{z-index:12000!important;top:21px}
.workspace{position:relative;z-index:1}
.icon-toolbar{position:relative;z-index:2;overflow-x:auto!important;overflow-y:hidden!important}

.animation-timeline{grid-template-rows:31px 23px 18px minmax(0,1fr)!important;height:150px}
.animation-timeline.collapsed{height:31px;grid-template-rows:31px 0 0 0!important}
.animation-timeline.collapsed .anim-scrubber,.animation-timeline.collapsed .anim-ruler,.animation-timeline.collapsed .anim-timeline-tracks{display:none}
.anim-timeline-head{grid-template-columns:auto auto minmax(90px,1fr) auto 58px 28px;gap:7px}
.anim-block-title{color:#58788c;font-size:8px;letter-spacing:.12em;white-space:nowrap}
.anim-scrubber{margin:0;padding:0 8px 0 92px;border-bottom:0}
.anim-ruler{height:18px;margin:0 8px 2px 92px;border-top:1px solid rgba(82,217,255,.13)}
.anim-ruler-tick.minor{height:4px;background:rgba(130,190,220,.17)}
.anim-ruler-tick.major{height:8px;background:rgba(130,190,220,.34)}
.anim-ruler-tick span{top:8px;font-size:7px;line-height:1;color:#607b8e;transform:translateX(-15%)}
.anim-ruler-current{top:-15px;line-height:13px;font-size:8px;z-index:2}
.anim-timeline-tracks{padding-top:1px}
.anim-key-marker{touch-action:none}
.anim-key-marker.dragging{z-index:8;cursor:ew-resize;box-shadow:0 0 0 2px rgba(255,255,255,.5),0 0 14px rgba(82,217,255,.7)}
.anim-keyframe-editor{display:flex;flex-direction:column;gap:5px;align-items:stretch}
.anim-keyframe-tools{display:flex;flex-direction:row;gap:4px}
.anim-keyframe-tools button{width:28px;height:24px}
.anim-keyframe-list{max-height:80px}
.anim-keyframe-edit{display:block;width:100%}
.anim-keyframe-edit .field{display:flex!important;flex-direction:column!important;gap:3px!important;width:100%;margin:0}
.anim-keyframe-edit .field>span{display:block;width:100%;font-size:9px}
.anim-keyframe-edit input{display:block;width:100%;height:26px}
@media(max-width:980px){
 .menu-tools-line{overflow:visible!important}.menu-bar{overflow:visible!important}.menu-dropdown{position:absolute!important;top:21px!important}
 .anim-timeline-head{grid-template-columns:auto minmax(82px,1fr) auto 50px 26px}.anim-block-title{display:none}
}

/* DjCreator2 v0.16.2 · contexto + paneles directos + timeline estática */
.menu-item:disabled,.context-menu button:disabled{opacity:.34;cursor:default;background:transparent!important;color:#597181!important}
.anim-clip-field{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}
.anim-clip-label{font-size:10px;color:#698296}
.anim-clip-row{display:grid;grid-template-columns:auto minmax(0,1fr) 28px;gap:4px;align-items:center}
.anim-clip-row button{height:28px;padding:0 7px;border:1px solid rgba(82,217,255,.15);border-radius:6px;background:#0a1825;color:#91b4c6;font-size:10px;cursor:pointer;white-space:nowrap}
.anim-clip-row button.danger{color:#ff9cb0}.anim-clip-row button:disabled{opacity:.34;cursor:default}
.anim-clip-row select{min-width:0;height:28px;border:1px solid rgba(82,217,255,.12);border-radius:6px;background:#07101b;color:#cfe8f5;padding:0 5px;font-size:10px}
.anim-ruler{cursor:ew-resize;touch-action:none;user-select:none}
.anim-ruler-current{pointer-events:none}
.anim-timeline-tracks{overflow:hidden!important;scrollbar-width:none!important}
.anim-timeline-tracks::-webkit-scrollbar{display:none}
.anim-component-tracks-scroll{max-height:42px;overflow-y:auto;overflow-x:hidden;margin-top:2px;padding-right:2px;scrollbar-width:thin;scrollbar-color:#17415a transparent}

.context-menu{position:fixed;z-index:30000;width:202px;padding:5px;border:1px solid rgba(82,217,255,.22);border-radius:7px;background:#07131f;box-shadow:0 18px 48px rgba(0,0,0,.62);backdrop-filter:blur(6px)}
.context-menu[hidden]{display:none!important}
.context-menu button{width:100%;height:27px;display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:5px;padding:0 7px;border:0;border-radius:4px;background:transparent;color:#8faaba;font-size:10px;text-align:left;cursor:pointer}
.context-menu button:hover{color:#f0fbff;background:rgba(82,217,255,.08)}
.context-menu button.danger:hover{color:#ff9eb2;background:rgba(255,101,136,.08)}
.context-menu button kbd{font:400 8px/1 system-ui;color:#536f80}
.context-divider{height:1px;margin:4px 3px;background:rgba(82,217,255,.11)}

/* DjCreator2 v0.17 · Forma libre compacta + dock inferior por pestañas + Cinema */
.freepath-actions{grid-template-columns:1.08fr .96fr .96fr;gap:4px}
.freepath-action-btn{height:30px;padding:0 7px;font-size:11px;font-weight:400!important;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:clip}

/* El espacio inferior ahora es un dock, no una fila fija de timeline. */
.app-shell{grid-template-rows:74px minmax(0,1fr) auto 28px!important}
.bottom-dock{position:relative;z-index:30;height:174px;padding-top:23px;border-top:1px solid rgba(82,217,255,.12);background:#050d16;transition:height .16s ease}
.bottom-dock[data-open="none"]{height:23px;padding-top:23px;background:#050c15}
.dock-tabs{position:absolute;left:8px;top:-23px;height:23px;display:flex;align-items:flex-end;gap:3px;z-index:40}
.dock-tab{height:23px;display:flex;align-items:center;gap:6px;padding:0 9px;border:1px solid rgba(82,217,255,.16);border-bottom:0;border-radius:6px 6px 0 0;background:#06101a;color:#66879a;font-size:9px;letter-spacing:.08em;cursor:pointer}
.dock-tab:hover{color:#dff7ff;background:#081824}.dock-tab.active{color:#aeefff;background:#091927;border-color:rgba(82,217,255,.30)}
.dock-arrow{font-style:normal;font-size:9px;color:#58cde9}.dock-pane{height:151px;min-height:0}.dock-pane[hidden]{display:none!important}
.bottom-dock[data-open="none"] .dock-pane{display:none!important}

/* El antiguo botón de minimizar deja de existir. */
.anim-timeline-toggle{display:none!important}
.animation-timeline{height:151px!important;min-height:0;padding:5px 10px 7px;grid-template-rows:29px 20px 18px minmax(0,1fr)!important;border:0!important}
.anim-timeline-head{grid-template-columns:auto auto minmax(90px,1fr) auto 54px!important}
.anim-block-title{display:inline!important}
.anim-timeline-tracks{overflow:hidden!important}

/* Cinema: biblioteca a la izquierda y secuenciador multipista a la derecha. */
.cinema-block{height:151px;display:grid;grid-template-rows:29px minmax(0,1fr);overflow:hidden;background:linear-gradient(180deg,#07121d,#050c14)}
.cinema-head{display:grid;grid-template-columns:70px auto minmax(110px,1fr) 54px 28px 28px;gap:6px;align-items:center;padding:2px 10px;border-bottom:1px solid rgba(82,217,255,.10)}
.cinema-head>strong{font-size:9px;letter-spacing:.13em;color:#7397aa}
.cinema-playback-controls{display:flex;gap:3px}.cinema-playback-controls button,.cinema-head>button{width:26px;height:24px;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:#081824;color:#7fa5b8;font-size:11px;cursor:pointer}
.cinema-playback-controls button:hover,.cinema-head>button:hover{color:#e9fbff;border-color:rgba(82,217,255,.28)}
.cinema-playback-controls button.active{color:#5edcff;background:rgba(82,217,255,.09)}
.cinema-playback-controls button:disabled,.cinema-head>button:disabled{opacity:.3;cursor:default}
.cinema-head>button.danger{color:#ff91a9}.cinema-head output{justify-self:end;color:#82a6b8;font-size:9px}.cinema-head select{height:24px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07111b;color:#83a8ba;font-size:9px;padding:0 3px}
.cinema-body{min-height:0;display:grid;grid-template-columns:230px minmax(320px,1fr)}
.cinema-library{min-width:0;min-height:0;border-right:1px solid rgba(82,217,255,.10);display:grid;grid-template-rows:21px minmax(0,1fr);background:rgba(7,18,29,.82)}
.cinema-pane-title{display:flex;align-items:center;justify-content:space-between;padding:0 8px;color:#66869a;font-size:8px;letter-spacing:.09em;border-bottom:1px solid rgba(82,217,255,.07)}
.cinema-pane-title small{color:#3f6175;font-size:8px;letter-spacing:0}
.cinema-clip-tree{min-height:0;overflow-y:auto;padding:4px 5px;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.cinema-tree-object{height:20px;display:flex;align-items:center;gap:4px;padding-left:calc(var(--depth) * 10px);color:#7d9bad;font-size:9px}.cinema-tree-object span{color:#4d7389}.cinema-tree-object strong{font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cinema-tree-clip{width:calc(100% - 2px);height:23px;display:grid;grid-template-columns:16px minmax(0,1fr) 38px;align-items:center;margin:1px;padding:0 5px 0 calc(6px + var(--depth) * 10px);border:1px solid transparent;border-radius:4px;background:rgba(82,217,255,.025);color:#86a8ba;text-align:left;font-size:9px;cursor:grab}
.cinema-tree-clip:hover{border-color:rgba(82,217,255,.18);background:rgba(82,217,255,.07);color:#dff8ff}.cinema-tree-clip:active{cursor:grabbing}.cinema-tree-clip b{font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cinema-tree-clip small{text-align:right;color:#506f82;font-size:8px}
.cinema-empty{padding:10px 8px;color:#4c6879;font-size:9px;line-height:1.45;text-align:center}
.cinema-sequencer{min-width:0;min-height:0;display:grid;grid-template-rows:20px minmax(0,1fr);overflow:hidden}
.cinema-ruler{position:relative;margin-left:106px;border-bottom:1px solid rgba(82,217,255,.10);cursor:ew-resize;user-select:none;touch-action:none}
.cinema-ruler-tick{position:absolute;bottom:0;width:1px;background:rgba(125,184,214,.18)}.cinema-ruler-tick.minor{height:4px}.cinema-ruler-tick.major{height:8px;background:rgba(125,184,214,.34)}
.cinema-ruler-tick span{position:absolute;bottom:8px;left:2px;color:#536f81;font-size:7px;line-height:1;white-space:nowrap}
.cinema-playhead{position:absolute;top:0;bottom:0;width:1px;background:#58d8ff;z-index:8;pointer-events:none;box-shadow:0 0 5px rgba(82,217,255,.4)}.cinema-playhead i{position:absolute;top:0;left:-3px;width:7px;height:6px;background:#58d8ff;clip-path:polygon(0 0,100% 0,50% 100%)}
.cinema-lanes{min-height:0;overflow-y:auto;overflow-x:hidden;padding:2px 0 3px;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.cinema-lane-row{height:29px;display:grid;grid-template-columns:106px minmax(0,1fr);border-bottom:1px solid rgba(82,217,255,.045)}
.cinema-lane-label{display:flex;align-items:center;padding:0 7px;color:#607f92;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid rgba(82,217,255,.07)}
.cinema-lane{position:relative;min-width:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 9.9%,rgba(82,217,255,.025) 10%,transparent 10.1%);cursor:crosshair}
.cinema-clip-block{position:absolute;top:3px;height:22px;min-width:18px;display:flex;align-items:center;justify-content:space-between;gap:5px;padding:0 5px;border:1px solid rgba(112,205,239,.27);border-radius:4px;background:linear-gradient(90deg,rgba(35,121,155,.55),rgba(91,74,157,.48));color:#e1f8ff;font-size:8px;cursor:ew-resize;overflow:hidden;touch-action:none}
.cinema-clip-block span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cinema-clip-block small{flex:0 0 auto;color:#9ec3d4;font-size:7px}.cinema-clip-block.selected{outline:1px solid rgba(255,255,255,.65);box-shadow:0 0 9px rgba(82,217,255,.35)}.cinema-clip-block.locked{opacity:.56;cursor:default}.cinema-clip-block.dragging{z-index:9;box-shadow:0 0 0 1px #fff,0 0 12px rgba(82,217,255,.55)}
.cinema-timeline-empty{margin-top:20px}

@media(max-width:980px){.cinema-body{grid-template-columns:185px minmax(260px,1fr)}.cinema-lane-row{grid-template-columns:86px minmax(0,1fr)}.cinema-ruler{margin-left:86px}.cinema-head{grid-template-columns:55px auto minmax(80px,1fr) 48px 26px 26px}}
@media(max-width:720px){.bottom-dock{height:160px}.dock-pane{height:137px}.animation-timeline,.cinema-block{height:137px!important}.cinema-body{grid-template-columns:145px minmax(240px,1fr)}.cinema-library{overflow:hidden}.cinema-head>strong{display:none}.cinema-head{grid-template-columns:auto minmax(80px,1fr) 45px 25px 25px}.cinema-lane-row{grid-template-columns:72px minmax(0,1fr)}.cinema-ruler{margin-left:72px}}
/* v0.17 dock tabs remain attached to the statusbar and the panels grow upward. */
.bottom-dock{padding-top:0!important;padding-bottom:23px!important}
.bottom-dock[data-open="none"]{padding-top:0!important;padding-bottom:23px!important}
.dock-tabs{top:auto!important;bottom:0!important;align-items:flex-start}
.dock-tab{border-bottom:1px solid rgba(82,217,255,.16);border-top:0;border-radius:0 0 6px 6px}
.dock-tab.active{border-color:rgba(82,217,255,.30)}
/* Tabs emerge upward from the status bar. */
.dock-tab{border-top:1px solid rgba(82,217,255,.16)!important;border-bottom:0!important;border-radius:6px 6px 0 0!important}
@media(max-width:980px){.app-shell{grid-template-rows:82px minmax(0,1fr) auto 28px!important}}
@media(max-width:720px){.app-shell{grid-template-rows:88px 58vh auto 28px!important;height:auto;min-height:100vh}}

/* DjCreator2 v0.17.1 · tabs dentro de statusbar, drag preciso y Forma libre compacta */
.app-shell{grid-template-rows:74px minmax(0,1fr) auto 28px!important}
.bottom-dock{height:151px!important;padding:0!important;border-top:1px solid rgba(82,217,255,.12)!important;overflow:hidden;background:#050d16}
.bottom-dock[data-open="none"]{height:0!important;min-height:0!important;padding:0!important;border-top:0!important;background:#050c15}
.dock-pane{height:151px!important}
.statusbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;padding:0 8px!important;overflow:visible}
#statusText{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sceneStats{justify-self:end;white-space:nowrap}
.status-dock-tabs{height:28px;display:flex;align-items:flex-end;justify-content:center;gap:3px;align-self:stretch}
.status-dock-tabs .dock-tab{height:27px;min-width:82px;padding:0 10px;border:1px solid rgba(82,217,255,.16)!important;border-bottom:0!important;border-radius:6px 6px 0 0!important;background:#06101a;color:#66879a;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.status-dock-tabs .dock-tab:hover{color:#dff7ff;background:#081824}
.status-dock-tabs .dock-tab.active{color:#aeefff;background:#091927;border-color:rgba(82,217,255,.30)!important}
.status-dock-tabs .dock-arrow{font-style:normal;color:#58cde9}

/* Las tres pistas raíz son siempre visibles y no generan scroll. */
.anim-timeline-tracks{overflow:hidden!important;min-height:0}
.anim-track-row:not(.component){flex:0 0 auto}

/* El scrub del tiempo usa toda la regla como superficie de arrastre. */
.anim-ruler{cursor:ew-resize!important;touch-action:none!important;user-select:none!important}
.anim-ruler.scrubbing{cursor:grabbing!important}
.anim-ruler-current{pointer-events:none!important}

/* Forma libre: usa todo el ancho del grid y tres botones en una sola línea. */
.freepath-controls{grid-column:1/-1!important;width:100%;gap:4px!important;margin:0 0 2px!important}
.freepath-summary{gap:5px!important}
.freepath-actions{display:grid!important;grid-template-columns:1.12fr 1fr 1fr!important;gap:3px!important;width:100%}
.freepath-action-btn{min-width:0!important;height:32px!important;padding:0 5px!important;font-weight:400!important;letter-spacing:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
.freepath-tip{padding-bottom:0!important;line-height:1.2!important}
#geometrySection .geometry-fields{align-content:start}

@media(max-width:980px){
  .statusbar{grid-template-columns:minmax(0,1fr) auto auto;gap:5px}
  .status-dock-tabs .dock-tab{min-width:70px;padding:0 7px}
}
@media(max-width:720px){
  .statusbar{grid-template-columns:1fr auto;padding:0 5px!important}
  #sceneStats{display:none}
  .status-dock-tabs .dock-tab{min-width:62px;padding:0 5px}
}


/* DjCreator2 v0.17.2 · color animation + menu/tabs spacing refinements */
/* Menu +1 px respecto a v0.17.1. */
.menu-button,.menu-item{font-size:11px!important}
.menu-caption,.menu-list-header{font-size:9px!important}
.menu-item kbd,.menu-caption kbd{font-size:9px!important}
.menu-list-item{font-size:10px!important}
.menu-list-item small{font-size:8px!important}

/* Cabecera más compacta: menos aire entre menú/herramientas y tabs de proyecto. */
.app-shell{grid-template-rows:68px minmax(0,1fr) auto 28px!important}
.topbar{grid-template-rows:42px 26px!important}
.project-tabs-shell,.project-tabs{height:26px!important}
.menu-tools-line{align-self:end;padding-bottom:1px}

/* Tabs inferiores alineados a la izquierda dentro de la propia barra de estado. */
.statusbar{display:flex!important;align-items:center!important;gap:7px!important}
.status-dock-tabs{order:-1;flex:0 0 auto;justify-content:flex-start!important;align-items:flex-end!important;margin-left:0!important}
#statusText{flex:1 1 auto}
#sceneStats{flex:0 0 auto;margin-left:auto}

/* El valor del playhead queda por encima de la línea y más legible. */
.anim-ruler-current{top:-19px!important;font-size:9px!important;line-height:15px!important;padding:0 4px!important;z-index:4!important}

/* Pista de color. */
.anim-key-marker.color{background:#ffd65a!important}
.anim-track-row.color .anim-track-label{color:#c9ad63}

@media(max-width:980px){
  .menu-button,.menu-item{font-size:10px!important}
  .app-shell{grid-template-rows:68px minmax(0,1fr) auto 28px!important}
  .topbar{grid-template-rows:42px 26px!important}
}
@media(max-width:720px){
  .menu-button,.menu-item{font-size:10px!important}
  .app-shell{grid-template-rows:82px 58vh auto 28px!important}
}
.anim-key-actions{grid-template-columns:1.55fr repeat(4,.72fr) 1.15fr!important;gap:3px!important}
.animation-timeline .anim-track-row:not(.component){min-height:17px!important}
.animation-timeline .anim-track-lane{height:12px!important}

/* DjCreator2 v0.17.3 · tabs hacia arriba + Cinema duration/zoom */
/* Menú +1 px adicional, compensado con un poco menos de padding horizontal. */
.menu-button,.menu-item{font-size:12px!important}
.menu-button{padding-left:5px!important;padding-right:5px!important}
.menu-caption,.menu-list-header{font-size:10px!important}
.menu-item kbd,.menu-caption kbd{font-size:10px!important}
.menu-list-item{font-size:11px!important}
.menu-list-item small{font-size:9px!important}

/* Las pestañas siguen dentro de la barra de estado pero sobresalen hacia arriba. */
.status-dock-tabs{align-items:flex-start!important;overflow:visible!important;height:28px!important}
.status-dock-tabs .dock-tab{position:relative;top:-5px;height:32px!important;border-bottom:1px solid #050c15!important;border-top:1px solid rgba(82,217,255,.24)!important;border-radius:7px 7px 0 0!important;background:#07131f!important}
.status-dock-tabs .dock-tab.active{background:#091927!important;border-top-color:rgba(82,217,255,.42)!important}

/* El texto del tiempo queda debajo y desplazado del punto/indicador para no taparlo. */
.anim-ruler{height:25px!important;margin-bottom:0!important}
.anim-ruler-current{top:13px!important;transform:translateX(7px)!important;font-size:10px!important;line-height:12px!important;padding:0 4px!important;z-index:5!important;background:rgba(5,16,26,.94)!important;border:1px solid rgba(82,217,255,.15)!important}

/* Cinema: duración máxima editable y escala temporal compacta. */
.cinema-head{grid-template-columns:54px auto 86px 86px 106px 50px 27px 27px!important;gap:4px!important;padding-left:7px!important;padding-right:7px!important;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.cinema-head::-webkit-scrollbar{display:none}
.cinema-head output{justify-self:stretch!important;text-align:right;white-space:nowrap;font-size:10px!important}
.cinema-duration-edit{height:24px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:3px;padding:0 4px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07111b;color:#68899c;font-size:9px;white-space:nowrap}
.cinema-duration-edit input{min-width:0;width:45px;height:19px;padding:0 3px;border:0;outline:0;background:transparent;color:#a8cad9;text-align:right;font-size:10px}
.cinema-duration-edit i{font-style:normal;color:#5b7889}
.cinema-zoom-controls{height:24px;display:grid;grid-template-columns:30px 46px 30px;align-items:center;border:1px solid rgba(82,217,255,.12);border-radius:5px;overflow:hidden;background:#07111b}
.cinema-zoom-controls button{height:22px;border:0;background:transparent;color:#7ea5b7;font-size:10px;cursor:pointer;padding:0}
.cinema-zoom-controls button:hover{color:#e9fbff;background:rgba(82,217,255,.07)}
.cinema-zoom-controls input{width:46px;height:22px;border:0;border-left:1px solid rgba(82,217,255,.08);border-right:1px solid rgba(82,217,255,.08);outline:0;background:#06101a;color:#9dc2d3;text-align:center;font-size:10px;padding:0 2px}
.cinema-block{overscroll-behavior:contain}

@media(max-width:1180px){
  .cinema-head{grid-template-columns:46px auto 80px 82px 100px 48px 26px 26px!important}
}
@media(max-width:980px){
  .menu-button,.menu-item{font-size:11px!important}
  .menu-caption,.menu-list-header,.menu-item kbd,.menu-caption kbd{font-size:9px!important}
  .cinema-head{grid-template-columns:auto 78px 80px 98px 46px 25px 25px!important}
  .cinema-head>strong{display:none}
}
@media(max-width:720px){
  .menu-button,.menu-item{font-size:11px!important}
  .cinema-head{grid-template-columns:auto 74px 78px 94px 44px 24px 24px!important}
}

/* DjCreator2 v0.17.5 · iconografía lineal + trayectorias editables */
.ui-icon{width:14px;height:14px;display:inline-block;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;flex:0 0 auto}
.menu-button{display:inline-flex!important;align-items:center!important;gap:4px!important}
.menu-item>svg,.menu-item>.ui-icon{margin-right:2px}
.icon-tool .ui-icon{width:15px;height:15px;vertical-align:0}
.tree-lock .ui-icon{width:13px;height:13px}
.menu-list-item>span{display:flex;align-items:center;gap:5px}
.menu-list-item .ui-icon{width:13px;height:13px}
.anim-keyframe-tools .ui-icon,#cinemaLock .ui-icon{width:13px;height:13px}
.cinema-zoom-controls .ui-icon{width:13px;height:13px;margin:auto}
.cinema-block .ui-icon{width:11px;height:11px;vertical-align:-2px}

/* Las nuevas formas de trayectoria usan el mismo editor compacto de puntos. */
#geometrySection .freepath-controls{margin-bottom:1px!important}
#geometrySection .freepath-actions{grid-template-columns:1.12fr 1fr 1fr!important;gap:3px!important}
#geometrySection .freepath-action-btn{height:32px!important;font-weight:400!important;white-space:nowrap!important}

/* DjCreator2 v0.19 · pivote tubular selectivo + movimiento físico de articulaciones */
.articulation-grid{display:flex;flex-direction:column;gap:6px}
.articulation-grid .field{margin-bottom:0}
.articulation-grid select{height:28px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07101b;color:#a8c6d5;padding:0 6px;font-size:10px;outline:none}
.art-use-selection{height:28px;border:1px solid rgba(82,217,255,.14);border-radius:6px;background:rgba(82,217,255,.04);color:#87aabd;font-size:9px;cursor:pointer}
.art-use-selection:hover,.art-action-row button:hover,.art-create:hover{color:#eafaff;border-color:rgba(82,217,255,.3)}
.art-pivot-title,.art-preset-title{margin-top:2px;color:#536f81;font-size:8px;letter-spacing:.1em}
.art-pivot-row{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.art-pivot-row input{min-width:0;height:27px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07101b;color:#cfe7f3;text-align:center;font-size:9px;outline:none}
.art-pivot-row input:disabled{opacity:.35}
.art-action-row{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.art-action-row button{height:27px;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:#081824;color:#789bad;font-size:9px;cursor:pointer}
.art-action-row button:disabled,.art-create:disabled{opacity:.3;cursor:default}
.art-note{color:#4d697a;font-size:8px;line-height:1.35}
.tree-item:has(.tree-type:first-child){--joint-accent:#58d8ff}
.cinema-clip-tree{overscroll-behavior:contain}
.cinema-sequencer{overscroll-behavior:contain}

/* v0.19 · ayuda visual de articulación */
.art-pivot-help{display:flex;flex-direction:column;gap:2px;padding:6px 7px;border:1px solid rgba(82,217,255,.11);border-radius:6px;background:rgba(82,217,255,.035);color:#607f91;font-size:8px;line-height:1.35}
.art-pivot-help b{color:#8fdcf2;font-size:8px;font-weight:500;letter-spacing:.04em}
.art-pivot-help span{display:block}
.tree-item.joint-row{border-left:2px solid rgba(88,216,255,.22);background:rgba(88,216,255,.018)}
.tree-item.joint-row .tree-type{color:#a4efff;text-shadow:0 0 7px rgba(88,216,255,.35)}
.tree-item.joint-row .tree-name{color:#79adbf}
.tree-item.joint-row.selected .tree-name{color:#e7fbff}

/* ========================================================================== */
/* DjCreator2 v0.20 · Generador IA v1                                         */
/* ========================================================================== */
.ai-menu-btn{color:#c9f5ff!important}.ai-menu-btn:hover,.ai-tool:hover{color:#fff!important;text-shadow:0 0 10px rgba(82,217,255,.55)}
.ai-tool{font-size:15px!important}.ai-tool .ui-icon{width:16px;height:16px}.ai-menu-btn .ui-icon{width:15px;height:15px;margin-right:3px}.brain-icon,.disk-arrow-icon,.ai-robot-icon,.group-selection-mode-icon{fill:none;stroke:currentColor}
.ai-dialog{width:min(720px,calc(100vw - 28px));max-height:min(760px,calc(100vh - 28px));padding:0;border:1px solid rgba(82,217,255,.28);border-radius:10px;background:#07131f;color:#d9edf5;box-shadow:0 26px 90px rgba(0,0,0,.7);overflow:hidden}
.ai-dialog::backdrop{background:rgba(0,5,12,.72);backdrop-filter:blur(2px)}
.ai-card{display:flex;flex-direction:column;max-height:min(760px,calc(100vh - 28px));background:linear-gradient(180deg,#091827,#06111c)}
.ai-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid rgba(82,217,255,.13);background:rgba(9,25,40,.94)}
.ai-header>div{display:flex;align-items:baseline;gap:9px;min-width:0}.ai-header strong{font-size:13px;letter-spacing:.035em;color:#effcff}.ai-header small{font-size:9px;color:#627f91;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-body{padding:12px 13px 10px;overflow:auto;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.ai-context-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;color:#6e8a9b;font-size:9px}.ai-badge{padding:3px 7px;border:1px solid rgba(82,217,255,.18);border-radius:999px;color:#80cce3;background:rgba(31,112,139,.10);white-space:nowrap}
.ai-prompt-label{display:block;margin-bottom:5px;font-size:10px;font-weight:600;color:#a9c6d5;letter-spacing:.04em}.ai-prompt{box-sizing:border-box;width:100%;min-height:96px;max-height:210px;resize:vertical;padding:10px 11px;border:1px solid rgba(82,217,255,.20);border-radius:8px;outline:none;background:#06101a;color:#dff7ff;font:400 11px/1.55 system-ui,sans-serif}.ai-prompt:focus{border-color:rgba(82,217,255,.48);box-shadow:0 0 0 2px rgba(82,217,255,.07)}.ai-prompt::placeholder{color:#456173}
.ai-examples{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.ai-examples button{height:25px;padding:0 8px;border:1px solid rgba(82,217,255,.13);border-radius:6px;background:#0a1b29;color:#7596a8;font-size:9px;cursor:pointer}.ai-examples button:hover{color:#dffaff;border-color:rgba(82,217,255,.32);background:#10273a}
.ai-help{margin-top:8px;padding:7px 8px;border-left:2px solid rgba(82,217,255,.28);background:rgba(82,217,255,.035);color:#617f91;font-size:9px;line-height:1.5}
.ai-plan-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-bottom:5px;border-bottom:1px solid rgba(82,217,255,.09)}.ai-plan-head strong{font-size:9px;letter-spacing:.11em;color:#7896a7}.ai-plan-head span{font-size:8px;color:#486274}
.ai-plan{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}.ai-plan li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:7px;min-height:30px;padding:3px 7px;border:1px solid rgba(82,217,255,.09);border-radius:6px;background:rgba(8,23,36,.72);font-size:10px}.ai-plan-number{display:grid;place-items:center;width:20px;height:20px;border-radius:4px;background:rgba(82,217,255,.08);color:#65bfd9;font-size:8px}.ai-plan-text{min-width:0;color:#a9c7d5}.ai-plan small{color:#405c6e;font-size:7px;white-space:nowrap}.ai-plan li.ai-plan-warning{display:block;min-height:auto;padding:6px 8px;border-color:rgba(255,190,70,.17);background:rgba(142,92,18,.08);color:#c6a46e;font-size:9px}
.ai-result{margin-top:8px;min-height:29px;display:flex;align-items:center;padding:5px 8px;border:1px solid rgba(82,217,255,.09);border-radius:6px;background:#071522;color:#668598;font-size:9px}.ai-result[data-kind="ok"]{color:#89c9a7;border-color:rgba(89,205,142,.18);background:rgba(35,113,76,.08)}.ai-result[data-kind="warning"]{color:#c9a86c;border-color:rgba(255,190,70,.17);background:rgba(142,92,18,.08)}.ai-result[data-kind="error"]{color:#d48d9c;border-color:rgba(255,101,136,.18);background:rgba(127,41,58,.08)}
.ai-actions{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:7px;padding:9px 13px 11px;border-top:1px solid rgba(82,217,255,.10);background:rgba(6,16,26,.96)}.ai-actions button{min-height:30px;padding:0 10px;border:1px solid rgba(82,217,255,.14);border-radius:6px;background:#0a1b29;color:#86a7b9;font-size:9px;cursor:pointer}.ai-actions button:hover:not(:disabled){color:#effcff;border-color:rgba(82,217,255,.34);background:#10283a}.ai-actions button.primary{color:#dffaff;border-color:rgba(82,217,255,.40);background:rgba(40,151,187,.17)}.ai-actions button:disabled{opacity:.34;cursor:default}
@media(max-width:700px){.ai-dialog{width:calc(100vw - 12px);max-height:calc(100vh - 12px)}.ai-card{max-height:calc(100vh - 12px)}.ai-header small{display:none}.ai-plan li{grid-template-columns:22px minmax(0,1fr)}.ai-plan small{display:none}.ai-actions{grid-template-columns:auto 1fr auto}.ai-actions>span{display:none}.ai-actions #aiExecute{grid-column:3}}

/* ========================================================================== */
/* DjCreator2 v0.21 · cabecera compacta + Resultados IA                       */
/* ========================================================================== */
.app-shell{grid-template-rows:70px minmax(0,1fr) auto 28px!important}
.topbar{
  grid-template-columns:205px minmax(0,1fr) 190px!important;
  grid-template-rows:22px 27px 21px!important;
  padding:0 7px!important;
  align-items:start!important;
}
.brand{grid-column:1!important;grid-row:1/3!important;align-self:center!important}
.menu-tools-line{
  grid-column:2!important;grid-row:1/3!important;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  gap:1px!important;padding:0!important;overflow:visible!important;min-width:0!important;
}
.menu-bar{grid-column:auto!important;grid-row:auto!important;height:22px!important;align-self:start!important;overflow:visible!important}
.menu-button{height:21px!important}
.menu-tools-sep{display:none!important}
.icon-toolbar{
  grid-column:auto!important;grid-row:auto!important;height:27px!important;min-height:27px!important;
  flex:0 0 27px!important;width:100%!important;padding:1px 3px!important;margin:0!important;
  border:1px solid rgba(82,217,255,.08)!important;border-radius:4px!important;
  background:rgba(7,19,31,.55)!important;overflow-x:auto!important;overflow-y:hidden!important;
}
.icon-tool{height:23px!important;min-width:25px!important}
.top-right-tools{grid-column:3!important;grid-row:1/3!important;align-self:center!important}
.project-tabs-shell{grid-column:1/4!important;grid-row:3!important;height:21px!important;align-self:stretch!important}
.project-tabs{height:21px!important;padding:0 1px!important;gap:2px!important}
.project-tab{height:20px!important;min-height:20px!important;padding:0 3px 0 6px!important;border-radius:5px 5px 0 0!important}
.project-tab-close{height:16px!important;width:16px!important;flex-basis:16px!important}
.project-tab-dirty{font-size:11px!important}

.ai-actions-single{grid-template-columns:auto 1fr auto!important}
.ai-actions-single #aiExecute{min-width:104px}
.ai-results-block{height:151px;display:flex;flex-direction:column;background:#06101a}
.ai-results-head{height:30px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:0 10px;border-bottom:1px solid rgba(82,217,255,.10)}
.ai-results-head strong{font-size:10px;letter-spacing:.10em;color:#91cfe0}.ai-results-head span{font-size:8px;color:#506d80}
.ai-results-head button{height:22px;padding:0 7px;border:1px solid rgba(82,217,255,.13);border-radius:5px;background:#0a1b29;color:#6f91a4;font-size:8px;cursor:pointer}
.ai-history{flex:1;overflow:auto;padding:6px 8px;display:flex;flex-direction:column;gap:5px;scrollbar-width:thin;scrollbar-color:#17415a transparent}
.ai-history-empty{padding:18px;color:#456173;font-size:9px;text-align:center}
.ai-history-entry{border:1px solid rgba(82,217,255,.09);border-radius:6px;background:rgba(8,23,36,.72);padding:6px 8px}
.ai-history-entry.error{border-color:rgba(255,101,136,.18);background:rgba(127,41,58,.07)}
.ai-history-entry.ok{border-color:rgba(89,205,142,.16);background:rgba(35,113,76,.06)}
.ai-history-meta{display:flex;justify-content:space-between;gap:8px;color:#4c6b7e;font-size:8px}.ai-history-prompt{margin-top:3px;color:#b6d3df;font-size:9px}.ai-history-plan{margin:4px 0 0;padding-left:16px;color:#7696a8;font-size:8px;line-height:1.45}.ai-history-message{margin-top:4px;color:#87b99c;font-size:8px}.ai-history-entry.error .ai-history-message{color:#d48d9c}

@media(max-width:980px){
  .app-shell{grid-template-rows:74px minmax(0,1fr) auto 28px!important}
  .topbar{grid-template-columns:145px minmax(0,1fr)!important;grid-template-rows:23px 29px 22px!important}
  .brand{grid-column:1!important;grid-row:1/3!important}.menu-tools-line{grid-column:2!important;grid-row:1/3!important}.top-right-tools{display:none!important}
  .project-tabs-shell{grid-column:1/3!important;grid-row:3!important;height:22px!important}.project-tabs{height:22px!important}.project-tab{height:21px!important}
}
@media(max-width:720px){
  .app-shell{grid-template-rows:78px 58vh auto 28px!important}
  .topbar{grid-template-columns:100px minmax(0,1fr)!important;grid-template-rows:24px 31px 23px!important}
  .brand small{display:none!important}.menu-bar{overflow-x:auto!important;overflow-y:visible!important}.icon-toolbar{height:30px!important;flex-basis:30px!important}
  .project-tabs-shell{height:23px!important}.project-tabs{height:23px!important}.project-tab{height:22px!important}
}

/* v0.23 · AI Provider Manager */
.ai-provider-settings{margin:0 0 9px;border:1px solid rgba(82,217,255,.12);border-radius:7px;background:rgba(7,24,38,.62);overflow:hidden}
.ai-provider-settings>summary{cursor:pointer;list-style:none;padding:6px 8px;color:#79a9bb;font-size:9px;font-weight:700;letter-spacing:.04em;user-select:none}
.ai-provider-settings>summary::-webkit-details-marker{display:none}.ai-provider-settings>summary:after{content:'▾';float:right;color:#4d8095}.ai-provider-settings[open]>summary:after{content:'▴'}
.ai-provider-grid{display:grid;grid-template-columns:1fr 1.35fr 1fr auto;gap:6px;padding:0 8px 7px;align-items:end}.ai-provider-grid label{display:grid;gap:3px;min-width:0}.ai-provider-grid label span{font-size:8px;color:#55788a}.ai-provider-grid select,.ai-provider-grid input{min-width:0;height:28px;border:1px solid rgba(82,217,255,.14);border-radius:5px;background:#07111c;color:#bcd7e2;padding:0 7px;font:inherit;font-size:9px}.ai-provider-grid button{height:28px;border:1px solid rgba(82,217,255,.18);border-radius:5px;background:#0b2131;color:#81c9df;font-size:9px;padding:0 9px;white-space:nowrap}.ai-provider-status{padding:5px 8px 7px;border-top:1px solid rgba(82,217,255,.07);color:#5f8394;font-size:8px;line-height:1.4}.ai-provider-status.ok{color:#76b995}.ai-provider-status.error{color:#d08c9b}
.ai-history-provider{margin-top:3px;color:#56879b;font-size:8px;font-weight:700}.ai-history-validation{margin-top:4px;color:#6e93a4;font-size:8px}
@media(max-width:760px){.ai-provider-grid{grid-template-columns:1fr 1fr}.ai-provider-grid button{grid-column:2}.ai-provider-grid label:nth-child(2){grid-column:1 / -1}}

/* v0.24 · WebLLM local en navegador */
.ai-provider-grid{grid-template-columns:1fr 1fr 1.35fr auto}
.ai-webllm-actions{display:flex;gap:5px;align-items:end;flex-wrap:wrap}
.ai-webllm-actions button{height:28px;border:1px solid rgba(82,217,255,.18);border-radius:5px;background:#0b2131;color:#81c9df;font-size:8px;padding:0 8px;white-space:nowrap}
.ai-webllm-actions button:disabled{opacity:.42;cursor:not-allowed}
.ai-webllm-progress{grid-column:1/-1;position:relative;min-height:26px;border:1px solid rgba(82,217,255,.11);border-radius:5px;background:#06131f;overflow:hidden;display:flex;align-items:center}
.ai-webllm-progress>div{position:absolute;inset:0 auto 0 0;width:0%;background:rgba(44,164,202,.13);transition:width .15s linear}
.ai-webllm-progress>span{position:relative;z-index:1;padding:0 8px;color:#648a9d;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-webllm-progress.ready>div{background:rgba(64,180,119,.14)}.ai-webllm-progress.ready>span{color:#7abd99}.ai-webllm-progress.error>span{color:#d08c9b}
@media(max-width:760px){.ai-webllm-actions{grid-column:1/-1}.ai-webllm-progress{grid-column:1/-1}}

/* DjCreator2 v0.25 · carga modular de interfaz + IA local escalonada */
.reusable-progress{width:100%}.reusable-progress-track{height:8px;border:1px solid rgba(82,217,255,.16);border-radius:999px;background:#04101a;overflow:hidden}.reusable-progress-bar{height:100%;width:0;background:linear-gradient(90deg,rgba(58,180,222,.62),rgba(107,226,255,.92));box-shadow:0 0 9px rgba(82,217,255,.22);transition:width .16s linear}.reusable-progress-meta{display:flex;justify-content:space-between;gap:12px;margin-top:7px;color:#6f8fa2;font-size:9px}.reusable-progress-meta strong{color:#8cdcf1;font-weight:600;white-space:nowrap}

.status-ai-loader{margin-left:auto;width:200px;min-width:200px;height:20px;display:grid;grid-template-columns:auto minmax(65px,1fr) 28px;align-items:center;gap:5px;padding:0 5px;border:1px solid rgba(82,217,255,.11);border-radius:5px;background:#06111b;color:#648597;overflow:hidden}
.status-ai-label{max-width:78px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px}.status-ai-track{height:5px;border-radius:999px;background:#0b2231;overflow:hidden}.status-ai-track>div{height:100%;width:0;background:#4fccea;transition:width .14s linear}.status-ai-pct{font-size:8px;text-align:right;color:#7eb8ca}
.status-ai-loader.ready .status-ai-track>div{background:#58c88a}.status-ai-loader.ready{border-color:rgba(88,200,138,.18)}.status-ai-loader.error{border-color:rgba(230,108,132,.18)}.status-ai-loader.error .status-ai-track>div{background:#d1667c}
#sceneStats{margin-left:0!important}

.ai-local-status{padding:10px;border:1px solid rgba(82,217,255,.13);border-radius:7px;background:#06131f}.ai-local-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.ai-local-title strong{color:#a9eaff;font-size:11px}.ai-local-title span{color:#5e7d90;font-size:8px}.ai-local-progress .reusable-progress-track{height:7px}.ai-local-note{margin-top:8px;color:#607f91;font-size:8px;line-height:1.45}.ai-local-status.ready{border-color:rgba(88,200,138,.2)}.ai-local-status.error{border-color:rgba(220,96,122,.2)}

@media(max-width:980px){.status-ai-loader{width:170px;min-width:170px}.status-ai-label{max-width:60px}}
@media(max-width:760px){.status-ai-loader{display:none}.ai-local-title{align-items:flex-start;flex-direction:column;gap:3px}}

/* DjCreator2 v0.25.3 · versión visible + arranque recuperable */
.deployed-version{font-size:.62em!important;font-weight:500!important;color:#6f8798!important;letter-spacing:.02em!important;vertical-align:baseline;white-space:nowrap}


/* DjCreator2 v0.26 · articulaciones orientables/limitadas + fallback panel IA */
.art-motion-row{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.art-motion-row label,.art-limit-row label{display:flex;flex-direction:column;gap:3px;color:#617f91;font-size:8px}
.art-motion-row select,.art-limit-row input{width:100%;height:27px;border:1px solid rgba(82,217,255,.12);border-radius:5px;background:#07101b;color:#cfe7f3;padding:0 6px;font-size:9px;outline:none}
.art-limit-row{display:grid;grid-template-columns:1fr 1fr 64px;gap:5px;align-items:end}
.art-limit-row button{height:27px;border:1px solid rgba(82,217,255,.15);border-radius:5px;background:#081824;color:#8eb7c9;font-size:9px;cursor:pointer}
.art-current-angle{padding:4px 6px;border-radius:5px;background:rgba(82,217,255,.035);color:#5f7f92;font-size:8px}.art-current-angle strong{color:#a8e8f9;font-weight:500}
.art-motion-row select:disabled,.art-limit-row input:disabled,.art-limit-row button:disabled{opacity:.35;cursor:default}
.ai-dialog.ai-dialog-fallback{display:block!important;position:fixed!important;inset:50% auto auto 50%!important;transform:translate(-50%,-50%)!important;z-index:5000!important;margin:0!important}

/* v0.27 · nombres únicos */
#nameField.name-conflict{border-color:#ff6b6b!important;box-shadow:0 0 0 1px rgba(255,107,107,.35) inset;}

/* v0.28 · IA local: ocultar barras cuando la carga ha finalizado */
.status-ai-loader.complete{width:auto!important;min-width:0!important;grid-template-columns:auto!important;padding:0 7px!important;color:#75cfa1!important}
.status-ai-loader.complete .status-ai-track,.status-ai-loader.complete .status-ai-pct{display:none!important}
.ai-local-status.complete{display:none!important}
.ai-context-row #aiContext{color:#8fb7ca}

/* v0.30 · estado visible de ejecución IA */
.ai-run-status{margin-top:9px;display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px 9px;border:1px solid rgba(82,217,255,.16);border-radius:7px;background:rgba(5,19,31,.88);color:#9bdcef}
.ai-run-status[hidden]{display:none!important}.ai-run-spinner{width:14px;height:14px;border:2px solid rgba(108,207,239,.22);border-top-color:#73d9f6;border-radius:50%;animation:aiRunSpin .8s linear infinite}.ai-run-copy{display:grid;gap:2px;min-width:0}.ai-run-copy strong{font-size:9px;color:#c8f1ff}.ai-run-copy small{font-size:8px;color:#678b9d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ai-run-elapsed{font-size:8px;color:#608294;font-variant-numeric:tabular-nums}.ai-run-track{grid-column:1/-1;height:3px;border-radius:99px;background:rgba(82,217,255,.08);overflow:hidden}.ai-run-track>div{height:100%;width:24%;border-radius:inherit;background:#56cdeb;transition:width .18s ease}.ai-run-status.indeterminate .ai-run-track>div{width:32%;animation:aiRunSlide 1.15s ease-in-out infinite}.ai-run-status.success .ai-run-spinner{animation:none;border-color:#58c88a;background:#58c88a}.ai-run-status.error{border-color:rgba(220,96,122,.25)}.ai-run-status.error .ai-run-spinner{animation:none;border-color:#d1667c;background:#d1667c}
@keyframes aiRunSpin{to{transform:rotate(360deg)}}
@keyframes aiRunSlide{0%{transform:translateX(-120%)}50%{transform:translateX(190%)}100%{transform:translateX(360%)}}


/* DjCreator2 v0.33 · Learning Backend */
.learning-backend-status{flex:0 0 auto;max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 6px;border:1px solid rgba(82,217,255,.10);border-radius:4px;color:#607f91;font-size:8px;background:#06111b}
.learning-backend-status[data-state="ok"]{color:#78bd99;border-color:rgba(88,200,138,.18)}
.learning-backend-status[data-state="offline"]{color:#c7a06a;border-color:rgba(230,173,90,.16)}
.learning-backend-status[data-state="error"]{color:#d58b9b;border-color:rgba(230,108,132,.18)}
@media(max-width:900px){.learning-backend-status{display:none}}

/* v0.33: el indicador conserva su apariencia y además abre diagnóstico al pulsarlo. */
button.learning-backend-status{appearance:none;font-family:inherit;cursor:pointer;}
button.learning-backend-status:hover{text-decoration:underline;}

/* ========================================================================== */
/* DjCreator2 v0.37 · Resultados IA +2 px                                      */
/* ========================================================================== */
.ai-results-block .ai-results-head strong{font-size:12px!important}
.ai-results-block .ai-results-head span{font-size:10px!important}
.ai-results-block .ai-results-head button{font-size:10px!important}
.ai-results-block .ai-history-empty{font-size:11px!important}
.ai-results-block .ai-history-meta{font-size:10px!important}
.ai-results-block .ai-history-prompt{font-size:11px!important;line-height:1.4}
.ai-results-block .ai-history-plan{font-size:10px!important;line-height:1.5}
.ai-results-block .ai-history-message{font-size:10px!important;line-height:1.4}
.ai-results-block .ai-history-provider{font-size:10px!important}
.ai-results-block .ai-history-validation{font-size:10px!important}

/* DjCreator2 v0.38 · selección múltiple por rectángulo */
#viewport { position: relative; }
.box-selection-overlay {
  position:absolute;
  z-index:30;
  pointer-events:none;
  border:1px solid rgba(100,221,255,.95);
  background:rgba(100,221,255,.12);
  box-shadow:0 0 0 1px rgba(143,117,255,.28) inset;
}
#viewport canvas.box-select-cursor { cursor: crosshair !important; }
.icon-tool.box-select-active,
.menu-item.box-select-active { box-shadow: inset 0 0 0 1px rgba(100,221,255,.9); background:rgba(100,221,255,.16); }
.hand-select-icon { fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
/* DjCreator2 v0.38 · entrada reutilizable del modal */
.app-modal-input-label { display:flex; flex-direction:column; gap:6px; margin-top:14px; font-size:12px; opacity:.95; }
.app-modal-input { width:100%; box-sizing:border-box; padding:9px 10px; border-radius:7px; border:1px solid rgba(100,221,255,.35); background:#07111f; color:inherit; font:inherit; outline:none; }
.app-modal-input:focus { border-color:rgba(100,221,255,.9); box-shadow:0 0 0 2px rgba(100,221,255,.12); }

/* v0.41 · flechas verticales de importación/exportación más legibles */
.disk-arrow-icon .disk-arrow-mark{stroke-width:2.35;stroke-linecap:round;stroke-linejoin:round}

/* ========================================================================== */
/* DjCreator2 v0.42 · Pide ayuda a una IA                                    */
/* ========================================================================== */
.ai-mode-tabs{display:flex;gap:4px;padding:7px 10px 0;border-bottom:1px solid rgba(82,217,255,.10);background:#07131f}
.ai-mode-tab{height:29px;padding:0 11px;border:1px solid rgba(82,217,255,.12);border-bottom:none;border-radius:6px 6px 0 0;background:#081824;color:#64899b;font-size:9px;cursor:pointer}
.ai-mode-tab.active{color:#dffaff;border-color:rgba(82,217,255,.32);background:#0d2333}
.ai-mode-panel{min-height:0;overflow:hidden}.ai-mode-panel.active{display:flex;flex-direction:column;min-height:0}
.ai-mode-panel[hidden]{display:none!important}
.ai-header #aiDialogTitle{display:inline-flex;align-items:center;gap:6px}.ai-header #aiDialogTitle .ui-icon{width:15px;height:15px}
.external-ai-body{display:flex;flex-direction:column;gap:8px}
.external-ai-intro{display:grid;gap:3px;padding:9px 10px;border:1px solid rgba(82,217,255,.13);border-radius:7px;background:rgba(82,217,255,.035)}
.external-ai-intro strong,.external-ai-return-head strong{font-size:11px;color:#b9e9f7}.external-ai-intro span,.external-ai-return-head span{font-size:9px;line-height:1.45;color:#648294}
.external-ai-grid{display:grid;grid-template-columns:130px minmax(0,1fr);align-items:center;gap:9px}.external-ai-grid .ai-prompt-label{margin:0}
.external-ai-select{height:31px;border:1px solid rgba(82,217,255,.18);border-radius:6px;background:#06101a;color:#d5edf6;padding:0 8px;font-size:10px;outline:none}
.external-ai-request{min-height:68px}.external-ai-output{min-height:190px;max-height:280px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px;line-height:1.45;background:#050d15}.external-ai-response{min-height:145px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px}
.external-ai-generate-row,.external-ai-copy-row,.external-ai-return-actions,.external-ai-import-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.external-ai-generate-row button,.external-ai-copy-row button,.external-ai-return-actions button,.external-ai-import-row button{min-height:30px;padding:0 10px;border:1px solid rgba(82,217,255,.18);border-radius:6px;background:#0a1b29;color:#91b7c8;font-size:9px;cursor:pointer}
.external-ai-generate-row button.primary,.external-ai-import-row button.primary{color:#dffaff;border-color:rgba(82,217,255,.40);background:rgba(40,151,187,.17)}
.external-ai-generate-row small{color:#557385;font-size:8px}.external-ai-copy-row span{font-size:8px;color:#79bc98}.external-ai-copy-row .ui-icon{width:14px;height:14px;vertical-align:-3px}
.external-ai-return-head{display:grid;gap:2px;margin-top:4px;padding-top:9px;border-top:1px solid rgba(82,217,255,.10)}
.external-ai-note{margin-top:2px}
@media(max-width:700px){.ai-mode-tabs{overflow-x:auto}.ai-mode-tab{white-space:nowrap}.external-ai-grid{grid-template-columns:1fr;gap:4px}.external-ai-output{min-height:155px}}
.ai-mode-panel>.ai-body{flex:1;min-height:0}

/* DjCore v0.5 · estándar de identidad de producto */
.brand .dj-product-heading{display:inline-flex!important;align-items:baseline!important;gap:.35em!important;white-space:nowrap!important;line-height:1.1!important}
.brand .dj-product-heading .dj-product-version,
.brand strong>.deployed-version{display:inline!important;margin:0!important;white-space:nowrap!important;font-size:.66em!important;font-weight:500!important;color:var(--muted)!important;letter-spacing:.02em!important;vertical-align:baseline!important}
.brand .dj-product-subtitle{display:block!important;margin-top:2px!important}

/* DjCore v0.6 · contrato visual de identidad */
.brand .dj-product-heading{display:inline-flex!important;align-items:baseline!important;gap:.35em!important;white-space:nowrap!important}
.brand .dj-product-heading .dj-product-version{display:inline!important;margin:0!important}


/* DjCore v0.7 · controles estándar y firma compartida */
select:not([multiple]){
  min-width:0;height:28px;border:1px solid rgba(82,217,255,.14);border-radius:6px;
  background-color:#07111c;color:#cfe7f3;padding:0 27px 0 7px;font:inherit;font-size:10px;
  outline:none;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%237da9be' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center;background-size:10px 7px;
}
select:not([multiple]):hover:not(:disabled){border-color:rgba(82,217,255,.3);color:#e8faff;background-color:#091724}
select:not([multiple]):focus{border-color:rgba(82,217,255,.45);box-shadow:0 0 0 2px rgba(82,217,255,.055)}
select:not([multiple]):disabled{opacity:.38;cursor:default}
select:not([multiple]) option{background:#07111c;color:#cfe7f3}
.top-right-tools{display:flex;flex-wrap:wrap;align-content:center;justify-content:flex-end}
.djcore-powered{flex:0 0 100%;margin-top:2px;text-align:right;color:#607484;font-size:8px;line-height:1.05;white-space:nowrap}
.djcore-powered strong{color:#d5b53c;font-size:9px;font-weight:800;letter-spacing:.01em;text-shadow:0 0 8px rgba(213,181,60,.14)}
.djcore-powered span{color:#867b4d}
@media(max-width:720px){.djcore-powered{display:none}}

/* DjCore v0.15 · canonical action icons */
.dj-action-icon{color:inherit}
[data-dj-action]>.dj-action-icon{pointer-events:none;flex:0 0 auto}
