*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
        --bg:      #020602;
        --green:   #20c20e;
        --bright:  #39ff14;
        --glow:    rgba(57,255,20,0.45);
        --glow2:   rgba(57,255,20,0.18);
        --dim:     #2a522a;
        --dimmer:  #0c420c;
        --cyan:    #00e8ff;
        --amber:   #ffb000;
        --red:     #ff3030;
        --font:    'Share Tech Mono','Courier New',monospace;
        --title:   'VT323','Courier New',monospace;
    }

    html, body {
        min-height: 100vh;
        background: var(--bg);
        color: var(--green);
        font-family: var(--font);
        font-size: clamp(13px, 1.6vw, 15px);
        line-height: 1.65;
        overflow-x: hidden;
    }

    /* ── CRT ─────────────────────────────────────────────────────────── */
    #crt-noise {
        position: fixed; inset: 0; pointer-events: none; z-index: 899;
        opacity: 0.038;
        background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
        background-size: 256px 256px;
        animation: noise 0.09s steps(1) infinite;
    }
    @keyframes noise {
        0%   { background-position:   0%   0%; }
        11%  { background-position:  -5% -10%; }
        22%  { background-position: -15%   5%; }
        33%  { background-position:   7% -25%; }
        44%  { background-position:  20%  10%; }
        55%  { background-position: -15%  15%; }
        66%  { background-position:  15%  35%; }
        77%  { background-position:   0%  40%; }
        88%  { background-position: -20%  30%; }
    }
    #crt-scanlines {
        position: fixed; inset: 0; pointer-events: none; z-index: 900;
        background: repeating-linear-gradient(
            to bottom,
            rgba(0,255,100,0.024) 0px, rgba(0,255,100,0.024) 1px,
            transparent 1px, transparent 3px
        );
        mix-blend-mode: screen;
        animation: flicker 11s infinite;
    }
    #crt-vignette {
        position: fixed; inset: 0; pointer-events: none; z-index: 901;
        background: radial-gradient(ellipse 80% 72% at 50% 50%, transparent 32%, rgba(0,0,0,0.80) 100%);
        box-shadow: inset 0 0 90px rgba(0,0,0,0.55);
    }
    @keyframes flicker { 0%,100% { opacity:1; } 41% { opacity:1; } 41.05% { opacity:.78; } 41.15% { opacity:1; } }

    /* ── Layout ──────────────────────────────────────────────────────── */
    main {
        position: relative; z-index: 10;
        min-height: 100vh;
        display: flex; flex-direction: column; align-items: flex-start; justify-content: center;
        max-width: 700px;
        margin: 0 auto;
        padding: 3.5rem 2rem 4rem;
        gap: 0;
    }

    /* ── Stamp ───────────────────────────────────────────────────────── */
    .stamp {
        font-size: .62rem; color: var(--dim);
        letter-spacing: .18em; text-transform: uppercase;
        margin-bottom: 1.8rem;
        animation: fadein .5s ease both;
    }

    /* ── Clasificación ───────────────────────────────────────────────── */
    .clasificacion {
        display: flex; gap: 1.6rem; flex-wrap: wrap;
        margin-bottom: 1.6rem;
        animation: fadein .5s ease .05s both;
    }
    .badge {
        font-size: .65rem; letter-spacing: .14em;
        border: 1px solid var(--dim); padding: .2rem .7rem;
        color: var(--dim);
    }
    .badge.warn { border-color: rgba(255,176,0,.4); color: var(--amber); }

    /* ── Separador ───────────────────────────────────────────────────── */
    .sep {
        color: var(--dimmer);
        font-size: .75rem;
        letter-spacing: .02em;
        width: 100%;
        margin: 1.4rem 0;
        overflow: hidden; white-space: nowrap;
        animation: fadein .6s ease both;
    }

    /* ── Taglines ────────────────────────────────────────────────────── */
    .tagblock {
        display: flex; flex-direction: column; gap: .28rem;
        margin-bottom: .6rem;
        animation: fadein .6s ease .1s both;
    }
    .tagblock p      { font-size: .9rem; color: var(--green); }
    .tagblock .sub   { font-size: .78rem; color: var(--dim); }

    /* ── Botón de descarga ───────────────────────────────────────────── */
    .dl-wrap {
        animation: fadein .6s ease .2s both;
        width: 100%;
    }
    .dl-btn {
        display: flex; align-items: center; gap: 1rem;
        border: 1px solid rgba(57,255,20,.5);
        padding: .9rem 1.4rem;
        text-decoration: none; color: var(--bright);
        font-family: var(--font);
        font-size: 1rem;
        letter-spacing: .08em;
        position: relative;
        transition: background .15s, border-color .15s;
        animation: btn-pulse 3.5s ease-in-out infinite;
        cursor: pointer; background: transparent;
        width: 100%;
    }
    .dl-btn::before {
        content: '';
        position: absolute; inset: -1px;
        background: linear-gradient(90deg, transparent 0%, rgba(57,255,20,.08) 50%, transparent 100%);
        animation: btn-sweep 2.8s linear infinite;
        pointer-events: none;
    }
    .dl-btn:hover, .dl-btn:focus {
        background: rgba(57,255,20,.06);
        border-color: var(--bright);
        outline: none;
    }
    .dl-btn .dl-icon { font-size: 1.4rem; flex-shrink: 0; }
    .dl-btn .dl-info { display: flex; flex-direction: column; gap: .1rem; flex: 1; }
    .dl-btn .dl-name { font-size: 1rem; color: var(--bright); }
    .dl-btn .dl-meta { font-size: .68rem; color: var(--dim); letter-spacing: .06em; }
    .dl-btn .dl-size { font-size: .68rem; color: var(--dim); text-align: right; white-space: nowrap; }
    .dl-btn.disabled { opacity: .45; cursor: not-allowed; }
    .dl-btn.disabled::before { display: none; }

    @keyframes btn-sweep { from { transform: translateX(-100%); } to { transform: translateX(200%); } }
    @keyframes btn-pulse { 0%,100% { border-color: rgba(57,255,20,.5); } 50% { border-color: rgba(57,255,20,.85); box-shadow: 0 0 12px rgba(57,255,20,.1); } }

    /* ── Plataformas no disponibles ──────────────────────────────────── */
    .platform-list {
        display: flex; flex-direction: column; gap: .5rem;
        animation: fadein .6s ease .3s both;
    }
    .platform-row {
        display: flex; align-items: center; gap: .9rem;
        font-size: .75rem; color: var(--dimmer);
        letter-spacing: .06em;
    }
    .platform-row .picon { font-size: 1rem; width: 1.4rem; }
    .platform-row.coming { color: var(--dim); }

    /* ── Specs ───────────────────────────────────────────────────────── */
    .specs {
        display: flex; flex-direction: column; gap: .32rem;
        animation: fadein .6s ease .25s both;
    }
    .spec-row {
        display: flex; gap: .8rem;
        font-size: .78rem;
    }
    .spec-key  { color: var(--dim); min-width: 90px; flex-shrink: 0; }
    .spec-val  { color: var(--green); }

    /* ── Advertencia SmartScreen ─────────────────────────────────────── */
    .smartscreen-note {
        border: 1px solid rgba(255,176,0,.25);
        padding: .7rem 1rem;
        font-size: .74rem; color: var(--dim);
        line-height: 1.6;
        animation: fadein .6s ease .35s both;
    }
    .smartscreen-note .warn-label {
        color: var(--amber); letter-spacing: .1em; font-size: .65rem;
        display: block; margin-bottom: .3rem;
    }

    /* ── Alternativa web ─────────────────────────────────────────────── */
    .alt-link {
        font-size: .8rem; color: var(--dim);
        animation: fadein .6s ease .4s both;
    }
    .alt-link a {
        color: var(--green); text-decoration: none;
        transition: color .15s;
    }
    .alt-link a:hover { color: var(--bright); }

    /* ── Telegram block ─────────────────────────────────────────────── */
    .tg-block {
        animation: fadein .6s ease .42s both;
    }
    .tg-label {
        font-size: .65rem; color: var(--dimmer);
        letter-spacing: .12em; margin-bottom: .7rem;
    }
    .tg-links {
        display: flex; flex-direction: column; gap: .45rem;
    }
    .tg-link {
        display: flex; align-items: center; gap: .8rem;
        padding: .5rem .75rem;
        border: 1px solid var(--dimmer);
        color: var(--green); text-decoration: none;
        transition: border-color .15s, color .15s, background .15s;
    }
    .tg-link:hover {
        border-color: var(--green);
        background: rgba(0,255,65,.04);
        color: var(--bright);
    }
    .tg-tag {
        font-size: .72rem; color: var(--amber, #ffb000);
        letter-spacing: .06em; min-width: 3.2rem;
    }
    .tg-info { display: flex; flex-direction: column; gap: .1rem; }
    .tg-name { font-size: .78rem; letter-spacing: .08em; }
    .tg-desc { font-size: .62rem; color: var(--dimmer); }

    /* ── Nav ─────────────────────────────────────────────────────────── */
    .nav {
        display: flex; gap: 1.4rem; flex-wrap: wrap;
        animation: fadein .6s ease .45s both;
    }
    .nav a {
        font-size: .75rem; color: var(--dimmer);
        text-decoration: none; letter-spacing: .1em;
        transition: color .15s;
    }
    .nav a:hover { color: var(--green); }

    /* ── Footer ──────────────────────────────────────────────────────── */
    footer {
        position: relative; z-index: 10;
        max-width: 700px; margin: 0 auto;
        padding: 0 2rem 2.5rem;
        border-top: 1px solid var(--dimmer);
        padding-top: 1rem;
        font-size: .62rem; color: var(--dimmer);
        letter-spacing: .1em;
        animation: fadein .6s ease .5s both;
    }
    .dim { color: var(--dimmer); font-style: italic; }

    @keyframes fadein { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

    /* ── Mobile ──────────────────────────────────────────────────────── */
    @media (hover: none) and (pointer: coarse) {
        #crt-noise     { animation: none !important; opacity: 0.018; }
        #crt-scanlines { animation: none !important; }
        #crt-scanlines::before { display: none; }
    }
    @media (max-width: 767px) {
        main   { padding: 2.5rem 1.4rem 3.5rem; }
        footer { padding: 1rem 1.4rem 2rem; }
        .nav a { display: inline-flex; align-items: center; padding: .65rem 0; min-height: 44px; }
        .nav   { gap: .15rem 1.2rem; }
        .dl-btn { padding: .8rem 1rem; }
        .spec-key { min-width: 70px; }
    }
    @media (max-width: 480px) {
        main   { padding: 2.5rem 1.2rem 3rem; }
        footer { padding: 1rem 1.2rem 2rem; }
    }


/* ── Utilidades extraídas de atributos style= (Sprint 5 / CSP) ── */



/* ── Utilidades extraídas de atributos style= (CSP sprint5) ── */
._u1 { font-size:.7em;word-break:break-all;color:var(--dim) }