:root{font-family:Arial,sans-serif;color:#24394b;background:#f5f7f9;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:#294c64;background:white;border:1px solid #cddae3;border-radius:9px;min-height:42px;padding:10px 14px}button:hover{border-color:#387598;background:#eef6fa}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #e09c2b;outline-offset:3px}header{height:72px;background:white;border-bottom:1px solid #e0e7ec;padding:14px 26px;display:flex;align-items:center;justify-content:space-between;gap:14px}.brand{text-decoration:none;font-size:14px;font-weight:800;letter-spacing:.09em;color:#294c64}.brand span{display:block;font-size:11px;letter-spacing:.015em;font-weight:400;color:#698093;margin-top:6px}main{display:grid;grid-template-columns:minmax(0,1fr) 350px;min-height:calc(100dvh - 72px)}.viewport{position:relative;min-height:620px;overflow:hidden;background:radial-gradient(ellipse at 30% 30%,#fcfdff,#e6edf4)}#canvas{position:absolute;inset:0}canvas{display:block;width:100%;height:100%;touch-action:none}.scene-label{position:absolute;top:28px;left:32px;right:28px;pointer-events:none;max-width:620px}.eyebrow{font-size:10px;letter-spacing:.16em;color:#6b889d;font-weight:700}h1{font-size:clamp(20px,2.2vw,31px);font-weight:500;line-height:1.25;margin:10px 0;color:#233c4d}h2{font-size:22px;line-height:1.3;margin:10px 0 14px}p{font-size:14px;line-height:1.6;margin:0 0 14px;color:#526878}aside{padding:26px 24px;background:white;border-left:1px solid #dce5ec}.controls{padding:18px 0;border-top:1px solid #e8eef2;border-bottom:1px solid #e8eef2;display:flex;flex-wrap:wrap;gap:10px}.primary{background:#185779;color:white;border-color:#185779;flex:1}.primary:hover{background:#22698e;color:white}.range-label{display:flex;justify-content:space-between;gap:12px;flex-basis:100%;font-size:13px;margin-top:10px}input[type=range]{width:100%;accent-color:#27769f;height:28px}.toggle{font-size:12px;display:flex;align-items:center;gap:8px}.toggle input{accent-color:#27769f}#special{width:100%;display:flex;gap:8px}#special:empty{display:none}#special button{font-size:12px;flex:1}ol{list-style:none;counter-reset:step;padding:0;margin:22px 0}li{counter-increment:step;position:relative;padding:10px 0 10px 37px;color:#7c8e9c;font-size:13px;line-height:1.5;transition:color .2s}li:before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:10px;font-size:11px;font-weight:bold;color:#9babb8}li.active{color:#204b64}li.active:before{color:#0f759f}.scope-note{border-left:2px solid #c6dbe8;padding-left:12px}.scope-note strong{font-size:11px;text-transform:uppercase;letter-spacing:.08em}.scope-note p{font-size:12px;margin:8px 0}.contact{font-size:11px;margin-top:22px}.contact a{color:#185779}.telemetry{position:absolute;bottom:70px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;pointer-events:none}.telemetry span{padding:10px 14px;background:#ffffffde;border:1px solid #d8e4ee;box-shadow:0 8px 20px #294b6220;border-radius:9px;font-size:13px}.telemetry #signal{font-family:monospace;color:#116689}.hint{position:absolute;bottom:26px;left:32px;color:#718696;font-size:11px}.watermark{position:absolute;right:26px;bottom:25px;font-size:10px;letter-spacing:.12em;color:#758d9f}#fallback{position:absolute;top:45%;left:10%;right:10%;padding:20px;background:white;border-radius:12px;line-height:1.6}@media(max-width:850px){main{grid-template-columns:minmax(0,1fr)}.viewport{height:58dvh;min-height:380px;max-height:650px}aside{border-left:0;border-top:1px solid #dce5ec;padding:24px;display:grid;grid-template-columns:1fr 1fr;gap:18px}.controls{align-content:start}.scope-note,.contact{grid-column:1/-1}ol{margin:0}.chapter p{font-size:13px}.contact{margin:0}}@media(max-width:500px){header{height:66px;padding:12px 16px}.brand{font-size:10px;letter-spacing:.05em}.brand span{font-size:9px;max-width:180px}header button{font-size:10px;padding:8px;min-height:38px}.scene-label{top:22px;left:20px;right:20px}h1{font-size:21px;max-width:280px}.viewport{min-height:380px;height:55dvh}.telemetry{left:16px;right:16px;bottom:57px;gap:7px}.telemetry span{font-size:11px;padding:8px 10px}.hint{left:16px;bottom:21px;max-width:195px;font-size:9px;line-height:1.4}.watermark{right:16px;font-size:8px;bottom:23px}aside{display:block;padding:24px 20px}.controls{margin-bottom:20px}.contact{margin-top:20px}h2{font-size:21px}}