/* mod_paletvendeen — (C) 2026 Éric Wolf — Compostons Ensemble à Grosbreuil — GPL-2.0-or-later */
.pv-game{
  --green-900:#16301f; --green-800:#1f4229; --green-700:#2b5a37; --green-500:#4f8a4a;
  --amber-500:#e0a12b; --amber-300:#f3cd6b; --cream:#f6f1e3; --ink:#1b1d1a;
  --radius:14px;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
.pv-game,.pv-game *,.pv-game *::before,.pv-game *::after{box-sizing:border-box}
.pv-game{display:flex;flex-direction:column;position:relative;width:100%;height:min(var(--pv-h,700px),92vh);height:min(var(--pv-h,700px),92dvh);min-height:420px;
  overflow:hidden;border-radius:var(--radius);background:var(--green-900);color:var(--cream);font-family:var(--sans);font-size:16px;line-height:1.35;text-align:left;
  user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.pv-game.pv-full{position:fixed;inset:0;z-index:100000;height:100vh;height:100dvh;border-radius:0}
.pv-game button{text-transform:none;letter-spacing:normal;min-height:0}
.pv-game canvas{max-width:none}

/* ---- tableau de marque ---- */
#pv-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:8px;padding:8px 10px;
  background:linear-gradient(#1d3d27,#16301f);border-bottom:1px solid rgba(255,255,255,.08)}
.pv-team{display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;
  padding:6px 12px;border-radius:var(--radius);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);
  transition:background .3s,border-color .3s,box-shadow .3s;min-width:0}
.pv-team.pv-t1{grid-template-columns:auto 1fr auto;direction:rtl}
.pv-team.pv-t1>*{direction:ltr}
.pv-team.pv-turn{background:rgba(243,205,107,.13);border-color:rgba(243,205,107,.55);box-shadow:0 0 0 1px rgba(243,205,107,.15) inset}
.pv-chip{grid-row:1/3;width:30px;height:30px;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.45),inset 0 0 0 2px rgba(255,255,255,.18)}
.pv-t0 .pv-chip{background:conic-gradient(#f8e39a,#b28328,#f3d57a,#8f6a1f,#f6dd8a,#b8892e,#f8e39a)}
.pv-t1 .pv-chip{background:conic-gradient(#9fb0c2,#39424e,#8794a3,#262d36,#93a2b3,#3b4652,#9fb0c2)}
.pv-nm{font-weight:650;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv-t1 .pv-nm,.pv-t1 .pv-sub{text-align:right}
.pv-sub{display:flex;gap:8px;align-items:center;font-size:12px;color:rgba(246,241,227,.72);min-height:16px;white-space:nowrap}
.pv-t1 .pv-sub{justify-content:flex-end;flex-direction:row-reverse}
.pv-dots{display:inline-flex;gap:3px}
.pv-dots i{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.9}
.pv-dots i.pv-u{opacity:.2}
.pv-t0 .pv-dots{color:#e9c35c}.pv-t1 .pv-dots{color:#9fb0c2}
.pv-best b{color:var(--amber-300);font-weight:650}
.pv-sc{grid-row:1/3;font-family:var(--serif);font-size:34px;font-weight:700;line-height:1;min-width:1.3em;text-align:center;
  font-variant-numeric:tabular-nums;transition:transform .35s}
.pv-sc.pv-bump{transform:scale(1.35);color:var(--amber-300)}
.pv-mid{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 6px;text-align:center}
#pv-roundLbl{font-family:var(--serif);font-size:15px;font-weight:700;letter-spacing:.02em}
#pv-goalLbl{font-size:11px;color:rgba(246,241,227,.6)}

/* ---- scène ---- */
#pv-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#2f5d33}
#pv-cv{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}
#pv-msg{position:absolute;left:50%;top:12px;transform:translateX(-50%);max-width:min(92%,640px);padding:8px 16px;border-radius:999px;
  background:rgba(16,34,22,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.14);
  font-size:15px;font-weight:600;text-align:center;pointer-events:none;transition:opacity .3s;box-shadow:0 6px 18px rgba(0,0,0,.25)}
#pv-msg small{display:block;font-weight:400;font-size:12px;color:rgba(246,241,227,.75);margin-top:1px}
#pv-msg:empty{opacity:0}
#pv-nextBtn{position:absolute;left:50%;bottom:22px;transform:translateX(-50%)}
.pv-btn{font:600 15px var(--sans);color:var(--ink);background:linear-gradient(#f6d77c,#e0a12b);border:0;border-radius:999px;
  padding:11px 22px;cursor:pointer;box-shadow:0 6px 16px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.5)}
.pv-btn:hover{filter:brightness(1.06)}.pv-btn:active{transform:translateY(1px)}
#pv-nextBtn:active{transform:translateX(-50%) translateY(1px)}
.pv-btn:focus-visible,.pv-gbtn:focus-visible,.pv-seg button:focus-visible{outline:2px solid #fff;outline-offset:2px}
.pv-game [hidden]{display:none!important}

/* ---- Hector, la mascotte ---- */
#pv-hector{position:absolute;left:6px;top:0;bottom:2px;z-index:6;display:flex;align-items:flex-end;pointer-events:none}
#pv-hwrap{position:relative;height:27%;min-height:84px;max-height:176px;transform-origin:50% 100%}
#pv-himg{display:block;height:100%;width:auto;max-width:none;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35))}
#pv-hbubble{position:absolute;left:97%;bottom:68%;width:max-content;max-width:210px;padding:7px 12px;border-radius:14px 14px 14px 3px;
  background:#fffaf0;color:#1b1d1a;font:600 13.5px/1.3 var(--sans);box-shadow:0 6px 16px rgba(0,0,0,.35);animation:pv-pop .25s ease-out}
#pv-hector.pv-hop #pv-hwrap{animation:pv-hop .75s ease-out}
#pv-hector.pv-sad #pv-hwrap{animation:pv-sad .9s ease-in-out}
#pv-ovRules:not([hidden]) ~ #pv-hector,#pv-ovHist:not([hidden]) ~ #pv-hector{display:none}
@keyframes pv-hop{0%,100%{transform:translateY(0) scale(1,1)}18%{transform:translateY(0) scale(1.06,.92)}45%{transform:translateY(-16%) scale(.96,1.05)}72%{transform:translateY(0) scale(1.04,.95)}}
@keyframes pv-sad{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}60%{transform:rotate(5deg)}}
@keyframes pv-pop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}

/* ---- barre du bas ---- */
#pv-bar{display:flex;gap:8px;justify-content:center;align-items:center;padding:7px 10px;background:#16301f;
  border-top:1px solid rgba(255,255,255,.08);flex-wrap:wrap}
.pv-gbtn{font:600 13px var(--sans);color:var(--cream);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:7px 14px;cursor:pointer}
.pv-gbtn:hover{background:rgba(255,255,255,.14)}
#pv-credit,#pv-verBar{font-size:11px;color:rgba(246,241,227,.45);margin-left:6px}
.pv-ver{margin:12px 0 0;font-size:11.5px;line-height:1.35;color:#7a7866}
.pv-short .pv-card .pv-tag{display:none}.pv-short .pv-card h1{margin-bottom:6px}

/* ---- fenêtres ---- */
.pv-ov{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:14px;
  background:radial-gradient(ellipse at center,rgba(10,24,15,.55),rgba(10,24,15,.86));z-index:5;overflow:auto}
.pv-card{width:min(100%,460px);max-height:100%;overflow:auto;background:linear-gradient(#fbf7ea,#f1e9d2);color:var(--ink);
  border-radius:20px;padding:22px 24px 20px;box-shadow:0 24px 60px rgba(0,0,0,.5);text-align:center}
.pv-card h1{font-family:var(--serif);font-size:34px;line-height:1.05;margin:0;color:var(--green-800);letter-spacing:-.01em}
.pv-card h2{font-family:var(--serif);font-size:24px;margin:0 0 8px;color:var(--green-800)}
.pv-card .pv-tag{margin:4px 0 16px;font-size:14px;color:#5b5a4c}
.pv-row{margin:12px 0;text-align:left}
.pv-row label{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#6b6a58;margin-bottom:5px}
.pv-seg{display:flex;background:#e2d9bd;border-radius:999px;padding:3px;gap:3px}
.pv-seg button{flex:1;font:600 14px var(--sans);border:0;background:transparent;color:#4b4a3c;padding:8px 6px;border-radius:999px;cursor:pointer}
.pv-seg button.pv-on{background:var(--green-700);color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.pv-card .pv-btn{margin-top:14px;font-size:17px;padding:13px 34px}
.pv-card .pv-lnk{display:block;margin:12px auto 0;background:none;border:0;color:var(--green-700);font:600 14px var(--sans);
  text-decoration:underline;cursor:pointer}
.pv-rules{text-align:left;font-size:14.5px;line-height:1.5;color:#33342b}
.pv-rules ol{padding-left:20px;margin:8px 0}
.pv-rules li{margin:5px 0}
.pv-rules p{margin:9px 0}
.pv-big{font-family:var(--serif);font-size:56px;font-weight:700;color:var(--green-800);margin:6px 0 2px;font-variant-numeric:tabular-nums}
/* module étroit (classe posée par le script selon la largeur réelle) */
.pv-narrow .pv-sc{font-size:26px;min-width:1.1em}.pv-narrow .pv-chip{width:22px;height:22px}.pv-narrow .pv-nm{font-size:13px}
.pv-narrow .pv-team{padding:5px 8px;column-gap:6px}.pv-narrow .pv-best{display:none}
.pv-narrow #pv-msg{font-size:13.5px;padding:7px 12px}.pv-narrow #pv-credit,.pv-narrow #pv-verBar{display:none}.pv-narrow .pv-card h1{font-size:28px}
.pv-narrow #pv-goalLbl{display:none}.pv-narrow #pv-roundLbl{font-size:13px}.pv-narrow .pv-mid{padding:0 2px}
.pv-narrow .pv-dots i{width:6px;height:6px}.pv-narrow .pv-dots{gap:2px}.pv-narrow #pv-top{gap:5px;padding:6px}
.pv-narrow .pv-gbtn{font-size:12px;padding:6px 10px}.pv-narrow #pv-bar{gap:5px;padding:6px 4px}
.pv-narrow #pv-hbubble{max-width:150px;font-size:12.5px;padding:6px 10px}.pv-narrow #pv-hwrap{height:20%}
.pv-narrow .pv-ov:not([hidden]) ~ #pv-hector{display:none}
.pv-narrow .pv-ov{padding:8px}.pv-narrow .pv-card{padding:14px 16px 12px}.pv-narrow .pv-card h1{font-size:25px}.pv-narrow .pv-card .pv-tag{margin:2px 0 8px;font-size:13px}
.pv-narrow .pv-row{margin:7px 0}.pv-narrow .pv-row label{margin-bottom:3px;font-size:11px}.pv-narrow .pv-seg button{padding:6px 4px;font-size:13.5px}
.pv-narrow .pv-card .pv-btn{margin-top:8px;padding:10px 30px;font-size:16px}.pv-narrow .pv-card .pv-lnk{margin-top:8px}.pv-narrow .pv-ver{margin-top:7px;font-size:10.5px}
@media (prefers-reduced-motion:reduce){.pv-sc{transition:none}#pv-hector #pv-hwrap,#pv-hbubble{animation:none!important}}
.pv-card h1,.pv-card h2{font-weight:700;text-transform:none}
.pv-row label{float:none;width:auto}
