html,body,#root{height:100%;margin:0;background:#000;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,system-ui,SF Pro Display,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;color:#fff;-webkit-user-select:none;user-select:none}.app{position:relative;height:100%}canvas{display:block;touch-action:none}.title{position:absolute;top:28px;left:32px;pointer-events:none;transition:opacity .6s ease}.title h1{margin:0;font-size:26px;font-weight:600;letter-spacing:-.02em}.title p{margin:6px 0 0;font-size:13px;font-weight:400;color:#8e8e93}.lore{position:absolute;top:96px;left:32px;max-width:300px;margin:0;font-size:13px;font-weight:400;line-height:1.55;color:#8e8e93;pointer-events:none;opacity:1;transform:translateY(0);transition:opacity .7s ease,transform .7s ease}.lore.gone{opacity:0;transform:translateY(8px)}.links{position:absolute;top:28px;right:30px;display:flex;gap:8px;transition:opacity .5s ease}.links.dim{opacity:.12;pointer-events:none}.links a,.links button{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid transparent;border-radius:12px;background:#ffffff08;color:#86868b;cursor:pointer;text-decoration:none;transition:background .25s ease,color .25s ease,border-color .25s ease}.links a:hover,.links button:hover{background:#ffffff12;border-color:#ffffff24;color:#d0d0d4}.links a.tg{display:flex;align-items:center;gap:7px;width:auto;padding:0 14px 0 11px;background:#229ed9;color:#fff;font-size:13.5px;font-weight:600;letter-spacing:.01em;box-shadow:0 3px 16px #229ed966}.links a.tg:hover{background:#33abe6;border-color:transparent;color:#fff}.links a.tg svg{width:18px;height:18px}.links svg{width:20px;height:20px}.copied{position:absolute;top:calc(100% + 8px);right:2px;padding:5px 10px;border-radius:8px;background:#ffffff1a;color:#d7d7db;font-size:12px;white-space:nowrap;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .25s ease,transform .25s ease}.copied.show{opacity:1;transform:translateY(0)}.caps{position:absolute;left:26px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;transition:opacity .5s ease}.caps.dim{opacity:.12;pointer-events:none}.cap{display:flex;align-items:center;gap:10px;width:132px;padding:8px 12px;border:1px solid transparent;border-radius:12px;background:#ffffff08;color:#86868b;font:inherit;font-size:13px;cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease}.cap:hover{background:#ffffff12;color:#d0d0d4}.cap.on{background:#ffffff1a;border-color:#ffffff29;color:#fff}.cap-ico{display:grid;place-items:center;width:20px;height:20px;color:#6e6e73;transition:color .25s ease}.cap.on .cap-ico{color:#ff5f57}.cap:hover .cap-ico{color:#c25}.cap-ico svg{width:20px;height:20px}.callout-wrap{pointer-events:none}.callout{transform:translateY(-24px);padding:5px 11px;border-radius:999px;background:#f5f5f7f0;color:#1c1c1e;font-size:12px;font-weight:600;letter-spacing:.01em;white-space:nowrap;box-shadow:0 6px 22px #00000073;opacity:1;transition:opacity .5s ease,transform .5s ease}.callout:after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:inherit;transform:translate(-50%) rotate(45deg);border-radius:2px}.callout.gone{opacity:0;transform:translateY(-30px) scale(.92)}.hint{position:absolute;bottom:34px;left:50%;transform:translate(-50%);font-size:14px;font-weight:400;color:#b9b9be;letter-spacing:.01em;pointer-events:none;opacity:0;white-space:nowrap}.hint.show{animation:hintIn .5s ease-out forwards}@keyframes hintIn{0%{opacity:0;transform:translate(-50%) translateY(6px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@media (prefers-reduced-motion: reduce){.hint.show{animation:none;opacity:1}.lore,.caps,.title,.callout{transition:none}}@media (max-width: 640px){.title{top:18px;left:20px}.title h1{font-size:20px}.links{top:16px;right:16px;gap:6px}.links a,.links button{width:34px;height:34px}.tg-label{display:none}.links a.tg{width:34px;padding:0;gap:0;justify-content:center}.lore{top:76px;left:20px;max-width:60vw;font-size:12px}.caps{left:14px;gap:4px}.cap{width:44px;padding:8px;justify-content:center}.cap-label{display:none}.hint{font-size:12px;bottom:24px;max-width:88vw;white-space:normal;text-align:center}}