:root{font-family:'DM Sans',Arial,sans-serif;color:#164b60;font-synthesis:none}*{box-sizing:border-box}body{margin:0;height:100dvh;overflow:hidden;background:#80d4e5}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0}button:focus-visible,a:focus-visible{outline:3px solid #195c71;outline-offset:5px}canvas{position:fixed;inset:0;width:100%;height:100%;z-index:-1}header{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:30px 4vw;z-index:3}.brand{font-size:23px;font-weight:800;letter-spacing:.22em;text-decoration:none;color:#174b5e}.brand span{display:block;font-size:9px;letter-spacing:.2em;margin-top:7px;font-weight:500}.top-right{display:flex;align-items:center;gap:28px;font-size:10px;letter-spacing:.16em}.top-right button,#pause{color:#235b70;background:#ffffff64;border:1px solid #ffffffa6;padding:12px 18px;border-radius:30px;font-size:12px;letter-spacing:0}.glass{position:absolute;top:50%;left:6vw;transform:translateY(-48%);width:min(460px,88vw);padding:35px 38px;background:linear-gradient(140deg,#f8ffffe8,#e7faffb3);border:1px solid #ffffffc9;border-radius:30px;box-shadow:0 20px 100px #20667b18;backdrop-filter:blur(12px)}.eyebrow{font-size:10px;letter-spacing:.22em;font-weight:700;color:#3c7b8d}h1{font-family:Manrope,Arial,sans-serif;font-size:clamp(40px,4.7vw,68px);font-weight:600;line-height:1.08;letter-spacing:-.055em;margin:20px 0}.lead{font-size:15px;line-height:1.7;color:#376e80}.zh{font-size:12px;line-height:1.9;letter-spacing:.03em;color:#528396;margin:16px 0 24px}.primary{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#174e62;color:white;border-radius:15px;padding:18px 22px;width:100%;font-size:16px}.primary:hover{background:#246d82;transform:translateY(-1px)}.primary span{font-size:11px;color:#c4eaf0}.text-button{background:none;color:#437b8c;font-size:12px;padding:16px 4px}.privacy{font-size:10px;color:#7498a2;line-height:1.6;margin:0}footer{position:absolute;bottom:25px;left:4vw;right:4vw;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.16em;pointer-events:none;color:#2c7286}.hidden{display:none!important}#hud{position:absolute;inset:auto 25% 45px;display:flex;align-items:center;gap:25px;background:#efffffda;border:1px solid white;padding:14px 22px;border-radius:20px;box-shadow:0 10px 30px #477f8c12;backdrop-filter:blur(12px)}.progress{min-width:55px;font-size:13px;font-weight:700}#dots{display:flex;gap:5px;margin-top:7px}#dots i{width:12px;height:4px;border-radius:5px;background:#b3d6df}#dots i.done{background:#48b9b4}#hint{font-size:12px;line-height:1.6;flex:1;margin:0}#pause{border-color:#bedee3;white-space:nowrap}#camera{position:absolute;right:4vw;bottom:80px;width:170px;border:3px solid #fff9;border-radius:20px;overflow:hidden;background:#deeff3;box-shadow:0 10px 40px #28697a20}video{width:100%;height:110px;display:block;object-fit:cover;transform:scaleX(-1)}#camera-label{font-size:9px;padding:8px;text-align:center;background:#efffffbd}#status{position:absolute;top:115px;left:50%;transform:translateX(-50%);width:max-content;max-width:85vw;padding:12px 22px;text-align:center;font-size:13px;line-height:1.8;background:#f3ffffe8;border:1px solid white;border-radius:18px;color:#245b70;z-index:5}@media(max-width:800px){header{padding:22px 6vw}.chapter{display:none}.brand{font-size:18px}footer span:last-child{display:none}.glass{padding:28px;left:6vw}#hud{left:5vw;right:5vw;bottom:50px;gap:14px}#camera{width:115px;bottom:150px}video{height:75px}#camera-label{font-size:8px}#hint{font-size:11px}#status{top:95px}.top-right button span{display:none}}@media(max-height:650px){.glass{padding:22px 30px}h1{font-size:38px;margin:12px 0}.lead{font-size:13px}.zh{margin:8px 0 15px}.privacy{display:none}header{padding:18px 4vw}.primary{padding:14px 18px}footer{bottom:15px}#hud{bottom:32px}}