:root{color-scheme:dark;--paper:#111820;--panel:#18222c;--ink:#f1eadb;--muted:#b6b2a9;--gold:#d4ae64;--gold-light:#40382a;--line:#394550;--dark:#101820;--rust:#f1a98d;--selected:#423a2a}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:14px "Segoe UI",system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:1px solid var(--line);border-radius:6px;background:#222d38;color:var(--ink);padding:7px 10px;line-height:1.3}button:hover:enabled{background:var(--gold-light);border-color:#b69a60}button:disabled{cursor:default;opacity:.35}button[aria-pressed=true]{background:var(--gold-light);border-color:#b5934f}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #e3bf78;outline-offset:2px}button.primary{background:var(--gold);border-color:#bc9245;font-weight:600}button.quiet{background:transparent}.app-header{min-height:78px;padding:12px 18px;border-bottom:1px solid var(--line);display:flex;gap:22px;align-items:center;background:var(--panel)}h1,h2,h3,p{margin:0}h1{font-size:18px;font-weight:650;letter-spacing:-.3px}h2{font-size:17px;font-weight:650}h3{font-size:15px}.brand{display:flex;gap:12px;align-items:center;flex-shrink:0}.brand-mark{font:italic 25px Georgia,serif;color:#d4ae64}.brand span:not(.brand-mark){font-size:12px;color:var(--muted)}.mode-block{margin:auto;min-width:275px}.mode-switch{display:flex}.mode-switch button{border-radius:0;padding:7px 14px;font-weight:600}.mode-switch button:first-child{border-radius:6px 0 0 6px}.mode-switch button:last-child{border-radius:0 6px 6px 0}.mode-block p{font-size:11px;color:var(--muted);margin-top:5px}.header-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.header-actions button{font-size:12px}.header-actions #undo,.header-actions #redo{font-size:20px;padding:1px 9px}.workspace{display:grid;grid-template-columns:200px minmax(320px,1fr) 350px;grid-template-rows:minmax(270px,1fr) 225px;height:calc(100dvh - 78px);min-height:600px;grid-template-areas:"tree stage edit" "tree product edit"}.tree-panel{grid-area:tree;border-right:1px solid var(--line);overflow:auto;background:var(--panel)}.panel-heading{padding:18px 16px 12px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.3px;color:var(--muted);display:block;margin-bottom:5px}.panel-heading p{font-size:12px;line-height:1.45;color:var(--muted);margin-top:6px}#part-tree{padding:0 8px 10px}.part-button{width:100%;border:0;border-radius:5px;padding:6px 6px 6px calc(8px + var(--depth,0)*12px);background:transparent;text-align:left;display:flex;align-items:center;gap:5px;min-height:29px;font-size:12px}.part-button .branch{color:#a89e89;font-size:11px}.part-button .part-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.part-button .count{font-size:10px;color:var(--muted);margin-left:auto;border-radius:3px;min-width:16px;text-align:center;background:#303a44}.part-button[aria-current=true]{background:var(--selected);font-weight:650;box-shadow:inset 3px 0 #ac8439}.tree-note{padding:8px 16px 16px;font-size:11px;line-height:1.5;color:var(--muted)}.stage{grid-area:stage;position:relative;min-width:0;min-height:0;background:var(--dark);overflow:hidden}.stage canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.stage canvas:active{cursor:grabbing}.stage-top{position:absolute;inset:14px 15px auto;display:flex;justify-content:space-between;gap:10px;pointer-events:none;color:#f8f3e8}.stage-top .eyebrow{color:#b9ad95;font-size:9px}.stage-top strong{font-size:17px;font-weight:550}.view-tools{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end;align-content:start;max-width:290px;pointer-events:auto}.view-tools button{font-size:10px;padding:5px 7px;background:#1e2a31;color:#ded6c5;border-color:#445058}.view-tools button[aria-pressed=true]{color:#f5d591;background:#3a3427;border-color:#a17d40}.view-tools button:hover{background:#494030}.stage-bottom{position:absolute;inset:auto 14px 12px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;pointer-events:none;color:#aaa99f;font-size:10px}.stage-bottom #status{color:#e5bf71;max-width:65%}.stage-bottom>span:last-child{max-width:190px;text-align:right;font-size:9px;line-height:1.4}.product-panel{grid-area:product;min-width:0;padding:14px 18px 10px;border-top:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden}.product-heading{display:flex;justify-content:space-between;gap:10px;align-items:center}.product-heading h2{font-size:15px}.product-heading button{font-size:11px;padding:5px 8px}.product-heading .eyebrow{font-size:9px;margin-bottom:2px}.chain{flex:1;min-height:76px;display:flex;align-items:center;gap:6px;overflow:auto;padding:10px 2px 8px}.equation-end{font:italic 22px "Cambria Math",Georgia,serif;flex:none}.chain-group{flex:none;border-top:2px solid #c4ae81;padding:4px 5px 5px;min-width:60px;border-radius:3px;background:#1d2832}.chain-owner{font-size:10px;color:var(--muted);background:none;border:0;padding:0 0 3px;display:block}.factor-row{display:flex;align-items:center;gap:3px}.factor{padding:5px 8px;border:1px solid #756447;background:#222d38;flex:none;min-width:36px;position:relative}.factor.pivot{background:#29333e;color:#c0b49c;border-color:transparent;padding:5px}.factor.selected{outline:2px solid #aa7d2c;outline-offset:0}.factor.off{opacity:.38}.factor.off .symbol{text-decoration:line-through}.factor[draggable=true],.matrix-card[draggable=true]{cursor:grab}.factor .symbol,.symbol{font:italic 22px "Cambria Math",Georgia,serif;white-space:nowrap}.symbol sub{font-size:.63em}.symbol sup{font-size:.49em;font-style:normal}.factor .small-matrix{margin-top:5px}.small-matrix{font:11px "Cambria Math",Georgia,serif;display:grid;grid-template-columns:repeat(4,1fr);gap:2px 6px;border-left:1px solid;border-right:1px solid;padding:2px 4px;min-width:100px;text-align:center}.chain.times{font-family:Georgia}.chain-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted)}.chain-footer strong{font-weight:550}.chain-footer details{position:relative;flex:none}.chain-footer summary{cursor:pointer;color:#e3bf78}.chain-footer details[open]{position:absolute;background:var(--paper);border:1px solid var(--line);padding:9px;right:365px;bottom:8px;z-index:9;box-shadow:0 3px 18px #0002}.edit-panel{grid-area:edit;min-width:0;border-left:1px solid var(--line);overflow:auto;background:var(--panel)}.add-row{padding:0 16px 12px;display:flex;gap:6px}.add-row select{min-width:0;flex:1;padding:7px;border:1px solid var(--line);border-radius:5px;background:#222d38}.matrix-list{padding:0 16px 14px;max-height:210px;overflow:auto}.empty{font-size:12px;color:var(--muted);line-height:1.6;padding:6px 0}.matrix-card{display:flex;align-items:center;gap:7px;padding:7px 6px;margin:4px 0;border:1px solid var(--line);border-radius:6px;background:#222d38;min-height:45px}.matrix-card.active{border-color:#ac8439;background:#3b3428}.matrix-card.off{opacity:.5}.matrix-card .order{font-size:10px;color:var(--muted);min-width:18px;text-align:center}.matrix-card .select-matrix{display:flex;align-items:center;gap:8px;flex:1;text-align:left;min-width:0;border:0;padding:0;background:none}.select-matrix .entry-label{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-tools{display:flex;gap:1px}.card-tools button{font-size:13px;background:transparent;border:0;padding:3px 4px}.drop-zone{outline:2px dashed #b28d45!important;background:#443c2c!important}.inspector{border-top:1px solid var(--line);padding:16px}.inspector-header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.inspector-header p{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.4}.inspector .eyebrow{font-size:9px}.entry-name{width:100%;border:1px solid var(--line);border-radius:5px;padding:7px;background:#222d38;margin-bottom:10px;font-size:12px}.check-row{display:flex;align-items:center;gap:6px;font-size:12px;margin:9px 0}.check-row input{accent-color:#98702c}.param-row{margin:12px 0;display:grid;grid-template-columns:70px minmax(70px,1fr) 65px;gap:8px;align-items:center;font-size:12px}.param-row input[type=range]{width:100%;accent-color:#a97d30}.param-row input[type=number]{width:65px;min-width:0;padding:5px 4px;border:1px solid var(--line);border-radius:4px;background:#222d38;font-size:13px}.param-select{display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:10px;margin:12px 0}.param-select select{padding:5px;border:1px solid var(--line);background:#222d38}.matrix-display{display:flex;align-items:center;gap:8px;margin:16px 0;justify-content:center}.matrix-grid{display:grid;grid-template-columns:repeat(4,minmax(35px,1fr));gap:4px 5px;padding:7px;border-left:2px solid #8b7c61;border-right:2px solid #8b7c61;width:100%;max-width:300px;font:17px "Cambria Math",Georgia,serif;text-align:center}.matrix-grid>span{padding:4px 0;min-width:0;overflow:hidden;text-overflow:ellipsis}.matrix-grid input{min-width:0;width:100%;padding:5px 1px;text-align:center;font:15px "Cambria Math",Georgia,serif;border:1px solid #65707a;border-radius:3px;background:#19242e}.matrix-grid .fixed{color:#b0aa9f;background:#29333e;border-radius:2px;font-size:15px}.matrix-caption{font-size:11px;color:var(--muted);line-height:1.5;margin-top:8px}.owner-select{width:100%;padding:6px;border:1px solid var(--line);border-radius:4px;background:#222d38;font-size:12px}.inspector-tools{display:flex;gap:6px;flex-wrap:wrap;margin-top:15px}.inspector-tools button{font-size:11px;padding:5px 7px}.delete{color:var(--rust)}.pivot-info{font-size:12px;color:var(--muted);line-height:1.5;margin:10px 0}.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);background:#302b22;color:#fff6df;padding:10px 17px;border-radius:7px;max-width:min(650px,90vw);font-size:12px;box-shadow:0 3px 15px #0003;z-index:20;opacity:0;pointer-events:none;transition:opacity .15s}.toast.visible{opacity:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.symbol .matrix-id{font:9px "Segoe UI",system-ui,sans-serif;color:var(--muted);margin-left:3px;vertical-align:baseline;letter-spacing:0}
@media(min-width:1600px){.workspace{grid-template-columns:225px minmax(400px,1fr) 390px}.app-header{gap:35px}.matrix-list{max-height:260px}.param-row{grid-template-columns:75px minmax(80px,1fr) 72px}.param-row input[type=number]{width:72px}.chain-footer details[open]{right:405px}.part-button{font-size:13px;min-height:31px}}
@media(max-width:1100px){.app-header{gap:12px;flex-wrap:wrap;min-height:110px}.brand{margin-right:auto}.mode-block{margin:0}.header-actions{width:100%;justify-content:flex-start}.workspace{height:calc(100dvh - 118px);grid-template-columns:175px minmax(270px,1fr) 320px}.panel-heading{padding:14px 12px 10px}.matrix-list,.add-row{padding-left:12px;padding-right:12px}.inspector{padding:12px}.stage-top{flex-direction:column;gap:8px}.view-tools{justify-content:flex-start}.chain-footer details[open]{right:330px}}
@media(max-width:820px){.app-header{height:auto;padding:12px}.brand{width:100%}.mode-block{min-width:0}.workspace{height:auto;min-height:0;grid-template-columns:155px minmax(0,1fr);grid-template-rows:420px auto auto;grid-template-areas:"tree stage" "tree product" "edit edit"}.tree-panel{max-height:665px}.product-panel{min-height:210px}.edit-panel{border-top:1px solid var(--line);padding-bottom:18px;overflow:visible}.matrix-list{max-height:200px}.inspector{max-width:650px}.matrix-grid{max-width:320px}.chain-footer details[open]{position:static;box-shadow:none}.chain-footer{flex-wrap:wrap}.header-actions{width:auto}.part-button{padding-left:calc(3px + var(--depth,0)*7px);font-size:11px}.stage-bottom>span:last-child{display:none}.stage-bottom #status{max-width:100%}}
@media(max-width:520px){.workspace{grid-template-columns:125px minmax(0,1fr);grid-template-rows:370px auto auto}.tree-panel h2{font-size:13px}.part-button{font-size:10px;min-height:30px}.part-button .branch{display:none}.part-button .count{font-size:9px}.stage-top strong{font-size:15px}.stage-top{inset:12px 8px auto}.view-tools button{font-size:9px;padding:5px}.product-panel{padding:12px 9px}.mode-switch button{font-size:12px}.header-actions button{font-size:11px}.tree-note{padding:8px;font-size:10px}}
.matrix-overlay{position:absolute;left:14px;top:81px;width:184px;pointer-events:none;display:flex;flex-direction:column;gap:9px;color:#f5ecd9}.overlay-card{background:#132028eb;border:1px solid #6e614943;border-radius:6px;padding:9px 8px}.overlay-heading{font-size:8px;letter-spacing:1px;color:#baa780;display:flex;justify-content:space-between;align-items:center;gap:5px;flex-wrap:wrap;min-height:28px;line-height:1.5;margin-bottom:5px}.overlay-heading>span{font:italic 18px/1.6 "Cambria Math",Georgia,serif;color:#e5bf71;letter-spacing:0;overflow:visible;white-space:nowrap;padding:2px;flex:none}.overlay-heading .matrix-id{font:11px/1.6 "Segoe UI",system-ui,sans-serif;color:#d7c9aa;margin-left:4px;overflow:visible;white-space:nowrap}.matrix-overlay .matrix-grid{font-size:12px;gap:1px 2px;border-color:#9f8b63;padding:2px 4px;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}.matrix-overlay .matrix-grid>span{padding:3px 0}.matrix-overlay .matrix-grid .fixed{background:transparent;color:#9b988e;font-size:12px}.matrix-overlay p{font-size:9px;line-height:1.4;color:#b5ac97;padding:0 3px}.matrix-overlay .empty{padding:8px 2px;font-size:11px;color:#aca89d}.mode-block{min-width:350px}.mode-switch button{padding:7px 10px;font-size:12px}.mode-switch button:nth-child(2){border-radius:0}.mode-switch button:first-child{border-radius:6px 0 0 6px}.mode-switch button:last-child{border-radius:0 6px 6px 0}.articulated-mode #add-form,.articulated-mode #matrix-list,.articulated-mode #show-values,.articulated-mode .chain-footer{display:none}.articulated-mode .product-panel{justify-content:flex-start}.articulated-mode .chain{display:block;overflow:auto}.pro-explanation{font-size:12px;line-height:1.7;color:var(--muted);padding-top:8px}.pro-equation{font:italic 20px "Cambria Math",Georgia,serif;display:block;margin-bottom:5px;color:var(--ink)}.pro-help{font-size:11px;line-height:1.6;color:var(--muted);margin:8px 0 15px}.pro-section{border-top:1px solid var(--line);padding-top:13px;margin-top:15px}.pro-section h3{margin-bottom:7px}.pro-info{font-size:11px;color:#d6bc88;margin-top:10px}.pro-bone-select{width:100%;padding:7px;border:1px solid var(--line);border-radius:5px;background:#222d38;margin:5px 0 7px}.articulated-mode .tree-note{color:#bfb39c}.articulated-mode .part-button{font-size:12px;min-height:36px}
@media(max-width:1100px){.matrix-overlay{top:110px;width:158px;left:10px}.matrix-overlay .matrix-grid{font-size:11px}.overlay-card{padding:7px 5px}.matrix-overlay .matrix-grid .fixed{font-size:11px}.mode-block{min-width:0}.app-header .header-actions{width:100%}}
@media(max-width:820px){.matrix-overlay{top:105px;width:140px}.matrix-overlay .matrix-grid{font-size:10px}.matrix-overlay .matrix-grid>span{padding:2px 0}.matrix-overlay .matrix-grid .fixed{font-size:10px}.matrix-overlay p{display:none}.workspace{grid-template-rows:470px auto auto}.mode-block{min-width:0}.mode-switch button{font-size:11px;padding:7px 8px}}
@media(max-width:520px){.matrix-overlay{top:160px;left:6px;width:108px;gap:5px}.overlay-heading{font-size:7px;letter-spacing:0}.overlay-heading span{font-size:12px}.matrix-overlay .matrix-grid{font-size:9px}.matrix-overlay .matrix-grid .fixed{font-size:9px}.matrix-overlay .matrix-grid>span{padding:2px 0}.overlay-card{padding:5px 4px}.mode-switch{flex-wrap:wrap}}
.matrix-overlay .matrix-grid>span{white-space:nowrap;line-height:1.2}.matrix-overlay p{max-height:28px;overflow:hidden}.matrix-overlay .matrix-grid{line-height:1.2}
.limits-toggle{display:block;margin-top:23px;padding:3px 0;border:0;background:transparent;color:#b9ad95;font-size:10px}.limits-toggle:hover{background:transparent!important;color:#e3bf78}#art-limits{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}.limit-header,.limit-row{display:grid;grid-template-columns:25px 1fr 1fr;gap:8px;align-items:center;margin:7px 0;font-size:11px}.limit-header{color:var(--muted)}.limit-row input{width:100%;min-width:0;background:#222d38;border:1px solid var(--line);border-radius:4px;padding:5px}#art-reset-limits{font-size:11px;margin-top:5px}.articulated-mode .chain-footer{display:flex}.articulated-mode .chain{display:flex;overflow:auto}.articulated-mode .part-button{min-height:29px}.articulated-mode .param-row input:disabled{opacity:.4}.articulated-mode #show-values{display:none}

/* Acceso discreto para el cierre de la clase. */
#mode-articulated[hidden]{display:none}.mode-switch:not(.has-articulated) #mode-rig{border-radius:0 6px 6px 0}.reveal-articulated{position:fixed;bottom:5px;right:5px;z-index:15;width:20px;height:20px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:10px;opacity:.22;line-height:20px}.reveal-articulated:hover,.reveal-articulated:focus-visible{opacity:1;color:var(--gold);background:#29333e}
/* Colores de controles y estados del tema oscuro. */
input,select{color:var(--ink)}button.primary{color:#171e26}.check-row input,.param-row input[type=range]{accent-color:var(--gold)}.part-button[aria-current=true]{color:#ffe0a1}.factor.selected{outline-color:var(--gold)}.chain-footer details[open]{box-shadow:0 6px 24px #0008}.matrix-grid .fixed{color:#b8b2a7}.toast{background:#35404a;color:#fff0cf}.stage{border-bottom:1px solid #25313c}

/* Global: una matriz; pivotes consultables en los cuatro modos. */
.global-mode #add-form,.global-mode #matrix-list,.global-mode #show-values,.global-mode .matrix-overlay .overlay-card:nth-child(2){display:none}.tree-panel>.panel-heading{position:sticky;top:0;z-index:2;background:var(--panel)}.pivot-readout{border-top:1px solid var(--line);margin-top:12px;padding-top:10px}.pivot-readout>span{display:block;font-size:9px;letter-spacing:1px;color:var(--gold)}.pivot-readout>strong{display:block;font-size:12px;font-weight:500;margin:4px 0;color:var(--muted)}.pivot-readout output{display:block;white-space:pre-line;font:13px/1.6 Consolas,monospace;color:var(--ink);font-variant-numeric:tabular-nums}.matrix-overlay #overlay-caption{display:none}
