.asg{--asg-accent:#5b3df5;--asg-accent-soft:#f4f0ff;--asg-ink:#1d1c2b;--asg-muted:#6d6a80;
	--asg-line:#e6e3f0;--asg-warn-bg:#fff4e5;--asg-warn-line:#d98c00;--asg-warn-ink:#5a4200;
	max-width:900px;margin:0 auto;color:var(--asg-ink);line-height:1.65;}
.asg *{box-sizing:border-box;}
.asg h2{font-size:1.55em;margin:2.6em 0 .6em;padding-bottom:.3em;border-bottom:2px solid var(--asg-line);scroll-margin-top:90px;}
.asg h2 .asg-num{display:inline-block;min-width:1.9em;color:var(--asg-accent);font-weight:800;}
.asg h3{font-size:1.15em;margin:1.8em 0 .5em;}
.asg p{margin:.7em 0;}
.asg ul,.asg ol{margin:.7em 0 .7em 1.3em;padding:0;}
.asg li{margin:.35em 0;}

/* --- Chapeau --- */
.asg-hero{background:linear-gradient(135deg,#5b3df5 0%,#8f5bf5 100%);color:#fff;border-radius:12px;
	padding:26px 28px;margin-bottom:22px;}
.asg-hero h1{margin:0 0 .3em;font-size:1.7em;color:#fff;line-height:1.25;}
.asg-hero p{margin:.4em 0;color:rgba(255,255,255,.92);}
.asg-hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.asg-hero-meta span{background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);
	border-radius:999px;padding:5px 13px;font-size:.8em;font-weight:600;}

/* --- Encadrés --- */
.asg-note{background:var(--asg-accent-soft);border-left:4px solid var(--asg-accent);border-radius:6px;
	padding:14px 18px;margin:1.4em 0;font-size:.94em;}
.asg-warn{background:var(--asg-warn-bg);border:1px solid #f0c36d;border-left:4px solid var(--asg-warn-line);
	border-radius:6px;padding:14px 18px;margin:1.4em 0;font-size:.94em;color:var(--asg-warn-ink);}
.asg-warn strong,.asg-note strong{color:inherit;}
.asg-tldr{border:2px solid var(--asg-accent);border-radius:10px;padding:18px 22px;margin:0 0 26px;}
.asg-tldr h2{margin:0 0 .5em;border:0;padding:0;font-size:1.2em;}
.asg-tldr ul{margin-bottom:0;}

/* --- Sommaire --- */
.asg-toc{background:#fafaff;border:1px solid var(--asg-line);border-radius:10px;padding:18px 22px;margin:0 0 30px;}
.asg-toc strong{display:block;margin-bottom:.5em;font-size:1.02em;}
.asg-toc ol{columns:2;column-gap:26px;margin:0 0 0 1.2em;font-size:.92em;}
.asg-toc a{color:var(--asg-ink);text-decoration:none;}
.asg-toc a:hover{color:var(--asg-accent);text-decoration:underline;}

/* --- Tableaux --- */
.asg-table-wrap{overflow-x:auto;margin:1.2em 0;}
.asg table{border-collapse:collapse;width:100%;font-size:.9em;min-width:520px;}
.asg th,.asg td{border:1px solid var(--asg-line);padding:8px 11px;text-align:left;vertical-align:top;}
.asg th{background:var(--asg-accent-soft);font-weight:700;}
.asg tbody tr:nth-child(even){background:#fbfaff;}

/* --- Puces d'élément --- */
.asg-el{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 11px;
	font-size:.82em;font-weight:700;color:#fff;white-space:nowrap;}
.asg-el-feu{background:#e8622a;}      .asg-el-eau{background:#2f83d6;}
.asg-el-plante{background:#4ea34e;}   .asg-el-foudre{background:#d9a800;color:#3a2f00;}
.asg-el-glace{background:#57b6c7;}    .asg-el-roche{background:#9c7f4e;}
.asg-el-vent{background:#59a98f;}      .asg-el-sacre{background:#c9a227;}
.asg-el-tenebres{background:#5a4a78;}
.asg-el-list{display:flex;flex-wrap:wrap;gap:7px;margin:1em 0;}

/* --- Grille de rôles / d'Aniimo --- */
.asg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px;margin:1.3em 0;}
.asg-card{border:1px solid var(--asg-line);border-radius:10px;padding:12px;text-align:center;
	background:#fff;text-decoration:none;color:inherit;display:block;transition:border-color .15s,transform .15s;}
.asg-card:hover{border-color:var(--asg-accent);transform:translateY(-2px);}
.asg-card img{width:100%;max-width:104px;height:auto;margin:0 auto 6px;display:block;}
.asg-card-name{display:block;font-weight:700;font-size:.95em;}
.asg-card-role{display:block;font-size:.76em;color:var(--asg-muted);margin-top:2px;}
.asg-card-why{display:block;font-size:.78em;color:var(--asg-muted);margin-top:6px;line-height:1.4;}
.asg-card .asg-el{margin-top:5px;font-size:.72em;padding:2px 9px;}

/* --- Chaîne d'évolution --- */
.asg-evo{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;
	background:#fafaff;border:1px solid var(--asg-line);border-radius:10px;padding:16px;margin:1.3em 0;}
.asg-evo-step{text-align:center;text-decoration:none;color:inherit;width:130px;}
.asg-evo-step img{width:96px;height:auto;display:block;margin:0 auto 4px;}
.asg-evo-step b{display:block;font-size:.9em;}
.asg-evo-step small{color:var(--asg-muted);font-size:.76em;}
.asg-evo-arrow{color:var(--asg-accent);font-size:1.5em;font-weight:700;}

/* --- Checklist --- */
.asg-check{list-style:none;margin:1.2em 0;padding:0;}
.asg-check li{position:relative;padding:9px 0 9px 34px;border-bottom:1px solid var(--asg-line);margin:0;}
.asg-check li:last-child{border-bottom:0;}
.asg-check li::before{content:"";position:absolute;left:4px;top:13px;width:15px;height:15px;
	border:2px solid var(--asg-accent);border-radius:4px;}

/* --- Étapes numérotées --- */
.asg-steps{list-style:none;counter-reset:asg;margin:1.3em 0;padding:0;}
.asg-steps li{counter-increment:asg;position:relative;padding:0 0 16px 46px;margin:0;}
.asg-steps li::before{content:counter(asg);position:absolute;left:0;top:0;width:30px;height:30px;
	background:var(--asg-accent);color:#fff;border-radius:50%;display:flex;align-items:center;
	justify-content:center;font-weight:700;font-size:.9em;}
.asg-steps li strong{display:block;margin-bottom:.15em;}

/* --- Badge de fiabilité --- */
.asg-src{font-size:.72em;font-weight:700;border-radius:4px;padding:2px 7px;vertical-align:middle;
	margin-left:6px;white-space:nowrap;}
.asg-src-ok{background:#e3f6e8;color:#1d6b32;}
.asg-src-com{background:#eef0ff;color:#3b3f9e;}
.asg-src-no{background:#fdeaea;color:#a02020;}

/* --- FAQ --- */
.asg-faq details{border:1px solid var(--asg-line);border-radius:8px;padding:12px 16px;margin:.6em 0;background:#fff;}
.asg-faq summary{cursor:pointer;font-weight:700;}
.asg-faq details[open] summary{margin-bottom:.5em;color:var(--asg-accent);}

/* --- Sources --- */
.asg-sources{font-size:.87em;color:var(--asg-muted);}
.asg-sources li{margin:.3em 0;}

@media (max-width:640px){
	.asg-toc ol{columns:1;}
	.asg-hero{padding:20px;}
	.asg-hero h1{font-size:1.35em;}
	.asg-evo-step{width:104px;}
	.asg-evo-step img{width:76px;}
}