:root{
  --dpro:#B8E200;
  --bg:#f6f7f9;
  --card:#ffffff;
  --muted:#475569;
  --text:#0f172a;
  --border:#e2e8f0;
  --input-bg:#f1f5f9;
  --shadow-sm:0 4px 8px rgba(0,0,0,.05);
}

*,:before,:after{box-sizing:border-box}
html,body{height:100%}
body{
  font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  margin:0;color:var(--text);background:var(--bg);line-height:1.5;
}

/* Full version (index.html) banner */
.hero{background:var(--dpro);color:#fff;padding:28px 16px;text-align:center}
.hero-inner{max-width:980px;margin:0 auto}
.logo{height:56px;width:auto;margin-bottom:8px}
h1{margin:0;font-size:1.8rem;font-weight:700;color:#fff}

/* Embed compact header */
.embed-body{background:var(--bg)}
.embed-header{max-width:980px;margin:16px auto 0;padding:0 16px;display:flex;align-items:center;gap:12px}
.logo-embed{height:40px;width:auto}
.title-embed{margin:0;font-size:1.3rem;font-weight:700;color:#0f172a}

main,.embed-main{max-width:980px;margin:16px auto 48px;padding:0 16px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:var(--shadow-sm)}
.grid{display:grid;grid-template-columns:1fr auto;gap:12px}

.form-note{
  margin:0 0 10px;
  text-align:center;
  color:var(--muted);
  font-size:.95rem;
}

input[type="text"]{width:100%;padding:12px 14px;border-radius:8px;border:1px solid var(--border);background:var(--input-bg);font-size:1rem}
button{border:0;border-radius:10px;padding:12px 18px;font-weight:800;font-size:.95rem;cursor:pointer;background:var(--dpro);color:#000;transition:transform 60ms ease,filter .15s ease}
button:hover{filter:brightness(1.05)}
button:active{transform:translateY(1px)}

.footer{margin-top:8px;font-size:.85rem;color:var(--muted)}
.signature{margin-top:6px;color:#111;font-weight:600}

.sep{height:1px;background:var(--border);margin:14px 0}

.kpi{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:end}
.kpi h3{margin:0;font-size:.95rem;color:var(--muted)}
.kpi .v{font-size:1.1rem;font-weight:700}

table{width:100%;border-collapse:collapse;margin-top:12px}
th,td{border:1px solid var(--border);padding:10px 12px;text-align:left}
th{background:var(--input-bg);font-size:.95rem}

.grade{position:relative;width:54px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}
.grade::before{content:"";position:absolute;right:-15px;top:2px;border-bottom:16px solid transparent;border-left:15px solid;border-top:16px solid transparent;height:0;width:0}
.letter{color:#fff;text-shadow:0 0 2px #000;font-weight:800;font-size:22px}

/* Palette EP (verts->rouge) */
.grade-A{background:#00a06c}.grade-A::before{border-left-color:#00a06c}
.grade-B{background:#4fb154}.grade-B::before{border-left-color:#4fb154}
.grade-C{background:#a4cc74}.grade-C::before{border-left-color:#a4cc74}
.grade-D{background:#f2e71b}.grade-D::before{border-left-color:#f2e71b}
.grade-E{background:#f0b418}.grade-E::before{border-left-color:#f0b418}
.grade-F{background:#eb8335}.grade-F::before{border-left-color:#eb8335}
.grade-G{background:#d71d20}.grade-G::before{border-left-color:#d71d20}

/* Palette GES (violet) */
.grade-ges-A{background:#b3a6ff}.grade-ges-A::before{border-left-color:#b3a6ff}
.grade-ges-B{background:#9c8fff}.grade-ges-B::before{border-left-color:#9c8fff}
.grade-ges-C{background:#867aff}.grade-ges-C::before{border-left-color:#867aff}
.grade-ges-D{background:#7065ff}.grade-ges-D::before{border-left-color:#7065ff}
.grade-ges-E{background:#5c52e6}.grade-ges-E::before{border-left-color:#5c52e6}
.grade-ges-F{background:#4a40cc}.grade-ges-F::before{border-left-color:#4a40cc}
.grade-ges-G{background:#3a30b3}.grade-ges-G::before{border-left-color:#3a30b3}

@media (width < 640px){
  .grid{grid-template-columns:auto;gap:8px}
  .kpi{align-items:start;grid-template-columns:auto;gap:4px;margin-bottom:8px}
  table td:first-child,table th:first-child{display:none}
}