/* Navegación e índice de Lab. Los controles del visualizador conservan su CSS propio. */
.page-lab{--lab-red:#bd282e;--lab-dark:#302f2d;background:var(--lab-dark);color:var(--lab-red)}
.page-lab [hidden]{display:none!important}
.page-lab .site-header{position:fixed;top:0;left:0;right:0;z-index:130;display:block;height:58px;padding:0 16px;background:transparent;border:0;-webkit-backdrop-filter:none;backdrop-filter:none}
.page-lab .lab-nav-cluster{position:absolute;top:17px;left:50%;display:grid;grid-template-columns:65px 84px 110px;align-items:center;height:37px;padding:3px;border-radius:9px;background:rgba(104,101,96,.24);-webkit-backdrop-filter:blur(18px) saturate(125%);backdrop-filter:blur(18px) saturate(125%);transform:translateX(-50%);box-shadow:0 1px 8px rgba(0,0,0,.06)}
.page-lab .lab-nav-pill{position:absolute;z-index:0;top:3px;bottom:3px;left:68px;width:84px;border-radius:7px;background:#171717;transition:left .52s cubic-bezier(.22,1,.36,1),width .52s cubic-bezier(.22,1,.36,1)}
.page-lab[data-view="information"] .lab-nav-pill{left:152px;width:110px}
.page-lab .site-header .lab-title{position:relative;z-index:1;grid-column:auto;grid-row:auto;justify-self:center;display:block;width:auto;margin:0;padding:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;animation:none;font-family:var(--sans);font-size:15px;font-weight:400;line-height:1;letter-spacing:-.035em}
.page-lab .lab-title .lab-brand{display:inline-block;width:auto;height:auto;padding:0;background:none;-webkit-mask:none;mask:none;color:var(--lab-red);font:inherit;line-height:inherit;letter-spacing:inherit}
.page-lab .lab-title sup{position:absolute;top:-3px;left:calc(100% + 1px);font-family:var(--mono);font-size:9px;font-weight:400;line-height:1;letter-spacing:0}
.page-lab .lab-title sup a{color:var(--lab-red)}
.page-lab .lab-nav-tab{position:relative;z-index:1;display:grid;place-items:center;height:100%;padding:0 5px;border:0;background:none;color:var(--lab-red);font-family:var(--mono);font-size:var(--body-size);line-height:1;text-transform:uppercase;cursor:pointer;transition:color .35s ease}
.page-lab .lab-nav-tab:hover{color:#fff}
.page-lab .lab-nav-tab.is-current{color:#f0eee9}
.page-lab .site-header .menu-toggle{position:absolute;top:17px;right:16px;display:flex;justify-content:center;align-items:center;width:auto;min-width:74px;height:37px;padding:0 12px;border:0;border-radius:9px;background:rgba(104,101,96,.24);color:var(--lab-red);-webkit-backdrop-filter:blur(18px) saturate(125%);backdrop-filter:blur(18px) saturate(125%);animation:none}
.page-lab .site-header .menu-toggle:hover{color:#fff}
.page-lab.menu-open .site-header .lab-nav-cluster{opacity:1}
.page-lab.menu-open .lab-title sup{display:block}
.page-lab.menu-open .lab-brand{display:inline-block;width:auto;height:auto;background:none;-webkit-mask:none;mask:none;color:var(--lab-red);font-size:inherit}
.page-lab .menu-panel{z-index:120;background:rgba(48,47,45,.48);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
.page-lab .menu-panel-content{left:50%!important;top:78px;right:12px}
.page-lab .menu-panel-content a{color:var(--lab-red)}
.page-lab .menu-panel-content.is-interacting a:not(.is-active){color:#98575a}
.page-lab .menu-panel-content.is-interacting a.is-active{color:#fff}

.page-lab .lab-main{padding-top:0}
.page-lab .lab-index{min-height:calc(100svh - 160px);align-content:start;padding-top:25vh;padding-bottom:50px}
.page-lab .lab-index-marker{grid-column:5/7;align-self:start;padding-top:0;color:var(--lab-red);font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading);text-transform:uppercase}
.page-lab .lab-tool-list{grid-column:7/11;display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;margin:0;padding:0;list-style:none}
.page-lab .lab-tool{width:100%;margin:0;padding:0}
.page-lab .lab-tool-trigger{display:block;width:max-content;max-width:100%;padding:0;border:0;background:transparent;color:var(--lab-red);text-align:left;font-family:var(--mono);font-size:var(--body-size);font-weight:400;line-height:var(--body-leading);letter-spacing:-.01em;text-transform:uppercase;cursor:pointer;transition:color .2s ease}
.page-lab .lab-tool-trigger:hover,.page-lab .lab-tool-trigger:focus-visible,.page-lab .lab-tool-trigger[aria-expanded="true"]{color:#fff}
.page-lab .lab-tool-list:hover .lab-tool-trigger:not(:hover):not([aria-expanded="true"]){color:#9c5356}
.page-lab .lab-environment-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;visibility:hidden;pointer-events:none}
.page-lab .lab-tool-visualizer:hover .lab-environment-choices,.page-lab .lab-tool-visualizer:focus-within .lab-environment-choices,.page-lab .lab-tool-visualizer.is-open .lab-environment-choices{max-height:320px;margin:15px 0 18px;visibility:visible;pointer-events:auto}
.page-lab .lab-environment-choices img{height:clamp(100px,13vw,175px)}
.page-lab .lab-environment-choices button:hover span,.page-lab .lab-environment-choices button:focus-visible span{color:#fff}
.page-lab .lab-upcoming-note{grid-column:7/11;display:flex;flex-direction:column;gap:3px;margin-top:26px;font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading)}
.page-lab .lab-upcoming-note span:last-child{opacity:.63}
.page-lab.lab-tool-active .lab-index{min-height:0;padding-top:105px;padding-bottom:26px}
.page-lab.lab-tool-active .lab-index-marker{padding-top:0}
.page-lab .lab-workspace,.page-lab .lab-calculator{scroll-margin-top:105px}
.page-lab .lab-workspace{padding-bottom:45px}
.page-lab .site-footer{margin-top:0}

.lab-cursor-preview{position:fixed;z-index:150;top:0;left:0;width:228px;height:158px;overflow:hidden;opacity:0;pointer-events:none;transform:translate3d(-400px,-400px,0);transition:opacity .16s ease}
.lab-cursor-preview.is-visible{opacity:1}
.lab-cursor-preview img{display:block;width:100%;height:100%;object-fit:cover}

.page-lab .lab-information-view{min-height:calc(100svh - 150px);align-content:start;row-gap:0;padding-top:25vh;padding-bottom:65px;color:var(--lab-red);font-family:var(--mono);font-size:var(--body-size);line-height:var(--body-leading);text-transform:uppercase}
.page-lab .lab-information-intro{grid-column:2/5;max-width:31ch;padding-right:15px}
.page-lab .lab-information-intro p{margin:0 0 18px}
.page-lab .lab-information-contact{grid-column:6/8}
.page-lab .lab-information-links{grid-column:9/12}
.page-lab .lab-information-contact,.page-lab .lab-information-links{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.page-lab .lab-information-contact>span,.page-lab .lab-information-links>span{margin-bottom:30px}
.page-lab .lab-information-view a{color:var(--lab-red);text-decoration:none}
.page-lab .lab-information-view a:hover{color:#fff}
.page-lab .lab-information-resources{grid-column:2/12;margin-top:18vh}
.page-lab .lab-information-resources>span{display:block;margin-bottom:24px}
.page-lab .lab-information-resources>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.page-lab .lab-information-resources a{display:flex;flex-direction:column;justify-content:space-between;min-height:72px;padding:10px;border:1px solid rgba(189,40,46,.65)}
.page-lab .lab-information-resources a:hover{border-color:#fff}
.page-lab .lab-information-resources a span{opacity:.65}

@media(max-width:760px){
  .page-lab .site-header{height:56px;padding:0 10px}
  .page-lab .lab-nav-cluster{top:12px;left:10px;grid-template-columns:55px 71px 99px;height:35px;transform:none}
  .page-lab .lab-nav-pill{left:58px;width:71px}
  .page-lab[data-view="information"] .lab-nav-pill{left:129px;width:99px}
  .page-lab .site-header .menu-toggle{top:12px;right:10px;height:35px;min-width:66px;padding:0 8px}
  .page-lab .lab-nav-tab{font-size:10px}
  .page-lab .lab-index{padding-top:24vh;min-height:calc(100svh - 175px)}
  .page-lab .lab-index-marker{grid-column:2/5}
  .page-lab .lab-tool-list,.page-lab .lab-upcoming-note{grid-column:5/13}
  .page-lab .lab-information-view{padding-top:21vh;row-gap:45px}
  .page-lab .lab-information-intro{grid-column:1/8}
  .page-lab .lab-information-contact{grid-column:8/13}
  .page-lab .lab-information-links{grid-column:8/13}
  .page-lab .lab-information-resources{grid-column:1/13;margin-top:2vh}
}
@media(max-width:500px){
  .page-lab .lab-nav-cluster{grid-template-columns:42px 54px 78px;height:33px;top:11px}
  .page-lab .lab-nav-pill{left:45px;width:54px}
  .page-lab[data-view="information"] .lab-nav-pill{left:99px;width:78px}
  .page-lab .site-header .lab-title{font-size:14px}
  .page-lab .lab-title sup{font-size:8px}
  .page-lab .lab-nav-tab{font-size:8px}
  .page-lab .site-header .menu-toggle{top:11px;height:33px;min-width:57px}
  .page-lab .menu-panel-content{left:20px!important;top:100px}
  .page-lab .lab-index{padding-top:23vh}
  .page-lab .lab-index-marker{grid-column:1/5}
  .page-lab .lab-tool-list,.page-lab .lab-upcoming-note{grid-column:5/13}
  .page-lab .lab-environment-choices img{height:100px}
  .lab-cursor-preview{display:none}
  .page-lab .lab-information-view{padding-top:18vh;row-gap:28px}
  .page-lab .lab-information-intro,.page-lab .lab-information-contact,.page-lab .lab-information-links,.page-lab .lab-information-resources{grid-column:1/13}
  .page-lab .lab-information-intro{max-width:42ch}
  .page-lab .lab-information-contact>span,.page-lab .lab-information-links>span{margin-bottom:12px}
  .page-lab .lab-information-resources>div{grid-template-columns:1fr}
  .page-lab .lab-information-resources a{min-height:60px}
}
@media(prefers-reduced-motion:reduce){
  .page-lab .lab-nav-pill,.page-lab .lab-nav-tab,.page-lab .lab-tool-trigger,.lab-cursor-preview{transition:none}
}