.scene{perspective:1200px;width:100%;max-width:520px}.card{position:relative;width:100%;aspect-ratio:2/3;transform-style:preserve-3d;transition:transform .6s ease,box-shadow .3s ease;cursor:pointer;box-shadow:0 25px 60px #00000073}.card:hover{box-shadow:0 30px 70px #0009}.card.is-flipped{transform:rotateY(180deg)}.face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:20px;overflow:hidden;backface-visibility:hidden;background:#0e1628}.face.back{transform:rotateY(180deg);padding:24px;display:flex;flex-direction:column;gap:14px;justify-content:center}.face.back h2{margin:0;font-size:28px}.face.back p{margin:0;white-space:pre-wrap;line-height:1.6;color:#dbe4ff;max-height:calc(100% - 48px);overflow:auto;padding-right:6px}.face.front img{width:100%;height:100%;object-fit:cover;display:block}.hint{position:absolute;bottom:12px;right:12px;background:#0000008c;padding:6px 10px;border-radius:999px;font-size:12px;letter-spacing:.02em}.next-btn{position:absolute;bottom:12px;left:12px;background:#3b82f6;border:none;color:#fff;padding:8px 14px;border-radius:10px;font-weight:600;cursor:pointer;box-shadow:0 8px 20px #00000040;transition:transform .15s ease,box-shadow .15s ease}.next-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px #0000004d}.next-btn:active{transform:translateY(1px);box-shadow:0 6px 16px #00000040}.page .scene{margin:0 auto}.start{position:relative;z-index:1;background:#0c1424d9;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:28px;border-radius:18px;max-width:520px;width:100%;box-shadow:0 25px 60px #00000073}.start h1{margin:0 0 10px;font-size:26px}.start p{margin:0 0 18px;color:#dbe4ff}.start-actions{display:flex;gap:12px;flex-wrap:wrap}.start-btn{background:#3b82f6;border:none;color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;cursor:pointer;box-shadow:0 12px 28px #0000004d;transition:transform .15s ease,box-shadow .15s ease}.start-btn.secondary{background:#111a2d;border:1px solid rgba(255,255,255,.15);box-shadow:0 12px 28px #00000040}.start-btn:hover{transform:translateY(-2px);box-shadow:0 14px 32px #00000059}.start-btn:active{transform:translateY(1px);box-shadow:0 10px 24px #0000004d}:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;font-family:IBM Plex Sans,Segoe UI,system-ui,-apple-system,sans-serif;background:radial-gradient(circle at 20% 20%,#1f2b46 0,#0b1220 50%);color:#f6f8ff}main{position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.page .start{margin:0 auto}.stars{position:absolute;top:0;left:0;width:100%;height:48%;pointer-events:none;--star-img:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3CradialGradient id='g' cx='16' cy='16' r='16'%3E%3Cstop offset='0' stop-color='%23ffffff'/%3E%3Cstop offset='0.35' stop-color='%23b7d3ff' stop-opacity='0.95'/%3E%3Cstop offset='0.7' stop-color='%236aa4ff' stop-opacity='0.2'/%3E%3Cstop offset='1' stop-color='%230b1220' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='16' cy='16' r='16' fill='url(%23g)'/%3E%3Cpath d='M16 2v28M2 16h28' stroke='%23e8f2ff' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-image:var(--star-img),var(--star-img),var(--star-img),var(--star-img),var(--star-img),var(--star-img);background-size:18px 18px,16px 16px,14px 14px,20px 20px,16px 16px,14px 14px;background-position:8% 10%,22% 16%,38% 8%,55% 18%,72% 6%,88% 14%;mask-image:linear-gradient(#fff,transparent);-webkit-mask-image:linear-gradient(#fff,transparent);filter:drop-shadow(0 0 10px rgba(255,255,255,.3));animation:twinkle 8s ease-in-out infinite alternate}.stars-2{background-image:var(--star-img),var(--star-img),var(--star-img),var(--star-img),var(--star-img);background-size:14px 14px,16px 16px,15px 15px,13px 13px,14px 14px;background-position:15% 26%,33% 20%,50% 28%,68% 24%,84% 22%;opacity:.75;animation-duration:9s;animation-delay:-1.5s}.stars-3{background-image:var(--star-img),var(--star-img),var(--star-img),var(--star-img);background-size:20px 20px,14px 14px,16px 16px,13px 13px;background-position:12% 32%,42% 30%,63% 34%,80% 29%;opacity:.6;animation-duration:11s;animation-delay:-.8s}.snow{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-repeat:repeat;background-size:220px 220px;background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,255,255,.9) 50%,transparent 60%),radial-gradient(2px 2px at 80px 120px,rgba(255,255,255,.75) 50%,transparent 60%),radial-gradient(2px 2px at 150px 80px,rgba(255,255,255,.85) 50%,transparent 60%),radial-gradient(3px 3px at 40px 200px,rgba(255,255,255,.8) 50%,transparent 60%),radial-gradient(3px 3px at 220px 160px,rgba(255,255,255,.85) 50%,transparent 60%);animation:snow 14s linear infinite;opacity:.42;filter:drop-shadow(0 0 6px rgba(255,255,255,.35))}.snow-2{background-size:320px 320px;animation-duration:20s;opacity:.5}.snow-3{background-size:380px 380px;animation-duration:26s;opacity:.6}@keyframes snow{0%{background-position:0 -260px}to{background-position:40px 260px}}@keyframes twinkle{0%{opacity:.35}45%{opacity:.95}to{opacity:.55}}