@import url("fonts.css");

:root {
  color-scheme: dark;
  --bg: #0a0c0e;
  --card: #13171b;
  --card2: #1c2228;
  --surface-0: var(--bg);
  --surface-1: #101418;
  --surface-2: var(--card);
  --surface-3: var(--card2);
  --surface-4: #262e36;
  --border: #35404a;
  --border-subtle: #252d35;
  --border-strong: #64717d;
  --accent: #ccff00;
  --accent-hover: #ddff57;
  --accent-muted: #242e12;
  --accent-glow: rgba(204,255,0,.14);
  --txt: #f4f6f8;
  --dim: #b0bbc5;
  --ok: #a5dd75;
  --warn: #ffd16b;
  --bad: #ff8b8b;
  --blue: #9ac4ff;
  --info: var(--blue);
  --font-body: 'Barlow', system-ui, -apple-system, sans-serif;
  --font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --mono: 'Barlow', ui-monospace, monospace;
  --text-xs: .75rem;
  --text-sm: .875rem;
  --text-base: clamp(.9375rem, .89rem + .12vw, 1rem);
  --text-lg: clamp(1.125rem, 1rem + .35vw, 1.375rem);
  --text-title: clamp(1.75rem, 1.25rem + 1.15vw, 2.5rem);
  --text-metric: clamp(1.75rem, 1.5rem + .6vw, 2.25rem);
  --space-1: 4px; --space-2: 8px; --space-3: 12px;
  --space-4: 16px; --space-6: 24px; --space-8: 32px; --space-12: 48px;
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 16px; --radius-xl: 24px;
  --shadow-card: 0 4px 18px #00000018;
  --shadow-float: 0 16px 48px #00000066;
  --duration-fast: 150ms; --duration-base: 200ms; --duration-slow: 250ms;
  --ease-out: cubic-bezier(.2,.7,.2,1);
  --z-sticky: 10; --z-nav: 90; --z-login: 100; --z-modal: 260; --z-toast: 300;
}
/* Shared brand layer. Existing per-page layout, IDs and behaviors retained. */
:root { --lime:var(--accent); --acc:var(--accent); --line:var(--border); --panel:var(--card); --panel2:var(--card2); --field:var(--surface-1); --muted:var(--dim); --fg:var(--txt); --lime-soft:var(--accent-muted); }
body { font-family:var(--font-body); color:var(--txt); background-color:var(--bg); }
button, input, select, textarea { font-family:var(--font-body); }
* { scrollbar-width:thin; scrollbar-color:#64717d var(--surface-1); }
:focus-visible { outline:2px solid var(--accent) !important; outline-offset:4px; }
input:focus-visible, textarea:focus-visible, select:focus-visible { box-shadow:0 0 0 4px var(--accent-glow); }
::selection { background:var(--accent); color:#111; }
a { text-underline-offset:3px; }
button, .btn, a.dl { min-height:44px; min-width:44px; transition:background-color 150ms, border-color 150ms, color 150ms; }
input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]), select, textarea { min-height:44px; max-width:100%; border-color:var(--border-strong); background:var(--surface-1); color:var(--txt); }
input::placeholder, textarea::placeholder { color:var(--dim); opacity:1; }
input[type=checkbox], input[type=radio] { accent-color:var(--accent); }
label:has(input[type=checkbox]), label:has(input[type=radio]) { min-height:44px; }
.card, .panel, .box { border-color:var(--border); border-radius:var(--radius-lg); }
.foot { color:var(--dim); font-size:.75rem; letter-spacing:.12em; line-height:1.6; }
.eyebrow { color:var(--dim); font-size:.75rem; letter-spacing:.18em; }
.err { color:var(--bad); font-size:.9375rem; }
.ui-table-scroll { max-width:100%; overflow:auto; border:1px solid var(--border-subtle); border-radius:8px; }
.ui-table-scroll table { border-collapse:separate; border-spacing:0; font-variant-numeric:tabular-nums; }
.ui-table-scroll th { background:var(--surface-3); color:var(--dim); }
.ui-table-scroll td { background:var(--card); }
.ui-table-scroll tr:nth-child(even) td { background:#171c21; }
.ui-table-scroll th:first-child, .ui-table-scroll td:first-child { position:sticky; left:0; z-index:1; }
.ui-page-login body, .ui-page-openday body, .ui-page-registrazione body, .ui-page-nfc body, .ui-page-tablet body { background-image:radial-gradient(ellipse at 15% 0%,#ccff0013,transparent 55%),repeating-linear-gradient(125deg,transparent 0 140px,#ffffff03 140px 141px); }
.ui-page-login .panel, .ui-page-openday .card, .ui-page-registrazione .card, .ui-page-nfc .card, .ui-page-tablet .card { border-radius:24px; box-shadow:0 24px 80px #0005; border-color:var(--border); }
.ui-page-login .panel::before, .ui-page-openday .card::before, .ui-page-registrazione .card::before, .ui-page-nfc .card::before, .ui-page-tablet .card::before { background:var(--accent); height:3px; left:24px; right:70%; }
.ui-page-login .title { font-family:var(--font-display); font-size:clamp(2rem,5vw,3rem); letter-spacing:.02em; line-height:1.1; }
.ui-page-login .panel { padding:clamp(28px,5vw,48px); }
.ui-page-login .name, .ui-page-tablet .name { font-weight:700; }
.ui-page-login .logos, .ui-page-tablet .logos { margin-bottom:28px; }
.ui-page-login .pin-form input { min-width:0; }
.ui-page-login .st-btn, .ui-page-tablet .st-btn { border-radius:12px; min-height:72px; background:var(--surface-1); border-color:var(--border-strong); }
.ui-page-tablet .big-btn { animation:none; border-radius:12px; letter-spacing:.1em; }
.ui-page-tablet .station { background:var(--card); backdrop-filter:none; border-color:var(--border); font-size:.9375rem; }
.ui-page-tablet .station a { min-height:44px; display:inline-flex; align-items:center; font-size:.875rem; }
.ui-page-tablet .sub { font-size:clamp(1.125rem,2.2vw,1.375rem); }
.ui-page-tablet .eyebrow { font-size:.875rem; }
.ui-page-tablet .next-chip .k, .ui-page-tablet .st-btn .off { font-size:.8125rem; letter-spacing:.1em; }
.ui-page-openday .page { max-width:1040px; }
.ui-page-openday .card { padding:clamp(24px,4vw,48px); }
.ui-page-openday h1 { font-size:clamp(2.5rem,5vw,3.75rem); letter-spacing:.01em; }
.ui-page-openday .sub { font-size:1rem; max-width:66ch; }
.ui-page-openday label, .ui-page-registrazione .field label { font-size:.75rem; letter-spacing:.09em; line-height:1.4; }
.ui-page-openday .course-chip { border-radius:10px; background:var(--surface-1); font-size:1.5rem; letter-spacing:.06em; }
.ui-page-openday .course-chip.sel { background:var(--accent-muted); box-shadow:inset 0 -2px var(--accent); }
.ui-page-openday button.cta, .ui-page-registrazione .cta { border-radius:10px; min-height:56px; letter-spacing:.09em; }
.ui-page-registrazione h1 { font-family:var(--font-display); font-size:clamp(2.25rem,5vw,3.5rem); line-height:1.05; }
.ui-page-registrazione .offer { border-color:var(--border); background:var(--surface-1); }
.ui-page-registrazione .offer-course { font-family:var(--font-display); font-size:2rem; }
.ui-page-registrazione .offer-price .num { font-family:var(--font-display); font-size:3rem; font-variant-numeric:tabular-nums; }
.ui-page-registrazione .sec-title { font-size:.8125rem; letter-spacing:.1em; }
.ui-page-registrazione .pay-card { background:var(--surface-1); border-radius:10px; padding:18px; }
.ui-page-registrazione .pay-card:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
.ui-page-registrazione .field .hint, .ui-page-registrazione .pay-card span, .ui-page-registrazione .note { font-size:.8125rem; }
.ui-page-nfc h1 { font-family:var(--font-display); font-size:2rem; letter-spacing:.06em; }
.ui-page-nfc .status { background:var(--surface-1); border-radius:10px; }
.ui-page-guida-criteri body { line-height:1.7; }
.ui-page-guida-criteri .wrap { max-width:1040px; padding:32px 24px 64px; }
.ui-page-guida-criteri h1 { font:700 clamp(2rem,4vw,3rem)/1.1 var(--font-display); }
.ui-page-guida-criteri h2 { font:600 1.5rem/1.3 var(--font-display); color:var(--txt); padding-bottom:12px; margin-top:36px; }
.ui-page-guida-criteri h3 { font-size:1.125rem; }
.ui-page-guida-criteri .formula { padding:20px; background:var(--surface-1); }
.ui-page-guida-criteri table { font-size:.9375rem; min-width:520px; margin:0; }
.ui-page-guida-criteri th, .ui-page-guida-criteri td { padding:12px; }
.ui-page-guida-criteri .toolbar { flex-wrap:wrap; }
.ui-page-guida-criteri .ui-table-scroll { margin:16px 0; }
.ui-page-trackmap #topbar, .ui-page-trackbuilder header { padding:12px 16px; background:var(--surface-1); gap:12px; }
.ui-page-trackmap #topbar h1, .ui-page-trackbuilder header h1 { font:700 1.25rem/1.2 var(--font-display); letter-spacing:.06em; }
.ui-page-trackmap #side { flex-basis:300px; padding:12px; gap:12px; }
.ui-page-trackmap .box { padding:14px; background:var(--surface-1); border-radius:10px; }
.ui-page-trackmap .box h3, .ui-page-trackbuilder .step h2 { font:600 1rem/1.2 var(--font-display); letter-spacing:.065em; }
.ui-page-trackmap .box button, .ui-page-trackmap .box select, .ui-page-trackbuilder button { font-size:.8125rem; }
.ui-page-trackmap .mono { font-family:var(--font-display); font-variant-numeric:tabular-nums; }
.ui-page-trackmap .map-item { flex-wrap:wrap; gap:8px; padding:8px 0; font-size:.8125rem; }
.ui-page-trackmap .lap-chip, .ui-page-trackmap .live-st { min-height:44px; font-size:.8125rem; }
.ui-page-trackmap #map-hint, .ui-page-trackbuilder #msg { font-size:.75rem; background:var(--surface-1); border:1px solid var(--border); padding:8px 12px; }
.ui-page-trackmap #topbar { flex-wrap:wrap; }
.ui-page-trackmap #tm-select { min-width:0; }
.ui-page-trackmap #side, .ui-page-trackbuilder aside { scrollbar-gutter:stable; }
.ui-page-trackbuilder aside { padding:16px; gap:20px; }
.ui-page-trackbuilder .step { padding-bottom:16px; border-bottom:1px solid var(--border-subtle); }
.ui-page-trackbuilder .step p.help, .ui-page-trackbuilder label.fld { font-size:.8125rem; line-height:1.6; }
.ui-page-trackbuilder .stats { font-size:.875rem; padding:12px; border-radius:10px; }
.ui-page-presentazione .bg-aurora { opacity:.35; animation:none; }
.ui-page-presentazione .speedlines { animation:none; opacity:.035; }
.ui-page-presentazione body::before, .ui-page-presentazione .prova-chip .v { animation:none; }
.ui-page-presentazione .step, .ui-page-presentazione .criteria, .ui-page-presentazione .prova-chip { background:var(--card); border-color:var(--border); }
.ui-page-presentazione .step .n { opacity:1; color:var(--accent); }
@media (hover:hover) {
 button:hover:not(:disabled), .btn:hover, a.dl:hover { border-color:var(--accent); }
 .ui-page-openday button.cta:hover, .ui-page-tablet .big-btn:hover { background:var(--accent-hover); }
}
@media (max-width:767px) {
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]), select, textarea { font-size:16px; }
 .ui-page-login body, .ui-page-openday body, .ui-page-registrazione body, .ui-page-nfc body, .ui-page-tablet body { padding:24px 12px; }
 .ui-page-login .panel, .ui-page-openday .card, .ui-page-registrazione .card, .ui-page-nfc .card, .ui-page-tablet .card { padding:28px 20px; border-radius:16px; }
 .ui-page-tablet .station { position:static; margin:0 0 20px; align-self:flex-start; flex-wrap:wrap; }
 .ui-page-tablet body { flex-direction:column; }
 .ui-page-openday .row2, .ui-page-openday .row3 { grid-template-columns:minmax(0,1fr); }
 .ui-page-openday .course-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .ui-page-registrazione .grid2, .ui-page-registrazione .pay-grid { grid-template-columns:minmax(0,1fr); }
 .ui-page-registrazione .offer-head { flex-wrap:wrap; gap:16px; }
 .ui-page-registrazione .summary .row { flex-wrap:wrap; gap:8px; }
 .ui-page-registrazione .summary .row b { overflow-wrap:anywhere; }
 .ui-page-guida-criteri .wrap { padding:24px 16px 48px; }
 .ui-page-guida-criteri .tag { white-space:normal; }
 .ui-page-trackmap body:not(.embed) #main { flex-direction:column; overflow-y:auto; }
 .ui-page-trackmap body:not(.embed) #stage { order:1; height:48dvh; flex:0 0 auto; min-height:280px; }
 .ui-page-trackmap body:not(.embed) #side { order:2; flex:none; width:100%; max-height:none; overflow:visible; }
 .ui-page-trackmap #topbar a { min-height:44px; display:inline-flex; align-items:center; }
 .ui-page-trackmap #tm-select { flex-basis:100%; margin:0; }
 .ui-page-trackbuilder body { height:100dvh; }
 .ui-page-trackbuilder header .sub { font-size:.75rem; }
 .ui-page-trackbuilder main { flex-direction:column; overflow:auto; }
 .ui-page-trackbuilder aside { order:2; width:100%; min-width:0; flex:none; overflow:visible; border-right:0; }
 .ui-page-trackbuilder .canvas-wrap { order:1; min-height:320px; height:48dvh; flex:none; }
 .ui-page-trackbuilder .legend { max-width:70%; }
 .ui-page-presentazione, .ui-page-presentazione body { height:auto; min-height:100%; overflow:auto; }
 .ui-page-presentazione body { padding:24px 16px; display:block; cursor:auto; }
 .ui-page-presentazione header { flex-wrap:wrap; gap:20px; }
 .ui-page-presentazione .logos .mechit { height:34px; }
 .ui-page-presentazione .logos .academy { height:26px; }
 .ui-page-presentazione .title { min-width:160px; padding-left:16px; }
 .ui-page-presentazione h1 { font-size:2.25rem; }
 .ui-page-presentazione .eyebrow { font-size:.75rem; }
 .ui-page-presentazione .prova-chip { width:100%; padding:16px; }
 .ui-page-presentazione .prova-chip .k { font-size:.75rem; }
 .ui-page-presentazione .prova-chip .v { font-size:2rem; }
 .ui-page-presentazione .prova-chip .d { font-size:.9375rem; }
 .ui-page-presentazione main { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; margin:24px 0; }
 .ui-page-presentazione .steps { gap:12px; }
 .ui-page-presentazione .step { padding:16px; gap:16px; }
 .ui-page-presentazione .step .n { font-size:2.5rem; }
 .ui-page-presentazione .step h2, .ui-page-presentazione .step h3 { font-size:1.375rem; }
 .ui-page-presentazione .step p { font-size:.9375rem; }
 .ui-page-presentazione .panel-label { font-size:.8125rem; margin-bottom:12px; }
 .ui-page-presentazione footer { margin-top:24px; }
}
@media (prefers-reduced-motion:reduce) {
 *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
@media print {
 .ui-page-guida-criteri body { background:white; color:black; }
 .ui-page-guida-criteri .ui-table-scroll { overflow:visible; border:0; }
 .ui-page-guida-criteri .ui-table-scroll td, .ui-page-guida-criteri .ui-table-scroll th { background:white; color:black; position:static; }
}
.ui-page-presentazione .crit { background:var(--card); }
.ui-page-presentazione .scale .ends span b { color:var(--dim); }
.ui-page-presentazione .scale .ends span.hi b { color:var(--accent); }
@media (max-width:767px) {
 .ui-page-presentazione .crits { grid-template-columns:minmax(0,1fr); grid-template-rows:auto; gap:12px; }
 .ui-page-presentazione .crit { padding:20px; }
 .ui-page-presentazione .crit h3 { font-size:1.5rem; }
 .ui-page-presentazione .crit p { font-size:.9375rem; }
 .ui-page-presentazione .scale .ends span { font-size:.875rem; }
 .ui-page-presentazione .scale .ends span b { font-size:.75rem; }
 .ui-page-presentazione footer { flex-wrap:wrap; gap:16px; padding:20px; }
 .ui-page-presentazione .vote { font-size:2.5rem; }
 .ui-page-presentazione .vote small { font-size:.75rem; }
 .ui-page-presentazione .ticker { flex-basis:100%; min-height:120px; }
 .ui-page-presentazione .ticker .msg { font-size:1rem; flex-wrap:wrap; align-content:center; }
}