/* Orbital atlas: a real index, with a deliberately quiet atmospheric scene. */
.orbitarium { position:relative; width:calc(100vw - 64px); margin:0 0 90px calc((100% - 100vw)/2 + 32px); color:#ece9e2; background:#1b1c1c; isolation:isolate; font-family:'Manrope',sans-serif; }
.field { max-width:1500px; margin:auto; padding:28px 3% 0; display:grid; grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr); grid-template-areas:'top top' 'heading scene' 'detail scene' 'bottom bottom'; column-gap:4%; }
.field-top { grid-area:top; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:0 0 22px; border-bottom:1px solid #ece9e21f; }
.field-id { display:flex; gap:12px; align-items:center; font:10px/1.5 'DM Mono',monospace; letter-spacing:.07em; }
.field-id i { width:5px; height:5px; background:#ff9a84; border-radius:50%; box-shadow:0 0 16px #ff9a8460; }
.field-top a { color:#b7b7af; text-decoration:none; font-size:11px; }
.field-top a span { margin-left:18px; color:#ff9a84; }
.field-heading { grid-area:heading; align-self:end; padding-top:52px; }
.field-heading > span { color:#aeafa6; font:9px/1.6 'DM Mono',monospace; letter-spacing:.1em; }
.field-heading h2 { margin:18px 0 30px; max-width:470px; color:#ece9e2; font:400 clamp(45px,4.4vw,70px)/1.02 'Newsreader',serif; letter-spacing:-.04em; text-wrap:balance; }
.field-heading em { color:#ff9a84; font-weight:400; }
.field-scene { grid-area:scene; position:relative; align-self:center; min-width:0; width:100%; height:clamp(500px,65svh,660px); }
.field-scene canvas { width:100%; height:100%; position:absolute; inset:0; pointer-events:none; }
.field-nodes { position:absolute; inset:0; pointer-events:none; }
.field-node { position:absolute; z-index:2; left:var(--x); top:var(--y); transform:translate(-50%,-50%); display:flex; gap:10px; align-items:center; padding:12px 10px; max-width:165px; min-height:48px; border:1px solid transparent; border-radius:4px; background:#1b1c1caa; color:#c6c5bc; text-align:left; cursor:pointer; pointer-events:auto; transition:background .2s,border-color .2s; }
.field-node > span { min-width:0; }
.field-node strong { font:500 13px/1.3 'Manrope',sans-serif; overflow-wrap:anywhere; }
.field-node small { display:block; margin-top:5px; color:#a7a99f; font:8px/1.4 'DM Mono',monospace; }
.field-node > i { width:6px; height:6px; flex:none; border:1px solid #ff9a84; border-radius:50%; }
.field-node:hover,.field-node.is-selected:not(.is-core) { color:#fff9f0; background:#292b27eb; border-color:#ffb09955; }
.field-node.is-selected > i { background:#ff9a84; box-shadow:0 0 15px #ff9a8480; }
.field-node.is-core { width:180px; max-width:180px; flex-direction:column; gap:13px; border-radius:50%; background:transparent; border:0; text-align:center; }
.field-node.is-core img { width:54px; height:54px; opacity:.85; filter:invert(1); mix-blend-mode:screen; }
.field-node.is-core strong { font-size:19px; letter-spacing:.18em; text-transform:uppercase; }
.field-node.is-core small { color:#dbbca8; font-size:7px; text-transform:uppercase; letter-spacing:.1em; }
.field-node[hidden] { display:none; }
.field-hint { position:absolute; left:0; right:0; bottom:18px; text-align:center; color:#9a9d91; font:8px 'DM Mono',monospace; letter-spacing:.13em; }
.field-detail { grid-area:detail; align-self:start; padding:24px 0 38px; border-top:1px solid #ece9e22b; max-width:470px; min-width:0; }
.field-dossier-top { display:flex; align-items:start; gap:18px; justify-content:space-between; color:#b1b2a8; font:9px/1.6 'DM Mono',monospace; text-transform:uppercase; letter-spacing:.07em; }
.field-dossier-top > span:last-child { color:#ff9a84; }
.field-dossier-head { display:grid; grid-template-columns:68px minmax(0,1fr); align-items:center; gap:20px; margin:22px 0 20px; }
.field-preview { display:grid; place-items:center; height:68px; width:68px; border:1px solid #ece9e223; border-radius:4px; color:#eee9df; background:#252a26; overflow:hidden; text-decoration:none; }
.field-preview img { width:100%; height:100%; object-fit:cover; }
.field-preview .field-preview-symbol { width:42px; height:42px; filter:invert(1); }
.field-preview > span { display:block; max-width:90%; font:400 22px/1 'Newsreader',serif; text-align:center; overflow-wrap:anywhere; }
.field-detail h3 { margin:0 0 10px; font:400 35px/1 'Newsreader',serif; letter-spacing:-.02em; overflow-wrap:anywhere; }
.field-facts { display:flex; gap:12px; flex-wrap:wrap; font:9px/1.6 'DM Mono',monospace; color:#b7b8ad; }
.field-facts span:last-child:not(:empty) { color:#c4dbbb; }
.field-detail > p { margin:0; font-size:13px; line-height:1.75; color:#b7b8ae; min-height:68px; }
.field-open { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-top:26px; padding:12px 0; color:#eee9df; border-bottom:1px solid #eee9df5a; text-decoration:none; font-size:11px; }
.field-open span { color:#ff9a84; font-size:20px; transition:transform .25s; }
.field-open:hover span { transform:translate(3px,-3px); }
.field-bottom { grid-area:bottom; min-width:0; display:flex; align-items:center; gap:18px; padding:18px 0; border-block:1px solid #ece9e21f; }
.field-index { display:flex; align-items:stretch; flex:1; min-width:0; gap:8px; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#686f6250 transparent; padding:5px; }
.field-index button { display:flex; align-items:center; gap:12px; min-height:48px; flex:none; padding:12px 18px; color:#b3b5aa; border:1px solid transparent; border-radius:4px; background:none; cursor:pointer; font:11px/1.3 'Manrope',sans-serif; }
.field-index button small { font:9px 'DM Mono',monospace; color:#989e90; }
.field-index button[aria-selected=true] { color:#f7f1e8; border-color:#eee9df27; background:#2b2e29; }
.field-index button[aria-selected=true] small { color:#ff9a84; }
.field-index button:hover { background:#292b27; }
.field-motion { flex:none; width:44px; height:44px; border:1px solid #eee9df27; border-radius:50%; background:none; color:#eee9df; cursor:pointer; }
.field :is(button,a,[role=tabpanel]):focus-visible { outline:2px solid #ffb099; outline-offset:3px; }
.field-detail.is-changing { animation:field-detail-in .25s ease both; }
.universe-static .field-scene { display:none; }
.universe-static .field { grid-template-areas:'top top' 'heading detail' 'bottom bottom'; align-items:center; }
.universe-static .field-detail { margin-top:35px; }
#universo,#lista-de-proyectos { scroll-margin-top:88px; }
@keyframes field-detail-in { from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:none} }
@media(max-width:1000px) and (min-width:761px) {
  .field { grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr); column-gap:2%; padding-inline:1%; }
  .field-heading h2 { font-size:49px; }
  .field-node { max-width:125px; gap:6px; padding:8px; }
  .field-node strong { font-size:11px; }
  .field-node small { font-size:7px; }
}
@media(max-width:760px) {
  .orbitarium { width:100%; margin:0 0 60px; }
  .field { display:flex; flex-direction:column; gap:0; padding:0; }
  .field-top { width:100%; padding-bottom:18px; gap:15px; }
  .field-id { font-size:8px; gap:8px; }
  .field-top a { font-size:10px; }
  .field-top a span { margin-left:5px; }
  .field-heading { align-self:stretch; padding-top:32px; }
  .field-heading h2 { font-size:clamp(40px,10.7vw,59px); max-width:560px; text-wrap:initial; margin-bottom:0; }
  .field-scene { height:360px; order:0; width:100%; }
  .field-node { max-width:115px; padding:9px 5px; gap:6px; background:#1b1c1ceb; }
  .field-node strong { font-size:10px; }
  .field-node small { font-size:6px; letter-spacing:0; }
  .field-node.is-core { width:125px; max-width:125px; gap:8px; }
  .field-node.is-core img { width:32px; height:32px; }
  .field-node.is-core strong { font-size:15px; }
  .field-node.is-core small { font-size:6px; }
  .field-hint { font-size:7px; bottom:5px; }
  .field-bottom { order:1; width:100%; padding:10px 0; gap:9px; margin:16px 0 0; }
  .field-index { gap:4px; }
  .field-index button { padding:10px 13px; font-size:11px; gap:7px; }
  .field-motion { width:40px; height:40px; }
  .field-detail { order:2; max-width:none; width:100%; border-top:0; padding:25px 0; }
  .field-detail > p { min-height:0; }
  .field-dossier-head { margin:20px 0; }
  .field-preview { width:60px; height:60px; }
  .field-detail h3 { font-size:32px; }
  .universe-static .field-detail { margin-top:0; }
}
@media(prefers-reduced-motion:reduce) {
  .field-detail.is-changing { animation:none; }
  .field-motion { display:none; }
  .field-node,.field-open span { transition:none; }
}