/* ==========================================================================
   AU design system v3.6 — single violet accent, Inter, one radius scale (components + motion states)
   Requires: /site-ui.css (tokens + fonts).  Optional: /au-motion.js
   Docs: DESIGN-SYSTEM.md (release root). Prefix everything new with .au-
   ========================================================================== */

@property --au-angle{syntax:"<angle>";inherits:false;initial-value:0deg}

/* ---------- Page base ---------- */
body.au-page{
  margin:0;min-height:100vh;color:var(--au-text);background:var(--au-bg);
  font:400 var(--au-fs-body)/1.65 var(--au-font-body);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
  overflow-x:clip; /* v3.7.2: clip (not hidden) = no scroll container; edges coincide with the viewport, so no glow is ever visibly cut */
}
html:has(>body.au-page){overflow-x:clip}
body.au-page *,body.au-page *::before,body.au-page *::after{box-sizing:border-box}
body.au-page img,body.au-page svg{max-width:100%}
.au-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Backdrop: aurora canvas + grid + spotlight + grain ---------- */
.au-backdrop{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict}
.au-backdrop>*{position:absolute;inset:0}
.au-aurora{width:100%;height:100%;display:block;opacity:var(--au-aurora-opacity,1);transition:opacity .6s ease}
/* CSS fallback / static aurora (no WebGL, low-end, reduced motion before first frame) */
.au-aurora-css{opacity:1;transition:opacity .8s ease;background:
  radial-gradient(60% 50% at 20% 0%,rgba(109,74,224,.22),rgba(109,74,224,0) 100%),
  radial-gradient(55% 50% at 85% 5%,rgba(79,50,184,.20),rgba(79,50,184,0) 100%),
  radial-gradient(60% 45% at 55% 100%,rgba(109,74,224,.08),rgba(109,74,224,0) 100%)}
.au-backdrop.is-css .au-aurora-css{opacity:1}
html.au-js .au-backdrop:not(.is-css) .au-aurora-css{opacity:0} /* no JS: CSS aurora stays */
.au-backdrop.is-css .au-aurora{display:none}
html[data-theme="light"] .au-aurora-css{background:
  radial-gradient(60% 50% at 20% 0%,rgba(109,74,224,.14),rgba(109,74,224,0) 100%),
  radial-gradient(55% 50% at 85% 5%,rgba(91,59,208,.10),rgba(91,59,208,0) 100%),
  radial-gradient(60% 45% at 55% 100%,rgba(91,59,208,.05),rgba(91,59,208,0) 100%)}
.au-grid{
  background-image:radial-gradient(rgba(190,182,230,.16) 1px,transparent 1.2px);background-size:28px 28px;
  -webkit-mask-image:radial-gradient(120% 80% at 50% 0%,#000 25%,transparent 75%);mask-image:radial-gradient(120% 80% at 50% 0%,#000 25%,transparent 75%);
}
html[data-theme="light"] .au-grid{background-image:radial-gradient(rgba(40,30,80,.16) 1px,transparent 1.2px)}
/* Spotlight that follows the cursor (desktop). Moved by transform only. */
.au-spot{inset:auto;left:0;top:0;width:720px;height:720px;margin:-360px 0 0 -360px;border-radius:50%;opacity:0;
  transform:translate3d(var(--au-sx,50vw),var(--au-sy,30vh),0);transition:opacity .6s ease;will-change:transform;
  background:radial-gradient(closest-side,rgba(124,92,255,.11),rgba(109,74,224,.05) 50%,rgba(109,74,224,0) 100%)}
.au-backdrop.has-pointer .au-spot{opacity:1}
html[data-theme="light"] .au-spot{background:radial-gradient(closest-side,rgba(91,59,208,.08),rgba(91,59,208,.035) 50%,rgba(91,59,208,0) 100%)}
.au-grain{opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html[data-theme="light"] .au-grain{opacity:.05;mix-blend-mode:multiply}
.au-vignette{background:radial-gradient(140% 90% at 50% 0%,transparent 55%,rgba(3,2,7,.55) 100%)}
html[data-theme="light"] .au-vignette{background:radial-gradient(140% 90% at 50% 0%,transparent 60%,rgba(220,215,235,.45) 100%)}

/* Fallback header (only visible if site-ui.js did not inject the shared nav, e.g. no JS) */
.au-fallback-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;width:min(1320px,calc(100% - 32px));margin:16px auto 0;padding:14px 18px;border:1px solid var(--au-line);border-radius:16px;background:var(--au-surface)}
.au-fallback-nav a{color:var(--au-text);text-decoration:none;font:600 14px/1 var(--au-font-display)}
.au-fallback-nav nav{display:flex;gap:16px}.au-fallback-nav nav a{font:500 14px/1 var(--au-font-label);color:var(--au-text-2)}

/* ---------- Layout ---------- */
.au-container{width:min(1320px,calc(100% - 2 * var(--site-gutter,24px)));margin-inline:auto}
.au-main{flex:1 0 auto;width:min(1320px,calc(100% - 2 * var(--site-gutter,24px)));margin-inline:auto;position:relative}
.au-section{padding-block:calc(var(--au-section-gap) / 2);position:relative}
.au-section-head{display:grid;gap:var(--au-s-4);max-width:760px;margin-bottom:var(--au-s-7)}
.au-section-head--split{max-width:none;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:end;gap:var(--au-s-6)}
.au-section-head p{margin:0;color:var(--au-text-2);font-size:var(--au-fs-lead);line-height:1.6;max-width:56ch}

/* ---------- Typography ---------- */
.au-eyebrow,.au-index{display:inline-flex;align-items:center;gap:8px;margin:0;color:var(--au-accent);font:600 15px/1.2 var(--au-font-label);letter-spacing:-.01em;text-transform:none}
.au-index{color:var(--au-muted);font-weight:500}
.au-index b{color:var(--au-accent);font-weight:600}
.au-display,.au-h1,.au-h2,.au-h3{margin:0;font-family:var(--au-font-display);font-weight:600;color:var(--au-text);text-wrap:balance}
.au-display{font-size:var(--au-fs-hero);line-height:1;letter-spacing:-.045em;font-weight:650}
.au-h1{font-size:var(--au-fs-h1);line-height:1.04;letter-spacing:var(--au-track-tight)}
.au-h2{font-size:var(--au-fs-h2);line-height:1.06;letter-spacing:-.03em}
.au-h3{font-size:var(--au-fs-h3);line-height:1.2;letter-spacing:var(--au-track-snug)}
.au-lead{margin:0;color:var(--au-text-2);font-size:var(--au-fs-lead);line-height:1.62;max-width:58ch}
.au-muted{color:var(--au-muted)}
.au-mono{font-family:var(--au-font-mono)}
.au-gradient-text{background:var(--au-spectrum-text);background-size:100% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.au-gradient-text.is-flowing{background-size:200% 100%;animation:au-flow 8s var(--au-ease-in-out) infinite alternate}
@keyframes au-flow{from{background-position:0% 50%}to{background-position:100% 50%}}

/* Kinetic lines: <span class="au-line"><span class="au-line-inner">text</span></span> */
.au-line{display:block;overflow:hidden;padding:.04em .04em .18em;margin:-.04em -.04em -.18em} /* room for descenders: no clipped gradient glyphs */
.au-line-inner{display:inline-block;will-change:transform}
html.au-motion [data-au-lines]:not(.is-in) .au-line-inner{transform:translate3d(0,108%,0) rotate(2deg);opacity:0}
html.au-motion [data-au-lines] .au-line-inner{transition:transform 1.1s var(--au-ease-out),opacity .6s ease;transition-delay:calc(var(--i,0) * 110ms + var(--au-delay,0ms))}

/* ---------- Buttons ---------- */
.au-btn{
  --au-btn-h:46px;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:var(--au-btn-h);padding:0 20px;border:1px solid var(--au-line-strong);border-radius:var(--au-r-control);
  color:var(--au-text);background:rgba(255,255,255,.035);text-decoration:none;cursor:pointer;
  font:600 15px/1 var(--au-font-body);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;
  transition:transform .45s var(--au-ease-out),border-color .25s ease,background-color .25s ease,box-shadow .35s ease,color .25s ease;
  -webkit-tap-highlight-color:transparent;
}
html[data-theme="light"] .au-btn{background:rgba(255,255,255,.7)}
.au-btn:hover{border-color:var(--au-accent-line);background-color:var(--au-accent-soft)}
.au-btn:active{transform:scale(.97)}
.au-btn[disabled],.au-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.au-btn--primary{border-color:transparent;color:var(--au-on-accent);background:var(--au-fill);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),var(--au-glow)}
.au-btn--primary:hover{border-color:transparent;background:var(--au-fill);filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 0 1px var(--au-accent-line),0 18px 44px var(--au-glow-color)}
html[data-theme="light"] .au-btn--primary{background:var(--au-fill)}
.au-btn--ghost{background:transparent;border-color:transparent}
.au-btn--ghost:hover{border-color:var(--au-line-strong);background:rgba(255,255,255,.04)}
.au-btn--sm{--au-btn-h:38px;padding:0 14px;font-size:14px;gap:8px;border-radius:var(--au-r-chip)}
.au-btn--icon{width:var(--au-btn-h);padding:0}
.au-btn-arrow{position:relative;display:inline-grid;place-items:center;width:24px;height:24px;margin-inline-end:-6px;border-radius:7px;overflow:hidden;background:rgba(255,255,255,.08)}
.au-btn--primary .au-btn-arrow{background:rgba(255,255,255,.16)}
html[data-theme="light"] .au-btn--primary .au-btn-arrow{background:rgba(255,255,255,.2)}
.au-btn-arrow svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--au-ease-out)}
.au-btn-arrow svg+svg{position:absolute;transform:translate(-160%,160%)}
.au-btn:hover .au-btn-arrow svg:first-child{transform:translate(160%,-160%)}
.au-btn:hover .au-btn-arrow svg+svg{transform:none}
.au-btn svg.au-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.au-link{display:inline-flex;align-items:center;gap:10px;color:var(--au-text);text-decoration:none;font-weight:600;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:3px;transition:background-size .5s var(--au-ease-out),color .2s ease}
.au-link:hover{background-size:100% 1px;color:var(--au-accent)}

/* ---------- Cards ---------- */
.au-card{
  position:relative;isolation:isolate;border:1px solid var(--au-line);border-radius:var(--au-r-card);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012)),var(--au-surface);
  box-shadow:var(--au-sh-2);backdrop-filter:var(--au-blur);-webkit-backdrop-filter:var(--au-blur);
}
html[data-theme="light"] .au-card{background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.72)),var(--au-surface)}
.au-card--pad{padding:clamp(22px,2.4vw,34px)}
.au-card--solid{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--au-surface-solid)}
/* Animated spectrum border, visible on hover/focus (or always with .is-lit) */
.au-card--interactive::before,.au-card.is-lit::before{
  content:"";position:absolute;inset:-1px;z-index:2;border-radius:inherit;padding:1px;pointer-events:none;opacity:0;
  background:conic-gradient(from var(--au-angle),transparent 0 30%,var(--au-accent-deep) 42%,var(--au-accent) 52%,var(--au-accent-deep) 62%,transparent 75% 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  transition:opacity .45s ease;animation:au-spin-angle 6s linear infinite;animation-play-state:paused;
}
.au-card.is-lit::before{opacity:.75;animation-play-state:running}
.au-card--interactive:hover::before,.au-card--interactive:focus-visible::before,.au-card--interactive:focus-within::before{opacity:1;animation-play-state:running}
@keyframes au-spin-angle{to{--au-angle:360deg}}
.au-card--interactive{transition:transform .6s var(--au-ease-out),box-shadow .45s ease,border-color .3s ease;transform-style:preserve-3d}
.au-card--interactive:hover{box-shadow:var(--au-sh-3)}
/* Cursor glare, injected by au-motion ([data-au-glare]) — uses --au-gx/--au-gy */
.au-glare{position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s ease;
  background:radial-gradient(420px circle at var(--au-gx,50%) var(--au-gy,0%),rgba(255,255,255,.07),rgba(139,108,255,.05) 30%,transparent 62%)}
html[data-theme="light"] .au-glare{background:radial-gradient(420px circle at var(--au-gx,50%) var(--au-gy,0%),rgba(91,59,208,.09),rgba(91,59,208,.04) 30%,transparent 60%)}
[data-au-glare]:hover>.au-glare{opacity:1}

/* ---------- Badges / chips ---------- */
.au-badge{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:0 9px;border:1px solid var(--au-line-strong);border-radius:var(--au-r-chip);color:var(--au-text-2);background:rgba(255,255,255,.03);font:500 12.5px/1 var(--au-font-label);letter-spacing:0;text-transform:none;white-space:nowrap}
.au-badge--accent{color:var(--au-accent);border-color:var(--au-accent-line);background:var(--au-accent-soft)}
.au-badge--success{color:var(--au-success);border-color:color-mix(in srgb,var(--au-success) 40%,transparent)}
.au-badge--warning{color:var(--au-warning);border-color:color-mix(in srgb,var(--au-warning) 40%,transparent)}
.au-badge--danger{color:var(--au-danger);border-color:color-mix(in srgb,var(--au-danger) 40%,transparent)}
.au-dot{width:7px;height:7px;border-radius:50%;background:var(--au-success);box-shadow:0 0 0 3px color-mix(in srgb,var(--au-success) 18%,transparent);flex:0 0 auto}
.au-dot.is-live{animation:au-pulse 2.2s ease-out infinite}
@keyframes au-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--au-success) 55%,transparent)}100%{box-shadow:0 0 0 10px transparent}}

/* ---------- Forms ---------- */
.au-field{display:grid;gap:8px;min-width:0}
.au-label,.au-field>span:first-child{color:var(--au-text-2);font:500 14px/1.2 var(--au-font-label);letter-spacing:-.005em;text-transform:none}
.au-input,.au-textarea,.au-select{
  width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--au-line-strong);border-radius:var(--au-r-control);
  color:var(--au-text);background:var(--au-surface-sunken);font:400 15px/1.45 var(--au-font-body);outline:0;
  transition:border-color .2s ease,box-shadow .3s ease,background-color .2s ease;
}
.au-textarea{min-height:160px;resize:vertical;line-height:1.55}
.au-input::placeholder,.au-textarea::placeholder{color:var(--au-muted);opacity:.85}
.au-input:hover,.au-textarea:hover,.au-select:hover{border-color:color-mix(in srgb,var(--au-accent) 35%,var(--au-line-strong))}
.au-input:focus,.au-textarea:focus,.au-select:focus{border-color:var(--au-accent);background-color:var(--au-surface-solid);box-shadow:0 0 0 4px var(--au-accent-soft),0 10px 30px rgba(0,0,0,.18)}
.au-input:focus-visible,.au-textarea:focus-visible,.au-select:focus-visible{outline:0}
.au-input[aria-invalid="true"],.au-textarea[aria-invalid="true"]{border-color:var(--au-danger)}
.au-hint{margin:0;color:var(--au-muted);font-size:var(--au-fs-xs);line-height:1.5}

/* ---------- Tabs (role=tablist > role=tab) ---------- */
.au-tabs{position:relative;display:inline-flex;gap:4px;padding:4px;border:1px solid var(--au-line);border-radius:var(--au-r-control);background:var(--au-surface-sunken);isolation:isolate;max-width:100%;overflow-x:auto;scrollbar-width:none}
.au-tab{position:relative;min-height:34px;padding:0 14px;border:0;border-radius:7px;color:var(--au-muted);background:transparent;font:500 14px/1 var(--au-font-body);letter-spacing:-.01em;cursor:pointer;white-space:nowrap;transition:color .25s ease}
.au-tab:hover{color:var(--au-text)}
.au-tab[aria-selected="true"],.au-tab.is-active{color:var(--au-text)}
.au-tabs-ink{position:absolute;top:4px;bottom:4px;left:0;width:var(--w,0px);transform:translateX(var(--x,0px));z-index:-1;border-radius:7px;background:var(--au-surface-raised);box-shadow:0 0 0 1px var(--au-line-strong),0 6px 18px rgba(0,0,0,.2);transition:transform .5s var(--au-ease-out),width .5s var(--au-ease-out)}

/* ---------- Simple form page (Contatti, Area Riservata, any single-form page) ----------
   <main class="au-form-main"><section class="au-card au-form-card"><header class="au-form-header">h1 + p</header>
   <form class="au-form">…fields…<button class="au-btn au-btn--primary au-btn--block">…</button></form></section></main> */
.au-form-main{flex:1 0 auto;width:100%;display:grid;justify-items:center;align-content:start;padding:clamp(40px,8vh,104px) 16px clamp(32px,6vh,72px)}
.au-form-card{width:min(100%,520px);display:grid;gap:26px;padding:clamp(26px,4vw,42px);border-radius:var(--au-r-panel)}
.au-form-header{display:grid;gap:10px;text-align:center}
.au-form-header h1{margin:0;font:650 clamp(32px,4.4vw,44px)/1.08 var(--au-font-display);letter-spacing:var(--au-track-tight);color:var(--au-text)}
.au-form-header p{margin:0;color:var(--au-text-2);font-size:16px;line-height:1.5}
.au-form{display:grid;gap:16px}
.au-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.au-btn--block{width:100%}
.au-form .au-btn--primary{margin-top:6px}
.au-field-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.au-field-head .au-counter{color:var(--au-muted);font:500 12.5px/1 var(--au-font-label);font-variant-numeric:tabular-nums}
.au-captcha{display:grid;grid-template-columns:minmax(0,1fr) 132px auto;gap:10px;align-items:center}
.au-captcha-q{min-height:48px;display:flex;align-items:center;padding:0 14px;border:1px solid var(--au-line);border-radius:var(--au-r-control);background:var(--au-surface-sunken);color:var(--au-text);font:500 15px/1.3 var(--au-font-body);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.au-captcha .au-input{min-height:48px}
.au-captcha .au-btn{--au-btn-h:48px;width:48px;padding:0;border-radius:var(--au-r-control)}
.au-captcha .au-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .5s var(--au-ease-out)}
.au-captcha .au-btn:hover svg{transform:rotate(-180deg)}
.au-form-note{margin:0;color:var(--au-muted);font-size:13.5px;line-height:1.5;text-align:center}
.au-message{display:none;margin:0;padding:12px 14px;border:1px solid;border-radius:var(--au-r-control);font-size:14.5px;line-height:1.5}
.au-message.success{color:var(--au-success);border-color:color-mix(in srgb,var(--au-success) 40%,transparent);background:color-mix(in srgb,var(--au-success) 8%,transparent)}
.au-message.error{color:var(--au-danger);border-color:color-mix(in srgb,var(--au-danger) 40%,transparent);background:color-mix(in srgb,var(--au-danger) 8%,transparent)}
.au-form-aside{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding-top:18px;border-top:1px solid var(--au-line);color:var(--au-muted);font-size:14.5px}
.au-form-aside a{color:var(--au-text);text-decoration:none;font-weight:500}
.au-form-aside a:hover{color:var(--au-accent)}
.au-form-aside .au-btn{--au-btn-h:32px;width:32px;padding:0;border-radius:var(--au-r-chip)}
.au-form-aside .au-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:560px){.au-form-row{grid-template-columns:1fr}.au-captcha{grid-template-columns:minmax(0,1fr) 48px}.au-captcha .au-input{grid-column:1 / -1;grid-row:2}}

/* ---------- Page hero (inner pages: tools/arcade/admin) ---------- */
.au-page-hero{display:grid;gap:var(--au-s-4);padding:clamp(48px,7vw,96px) 0 clamp(28px,4vw,48px);max-width:980px}
.au-page-hero--center{margin-inline:auto;text-align:center;justify-items:center}
.au-page-hero .au-h1 em,.au-page-hero .au-display em{font-style:normal}

/* ---------- Stats / counters ---------- */
.au-stat{display:grid;gap:6px}
.au-stat-value{font:650 clamp(30px,3.4vw,46px)/1 var(--au-font-display);letter-spacing:-.035em;color:var(--au-text);font-variant-numeric:tabular-nums}
.au-stat-label{color:var(--au-muted);font:500 14px/1.25 var(--au-font-label);letter-spacing:-.005em;text-transform:none}

/* ---------- Marquee ---------- */
.au-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.au-marquee-track{display:flex;width:max-content;animation:au-marquee var(--au-marquee-speed,48s) linear infinite}
.au-marquee:hover .au-marquee-track,.au-marquee.is-paused .au-marquee-track{animation-play-state:paused}
.au-marquee-group{display:flex;align-items:center;flex:0 0 auto}
@keyframes au-marquee{to{transform:translate3d(-50%,0,0)}}
html[dir="rtl"] .au-marquee-track{animation-direction:reverse}

/* ---------- Rule ---------- */
.au-rule{height:1px;border:0;margin:0;background:linear-gradient(90deg,transparent,var(--au-line-strong) 20%,var(--au-line-strong) 80%,transparent)}

/* ---------- Toast ---------- */
.au-toast{position:fixed;left:50%;bottom:28px;z-index:100000;padding:12px 18px;border:1px solid var(--au-accent-line);border-radius:var(--au-r-control);color:var(--au-text);background:var(--au-surface-solid);box-shadow:var(--au-sh-3);font:500 14px/1 var(--au-font-body);transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:transform .5s var(--au-ease-out),opacity .3s ease}
.au-toast.is-on{transform:translate(-50%,0);opacity:1}

/* ---------- Motion states (driven by au-motion.js; html.au-motion is set only when motion is allowed) ---------- */
html.au-motion [data-au-reveal]{transition:opacity .9s var(--au-ease-out),transform 1s var(--au-ease-out),filter .9s var(--au-ease-out);transition-delay:var(--au-delay,0ms)}
html.au-motion [data-au-reveal]:not(.is-in){opacity:0;transform:translate3d(0,28px,0)}
html.au-motion [data-au-reveal="fade"]:not(.is-in){transform:none}
html.au-motion [data-au-reveal="scale"]:not(.is-in){transform:scale(.94)}
html.au-motion [data-au-reveal="blur"]:not(.is-in){transform:translate3d(0,16px,0);filter:blur(10px)}
html.au-motion [data-au-reveal="left"]:not(.is-in){transform:translate3d(-36px,0,0)}
html.au-motion [data-au-reveal="right"]:not(.is-in){transform:translate3d(36px,0,0)}
@media (max-width:900px){html.au-motion [data-au-reveal="left"]:not(.is-in),html.au-motion [data-au-reveal="right"]:not(.is-in){transform:translate3d(0,28px,0)}}
/* INTRO (above-the-fold, CSS-only — needs no JS, starts at first paint, always ends visible).
   [data-au-intro="up|fade|scale"] + style="--au-delay:120ms";  headings: [data-au-intro-lines] > .au-line > .au-line-inner */
@keyframes au-intro{from{opacity:0;transform:translate3d(0,22px,0)}}
@keyframes au-intro-scale{from{opacity:0;transform:scale(.96)}}
@keyframes au-intro-fade{from{opacity:0}}
@keyframes au-intro-line{from{opacity:0;transform:translate3d(0,105%,0)}}
[data-au-intro-lines] .au-line:nth-child(2) .au-line-inner{--i:1}
[data-au-intro-lines] .au-line:nth-child(3) .au-line-inner{--i:2}
@media (prefers-reduced-motion:no-preference){
  [data-au-intro]{animation:au-intro .8s var(--au-ease-out) both;animation-delay:var(--au-delay,0ms)}
  [data-au-intro="scale"]{animation-name:au-intro-scale}
  [data-au-intro="fade"]{animation-name:au-intro-fade}
  [data-au-intro-lines] .au-line-inner{animation:au-intro-line .9s var(--au-ease-out) both;animation-delay:calc(var(--au-delay,0ms) + var(--i,0) * 90ms)}
  [data-au-intro-lines] .au-line-inner.au-gradient-text.is-flowing{animation:au-intro-line .9s var(--au-ease-out) both,au-flow 8s var(--au-ease-in-out) 1s infinite alternate;animation-delay:calc(var(--au-delay,0ms) + var(--i,0) * 90ms),1s}
}
/* elements already in the viewport when JS boots are shown instantly (no fade from nothing) */
html.au-motion .au-instant,html.au-motion .au-instant .au-line-inner{transition:none!important}

/* FAILSAFE (visible-by-default): if au-motion.js has not finished booting (html.au-ready) within 1.2s
   — slow network, JS error, blocked script — force every hidden element visible. Compositor-friendly. */
@keyframes au-failsafe{to{opacity:1;transform:none;filter:none}}
html.au-motion:not(.au-ready) [data-au-reveal]:not(.is-in),
html.au-motion:not(.au-ready) [data-au-lines]:not(.is-in) .au-line-inner{animation:au-failsafe .4s ease 1.2s forwards}
[data-au-magnetic]{transition:transform .5s var(--au-ease-out)}
[data-au-magnetic].is-magnet{transition:transform .15s linear}

/* v3.6: the ring/dot cursor follower was removed by request; only the backdrop spotlight (.au-spot) follows the pointer. */
.au-cursor{display:none!important}

/* ---------- Lite mode (html.au-lite, set by au-motion.js when measured fps < 28):
   pause INFINITE decorative loops only (JS), drop expensive blur. One-shot animations/reveals always complete. ---------- */
/* (looping animations only are paused by au-motion.js via the Web Animations API; one-shots always finish) */
html.au-lite .au-card,html.au-lite .au-float{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background-color:var(--au-surface-solid)}
html.au-lite .au-spot{display:none!important}

/* ---------- Reduced motion: everything visible, nothing loops ---------- */
@media (prefers-reduced-motion:reduce){
  .au-gradient-text.is-flowing,.au-marquee-track,.au-dot.is-live,.au-card--interactive::before,.au-card.is-lit::before{animation:none!important}
  .au-btn,.au-btn-arrow svg,.au-card--interactive,.au-link{transition-duration:.01ms!important}
  .au-spot{display:none!important}
  .au-marquee{overflow-x:auto}
}
@media (hover:none),(pointer:coarse){.au-spot{display:none!important}}
/* Touch / low-end: drop expensive backdrop blur on cards, keep the look with a denser fill */
html.au-coarse .au-card{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01)),var(--au-surface-solid)}
html.au-coarse[data-theme="light"] .au-card{background:var(--au-surface-solid)}

/* ==========================================================================
   v3.7 EFFECTS — opt-in futuristic primitives (see DESIGN-SYSTEM.md §10).
   All decorative: transform/opacity only, violet only, every gradient fades to 0,
   loops are `infinite` (paused by html.au-lite), nothing here hides content.
   ========================================================================== */

/* Animated film grain (backdrop). Steps → ~4 repaints/s of a tiny layer. */
.au-backdrop>.au-grain{inset:-80px;animation:au-grain 1.4s steps(5) infinite}
@keyframes au-grain{0%{transform:translate3d(0,0,0)}20%{transform:translate3d(-38px,22px,0)}40%{transform:translate3d(26px,-30px,0)}60%{transform:translate3d(-18px,-44px,0)}80%{transform:translate3d(42px,16px,0)}100%{transform:translate3d(0,0,0)}}

/* [data-au-decode] — scramble overlay (JS). The real text is only visibility-hidden for <1.3s. */
.is-decoding{position:relative}
.is-decoding>.au-decode-src{visibility:hidden}
.au-decode-fx{position:absolute;left:0;top:0;right:0;white-space:nowrap;pointer-events:none;font-variant-ligatures:none}
.au-gradient-text>.au-decode-fx{background:inherit;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

/* [data-au-sheen] — v3.7.3: NO sweep, NO scanlines (scan effects are banned). The injected .au-sheen layer is now a
   static, hover-only soft highlight from the top edge. Kept for backward compatibility with pages that opt in. */
.au-sheen{position:absolute;inset:0;z-index:2;border-radius:inherit;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .5s ease;
  background:radial-gradient(70% 55% at 50% 0%,rgba(183,164,255,.08),rgba(183,164,255,0) 100%)}
html[data-theme="light"] .au-sheen{background:radial-gradient(70% 55% at 50% 0%,rgba(91,59,208,.05),rgba(91,59,208,0) 100%)}
[data-au-sheen]:hover>.au-sheen{opacity:1}

/* .au-beam — v3.7.3: a static hairline divider that fades out at both ends (the travelling pulse was removed). */
.au-beam{position:relative;display:block;height:1px;width:100%;pointer-events:none;background:var(--au-line-strong);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
.au-beam::after{content:none}
.au-beam--v{width:1px;height:100%;-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}

/* .au-horizon > .au-horizon-floor — perspective grid floor scrolling towards the viewer.
   Place inside a positioned box; it fades to 0 on every side (radial mask), so no edge can show. */
.au-horizon{position:absolute;pointer-events:none;overflow:hidden;perspective:380px;perspective-origin:50% 0%;
  -webkit-mask-image:radial-gradient(50% 62% at 50% 34%,#000 0%,rgba(0,0,0,.55) 45%,transparent 74%);mask-image:radial-gradient(50% 62% at 50% 34%,#000 0%,rgba(0,0,0,.55) 45%,transparent 74%)}
.au-horizon-floor{position:absolute;left:-60%;right:-60%;top:0;height:260%;transform-origin:50% 0;transform:rotateX(66deg);
  --au-grid-line:rgba(160,140,255,.22);
  background-image:linear-gradient(var(--au-grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--au-grid-line) 1px,transparent 1px);background-size:40px 40px;background-position:50% 0;
  animation:au-floor 2.6s linear infinite;will-change:transform}
html[data-theme="light"] .au-horizon-floor{--au-grid-line:rgba(79,50,184,.16)}
.au-horizon::before{content:"";position:absolute;left:0;right:0;top:0;height:40%;z-index:1;
  background:radial-gradient(50% 40% at 50% 0%,rgba(139,108,255,.38),rgba(139,108,255,0) 100%)}
html[data-theme="light"] .au-horizon::before{background:radial-gradient(50% 40% at 50% 0%,rgba(91,59,208,.16),rgba(91,59,208,0) 100%)}
@keyframes au-floor{from{transform:rotateX(66deg) translate3d(0,-40px,0)}to{transform:rotateX(66deg) translate3d(0,0,0)}}

/* .au-hud-frame — corner brackets around a visual. */
.au-hud-frame{position:absolute;inset:0;pointer-events:none;--c:var(--au-accent-line);--l:22px;
  background:linear-gradient(var(--c),var(--c)) 0 0/var(--l) 1px,linear-gradient(var(--c),var(--c)) 0 0/1px var(--l),
  linear-gradient(var(--c),var(--c)) 100% 0/var(--l) 1px,linear-gradient(var(--c),var(--c)) 100% 0/1px var(--l),
  linear-gradient(var(--c),var(--c)) 0 100%/var(--l) 1px,linear-gradient(var(--c),var(--c)) 0 100%/1px var(--l),
  linear-gradient(var(--c),var(--c)) 100% 100%/var(--l) 1px,linear-gradient(var(--c),var(--c)) 100% 100%/1px var(--l);background-repeat:no-repeat}
/* .au-scanline — REMOVED in v3.7.3 (scan effects are banned); neutralised for pages that still emit it. */
.au-scanline,.au-scanline::before{display:none!important;animation:none!important}

/* .au-hud — live status micro-readout row (values come from data-au-clock / data-au-ttfb / data-au-live-count) */
.au-hud{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin:0;padding:0;list-style:none;color:var(--au-muted);font:500 13px/1.2 var(--au-font-label);letter-spacing:0}
.au-hud>li,.au-hud-item{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.au-hud b{color:var(--au-text-2);font-weight:600;font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}

/* [data-au-parallax] uses the individual `translate` property, so it composes with any transform/animation */
[data-au-parallax]{translate:0 var(--au-py,0px)}

@media (prefers-reduced-motion:reduce){
  .au-backdrop>.au-grain,.au-horizon-floor{animation:none!important}
  [data-au-parallax]{translate:none}
}
/* Form pages (v3.7): a beam travels along the card's top edge */
.au-form-card>.au-form-beam{position:absolute;top:-1px;left:10%;right:10%;width:auto;z-index:2}

/* v3.7.3 responsive: touch targets ≥40px */
@media (pointer:coarse),(max-width:1180px){
  .au-link{min-height:40px}
  .au-form-aside a{display:inline-flex;align-items:center;min-height:40px}
  .au-form-aside .au-btn{--au-btn-h:40px;width:40px}
}