*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#e8eee9;color:#193d35;font-family:Arial,Helvetica,sans-serif}#scene{position:fixed;inset:0}canvas{display:block;touch-action:none}header{position:absolute;top:30px;left:38px;right:38px;display:flex;justify-content:space-between;align-items:center}.brand{font-weight:900;font-size:28px;color:inherit;text-decoration:none;letter-spacing:-2px}.brand>span:first-child{color:#e97a39}.brand .divider{font-weight:400;color:#a5b4aa;margin:0 20px;letter-spacing:0}.brand small{font-size:10px;letter-spacing:2px;vertical-align:middle}.badge{font-size:10px;letter-spacing:1.5px;background:#ffffffb0;border:1px solid white;border-radius:20px;padding:11px 15px}.badge i,.status i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3a9471;margin-right:8px}main{position:absolute;left:38px;top:118px;pointer-events:none}.eyebrow{font-size:10px;font-weight:bold;letter-spacing:2px}h1{font-size:clamp(28px,3vw,44px);font-weight:500;letter-spacing:-1.8px;line-height:1.12;margin:18px 0}.intro{font-size:13px;line-height:1.7;color:#647970}aside{position:absolute;right:38px;top:130px;width:235px;background:#ffffffe0;border:1px solid white;border-radius:16px;padding:22px;box-shadow:0 8px 30px #25443c08}aside strong{display:block;font-size:23px;font-weight:500;margin-top:15px}aside p{font-size:12px;line-height:1.6;color:#6c7e76;min-height:38px}.status{font-size:10px;border-top:1px solid #dfe7e1;padding-top:15px}.scene-label{position:absolute;bottom:177px;left:38px;font-size:10px;font-weight:bold;letter-spacing:1.5px}.scene-label span{color:#e97a39;margin:0 8px}footer{position:absolute;bottom:25px;left:38px;right:38px;border-radius:16px;background:#ffffffed;padding:17px 23px;box-shadow:0 10px 40px #193d3510}.transport{display:flex;gap:10px;align-items:center}button,select{font:inherit;border:1px solid #dbe3dd;border-radius:8px;background:white;color:#27483e;padding:10px 16px;cursor:pointer;font-size:12px}button:hover{background:#e9f0ea}button:focus-visible,select:focus-visible{outline:3px solid #e97a39}.primary{background:#214f41;color:white;min-width:105px}.primary:hover{background:#356953}label{font-size:11px;margin-left:12px;color:#6c7e76}select{margin-left:8px;padding:8px}#camera{margin-left:auto}.timeline{display:flex;gap:15px;align-items:center;margin:18px 0 12px;font-size:9px;color:#6c7e76;letter-spacing:1px}.track{height:4px;border-radius:4px;background:#e5eae5;flex:1;overflow:hidden}#progress{height:100%;background:#e57c43;width:0}.steps{display:flex;justify-content:space-between;font-size:10px;color:#7b8a80}.steps .active{color:#214f41;font-weight:bold}.hint{position:absolute;bottom:177px;right:38px;font-size:10px;color:#6b7c72}#error{position:fixed;inset:35% 10% auto;background:#fff0e4;padding:30px;border:1px solid #c55;z-index:5}@media(max-width:700px){header{top:20px;left:20px;right:20px}.brand small,.badge{display:none}main{left:20px;top:70px}h1{font-size:27px;margin:10px 0}.intro{display:none}aside{top:85px;right:16px;width:150px;padding:13px}aside strong{font-size:17px}aside p{font-size:10px}.eyebrow{font-size:8px}footer{left:12px;right:12px;bottom:12px;padding:12px}.transport{gap:5px}button{padding:9px}label{margin:0;font-size:0}select{margin:0}.timeline{gap:8px}.timeline>span:last-child{display:none}.steps{font-size:8px}.hint{bottom:158px;right:15px;font-size:8px}.scene-label{display:none}#camera{font-size:10px}}
