
/* =========================================================
   PAGE 17 · MISSION 02 GATEWAY · CLEAN REBUILD
   Fully isolated. No semantic layout elements, no legacy inheritance.
========================================================= */

#page17Mission02Gateway{
    position:absolute!important;
    top:0!important;
    left:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    color:#f7f4ff!important;
    background:
        linear-gradient(115deg,
            rgba(7,10,30,.94) 0%,
            rgba(30,20,72,.76) 48%,
            rgba(5,14,36,.90) 100%),
        url("../assets/images/cover-bg.jpg") center/cover no-repeat!important;
}

#page17Mission02Gateway::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
        radial-gradient(circle at 50% 44%,
            transparent 18%,
            rgba(17,6,45,.12) 55%,
            rgba(2,5,18,.38) 100%);
}

#page17Mission02Gateway .p17r-stage{
    position:absolute!important;
    inset:0!important;
    z-index:50!important;
    width:100%!important;
    height:100%!important;
    box-sizing:border-box!important;
    padding:22px 48px 24px!important;
    display:grid!important;
    grid-template-rows:92px 1fr 104px 116px!important;
    gap:10px!important;
    opacity:1!important;
    visibility:visible!important;
    color:#fff!important;
}

#page17Mission02Gateway .p17r-glow{
    position:absolute;
    z-index:-1;
    border-radius:50%;
    pointer-events:none;
    filter:blur(8px);
}
#page17Mission02Gateway .p17r-glow-a{
    width:700px;height:700px;
    left:430px;top:30px;
    background:radial-gradient(circle,
        rgba(169,103,255,.22),
        rgba(92,52,205,.08) 42%,
        transparent 70%);
}
#page17Mission02Gateway .p17r-glow-b{
    width:520px;height:520px;
    right:-150px;bottom:-180px;
    background:radial-gradient(circle,
        rgba(48,208,255,.10),
        transparent 70%);
}

#page17Mission02Gateway .p17r-top{
    display:grid!important;
    grid-template-columns:1fr 1fr 280px!important;
    align-items:center!important;
    border-bottom:1px solid rgba(184,126,255,.42)!important;
}
#page17Mission02Gateway .p17r-top-left{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
}
#page17Mission02Gateway .p17r-top-left span{
    color:#c596ff!important;
    font-size:18px!important;
    font-weight:900!important;
    letter-spacing:2px!important;
}
#page17Mission02Gateway .p17r-top-left strong{
    margin-top:3px!important;
    color:#fff!important;
    font-size:31px!important;
    line-height:1!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-top-left small{
    margin-top:5px!important;
    color:#c1a0f4!important;
    font-size:17px!important;
    font-weight:750!important;
}

#page17Mission02Gateway .p17r-brand{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
}
#page17Mission02Gateway .p17r-brand strong{
    color:#fff!important;
    font-size:38px!important;
    line-height:1!important;
    font-weight:900!important;
    text-shadow:0 0 18px rgba(88,218,255,.46)!important;
}
#page17Mission02Gateway .p17r-brand span{
    margin-top:5px!important;
    color:#5fe9ff!important;
    font-size:15px!important;
    font-weight:850!important;
    letter-spacing:1.5px!important;
}

#page17Mission02Gateway .p17r-status{
    justify-self:end!important;
    min-width:250px!important;
    box-sizing:border-box!important;
    padding:9px 15px!important;
    text-align:center!important;
    border:1px solid rgba(185,126,255,.58)!important;
    border-radius:14px!important;
    background:rgba(16,15,49,.60)!important;
    box-shadow:0 0 18px rgba(147,82,255,.12)!important;
}
#page17Mission02Gateway .p17r-status span{
    display:block!important;
    color:#be8fff!important;
    font-size:13px!important;
    font-weight:900!important;
    letter-spacing:1.2px!important;
}
#page17Mission02Gateway .p17r-status strong{
    display:block!important;
    margin:3px 0!important;
    color:#fff!important;
    font-size:26px!important;
    line-height:1!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-status small{
    color:#d3b9ff!important;
    font-size:12px!important;
    font-weight:850!important;
}

#page17Mission02Gateway .p17r-center{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:260px 1fr 260px!important;
    align-items:center!important;
    gap:20px!important;
}

#page17Mission02Gateway .p17r-side{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
}
#page17Mission02Gateway .p17r-side img{
    display:block!important;
    width:165px!important;
    height:190px!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
    filter:drop-shadow(0 0 12px rgba(61,223,255,.44))!important;
}
#page17Mission02Gateway .p17r-side-right img{
    opacity:.32!important;
    filter:saturate(.45) drop-shadow(0 0 8px rgba(61,223,255,.18))!important;
}
#page17Mission02Gateway .p17r-side span{
    margin-top:5px!important;
    color:#59e7f3!important;
    font-size:14px!important;
    font-weight:900!important;
    letter-spacing:1.4px!important;
}
#page17Mission02Gateway .p17r-side strong{
    margin-top:3px!important;
    color:#fff!important;
    font-size:27px!important;
    line-height:1!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-side small{
    margin-top:4px!important;
    color:#65eaf0!important;
    font-size:18px!important;
    font-weight:800!important;
}
#page17Mission02Gateway .p17r-side em{
    margin-top:9px!important;
    padding:5px 11px!important;
    border:1px solid rgba(91,226,241,.42)!important;
    border-radius:999px!important;
    color:#7d8fa2!important;
    font-size:12px!important;
    font-style:normal!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-side-left em{
    color:#75f3ff!important;
    border-color:#4be0ef!important;
    background:rgba(28,135,156,.12)!important;
}

#page17Mission02Gateway .p17r-core{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:0!important;
}
#page17Mission02Gateway .p17r-unlocked{
    color:#d1b2ff!important;
    font-size:15px!important;
    font-weight:950!important;
    letter-spacing:2px!important;
    text-shadow:0 0 11px rgba(173,103,255,.55)!important;
}
#page17Mission02Gateway .p17r-purple-aura{
    position:absolute!important;
    width:330px!important;
    height:330px!important;
    border-radius:50%!important;
    background:radial-gradient(circle,
        rgba(170,104,255,.25),
        rgba(91,54,204,.08) 45%,
        transparent 72%)!important;
    filter:blur(8px)!important;
}
#page17Mission02Gateway .p17r-main-beacon{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:245px!important;
    height:280px!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
    filter:
        drop-shadow(0 0 12px rgba(196,154,255,.92))
        drop-shadow(0 0 34px rgba(153,86,255,.52))!important;
}
#page17Mission02Gateway .p17r-mission-no{
    color:#bc88ff!important;
    font-size:16px!important;
    font-weight:950!important;
    letter-spacing:2px!important;
}
#page17Mission02Gateway .p17r-title{
    margin-top:3px!important;
    color:#fff!important;
    font-size:48px!important;
    line-height:1!important;
    font-weight:950!important;
    text-shadow:0 0 25px rgba(163,92,255,.34)!important;
}
#page17Mission02Gateway .p17r-title-cn{
    margin-top:6px!important;
    color:#cba7ff!important;
    font-size:27px!important;
    font-weight:900!important;
    text-shadow:0 0 12px rgba(166,105,255,.48)!important;
}
#page17Mission02Gateway .p17r-path{
    margin-top:12px!important;
    color:#fff!important;
    font-size:17px!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-path-cn{
    margin-top:4px!important;
    color:#bd91ff!important;
    font-size:17px!important;
    font-weight:850!important;
}
#page17Mission02Gateway .p17r-path b,
#page17Mission02Gateway .p17r-path-cn b{
    color:#b67dff!important;
}

#page17Mission02Gateway .p17r-question{
    align-self:center!important;
    justify-self:center!important;
    width:850px!important;
    box-sizing:border-box!important;
    padding:12px 24px!important;
    text-align:center!important;
    border:1px solid rgba(185,128,255,.43)!important;
    border-radius:15px!important;
    background:linear-gradient(135deg,
        rgba(20,16,60,.80),
        rgba(7,25,60,.72))!important;
}
#page17Mission02Gateway .p17r-question span{
    display:block!important;
    color:#b77eff!important;
    font-size:13px!important;
    font-weight:950!important;
    letter-spacing:1.7px!important;
}
#page17Mission02Gateway .p17r-question strong{
    display:block!important;
    margin-top:4px!important;
    color:#fff!important;
    font-size:24px!important;
    font-weight:900!important;
}
#page17Mission02Gateway .p17r-question strong b{
    color:#c69cff!important;
}
#page17Mission02Gateway .p17r-question small{
    display:block!important;
    margin-top:4px!important;
    color:#c7a6f5!important;
    font-size:17px!important;
    font-weight:800!important;
}

#page17Mission02Gateway .p17r-bottom{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    border-top:1px solid rgba(184,126,255,.34)!important;
}
#page17Mission02Gateway .p17r-nova{
    display:flex!important;
    align-items:center!important;
    gap:15px!important;
}
#page17Mission02Gateway .p17r-nova img{
    display:block!important;
    width:94px!important;
    height:94px!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
    filter:drop-shadow(0 0 10px rgba(91,225,255,.52))!important;
}
#page17Mission02Gateway .p17r-nova span{
    color:#ab76ff!important;
    font-size:14px!important;
    font-weight:950!important;
    letter-spacing:1.5px!important;
}
#page17Mission02Gateway .p17r-nova p{
    margin:4px 0 2px!important;
    color:#fff!important;
    font-size:18px!important;
    line-height:1.24!important;
    font-weight:750!important;
}
#page17Mission02Gateway .p17r-nova p strong{
    color:#caa8ff!important;
}
#page17Mission02Gateway .p17r-nova small{
    color:#c5d8e8!important;
    font-size:15px!important;
    font-weight:650!important;
}

#page17Mission02Gateway .p17r-enter{
    appearance:none!important;
    border:1px solid #b67cff!important;
    border-radius:13px!important;
    padding:13px 23px!important;
    color:#fff!important;
    background:linear-gradient(120deg,
        rgba(136,71,230,.96),
        rgba(73,83,216,.96))!important;
    box-shadow:0 0 18px rgba(177,102,255,.31)!important;
    font-family:inherit!important;
    font-size:19px!important;
    font-weight:950!important;
    cursor:pointer!important;
}
#page17Mission02Gateway .p17r-enter b{
    margin-left:11px!important;
    color:#e5d0ff!important;
    font-size:22px!important;
}

/* =========================================================
   PAGE 17 · FULL CANVAS BACKGROUND
   Visual-only. Do NOT change Reveal positioning.
========================================================= */

#page17Mission02Gateway{
    background:
        linear-gradient(
            115deg,
            rgba(7,10,30,.94) 0%,
            rgba(30,20,72,.76) 48%,
            rgba(5,14,36,.90) 100%
        ),
        url("../assets/images/cover-bg.jpg")
        center center / cover no-repeat !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* extend visual background to the complete 1600×900 slide */
#page17Mission02Gateway::before{
    content:"";

    position:absolute;

    inset:0;

    z-index:-2;

    pointer-events:none;

    background:
        linear-gradient(
            115deg,
            rgba(7,10,30,.94) 0%,
            rgba(30,20,72,.76) 48%,
            rgba(5,14,36,.90) 100%
        ),
        url("../assets/images/cover-bg.jpg");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}


/* =========================================================
   PAGE 17 · MISSION 02 VISUAL REFINEMENT
   Full-bleed Page-1 city background + Page-2-style beacon motion.
   Does not override Reveal visibility/opacity.
========================================================= */
#page17Mission02Gateway::before{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:100vw!important;
    height:100vh!important;
    min-width:100%!important;
    min-height:100%!important;
    transform:translate(-50%,-50%)!important;
    z-index:0!important;
    pointer-events:none!important;
    background:
        linear-gradient(115deg,rgba(4,15,32,.90) 0%,rgba(24,20,68,.72) 48%,rgba(4,15,32,.70) 100%),
        url("../assets/images/cover-bg.jpg") center center / cover no-repeat!important;
    filter:saturate(.98) brightness(.92);
}
#page17Mission02Gateway::after{z-index:1!important;}
#page17Mission02Gateway .p17r-stage{z-index:10!important;}

/* Match Page 2 beacon's gentle 3D hover rhythm. */
#page17Mission02Gateway .p17r-side img,
#page17Mission02Gateway .p17r-main-beacon{
    transform-origin:center bottom!important;
    animation:p17BeaconAssetFloat 5.6s ease-in-out infinite!important;
    will-change:transform,filter;
}
#page17Mission02Gateway .p17r-main-beacon{animation-delay:-1.6s!important;}
#page17Mission02Gateway .p17r-side-right img{animation-delay:-3.1s!important;}
#page17Mission02Gateway .p17r-purple-aura{
    animation:p17BeaconAura 5s ease-in-out infinite!important;
}
@keyframes p17BeaconAssetFloat{
    0%,100%{transform:translateY(1px) scale(.99)}
    50%{transform:translateY(-7px) scale(1.015)}
}
@keyframes p17BeaconAura{
    0%,100%{opacity:.62;transform:scale(.96)}
    50%{opacity:1;transform:scale(1.06)}
}

/* =========================================================
   PAGE 17 · USE VIEWPORT-WIDE M02 BACKGROUND
   The city image/ambient FX now live outside the scaled slide.
========================================================= */
#page17Mission02Gateway{
    background:transparent!important;
}
#page17Mission02Gateway::before{
    display:none!important;
}
#page17Mission02Gateway::after{
    background:linear-gradient(115deg,rgba(10,8,34,.16),rgba(80,38,150,.08),rgba(4,15,32,.12))!important;
    z-index:1!important;
}
#page17Mission02Gateway .p17r-stage{
    position:absolute!important;
    inset:0!important;
    z-index:10!important;
}

/* PAGE 17 · MISSION 02 gateway: restore breathing room without changing its flow. */
#page17Mission02Gateway .p17r-stage{padding:28px 50px 32px!important;grid-template-rows:116px minmax(0,1fr) 126px 136px!important;gap:12px!important}
#page17Mission02Gateway .p17r-top{padding:4px 0 20px!important}
#page17Mission02Gateway .p17r-status{width:200px!important;min-width:200px!important;padding:6px 10px!important}
#page17Mission02Gateway .p17r-center{grid-template-columns:270px minmax(0,1fr) 270px!important;gap:24px!important;transform:translateY(22px)}
#page17Mission02Gateway .p17r-side-left{opacity:.72!important}
#page17Mission02Gateway .p17r-side-right{opacity:.52!important}
#page17Mission02Gateway .p17r-side-right img{opacity:.76!important}
#page17Mission02Gateway .p17r-main-beacon{width:238px!important;height:260px!important}
#page17Mission02Gateway .p17r-title{font-size:50px!important}
#page17Mission02Gateway .p17r-title-cn{margin-top:8px!important;font-size:25px!important}
#page17Mission02Gateway .p17r-path{margin-top:14px!important;font-size:16px!important;line-height:1.35!important}
#page17Mission02Gateway .p17r-path-cn{margin-top:6px!important;font-size:16px!important;line-height:1.35!important}
#page17Mission02Gateway .p17r-question{width:970px!important;min-height:116px!important;padding:16px 34px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;transform:translateY(-4px)}
#page17Mission02Gateway .p17r-question span{font-size:14px!important}
#page17Mission02Gateway .p17r-question strong{margin-top:6px!important;font-size:27px!important;line-height:1.2!important}
#page17Mission02Gateway .p17r-question small{margin-top:7px!important;font-size:18px!important;line-height:1.4!important}
#page17Mission02Gateway .p17r-bottom{min-height:136px!important;padding:8px 0 3px!important;box-sizing:border-box!important}
#page17Mission02Gateway .p17r-nova{gap:18px!important}
#page17Mission02Gateway .p17r-nova img{width:82px!important;height:82px!important}
#page17Mission02Gateway .p17r-nova>div{max-width:760px!important}
#page17Mission02Gateway .p17r-nova p{font-size:19px!important;line-height:1.34!important;margin:5px 0 4px!important}
#page17Mission02Gateway .p17r-nova small{display:block!important;font-size:16px!important;line-height:1.46!important}
#page17Mission02Gateway .p17r-enter{margin-right:118px!important}

/* Keep the driving-question HUD compact so it clears the Mission 02 path. */
#page17Mission02Gateway .p17r-question{min-height:92px!important;padding:9px 30px!important}
#page17Mission02Gateway .p17r-question strong{margin-top:4px!important;font-size:25px!important;line-height:1.14!important}
#page17Mission02Gateway .p17r-question small{margin-top:5px!important;font-size:17px!important;line-height:1.25!important}
