*{box-sizing:border-box}body{--bg:#080d14;--panel:#101823;--edge:#233246;--ink:#e3edf8;--muted:#8193a9;background:var(--bg);color:var(--ink);height:100vh;margin:0;display:flex;flex-direction:column;font-family:Inter,system-ui,sans-serif}html[data-bs-theme=light] body{--bg:#eaf0f6;--panel:#fff;--edge:#cad7e4;--ink:#142b43;--muted:#566b80}header{height:80px;flex-shrink:0;display:flex;gap:18px;align-items:center;padding:12px 25px;border-bottom:1px solid var(--edge)}header img{width:58px;height:55px;object-fit:contain}header b{font-size:21px;letter-spacing:2px}header b span{color:#29b6ff}header small{display:block;color:var(--muted);font-size:9px;letter-spacing:2.5px;margin-top:4px}.connection{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12px}i{width:7px;height:7px;border-radius:50%;background:#8193a9}i.online{background:#39e6ac;box-shadow:0 0 12px #39e6ac}main{flex:1;min-height:0;padding:16px;display:grid;grid-template-columns:minmax(340px,1fr) minmax(360px,1.2fr);grid-template-rows:minmax(330px,1fr) 205px;gap:14px}.panel{background:var(--panel);border:1px solid var(--edge);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;min-height:0;min-width:0}.bar{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;gap:12px}.bar small{color:#39b7ff;font-size:9px;letter-spacing:2px}.bar h2{font-size:17px;margin:4px 0 0}.bar select{width:170px}.btn{font-size:12px}.tools{display:flex;gap:8px;padding:10px 14px;align-items:center;border-top:1px solid var(--edge)}.tools .form-control{min-width:60px}.editor-panel{resize:horizontal;max-width:100%;min-width:340px}#editor{flex:1;min-height:100px}#apply{margin-left:auto}.muted{color:var(--muted);font-size:12px}#tree-space{position:relative;flex:1;min-height:100px;background:radial-gradient(ellipse at 50% 95%,#0875a521,transparent 70%)}#tree{height:100%;width:100%;touch-action:none;cursor:grab}#empty{position:absolute;top:45%;text-align:center;width:100%;color:var(--muted);pointer-events:none}#empty small{font-size:11px}#tree text{fill:var(--ink);font-size:16px;font-weight:500;paint-order:stroke;stroke:var(--panel);stroke-width:3px;stroke-linejoin:round}#tree .node{cursor:pointer}#tree .node:hover circle{stroke:#fff;stroke-width:3}#detail{padding:10px 16px;border-top:1px solid var(--edge);font:11px monospace;color:var(--muted);max-height:100px;overflow:auto;white-space:pre-wrap}#structure{flex:1;overflow:auto;padding:10px 20px;font:12px monospace}#structure details{margin-left:16px}#structure summary{padding:5px;cursor:pointer}.command{display:flex;gap:10px;align-items:center;padding:6px 18px}.command span{color:#24b9ff}.command input{flex:1;min-width:60px;background:var(--bg);color:var(--ink);border:1px solid var(--edge);padding:12px;border-radius:6px;font:13px monospace}#contracts{padding:8px 18px;overflow:auto;color:var(--muted);font:11px monospace;line-height:1.8}#results{overflow:auto;padding:0 18px 12px;font:12px monospace}#results pre{background:transparent;color:inherit;padding:4px 0;white-space:pre-wrap;margin:0}.entry{border-bottom:1px solid var(--edge);padding:8px 0}.ok{color:#40e3ae}.bad{color:#ff647a}footer{padding:4px 20px 12px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted);letter-spacing:1px}@media(max-width:800px){body{height:auto}main{display:flex;flex-direction:column}.editor-panel,.tree-panel{height:480px}.console-panel,.result-panel{min-height:190px}.connection{display:none}}
.filebar{display:flex;gap:6px;padding:0 14px 8px}.filebar select{min-width:80px;font-size:12px}#filename{font:11px monospace;color:var(--muted);padding:0 18px 10px}.tools{flex-wrap:wrap}#catalog-panel{border-top:1px solid var(--edge);padding:8px 16px;font-size:12px;max-height:190px;overflow:auto}#catalog-panel summary{cursor:pointer;color:#29b6ff}#catalog{padding:10px 0;display:grid;gap:5px}#catalog button{text-align:left;white-space:normal}#detail button{margin:5px}#tree .node:focus{outline:none}#tree .node:focus circle{stroke:#ffd66e}#tree .new-node{stroke:#45ffb7;stroke-width:5}.change-list{max-height:130px;overflow:auto;font-size:11px}.console-panel{min-height:0}#detail{max-height:150px}.result-panel .bar{padding-bottom:8px}

.tree-panel .tools .form-control{flex:1;width:auto}

.panel.expanded{position:fixed;inset:10px;z-index:100;width:auto;height:auto;max-width:none;resize:none;box-shadow:0 0 0 30px #000b}#tree-space{overflow:hidden}#tree{display:block}#tree .node text{pointer-events:none}

.panel-expand{flex-shrink:0;margin-left:auto}.panel-is-expanded{overflow:hidden}.panel.expanded #results,.panel.expanded #contracts{flex:1;min-height:0}.panel.expanded .bar{flex-shrink:0}

.pin-palette{display:flex;align-items:center;gap:8px;margin-top:8px}.pin-choice{width:23px;height:23px;border:2px solid transparent;border-radius:50%;padding:0;cursor:pointer}.pin-choice[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:2px}#back-map{margin:0 14px 8px;align-self:flex-start}

/* Persianas independientes; no se impone la misma altura a ambas columnas. */
main{grid-template-rows:minmax(0,1fr)}
.workspace-column{display:grid;min-width:0;min-height:0;height:100%;overflow:hidden}
.workspace-column>.panel{min-width:0;min-height:0;height:auto;resize:none}
.workspace-column>.panel>.bar{flex-shrink:0;min-height:66px;cursor:pointer}
.panel.folded:not(.expanded)>:not(.bar){display:none!important}
.panel.folded:not(.expanded)>.bar{padding-top:8px;padding-bottom:8px}
.panel-fold{flex-shrink:0;font-size:17px;padding:3px 8px}
.pane-divider{cursor:row-resize;touch-action:none;position:relative;border-radius:5px}
.pane-divider:after{content:'';position:absolute;left:40%;right:40%;top:4px;height:2px;background:var(--edge);border-radius:2px}
.pane-divider:hover:after,.pane-divider:focus-visible:after{background:#29b6ff}
.pane-divider[aria-disabled=true]{cursor:default}.resizing-panes{user-select:none;cursor:row-resize}
.workspace-column>.panel.expanded{height:auto;min-width:0}
.panel.expanded .panel-fold{display:none}
#results{flex:1;min-height:0}
@media(max-width:800px){.workspace-column{height:760px;flex-shrink:0;width:100%}.workspace-column>.panel{height:auto}.panel.expanded{height:auto}}

#books-dialog{width:min(680px,92vw);max-height:85vh;overflow:auto;background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:14px;padding:24px}#books-dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.books-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.books-heading small{color:#29b6ff;letter-spacing:2px}#books-status{color:var(--muted);margin:14px 0}#books-list{display:grid;gap:8px}.book-entry{display:flex;flex-direction:column;gap:5px;text-align:left;padding:16px;background:var(--bg);border:1px solid var(--edge);border-radius:8px;color:var(--ink);cursor:pointer}.book-entry:hover{border-color:#29b6ff}.book-entry span{color:var(--muted);font-size:12px}

main{grid-template-columns:minmax(0,var(--left-width,.455fr)) 10px minmax(0,var(--right-width,.545fr));column-gap:0}
.column-divider{cursor:col-resize;touch-action:none;position:relative;border-radius:5px;min-height:0}
.column-divider:after{content:'';position:absolute;top:40%;bottom:40%;left:4px;width:2px;background:var(--edge);border-radius:2px}
.column-divider:hover:after,.column-divider:focus-visible:after{background:#29b6ff}
.resizing-columns{user-select:none;cursor:col-resize}
@media(max-width:800px){.column-divider{display:none}}

#workspace-tabs{display:flex;gap:10px;padding:8px 16px}#workspace-tabs [aria-selected="true"]{border-color:#46bcff;color:#46bcff}#recipe-workspace{display:grid;grid-template-columns:1.2fr 1fr;gap:12px;padding:16px;height:calc(100vh - 160px)}#recipe-workspace[hidden],#compile-workspace[hidden],main[hidden]{display:none!important}#recipe-workspace>.panel{display:flex;flex-direction:column;min-height:0;padding:12px}#recipe-editor{flex:1;min-height:240px}#recipe-preview{overflow:auto;flex:1}#recipe-preview details{margin:8px 0 8px 18px}#recipe-preview pre{white-space:pre-wrap}#recipe-status{padding:12px;white-space:pre-wrap}#compile-workspace{margin:16px;padding:20px;overflow:auto;height:calc(100vh - 180px)}#compile-plan{white-space:pre-wrap}#pieces-dialog{width:min(900px,95vw);max-height:85vh;overflow:auto;background:var(--bs-body-bg,#101925);color:inherit;border:1px solid #456;border-radius:12px;padding:20px}#pieces-list button{display:block;margin:8px 0}#pieces-preview{max-height:240px;overflow:auto;white-space:pre-wrap}@media(max-width:800px){#recipe-workspace{grid-template-columns:1fr;height:auto}#recipe-editor{height:400px;flex:none}}

#recipe-workspace>.panel>.bar{flex-wrap:wrap}#recipe-drafts{width:100%;min-width:0}

#drafts-dialog{width:min(760px,95vw);background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:12px;padding:20px}#drafts-dialog .tools{flex-wrap:wrap}#drafts-dialog::backdrop{background:#0009}

#disk-notices{position:fixed;right:20px;top:90px;z-index:10000;display:grid;gap:10px;max-width:min(430px,90vw)}.disk-notice{background:var(--panel);color:var(--ink);border:1px solid #46bcff;border-left:4px solid #46bcff;border-radius:10px;padding:16px;box-shadow:0 8px 30px #0008;display:flex;gap:10px;align-items:center;flex-wrap:wrap;animation:disk-pop .2s ease-out}.disk-notice span{flex:1;min-width:180px;overflow-wrap:anywhere}@keyframes disk-pop{from{opacity:0;transform:translateX(25px)}to{opacity:1;transform:translateX(0)}}@media(prefers-reduced-motion:reduce){.disk-notice{animation:none}}

.disk-notice{border-color:#40dba3;border-left-color:#40dba3;box-shadow:0 8px 30px #0008,0 0 15px #40dba322}#ai-dialog{width:min(900px,95vw);max-height:90vh;overflow:auto;background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:12px;padding:20px}#ai-dialog::backdrop{background:#0009}#ai-dialog label{display:block;margin:12px 0 6px}#ai-context{font-family:monospace;font-size:13px}#ai-status{margin-top:10px;color:var(--muted)}

/* Acciones reconocibles por color, conservando etiquetas y foco accesible. */
:is(#recipe-save,#server-save,#save,#connect){--action-rgb:64,219,163}
:is(#recipe-load,#server-open,#open,#books-open,#drafts-open,#pieces-read,#recipe-import){--action-rgb:70,188,255}
:is(#recipe-new,#server-new){--action-rgb:65,211,209}
:is(#ai-open,#ai-copy,#ai-update){--action-rgb:183,148,255}
:is(#recipe-check,#validate,#compile-review){--action-rgb:255,202,94}
:is(#compile-run,#apply,#execute){--action-rgb:64,219,163}
#recipe-delete{--action-rgb:255,100,122}
:is(#recipe-save,#server-save,#save,#connect,#recipe-load,#server-open,#open,#books-open,#drafts-open,#pieces-read,#recipe-import,#recipe-new,#server-new,#ai-open,#ai-copy,#ai-update,#recipe-check,#validate,#compile-review,#compile-run,#apply,#execute,#recipe-delete){background:rgba(var(--action-rgb),.14);border-color:rgba(var(--action-rgb),.6);color:rgb(var(--action-rgb));font-weight:600;transition:background .15s,box-shadow .15s}
.btn[style],.btn{outline-offset:3px}
.btn:not(:disabled):hover{filter:brightness(1.12)}
.btn:focus-visible{outline:2px solid #46bcff;outline-offset:3px}
button[disabled]{opacity:.4;filter:saturate(.25);cursor:not-allowed}
html[data-bs-theme=light] :is(#recipe-save,#server-save,#save,#connect,#recipe-load,#server-open,#open,#books-open,#drafts-open,#pieces-read,#recipe-import,#recipe-new,#server-new,#ai-open,#ai-copy,#ai-update,#recipe-check,#validate,#compile-review,#compile-run,#apply,#execute,#recipe-delete){color:#172d40;background:rgba(var(--action-rgb),.3);border-color:rgba(var(--action-rgb),.9)}

.labs-toolbar{display:flex;align-items:stretch;gap:0;padding:8px 14px;border-block:1px solid var(--edge);flex-wrap:wrap;flex-shrink:0;background:var(--panel)}.tool-group{display:flex;flex-direction:column;gap:5px;padding:0 14px;border-right:1px solid var(--edge)}.tool-group:first-child{padding-left:0}.tool-group:last-child{border-right:0}.tool-group>small{color:var(--muted);font-size:10px;letter-spacing:.07em;text-transform:uppercase}.tool-group-buttons{display:flex;gap:6px;align-items:center}.tool-button{display:inline-flex;gap:7px;align-items:center;justify-content:center;min-width:36px;min-height:36px;padding:7px 10px}.tool-button svg{width:19px;height:19px;flex-shrink:0}.labs-toolbar #apply{margin-left:0}#recipe-workspace>.panel>.bar{padding-bottom:8px}@media(max-width:600px){.labs-toolbar{gap:10px}.tool-group{padding:0 8px}}

#technical-dialog{width:min(1100px,96vw);height:85vh;max-height:90vh;background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:12px;padding:20px;overflow:auto}#technical-dialog::backdrop{background:#0009}.technical-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:24px;margin-top:18px}#technical-list{display:flex;flex-direction:column;gap:10px;align-self:start;position:sticky;top:0}#technical-list .btn{text-align:left;white-space:normal}#technical-body{overflow-wrap:anywhere}#technical-body h3{color:#46bcff;font-size:18px;margin-top:22px}#technical-body h4{font-size:14px;color:var(--muted)}#technical-body pre{white-space:pre-wrap;background:var(--bg);padding:12px;border-radius:8px}.doc-section{margin:12px 0}#technical-open{color:#46bcff;border-color:#46bcff;background:#46bcff18}@media(max-width:700px){.technical-layout{grid-template-columns:1fr}#technical-list{position:static}}

.preview-items{display:grid;gap:10px;margin:10px 0}.preview-card{border:1px solid var(--edge);border-left:3px solid #46bcff;border-radius:8px;padding:12px;background:var(--bg);min-width:0}.preview-card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.preview-kind{font-size:11px;color:#46bcff;background:#46bcff18;border-radius:5px;padding:3px 7px}.preview-fields{display:grid;grid-template-columns:minmax(80px,110px) minmax(0,1fr);gap:7px 12px;margin:0}.preview-fields dt{font-size:12px;color:var(--muted);font-weight:500}.preview-fields dd{margin:0;overflow-wrap:anywhere;font-family:monospace;font-size:12px;min-width:0}.preview-list-row{padding:4px 8px;border-left:2px solid var(--edge)}.preview-fields .preview-items{margin:0;gap:3px}@media(max-width:600px){.preview-fields{grid-template-columns:1fr}.preview-fields dt{margin-top:6px}}

#recipe-tree-space{flex:1;min-height:260px;overflow:auto;border:1px solid var(--edge);border-radius:8px;background:var(--bg)}#recipe-tree-space[hidden],#recipe-preview[hidden]{display:none!important}#recipe-tree-space svg{width:100%;height:460px;display:block;touch-action:none}#recipe-tree-space text{fill:var(--ink);font:13px system-ui}#recipe-tree-space .recipe-node{cursor:pointer}#recipe-tree-space .recipe-node:focus circle{stroke:#fff;stroke-width:4}#recipe-tree-detail{border-top:1px solid var(--edge);padding:12px;font-size:12px;overflow-wrap:anywhere}#recipe-tree-detail pre{white-space:pre-wrap;max-height:220px;overflow:auto;margin-top:10px}.recipe-tree-tools{flex-shrink:0}.recipe-tree-tools [aria-pressed=true]{color:#46bcff;border-color:#46bcff}

#source-dialog{width:95vw;height:90vh;max-height:95vh;background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:12px;padding:16px}#source-editor{height:calc(100% - 100px)}#source-dialog::backdrop{background:#000a}#source-title{overflow-wrap:anywhere}

#key-dialog{width:min(480px,92vw);background:var(--panel);color:var(--ink);border:1px solid var(--edge);border-radius:14px;padding:22px}#key-dialog::backdrop{background:#000a;backdrop-filter:blur(3px)}#key-dialog h2{margin:3px 0 0}#key-dialog label{display:block;margin:16px 0 6px}#key-dialog .key-heading{display:flex;align-items:center;gap:14px;min-width:0}#key-dialog .key-picture,#key-dialog .key-picture-fallback{width:58px;height:58px;flex:none;object-fit:contain;filter:drop-shadow(0 0 9px #46bcff55)}#key-dialog .key-picture-fallback{fill:none;stroke:#46bcff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}#key-dialog .key-input-row{display:flex;gap:8px}#key-input{font-family:ui-monospace,monospace}#key-error{min-height:1.25em;color:#ff647a;margin:7px 0}@media(max-width:380px){#key-dialog{padding:16px}#key-dialog .key-picture,#key-dialog .key-picture-fallback{width:46px;height:46px}#key-dialog .key-heading{gap:10px}}
