.proj-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.proj-grid .card{background:var(--surface);border:1.5px solid var(--ink);min-width:0;transition:transform .2s var(--ease), box-shadow .2s var(--ease);border-radius:10px;flex-direction:column;display:flex;position:relative}.proj-grid .card:hover,.proj-grid .card:focus-within{box-shadow:6px 6px 0 var(--ink);transform:translate(-3px,-3px)}.proj-grid .card-top{font:400 12px/1.4 var(--f-mono);color:var(--muted);justify-content:space-between;gap:8px;padding:14px 16px 0;display:flex}.proj-grid .card-top .checked{color:var(--ok)}.proj-grid .card-fig{padding:10px 16px 0}.proj-grid .card-fig svg{width:100%;height:auto;display:block}.proj-grid .card-body{flex-direction:column;flex:1;gap:8px;padding:12px 16px 18px;display:flex}.proj-grid .card h3{font-size:24px;font-weight:700;line-height:1.15}.proj-grid .card h3 a{text-decoration:none}.proj-grid .card h3 a:after{content:"";border-radius:10px;position:absolute;inset:0}.proj-grid .card p{margin:0;font-size:17px;line-height:1.5}.proj-grid .card .learn{font:400 13px/1.5 var(--f-mono);color:var(--muted);margin-top:auto;padding-top:8px}.proj-grid .learn b{color:var(--ink);font-weight:500}.proj-grid .card .mine{font:500 13px/1.4 var(--f-mono);color:var(--ok);border-top:1px dashed var(--rule);flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px;padding-top:10px;display:flex}.proj-grid .card .mine .dot{background:var(--ok);border-radius:3px;flex:none;width:10px;height:10px}.proj-grid .card .mine .progress{flex:100%;gap:4px;margin-top:0;display:flex}.proj-grid .card .mine .progress span{background:var(--rule);border-radius:3px;flex:1;height:6px}.proj-grid .card .mine .progress span.on{background:var(--ok)}.proj-grid .card .mine.going{color:var(--ink)}@media (prefers-reduced-motion:no-preference){.card:hover [data-anim],.card:focus-within [data-anim]{animation:var(--anim)}}@media (max-width:1080px){.proj-grid{grid-template-columns:minmax(0,1fr);gap:16px}.proj-grid .card{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);display:grid}.proj-grid .card-top{grid-column:1/-1}.proj-grid .card-fig{align-self:center;padding:8px 8px 16px 16px}.proj-grid .card-body{padding:8px 20px 18px 12px}}@media (max-width:600px){.proj-grid .card{display:flex}.proj-grid .card-fig{padding:10px 16px 0}.proj-grid .card-fig svg{max-width:360px;margin:0 auto}.proj-grid .card-body{padding:12px 16px 18px}}
