:root{color-scheme:dark;--bg:#08110d;--panel:#101c14;--line:#273d2c;--ink:#e8f3e9;--muted:#9aafa0;--green:#7bea9f}*{box-sizing:border-box}html{height:100%}body{margin:0;color:var(--ink);background:var(--bg);font:14px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #7bea9f;outline-offset:3px}.page{max-width:1500px;margin:0 auto;padding:0 30px}header{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;letter-spacing:.08em;font-weight:800;font-size:13px}.symbol{width:34px;height:34px;display:grid;place-items:center;background:#153221;border:1px solid #336744;color:var(--green);font-size:22px;border-radius:9px}.brand em{font-style:normal;color:#8fb49b;font-weight:450}.status{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.04em;color:var(--muted)}.online{height:7px;width:7px;background:var(--green);box-shadow:0 0 13px var(--green);border-radius:50%}.status a{margin-left:13px;color:var(--ink);border:1px solid #39533f;border-radius:8px;padding:10px 13px}.status a:hover,.downloads a:hover{border-color:var(--green)}.intro{padding:43px 0 29px;display:flex;align-items:end;justify-content:space-between;gap:30px}.overline{font-size:10px;letter-spacing:.17em;font-weight:750;color:var(--green)}h1{font-size:clamp(46px,6vw,82px);line-height:1;letter-spacing:-.07em;margin:13px 0;font-weight:700}h1 span{color:#8cbea0}.intro p{color:var(--muted);max-width:580px;margin:0;line-height:1.65}.version{white-space:nowrap;border:1px solid #396044;color:#b9e9c4;border-radius:100px;padding:10px 14px;font-size:12px;background:#172b1d}.layout{display:grid;grid-template-columns:minmax(0,1fr) 325px;gap:16px}.viewer{height:620px;position:relative;background:radial-gradient(ellipse at 48% 42%,#263c2d 0%,#122017 54%,#0b140f 100%);border:1px solid #324a39;border-radius:16px;overflow:hidden;isolation:isolate}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.view-top,.view-bottom{position:absolute;left:19px;right:19px;display:flex;justify-content:space-between;gap:10px;pointer-events:none}.view-top{top:18px;font-size:10px;letter-spacing:.12em;color:#9fbea9}.view-top b{font-size:14px;display:block;margin-top:6px;letter-spacing:0;color:#eff8ed;font-weight:650}.units{font-family:monospace;color:#7b9781}.view-bottom{bottom:18px;align-items:end}.hint{font-size:12px;color:#bfdbc5;background:#0b1911d9;border:1px solid #39523c;border-radius:9px;padding:10px;backdrop-filter:blur(8px)}.controls{pointer-events:auto;display:flex;gap:3px;border:1px solid #36513c;border-radius:10px;padding:5px;background:#0b1911e8;backdrop-filter:blur(8px)}.controls button{color:#d5efd9;background:transparent;border:0;border-radius:7px;padding:10px 12px;white-space:nowrap;font-size:12px}.controls button:hover,.controls button.active{background:#225232;color:white}.loading{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px;background:#0d1b13ef;color:#a6c2ae;z-index:3;transition:opacity .4s}.loading.hidden{opacity:0;pointer-events:none}.spinner{width:38px;height:38px;border-radius:50%;border:2px solid #31513a;border-top-color:var(--green);animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.sidebar{display:flex;flex-direction:column;gap:16px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:24px}.panel h2{font-size:20px;letter-spacing:-.035em;line-height:1.2;font-weight:650;margin:11px 0}.panel p{font-size:13px;color:var(--muted);line-height:1.7;margin:0}dl{margin:20px 0 0}dl div{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px 0;border-top:1px solid #28402e;font-size:12px}dt{color:#9eb4a3}dd{margin:0;color:#eff9ed;text-align:right;font-weight:600}.downloads{display:grid;gap:9px;margin-top:17px}.downloads a{display:flex;align-items:center;justify-content:space-between;background:#1a3925;border:1px solid #3d6a48;border-radius:9px;padding:13px 14px;font-size:12px;font-weight:650}.downloads a+a{background:#15251b}.downloads span{font-size:10px;letter-spacing:.07em;color:var(--green)}.panel .fine{font-size:11px;line-height:1.6;color:#779080;margin-top:14px}footer{border-top:1px solid var(--line);margin:25px 0 35px;padding-top:22px;display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#819a88}footer b{color:#cbe8d0}@media(max-width:1000px){.layout{grid-template-columns:1fr}.viewer{height:520px}.sidebar{display:grid;grid-template-columns:1fr 1fr}}@media(max-width:640px){.page{padding:0 14px}header{height:64px}.brand{font-size:11px}.status{font-size:9px}.status a{margin-left:4px;padding:8px}.intro{padding:30px 0 22px;display:block}.intro h1{font-size:52px}.intro p{font-size:13px}.version{display:inline-block;margin-top:16px}.viewer{height:475px;border-radius:12px}.sidebar{display:flex}.view-top{top:12px;left:12px;right:12px}.view-bottom{display:block;bottom:10px;left:10px;right:10px}.hint{display:inline-block;font-size:10px;padding:7px 9px}.controls{margin-top:8px;justify-content:space-around}.controls button{padding:12px}footer{display:block;line-height:2}}

/* Secuencia de ensamblaje interactiva */
.viewer-column{min-width:0;display:flex;flex-direction:column;gap:15px}
.assembly-panel{border:1px solid #294734;background:linear-gradient(130deg,#13251a,#0e1a13);padding:21px 23px;border-radius:14px}
.assembly-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.assembly-head h2{font-size:21px;font-weight:660;letter-spacing:-.035em;line-height:1.2;margin:7px 0 4px}
.assembly-intro{font-size:12px;color:#99b9a3;line-height:1.55;margin:0}
.assembly-actions{display:flex;gap:9px;flex-shrink:0}
.assembly-actions button{background:#1b3624;border:1px solid #3c684a;color:#e2f6e7;border-radius:9px;font-weight:640;font-size:12px;padding:12px 14px}
.assembly-actions button.primary{background:#73ea9d;color:#092113;border-color:#84f6ab}
.assembly-actions button.active{background:#305e3d;border-color:#73ea9d}
.assembly-actions button:hover{filter:brightness(1.13)}
.assembly-progress{display:flex;align-items:center;gap:14px;margin-top:22px}
.assembly-progress input{width:100%;min-width:0;accent-color:#7bea9f;cursor:pointer}
.assembly-progress span{white-space:nowrap;font-size:12px;color:#ace5b9;font-family:monospace;font-weight:700}
.assembly-steps{display:flex;align-items:center;gap:10px;margin-top:18px}
.assembly-steps>button{border:1px solid #355440;background:#16281c;border-radius:8px;padding:9px 11px;color:#cbe5d1;font-size:12px}
.assembly-steps>button:hover:not(:disabled){background:#25452e}
.assembly-steps>button:disabled{opacity:.32;cursor:not-allowed}
.stage-dots{display:flex;gap:7px;flex:1;justify-content:center;flex-wrap:wrap}
.stage-dots button{height:25px;min-width:25px;padding:0 5px;border:1px solid #3c5c44;background:#1c3022;color:#a6bbaa;font-size:11px;border-radius:6px;cursor:pointer}
.stage-dots button.completed{background:#225436;color:#c3edd0;border-color:#35724a}
.stage-dots button.current{background:#87e6a6;color:#0b2515;border-color:#87e6a6}
.assembly-note{display:flex;align-items:flex-start;gap:11px;padding-top:16px;border-top:1px solid #2d4432;margin-top:16px}
.assembly-note>span{font-size:12px;color:#d8eddc;font-weight:700;white-space:nowrap;margin-top:2px}
.assembly-note p{font-size:12px;line-height:1.65;color:#a7c4ae;margin:0}
.picked-part{display:none;position:absolute;top:64px;left:19px;pointer-events:none;color:#d8f9dd;background:#12331fde;border:1px solid #4c9a65;border-radius:9px;padding:10px 13px;font-size:12px;font-weight:650;backdrop-filter:blur(7px)}
.picked-part.visible{display:block}
@media(max-width:1000px){.sidebar{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.assembly-panel{padding:17px 13px}.assembly-head{display:block}.assembly-actions{margin-top:15px}.assembly-actions button{flex:1;padding:12px 10px}.assembly-steps{gap:5px}.assembly-steps>button{padding:9px 7px;font-size:11px}.stage-dots{gap:4px}.stage-dots button{height:23px;min-width:23px}.assembly-note{display:block}.assembly-note p{margin-top:6px}.picked-part{top:58px;left:12px}}


.sim-panel{background:linear-gradient(135deg,#12281c,#0b1810);border:1px solid #325a3b;border-radius:14px;padding:20px 22px;margin-top:0}
.sim-panel #simModeTag{float:right;color:#82ac8b;letter-spacing:.08em;font-size:10px}
.sim-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-top:8px}
.sim-top h2{font-size:21px;margin:5px 0 6px;letter-spacing:-.035em}
.sim-top p{font-size:12px;max-width:430px;color:#9cb6a3;line-height:1.65;margin:0}
.sim-buttons{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;min-width:210px}
.sim-buttons button{border:1px solid #37573e;color:#dcf4e4;background:#152b1c;border-radius:8px;padding:9px 12px;font-size:11px;cursor:pointer}
.sim-buttons button:hover{border-color:#73e89d}
.sim-buttons .sim-primary{background:#80eca2;border-color:#91f6af;color:#092015;font-weight:750}
.sim-buttons .sim-primary.running{background:#286442;color:#e7ffeb}
.sim-track{display:flex;align-items:center;gap:12px;margin-top:17px}
.sim-track input{flex:1;min-width:0;accent-color:#82eca1;cursor:pointer}
.sim-track strong{color:#b8fac5;font-size:12px;font-family:monospace}
.sim-params{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;margin-top:16px}
.sim-params label{display:flex;flex-direction:column;gap:7px;color:#a9c3af;font-size:11px}
.sim-params label span{color:#87e7a3;font-size:12px;font-weight:750}
.sim-params input{width:100%;accent-color:#8cf4b2}
.sim-params select{width:100%;background:#15291b;color:#e5f7e7;border:1px solid #3d5f46;border-radius:6px;padding:7px;min-height:33px}
.sim-toggles{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;color:#acccb5;font-size:11px}
.sim-toggles label{display:flex;gap:7px;align-items:center;cursor:pointer}
.sim-toggles input{accent-color:#8aefa5}
.sim-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:19px}
.sim-metrics div{background:#192d20;border:1px solid #284734;border-radius:7px;padding:10px 9px}
.sim-metrics span{display:block;font-size:10px;color:#8ea997;margin-bottom:4px}
.sim-metrics strong{display:block;font-size:13px;white-space:nowrap;color:#e8f8ed}
.sim-disclaimer{font-size:10px;color:#879b8c;line-height:1.6;margin:15px 0 0}
#simQuick{background:#2a6140!important;color:#e5fff0!important}
#simQuick:hover{background:#388a53!important}
@media(max-width:640px){
.sim-panel{padding:17px 13px}
.sim-top{display:block}
.sim-buttons{margin-top:12px;justify-content:stretch;min-width:0}
.sim-buttons button{flex:1 1 33%;padding:11px 7px}
.sim-params{grid-template-columns:1fr 1fr;gap:10px}
.sim-params label:last-child{grid-column:1/-1}
.sim-metrics{grid-template-columns:1fr 1fr}
.controls{gap:0}
.controls button{padding:10px 8px;font-size:11px}
}