/* Virgule — Jouer art direction
   Direction: Training Room / score sheet.
   The page is an instrument panel, not a game-card dashboard.
*/
.jouer-art-direction{--jr-rule:rgba(232,245,232,.14);--jr-rule-strong:rgba(217,168,87,.42)}
.jouer-art-direction .wrap{max-width:900px;padding:clamp(44px,7vw,88px) clamp(20px,5vw,56px) 100px}
.jouer-art-direction .jouer-intro{position:relative;padding:0 0 34px;border-bottom:1px solid var(--jr-rule);margin-bottom:0}
.jouer-art-direction .jouer-intro::after{content:"";position:absolute;inset-inline-end:0;bottom:-1px;width:92px;height:1px;background:var(--craie-doree);transform-origin:100% 50%}
.jouer-art-direction .app-kicker{display:block;font:500 11px/1.2 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--craie-doree);margin-bottom:16px}
.jouer-art-direction .app-title{max-width:780px;font-size:clamp(38px,7vw,76px);line-height:.96;letter-spacing:-.045em;font-weight:400}
.jouer-art-direction .jouer-lead{max-width:590px;margin-top:22px;color:var(--craie-pale-vive);font-size:clamp(15px,2vw,18px);line-height:1.6}
.jouer-art-direction .pageSub{margin:0;padding:22px 0 16px;border-bottom:1px solid var(--jr-rule);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--craie-pale);font-family:var(--font-mono)}
.jouer-art-direction .modes{display:grid;grid-template-columns:1fr 1fr;gap:0;border-inline:1px solid var(--jr-rule)}
.jouer-art-direction .mode{position:relative;min-height:190px;border:0;border-bottom:1px solid var(--jr-rule);border-radius:0;background:transparent;padding:28px 28px 24px 24px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto 1fr;column-gap:18px;align-content:start;text-align:start;transition:background .2s ease,transform .2s ease}
.jouer-art-direction .mode:nth-child(odd){border-inline-end:1px solid var(--jr-rule)}
.jouer-art-direction .mode:nth-child(-n+2){border-top:1px solid var(--jr-rule)}
.jouer-art-direction .mode:hover,.jouer-art-direction .mode:focus-visible{background:rgba(217,168,87,.055);transform:translateY(-2px);outline:none}
.jouer-art-direction .mode::after{content:"↗";position:absolute;inset-inline-end:24px;bottom:20px;color:var(--craie-pale);font:18px/1 var(--font-body);transition:transform .2s ease,color .2s ease}
.jouer-art-direction .mode:hover::after,.jouer-art-direction .mode:focus-visible::after{color:var(--craie-doree);transform:translate(2px,-2px)}
.jouer-art-direction .mode-index{grid-column:1;grid-row:1;font:500 11px/1 var(--font-mono);color:var(--craie-doree);letter-spacing:.08em;padding-top:5px}
.jouer-art-direction .mode .ic{grid-column:2;grid-row:1;font-size:22px;line-height:1;color:var(--craie)}
.jouer-art-direction .mode>span:nth-of-type(3),.jouer-art-direction .mode>span:nth-of-type(2)+span{grid-column:2;grid-row:2;margin-top:22px;font:500 21px/1.15 var(--font-head)}
.jouer-art-direction .mode small{grid-column:2;grid-row:3;margin-top:8px;color:var(--craie-pale);font-size:12px;line-height:1.5}
.jouer-art-direction .mode:nth-child(3) .ic{color:var(--craie-doree)}
.jouer-art-direction #toast{border:1px solid var(--craie-doree-border);box-shadow:none}
@media(max-width:700px){
  .jouer-art-direction .wrap{padding:34px 18px 90px}
  .jouer-art-direction .app-title{font-size:clamp(36px,12vw,54px)}
  .jouer-art-direction .modes{grid-template-columns:1fr}
  .jouer-art-direction .mode,.jouer-art-direction .mode:nth-child(odd){border-inline-end:0}
  .jouer-art-direction .mode:nth-child(-n+2){border-top:0}
  .jouer-art-direction .mode:first-child{border-top:1px solid var(--jr-rule)}
  .jouer-art-direction .mode{min-height:155px;padding:24px 20px}
}
@media(prefers-reduced-motion:reduce){
  .jouer-art-direction .mode{transition:none}
  .jouer-art-direction .mode:hover,.jouer-art-direction .mode:focus-visible{transform:none}
}
[dir="rtl"] .jouer-art-direction .mode::after{transform:scaleX(-1)}
[dir="rtl"] .jouer-art-direction .mode:hover::after,[dir="rtl"] .jouer-art-direction .mode:focus-visible::after{transform:scaleX(-1) translate(2px,-2px)}