/* School Locale · punti squadre. Token, font, logo e stripe vengono da esn.css (design-system ESN); qui solo gli stili specifici dell'app. */
:root{
  /* alias app -> token del design system */
  --bg2:var(--surface);--input-bg:var(--bg);--pts:var(--accent-ink);--rank-bg:var(--line);--rank-ink:var(--ink);
  --chip-bg:rgba(0,174,239,.15);--chip-ink:#7fd8ff;--tool-bd:#4a50b5;--tool-ink:#fff;--tool-bg:rgba(255,255,255,.06);
  --ok-ink:#a6e07a;--err-ink:#ff9fb0;--danger-bg:rgba(236,0,140,.14);--danger-bd:var(--magenta);--danger-ink:#ff8fd2;
  --plus-bg:var(--green);--plus-ink:#10230a;
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 8px 24px rgba(0,0,0,.28);
}
:root[data-theme="light"]{
  --input-bg:#fff;--pts:#05638d;--chip-bg:#e6f6fd;--chip-ink:#05638d;--tool-bd:var(--blue);--tool-ink:var(--blue);--tool-bg:#fff;
  --ok-ink:#3f7d12;--err-ink:#b0003f;--danger-bg:#fde6f3;--danger-bd:#c4006f;--danger-ink:#a3005f;
  --plus-bg:#4f8f1d;--plus-ink:#fff;
  --shadow:0 1px 2px rgba(27,31,59,.06),0 6px 18px rgba(27,31,59,.06);
}
button{font:inherit;color:inherit}

/* header (come Fidelity Points) */
header{background:var(--bg2);padding:max(12px,env(safe-area-inset-top)) var(--pad) 18px;border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:720px;margin:0 auto}
.brand{display:block;line-height:0;max-width:56%}
.logo{height:clamp(44px,13vw,64px);width:auto;max-width:100%;display:block}
.logo-light{display:none}
:root[data-theme="light"] .logo-dark{display:none}
:root[data-theme="light"] .logo-light{display:block}
.tools{display:flex;gap:10px;flex:none}
.tool{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 16px;border:2px solid var(--tool-bd);background:var(--tool-bg);color:var(--tool-ink);font-weight:800;font-size:.95rem;border-radius:999px;cursor:pointer;touch-action:manipulation}
.tool:hover{border-color:var(--cyan)}
.tool:active{transform:scale(.96)}
.ico{display:none;width:22px;height:22px;background:currentColor}
.ico-sun{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7a5 5 0 100 10 5 5 0 000-10zm0-5h0v3m0 14v3m10-10h-3M5 12H2m16.4-7.4l-2.1 2.1M7.7 16.3l-2.1 2.1m0-12.8l2.1 2.1m8.6 8.6l2.1 2.1' stroke='%23000' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 7a5 5 0 100 10 5 5 0 000-10zm0-5h0v3m0 14v3m10-10h-3M5 12H2m16.4-7.4l-2.1 2.1M7.7 16.3l-2.1 2.1m0-12.8l2.1 2.1m8.6 8.6l2.1 2.1' stroke='%23000' stroke-width='2' stroke-linecap='round' fill='none'/%3E%3C/svg%3E") center/contain no-repeat}
.ico-moon{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 14.5A9 9 0 119.5 3a7 7 0 0011.5 11.5z' fill='%23000'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 14.5A9 9 0 119.5 3a7 7 0 0011.5 11.5z' fill='%23000'/%3E%3C/svg%3E") center/contain no-repeat}
:root[data-theme="dark"] .ico-sun{display:block}
:root[data-theme="light"] .ico-moon{display:block}
.hero{max-width:720px;margin:0 auto;padding:14px 0 0}
h1{font-size:clamp(1.55rem,6.4vw,2.1rem);line-height:1.15;margin:4px 0 4px}
.sub{margin:0;color:var(--muted);font-size:1.02rem}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:14px 0 0;padding:4px;border-radius:999px;background:var(--input-bg);border:1px solid var(--line)}
.seg-link{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:999px;color:var(--muted);font-weight:700;text-decoration:none;touch-action:manipulation}
.seg-link:hover{color:var(--ink)}
.seg-link.active{background:var(--cyan);color:#06142a}

/* layout */
main{max-width:720px;margin:0 auto;padding:22px var(--pad) 8px}
section{margin-bottom:28px}
section section:last-child{margin-bottom:0}
h2{font-size:1.2rem;margin:0 0 10px;display:flex;align-items:center;gap:10px}
h2::before{content:"";flex:none;width:6px;height:1.1em;border-radius:3px;background:var(--cyan)}
#log-h::before,#admin-log-h::before{background:var(--orange)}
#manage-h::before{background:var(--magenta)}
#admin-teams-h::before{background:var(--green)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:var(--shadow)}
.hint,.empty{color:var(--muted);margin:0 0 12px;font-size:.95rem}
.status{margin:6px 2px 14px;color:var(--muted);font-size:.95rem;min-height:1.4em}
.error{color:var(--err-ink);margin:12px 0 0;font-weight:600}

/* stato live (chip come "Ultimo aggiornamento") */
.live{display:flex;align-items:center;gap:10px;margin:0 0 14px;padding:10px 14px;border-radius:12px;background:var(--chip-bg);color:var(--chip-ink);border:1px solid var(--cyan);font-weight:700;font-size:.95rem;line-height:1.3}
.dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--green);}

/* classifica */
ul,ol{list-style:none;padding:0;margin:0}
.board{display:flex;flex-direction:column;gap:10px}
.team-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px 12px;min-height:72px;padding:12px 16px 12px 14px;background:var(--card);border:1px solid var(--line);border-left:6px solid var(--team,var(--cyan));border-radius:14px;box-shadow:var(--shadow)}
.rank{min-width:46px;text-align:center;font-weight:800;color:var(--rank-ink);background:var(--rank-bg);border-radius:999px;padding:5px 10px;font-size:.95rem;font-variant-numeric:tabular-nums}
.rank.r1{background:var(--accent);color:var(--on-accent)}
.log-public{margin-top:28px}
.team{display:flex;align-items:center;gap:10px;min-width:0}
.swatch-dot{flex:none;width:16px;height:16px;border-radius:50%;background:var(--team,var(--cyan));box-shadow:0 0 0 2px rgba(255,255,255,.15)}
.team-card{background:color-mix(in srgb,var(--team,var(--cyan)) 8%,var(--card))}
.team-name{margin:0;font-weight:700;font-size:1.08rem;line-height:1.25;overflow-wrap:anywhere}
.points{font-family:var(--font-head);font-weight:700;color:var(--pts);font-size:clamp(1.7rem,7vw,2.2rem);line-height:1;text-align:right;font-variant-numeric:tabular-nums;min-width:2ch}
.points span{display:block;margin-top:2px;font-size:.75rem;font-weight:700;color:var(--muted);}

/* storico */
.log{display:flex;flex-direction:column}
.log li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:.96rem}
.log li:last-child{border-bottom:0}
.log-public .log{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:2px 14px;box-shadow:var(--shadow)}
.log .who{overflow-wrap:anywhere}
.delta-pos{color:var(--ok-ink);font-weight:800}
.delta-neg{color:var(--err-ink);font-weight:800}
.when{flex:none;color:var(--muted);font-size:.82rem;white-space:nowrap;font-variant-numeric:tabular-nums}
#admin-log{margin-bottom:12px}

/* bottoni (come Guida) */
.btn{min-height:48px;padding:8px 18px;border-color:var(--tool-bd);background:var(--tool-bg);color:var(--tool-ink);font-size:.95rem;touch-action:manipulation}
.btn:hover{border-color:var(--cyan)}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.primary{background:var(--magenta);border-color:var(--magenta);color:#fff}
.btn.danger{background:var(--danger-bg);border-color:var(--danger-bd);color:var(--danger-ink)}
.btn.ghost{border-style:dashed;font-weight:600}
.btn.sm{min-height:44px;padding:6px 14px;font-size:.9rem}
.btn-block{width:100%}

/* login */
.login-card{max-width:440px;margin:0 auto}
.label{display:block;font-weight:700;font-size:.9rem;margin:0 0 6px}
.field{display:block;width:100%;min-height:52px;padding:12px 16px;border:2px solid var(--cyan);border-radius:14px;background:var(--input-bg);color:var(--ink);font-size:1.0625rem;-webkit-appearance:none;appearance:none}
.field::placeholder{color:var(--muted);opacity:.85}
.field:focus{border-color:var(--magenta);outline:none;box-shadow:0 0 0 4px rgba(236,0,140,.25)}
#login-form .field{margin-bottom:14px}

/* admin */
.admin-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 4px}
.admin-ok{display:flex;align-items:center;gap:8px;margin:0;min-width:0;color:var(--ok-ink);font-weight:700;font-size:.92rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.admin-ok #admin-email{overflow:hidden;text-overflow:ellipsis}
.admin-grid{display:grid;gap:10px}
.admin-team{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-left:6px solid var(--team,var(--cyan));border-radius:14px;box-shadow:var(--shadow)}
.admin-team .team-name{font-size:1.02rem}
.admin-team .score{margin:2px 0 0;font-family:var(--font-head);font-size:2rem;font-weight:700;line-height:1;color:var(--pts);font-variant-numeric:tabular-nums}
.admin-actions{display:flex;gap:10px}
.btn.plus,.btn.minus{width:60px;height:60px;min-height:60px;padding:0;border-radius:50%;font-size:1.9rem;font-weight:800;line-height:1}
.btn.plus{background:var(--team,var(--plus-bg));border-color:var(--team,var(--plus-bg));color:var(--team-ink,var(--plus-ink))}
.btn.minus{background:transparent;border-color:var(--danger-bd);color:var(--danger-ink)}

.manage-list{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.manage-row{display:grid;grid-template-columns:52px 1fr;grid-template-areas:"c n" "a a";gap:8px;padding-bottom:12px;border-bottom:1px solid var(--line);margin:0}
.manage-row .swatch-fixed{grid-area:c;width:52px;height:48px;border-radius:12px;background:var(--team);border:2px solid var(--line)}
.btn.team-btn{background:var(--team);border-color:var(--team);color:var(--team-ink)}
.manage-row .row-acts .btn{flex:1}
.manage-row .field{grid-area:n;min-height:48px;padding:10px 14px;font-size:1rem}
.manage-row .row-acts{grid-area:a;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.swatch{width:52px;height:48px;padding:3px;border:2px solid var(--tool-bd);border-radius:12px;background:var(--input-bg);cursor:pointer}
.swatch::-webkit-color-swatch-wrapper{padding:0}
.swatch::-webkit-color-swatch{border:0;border-radius:8px}
.swatch::-moz-color-swatch{border:0;border-radius:8px}
.danger-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;padding-top:12px;border-top:1px dashed var(--line)}

footer{max-width:720px;margin:0 auto;padding:4px var(--pad) calc(32px + env(safe-area-inset-bottom));font-size:.85rem;color:var(--muted)}

@media (max-width:360px){.danger-row{grid-template-columns:1fr}.btn.plus,.btn.minus{width:54px;height:54px;min-height:54px}}
@media (min-width:600px){
  main{padding-top:28px}
  .team-card{padding:14px 20px 14px 16px}
  .admin-grid{grid-template-columns:1fr 1fr}
  .manage-row{grid-template-columns:52px 1fr auto auto;grid-template-areas:"c n a a"}
  .manage-row .row-acts{display:flex}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Team Bianco: colore chiaro, serve bordo e testo scuro per essere leggibile su entrambi i temi */
[data-team="bianco"]{--team-edge:#8a8fb8}
.team-card[data-team="bianco"],.admin-team[data-team="bianco"]{border-left-color:#fff;box-shadow:inset 2px 0 0 var(--team-edge),var(--shadow)}
[data-team="bianco"] .swatch-dot{box-shadow:0 0 0 2px var(--team-edge)}
[data-team="bianco"] .btn.plus,[data-team="bianco"] .btn.team-btn,[data-team="bianco"] .swatch-fixed{border-color:var(--team-edge)}
:root[data-theme="light"] .team-card[data-team="bianco"]{background:var(--card)}
:root[data-theme="light"] [data-team="bianco"]{--team-edge:#14163a}
