+:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#080d19;color:#f5f7ff}
*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Arial,Helvetica,sans-serif;color:#f5f7ff;background:radial-gradient(circle at 50% -15%,#142e69 0,#080d19 42%)}
a{color:inherit}a:focus-visible{outline:3px solid #f5dc45;outline-offset:4px}
.wrap{width:min(100% - 32px,1080px);margin:auto}.site-header{padding:24px 0 14px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:inline-flex;align-items:center;text-decoration:none}.brand img{width:124px;height:auto;display:block}
.back{font-size:14px;text-decoration:none;color:#d8e4ff;border:1px solid #4b5f88;border-radius:999px;padding:10px 14px}.back:hover{background:#172544}
.hero{padding:36px 0 22px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.18em;color:#f7df4e;text-transform:uppercase}
h1{font-size:clamp(30px,6vw,54px);line-height:1.08;margin:12px 0 12px;letter-spacing:-.035em}p{line-height:1.55;color:#cbd6eb}
.hero p{margin:0;max-width:620px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(235px,1fr));gap:17px;padding:17px 0 60px}
.card{display:block;text-decoration:none;background:#111b30;border:1px solid #2c4065;border-radius:18px;overflow:hidden;transition:transform .15s,border-color .15s}
.card:hover{transform:translateY(-3px);border-color:#f7df4e}.card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;background:#000}
.card span{display:block;padding:17px 18px;font-size:17px;font-weight:800;letter-spacing:.02em}.exercise{padding:26px 0 60px}
.exercise h1{margin-bottom:22px}.viewer{border:1px solid #34486e;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 18px 45px #0006}
.viewer img{display:block;width:100%;height:auto;aspect-ratio:16/9}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:20px}
.button{display:inline-block;padding:13px 18px;border-radius:10px;background:#f7df4e;color:#101521;text-decoration:none;font-weight:800}
.button:hover{background:#ffe870}.hint{font-size:14px;margin:0}.footer{border-top:1px solid #2a3855;padding:20px 0 30px;font-size:13px;color:#a9b8d6}
@media(max-width:600px){.site-header{padding-top:16px}.brand img{width:102px}.hero{padding-top:26px}.exercise{padding-top:18px}.exercise h1{font-size:32px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.card span{font-size:13px;padding:12px}.card{border-radius:12px}.viewer{border-radius:11px}}