
:root{--red:#e31919;--white:#ffffff;--black:#050505;--panel:#0b0b0bcc;}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow:hidden}
#app{position:relative;width:100vw;height:100vh;background:#000}
#slides{width:100%;height:100%}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;pointer-events:none}
.slide.active{opacity:1;pointer-events:auto}
.image-slide img{width:100%;height:100%;object-fit:cover;display:block}
.text-slide{background:#060606 url('assets/01_cover.png') center/cover no-repeat}
.text-slide .bg-overlay{position:absolute;inset:0;background:linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.88) 45%, rgba(0,0,0,.75) 100%)}
.content-wrap{position:relative;z-index:1;max-width:1180px;padding:7vh 6vw 9vh 6vw}
.kicker{display:inline-block;color:var(--red);font-weight:800;letter-spacing:.08em;font-size:1rem;border-left:4px solid var(--red);padding-left:12px;margin-bottom:22px}
h1{margin:0 0 16px 0;font-size:clamp(2.4rem,5vw,4.6rem);line-height:1.02;color:#fff;font-weight:800;max-width:1100px}
.subtitle{font-size:clamp(1.15rem,2vw,1.85rem);line-height:1.35;color:#fff;max-width:1020px;margin:0 0 28px 0;font-weight:600}
.bullet-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 22px;max-width:1200px}
.bullet-list li{background:rgba(15,15,15,.82);border:1px solid rgba(227,25,25,.55);border-left:5px solid var(--red);border-radius:16px;padding:18px 20px;font-size:clamp(1rem,1.55vw,1.45rem);line-height:1.4;color:#fff;min-height:104px;display:flex;align-items:flex-start}
#controls{position:fixed;left:20px;bottom:20px;z-index:10;display:flex;gap:10px;flex-wrap:wrap}
#controls button{background:rgba(0,0,0,.76);color:#fff;border:1px solid rgba(255,255,255,.18);padding:12px 16px;border-radius:12px;font-size:15px;cursor:pointer}
#controls button:hover{background:rgba(227,25,25,.95)}
#hud{position:fixed;right:18px;bottom:18px;z-index:10;display:flex;flex-direction:column;align-items:flex-end;gap:8px;max-width:38vw}
#progress{width:340px;height:10px;background:rgba(255,255,255,.18);border-radius:999px;overflow:hidden}
#progressBar{display:block;height:100%;width:0;background:var(--red)}
#status{background:rgba(0,0,0,.68);padding:9px 12px;border-radius:10px;font-size:15px;color:#fff}
#hint{background:rgba(0,0,0,.68);padding:9px 12px;border-radius:10px;font-size:13px;color:#ddd;text-align:right}
.corner-label{position:absolute;top:18px;right:18px;background:rgba(0,0,0,.72);color:#fff;padding:10px 14px;border-radius:12px;font-weight:700;letter-spacing:.03em}
@media (max-width: 1100px){.bullet-list{grid-template-columns:1fr}.content-wrap{padding:6vh 6vw 12vh 6vw}#hud{max-width:70vw}.subtitle{max-width:none}}
