/* © 2024–2026 Andrea Taliento (ANDRYXify) — Tutti i diritti riservati — socialbot.live */
/* Proprieta intellettuale · ANDRYX-IP::a7f39c1e8b424d90-4f7b-taliento::socialbot.live */

#anime-sfondo { position: fixed; inset: 0; z-index: -2; pointer-events: none; background: var(--bg); }
body { background: transparent; }
h1, h2, h3, .titolo-mega {
  font-family: "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
h1, .titolo-mega { font-weight: 400; letter-spacing: -.015em; line-height: 1.1; }
h2 { font-weight: 400; letter-spacing: -.008em; }
h3 { font-weight: 500; letter-spacing: 0; }
p, li { line-height: 1.72; }
.blocco, .pannello { padding: 1.7rem 1.8rem; border: 1px solid var(--border); border-radius: 10px; }
.blocco, .carta, .pannello { transition: border-color .4s var(--an-morbido), background .4s var(--an-morbido); }
@media (hover: hover) {
  .blocco:hover, .carta:hover, .pannello:hover {
    border-color: var(--border-2); background: color-mix(in srgb, var(--testo) 3%, transparent);
  }
  .btn:not(.secondario):not(.testo):hover { opacity: .9; }
}
.btn.testo {
  background: transparent; border-color: transparent; color: var(--testo-2);
  box-shadow: none; font-weight: 600;
}
@media (hover: hover) {
  .btn.testo:hover { background: color-mix(in srgb, var(--testo) 7%, transparent); color: var(--testo); box-shadow: none; transform: none; }
  a:hover { color: var(--acc); }
}
.blocco a:not(.btn):not(.menu-voce), .pannello a:not(.btn), p a:not(.btn) {
  text-decoration: none;
  background-image: linear-gradient(var(--acc), var(--acc));
  background-size: 0% 1px; background-position: 0 100%; background-repeat: no-repeat;
  transition: background-size .35s var(--an-morbido), color .3s ease; padding-bottom: 1px;
}
@media (hover: hover) {
  .blocco a:not(.btn):not(.menu-voce):hover, .pannello a:not(.btn):hover, p a:not(.btn):hover { background-size: 100% 1px; color: var(--acc); }
}
@media (prefers-reduced-motion: reduce) and (hover: hover) {
  .blocco:hover, .carta:hover, .pannello:hover, .btn:hover, #cerca-lancia:hover, .menu-voce:hover { transform: none; }
  .btn:hover, .btn:active { translate: none; scale: none; }
}
@media (pointer: coarse) {
  .btn, button.btn, a.btn { min-height: 44px; padding: .6rem 1.1rem; }
  summary { min-height: 42px; display: flex; align-items: center; }
}
:root {
  --molla-lieve: linear(0,0.0058,0.0217,0.0457,0.0761,0.1115,0.1506,0.1923,0.2357,0.28,0.3245,0.3687,0.4122,0.4545,0.4955,0.5349,0.5726,0.6084,0.6422,0.6741,0.704,0.7319,0.7579,0.782,0.8043,0.8249,0.8438,0.8611,0.8769,0.8913,0.9043,0.9162,0.9268,0.9364,0.9451,0.9528,0.9597,0.9658,0.9712,0.976,0.9802,0.9839,0.9871,0.9899,0.9923,0.9944,0.9962,0.9977,0.9989,1,1.0008,1.0016,1.0021,1.0026,1.0029,1.0031,1.0033,1.0034,1.0034,1.0034,1.0034,1.0033,1.0032,1.0031,1);
  --molla-medio: linear(0,0.0063,0.0236,0.0497,0.0827,0.1211,0.1635,0.2085,0.2552,0.3028,0.3504,0.3976,0.4437,0.4885,0.5316,0.5728,0.6119,0.6489,0.6836,0.716,0.7462,0.7741,0.7998,0.8235,0.8451,0.8648,0.8826,0.8988,0.9133,0.9263,0.9379,0.9482,0.9574,0.9654,0.9724,0.9786,0.9839,0.9884,0.9923,0.9957,0.9984,1.0007,1.0026,1.0042,1.0054,1.0063,1.007,1.0075,1.0078,1.0079,1.0079,1.0079,1.0077,1.0075,1.0072,1.0069,1.0066,1.0062,1.0058,1.0055,1.0051,1.0047,1.0043,1.004,1);
  --molla-pieno: linear(0,0.0068,0.0253,0.0534,0.0889,0.13,0.1753,0.2234,0.2731,0.3236,0.3741,0.4238,0.4723,0.5191,0.564,0.6067,0.6469,0.6847,0.72,0.7527,0.7828,0.8105,0.8358,0.8587,0.8795,0.8982,0.9149,0.9298,0.9429,0.9545,0.9647,0.9735,0.9811,0.9876,0.9931,0.9977,1.0016,1.0047,1.0073,1.0093,1.0108,1.0119,1.0126,1.0131,1.0133,1.0133,1.0131,1.0128,1.0124,1.0119,1.0113,1.0107,1.01,1.0093,1.0087,1.008,1.0073,1.0067,1.0061,1.0055,1.005,1.0044,1.0039,1.0035,1);
  --molla-scena: linear(0,0.006,0.0226,0.0477,0.0795,0.1164,0.1571,0.2005,0.2456,0.2915,0.3376,0.3833,0.4282,0.4718,0.5139,0.5542,0.5927,0.6291,0.6634,0.6956,0.7256,0.7536,0.7795,0.8034,0.8254,0.8455,0.8639,0.8807,0.8959,0.9096,0.9219,0.933,0.9429,0.9517,0.9596,0.9665,0.9726,0.9779,0.9826,0.9866,0.9901,0.9931,0.9956,0.9978,0.9995,1.001,1.0022,1.0032,1.004,1.0045,1.005,1.0052,1.0054,1.0055,1.0055,1.0054,1.0053,1.0052,1.005,1.0048,1.0045,1.0043,1.004,1.0038,1);

  --t-lieve: 120ms;
  --t-medio: 220ms;
  --t-pieno: 320ms;
  --t-scena: 420ms;
  --t-uscita: 260ms;
  --ease-uscita: cubic-bezier(.4, 0, 1, 1);
  --ease-entrata: cubic-bezier(.16, .84, .34, 1);

  --t-molla-giu: 90ms;
  --t-molla-su: 340ms;
  --giu-secco: cubic-bezier(.2, .8, .3, 1);
}
.carta, .blocco, .pannello, .cerca-box, .switch-canale-menu, .pil-osk-box {
  transition: transform var(--t-pieno) var(--molla-pieno), border-color .34s ease, background .34s ease, box-shadow var(--t-pieno) var(--molla-pieno);
}
.btn:not(.secondario):not(.testo), .pl-tile { position: relative; overflow: hidden; }
.btn:not(.secondario):not(.testo)::after, .pl-tile::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: linear-gradient(105deg, transparent 38%, var(--sheen) 50%, transparent 62%);
  transform: translateX(-120%);
  transition: opacity .2s ease;
}
@media (hover: hover) {
  .btn:not(.secondario):not(.testo):hover::after {
    opacity: 1; animation: lucida var(--t-pieno) var(--molla-pieno) both;
  }
}
#anime-sfondo::after {
  content: ""; position: absolute; inset: -30%;
  background: radial-gradient(52% 56% at 32% 28%, var(--acc-tint), transparent 100%);
  opacity: .5;
  animation: respiro 26s ease-in-out infinite alternate;
}
@media (prefers-reduced-motion: reduce) {
  #anime-sfondo::after, .pl-atmo { animation: none !important; }
  .btn::after, .pl-tile::after { display: none; }
  :root { --molla-lieve: ease; --molla-medio: ease; --molla-pieno: ease; --molla-scena: ease;
            --t-lieve: .01ms; --t-medio: .01ms; --t-pieno: .01ms; --t-scena: .01ms; --t-uscita: .01ms; }
}
.btn, button.btn, a.btn {
  transition: scale var(--t-molla-su) var(--molla-medio), opacity .2s ease,
              background .24s ease, color .24s ease, border-color .24s ease, box-shadow var(--t-molla-su) var(--molla-medio);
  translate: var(--mx, 0px) var(--my, 0px);
}
@media (hover: hover) {
  .btn:hover {
    translate: calc(var(--mx, 0px) - 3px) calc(var(--my, 0px) - 4px);
    scale: 1.02;
  }
}
.btn:active, button.btn:active, a.btn:active {
  translate: var(--mx, 0px) calc(var(--my, 0px) + 1px);
  scale: .972;
  transition-duration: var(--t-molla-giu);
  transition-timing-function: var(--giu-secco);
}
#an-campo {
  position: absolute; inset: -25%; pointer-events: none;
  background: radial-gradient(42% 46% at 62% 66%, color-mix(in srgb, var(--acc) 26%, transparent), transparent 100%);
  opacity: .3;
  will-change: transform; backface-visibility: hidden;
}
.vivo {
  position: relative; display: inline-block; flex: 0 0 auto;
  width: 7px; height: 7px; margin-right: .45em; border-radius: 50%;
  background: currentColor; vertical-align: baseline;
}
.vivo::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%; background: currentColor;
  animation: onda-viva 2.6s ease-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  #an-campo { transform: none; will-change: auto; }
  .vivo::after { animation: none; opacity: 0; }
}
.barra-giu { display: none; }
.bt-sezione { display: none; }
@media (hover: hover) {
  .ovl-tasto:hover:not(:disabled) { background: var(--surface-3); color: var(--testo); border-color: var(--border-2); }
}
.carta { border-width: var(--tratto-3); }
.toast, .cookie-banner, .aiuto-banner { border-width: var(--tratto-4); }
a:focus-visible, button:focus-visible, .btn:focus-visible, [role="button"]:focus-visible,
summary:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible,
.grp-btn:focus-visible, .drawer-voce:focus-visible, .menu-voce:focus-visible {
  outline: var(--contorno-sp) solid var(--acc);
  outline-offset: 3px;
}
.vt-titolo { color: var(--testo); }

@keyframes lucida { from { transform: translateX(-120%); } to { transform: translateX(120%); } }
@keyframes respiro {
  from { transform: translate3d(-3%, -2%, 0) scale(1); }
  to   { transform: translate3d(4%, 3%, 0) scale(1.09); }
}
@keyframes onda-viva {
  0% { transform: scale(1); opacity: .5; }
  70%, 100% { transform: scale(2.7); opacity: 0; }
}

@property --mt-t { syntax: '<length>'; inherits: false; initial-value: 0px; }
.dg-in, .dg-out {
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-mask-image: repeating-linear-gradient(-38deg, #000 0 var(--mt-t), transparent var(--mt-t) 7px);
  mask-image: repeating-linear-gradient(-38deg, #000 0 var(--mt-t), transparent var(--mt-t) 7px);
}
.dg-in { animation: dg-retino var(--dg-retino, 170ms) steps(3, jump-end) var(--dg-da-retino, 0ms) both; }
.dg-out { animation: dg-copri var(--dg-retino, 170ms) steps(3, jump-end) var(--dg-da-retino, 0ms) both; }
@keyframes dg-retino { from { --mt-t: 0px; } to { --mt-t: 7px; } }
@keyframes dg-copri { from { --mt-t: 7px; } to { --mt-t: 0px; } }
.dg-tela { position: absolute; pointer-events: none; overflow: visible; max-width: none; }
.dg-tela path { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.dg-matita { stroke: color-mix(in srgb, var(--contorno) 62%, transparent); stroke-width: 1.5; }
.dg-emanata { stroke-width: 2.4; }
.dg-rabbia { stroke: var(--rosso); }
.dg-scintille { stroke: var(--acc); }
.dg-traccia { animation: dg-traccia var(--dg-dur, 200ms) var(--dg-passi, steps(3, jump-end)) var(--dg-da, 0ms) forwards; }
.dg-sfila { animation: dg-sfila var(--dg-dur, 200ms) var(--dg-passi, steps(3, jump-end)) var(--dg-da, 0ms) both; }
@keyframes dg-traccia { to { stroke-dashoffset: 0; } }
@keyframes dg-sfila { from { stroke-dashoffset: 0; } to { stroke-dashoffset: 1; } }
.dg-matite { animation: dg-via var(--dg-pulizia, 170ms) steps(2, jump-end) var(--dg-da-pulizia, 0ms) forwards; }
.dg-matite.dg-torna { animation-name: dg-torna; animation-fill-mode: both; }
@keyframes dg-via { to { opacity: 0; } }
@keyframes dg-torna { from { opacity: 0; } to { opacity: 1; } }
.dg-ripasso { animation: dg-via 150ms steps(2, jump-end) 260ms forwards; }
.dg-attesa { opacity: 0; }
@media print { .dg-attesa { opacity: 1; } }