:root{font-family:Arial,"Segoe UI",sans-serif;color-scheme:dark;--white:#f7fbff;--muted:#bbc9d6;--cyan:#71edf0;--line:rgba(222,242,247,.23);--panel:#07141b}
*{box-sizing:border-box}
html,body{margin:0;min-width:320px;min-height:100%;background:#06131a;color:var(--white)}
body{overflow-x:hidden}
button,a{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
a{color:var(--cyan)}
h1,h2,h3,p{margin-top:0}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;top:-70px;left:20px;z-index:90;background:#fff;color:#07141b;padding:12px 18px}
.skip-link:focus{top:14px}
.backdrop,.shade{position:fixed;inset:0;pointer-events:none}
.backdrop{z-index:0;background:#0a2632 url("costa-atardecer.png") center center/cover no-repeat;transition:right .3s}
.shade{z-index:0;background:linear-gradient(90deg,rgba(1,11,20,.55) 0%,rgba(1,11,20,.23) 54%,rgba(1,11,20,.06) 100%),linear-gradient(0deg,rgba(1,9,15,.54),transparent 35%),linear-gradient(180deg,rgba(1,10,18,.38),transparent 34%)}
.experience{position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column}
.chrome{position:relative;z-index:3;width:100%;padding:22px 3.3vw 0}
.chrome-row{min-height:50px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}
.identity{display:flex;align-items:center;gap:18px;white-space:nowrap}
.identity-mark{width:48px;height:36px;color:var(--cyan);flex:none}
.identity-name{font-size:clamp(22px,1.8vw,30px);letter-spacing:.015em}
.identity-name strong{font-weight:800}
.identity-name em{font-style:normal;font-weight:300;color:var(--cyan)}
.section-nav{display:flex;align-items:center;justify-content:flex-start;gap:clamp(16px,2.6vw,45px)}
.section-nav button{position:relative;border:0;background:none;color:#d2d5da;font-size:14px;padding:13px 0 16px;white-space:nowrap}
.section-nav button.active{color:var(--cyan);font-weight:700}
.section-nav button.active::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;background:var(--cyan)}
.header-tail{display:flex;align-items:center;gap:36px;color:#bec9d4;font-size:13px;line-height:1.35;white-space:nowrap}
.icon-button{border:0;background:none;color:#fff;padding:5px;display:grid;place-items:center}
.search-button{width:42px;height:42px}
.search-button svg{width:24px;height:24px}
.progress{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:13px;width:min(1112px,100%);margin-top:20px}
.progress-segment{display:flex;flex-direction:column;min-width:0;color:#b9c2cc}
.progress-line{height:5px;border-radius:4px;background:rgba(238,244,247,.3);overflow:hidden;margin-bottom:8px}
.progress-fill{display:block;height:100%;width:100%;background:#c5d1d8;transform:scaleX(0);transform-origin:left}
.progress-segment.active .progress-fill{background:var(--cyan)}
.progress-segment.active{color:var(--cyan)}
.progress-number{font-size:13px;line-height:1.15;margin-bottom:3px}
.progress-label{font-size:12px;line-height:1.25;white-space:normal}
.progress-segment.active .progress-label{font-weight:700}
.story{position:relative;z-index:2;flex:1;display:flex;align-items:center;min-height:0;touch-action:pan-y pinch-zoom}
.scene-host{width:100%}
.scene{width:100%;min-height:570px;display:flex;align-items:center;animation:scene-enter .35s ease-out both}
.stage{width:min(980px,calc(100% - 6.6vw));margin-left:3.3vw;padding:42px 0 36px}
.feature-stage{width:min(930px,calc(100% - 6.6vw));padding:34px 0 10px}
.feature-kicker{display:block;color:var(--cyan);font-size:13px;font-weight:800;letter-spacing:.2em;margin-bottom:9px}
.feature-title{font-size:clamp(50px,4.7vw,78px);font-weight:800;letter-spacing:-.045em;line-height:.98;margin:0 0 20px}
.feature-copy{font-size:clamp(17px,1.23vw,21px);line-height:1.33;max-width:560px;margin-bottom:42px;text-wrap:pretty}
.feature-signals{display:flex;align-items:flex-start;gap:32px;margin-bottom:31px;max-width:785px}
.feature-signal{display:flex;align-items:flex-start;gap:15px;width:33.33%;font-size:14px;line-height:1.28}
.feature-signal svg{width:38px;height:38px;flex:none}
.inspect-button{display:inline-flex;align-items:center;gap:18px;background:rgba(2,17,23,.79);color:#fff;border:1px solid var(--cyan);border-radius:30px;min-height:52px;padding:0 22px;font-weight:700;font-size:16px;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.inspect-button:hover{background:#0d333c}
.inspect-button svg{width:27px;height:27px}
.inspect-button span{font-size:23px;margin-left:8px}
.eyebrow-row{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.18em;color:var(--cyan);text-transform:uppercase}
.eyebrow b{margin-right:9px}
.data-kind{font-size:11px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);border-radius:18px;padding:5px 9px}
.hero-title{font-size:clamp(90px,10vw,160px);font-weight:800;letter-spacing:-.075em;line-height:.9;margin:0 0 20px}
.scene-title{font-size:clamp(50px,5vw,82px);font-weight:400;letter-spacing:-.055em;line-height:.98;margin:0 0 24px}
.scene-title strong{font-weight:800}
.hero-fact,.lede{font-size:clamp(18px,1.25vw,22px);line-height:1.45;max-width:690px;color:#eef4f6;margin:0 0 24px}
.hero-fact strong{color:#fff}
.lede.large{font-size:clamp(20px,1.5vw,26px)}
.source-inline,.method-inline{border:0;border-bottom:1px solid var(--cyan);background:none;color:var(--cyan);padding:2px 0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.source-inline:hover,.method-inline:hover{color:#fff;border-color:#fff}
.placeholder-banner{display:inline-flex;align-items:center;gap:9px;background:rgba(4,18,25,.7);border-left:2px solid var(--cyan);padding:10px 12px;color:#d7edf0;font-size:12px;max-width:690px}
.placeholder-banner span{display:flex;align-items:center;gap:8px}
.placeholder-banner i{font-size:12px;font-style:normal;border:1px solid var(--cyan);border-radius:50%;width:18px;height:18px;text-align:center;line-height:16px}
.hero-actions,.end-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.pill{border:1px solid rgba(255,255,255,.5);border-radius:28px;min-height:48px;padding:11px 21px;background:rgba(5,21,28,.72);color:#fff;font-weight:700;font-size:14px}
.pill:hover{border-color:var(--cyan);background:#0d343b}
.pill.primary{border-color:var(--cyan);background:var(--cyan);color:#06131a}
.pill.primary:hover{background:#b0f6f8}
.pending-block{max-width:760px;border-left:3px solid var(--cyan);background:rgba(4,18,24,.68);padding:22px 27px;margin:14px 0 20px}
.pending-block strong{display:block;font-size:clamp(29px,3vw,48px);line-height:1.03;letter-spacing:-.04em}
.pending-block p{font-size:16px;line-height:1.45;color:#d6e1e7;margin:10px 0 0}
.ring-grid{display:flex;gap:50px;flex-wrap:wrap;margin:18px 0 30px}
.ring-item{width:140px;text-align:center}
.ring-svg{display:block;width:104px;height:104px;margin:0 auto 8px}
.ring-bg{fill:none;stroke:rgba(255,255,255,.23);stroke-width:9}
.ring-value{fill:none;stroke-width:9;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%}
.ring-svg text{fill:#fff;font-size:27px;font-weight:800;text-anchor:middle;dominant-baseline:central}
.ring-item p{margin:0 0 5px;color:#eef3f5;font-size:14px}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:940px;border-top:1px solid var(--line);padding-top:20px}
.metric span{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
.metric strong{display:block;font-size:22px}
.metric small{display:block;font-size:12px;line-height:1.4;color:var(--muted);margin-top:6px}
.metric-pending{color:#b8f5f5}
.editorial-foot{max-width:760px;font-size:13px;line-height:1.45;color:#d0dce2;margin:20px 0 0}
.big-number{font-size:clamp(78px,10vw,150px);font-weight:800;letter-spacing:-.08em;line-height:.9;white-space:nowrap;margin:8px 0}
.big-number .currency{font-size:.49em;font-weight:400;vertical-align:18%}
.unit-line{font-size:20px;color:#e4edf0;margin:0 0 27px}
.distribution{display:grid;gap:4px;height:13px;width:min(940px,100%);margin:19px 0 13px}
.distribution span{background:rgba(255,255,255,.38);border-radius:4px}
.distribution span:first-child{background:#e3f3f5}
.distribution span:nth-child(2){background:var(--cyan)}
.distribution-labels{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:940px}
.distribution-labels span{font-size:13px;color:#dce8ea}
.distribution-labels strong{display:block;font-size:24px;color:#fff;margin-top:5px}
.missing-stage{max-width:900px}
.summary-panel{max-width:920px;background:rgba(4,18,24,.79);border:1px solid var(--line);border-radius:15px;padding:12px 25px}
.summary-row{display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);padding:12px 0;font-size:14px}
.summary-row:last-child{border:0}
.summary-row>span{display:block;line-height:1.35}
.summary-row .dot{margin-right:10px}
.dot{display:inline-block;width:9px;height:9px;flex:none;border-radius:50%;background:#acb8bc}
.dot.green{background:#3bd87a}.dot.yellow{background:#f4c64d}
.bottom-bar{position:relative;z-index:3;display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:20px;min-height:118px;padding:0 3.3vw 34px}
.territory-sign{display:flex;align-items:flex-start;gap:10px;font-size:13px}
.territory-sign svg{width:20px;height:20px;flex:none}
.territory-sign span{display:flex;flex-direction:column;gap:3px}
.territory-sign strong{font-size:12px;font-weight:700}
.territory-sign small{font-size:13px;color:var(--muted)}
.transport{display:flex;align-items:center;border:1px solid rgba(151,242,244,.75);background:rgba(3,19,25,.91);border-radius:40px;min-height:52px;overflow:hidden}
.transport-side{display:flex;align-items:center;justify-content:center;gap:18px;border:0;background:none;color:#fff;min-width:148px;min-height:50px;font-size:14px;font-weight:700}
.transport-side:hover:not(:disabled){background:rgba(113,237,240,.1)}
.transport-side span{font-size:22px;font-weight:400}
.transport-side:disabled{opacity:.4;cursor:default}
.playback-button{display:grid;place-items:center;border:0;border-radius:50%;background:var(--cyan);color:#07151c;width:52px;height:52px;font-size:22px;font-weight:800;flex:none}
.playback-button:hover{background:#b2f6f7}
.scene-counter{justify-self:end;font-size:16px;font-weight:700;letter-spacing:.02em;white-space:nowrap;min-width:95px}
.scene-counter i{font-style:normal;color:#adb9c1;padding:0 4px}
.all-sources{position:absolute;right:3.3vw;bottom:9px;padding:0;border:0;background:none;color:#bdd2d8;font-size:11px;text-decoration:underline;text-underline-offset:3px}
#info-dialog{position:fixed;z-index:60;inset:76px 0 0 auto;margin:0;width:min(450px,100vw);height:calc(100svh - 76px);max-width:none;max-height:none;overflow-y:auto;overflow-x:hidden;border:1px solid rgba(132,185,192,.22);border-right:0;border-bottom:0;border-radius:8px 0 0 0;background:#06141b;color:#fff;padding:25px 23px 28px;box-shadow:-10px 0 35px rgba(0,0,0,.28);animation:drawer-in .28s ease-out}
#info-dialog::backdrop{background:transparent}
.dialog-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:0 0 4px}
.dialog-top h2{font-size:29px;line-height:1.1;letter-spacing:-.035em;margin:0;font-weight:800}
.dialog-top button{flex:none;border:0;background:none;color:#fff;font-size:31px;font-weight:200;line-height:1;padding:0 4px}
#dialog-content{font-size:13px;line-height:1.38}
.panel-lede{color:#cbd7e1;margin:2px 0 20px;font-size:13px}
.source-detail{padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.source-feature{display:flex;align-items:center;gap:15px;padding:15px 14px;border:1px solid rgba(121,175,186,.24);border-radius:14px;background:#0d2631;margin-bottom:14px}
.feature-icon,.history-icon{display:grid;place-items:center;flex:none;width:54px;height:54px;border-radius:50%;background:#204958;color:var(--cyan);font-size:26px}
.source-feature strong{display:block;color:var(--cyan);font-size:14px;margin-bottom:4px}
.source-feature small{display:block;color:#b8c9d5;font-size:12px;line-height:1.3}
.source-table{margin:0}
.source-table>div{display:grid;grid-template-columns:43% 57%;gap:8px;padding:7px 4px;border-bottom:1px solid rgba(214,236,240,.11)}
.source-table dt{color:#c3d0db}
.source-table dd{margin:0;color:#fff;overflow-wrap:anywhere}
.source-table a{color:var(--cyan);text-decoration:none}
.source-status{display:flex;align-items:center;gap:8px}
.source-history{border:1px solid rgba(121,175,186,.16);border-radius:15px;background:#0a2029;margin-top:14px;padding:12px}
.history-heading{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.history-icon{width:38px;height:38px;font-size:24px}
.history-heading strong{display:block;font-size:14px}
.history-heading small{display:block;font-size:11px;color:#becbd5;margin-top:3px}
.history-row{display:grid;grid-template-columns:28% 40% 32%;gap:6px;border-top:1px solid var(--line);padding-top:10px;color:#cfdae0;font-size:11px}
.source-note{color:#c5d5dc;line-height:1.45;margin:14px 1px 0;overflow-wrap:anywhere}
.scene-menu{display:grid;gap:8px;margin-top:20px}
.scene-menu button{display:flex;align-items:center;gap:12px;width:100%;text-align:left;min-height:48px;border:1px solid var(--line);border-radius:8px;background:#0e2731;color:#fff;padding:11px}
.scene-menu button:hover,.scene-menu button[aria-current="step"]{border-color:var(--cyan)}
.scene-menu span{color:var(--cyan);font-weight:800}
body.panel-open .backdrop{right:450px;background-position:70% center}
@keyframes scene-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes drawer-in{from{transform:translateX(24px)}to{transform:translateX(0)}}
@media(min-width:1101px){.feature-stage{transform:translateY(13px)}}
@media(min-width:1101px){.experience.panel-open .story,.experience.panel-open .bottom-bar{width:calc(100% - 450px)}.experience.panel-open .stage{width:min(960px,calc(100% - 6.6vw))}}
@media(max-width:1100px){
  .chrome{padding:18px 24px 0}
  .chrome-row{grid-template-columns:1fr auto;gap:12px}
  .section-nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;gap:27px;overflow-x:auto}
  .header-tail{gap:15px}
  .progress{margin-top:15px}
  .stage{margin-left:24px;width:calc(100% - 48px)}
  .bottom-bar{padding:0 24px 25px}
  .all-sources{right:24px}
}
@media(max-width:750px){
  .chrome{padding:15px 16px 0}
  .identity{gap:8px}
  .identity-mark{width:35px;height:28px}
  .identity-name{font-size:20px}
  .header-tail>span{display:none}
  .section-nav{gap:22px;scrollbar-width:none}
  .section-nav::-webkit-scrollbar{display:none}
  .section-nav button{font-size:12px;padding:9px 0 13px}
  .progress{display:flex;overflow-x:auto;gap:8px;scrollbar-width:none;margin-top:10px;padding-bottom:3px}
  .progress::-webkit-scrollbar{display:none}
  .progress-segment{flex:0 0 103px}
  .progress-number{font-size:11px}
  .progress-label{font-size:10px}
  .story{align-items:flex-start}
  .scene{min-height:calc(100svh - 310px);align-items:center}
  .stage,.feature-stage{margin-left:16px;width:calc(100% - 32px);padding:42px 0 48px}
  .feature-stage{padding-top:28px}
  .feature-kicker{font-size:11px}
  .feature-title{font-size:clamp(47px,10vw,70px);margin-bottom:16px}
  .feature-copy{font-size:16px;margin-bottom:25px}
  .feature-signals{gap:16px;flex-wrap:wrap;margin-bottom:24px}
  .feature-signal{width:calc(50% - 8px);gap:8px;font-size:12px}
  .feature-signal svg{width:30px;height:30px}
  .inspect-button{font-size:14px;min-height:48px}
  .hero-title{font-size:clamp(71px,17vw,120px)}
  .scene-title{font-size:clamp(42px,10vw,66px)}
  .hero-fact,.lede{font-size:16px}
  .lede.large{font-size:18px}
  .ring-grid{gap:8px;justify-content:space-between}
  .ring-item{width:calc((100% - 16px)/3)}
  .ring-svg{width:75px;height:75px}
  .ring-item p{font-size:12px}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .big-number{font-size:clamp(56px,14vw,91px)}
  .unit-line{font-size:17px}
  .summary-panel{padding:8px 14px}
  .summary-row{font-size:12px}
  .bottom-bar{grid-template-columns:1fr auto;gap:10px;min-height:135px;padding:0 16px 26px}
  .territory-sign{grid-column:1;grid-row:1}
  .territory-sign small{font-size:11px}
  .transport{grid-column:1/-1;grid-row:2;justify-self:center;min-height:46px}
  .transport-side{min-width:112px;min-height:45px;font-size:12px;gap:7px}
  .playback-button{width:46px;height:46px}
  .scene-counter{grid-column:2;grid-row:1;font-size:13px;min-width:0}
  .all-sources{display:none}
  #info-dialog{inset:0 0 0 auto;width:min(450px,100vw);height:100svh;border-radius:0;padding:25px 18px}
}
@media(max-width:420px){
  .identity-name{font-size:17px}
  .feature-title{font-size:45px}
  .feature-signal{width:100%}
  .feature-signals{gap:10px}
  .feature-signal svg{width:27px;height:27px}
  .inspect-button{width:100%;justify-content:center}
  .ring-svg{width:67px;height:67px}
  .ring-item p{font-size:11px}
  .distribution-labels{gap:7px}
  .distribution-labels span{font-size:11px}
  .distribution-labels strong{font-size:19px}
  .transport-side{min-width:100px}
  .history-row{font-size:10px}
}
@media(max-height:700px) and (min-width:751px){.story{align-items:flex-start}.scene{align-items:flex-start}.stage{padding-top:42px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Contenido nuevo sobre el sistema editorial existente. */
.information-stage .scene-title,.security-stage .scene-title{margin-bottom:16px}
.information-stage .lede{max-width:780px;margin-bottom:18px}
.public-list,.security-list{max-width:910px;border-top:1px solid var(--line)}
.public-row,.security-item{display:flex;align-items:center;justify-content:space-between;gap:22px;border-bottom:1px solid var(--line);padding:13px 3px}
.public-row>div:first-child{display:flex;flex-direction:column;gap:4px}
.public-row strong{font-size:18px}
.public-row span{font-size:13px;color:#d2dee4}
.public-meta{display:flex;align-items:center;justify-content:flex-end;gap:20px;min-width:295px}
.public-meta em{font-size:11px;font-style:normal;font-weight:700;letter-spacing:.06em;text-align:right;color:#c5eff0}
.security-item>div:first-child{display:grid;grid-template-columns:235px 125px 1fr;align-items:baseline;gap:12px;min-width:0}
.security-item span{font-size:16px;font-weight:700}
.security-item strong{font-size:36px;line-height:1;letter-spacing:-.05em}
.security-item small{font-size:12px;color:#d2dee4}
.security-item-end{display:flex;align-items:baseline;justify-content:flex-end;gap:11px;white-space:nowrap}
.security-item-end b{font-size:22px}
.security-item-end .source-inline{margin-left:10px}
.security-detail{border-top:1px solid var(--line);margin-top:17px;padding-top:15px;color:#dce9ed}
.detail-heading{display:block;color:var(--cyan);font-size:12px;letter-spacing:.12em;margin-bottom:8px}
.security-detail p{margin:9px 0 13px;line-height:1.45}
.security-detail table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.security-detail caption{text-align:left;color:#b9cad4;font-size:11px;margin-bottom:7px}
.security-detail th,.security-detail td{padding:7px 5px;border-bottom:1px solid var(--line);text-align:right}
.security-detail th:first-child{text-align:left}
@media(max-width:1100px){
  .security-item>div:first-child{grid-template-columns:190px 100px 1fr}
  .security-item strong{font-size:30px}
}
@media(max-width:750px){
  .public-row,.security-item{align-items:flex-start;gap:10px}
  .public-row strong{font-size:15px}
  .public-row span{font-size:12px}
  .public-meta{min-width:110px;flex-direction:column;align-items:flex-end;gap:8px}
  .public-meta em{font-size:9px}
  .security-item>div:first-child{display:flex;flex-direction:column;gap:3px}
  .security-item span{font-size:14px}
  .security-item strong{font-size:33px}
  .security-item-end{flex-direction:column;align-items:flex-end;gap:2px}
  .security-item-end b{font-size:20px}
  .security-item-end .source-inline{margin:7px 0 0;font-size:10px}
}
@media(max-width:420px){
  .information-stage .scene-title,.security-stage .scene-title{font-size:47px}
  .security-item small{font-size:10px}
  .security-detail th,.security-detail td{padding:6px 2px;font-size:11px}
}
