/* VoltandGo Runner — styles publics */
.vgr-wrap{
	--vgr-purple:#2F0D5B;
	--vgr-purple-deep:#1B0738;
	--vgr-purple-soft:#4A2A86;
	--vgr-orange:#F4932A;
	--vgr-orange-dark:#D97A15;
	--vgr-teal:#2ED9C3;
	--vgr-ink:#221741;
	--vgr-paper:#FFFFFF;
	--vgr-stage-height:clamp(260px,38vw,400px);
	--vgr-radius:22px;
	max-width:1140px;
	margin:0 auto;
	box-sizing:border-box;
}
.vgr-wrap *,.vgr-wrap *::before,.vgr-wrap *::after{box-sizing:border-box;}

.vgr-card{
	background:linear-gradient(160deg,#2F0D5B 0%,#3D1470 45%,#24093F 100%);
	border-radius:calc(var(--vgr-radius) + 6px);
	padding:clamp(18px,3vw,34px);
	color:#fff;
	box-shadow:0 24px 60px rgba(31,8,62,.28);
	position:relative;
	overflow:hidden;
}
.vgr-card::after{
	content:"";position:absolute;right:-90px;top:-90px;width:280px;height:280px;border-radius:50%;
	background:radial-gradient(circle,rgba(46,217,195,.28),transparent 68%);pointer-events:none;
}

.vgr-head{position:relative;z-index:1;text-align:center;margin-bottom:clamp(14px,2vw,22px);}
.vgr-kicker{
	display:inline-block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
	color:var(--vgr-teal);background:rgba(46,217,195,.12);border:1px solid rgba(46,217,195,.32);
	padding:5px 14px;border-radius:999px;font-weight:700;
}
.vgr-title{
	margin:12px 0 8px;color:#fff;font-size:clamp(24px,3.4vw,40px);line-height:1.1;
	text-transform:uppercase;letter-spacing:.01em;font-weight:800;
}
.vgr-lead{margin:0 auto;max-width:640px;color:rgba(255,255,255,.82);font-size:clamp(14px,1.5vw,17px);line-height:1.5;}

/* --- Scène --- */
.vgr-stage{
	position:relative;width:100%;height:var(--vgr-stage-height);
	border-radius:var(--vgr-radius);overflow:hidden;
	background:#1B0738;border:1px solid rgba(255,255,255,.14);
	touch-action:manipulation;user-select:none;
}
.vgr-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;cursor:pointer;}

/* --- HUD --- */
.vgr-hud{
	position:absolute;inset:auto 0 auto 0;top:0;display:flex;gap:12px;align-items:center;justify-content:space-between;
	padding:12px 14px;pointer-events:none;font-size:12px;opacity:0;transition:opacity .25s;
}
.vgr-stage.is-playing .vgr-hud{opacity:1;}
.vgr-battery,.vgr-progress{display:flex;align-items:center;gap:8px;background:rgba(27,7,56,.55);backdrop-filter:blur(6px);padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.14);}
.vgr-battery-label{text-transform:uppercase;letter-spacing:.1em;font-weight:700;color:rgba(255,255,255,.7);font-size:10px;}
.vgr-battery-shell{position:relative;width:74px;height:11px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden;}
.vgr-battery-fill{position:absolute;inset:0;width:100%;background:var(--vgr-teal);border-radius:999px;transition:width .18s linear,background .3s;}
.vgr-battery-fill.is-low{background:#FF6B6B;}
.vgr-battery-fill.is-mid{background:var(--vgr-orange);}
.vgr-battery-value{font-variant-numeric:tabular-nums;font-weight:700;color:#fff;min-width:38px;}
.vgr-progress-shell{position:relative;width:110px;height:6px;border-radius:999px;background:rgba(255,255,255,.18);overflow:hidden;}
.vgr-progress-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--vgr-orange),#FFC46B);border-radius:999px;}
.vgr-progress-value{font-variant-numeric:tabular-nums;font-weight:700;color:#fff;white-space:nowrap;}
.vgr-progress-value b{font-weight:700;}

/* --- Écrans --- */
.vgr-screen{
	position:absolute;inset:0;display:none;align-items:flex-start;justify-content:center;
	padding:18px;background:rgba(21,6,44,.82);backdrop-filter:blur(7px);
	overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.vgr-screen.is-active{display:flex;}
/* margin:auto centre le bloc quand il y a la place, sans jamais rogner le haut quand il déborde */
.vgr-screen-inner{width:100%;max-width:520px;margin:auto;text-align:center;}

/* Les écrans avec formulaire agrandissent la scène : aucun champ ne peut être coupé */
.vgr-stage.has-panel{height:auto;min-height:var(--vgr-stage-height);}
.vgr-stage.has-panel .vgr-screen.is-active{position:relative;inset:auto;width:100%;}
.vgr-screen h3{margin:0 0 10px;color:#fff;font-size:clamp(19px,2.4vw,28px);font-weight:800;line-height:1.15;}
.vgr-rules{display:flex;flex-direction:column;gap:4px;margin:0 0 18px;color:rgba(255,255,255,.78);font-size:14px;}
.vgr-rules b{color:var(--vgr-teal);}
.vgr-hint{margin:12px 0 0;font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.45;}
.vgr-score{margin:0 0 16px;font-size:16px;color:var(--vgr-orange);font-weight:700;}
.vgr-lead-win{margin:0 0 16px;color:rgba(255,255,255,.85);font-size:15px;}
.vgr-lead-win b{color:var(--vgr-teal);}

/* --- Boutons --- */
.vgr-btn{
	display:inline-flex;align-items:center;justify-content:center;gap:10px;
	border:0;cursor:pointer;font:inherit;font-weight:800;letter-spacing:.02em;
	padding:14px 28px;border-radius:999px;text-decoration:none;transition:transform .15s,box-shadow .15s,background .2s;
	font-size:15px;line-height:1;
}
.vgr-btn--primary{background:var(--vgr-orange);color:#fff;box-shadow:0 10px 24px rgba(244,147,42,.32);}
.vgr-btn--primary:hover{background:var(--vgr-orange-dark);color:#fff;transform:translateY(-1px);}
.vgr-btn--full{width:100%;}
.vgr-btn[disabled]{opacity:.65;cursor:progress;transform:none;}

/* --- Formulaire --- */
.vgr-form{text-align:left;margin-top:6px;}
.vgr-field-row{display:flex;gap:10px;margin-bottom:10px;}
.vgr-field{flex:1 1 0;display:flex;flex-direction:column;gap:5px;min-width:0;}
.vgr-field span{font-size:12px;font-weight:700;color:rgba(255,255,255,.78);letter-spacing:.04em;}
.vgr-field i{color:var(--vgr-orange);font-style:normal;}
.vgr-field input{
	width:100%;padding:11px 13px;border-radius:12px;border:1px solid rgba(255,255,255,.22);
	background:rgba(255,255,255,.07);color:#fff;font:inherit;font-size:15px;outline:none;
}
.vgr-field input::placeholder{color:rgba(255,255,255,.38);}
.vgr-field input:focus{border-color:var(--vgr-teal);box-shadow:0 0 0 3px rgba(46,217,195,.18);background:rgba(255,255,255,.1);}
.vgr-field input.has-error{border-color:#FF6B6B;box-shadow:0 0 0 3px rgba(255,107,107,.16);}

.vgr-consent{display:flex;gap:10px;align-items:flex-start;margin:6px 0 12px;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.76);cursor:pointer;}
.vgr-consent input{margin:2px 0 0;width:17px;height:17px;flex:0 0 auto;accent-color:var(--vgr-orange);cursor:pointer;}
.vgr-consent a{color:var(--vgr-teal);text-decoration:underline;}
.vgr-consent.has-error span{color:#FFB3B3;}

.vgr-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.vgr-error{margin:0 0 10px;color:#FFB3B3;font-size:13px;min-height:0;}
.vgr-error:empty{margin:0;}

.vgr-spinner{display:none;width:15px;height:15px;border-radius:50%;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;animation:vgr-spin .7s linear infinite;}
.vgr-btn.is-loading .vgr-spinner{display:inline-block;}
@keyframes vgr-spin{to{transform:rotate(360deg);}}

/* --- Code promo --- */
.vgr-code{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:14px 0 12px;}
.vgr-code code{
	font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(20px,3vw,28px);font-weight:700;
	letter-spacing:.12em;color:#fff;background:rgba(46,217,195,.12);
	border:2px dashed var(--vgr-teal);border-radius:14px;padding:12px 20px;
}
.vgr-copy{
	border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:inherit;font-size:13px;font-weight:700;
	padding:10px 16px;border-radius:999px;cursor:pointer;transition:background .2s;
}
.vgr-copy:hover{background:rgba(255,255,255,.12);}
.vgr-hint.is-sent{color:rgba(255,255,255,.88);background:rgba(46,217,195,.12);border:1px solid rgba(46,217,195,.32);border-radius:12px;padding:10px 14px;font-size:13px;}
.vgr-hint.is-sent b{color:var(--vgr-teal);display:block;margin-bottom:2px;}

.vgr-code-meta{margin:0 0 14px;font-size:13.5px;color:rgba(255,255,255,.8);}
.vgr-code-meta b{color:var(--vgr-orange);}
.vgr-code-scope{display:inline-block;margin-top:4px;font-size:12.5px;color:rgba(255,255,255,.62);}

.vgr-replay{background:none;border:0;color:rgba(255,255,255,.6);font:inherit;font-size:12.5px;text-decoration:underline;cursor:pointer;padding:6px;margin-top:4px;}
.vgr-replay:hover{color:#fff;}

.vgr-legal{margin:14px 0 0;text-align:center;font-size:11.5px;line-height:1.5;color:rgba(255,255,255,.55);position:relative;z-index:1;}
.vgr-legal a{color:rgba(255,255,255,.8);}

@media (max-width:640px){
	.vgr-wrap{--vgr-stage-height:clamp(280px,64vw,340px);}
	.vgr-field-row{flex-direction:column;gap:10px;}
	.vgr-hud{font-size:11px;padding:9px 10px;gap:8px;}
	.vgr-battery-label{display:none;}
	.vgr-battery-shell{width:54px;}
	.vgr-progress-shell{width:64px;}
	.vgr-progress-value .vgr-of{display:none;}
	.vgr-btn{width:100%;}
	.vgr-code code{width:100%;}
}

@media (prefers-reduced-motion:reduce){
	.vgr-btn,.vgr-battery-fill{transition:none;}
	.vgr-spinner{animation-duration:2s;}
}
