/* Demostración pública: conserva Archivo, las superficies y el verde de Ultra. */
.u-demo{padding:38px 0 44px;margin-bottom:46px;border-bottom:1px solid var(--line);scroll-margin-top:108px}
.u-demo *{box-sizing:border-box}
.u-demo [hidden]{display:none!important}
.u-demo-heading{margin-bottom:27px}
.u-demo-heading .u-eyebrow{margin-bottom:10px}
.u-demo-heading h2{font-size:32px;line-height:1.2;letter-spacing:-.04em;font-weight:600;margin:0 0 9px}
.u-demo-heading .u-muted{font-size:14px;margin:0}
.u-demo-picker{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.u-demo-subject{border:1px solid var(--line-strong);border-radius:30px;background:none;color:var(--ink-2);font-size:13px;padding:11px 18px;min-height:44px;transition:background .2s,border-color .2s,color .2s}
.u-demo-subject:hover{border-color:#8a9499;color:var(--ink)}
.u-demo-subject[aria-pressed=true]{background:var(--u-lime);color:var(--accent-ink);border-color:var(--u-lime)}
.u-demo-layout{display:grid;grid-template-columns:minmax(0,.64fr) minmax(0,1.36fr);gap:46px;align-items:start}
.u-demo-aside{padding-top:16px}
.u-demo-step{display:flex;gap:15px;align-items:flex-start;padding:15px 0;border:0;border-bottom:1px solid var(--line);text-align:left;background:none;color:inherit;width:100%;border-radius:0}
.u-demo-step:first-child{padding-top:0}
.u-demo-number{font-size:12px;color:var(--ink-3);min-width:20px;padding-top:2px}
.u-demo-step strong{display:block;font-weight:500;font-size:14px;color:var(--ink-2)}
.u-demo-step small{display:block;font-size:12px;color:var(--ink-3);line-height:1.5;margin-top:5px}
.u-demo-step[aria-pressed=true] strong,.u-demo-step[aria-pressed=true] .u-demo-number{color:var(--u-lime)}
.u-demo-step:hover strong{color:var(--ink)}
.u-demo-plan{margin-top:25px}
.u-demo-plan .u-muted{font-size:12px;margin:0 0 12px}
.u-demo-screen{background:var(--surface);border:1px solid var(--line-strong);border-radius:10px;overflow:hidden;min-width:0}
.u-demo-bar{display:flex;justify-content:space-between;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line);font-size:12px}
.u-demo-bar b{font-weight:600}
.u-demo-bar span{color:var(--ink-3);font-size:11px}
.u-demo-question{padding:20px 18px 17px}
.u-demo-topic{font-size:11px;color:var(--u-muted);margin-bottom:9px}
.u-demo-question>p{font-size:15px;line-height:1.6;margin:0 0 17px}
.u-demo-excerpt{margin:0 0 15px;padding:12px 14px;background:var(--surface-2);border-left:2px solid var(--line-strong);border-radius:0 5px 5px 0;font-size:13px;line-height:1.7;color:#c7cccf}
.u-demo-excerpt small{display:block;font-size:10px;letter-spacing:.07em;color:var(--ink-3);text-transform:uppercase;margin-bottom:5px}
.u-demo-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.u-demo-option{background:var(--surface-2);border:1px solid var(--line-strong);border-radius:7px;padding:11px 5px;font-size:19px;display:flex;justify-content:center;align-items:center;gap:12px;min-height:48px;min-width:0;transition:border-color .2s,background .2s}
.u-demo-option>span{font-size:12px;color:var(--ink-3)}
.u-demo-option>div{min-width:0}
.u-demo-option.is-correct{color:var(--ok);border-color:var(--ok);background:var(--ok-soft)}
.u-demo-option.is-correct>span{color:var(--ok)}
.u-demo-option.is-trap{color:var(--warn);border-color:var(--warn);background:var(--warn-soft)}
.u-demo-option.is-trap>span{color:var(--warn)}
.u-demo-options.is-long{grid-template-columns:repeat(2,minmax(0,1fr))}
.u-demo-options.is-long .u-demo-option{justify-content:flex-start;align-items:flex-start;font-size:12px;line-height:1.5;padding:10px 12px;gap:10px}
.u-demo-options.is-long .u-demo-option>span{padding-top:2px;flex-shrink:0}
.u-demo-result{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 18px 13px}
.u-demo-result strong{font-size:12px;font-weight:600;color:var(--ok)}
.u-demo-result>span,.u-demo-controls>span{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3)}
.u-demo-explanation{margin:0 12px 4px;background:var(--accent-soft);border:1px solid var(--accent-line);border-radius:10px;padding:14px}
.u-demo-layer{min-height:139px}
.u-demo .u-demo-layer h3{margin:0 0 10px;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.u-demo-layer>strong{font-size:25px;line-height:1.35;font-weight:500;letter-spacing:-.025em;display:block;margin-bottom:9px}
.u-demo-layer>p{font-size:13px;line-height:1.65;color:var(--ink-2);white-space:pre-line;margin:0}
.u-demo-layer[data-demo-layer="1"]{border-left:3px solid var(--ok);padding-left:12px}
.u-demo-layer[data-demo-layer="2"]{border-left:3px solid var(--warn);padding-left:12px}
.u-demo-layer.is-reading{min-height:165px}
.u-demo-layer.is-reading>strong{font-size:22px}
.u-demo-flow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:9px 0 13px}
.u-demo-flow>div{text-align:center;font-size:27px;line-height:1.2;font-weight:500}
.u-demo-flow small{display:block;font-size:11px;font-weight:400;color:var(--ink-2);margin-top:5px}
.u-demo-flow>span{font-size:12px;text-align:center;color:var(--ink-2)}
.u-demo-flow b{display:block;font-size:20px;color:var(--ink-3);font-weight:400}
.u-demo-mobile-tabs{display:none}
.u-demo-controls{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 18px 9px;min-height:47px}
.u-demo-play{font-size:12px;color:#c6cdc4;padding:8px 0;border:0;background:none;min-height:36px}
.u-demo-layer.is-entering{animation:u-demo-enter .3s ease-out both}
@keyframes u-demo-enter{from{opacity:.5;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:800px){
 .u-demo-layout{gap:24px;grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr)}
 .u-demo-step{gap:10px}
}
@media(max-width:620px){
 .u-demo{padding:29px 0 30px;margin-bottom:30px;scroll-margin-top:88px}
 .u-demo-heading{margin-bottom:20px}.u-demo-heading h2{font-size:29px}.u-demo-heading .u-muted{font-size:13px}
 .u-demo-picker{gap:7px;margin-bottom:21px}.u-demo-subject{font-size:12px;padding:10px 14px}
 .u-demo-layout{display:flex;flex-direction:column;gap:0}
 .u-demo-aside{order:2;width:100%;padding:0}.u-demo-steps{display:none}
 .u-demo-plan{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:20px}
 .u-demo-plan .u-muted{margin:0;max-width:165px}.u-demo-plan .u-button{flex-shrink:0}
 .u-demo-screen{width:100%;order:1}.u-demo-question{padding:17px 14px}.u-demo-question>p{font-size:14px}
 .u-demo-bar{padding:12px 14px}.u-demo-option{gap:9px;font-size:18px}
 .u-demo[data-subject="M2"] .u-demo-options,.u-demo[data-subject="CIENCIAS"] .u-demo-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .u-demo-options.is-long{grid-template-columns:minmax(0,1fr)}
 .u-demo-excerpt{font-size:12px;padding:10px 12px}.u-demo-result{margin-left:14px;margin-right:14px}
 .u-demo-mobile-tabs{display:flex;gap:16px;margin:0 14px 12px;border-bottom:1px solid var(--line-strong)}
 .u-demo-tab{font-size:11px;padding:10px 0;min-height:44px;background:none;border:0;border-bottom:2px solid transparent;color:var(--ink-2)}
 .u-demo-tab[aria-pressed=true]{border-bottom-color:var(--u-lime);color:var(--ink)}
 .u-demo-layer{min-height:161px}.u-demo-layer>strong{font-size:23px}
 .u-demo-layer.is-reading{min-height:196px}.u-demo-layer.is-reading>strong{font-size:21px}
 .u-demo-flow{gap:5px}.u-demo-flow>div{font-size:25px}.u-demo-flow>span{font-size:11px}
 .u-demo-play{min-height:44px}
}
@media(prefers-reduced-motion:reduce){.u-demo *{animation:none!important;transition:none!important}}
