.path-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:28px 0 34px; }
.path-grid .path-card { display:flex; flex-direction:column; padding:0; width:100%; min-width:0; text-align:start; font:inherit; color:#34462c; background:#f9f7ee; border:1px solid #c7ccb8; border-radius:14px; overflow:hidden; cursor:pointer; box-shadow:0 3px 12px #283b1b06; transition:border-color .18s,box-shadow .18s,transform .18s; }
.path-grid .path-card:hover { border-color:#829568; box-shadow:0 6px 20px #34492b12; transform:translateY(-2px); }
.path-grid .path-card:focus-visible { outline:3px solid #9b754c; outline-offset:4px; }
.path-grid .path-card.is-selected { border-color:#6b8054; box-shadow:0 0 0 1px #6b8054,0 5px 20px #34492b0b; }
.path-grid .path-card-art { display:block; position:relative; width:100%; height:126px; flex:none; overflow:hidden; background:#e3e8d6; border-bottom:1px solid #cbd2b8; color:#5c7448; }
.path-grid .path-card-art svg { display:block; width:100%; height:100%; object-fit:cover; }
.path-grid .path-card-art-1 { color:#bdc99f; background:#344a30; border-bottom-color:#4c6342; }
.path-grid .path-card-art-2 { color:#776b49; background:#e6deca; border-bottom-color:#cec6ae; }
.path-grid .path-card-stage { position:absolute; top:10px; right:12px; display:flex; align-items:center; gap:6px; padding:3px 8px; border:1px solid #6c80534d; border-radius:5px; background:#f4f6e9dc; color:#4b6336; font:10px/1.6 Arial,sans-serif; }
.path-grid .path-card-stage>span { font:9px/1.6 Plex,Arial,sans-serif; }
.path-grid .path-card-art-1 .path-card-stage { background:#253b25e8; color:#d7dfc2; border-color:#a6ba8255; }
.path-grid .path-card-art-2 .path-card-stage { background:#f1ebdcde; color:#716141; border-color:#9b8c6855; }
.path-grid .path-card-content { display:flex; flex-direction:column; flex:1; min-width:0; width:100%; padding:19px 19px 17px; }
.path-grid .path-card-heading { display:flex; align-items:start; gap:12px; margin-bottom:10px; }
.path-grid .path-card-heading strong { font-size:16px; font-weight:600; line-height:1.8; color:#34492b; flex:1; }
.path-grid .path-card-arrow { font:20px/1.5 Arial,sans-serif; color:#879a6f; }
.path-grid .path-card-description { display:block; color:#69775a; font-size:11px; line-height:2; margin-bottom:19px; }
.path-grid .path-card-footer { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:auto; font-size:10px; color:#657650; }
.path-grid .path-card-status { color:#7c886c; font-size:9px; }
.path-grid .path-card.is-selected .path-card-status { font-weight:600; color:#506b37; }
.path-grid .path-card-progress { display:block; width:100%; height:4px; border-radius:4px; margin-top:10px; background:#e0e6d3; overflow:hidden; }
.path-grid .path-card-progress>span { display:block; height:100%; background:#7b935a; border-radius:4px; }
@media(max-width:1100px) { .path-grid { gap:13px; }.path-grid .path-card-content { padding:15px; }.path-grid .path-card-heading strong { font-size:14px; }.path-grid .path-card-description { font-size:10px; }.path-grid .path-card-footer { font-size:9px; gap:5px; }.path-grid .path-card-status { font-size:8px; }.path-grid .path-card-art { height:112px; } }
@media(max-width:700px) {
  .path-grid { grid-template-columns:1fr; gap:13px; margin:24px 0 28px; }
  .path-grid .path-card { display:grid; grid-template-columns:120px minmax(0,1fr); border-radius:11px; }
  .path-grid .path-card-art { height:100%; min-height:166px; border-bottom:0; border-inline-end:1px solid #bdc8aa; }
  .path-grid .path-card-art svg { position:absolute; width:290px; max-width:none; height:150px; left:50%; top:50%; transform:translate(-50%,-50%); opacity:.88; }
  .path-grid .path-card-stage { right:8px; left:8px; top:9px; justify-content:center; font-size:9px; padding:3px; }
  .path-grid .path-card-stage>span { font-size:8px; }
  .path-grid .path-card-content { padding:15px; }
  .path-grid .path-card-heading { gap:8px; margin-bottom:6px; }
  .path-grid .path-card-heading strong { font-size:14px; line-height:1.8; }
  .path-grid .path-card-description { font-size:10px; line-height:1.85; margin-bottom:12px; }
  .path-grid .path-card-footer { flex-wrap:wrap; font-size:9px; gap:4px 8px; }
}
@media(max-width:400px) { .path-grid .path-card { grid-template-columns:95px minmax(0,1fr); }.path-grid .path-card-content { padding:13px 11px; }.path-grid .path-card-heading strong { font-size:12px; }.path-grid .path-card-heading { gap:4px; }.path-grid .path-card-description { font-size:9px; }.path-grid .path-card-art { min-height:160px; }.path-grid .path-card-art svg { width:245px; height:140px; } }
@media(prefers-reduced-motion:reduce) { .path-grid .path-card { transition:none; }.path-grid .path-card:hover { transform:none; } }