/* =====================================================================
   WR English School - tema black per adulti
   ===================================================================== */
:root {
  --wre-bg: #0A0A0B;
  --wre-bg-2: #0F0F11;
  --wre-card: #141416;
  --wre-card-2: #1A1A1D;
  --wre-line: #26262B;
  --wre-line-2: #34343B;
  --wre-text: #EDEDEF;
  --wre-muted: #8A8A93;
  --wre-acid: #C6FF3D;      /* giusto, azioni principali */
  --wre-acid-ink: #0A0A0B;
  --wre-en: #3DD9FF;        /* testo inglese */
  --wre-red: #FF5A5F;       /* errore, falsa certezza */
  --wre-amber: #FFB23D;     /* "credo" */
  --wre-radius: 18px;
  --wre-font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wre-display: "Bricolage Grotesque", "Inter", sans-serif;
  --wre-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
}

html { scroll-behavior: smooth; }
body.wre {
  background: var(--wre-bg);
  color: var(--wre-text);
  font-family: var(--wre-font);
  font-size: 1.02rem;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  overflow-x: hidden;
}
/* Grana + griglia leggera sullo sfondo */
body.wre::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(198,255,61,.10), transparent 60%),
    radial-gradient(700px 500px at -10% 30%, rgba(61,217,255,.07), transparent 60%),
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px) 0 0 / 56px 56px,
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px) 0 0 / 56px 56px;
}
::selection { background: var(--wre-acid); color: var(--wre-acid-ink); }
a { color: var(--wre-acid); text-decoration: none; }
a:hover { color: #E2FF9A; }
.text-muted, .wre-muted { color: var(--wre-muted) !important; }
.en { color: var(--wre-en); font-weight: 600; }
.mono { font-family: var(--wre-mono); }
h1, h2, h3, .wre-display { font-family: var(--wre-display); font-weight: 800; letter-spacing: -.02em; }

/* ----------------------------- barra ----------------------------- */
.wre-nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(10,10,11,.72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--wre-line);
}
.wre-nav .navbar-brand { font-family: var(--wre-display); font-weight: 800; color: var(--wre-text); display: flex; align-items: center; gap: .6rem; }
.wre-nav .navbar-brand small { font-family: var(--wre-mono); font-size: .66rem; color: var(--wre-muted); font-weight: 500; letter-spacing: .08em; }
.wre-logo { width: 34px; height: 34px; border-radius: 10px; background: var(--wre-acid); display: grid; place-items: center; color: var(--wre-acid-ink); font-family: var(--wre-mono); font-weight: 800; font-size: .8rem; }
.wre-nav .nav-link { color: var(--wre-muted); font-weight: 500; }
.wre-nav .nav-link:hover, .wre-nav .nav-link.active { color: var(--wre-text); }
.wre-nav .navbar-toggler { border-color: var(--wre-line-2); }
.wre-nav .navbar-toggler-icon { filter: invert(1); }

/* ----------------------------- pulsanti ----------------------------- */
.btn-wre {
  --bs-btn-padding-y: .8rem; --bs-btn-padding-x: 1.4rem;
  background: var(--wre-acid); color: var(--wre-acid-ink); border: 0; border-radius: 999px;
  font-weight: 700; letter-spacing: -.01em; transition: transform .15s ease, box-shadow .2s ease;
}
.btn-wre:hover, .btn-wre:focus-visible { background: #D6FF6E; color: var(--wre-acid-ink); transform: translateY(-1px); box-shadow: 0 10px 30px -10px rgba(198,255,61,.6); }
.btn-wre:active { transform: translateY(1px); }
.btn-wre-ghost {
  --bs-btn-padding-y: .8rem; --bs-btn-padding-x: 1.4rem;
  background: transparent; color: var(--wre-text); border: 1px solid var(--wre-line-2); border-radius: 999px; font-weight: 600;
}
.btn-wre-ghost:hover, .btn-wre-ghost:focus-visible { border-color: var(--wre-text); color: var(--wre-text); background: rgba(255,255,255,.04); }
.btn-wre-sm { --bs-btn-padding-y: .45rem; --bs-btn-padding-x: .95rem; font-size: .9rem; }
.btn-voce { display: inline-flex; align-items: center; gap: .45rem; }
.btn-voce[aria-pressed="false"] { opacity: .55; }
:focus-visible { outline: 2px solid var(--wre-acid); outline-offset: 3px; }

/* ----------------------------- hero ----------------------------- */
.wre-hero { padding: clamp(3rem, 8vw, 7rem) 0 clamp(3rem, 6vw, 5rem); }
.wre-eyebrow { font-family: var(--wre-mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--wre-muted); display: inline-flex; gap: .6rem; align-items: center; }
.wre-eyebrow .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--wre-acid); box-shadow: 0 0 0 4px rgba(198,255,61,.15); animation: wre-pulse 2s infinite; }
.wre-hero h1 { font-size: clamp(2.8rem, 7.2vw, 6rem); line-height: .95; margin: 1.2rem 0 1.4rem; }
.wre-hero h1 em { font-style: normal; color: var(--wre-acid); position: relative; white-space: nowrap; }
.wre-hero h1 em::after { content: ""; position: absolute; left: 0; right: 0; bottom: .05em; height: .08em; background: var(--wre-acid); transform-origin: left; animation: wre-sottolinea 1.1s .4s cubic-bezier(.7,0,.2,1) both; }
.wre-hero .lead { color: #C9C9CF; font-size: 1.2rem; max-width: 36rem; }
.wre-hero-note { font-size: .88rem; color: var(--wre-muted); margin-top: 1rem; }

/* Pannello HUD di Winston nell'hero */
.wre-hud { background: linear-gradient(180deg, var(--wre-card-2), var(--wre-card)); border: 1px solid var(--wre-line); border-radius: 26px; padding: 1.4rem; position: relative; overflow: hidden; box-shadow: 0 40px 80px -40px rgba(0,0,0,.9); }
.wre-hud::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 0 50%, rgba(255,255,255,.015) 50% 100%) 0 0 / 100% 4px; pointer-events: none; }
.wre-hud-top { display: flex; align-items: center; gap: .9rem; margin-bottom: 1.2rem; }
.wre-hud-top .nome { font-weight: 700; }
.wre-hud-top .stato { font-family: var(--wre-mono); font-size: .72rem; color: var(--wre-acid); }
.wre-winston { width: 64px; height: 64px; flex: none; }
.wre-bubble { background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-radius: 16px 16px 16px 4px; padding: .9rem 1rem; font-size: .95rem; margin-bottom: 1.1rem; min-height: 3.4rem; }
.wre-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.wre-stat { background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-radius: 14px; padding: .8rem; }
.wre-stat .v { font-family: var(--wre-mono); font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.wre-stat .l { font-size: .72rem; color: var(--wre-muted); text-transform: uppercase; letter-spacing: .08em; }
.wre-meter { height: 8px; border-radius: 99px; background: var(--wre-line); overflow: hidden; margin-top: .45rem; }
.wre-meter > i { display: block; height: 100%; width: 0; background: var(--wre-acid); border-radius: inherit; transition: width 1.2s cubic-bezier(.2,.8,.2,1); }

/* ----------------------------- sezioni ----------------------------- */
.wre-section { padding: clamp(3.5rem, 8vw, 6.5rem) 0; border-top: 1px solid var(--wre-line); }
.wre-section h2 { font-size: clamp(2rem, 4.4vw, 3.4rem); line-height: 1; margin-bottom: 1rem; }
.wre-section .sub { color: var(--wre-muted); font-size: 1.1rem; max-width: 40rem; }
.wre-kicker { font-family: var(--wre-mono); color: var(--wre-acid); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: .8rem; display: block; }

.wre-manifesto { font-family: var(--wre-display); font-weight: 700; font-size: clamp(1.6rem, 3.6vw, 2.8rem); line-height: 1.12; letter-spacing: -.02em; max-width: 58rem; }
.wre-manifesto s { color: var(--wre-muted); text-decoration-color: var(--wre-red); text-decoration-thickness: 3px; }

.wre-card { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.6rem; height: 100%; transition: border-color .2s ease, transform .2s ease; }
.wre-card:hover { border-color: var(--wre-line-2); transform: translateY(-3px); }
.wre-card .num { font-family: var(--wre-mono); color: var(--wre-muted); font-size: .8rem; }
.wre-card h3 { font-size: 1.45rem; margin: .8rem 0 .6rem; }
.wre-card p { color: #B8B8C0; margin: 0; }
.wre-card .chip { display: inline-block; margin-top: 1rem; font-family: var(--wre-mono); font-size: .75rem; border: 1px solid var(--wre-line-2); border-radius: 99px; padding: .25rem .65rem; color: var(--wre-muted); }

/* Scommesse di sicurezza */
.wre-bet { display: flex; gap: .5rem; flex-wrap: wrap; }
.wre-bet-tag { font-family: var(--wre-mono); font-size: .78rem; padding: .3rem .6rem; border-radius: 8px; border: 1px solid var(--wre-line-2); }
.wre-bet-tag.s { color: var(--wre-acid); border-color: rgba(198,255,61,.35); }
.wre-bet-tag.c { color: var(--wre-amber); border-color: rgba(255,178,61,.35); }
.wre-bet-tag.i { color: var(--wre-muted); }

/* ----------------------------- livelli (linea) ----------------------------- */
.wre-linea { position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; margin-top: 3rem; }
.wre-linea::before { content: ""; position: absolute; left: 3%; right: 3%; top: 27px; height: 6px; border-radius: 6px; background: linear-gradient(90deg, #C6FF3D, #7CFFB2, #3DD9FF, #8C7CFF, #FF7CE0, #FFB23D); opacity: .9; }
.wre-fermata { position: relative; text-align: left; }
.wre-fermata .pallino { width: 60px; height: 60px; border-radius: 50%; background: var(--wre-bg); border: 6px solid var(--c, var(--wre-acid)); display: grid; place-items: center; font-family: var(--wre-mono); font-weight: 800; position: relative; z-index: 1; transition: transform .2s ease; }
.wre-fermata:hover .pallino { transform: scale(1.08); }
.wre-fermata h4 { font-family: var(--wre-display); font-weight: 800; font-size: 1.1rem; margin: 1rem 0 .2rem; }
.wre-fermata .cefr { font-family: var(--wre-mono); font-size: .72rem; color: var(--wre-muted); }
.wre-fermata p { font-size: .9rem; color: #B8B8C0; margin: .5rem 0; }
.wre-fermata .boss { font-family: var(--wre-mono); font-size: .72rem; color: var(--c, var(--wre-acid)); }
@media (max-width: 991.98px) {
  .wre-linea { grid-template-columns: 1fr; gap: 1.4rem; }
  .wre-linea::before { left: 27px; right: auto; top: 0; bottom: 0; width: 6px; height: auto; background: linear-gradient(180deg, #C6FF3D, #7CFFB2, #3DD9FF, #8C7CFF, #FF7CE0, #FFB23D); }
  .wre-fermata { display: grid; grid-template-columns: 60px 1fr; column-gap: 1.1rem; }
  .wre-fermata .pallino { grid-row: span 4; }
  .wre-fermata h4 { margin-top: .2rem; }
}

/* ----------------------------- round di prova ----------------------------- */
.wre-arena { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 26px; overflow: hidden; }
.wre-arena-bar { display: flex; flex-wrap: wrap; gap: 1rem 1.6rem; align-items: center; padding: 1rem 1.4rem; border-bottom: 1px solid var(--wre-line); background: var(--wre-bg-2); font-family: var(--wre-mono); font-size: .82rem; color: var(--wre-muted); }
.wre-arena-bar b { color: var(--wre-text); font-weight: 700; }
.wre-arena-bar .presa b { color: var(--wre-red); }
.wre-arena-body { padding: clamp(1.4rem, 4vw, 2.6rem); min-height: 420px; }
.wre-q-tipo { font-family: var(--wre-mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--wre-muted); }
.wre-q-consegna { color: #C9C9CF; margin: .4rem 0 1rem; }
.wre-q-testo { font-family: var(--wre-display); font-weight: 700; font-size: clamp(1.6rem, 3.6vw, 2.4rem); letter-spacing: -.01em; margin-bottom: 1.4rem; line-height: 1.15; }
.wre-q-testo .buco { display: inline-block; min-width: 3.2em; border-bottom: 3px dashed var(--wre-line-2); color: var(--wre-acid); text-align: center; }
.wre-opzioni { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.wre-opz { text-align: left; background: var(--wre-bg-2); border: 1px solid var(--wre-line-2); color: var(--wre-text); border-radius: 14px; padding: 1rem 1.1rem; font-weight: 600; font-size: 1.05rem; transition: border-color .15s ease, background .15s ease, transform .1s ease; }
.wre-opz:hover:not(:disabled) { border-color: var(--wre-text); }
.wre-opz:active:not(:disabled) { transform: scale(.98); }
.wre-opz .k { font-family: var(--wre-mono); font-size: .75rem; color: var(--wre-muted); margin-right: .6rem; }
.wre-opz.scelta { border-color: var(--wre-en); background: rgba(61,217,255,.08); }
.wre-opz.giusta { border-color: var(--wre-acid); background: rgba(198,255,61,.12); }
.wre-opz.sbagliata { border-color: var(--wre-red); background: rgba(255,90,95,.12); }
.wre-input { background: var(--wre-bg-2) !important; border: 1px solid var(--wre-line-2) !important; color: var(--wre-text) !important; border-radius: 14px !important; padding: .9rem 1.1rem !important; font-size: 1.15rem; }
.wre-input:focus { border-color: var(--wre-acid) !important; box-shadow: 0 0 0 4px rgba(198,255,61,.15) !important; }
.wre-input::placeholder { color: #5D5D66; }
.wre-play { width: 84px; height: 84px; border-radius: 50%; border: 0; background: var(--wre-en); color: #001218; font-size: 2rem; display: grid; place-items: center; box-shadow: 0 0 0 0 rgba(61,217,255,.5); animation: wre-onda 2.2s infinite; }

.wre-scommessa { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px dashed var(--wre-line-2); display: none; }
.wre-scommessa.on { display: block; animation: wre-sale .35s ease both; }
.wre-scommessa .domanda { font-weight: 700; margin-bottom: .8rem; }
.wre-scommessa .scelte { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.wre-sc { border-radius: 14px; padding: .85rem .6rem; border: 1px solid var(--wre-line-2); background: var(--wre-bg-2); color: var(--wre-text); font-weight: 700; display: flex; flex-direction: column; align-items: center; gap: .15rem; }
.wre-sc small { font-family: var(--wre-mono); font-weight: 500; font-size: .72rem; color: var(--wre-muted); }
.wre-sc.s:hover { border-color: var(--wre-acid); color: var(--wre-acid); }
.wre-sc.c:hover { border-color: var(--wre-amber); color: var(--wre-amber); }
.wre-sc.i:hover { border-color: var(--wre-text); }
@media (max-width: 575.98px) { .wre-scommessa .scelte { grid-template-columns: 1fr; } .wre-sc { flex-direction: row; justify-content: space-between; padding: .8rem 1rem; } }

.wre-verdetto { margin-top: 1.4rem; border-radius: 16px; padding: 1.1rem 1.2rem; display: none; gap: 1rem; align-items: flex-start; }
.wre-verdetto.on { display: flex; animation: wre-sale .35s ease both; }
.wre-verdetto.ok { background: rgba(198,255,61,.08); border: 1px solid rgba(198,255,61,.35); }
.wre-verdetto.meh { background: rgba(255,178,61,.08); border: 1px solid rgba(255,178,61,.35); }
.wre-verdetto.ko { background: rgba(255,90,95,.08); border: 1px solid rgba(255,90,95,.4); }
.wre-verdetto .titolo { font-family: var(--wre-display); font-weight: 800; font-size: 1.3rem; }
.wre-verdetto .punti { font-family: var(--wre-mono); font-weight: 700; margin-left: auto; white-space: nowrap; }
.wre-shake { animation: wre-shake .4s ease; }

.wre-finale { text-align: center; padding: 1rem 0; }
.wre-finale .grande { font-family: var(--wre-mono); font-size: clamp(3rem, 8vw, 5rem); font-weight: 800; color: var(--wre-acid); line-height: 1; }

/* ----------------------------- voci ----------------------------- */
.wre-voci { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.wre-voce-card { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.4rem; }
.wre-voce-card .flag { font-family: var(--wre-mono); font-size: .75rem; color: var(--wre-muted); letter-spacing: .1em; }
.wre-voce-card.en-card { border-color: rgba(61,217,255,.35); }
.wre-onde { display: flex; gap: 4px; align-items: center; height: 34px; margin: 1rem 0; }
.wre-onde i { width: 4px; border-radius: 4px; background: currentColor; height: 20%; opacity: .7; }
.wre-onde.on i { animation: wre-eq 1s infinite ease-in-out; }
.wre-onde i:nth-child(2n) { animation-delay: .15s; } .wre-onde i:nth-child(3n) { animation-delay: .3s; } .wre-onde i:nth-child(5n) { animation-delay: .45s; }
@media (max-width: 767.98px) { .wre-voci { grid-template-columns: 1fr; } }

/* ----------------------------- login ----------------------------- */
.wre-auth { min-height: calc(100vh - 70px); display: grid; grid-template-columns: 1.05fr 1fr; }
.wre-auth-side { padding: clamp(2rem, 5vw, 4rem); border-right: 1px solid var(--wre-line); display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; background: radial-gradient(600px 400px at 20% 20%, rgba(198,255,61,.08), transparent 60%); }
.wre-auth-side h1 { font-size: clamp(2.4rem, 5vw, 4.2rem); line-height: .98; }
.wre-auth-main { padding: clamp(2rem, 5vw, 4rem); display: flex; align-items: center; justify-content: center; }
.wre-auth-box { width: 100%; max-width: 460px; }
.wre-tabs { display: grid; grid-template-columns: 1fr 1fr; background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 999px; padding: 5px; margin-bottom: 2rem; }
.wre-tabs button { border: 0; background: transparent; color: var(--wre-muted); border-radius: 999px; padding: .7rem; font-weight: 700; }
.wre-tabs button.active { background: var(--wre-text); color: var(--wre-bg); }
.wre-pannello { display: none; }
.wre-pannello.on { display: block; animation: wre-sale .3s ease both; }
.wre-auth label, .wre-label { font-size: .85rem; color: var(--wre-muted); font-weight: 600; margin-bottom: .4rem; display: block; }
.wre-auth .form-control, .wre-auth .form-select { background-color: var(--wre-card); border: 1px solid var(--wre-line-2); color: var(--wre-text); border-radius: 12px; padding: .8rem 1rem; }
.wre-auth .form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%238A8A93' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
.wre-auth .form-control:focus, .wre-auth .form-select:focus { border-color: var(--wre-acid); box-shadow: 0 0 0 4px rgba(198,255,61,.12); background-color: var(--wre-card); color: var(--wre-text); }
.wre-auth .form-control::placeholder { color: #5D5D66; }
.wre-auth .form-check-input { background-color: var(--wre-card); border-color: var(--wre-line-2); }
.wre-auth .form-check-input:checked { background-color: var(--wre-acid); border-color: var(--wre-acid); }
.wre-auth .form-check-label { color: #B8B8C0; font-size: .9rem; }
.wre-pwd { position: relative; }
.wre-pwd button { position: absolute; right: .5rem; top: 50%; transform: translateY(-50%); border: 0; background: transparent; color: var(--wre-muted); font-size: .8rem; font-family: var(--wre-mono); padding: .3rem .5rem; }
.wre-forza { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: .5rem; }
.wre-forza i { height: 4px; border-radius: 4px; background: var(--wre-line); transition: background .2s ease; }
.wre-forza-testo { font-family: var(--wre-mono); font-size: .72rem; color: var(--wre-muted); margin-top: .3rem; }
.wre-opzioni-radio { display: grid; gap: .5rem; }
.wre-radio { display: flex; gap: .8rem; align-items: flex-start; padding: .85rem 1rem; border: 1px solid var(--wre-line-2); border-radius: 14px; background: var(--wre-card); cursor: pointer; transition: border-color .15s ease; }
.wre-radio:hover { border-color: var(--wre-muted); }
.wre-radio input { margin-top: .3rem; accent-color: var(--wre-acid); }
.wre-radio b { display: block; color: var(--wre-text); }
.wre-radio span { font-size: .85rem; color: var(--wre-muted); }
.wre-radio:has(input:checked) { border-color: var(--wre-acid); background: rgba(198,255,61,.05); }
.wre-pill-group { display: flex; gap: .5rem; flex-wrap: wrap; }
.wre-pill-group label { margin: 0; font-weight: 500; }
.wre-pill-group input { position: absolute; opacity: 0; pointer-events: none; }
.wre-pill-group span, .wre-pill-group label { display: inline-block; padding: .55rem 1rem; border: 1px solid var(--wre-line-2); border-radius: 99px; color: var(--wre-muted); font-family: var(--wre-mono); font-size: .85rem; cursor: pointer; }
.wre-pill-group input:checked + span, .wre-pill-group input:checked + label { background: var(--wre-acid); border-color: var(--wre-acid); color: var(--wre-acid-ink); font-weight: 700; }
.wre-pill-group input:focus-visible + span, .wre-pill-group input:focus-visible + label { outline: 2px solid var(--wre-acid); outline-offset: 2px; }
.wre-alert { border-radius: 14px; padding: .9rem 1rem; font-size: .92rem; margin-bottom: 1.2rem; }
.wre-alert.err { background: rgba(255,90,95,.1); border: 1px solid rgba(255,90,95,.4); color: #FFC2C4; }
.wre-alert.ok { background: rgba(198,255,61,.08); border: 1px solid rgba(198,255,61,.35); color: #E2FF9A; }
.wre-quote { font-family: var(--wre-display); font-size: 1.3rem; font-weight: 700; }
.wre-quote .en { display: block; font-size: .95rem; margin-top: .4rem; font-weight: 500; }
@media (max-width: 991.98px) { .wre-auth { grid-template-columns: 1fr; } .wre-auth-side { border-right: 0; border-bottom: 1px solid var(--wre-line); } .wre-auth-side .wre-quote-box { display: none; } }

/* ----------------------------- footer ----------------------------- */
.wre-footer { border-top: 1px solid var(--wre-line); padding: 2.5rem 0; color: var(--wre-muted); font-size: .9rem; }

/* ----------------------------- comparsa allo scroll ----------------------------- */
.wre-reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.wre-reveal.vista { opacity: 1; transform: none; }

/* ----------------------------- animazioni ----------------------------- */
@keyframes wre-pulse { 0%,100% { box-shadow: 0 0 0 4px rgba(198,255,61,.15); } 50% { box-shadow: 0 0 0 8px rgba(198,255,61,.05); } }
@keyframes wre-sottolinea { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes wre-sale { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes wre-shake { 0%,100% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-5px); } 80% { transform: translateX(5px); } }
@keyframes wre-onda { 0% { box-shadow: 0 0 0 0 rgba(61,217,255,.45); } 70% { box-shadow: 0 0 0 22px rgba(61,217,255,0); } 100% { box-shadow: 0 0 0 0 rgba(61,217,255,0); } }
@keyframes wre-eq { 0%,100% { height: 20%; } 50% { height: 100%; } }
@keyframes wre-coda { 0%,100% { transform: rotate(-8deg); } 50% { transform: rotate(10deg); } }
.wre-winston.felice { animation: wre-coda .3s 4 ease-in-out; }
@keyframes wre-no { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-5px) rotate(-6deg); } 75% { transform: translateX(5px) rotate(6deg); } }
.wre-winston.morde { animation: wre-no .35s 3 ease-in-out; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .wre-reveal { opacity: 1; transform: none; }
}

/* =====================================================================
   AREA RISERVATA
   ===================================================================== */
.wre-area { display: grid; grid-template-columns: 270px 1fr; gap: 2rem; padding-top: 2rem; padding-bottom: 3rem; align-items: start; }
.wre-side { position: sticky; top: 90px; display: grid; gap: 1rem; }
.wre-me { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.2rem; }
.wre-me .chi { display: flex; gap: .8rem; align-items: center; }
.wre-me .chi svg { width: 52px; height: 52px; flex: none; }
.wre-me .nome { font-family: var(--wre-display); font-weight: 800; font-size: 1.15rem; line-height: 1.1; word-break: break-word; }
.wre-me .ruolo { font-family: var(--wre-mono); font-size: .68rem; letter-spacing: .1em; color: var(--wre-amber); text-transform: uppercase; }
.wre-me .numeri { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin-top: 1rem; text-align: center; }
.wre-me .numeri b { display: block; font-family: var(--wre-mono); font-size: 1.1rem; }
.wre-me .numeri span { font-size: .66rem; color: var(--wre-muted); text-transform: uppercase; letter-spacing: .06em; }
.wre-livello-pill { display: inline-flex; align-items: center; gap: .4rem; font-family: var(--wre-mono); font-weight: 800; font-size: .8rem; padding: .2rem .6rem; border-radius: 99px; background: var(--wre-acid); color: var(--wre-acid-ink); }
.wre-sidenav { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: .5rem; display: grid; gap: 2px; }
.wre-sidenav a { display: flex; align-items: center; gap: .75rem; padding: .7rem .85rem; border-radius: 12px; color: var(--wre-muted); font-weight: 600; }
.wre-sidenav a:hover { color: var(--wre-text); background: rgba(255,255,255,.04); }
.wre-sidenav a.attivo { color: var(--wre-acid-ink); background: var(--wre-acid); }
.wre-sidenav a .ic { width: 1.4rem; text-align: center; }
.wre-sidenav a .conta { margin-left: auto; font-family: var(--wre-mono); font-size: .72rem; padding: .05rem .45rem; border-radius: 99px; background: var(--wre-red); color: #fff; }
@media (max-width: 991.98px) {
  .wre-area { grid-template-columns: 1fr; gap: 1.2rem; padding-top: 1rem; }
  .wre-side { position: static; }
  .wre-me { display: none; }
  .wre-sidenav { grid-auto-flow: column; overflow-x: auto; padding: .35rem; }
  .wre-sidenav a { white-space: nowrap; padding: .55rem .8rem; }
}

.wre-area-testa { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1rem; margin-bottom: 1.6rem; }
.wre-area-testa h1 { font-size: clamp(2rem, 4vw, 3rem); margin: 0; line-height: 1; }
.wre-area-testa .data { font-family: var(--wre-mono); font-size: .78rem; color: var(--wre-muted); text-transform: uppercase; letter-spacing: .1em; }
.wre-area h2 { font-size: 1.35rem; margin: 0 0 1rem; letter-spacing: -.01em; }
.wre-pannello-area { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.4rem; }
.wre-pannello-area + .wre-pannello-area { margin-top: 1.2rem; }

.wre-winston-msg { display: flex; gap: 1rem; align-items: center; background: linear-gradient(90deg, rgba(198,255,61,.08), transparent 70%); border: 1px solid rgba(198,255,61,.25); border-radius: var(--wre-radius); padding: 1rem 1.2rem; margin-bottom: 1.4rem; }
.wre-winston-msg svg { width: 58px; height: 58px; flex: none; }
.wre-winston-msg .testo { font-size: 1.05rem; }
.wre-winston-msg button { margin-left: auto; flex: none; }

.wre-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: .8rem; margin-bottom: 1.4rem; }
.wre-tile { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 16px; padding: 1rem; }
.wre-tile .v { font-family: var(--wre-mono); font-weight: 800; font-size: 1.6rem; line-height: 1.1; }
.wre-tile .l { font-size: .7rem; color: var(--wre-muted); text-transform: uppercase; letter-spacing: .08em; margin-top: .2rem; }
.wre-tile .s { font-size: .78rem; color: var(--wre-muted); margin-top: .35rem; }
@media (max-width: 1399.98px) { .wre-tiles { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575.98px) { .wre-tiles { grid-template-columns: repeat(2, 1fr); } }

.wre-oggi { display: grid; grid-template-columns: auto 1fr; gap: 1.4rem; align-items: center; }
.wre-anello { --p: 0; width: 120px; height: 120px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(closest-side, var(--wre-card) 78%, transparent 79% 100%), conic-gradient(var(--wre-acid) calc(var(--p) * 1%), var(--wre-line) 0); }
.wre-anello b { font-family: var(--wre-mono); font-size: 1.5rem; display: block; text-align: center; line-height: 1; }
.wre-anello span { font-size: .7rem; color: var(--wre-muted); display: block; text-align: center; }
.wre-oggi ul { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: .4rem; }
.wre-oggi li b { font-family: var(--wre-mono); }
@media (max-width: 575.98px) { .wre-oggi { grid-template-columns: 1fr; justify-items: start; } }

.wre-badge { display: inline-block; font-family: var(--wre-mono); font-size: .68rem; padding: .2rem .55rem; border-radius: 99px; border: 1px solid var(--wre-line-2); color: var(--wre-muted); white-space: nowrap; }
.wre-badge.ok { color: var(--wre-acid); border-color: rgba(198,255,61,.4); }
.wre-badge.en { color: var(--wre-en); border-color: rgba(61,217,255,.4); }
.wre-badge.warn { color: var(--wre-amber); border-color: rgba(255,178,61,.4); }
.wre-badge.off { opacity: .6; }

.wre-modulo + .wre-modulo { margin-top: 1.6rem; }
.wre-modulo-testa { display: flex; gap: .9rem; align-items: center; margin-bottom: .9rem; }
.wre-modulo-testa .icona { width: 44px; height: 44px; border-radius: 12px; background: var(--wre-bg-2); border: 1px solid var(--wre-line); display: grid; place-items: center; font-size: 1.3rem; }
.wre-modulo-testa h3 { font-size: 1.15rem; margin: 0; }
.wre-modulo-testa p { margin: 0; color: var(--wre-muted); font-size: .88rem; }
.wre-lezioni { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .8rem; }
.wre-lezione { background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-radius: 14px; padding: 1rem; display: flex; flex-direction: column; gap: .5rem; transition: border-color .15s ease; }
.wre-lezione:hover { border-color: var(--wre-line-2); }
.wre-lezione h4 { font-family: var(--wre-display); font-weight: 700; font-size: 1.02rem; margin: 0; }
.wre-lezione p { color: #A9A9B1; font-size: .85rem; margin: 0; flex: 1; }
.wre-lezione.bloccata { opacity: .45; }
.wre-lezione-piede { display: flex; justify-content: space-between; font-size: .75rem; }
.wre-vuoto { border: 1px dashed var(--wre-line-2); border-radius: 14px; padding: 1.4rem; color: var(--wre-muted); text-align: center; }

.wre-abilita { display: grid; gap: .8rem; }
.wre-abilita .riga { display: grid; grid-template-columns: 1.6rem 6.5rem 1fr 3rem; gap: .6rem; align-items: center; font-size: .9rem; }
.wre-abilita .riga .wre-meter { margin: 0; }
.wre-abilita .riga .pc { font-family: var(--wre-mono); text-align: right; color: var(--wre-muted); font-size: .8rem; }

.wre-heat { display: grid; grid-template-rows: repeat(7, 13px); grid-auto-flow: column; grid-auto-columns: 13px; gap: 3px; overflow-x: auto; padding-bottom: .3rem; }
.wre-heat i { border-radius: 3px; background: var(--wre-line); }
.wre-heat i.l1 { background: rgba(198,255,61,.25); } .wre-heat i.l2 { background: rgba(198,255,61,.5); }
.wre-heat i.l3 { background: rgba(198,255,61,.75); } .wre-heat i.l4 { background: var(--wre-acid); }

.wre-livelli-area { display: grid; grid-template-columns: repeat(6, 1fr); gap: .7rem; margin-bottom: 1.4rem; }
.wre-liv { display: block; background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 16px; padding: .9rem; color: var(--wre-text); position: relative; overflow: hidden; }
.wre-liv:hover { color: var(--wre-text); border-color: var(--wre-line-2); }
.wre-liv::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px; background: var(--c); opacity: .9; }
.wre-liv .cod { font-family: var(--wre-mono); font-weight: 800; font-size: 1.4rem; color: var(--c); }
.wre-liv .mis { font-weight: 700; font-size: .9rem; }
.wre-liv .st { font-family: var(--wre-mono); font-size: .66rem; color: var(--wre-muted); text-transform: uppercase; letter-spacing: .08em; margin-top: .3rem; }
.wre-liv.selezionato { border-color: var(--c); box-shadow: 0 0 0 1px var(--c) inset; }
.wre-liv.bloccato { opacity: .5; }
@media (max-width: 1199.98px) { .wre-livelli-area { grid-template-columns: repeat(3, 1fr); } }

.wre-boss { display: grid; grid-template-columns: auto 1fr auto; gap: 1.2rem; align-items: center; }
.wre-boss .teschio { font-size: 2.6rem; }
@media (max-width: 767.98px) { .wre-boss { grid-template-columns: 1fr; } }

.wre-traguardi { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .8rem; }
.wre-trag { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 16px; padding: 1.1rem; text-align: center; }
.wre-trag .ic { font-size: 2.2rem; line-height: 1; filter: grayscale(1); opacity: .35; }
.wre-trag h4 { font-family: var(--wre-display); font-weight: 700; font-size: 1rem; margin: .7rem 0 .3rem; }
.wre-trag p { font-size: .82rem; color: var(--wre-muted); margin: 0; }
.wre-trag .xp { font-family: var(--wre-mono); font-size: .72rem; color: var(--wre-muted); margin-top: .6rem; }
.wre-trag.ottenuto { border-color: rgba(198,255,61,.35); background: linear-gradient(180deg, rgba(198,255,61,.06), var(--wre-card)); }
.wre-trag.ottenuto .ic { filter: none; opacity: 1; }
.wre-trag.ottenuto .xp { color: var(--wre-acid); }

.wre-form label, .wre-form .wre-label { font-size: .85rem; color: var(--wre-muted); font-weight: 600; margin-bottom: .4rem; display: block; }
.wre-form .form-control, .wre-form .form-select { background-color: var(--wre-bg-2); border: 1px solid var(--wre-line-2); color: var(--wre-text); border-radius: 12px; padding: .75rem 1rem; }
.wre-form .form-control:focus, .wre-form .form-select:focus { border-color: var(--wre-acid); box-shadow: 0 0 0 4px rgba(198,255,61,.12); background-color: var(--wre-bg-2); color: var(--wre-text); }
.wre-form .form-control[readonly] { opacity: .6; }
.wre-form .form-check-input { background-color: var(--wre-bg-2); border-color: var(--wre-line-2); }
.wre-form .form-check-input:checked { background-color: var(--wre-acid); border-color: var(--wre-acid); }
.wre-form .form-switch .form-check-input { width: 2.6em; height: 1.4em; }
.wre-form .form-switch .form-check-input:checked { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%230A0A0B'/%3e%3c/svg%3e"); }
.wre-dl { display: grid; grid-template-columns: auto 1fr; gap: .45rem 1.2rem; margin: 0; font-size: .92rem; }
.wre-dl dt { color: var(--wre-muted); font-weight: 500; }
.wre-dl dd { margin: 0; }

/* pulsanti disattivati (funzioni in arrivo) */
.btn-wre.disabled, .btn-wre:disabled { background: var(--wre-acid); color: var(--wre-acid-ink); border: 0; opacity: .35; }
.btn-wre-ghost.disabled, .btn-wre-ghost:disabled { border-color: var(--wre-line-2); color: var(--wre-muted); opacity: .6; }

/* =====================================================================
   SESSIONE DI STUDIO
   ===================================================================== */
.wre-sess { max-width: 900px; padding-top: 1.4rem; padding-bottom: 2rem; }
.wre-sess-bar { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.wre-sess-bar .titolo { font-family: var(--wre-display); font-weight: 800; font-size: 1.1rem; }
.wre-sess-prog { flex: 1; min-width: 120px; height: 10px; background: var(--wre-line); border-radius: 99px; overflow: hidden; }
.wre-sess-prog i { display: block; height: 100%; width: 0; background: var(--wre-acid); border-radius: inherit; transition: width .6s cubic-bezier(.2,.8,.2,1); }
.wre-sess .wre-arena-body { min-height: 460px; }
.wre-q-testo .en-testo { color: var(--wre-text); }

.wre-lavagna .testo { font-size: 1.15rem; line-height: 1.7; background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-left: 4px solid var(--wre-en); border-radius: 14px; padding: 1.3rem 1.4rem; }

.wre-chip { border: 1px solid var(--wre-line-2); background: var(--wre-bg-2); color: var(--wre-text); border-radius: 12px; padding: .65rem 1rem; font-weight: 600; font-size: 1.05rem; transition: transform .1s ease, border-color .15s ease, background .15s ease; }
.wre-chip:hover:not(:disabled) { border-color: var(--wre-text); }
.wre-chip:active:not(:disabled) { transform: scale(.96); }
.wre-ordina-risposta { min-height: 70px; border-bottom: 2px dashed var(--wre-line-2); padding: .6rem 0 .8rem; display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.wre-ordina-risposta.vuota::before { content: "Tocca le parole nell'ordine giusto…"; color: #5D5D66; align-self: center; }
.wre-ordina-risposta .wre-chip { border-color: var(--wre-en); background: rgba(61,217,255,.08); }
.wre-ordina-pool { display: flex; flex-wrap: wrap; gap: .5rem; min-height: 50px; }

.wre-abbina { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.wre-abbina .col-a, .wre-abbina .col-b { display: grid; gap: .5rem; align-content: start; }
.wre-abbina .wre-chip { text-align: left; }
.wre-abbina .wre-chip.attiva { border-color: var(--wre-text); box-shadow: 0 0 0 2px var(--wre-text) inset; }
.wre-abbina .wre-chip.en-chip { color: var(--wre-en); }
.wre-chip.p0 { border-color: #C6FF3D; background: rgba(198,255,61,.12); }
.wre-chip.p1 { border-color: #3DD9FF; background: rgba(61,217,255,.12); }
.wre-chip.p2 { border-color: #FF7CE0; background: rgba(255,124,224,.12); }
.wre-chip.p3 { border-color: #FFB23D; background: rgba(255,178,61,.12); }
.wre-chip.p4 { border-color: #8C7CFF; background: rgba(140,124,255,.14); }
.wre-chip.p5 { border-color: #7CFFB2; background: rgba(124,255,178,.12); }

.wre-input.giusto { border-color: var(--wre-acid) !important; background: rgba(198,255,61,.08) !important; }
.wre-input.sbagliato { border-color: var(--wre-red) !important; background: rgba(255,90,95,.08) !important; }

.wre-toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 100; display: grid; gap: .5rem; max-width: 340px; }
.wre-toast .voce { display: flex; gap: .8rem; align-items: center; background: var(--wre-card-2); border: 1px solid var(--wre-line-2); border-radius: 14px; padding: .8rem 1rem; box-shadow: 0 20px 40px -20px rgba(0,0,0,.9); animation: wre-sale .35s ease both; transition: opacity .4s ease, transform .4s ease; }
.wre-toast .voce.oro { border-color: rgba(255,178,61,.6); background: linear-gradient(90deg, rgba(255,178,61,.15), var(--wre-card-2)); }
.wre-toast .voce.err { border-color: rgba(255,90,95,.6); }
.wre-toast .voce.via { opacity: 0; transform: translateY(10px); }
@media (max-width: 575.98px) { .wre-abbina { gap: .5rem; } .wre-chip { padding: .55rem .7rem; font-size: .95rem; } }

/* =====================================================================
   PAROLE
   ===================================================================== */
.wre-parola-big { font-family: var(--wre-display); font-weight: 800; font-size: clamp(2.2rem, 6vw, 3.6rem); letter-spacing: -.02em; line-height: 1.05; margin: .4rem 0 .2rem; }
.wre-parola-big.en { color: var(--wre-en); }
.wre-parola-cat { font-family: var(--wre-mono); font-size: .8rem; color: var(--wre-muted); margin-bottom: 1.4rem; }
.wre-scheda .traduzione { font-size: 1.5rem; font-weight: 700; margin-top: .4rem; }
.wre-scheda .esempio { margin-top: 1.2rem; font-size: 1.1rem; line-height: 1.6; background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-left: 4px solid var(--wre-en); border-radius: 14px; padding: 1rem 1.2rem; }
.wre-lav-parole { margin-top: 1.4rem; }
.wre-lav-parole .lista { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .5rem; }
.wre-lav-parole .wre-chip { font-size: .92rem; padding: .45rem .8rem; }

.wre-filtri { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; margin-bottom: 1.2rem; }
.wre-filtri .form-control, .wre-filtri .form-select { background-color: var(--wre-card); border: 1px solid var(--wre-line-2); color: var(--wre-text); border-radius: 12px; padding: .6rem .9rem; width: auto; min-width: 180px; }
.wre-filtri .form-control:focus, .wre-filtri .form-select:focus { border-color: var(--wre-acid); box-shadow: 0 0 0 4px rgba(198,255,61,.12); }
.wre-filtri .form-control::placeholder { color: #5D5D66; }
.wre-filtri .stati { display: flex; gap: .35rem; flex-wrap: wrap; }
.wre-filtri .stati button { border: 1px solid var(--wre-line-2); background: var(--wre-card); color: var(--wre-muted); border-radius: 99px; padding: .45rem .9rem; font-size: .85rem; font-weight: 600; }
.wre-filtri .stati button.on { background: var(--wre-text); color: var(--wre-bg); border-color: var(--wre-text); }
.wre-parole { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .8rem; }
.wre-pcard { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 16px; padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .3rem; }
.wre-pcard.cassa { border-color: rgba(198,255,61,.35); }
.wre-pcard.nuova { opacity: .62; }
.wre-pcard .testa { display: flex; align-items: center; gap: .5rem; }
.wre-pcard .en-p { font-family: var(--wre-display); font-weight: 800; font-size: 1.3rem; color: var(--wre-en); line-height: 1.1; }
.wre-pcard .play { margin-left: auto; border: 1px solid var(--wre-line-2); background: transparent; color: var(--wre-text); border-radius: 99px; width: 34px; height: 34px; flex: none; }
.wre-pcard .play:hover { border-color: var(--wre-en); }
.wre-pcard .it-p { font-weight: 600; }
.wre-pcard .meta { font-family: var(--wre-mono); font-size: .7rem; color: var(--wre-muted); }
.wre-pcard .es { font-size: .85rem; color: #A9A9B1; margin-top: .3rem; border-top: 1px dashed var(--wre-line-2); padding-top: .5rem; }
.wre-pcard .es .en { font-weight: 500; }
.wre-pcard .piede { margin-top: auto; padding-top: .5rem; }
.wre-tiles.q4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 767.98px) { .wre-tiles.q4 { grid-template-columns: repeat(2, 1fr); } .wre-filtri .form-control, .wre-filtri .form-select { width: 100%; } }

/* =====================================================================
   IL BOSS
   ===================================================================== */
.wre-arena-boss { border-color: rgba(255,178,61,.35); box-shadow: 0 0 0 1px rgba(255,178,61,.08), 0 40px 80px -40px rgba(255,178,61,.25); }
.wre-boss-corona { font-size: 3.4rem; line-height: 1; display: inline-block; animation: wre-galleggia 3s ease-in-out infinite; }
.wre-boss-corona.vinta { font-size: 5rem; animation: wre-salta .9s cubic-bezier(.2,.8,.2,1) both, wre-galleggia 3s 1s ease-in-out infinite; }
@keyframes wre-galleggia { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-8px) rotate(4deg); } }
@keyframes wre-salta { 0% { transform: scale(.2) rotate(-30deg); opacity: 0; } 70% { transform: scale(1.15) rotate(6deg); opacity: 1; } 100% { transform: scale(1) rotate(0); } }
.wre-boss-regole { list-style: none; padding: 0; margin: 1.2rem 0 1.4rem; display: grid; gap: .7rem; }
.wre-boss-regole li { padding: .8rem 1rem .8rem 2.6rem; background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-radius: 14px; position: relative; color: #C9C9CF; }
.wre-boss-regole li::before { content: "▸"; position: absolute; left: 1rem; top: .8rem; color: var(--wre-amber); }
.wre-boss-regole b { color: var(--wre-text); }
.wre-brano { white-space: normal; font-size: 1.02rem; line-height: 1.65; background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-left: 4px solid var(--wre-amber); border-radius: 14px; padding: 1rem 1.2rem; margin-bottom: 1.2rem; color: #DADAE0; }
.wre-esito .wre-q-testo { font-size: clamp(2rem, 5vw, 3rem); }
.wre-esito-misure { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.4rem; }
.wre-esito-misura { background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-radius: 14px; padding: 1rem; }
.wre-esito-misura .wre-meter { position: relative; height: 10px; margin-top: .6rem; overflow: visible; }
.wre-esito-misura .wre-meter i { border-radius: 99px; }
.wre-esito-misura.ok .wre-meter i { background: var(--wre-acid); }
.wre-esito-misura.ko .wre-meter i { background: var(--wre-red); }
.wre-esito-misura .soglia { position: absolute; top: -5px; bottom: -5px; width: 2px; background: var(--wre-text); }
.wre-errori summary { cursor: pointer; font-weight: 700; padding: .6rem 0; }
.wre-errore { border-top: 1px dashed var(--wre-line-2); padding: .9rem 0; }
.wre-errore .dom { font-weight: 600; margin-bottom: .3rem; }
.wre-errore .tua b { color: var(--wre-red); }
.wre-errore .giu b { color: var(--wre-acid); }
@media (max-width: 575.98px) { .wre-esito-misure { grid-template-columns: 1fr; } }


/* =====================================================================
   OSSI DURI - segnalazione e palestra
   ===================================================================== */
.wre-conta { font-family: var(--wre-mono); font-size: .72rem; padding: .05rem .45rem; border-radius: 99px; background: var(--wre-red); color: #fff; margin-left: .3rem; }
.wre-osso-btn { border: 1px solid var(--wre-line-2); color: var(--wre-muted); background: transparent; border-radius: 99px; font-weight: 600; font-size: .8rem; padding: .25rem .7rem; }
.wre-osso-btn:hover { color: var(--wre-text); border-color: var(--wre-text); }
.wre-osso-btn.on { color: #FFE3C2; border-color: rgba(255,178,61,.6); background: rgba(255,178,61,.12); }
.wre-osso-btn.wre-morso { animation: wre-morso .5s ease; }
.wre-osso-mini { font-family: var(--wre-mono); font-size: .78rem; border: 1px solid rgba(255,178,61,.5); color: #FFE3C2; border-radius: 99px; padding: .05rem .5rem; white-space: nowrap; }
@keyframes wre-morso { 0% { transform: scale(1); } 30% { transform: scale(1.25) rotate(-12deg); } 60% { transform: scale(.92) rotate(8deg); } 100% { transform: scale(1); } }

/* elenco */
.wre-ossi-come { display: flex; gap: 1rem; align-items: flex-start; background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 16px; padding: 1rem 1.2rem; color: #C9C9CF; }
.wre-ossi-come svg { width: 46px; height: 46px; flex: none; }
.wre-ossi { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: .9rem; }
.wre-osso { background: var(--wre-card); border: 1px solid var(--wre-line); border-left: 3px solid var(--wre-amber); border-radius: 16px; padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .45rem; }
.wre-ossi.rosicchiati .wre-osso { border-left-color: var(--wre-acid); opacity: .85; }
.wre-osso .testa { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.wre-osso .consegna { color: var(--wre-muted); font-size: .85rem; }
.wre-osso .frase { font-family: var(--wre-display); font-weight: 700; font-size: 1.2rem; line-height: 1.25; }
.wre-osso .frase.en { color: var(--wre-en); }
.wre-osso .tua { font-size: .82rem; color: var(--wre-muted); }
.wre-osso .tua s { color: var(--wre-red); }
.wre-osso .piede { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-top: auto; padding-top: .4rem; }
.pallini { margin-left: auto; display: inline-flex; gap: .3rem; }
.pallini i { width: .7rem; height: .7rem; border-radius: 50%; border: 1px solid var(--wre-line-2); }
.pallini i.on { background: var(--wre-acid); border-color: var(--wre-acid); }

/* palestra: tappe */
.wre-pal-tappe { list-style: none; display: flex; gap: .4rem; padding: 0; margin: 0 0 1rem; overflow-x: auto; }
.wre-pal-tappe li { display: flex; align-items: center; gap: .45rem; padding: .35rem .75rem .35rem .4rem; border: 1px solid var(--wre-line); border-radius: 99px; color: var(--wre-muted); font-size: .8rem; white-space: nowrap; transition: all .25s ease; }
.wre-pal-tappe li .n { width: 1.4rem; height: 1.4rem; border-radius: 50%; display: grid; place-items: center; font-family: var(--wre-mono); font-size: .7rem; background: var(--wre-bg-2); }
.wre-pal-tappe li.ora { color: var(--wre-text); border-color: var(--wre-text); }
.wre-pal-tappe li.ora .n { background: var(--wre-text); color: var(--wre-bg); }
.wre-pal-tappe li.fatta { color: var(--wre-acid); border-color: rgba(198,255,61,.35); }
.wre-pal-tappe li.fatta .n { background: var(--wre-acid); color: var(--wre-acid-ink); }
.wre-pal-testa { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }

/* palestra: la frase che arriva lettera per lettera */
.wre-pal-anim { font-family: var(--wre-display); font-weight: 800; font-size: clamp(2.2rem, 7vw, 5.2rem); line-height: 1.12; letter-spacing: -.02em; text-align: center; color: var(--wre-text); margin: 2rem 0 1rem; min-height: 1.2em; overflow: hidden; padding: .1em 0; }
.wre-pal-anim.lunga { font-size: clamp(1.8rem, 5vw, 3.8rem); }
.wre-pal-anim.lunghissima { font-size: clamp(1.5rem, 3.8vw, 2.8rem); }
.wre-pal-anim .parola { display: inline-block; white-space: nowrap; }
.wre-pal-anim .lettera { display: inline-block; animation: wre-entra .62s cubic-bezier(.2,.9,.25,1.15) both; }
.wre-pal-anim .parola.focus .lettera { color: var(--wre-acid); }
.wre-pal-anim.arrivata .parola { color: var(--wre-en); transition: color .5s ease; }
.wre-pal-anim.arrivata .parola.focus { color: var(--wre-acid); }
@keyframes wre-entra {
  0% { transform: translateX(65vw) rotate(25deg) scale(1.6); opacity: 0; }
  55% { opacity: 1; }
  80% { transform: translateX(-.06em) rotate(-4deg) scale(1); }
  100% { transform: none; opacity: 1; }
}
.wre-pal-sotto { text-align: center; color: #C9C9CF; font-size: 1.15rem; min-height: 1.6em; opacity: 0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease; }
.wre-pal-sotto.on { opacity: 1; transform: none; }
.wre-pal-contesto { text-align: center; color: var(--wre-muted); margin-top: 1rem; font-family: var(--wre-display); font-size: 1.2rem; }

/* palestra: prove */
.wre-pal-esito { display: none; margin: .8rem 0 0; font-weight: 600; }
.wre-pal-esito.on { display: block; animation: wre-sale .3s ease both; }
.wre-pal-esito.ok { color: var(--wre-acid); }
.wre-pal-esito.ko { color: var(--wre-red); }
.wre-chip.giusta { border-color: var(--wre-acid) !important; background: rgba(198,255,61,.12) !important; color: var(--wre-acid); }
.wre-chip.sbagliata { border-color: var(--wre-red) !important; background: rgba(255,90,95,.12) !important; color: var(--wre-red); }
.wre-chip.lettera { min-width: 3rem; font-family: var(--wre-display); font-size: 1.4rem; font-weight: 800; padding: .5rem .8rem; }
.wre-pal-frase { font-family: var(--wre-display); font-weight: 700; font-size: clamp(1.4rem, 3.6vw, 2.2rem); line-height: 1.6; margin: 1.2rem 0 .4rem; display: flex; flex-wrap: wrap; gap: .2rem .55rem; align-items: baseline; }
.wre-pal-slot i { font-style: normal; color: var(--wre-muted); }
.wre-pal-slot .buco { display: inline-block; min-width: calc(var(--n, 3) * .62em); border-bottom: 3px solid var(--wre-line-2); color: var(--wre-muted); letter-spacing: .12em; text-align: center; padding: 0 .1em; transition: all .25s ease; }
.wre-pal-slot .buco b { font-weight: 400; color: #4A4A52; }
.wre-pal-slot.ora .buco { border-color: var(--wre-en); color: var(--wre-en); box-shadow: 0 6px 14px -10px var(--wre-en); }
.wre-pal-slot.presa .buco { border-color: var(--wre-acid); color: var(--wre-en); letter-spacing: 0; animation: wre-salta .4s ease both; }
.wre-pal-aiuto { color: #C9C9CF; font-size: 1.1rem; border-left: 3px solid var(--wre-amber); padding: .2rem 0 .2rem .8rem; margin: .4rem 0 0; }
.wre-pal-diff { font-family: var(--wre-display); font-weight: 700; font-size: 1.35rem; min-height: 1.5em; margin: 1rem 0 .2rem; display: flex; flex-wrap: wrap; gap: .3rem .5rem; align-items: baseline; transition: opacity .3s ease; }
.wre-pal-diff .ok { color: var(--wre-acid); }
.wre-pal-diff .ko { color: var(--wre-red); text-decoration: underline wavy; text-underline-offset: 4px; }
.wre-pal-diff .buco { display: inline-block; min-width: calc(var(--n, 3) * .6em); border-bottom: 3px solid var(--wre-red); color: transparent; }
.wre-pal-diff.nascosta { opacity: 0; }
.wre-pal-coppie { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .6rem; margin: 1rem 0; }
.wre-pal-coppia { display: flex; align-items: center; gap: .7rem; justify-content: space-between; border: 1px solid var(--wre-line-2); background: var(--wre-bg-2); color: var(--wre-text); border-radius: 14px; padding: .8rem 1rem; font-weight: 600; font-size: 1.05rem; }
.wre-pal-coppia b { color: var(--wre-muted); font-weight: 400; }
.wre-pal-coppia .en { color: var(--wre-en); }
.wre-pal-coppia.vista { border-color: rgba(61,217,255,.5); }
.wre-pal-abbina { display: grid; gap: .5rem; max-width: 560px; }
.wre-pal-abbina label { display: grid; grid-template-columns: 1fr 1.4fr; gap: .8rem; align-items: center; font-weight: 600; }
.wre-pal-abbina .form-select { background-color: var(--wre-bg-2); color: var(--wre-en); border-color: var(--wre-line-2); }
.wre-pal-fine { text-align: center; padding: 1rem 0; }
.wre-pal-fine h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.wre-pal-fine .numeri { display: flex; justify-content: center; gap: 2rem; flex-wrap: wrap; margin-top: 1.2rem; }
.wre-pal-fine .numeri div { display: grid; }
.wre-pal-fine .numeri b { font-family: var(--wre-mono); font-size: 1.6rem; }
.wre-pal-fine .numeri span { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--wre-muted); }

/* tasto "Non lo so" */
.wre-nonso-riga { display: flex; justify-content: flex-end; margin-top: 1rem; }
.wre-nonso { border: 1px dashed var(--wre-line-2); background: transparent; color: var(--wre-muted); border-radius: 99px; padding: .35rem .9rem; font-weight: 600; font-size: .88rem; }
.wre-nonso small { font-family: var(--wre-mono); font-size: .68rem; opacity: .7; margin-left: .3rem; }
.wre-nonso:hover:not(:disabled) { color: var(--wre-amber); border-color: var(--wre-amber); border-style: solid; }
.wre-nonso:disabled { opacity: .45; }
.wre-nonso.scelto { opacity: 1; color: var(--wre-amber); border: 1px solid var(--wre-amber); background: rgba(255,178,61,.1); }
.wre-argomento { margin-top: .6rem; border: 1px solid var(--wre-line-2); border-radius: 12px; padding: .6rem .9rem; background: rgba(255,255,255,.02); }
.wre-argomento summary { cursor: pointer; color: #C9C9CF; }
.wre-argomento .testo { margin-top: .5rem; color: #C9C9CF; line-height: 1.55; }

/* traduzione sempre a portata di mano */
.wre-trad-btn { border: 1px solid var(--wre-line-2); color: var(--wre-muted); background: transparent; border-radius: 99px; font-weight: 600; font-size: .8rem; padding: .25rem .7rem; }
.wre-trad-btn:hover, .wre-trad-btn.on { color: var(--wre-text); border-color: var(--wre-text); }
.wre-trad-btn + .wre-osso-btn { margin-left: 0 !important; }
.wre-trad { display: flex; gap: .6rem; align-items: baseline; margin-top: 1rem; padding: .6rem .9rem; border-left: 3px solid var(--wre-text); background: rgba(255,255,255,.03); border-radius: 0 10px 10px 0; color: #DADADF; font-size: 1.05rem; animation: wre-sale .3s ease both; }
.wre-trad[hidden] { display: none; }
.wre-scheda-mini { margin-top: .5rem; padding: .7rem .9rem; border: 1px solid var(--wre-line-2); border-radius: 12px; background: rgba(255,255,255,.02); }
.wre-scheda-mini .wre-parola-big { font-size: 2rem; margin: 0; }
.wre-scheda-mini .traduzione { font-size: 1.15rem; font-weight: 600; margin-top: .2rem; }
.wre-scheda-mini .esempio { margin-top: .45rem; }
.wre-lav-parola .it { transition: color .2s ease; }
.wre-lav-parola.vista .it { color: var(--wre-text); }

/* Dillo tu: pronuncia col microfono */
.wre-dillo { text-align: center; padding: .5rem 0; }
.wre-dillo .frase { font-family: var(--wre-display); font-weight: 800; font-size: clamp(1.8rem, 4.6vw, 3rem); line-height: 1.15; letter-spacing: -.01em; }
.wre-dillo .it { color: #C9C9CF; margin-top: .3rem; font-size: 1.05rem; }
.wre-dillo .comandi { display: flex; justify-content: center; align-items: center; gap: .8rem; margin: 1.2rem 0 .6rem; flex-wrap: wrap; }
.wre-dillo .stato { color: var(--wre-muted); min-height: 1.5em; }
.wre-dillo .esito { margin-top: .8rem; }
.wre-dillo .esito .parole { font-family: var(--wre-display); font-weight: 700; font-size: 1.4rem; display: flex; flex-wrap: wrap; gap: .2rem .5rem; justify-content: center; }
.wre-dillo .esito .parole .ok { color: var(--wre-acid); }
.wre-dillo .esito .parole .ko { color: var(--wre-red); text-decoration: underline wavy; text-underline-offset: 5px; }
.wre-dillo .esito .msg { margin-top: .4rem; font-weight: 600; }
.wre-dillo .esito.ok .msg { color: var(--wre-acid); }
.wre-dillo .esito.ko .msg { color: var(--wre-red); }
.wre-dillo .esito .sentito { color: var(--wre-muted); margin-top: .2rem; }
.wre-dillo.compatto { text-align: left; border: 1px solid var(--wre-line-2); border-radius: 14px; padding: .8rem 1rem; }
.wre-dillo.compatto .frase { font-size: 1.4rem; }
.wre-dillo.compatto .comandi, .wre-dillo.compatto .esito .parole { justify-content: flex-start; }
.wre-mic { width: 76px; height: 76px; border-radius: 50%; border: 0; background: var(--wre-acid); color: var(--wre-acid-ink); font-size: 2rem; display: inline-grid; place-items: center; box-shadow: 0 10px 30px -12px rgba(198,255,61,.7); transition: transform .15s ease; }
.wre-mic:hover:not(:disabled) { transform: scale(1.06); }
.wre-mic:disabled { opacity: .4; }
.wre-mic.ascolta { background: var(--wre-red); color: #fff; animation: wre-ascolta 1.1s ease-in-out infinite; }
.wre-mic.grande { width: 110px; height: 110px; font-size: 3rem; }
.wre-dillo.compatto .wre-mic { width: 56px; height: 56px; font-size: 1.5rem; }
@keyframes wre-ascolta { 0%,100% { box-shadow: 0 0 0 0 rgba(255,90,95,.55); } 50% { box-shadow: 0 0 0 18px rgba(255,90,95,0); } }

/* comprensione: testo da leggere e dialogo da ascoltare */
.wre-brano .titolo { font-family: var(--wre-display); font-weight: 800; color: var(--wre-text); margin-bottom: .4rem; font-size: 1.05rem; }
.wre-dialogo { background: var(--wre-bg-2); border: 1px solid var(--wre-line); border-left: 4px solid var(--wre-en); border-radius: 14px; padding: .9rem 1.2rem; margin-bottom: 1.2rem; }
.wre-dialogo .wre-play { width: 64px; height: 64px; font-size: 1.5rem; }
.wre-dialogo .chi { display: flex; gap: .5rem; flex-wrap: wrap; }
.wre-dialogo .persona { font-size: .85rem; padding: .25rem .7rem; border-radius: 99px; border: 1px solid var(--wre-line-2); color: var(--wre-muted); transition: all .2s ease; }
.wre-dialogo .persona.parla { color: var(--wre-acid-ink); background: var(--wre-acid); border-color: var(--wre-acid); transform: scale(1.06); }
.wre-trascrizione { margin-top: .5rem; display: grid; gap: .45rem; }
.wre-trascrizione .battuta b { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; margin-right: .3rem; }
.wre-trascrizione .battuta b.m { color: #8EC5FF; }
.wre-trascrizione .battuta b.f { color: #FFB3D1; }
.wre-trascrizione .battuta .it { color: var(--wre-muted); font-size: .88rem; }

/* test di piazzamento */
.wre-piaz-livello { font-family: var(--wre-display); font-weight: 800; font-size: clamp(3.5rem, 10vw, 6rem); line-height: 1; color: var(--wre-acid); letter-spacing: -.03em; margin: .6rem 0 .2rem; }
.wre-piaz-tappe { display: grid; gap: .4rem; max-width: 560px; margin: 1.2rem auto 0; text-align: left; }
.wre-piaz-tappe .riga { display: grid; grid-template-columns: 3rem 1fr auto auto; gap: .8rem; align-items: center; padding: .55rem .9rem; border: 1px solid var(--wre-line); border-radius: 12px; background: var(--wre-bg-2); }
.wre-piaz-tappe .riga b { font-family: var(--wre-display); font-size: 1.2rem; }
.wre-piaz-tappe .riga.ok { border-color: rgba(198,255,61,.35); }
.wre-piaz-tappe .riga.ko { border-color: rgba(255,90,95,.35); }

/* pannello admin */
.wre-admin-tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin: -.4rem 0 1.2rem; }
.wre-admin-tabs a { padding: .45rem .9rem; border-radius: 99px; border: 1px solid var(--wre-line-2); color: var(--wre-muted); font-weight: 600; font-size: .9rem; }
.wre-admin-tabs a:hover { color: var(--wre-text); }
.wre-admin-tabs a.attivo { color: var(--wre-acid-ink); background: var(--wre-acid); border-color: var(--wre-acid); }
.wre-admin-tab { width: 100%; border-collapse: collapse; font-size: .9rem; }
.wre-admin-tab th { text-align: left; font-family: var(--wre-mono); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: var(--wre-muted); padding: .6rem .7rem; border-bottom: 1px solid var(--wre-line-2); white-space: nowrap; }
.wre-admin-tab td { padding: .55rem .7rem; border-bottom: 1px solid var(--wre-line); vertical-align: middle; }
.wre-admin-tab tr[data-item] { cursor: pointer; }
.wre-admin-tab tr[data-item]:hover td { background: rgba(255,255,255,.03); }
.wre-admin-tab tr.spento td { opacity: .5; }
.wre-admin-tab .en-q { color: var(--wre-en); }
.wre-admin-tab .form-select-sm { width: auto; background-color: var(--wre-bg-2); color: var(--wre-text); border-color: var(--wre-line-2); }
.wre-admin-barra { width: 70px; height: 6px; border-radius: 99px; background: var(--wre-line); overflow: hidden; display: inline-block; vertical-align: middle; margin-right: .4rem; }
.wre-admin-barra i { display: block; height: 100%; border-radius: 99px; }
.wre-admin-grafico { display: grid; grid-template-columns: repeat(30, 1fr); gap: 3px; height: 160px; align-items: end; }
.wre-admin-grafico .col { position: relative; height: 100%; display: flex; align-items: flex-end; justify-content: center; gap: 1px; padding-bottom: 16px; }
.wre-admin-grafico .col i { display: block; width: 45%; border-radius: 3px 3px 0 0; min-height: 1px; }
.wre-admin-grafico .col i.r { background: var(--wre-en); }
.wre-admin-grafico .col i.u { background: var(--wre-acid); }
.wre-admin-grafico .col span { position: absolute; bottom: 0; font-family: var(--wre-mono); font-size: .58rem; color: var(--wre-muted); }
.leg { display: inline-block; width: .7rem; height: .7rem; border-radius: 2px; vertical-align: middle; margin-right: .2rem; }
.leg.r { background: var(--wre-en); } .leg.u { background: var(--wre-acid); }
.wre-admin-pannello { position: fixed; inset: 0; z-index: 90; background: rgba(0,0,0,.55); display: flex; justify-content: flex-end; }
.wre-admin-pannello[hidden] { display: none; }
.wre-admin-pannello .dentro { width: min(720px, 100%); height: 100%; overflow-y: auto; background: var(--wre-card); border-left: 1px solid var(--wre-line-2); padding: 1.4rem 1.6rem; animation: wre-sale .25s ease both; }
.wre-admin-pannello h4 { font-size: 1rem; }
.wre-admin-pannello textarea.mono { font-size: .82rem; }
.wre-admin-filtri { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.wre-admin-filtri .form-control, .wre-admin-filtri .form-select { width: auto !important; min-width: 150px; flex: 0 1 auto; }
.wre-admin-filtri input[type=search] { min-width: 240px; }
.wre-admin-tab.domande td:first-child { white-space: nowrap; }

/* --- admin: visite --- */
.wre-admin-periodo { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin: 0 0 1.2rem; }
.wre-admin-periodo a { padding: .3rem .75rem; border-radius: 99px; border: 1px solid var(--wre-line-2); color: var(--wre-muted); font-size: .85rem; font-weight: 600; }
.wre-admin-periodo a:hover { color: var(--wre-text); }
.wre-admin-periodo a.attivo { color: var(--wre-text); border-color: var(--wre-en); background: rgba(255,255,255,.04); }
.wre-admin-barre td { vertical-align: middle; }
.wre-admin-barre .num, .wre-admin-barre th.num { text-align: right; white-space: nowrap; width: 1%; }
.wre-admin-barre .nome { font-size: .88rem; word-break: break-all; }
.wre-admin-barre .barra { height: 4px; background: var(--wre-line-2); border-radius: 2px; margin-top: .25rem; }
.wre-admin-barre .barra i { display: block; height: 100%; background: var(--wre-en); border-radius: 2px; }
.wre-admin-ore { height: 110px; }
.wre-admin-ore .col i { width: 70%; }

/* --- admin: email --- */
.wre-email-anteprima { width: 100%; height: 760px; border: 1px solid var(--wre-line-2); border-radius: 14px; background: #0A0A0B; }

/* --- attestati --- */
.wre-attestati { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.wre-att { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.3rem; text-align: center; opacity: .55; }
.wre-att.ottenuto { opacity: 1; border-color: var(--wre-line-2); }
.wre-att .bollo { width: 74px; height: 74px; margin: 0 auto .8rem; border-radius: 50%; display: grid; place-items: center; font-family: var(--wre-display); font-weight: 800; font-size: 1.7rem; color: var(--wre-acid-ink); border: 2px dashed var(--wre-line-2); }
.wre-att:not(.ottenuto) .bollo { color: var(--wre-muted); }
.wre-att.ottenuto .bollo { border: 3px solid var(--wre-bg); box-shadow: 0 0 0 2px var(--wre-line-2); }
.wre-att h4 { font-size: 1.05rem; margin: 0; }
.wre-att .dati { display: flex; justify-content: center; gap: .9rem; margin-top: .8rem; font-size: .85rem; color: var(--wre-muted); }
.wre-att .codice { margin-top: .3rem; font-size: .8rem; color: var(--wre-muted); letter-spacing: .06em; }
.wre-att .azioni { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin-top: 1rem; }
.wre-att .bloccato { margin-top: 1rem; font-size: .85rem; color: var(--wre-muted); }
.wre-attestato-bollo { width: 84px; height: 84px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; font-family: var(--wre-display); font-weight: 800; font-size: 2rem; color: #0A0A0B; }

/* =====================================================================
   PAGINE PUBBLICHE DEI LIVELLI (Livello.aspx, LivelliInglese.aspx)
   ===================================================================== */
.wre-briciole { font-family: var(--wre-mono); font-size: .76rem; color: var(--wre-muted); margin-bottom: 2rem; display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.wre-briciole a { color: var(--wre-muted); }
.wre-briciole a:hover { color: var(--wre-text); }
.wre-briciole b { color: var(--wre-text); font-weight: 600; }

.wre-liv-hero h1 em { color: var(--c, var(--wre-acid)); }
.wre-liv-hero h1 em::after { background: var(--c, var(--wre-acid)); }
.wre-liv-hero .wre-eyebrow .dot { background: var(--c, var(--wre-acid)); }
.wre-liv-perchi { color: var(--wre-muted); max-width: 40rem; }
.wre-liv-perchi b { color: var(--wre-text); }

.wre-liv-scheda { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: var(--wre-radius); padding: 1.8rem; text-align: center; position: relative; overflow: hidden; }
.wre-liv-scheda::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--c, var(--wre-acid)); }
.wre-liv-scheda .bollo { width: 112px; height: 112px; margin: .4rem auto 1rem; border-radius: 50%; display: grid; place-items: center; background: var(--c, var(--wre-acid)); color: var(--wre-acid-ink); font-family: var(--wre-mono); font-weight: 800; font-size: 2.3rem; box-shadow: 0 0 0 8px rgba(255,255,255,.04), 0 18px 50px -18px var(--c, var(--wre-acid)); }
.wre-liv-scheda .missione { font-family: var(--wre-display); font-weight: 800; font-size: 1.3rem; margin-bottom: 1.2rem; }
.wre-liv-scheda dl { margin: 0; display: grid; gap: .1rem; text-align: left; }
.wre-liv-scheda dl div { display: flex; justify-content: space-between; padding: .55rem 0; border-top: 1px solid var(--wre-line); }
.wre-liv-scheda dt { font-family: var(--wre-mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--wre-muted); font-weight: 500; }
.wre-liv-scheda dd { margin: 0; font-family: var(--wre-mono); font-weight: 700; }

.wre-liv-saifare { list-style: none; padding: 0; margin: 2rem 0 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.wre-liv-saifare li { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 14px; padding: 1.1rem 1.2rem 1.1rem 3.1rem; position: relative; color: #D4D4DA; }
.wre-liv-saifare li::before { content: "✓"; position: absolute; left: 1.05rem; top: 1rem; width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; background: var(--c, var(--wre-acid)); color: var(--wre-acid-ink); font-weight: 800; font-size: .8rem; }

.wre-liv-modulo .testa { display: flex; align-items: center; gap: .8rem; }
.wre-liv-modulo .icona { font-size: 1.6rem; width: 2.8rem; height: 2.8rem; border-radius: 12px; display: grid; place-items: center; background: var(--wre-card-2); border: 1px solid var(--wre-line); }
.wre-liv-modulo h3 { color: var(--wre-text); }
.wre-liv-modulo ol { list-style: none; counter-reset: lez; padding: 0; margin: 1.1rem 0 0; display: grid; gap: .7rem; }
.wre-liv-modulo ol li { counter-increment: lez; position: relative; padding-left: 2.1rem; font-size: .92rem; color: #B8B8C0; }
.wre-liv-modulo ol li::before { content: counter(lez); position: absolute; left: 0; top: .05rem; width: 1.45rem; height: 1.45rem; border-radius: 7px; border: 1px solid var(--c, var(--wre-acid)); color: var(--c, var(--wre-acid)); font-family: var(--wre-mono); font-size: .72rem; font-weight: 700; display: grid; place-items: center; }
.wre-liv-modulo ol li b { display: block; color: var(--wre-en); font-weight: 600; }

.wre-liv-tabella { margin-top: 2rem; border: 1px solid var(--wre-line); border-radius: var(--wre-radius); overflow-x: auto; background: var(--wre-card); }
.wre-liv-tabella .table { margin: 0; --bs-table-bg: transparent; --bs-table-color: var(--wre-text); --bs-table-border-color: var(--wre-line); min-width: 560px; }
.wre-liv-tabella th, .wre-liv-tabella td { padding: .95rem 1.2rem; vertical-align: middle; }
.wre-liv-tabella thead th { font-family: var(--wre-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--wre-muted); font-weight: 500; }
.wre-liv-tabella tbody tr:last-child > * { border-bottom: 0; }
.wre-liv-tabella .liv { display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--c, var(--wre-acid)); color: var(--wre-acid-ink); font-family: var(--wre-mono); font-weight: 800; }

.wre-faq { margin-top: 2rem; display: grid; gap: .8rem; max-width: 52rem; }
.wre-faq details { background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 14px; padding: 0 1.3rem; transition: border-color .2s ease; }
.wre-faq details[open] { border-color: var(--wre-line-2); }
.wre-faq summary { cursor: pointer; list-style: none; padding: 1.1rem 2rem 1.1rem 0; font-weight: 600; position: relative; }
.wre-faq summary::-webkit-details-marker { display: none; }
.wre-faq summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-family: var(--wre-mono); font-size: 1.3rem; color: var(--c, var(--wre-acid)); transition: transform .2s ease; }
.wre-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.wre-faq details p { color: #B8B8C0; margin: 0 0 1.2rem; }

.wre-liv-vicini { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; }
.wre-liv-vicini a { display: block; background: var(--wre-card); border: 1px solid var(--wre-line); border-radius: 14px; padding: 1rem 1.3rem; color: var(--wre-text); transition: border-color .2s ease; }
.wre-liv-vicini a:hover { border-color: var(--c, var(--wre-line-2)); color: var(--wre-text); }
.wre-liv-vicini a.dopo { text-align: right; }
.wre-liv-vicini a.tutti { text-align: center; }
.wre-liv-vicini small { display: block; font-family: var(--wre-mono); font-size: .72rem; color: var(--wre-muted); letter-spacing: .06em; }
.wre-liv-vicini b { color: var(--c, var(--wre-text)); }
@media (max-width: 767.98px) { .wre-liv-vicini { grid-template-columns: 1fr; } .wre-liv-vicini a.dopo, .wre-liv-vicini a.tutti { text-align: left; } }

.wre-liv-fasce .wre-card h3 { margin-top: .4rem; }
.wre-liv-carta { display: flex; flex-direction: column; color: var(--wre-text); }
.wre-liv-carta:hover { color: var(--wre-text); border-color: var(--c, var(--wre-line-2)); }
.wre-liv-carta .testa { display: flex; align-items: center; gap: .9rem; }
.wre-liv-carta .bollo { width: 3.3rem; height: 3.3rem; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--c, var(--wre-acid)); color: var(--wre-acid-ink); font-family: var(--wre-mono); font-weight: 800; font-size: 1.05rem; }
.wre-liv-carta h3 { font-size: 1.25rem; }
.wre-liv-carta p { flex: 1; }
.wre-liv-carta .chip { align-self: flex-start; }
.wre-liv-carta .vai { margin-top: 1rem; font-weight: 600; color: var(--c, var(--wre-acid)); }

.wre-fermata .programma { display: inline-block; margin-top: .45rem; font-size: .82rem; font-weight: 600; color: var(--c, var(--wre-acid)); }
.wre-footer-livelli { display: flex; flex-wrap: wrap; gap: .4rem 1.3rem; padding-bottom: 1.4rem; margin-bottom: 1.4rem; border-bottom: 1px solid var(--wre-line); font-size: .86rem; }
.wre-footer-livelli a { color: var(--wre-muted); }
.wre-footer-livelli a:hover { color: var(--wre-text); }
/* sui telefoni il gutter g-5 (3rem) sporgeva di 12px oltre lo schermo */
@media (max-width: 575.98px) { .row.g-5 { --bs-gutter-x: 1.5rem; } }