:root{font-family:system-ui,Arial,sans-serif;color:#e9f5f8;background:#080f1c}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 80% 0,#12303b,#080f1c 55%);min-height:100vh}a{color:#63e9db}button,input,textarea,select{font:inherit}button{cursor:pointer}.wrap{max-width:1120px;margin:auto;padding:22px}.back{display:inline-block;margin:4px 0 20px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:20px;border:1px solid #2c6975;border-radius:22px;background:linear-gradient(125deg,#0a1a29,#102b35);padding:26px;align-items:center}.tag{color:#67e2d8;font-weight:750;font-size:.9rem}h1{font-size:clamp(2rem,4vw,3.2rem);color:#ffd777;margin:12px 0}h2{color:#77e6df;margin:0 0 14px}h3{color:#ffdc89}p{line-height:1.65}.lead{font-size:1.22rem;color:#8ff0eb}.art{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}.art img{width:100%;height:270px;object-fit:contain;object-position:center;background:#091c2b;border-radius:15px}.art .cat{object-position:50% 40%}.art .board{object-position:70% 50%}.code-bubble{grid-column:1/-1;border:1px solid #e4b952;background:#091c2b;padding:10px 14px;border-radius:12px;color:#ffd777;text-align:center}.code-bubble small{display:block;color:#c6e8ec}.resources{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0}.resource{min-height:94px;padding:17px;background:#102938;border:1px solid #327886;border-radius:14px;text-decoration:none;color:#f2fafa;font-weight:750;display:flex;align-items:center;gap:10px}.resource span{font-size:1.6rem}.resource:hover,.tile:hover{border-color:#f5c45d;transform:translateY(-2px)}section{margin:18px 0;border:1px solid #285463;background:#0d1f2e;border-radius:18px;padding:25px}.note{padding:15px;background:#26281e;border-left:4px solid #f3c761;border-radius:9px}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.tile{background:#102d3d;border:1px solid #397e8a;border-radius:14px;padding:20px;transition:.2s}.tile p{min-height:104px}.cta,.btn{display:inline-block;border:0;border-radius:10px;background:#ffd26d;color:#0d2332;font-weight:800;padding:12px 17px;text-decoration:none}.btn.alt{background:#164555;color:#edffff;border:1px solid #4b99a0}.feedback{min-height:28px;color:#ffdb82;font-weight:650}.field{width:100%;border:1px solid #498696;background:#071522;border-radius:10px;padding:13px;color:white}.steps{display:grid;gap:12px}.step{padding:16px;background:#0a2a38;border-radius:12px;border-left:3px solid #63e9db}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid #428a94;border-radius:10px;background:#123c4a;color:#e9ffff;padding:10px 13px}.chip.active{background:#eec35d;color:#142333}.stats{display:flex;flex-wrap:wrap;gap:12px}.stat{background:#102f3d;border:1px solid #326879;padding:13px;border-radius:10px;min-width:125px}.stat strong{display:block;font-size:1.3rem;color:#ffd575}.hide{display:none!important}details{background:#12313e;border-radius:10px;padding:14px;margin-top:10px}summary{cursor:pointer;font-weight:700}.hint{color:#aad0d8}.answer{background:#071825;padding:15px;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere}footer{color:#a6c6cb;text-align:center;padding:28px}label{display:block;margin:12px 0 7px}ul li{margin-bottom:8px}@media(max-width:780px){.hero{grid-template-columns:1fr}.resources{grid-template-columns:1fr 1fr}.tiles{grid-template-columns:1fr}.tile p{min-height:0}}@media(max-width:480px){.resources{grid-template-columns:1fr}.art img{height:210px}section{padding:17px}.wrap{padding:13px}}