.page{--page-surface:color-mix(in srgb, var(--background) 94%, var(--foreground) 6%);--page-surface-strong:color-mix(in srgb, var(--background) 88%, var(--foreground) 12%);--page-border:color-mix(in srgb, var(--foreground) 14%, transparent);--page-text-muted:color-mix(in srgb, var(--foreground) 68%, var(--background) 32%);--page-text-soft:color-mix(in srgb, var(--foreground) 82%, var(--background) 18%);background:radial-gradient(circle at top, color-mix(in srgb, var(--foreground) 8%, transparent), transparent 36%), var(--background);min-height:100%;color:var(--foreground)}.page .container{max-width:1000px;margin:auto;padding:40px 16px 80px}.page .header{margin-bottom:40px}.page .header h1{margin-bottom:12px;font-size:36px;font-weight:700}.page .subtitle{color:var(--page-text-muted);max-width:600px;font-size:16px}.page .section{margin-top:48px}.page .section h2{margin-bottom:20px;font-size:24px;font-weight:700}.page .grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;display:grid}.page .card{border:1px solid var(--page-border);background:linear-gradient(180deg, var(--page-surface), var(--page-surface-strong));box-shadow:0 18px 50px color-mix(in srgb, var(--foreground) 8%, transparent);border-radius:18px;flex-direction:column;padding:18px;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex}.page .card:hover{border-color:color-mix(in srgb, var(--foreground) 22%, transparent);box-shadow:0 24px 60px color-mix(in srgb, var(--foreground) 12%, transparent);transform:translateY(-3px)}.page .cover{border-radius:12px;width:100%;height:auto;margin-bottom:14px}.page .card img{border:1px solid var(--page-border);background:color-mix(in srgb, var(--background) 92%, var(--foreground) 8%);border-radius:12px;width:140px;height:auto}.page .cardBody{flex-direction:column;flex:1;display:flex}.page .cardBody h3{margin-bottom:4px;font-size:16px;font-weight:700}.page .author{color:var(--page-text-muted);margin-bottom:8px;font-size:13px}.page .desc{color:var(--page-text-soft);margin-bottom:10px;font-size:14px}.page .button{color:color-mix(in srgb, #4da3ff 72%, var(--foreground) 28%);margin-top:auto;font-size:14px;font-weight:600;text-decoration:none}.page .button:hover{text-decoration:underline}@media (max-width:640px){.page .container{padding-top:28px}.page .header h1{font-size:30px}.page .section h2{font-size:21px}}