/* Public interaction language. A direct pointer, with small action cues rather than trailing inertia. */
.harmony-pointer{display:none;position:fixed;top:0;left:0;z-index:2147483646;pointer-events:none;opacity:0;color:#fff8ed;will-change:transform;font-family:Jost,sans-serif}
.harmony-pointer.is-visible{opacity:1}
.harmony-pointer__mark{position:absolute;left:-14px;top:-14px;display:block;width:28px;height:28px;border:1px solid #cdb384b3;border-radius:50%;transition:width .2s,height .2s,border-color .2s;box-sizing:border-box}
.harmony-pointer__mark::before,.harmony-pointer__mark::after{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-sizing:border-box}
.harmony-pointer__mark::before{width:3px;height:3px;border-radius:50%;background:#fff8ed}
.harmony-pointer__label{position:absolute;left:21px;top:-5px;font-size:9px;line-height:1.3;letter-spacing:.1em;white-space:nowrap;text-shadow:0 1px 5px #070f1c}
.harmony-pointer[data-action="idle"] .harmony-pointer__mark{border-color:transparent}
.harmony-pointer[data-action="idle"] .harmony-pointer__label{display:none}
.harmony-pointer[data-action="click"] .harmony-pointer__mark,.harmony-pointer[data-action="open"] .harmony-pointer__mark,.harmony-pointer[data-action="next"] .harmony-pointer__mark{animation:harmonyCursorTap 1.8s ease-in-out infinite}
.harmony-pointer[data-action="next"] .harmony-pointer__mark::before,.harmony-pointer[data-action="back"] .harmony-pointer__mark::before,.harmony-pointer[data-action="open"] .harmony-pointer__mark::before,.harmony-pointer[data-action="drag"] .harmony-pointer__mark::before{width:9px;height:9px;border-top:1px solid #fff8ed;border-right:1px solid #fff8ed;border-radius:0;background:none;transform:translate(-65%,-50%) rotate(45deg)}
.harmony-pointer[data-action="back"] .harmony-pointer__mark::before{transform:translate(-30%,-50%) rotate(-135deg)}
.harmony-pointer[data-action="back"] .harmony-pointer__mark{animation:harmonyCursorBack 1.8s ease-in-out infinite}
.harmony-pointer[data-action="open"] .harmony-pointer__mark::before{transform:translate(-50%,-50%)}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark{border-radius:20px;animation:harmonyCursorSlide 1.8s ease-in-out infinite}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark::before{left:72%;width:6px;height:6px}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark::after{left:28%;width:6px;height:6px;border-top:1px solid #fff8ed;border-left:1px solid #fff8ed;transform:translate(-50%,-50%) rotate(-45deg)}
.harmony-pointer[data-action="close"] .harmony-pointer__mark::before,.harmony-pointer[data-action="close"] .harmony-pointer__mark::after{width:12px;height:1px;border-radius:0;background:#fff8ed;transform:translate(-50%,-50%) rotate(45deg)}
.harmony-pointer[data-action="close"] .harmony-pointer__mark::after{transform:translate(-50%,-50%) rotate(-45deg)}
.harmony-pointer[data-action="close"] .harmony-pointer__mark{animation:harmonyCursorClose 2.4s ease-in-out infinite}
.harmony-pointer[data-action="turn"] .harmony-pointer__mark{animation:harmonyCursorTurn 2s ease-in-out infinite;border-radius:7px}
.harmony-pointer[data-action="menu"] .harmony-pointer__mark::before{width:12px;height:1px;border-radius:0;box-shadow:0 -4px #fff8ed,0 4px #fff8ed}
.harmony-pointer[data-action="write"] .harmony-pointer__mark{border-color:transparent;animation:none}
.harmony-pointer[data-action="write"] .harmony-pointer__mark::before{width:1px;height:17px;border-radius:0}
.harmony-pointer[data-action="read"] .harmony-pointer__mark{border-radius:5px;animation:harmonyCursorTap 2.4s ease-in-out infinite}
.harmony-pointer.is-pressed .harmony-pointer__mark{animation:none;transform:scale(.8)}
@keyframes harmonyCursorTap{0%,100%{transform:scale(1);border-color:#cdb38488}50%{transform:scale(.86);border-color:#cdb384ff}}
@keyframes harmonyCursorSlide{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
@keyframes harmonyCursorBack{0%,100%{transform:translateX(0)}50%{transform:translateX(-3px)}}
@keyframes harmonyCursorClose{0%,100%{transform:rotate(0)}50%{transform:rotate(12deg)}}
@keyframes harmonyCursorTurn{0%,100%{transform:perspective(100px) rotateY(-58deg)}50%{transform:perspective(100px) rotateY(58deg)}}
@media(hover:hover) and (pointer:fine){body.harmony-context-cursor,body.harmony-context-cursor *{cursor:none!important}.harmony-context-cursor .cursor,.harmony-context-cursor .cursor-ring{display:none!important}.harmony-pointer{display:block}}
@media(prefers-reduced-motion:reduce){.harmony-pointer .harmony-pointer__mark{animation:none!important;transition:none!important}}
.harmony-pointer[data-action="menu"] .harmony-pointer__mark{animation:harmonyCursorTap 2.2s ease-in-out infinite}
.harmony-pointer[data-action="write"] .harmony-pointer__mark::before{animation:harmonyCursorCaret 1.4s ease-in-out infinite}
@keyframes harmonyCursorCaret{0%,100%{opacity:1}50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.harmony-pointer *{animation:none!important}}
/* Wordless gestures: the silhouette changes, rather than explaining the action in a label. */
.harmony-pointer__label{display:none!important}
.harmony-pointer[data-action="click"] .harmony-pointer__mark{width:22px;height:22px;left:-11px;top:-11px;border-radius:50%;animation:harmonyPressGesture 1.6s ease-in-out infinite}
.harmony-pointer[data-action="click"] .harmony-pointer__mark::after{width:34px;height:34px;border:1px solid #cdb38470;border-radius:50%;animation:harmonyTapRipple 1.6s ease-out infinite}
.harmony-pointer[data-action="next"] .harmony-pointer__mark,.harmony-pointer[data-action="back"] .harmony-pointer__mark{border-color:transparent;border-radius:0;animation:harmonyArrowGesture 1.6s ease-in-out infinite}
.harmony-pointer[data-action="back"] .harmony-pointer__mark{animation-name:harmonyBackGesture}
.harmony-pointer[data-action="next"] .harmony-pointer__mark::after,.harmony-pointer[data-action="back"] .harmony-pointer__mark::after{width:18px;height:1px;background:#cdb384}
.harmony-pointer[data-action="next"] .harmony-pointer__mark::before{left:76%;width:8px;height:8px}
.harmony-pointer[data-action="back"] .harmony-pointer__mark::before{left:24%;width:8px;height:8px}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark{width:36px;left:-18px;border:0;border-radius:0;animation:harmonyCursorSlide 1.5s ease-in-out infinite}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark::before{left:90%;width:8px;height:8px;border-color:#cdb384}
.harmony-pointer[data-action="drag"] .harmony-pointer__mark::after{left:10%;width:8px;height:8px;border-color:#cdb384}
.harmony-pointer[data-action="open"] .harmony-pointer__mark{width:21px;height:21px;left:-12px;top:-12px;border:1px solid #cdb384;border-radius:50%;animation:harmonyMagnifyGesture 1.8s ease-in-out infinite}
.harmony-pointer[data-action="open"] .harmony-pointer__mark::before{width:2px;height:2px;background:#fff8ed;border:0;border-radius:50%}
.harmony-pointer[data-action="open"] .harmony-pointer__mark::after{width:9px;height:1px;background:#cdb384;left:100%;top:100%;transform:translate(-20%,-20%) rotate(45deg);transform-origin:0 0}
.harmony-pointer[data-action="close"] .harmony-pointer__mark{border:0;border-radius:0;animation:harmonyCursorClose 2s ease-in-out infinite}
.harmony-pointer[data-action="close"] .harmony-pointer__mark::before,.harmony-pointer[data-action="close"] .harmony-pointer__mark::after{width:19px;background:#cdb384}
.harmony-pointer[data-action="turn"] .harmony-pointer__mark{border-radius:1px;width:21px;height:28px;left:-10px;animation:harmonyCursorTurn 1.8s ease-in-out infinite}
.harmony-pointer[data-action="turn"] .harmony-pointer__mark::before{height:20px;width:1px;background:#cdb384;left:4px}
.harmony-pointer[data-action="read"] .harmony-pointer__mark{border-radius:2px;width:22px;height:27px;left:-11px;animation:harmonyReadGesture 2s ease-in-out infinite}
.harmony-pointer[data-action="read"] .harmony-pointer__mark::before{width:12px;height:1px;border-radius:0;box-shadow:0 -4px #fff8ed,0 4px #fff8ed}
@keyframes harmonyPressGesture{0%,100%{transform:scale(1)}35%{transform:scale(.68)}60%{transform:scale(1)}}
@keyframes harmonyTapRipple{0%,35%{opacity:0;transform:translate(-50%,-50%) scale(.45)}45%{opacity:.8}90%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}
@keyframes harmonyArrowGesture{0%,100%{transform:translateX(-2px)}55%{transform:translateX(4px)}}
@keyframes harmonyBackGesture{0%,100%{transform:translateX(2px)}55%{transform:translateX(-4px)}}
@keyframes harmonyMagnifyGesture{0%,100%{transform:scale(.9)}50%{transform:scale(1.1)}}
@keyframes harmonyReadGesture{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.harmony-pointer *,.harmony-pointer *::before,.harmony-pointer *::after{animation:none!important;transition:none!important}}

/* White difference blending inverts the actual pixels beneath every gesture. */
.harmony-pointer{mix-blend-mode:difference;color:#fff}
.harmony-pointer__mark{filter:grayscale(1) brightness(0) invert(1)}

/* Two quiet speech shapes exchange a reply. No label or enclosing cursor ring. */
.contact-glyph{position:relative;display:block;width:36px;height:34px;perspective:110px;transform-style:preserve-3d;color:inherit}
.contact-glyph__page,.contact-glyph__leaf{position:absolute;border:1px solid currentColor;border-radius:6px;box-sizing:border-box}
.contact-glyph__page{left:14px;top:2px;width:19px;height:16px;opacity:.35;animation:contactReply 4s ease-in-out infinite}
.contact-glyph__leaf{left:3px;top:9px;width:26px;height:19px;background:none;animation:contactSpeech 4s ease-in-out infinite}
.contact-glyph__leaf::after{content:'';position:absolute;width:5px;height:5px;left:5px;bottom:-4px;border-left:1px solid currentColor;transform:skewY(-38deg);background:none}
.contact-glyph__line{position:absolute;left:12px;top:17px;width:2px;height:2px;border-radius:50%;background:currentColor;box-shadow:6px 0 currentColor;animation:contactTyping 4s ease-in-out infinite}
@keyframes contactSpeech{0%,100%{transform:translateY(0);opacity:.7}45%,65%{transform:translateY(-1px);opacity:1}}
@keyframes contactReply{0%,20%,100%{transform:translate(-3px,3px);opacity:.12}45%,65%{transform:translate(0,0);opacity:.5}}
@keyframes contactTyping{0%,100%{opacity:.25}35%,60%{opacity:.9;transform:translateX(1px)}}
.harmony-pointer__mark>.contact-glyph{display:none}
.harmony-pointer[data-action="contact"] .harmony-pointer__mark{width:36px;height:34px;left:-18px;top:-17px;border:0;border-radius:0;animation:none;color:#fff}
.harmony-pointer[data-action="contact"] .harmony-pointer__mark::before,.harmony-pointer[data-action="contact"] .harmony-pointer__mark::after{display:none}
.harmony-pointer[data-action="contact"] .contact-glyph{display:block}
@media(prefers-reduced-motion:reduce){.contact-glyph__page,.contact-glyph__leaf,.contact-glyph__line{animation:none}}
.harmony-pointer__mark{transition:none!important}

/* One point presses; two fine ripples expand and dissolve from the same origin. */
.contact-glyph{perspective:none;transform-style:flat}
.contact-glyph__page,.contact-glyph__leaf{left:50%;top:50%;width:26px;height:26px;border:1px solid currentColor;border-radius:50%;background:none;box-shadow:none;opacity:0;animation:contactTapWave 2.8s ease-out infinite}
.contact-glyph__leaf{animation-delay:.28s}
.contact-glyph__leaf::after{display:none}
.contact-glyph__line{left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:none;animation:contactTapPoint 2.8s ease-in-out infinite}
@keyframes contactTapWave{0%,14%{opacity:0;transform:translate(-50%,-50%) scale(.18)}20%{opacity:.75}70%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}
@keyframes contactTapPoint{0%,100%{opacity:.8;transform:translate(-50%,-50%) scale(1)}14%{opacity:1;transform:translate(-50%,-50%) scale(.55)}30%,75%{opacity:.85;transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.contact-glyph__page,.contact-glyph__leaf,.contact-glyph__line{animation:none;transform:translate(-50%,-50%)}.contact-glyph__page{opacity:.45}.contact-glyph__line{opacity:1}}


/* A fine, asymmetric pointer distinguishes ordinary navigation from every action cue.
   Its tip is the actual hotspot: no ring, reflection, glow or continuous animation. */
.harmony-pointer[data-action="idle"] .harmony-pointer__mark{
 width:10px;height:16px;left:0;top:0;border:0;border-radius:0;background:#fff;opacity:.9;
 clip-path:polygon(0 0,100% 66%,48% 61%,33% 100%);transform:rotate(-10deg);transform-origin:0 0;
 box-shadow:none;filter:none;animation:none;
}
.harmony-pointer[data-action="idle"] .harmony-pointer__mark::before,
.harmony-pointer[data-action="idle"] .harmony-pointer__mark::after{display:none}
.harmony-pointer.is-pressed[data-action="idle"] .harmony-pointer__mark{transform:rotate(-10deg) scale(.9)}
.harmony-pointer[data-action="point"] .harmony-pointer__mark{width:5px;height:5px;left:-2.5px;top:-2.5px;border:0;border-radius:50%;background:#fff;box-shadow:none;animation:none;filter:none}
.harmony-pointer[data-action="point"] .harmony-pointer__mark::before,.harmony-pointer[data-action="point"] .harmony-pointer__mark::after{display:none}


/* Threshold the actual pixels beneath the ordinary pointer and link dot. Mid-grey
   belongs to the dark-ink range rather than producing another grey by difference blending. */
@supports ((backdrop-filter:invert(1)) or (-webkit-backdrop-filter:invert(1))){
 .harmony-pointer:is([data-action="idle"],[data-action="point"]){mix-blend-mode:normal}
 .harmony-pointer:is([data-action="idle"],[data-action="point"]) .harmony-pointer__mark{
  background:transparent!important;opacity:1;filter:none;
  -webkit-backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
  backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
 }
}

/* Every action uses the same near-black/white backdrop threshold. The mask follows
   the ink, so no filtered rectangle is ever painted around an animated gesture. */
.harmony-pointer__ink,.harmony-pointer__wave{display:none}
@supports ((backdrop-filter:invert(1)) or (-webkit-backdrop-filter:invert(1))){
 .harmony-pointer{mix-blend-mode:normal}
 .harmony-pointer .harmony-pointer__mark{border-color:transparent!important;background:transparent!important;box-shadow:none;filter:none}
 .harmony-pointer .harmony-pointer__mark::before,.harmony-pointer .harmony-pointer__mark::after{display:none!important}
 .harmony-pointer__ink,.harmony-pointer__wave{
  position:absolute;left:50%;top:50%;width:48px;height:48px;transform:translate(-50%,-50%);pointer-events:none;
  background:none;mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
  -webkit-backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
  backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
 }
 .harmony-pointer:not([data-action="idle"]):not([data-action="point"]):not([data-action="contact"]) .harmony-pointer__ink{display:block}
 .harmony-pointer[data-action="turn"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%22-10%22%20y%3D%22-13%22%20width%3D%2220%22%20height%3D%2226%22%20rx%3D%221%22%2F%3E%3Cpath%20d%3D%22M-6-9V9%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%22-10%22%20y%3D%22-13%22%20width%3D%2220%22%20height%3D%2226%22%20rx%3D%221%22%2F%3E%3Cpath%20d%3D%22M-6-9V9%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="next"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-9%200H9M4-5L9%200%204%205%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-9%200H9M4-5L9%200%204%205%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="back"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%200H-9M-4-5L-9%200-4%205%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%200H-9M-4-5L-9%200-4%205%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="drag"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-9-4L-13%200-9%204M9-4L13%200%209%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-9-4L-13%200-9%204M9-4L13%200%209%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="open"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2210%22%2F%3E%3Ccircle%20r%3D%221%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M7%207L13%2013%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2210%22%2F%3E%3Ccircle%20r%3D%221%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M7%207L13%2013%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="close"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-7-7L7%207M-7%207L7-7%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M-7-7L7%207M-7%207L7-7%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="menu"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2213.5%22%2F%3E%3Cpath%20d%3D%22M-6-4H6M-6%200H6M-6%204H6%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2213.5%22%2F%3E%3Cpath%20d%3D%22M-6-4H6M-6%200H6M-6%204H6%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="write"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M0-8.5V8.5%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M0-8.5V8.5%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="read"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%22-10.5%22%20y%3D%22-13%22%20width%3D%2221%22%20height%3D%2226%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M-6-4H6M-6%200H6M-6%204H6%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%22-10.5%22%20y%3D%22-13%22%20width%3D%2221%22%20height%3D%2226%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M-6-4H6M-6%200H6M-6%204H6%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="click"] .harmony-pointer__ink{mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2210.5%22%2F%3E%3Ccircle%20r%3D%221.5%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2210.5%22%2F%3E%3Ccircle%20r%3D%221.5%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="click"] .harmony-pointer__wave{display:block;mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2217%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2217%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");animation:harmonyTapRipple 1.6s ease-out infinite}
 .harmony-pointer[data-action="write"] .harmony-pointer__ink{animation:harmonyCursorCaret 1.4s ease-in-out infinite}
 .harmony-pointer[data-action="contact"] .contact-glyph__page,.harmony-pointer[data-action="contact"] .contact-glyph__leaf,.harmony-pointer[data-action="contact"] .contact-glyph__line{
  border:0;background:none;box-shadow:none;
  -webkit-backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
  backdrop-filter:blur(2px) grayscale(1) invert(1) brightness(.68) contrast(80);
  mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
 }
 .harmony-pointer[data-action="contact"] .contact-glyph__page,.harmony-pointer[data-action="contact"] .contact-glyph__leaf{width:48px;height:48px;mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2212.5%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%2212.5%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
 .harmony-pointer[data-action="contact"] .contact-glyph__line{width:48px;height:48px;mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%222.5%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-24%20-24%2048%2048%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%221.25%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20r%3D%222.5%22%20fill%3D%22white%22%20stroke%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}
}