/* base.css, the bar's rules, by build.sh */
@font-face{font-family:"ABC Favorit";font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/abc-favorit-light.woff2) format("woff2")}
@font-face{font-family:"Ed Nimpkish";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/EDNimpkish-Regular.ttf) format("truetype")}
@font-face{font-family:"Inter";font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
.barra,.mn{color-scheme:dark;
  
  --fondo:oklch(0% 0 0);--fondo-2:oklch(9% 0 0);--piano:oklch(12.5% 0 0);--piano-2:oklch(16% 0 0);--piano-3:oklch(20% 0 0);
  --riga:oklch(100% 0 0/.1);--riga-2:oklch(100% 0 0/.18);
  --ink:oklch(100% 0 0);--ink-2:oklch(100% 0 0/.74);--ink-3:oklch(100% 0 0/.54);--spento:oklch(100% 0 0/.34);
  
  --blu:oklch(100% 0 0);--blu-su:oklch(88% 0 0);--blu-t:oklch(92% 0 0);--blu-velo:oklch(100% 0 0/.1);--su-blu:oklch(0% 0 0);
  
  --ok:oklch(76% .15 155);--att:oklch(80% .13 78);
  --ombra-forte:oklch(0% 0 0/.8);
  
  --dim:var(--ink-2);--mute:var(--ink-3);--line:var(--riga);--line-2:var(--riga-2);}
.giorno,.sul-giorno{color-scheme:light;
  --fondo:oklch(100% 0 0);--fondo-2:oklch(100% 0 0);--piano:oklch(96% 0 0);--piano-2:oklch(93% 0 0);--piano-3:oklch(89% 0 0);
  --riga:oklch(0% 0 0/.08);--riga-2:oklch(0% 0 0/.16);
  --ink:oklch(0% 0 0);--ink-2:oklch(0% 0 0/.72);--ink-3:oklch(0% 0 0/.52);--spento:oklch(0% 0 0/.26);
  --blu:oklch(12% 0 0);--blu-su:oklch(30% 0 0);--blu-t:oklch(22% 0 0);--blu-velo:oklch(0% 0 0/.06);--su-blu:oklch(100% 0 0);
  --ok:oklch(50% .14 155);--att:oklch(56% .14 65);
  --ombra-forte:oklch(0% 0 0/.18);
  --dim:var(--ink-2);--mute:var(--ink-3);--line:var(--riga);--line-2:var(--riga-2);}
.giorno{background:var(--fondo);color:var(--ink)}
.sul-giorno{color:var(--ink)}
.barra,.mn{--font:"Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
  
  --serif:"ABC Favorit","Helvetica Neue",Helvetica,Arial,sans-serif;
  --accent:"Ed Nimpkish","Helvetica Neue",Helvetica,Arial,sans-serif;
  --barra-h:60px;--largo:1200px;--gutter:clamp(16px,4vw,40px);
  --sez:clamp(120px,11vw,184px);   
  
  --px:1px;
  
  --t-h2:32px;--t-h3:26px;--t-lead:20px;--t-corpo:16px;--t-lista:17px;--t-nota:14.5px;
  --e-esce:cubic-bezier(.16,1,.3,1);--e-molla:cubic-bezier(.34,1.56,.64,1);--e-ui:cubic-bezier(.4,0,.6,1);
  --e-out:var(--e-esce);--e:var(--e-esce);
  
  
  --vetro-sfoca:none;
  
  --track:-.04em;}
@media (min-width:900px){.barra,.mn{--px:clamp(.8px,100vw / 1440,1.3px);--t-h2:calc(50 * var(--px));--t-h3:calc(36 * var(--px));--t-lead:calc(22 * var(--px));--t-corpo:calc(16.5 * var(--px));--t-lista:calc(18 * var(--px));--t-nota:calc(14.5 * var(--px))}}
.barra .giro{width:min(var(--largo),100% - 2 * var(--gutter));margin-inline:auto}
.barra{position:fixed;inset:0 0 auto;z-index:100;display:flex;flex-direction:column;align-items:center;padding-top:0;pointer-events:none;transition:padding .5s var(--e-esce)}
.barra .giro{pointer-events:auto;height:var(--barra-h);display:flex;align-items:center;gap:24px;padding:0;border-radius:999px;background:oklch(100% 0 0/0);transition:width .7s var(--e-molla),height .5s var(--e-esce),padding .5s var(--e-esce),background-color .35s var(--e-ui),box-shadow .35s var(--e-ui),-webkit-backdrop-filter .35s var(--e-ui),backdrop-filter .35s var(--e-ui)}
.barra.piena{padding-top:12px}
.barra.piena .giro{width:min(860px,100% - 24px);height:54px;padding:0 7px 0 22px;border-radius:27px;background:oklch(12% 0 0/.94);-webkit-backdrop-filter:var(--vetro-sfoca);backdrop-filter:var(--vetro-sfoca);box-shadow:inset 0 1px 0 oklch(100% 0 0/.2),inset 0 0 0 1px oklch(100% 0 0/.1),0 20px 50px -20px oklch(0% 0 0/.8)}
.barra.piena.sul-giorno .giro{background:oklch(100% 0 0/.95);box-shadow:inset 0 1px 0 oklch(100% 0 0/.9),0 0 0 1px oklch(0% 0 0/.08),0 18px 50px -20px oklch(0% 0 0/.25)}
.barra.with-tabs .giro{width:min(1240px,100% - 24px)}
.barra.with-tabs .giro{border-radius:27px 27px 0 0}
.barra .marchio{display:inline-flex;align-items:center;gap:8px;padding-block:10px;white-space:nowrap;line-height:1;color:var(--ink)}
.barra .marchio svg{height:calc(19 * var(--px));width:auto;aspect-ratio:935.42/132;fill:currentColor;stroke:none;overflow:visible}
.barra nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.barra nav a[data-voce]{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font-size:calc(14 * var(--px));color:var(--ink-2);border-radius:999px;transition:color .2s}
@media (hover:hover){.barra nav a[data-voce]:hover{color:var(--ink)}}
@media (max-width:760px){.barra nav a[data-voce]{display:none}.barra.piena .giro{padding-left:18px}}
/* next-bar: the site's bar and phone menu on /scale, /b2b and /b2c, the website's Next pages of 2026-09-09 (next-pages/README.md).
   Those pages cannot load base.css: its reset, its night on :root and its body type would restyle the old page under the bar.
   So build.sh writes, ABOVE these lines in the shipped copy, base.css's own rules for the bar (its fonts, its tokens moved from
   :root onto .barra and .mn, every .barra, .marchio and .giro rule, the day of .giorno and .sul-giorno), read from base.css at
   every build so the bar here is the bar everywhere. Below is only what base.css gives the whole page and the bar leans on,
   scoped to the bar and the menu, at no specificity (:where) so the bar's and the menu's own rules win over it. */
:where(.barra,.mn){font-family:var(--font);font-weight:400;font-size:calc(17 * var(--px));line-height:1.5;letter-spacing:normal;text-align:left;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
:where(.barra,.mn) :where(*,*::before,*::after){box-sizing:border-box}
:where(.barra,.mn) :where(a){color:inherit;text-decoration:none;transition:none;-webkit-tap-highlight-color:transparent}
:where(.barra,.mn) :where(svg){display:block;max-width:100%}
:where(.barra,.mn) :where(button){font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
:where(.mn) :where(h2,p,ul){margin:0}
:where(.barra,.mn) :where(:focus-visible){outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}