/* Style commun : surfaces planes, bordures fines et états accessibles. */
*,*::before,*::after{box-shadow:none!important;text-shadow:none!important}
:root{--shadow:none;--shadow-lg:none}
#main .card,#main .kpi,#main .shr-card,.art,.etape,.astuce,.attention{border:1px solid var(--bd,#3a2862);border-radius:11px}
#main .card,#main .kpi,#main .shr-card,.art,.etape{background:var(--c1,#180d2c)}
:where(.card,.kpi,.shr-card,.design-card,.btn,button,.ni,nav.som a,.etape){transition:background-color .18s ease,border-color .18s ease,color .18s ease}
@media(hover:hover){
  #main .card:hover,#main .kpi:hover,#main .shr-card:hover,.art .etape:hover,body:has(.som) .card:hover{border-color:var(--accent,#9d5bc7);background:var(--c2,#20133c);transform:none}
  :where(button,.btn):not(:disabled):hover{border-color:var(--accent,#9d5bc7)}
}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--accent,#9d5bc7)!important;outline-offset:3px}
.design-card.sel{outline:2px solid var(--y,#c8e000);outline-offset:2px}
nav.som a.on{border:1px solid var(--accent);background:var(--c2)}
.astuce,.attention{border-left-width:1px}
@media print{.art,.etape{background:#fff;color:#111}.art{border:none}.etape,.astuce,.attention{border-color:#999}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}