/* Matita: segno del puntatore e tacca sul bordo destro */
.mt-cv{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:2147483000}
.mt-ly{position:fixed;left:0;top:0;width:0;height:0;pointer-events:none;z-index:2147482999}
.mt-ly canvas{position:absolute;display:block}
html.mt-on body{cursor:var(--mt-cur)}
html.mt-on body :where(p,h1,h2,h3,h4,span,li,section,div,main,header,footer,svg,img,figure){cursor:inherit}
.mt-pn{--k:#0A0A0A;--r:12px;position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:2147483001;cursor:default}
.mt-nc{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;width:30px;padding:6px 0 6px 2px;background:var(--k);border-radius:var(--r) 0 0 var(--r);transition:width .45s cubic-bezier(.22,1,.36,1)}
/* raccordi curvi verso il bordo, come una goccia che esce dallo schermo */
.mt-nc::before,.mt-nc::after{content:"";position:absolute;right:0;width:var(--r);height:var(--r);pointer-events:none}
.mt-nc::before{bottom:100%;background:radial-gradient(circle at 0 0,transparent calc(var(--r) - .5px),var(--k) var(--r))}
.mt-nc::after{top:100%;background:radial-gradient(circle at 0 100%,transparent calc(var(--r) - .5px),var(--k) var(--r))}
.mt-pn:hover .mt-nc,.mt-pn.open .mt-nc,.mt-pn:focus-within .mt-nc{width:34px}
.mt-pn button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:transparent;color:#FFFFFF;cursor:pointer;transition:background-color .25s,transform .25s}
.mt-pn button:hover{background:rgba(255,255,255,.12)}
.mt-pn button:focus-visible{outline:1.5px solid #FFFFFF;outline-offset:1px}
.mt-bp svg{width:15px;height:15px}
.mt-bc i{display:block;width:11px;height:11px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1.5px #0A0A0A,0 0 0 2.5px rgba(255,255,255,.7)}
.mt-pn.off .mt-bp{color:rgba(255,255,255,.4)}
.mt-pn.off .mt-bc i{opacity:.4}
/* menu che escono a sinistra della tacca */
.mt-m{position:absolute;right:calc(100% + 8px);display:flex;align-items:center;gap:2px;padding:4px;background:var(--k);border-radius:999px;opacity:0;visibility:hidden;transform:translateX(10px) scale(.92);transform-origin:right center;transition:opacity .3s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1),visibility 0s .45s}
.mt-m.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
#mt-ms{top:2px}
#mt-mc{bottom:2px}
.mt-s i{display:block;border-radius:50%;background:rgba(255,255,255,.45);transition:background-color .25s}
.mt-s[aria-pressed="true"] i{background:#FFFFFF}
.mt-s i{background:rgba(255,255,255,.35)}
.mt-off svg{width:15px;height:15px;opacity:.6}
.mt-off[aria-pressed="true"] svg{opacity:1}
.mt-c i{display:block;width:12px;height:12px;border-radius:50%;background:var(--c);transition:transform .25s}
.mt-c[aria-pressed="true"] i{transform:scale(1.15);box-shadow:0 0 0 1.5px #0A0A0A,0 0 0 2.5px #FFFFFF}
@media (max-width:860px),(pointer:coarse){.mt-pn{display:none}}
@media print{.mt-pn,.mt-cv,.mt-ly{display:none}}
