:root{--night:#0b0f1e;--night-2:#141b33;--ink:#1c1830;--amber:#fed018;--amber-2:#d35600;--cream:#fff4c9;--text:#d6dcf0;--muted:#9aa3c0;--title:"Press Start 2P", monospace;--crt:"VT323", ui-monospace, monospace;--ui:"Pixelify Sans", system-ui, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--night);color:var(--text);font-family:var(--ui);margin:0;font-size:18px;line-height:1.5}img{max-width:100%;height:auto;image-rendering:pixelated;display:block}a{color:inherit}.bar{z-index:10;box-shadow:0 2px 0 var(--night-2);background:#0b0f1eeb;border-bottom:2px solid #000;justify-content:space-between;align-items:center;gap:16px;padding:14px clamp(16px,4vw,48px);display:flex;position:sticky;top:0}.mark{font-family:var(--title);color:var(--cream);letter-spacing:.04em;font-size:14px;text-decoration:none}.mark span{color:var(--amber);margin-left:8px}.bar nav{align-items:center;gap:clamp(12px,2.5vw,28px);font-size:16px;display:flex}.bar nav a{color:var(--muted);text-decoration:none}.bar nav a:hover{color:var(--cream)}.bar nav .play-small{color:var(--ink);background:var(--amber);box-shadow:inset 0 -3px 0 var(--amber-2);padding:6px 14px;font-weight:600}.bar nav .play-small:hover{color:var(--ink);background:#ffe25a}.play{font-family:var(--title);color:var(--ink);background:var(--amber);box-shadow:inset 0 -4px 0 var(--amber-2), 0 4px 0 #000;border:2px solid #000;margin-top:6px;padding:12px 22px;font-size:13px;text-decoration:none;display:inline-block}.play:hover{background:#ffe25a}.play:active{box-shadow:inset 0 -2px 0 var(--amber-2), 0 2px 0 #000;transform:translateY(2px)}main{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}.hero{padding:clamp(20px,4vw,44px) 0 clamp(40px,6vw,72px)}.screen{background:#000;border:3px solid #000;position:relative;box-shadow:0 0 0 6px #3a3f52,0 0 0 9px #000,0 18px 0 -3px #00000080}.screen img{width:100%}.screen:after{content:"";pointer-events:none;background:repeating-linear-gradient(#0000001f 0 2px,#0000 2px 4px);position:absolute;inset:0}.screen-text{z-index:1;background:#0b0f1ee6;border:2px solid #000;max-width:min(560px,62%);padding:clamp(14px,2.4vw,26px);position:absolute;bottom:clamp(14px,3vw,36px);left:clamp(14px,3vw,36px);box-shadow:inset 0 0 0 2px #2b3456}.screen-text h1{font-family:var(--title);color:var(--cream);margin:0 0 10px;font-size:clamp(16px,2.4vw,26px);font-weight:400;line-height:1.35}.screen-text p{margin:0 0 14px;font-size:clamp(15px,1.5vw,18px)}.screen-text small{color:var(--muted);margin-top:12px;font-size:14px;display:block}h2{font-family:var(--title);color:var(--amber);margin:0 0 10px;font-size:clamp(16px,2vw,22px);font-weight:400}.lead{color:var(--muted);max-width:640px;margin:0 0 28px}.stories{padding:24px 0 48px}.story{border-top:2px dashed #2b3456;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(18px,3vw,36px);padding:24px 0;display:grid}.cover{border:3px solid #000;display:block;position:relative;box-shadow:0 0 0 3px #3a3f52}.soon-screen{aspect-ratio:16/9;text-align:center;background:repeating-linear-gradient(#ffffff08 0 2px,#0000 2px 4px),radial-gradient(#1b2440 0%,#0b0f1e 75%);place-content:center;gap:14px;display:grid}.soon-screen b{font-family:var(--title);color:#5a6488;font-size:clamp(16px,2.6vw,26px);font-weight:400}.soon-screen span{font-family:var(--crt);letter-spacing:.2em;color:var(--amber-2);font-size:22px}.level{font-family:var(--crt);color:var(--amber-2);letter-spacing:.06em;font-size:20px}.story h3{font-family:var(--title);color:var(--cream);margin:2px 0 10px;font-size:clamp(18px,2.4vw,26px);font-weight:400}.story p{margin:0 0 12px}.story .learn{font-family:var(--crt);color:var(--amber);font-size:20px;line-height:1.25}.story .meta{color:var(--muted);font-size:16px}.story.soon h3,.story.soon p{opacity:.8}.how{border-top:2px dashed #2b3456;padding:24px 0 56px}.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);margin-top:18px;display:grid}.steps figure{margin:0}.steps img{aspect-ratio:16/10;object-fit:cover;border:3px solid #000;width:100%;box-shadow:0 0 0 3px #3a3f52}.steps figcaption{margin-top:14px;font-size:16px}.steps figcaption b{color:var(--cream);font-weight:600;display:block}footer{color:var(--muted);text-align:center;background:#070a16;border-top:2px solid #000;padding:26px clamp(16px,4vw,48px);font-size:15px}footer p{margin:4px 0}@media (width<=860px){.story,.steps{grid-template-columns:1fr}.screen-text{border-width:3px 0 0;border-top-style:solid;border-top-color:#000;max-width:none;position:static}.bar nav a:not(.play-small){display:none}}.account{align-items:center;gap:12px;min-height:32px;display:inline-flex}.account .enter{font:600 16px var(--ui);color:var(--cream);border:2px solid var(--cream);cursor:pointer;background:0 0;padding:4px 12px}.account .enter:hover{background:var(--cream);color:var(--ink)}.account .me{color:var(--cream);text-decoration:none}.profile-page{min-height:70vh}.profile{max-width:760px;margin:0 auto;padding:40px 0 60px}.profile h1{font-family:var(--title);color:var(--cream);margin:0 0 8px;font-size:clamp(18px,3vw,28px);font-weight:400}.profile .muted,.pc-head span{color:var(--muted)}.pc-games{gap:16px;margin:28px 0;display:grid}.pg{color:var(--ink);background:#fffbe8;border:3px solid #000;gap:4px;padding:18px 20px;display:grid;box-shadow:0 0 0 3px #3a3f52}.pg .level{font-family:var(--crt);color:#a31d33;font-size:20px}.pg b{font-family:var(--title);font-size:18px;font-weight:400}.pg .rank{font-family:var(--crt);color:#a31d33;font-size:24px}.pg.locked{color:var(--muted);background:#141b33}.pg.locked b{color:#5a6488}.bar-prog{border:2px solid var(--ink);background:#fffbe8;height:10px;margin:4px 0}.bar-prog i{background:var(--amber);height:100%;display:block}.pc-edit{border:2px dashed #2b3456;gap:14px;padding:22px;display:grid}.pc-edit h2{margin:0}.pc-edit label{gap:6px;font-size:16px;display:grid}.pc-edit input[type=text],.pc-edit input:not([type]){font:18px var(--crt);color:var(--cream);background:#0b0f1e;border:2px solid #3a3f52;padding:8px 10px}.pc-edit .check{align-items:center;gap:10px;display:flex}.pc-actions{align-items:center;gap:14px;display:flex}.pc-actions .msg{color:var(--amber)}.pc-share{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;font-size:15px;display:flex}.pc-share code{font-family:var(--crt);color:var(--cream);word-break:break-all;background:#0b0f1e;padding:4px 8px;font-size:18px}.pc-share .copy{font:600 15px var(--ui);color:var(--cream);border:2px solid var(--cream);cursor:pointer;background:0 0;padding:4px 10px}.retos-teaser{border-top:2px dashed #2b3456;align-items:center;gap:clamp(18px,3vw,40px);padding:32px 0 48px;display:flex}.retos-teaser p{max-width:640px;margin:0 0 12px}.retos-teaser code{font-family:var(--crt);color:var(--amber);background:#141b33;padding:0 4px;font-size:1.12em}.retos-teaser .meta{color:var(--muted);font-size:16px}.rt-faces{flex:none;gap:10px;display:flex}.rt-faces .r-face{--s:4;width:calc(16px * var(--s));height:calc(20px * var(--s));background:#2b3a63 url(/assets/portraits.png) no-repeat;background-size:calc(64px * var(--s)) calc(120px * var(--s));background-position:calc(var(--col) * -16px * var(--s)) calc(var(--fila) * -20px * var(--s));image-rendering:pixelated;border:3px solid #000;box-shadow:0 0 0 3px #3a3f52}@media (width<=860px){.retos-teaser{flex-direction:column;align-items:flex-start}}section[id]{scroll-margin-top:80px}
