*{box-sizing:border-box;margin:0;padding:0}body{color:#f8fafc;background-color:#0b0f19;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}:root{--page-padding:16px;--content-max-width:1200px;--content-width:min(calc(100vw - (var(--page-padding) * 2)), var(--content-max-width))}*,:before,:after{box-sizing:border-box}.hero{background-color:#0b0f19;justify-content:center;align-items:center;height:40vh;min-height:280px;display:flex;position:relative;overflow:hidden}.hero-background-video,.hero-mask-svg{width:100%;height:100%;position:absolute;inset:0}.hero-background-video{z-index:1;object-fit:cover}.hero-mask-svg{z-index:2;pointer-events:none}.hero-content{z-index:3;width:var(--content-width);text-align:center;pointer-events:none;margin:-100px auto 0;padding-top:clamp(7rem,18vh,10rem);position:relative}.hero-content p{letter-spacing:clamp(.18em,.5vw,.5em);text-transform:uppercase;color:#38bdf8;text-align:center;opacity:.9;text-shadow:0 0 20px #38bdf833;white-space:nowrap;margin:1rem 0 0;font-family:Inter,sans-serif;font-size:clamp(.55rem,1.2vw,1rem);font-weight:500}.grid-container{width:var(--content-width);max-width:none;margin:0 auto;padding:16px 0}.library-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.card-item{cursor:pointer;background-color:#111827;border:1px solid #1f2937;border-radius:16px;flex-direction:column;justify-content:space-between;height:100%;padding:8px;transition:transform .2s cubic-bezier(.2,.8,.2,1),border-color .2s;display:flex}.card-item:hover{border-color:#06b6d4;transform:translateY(-4px);box-shadow:0 10px 25px -5px #06b6d426}.image-wrapper{aspect-ratio:16/10;background-color:#0b0f19;border-radius:10px;width:100%;position:relative;overflow:hidden}.card-image{object-fit:cover;width:100%;height:100%;display:block}.card-actions{z-index:2;background-color:#111827;border-bottom-left-radius:6px;align-items:center;gap:6px;padding:4px 4px 6px 6px;display:flex;position:absolute;top:0;right:0}.card-actions:before,.card-actions:after{content:"";pointer-events:none;background:0 0;width:6px;height:6px;position:absolute}.card-actions:before{border-top-right-radius:6px;top:0;left:-6px;box-shadow:2px -2px #111827}.card-actions:after{border-top-right-radius:6px;bottom:-6px;right:0;box-shadow:2px -2px #111827}.action-btn{color:#f3f4f6;cursor:pointer;background-color:#1f2937;border:1px solid #374151;border-radius:4px;justify-content:center;align-items:center;gap:4px;height:24px;padding:0 6px;font-size:10px;font-weight:600;transition:all .2s;display:inline-flex}.action-btn:hover{color:#06b6d4;background-color:#374151;border-color:#4b5563}.share-btn{border-radius:50%;width:24px;padding:0}.content-box{flex-direction:column;gap:2px;padding:8px 4px 0;display:flex}.item-title{color:#f3f4f6;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:14px;font-weight:600;overflow:hidden}.item-categories{color:#64748b;text-transform:uppercase;margin:0;font-family:monospace;font-size:11px}.modal-backdrop{-webkit-backdrop-filter:blur(12px);z-index:99999;box-sizing:border-box;background-color:#000000bf;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal-container{background-color:#0f172a;border:1px solid #1e293b;border-radius:24px;flex-direction:column;width:100%;max-width:1024px;max-height:90vh;display:flex;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000080}.modal-close-btn{z-index:10;color:#cbd5e1;cursor:pointer;background-color:#0006;border:1px solid #334155;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-family:sans-serif;font-size:18px;transition:background-color .2s;display:flex;position:absolute;top:16px;right:16px}.modal-close-btn:hover{color:#fff;background-color:#000c}.modal-video-pane{aspect-ratio:16/9;background-color:#020617;justify-content:center;align-items:center;width:100%;display:flex}.modal-video-pane iframe{object-fit:cover;border:0;width:100%;height:100%}.modal-info-pane{box-sizing:border-box;background-color:#0f172a80;border-top:1px solid #1e293b;flex-direction:column;justify-content:space-between;width:100%;padding:24px;display:flex;overflow-y:auto}.modal-cat-tag{text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;background-color:#1e293b;border-radius:9999px;margin-right:8px;padding:4px 10px;font-family:monospace;font-size:11px;display:inline-block}.modal-title{color:#fff;letter-spacing:-.025em;margin:12px 0 8px;font-size:24px;font-weight:700}.modal-description{color:#94a3b8;margin:0 0 24px;font-size:14px;line-height:1.6}.modal-code-box{color:#34d399;-webkit-user-select:all;user-select:all;background-color:#020617cc;border:1px solid #1e293b;border-radius:12px;margin-bottom:16px;padding:12px;font-family:monospace;font-size:12px;overflow-x:auto}.modal-features-list{flex-wrap:wrap;gap:6px;margin-top:16px;display:flex}.modal-feat-tag{color:#64748b;background-color:#020617;border-radius:8px;padding:4px 12px;font-size:12px}@media (width>=1024px){.library-grid{grid-template-columns:repeat(4,1fr)}.modal-container{flex-direction:row;max-height:80vh}.modal-video-pane{aspect-ratio:auto;width:60%}.modal-info-pane{border-top:0;border-left:1px solid #1e293b;width:40%;padding:32px}}@media (width>=768px) and (width<=1023px){.library-grid{grid-template-columns:repeat(3,1fr)}}