Download styles.css from minispace/links: direct link, hf CLI and curl.
- Browser
- Download file 21 kB
-
https://huggingface.co/spaces/minispace/links/resolve/main/styles.css
- Command line
-
hf download hf://spaces/minispace/links/styles.css
-
curl -L -o styles.css https://huggingface.co/spaces/minispace/links/resolve/main/styles.css
21 kB
| :root { | |
| --bg-dark: #ffffff; | |
| --bg-card: #151c2e; | |
| --pi-red: #e94c4c; | |
| --text-primary: #ffffff; | |
| --text-secondary: #94a3b8; | |
| --radius-cube: 24px; | |
| --font-heading: 'Outfit', sans-serif; | |
| --font-body: 'Plus Jakarta Sans', sans-serif; | |
| } | |
| * { | |
| box-sizing: border-box; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| body { | |
| background-color: #ffffff; | |
| background: #ffffff; | |
| color: var(--text-primary); | |
| font-family: var(--font-body); | |
| min-height: 100vh; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| padding: 20px 16px; | |
| overflow-x: hidden; | |
| position: relative; | |
| } | |
| .bg-radial { display: none ; } | |
| .bg-radial-1 { display: none ; } | |
| .bg-radial-2 { display: none ; } | |
| .bg-grid { display: none ; } | |
| .container { | |
| width: 100%; | |
| max-width: 720px; | |
| margin: 0 auto; | |
| position: relative; | |
| z-index: 1; | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| gap: 24px; | |
| } | |
| .cubes-grid { | |
| display: grid; | |
| grid-template-columns: repeat(2, 1fr); | |
| gap: 18px; | |
| width: 100%; | |
| } | |
| .cube-card { | |
| position: relative; | |
| aspect-ratio: 1 / 1; | |
| border-radius: var(--radius-cube); | |
| overflow: hidden; | |
| text-decoration: none; | |
| color: var(--text-primary); | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| padding: 20px; | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.25s ease, border-color 0.25s ease; | |
| will-change: transform; | |
| transform: translateZ(0); | |
| box-shadow: none ; | |
| } | |
| .cube-card:hover, .cube-card:focus-visible { | |
| transform: translateY(-4px) scale(1.02); | |
| border-color: rgba(255, 255, 255, 0.25); | |
| box-shadow: none ; | |
| outline: none; | |
| } | |
| .cube-bg { | |
| position: absolute; | |
| top: 0; left: 0; width: 100%; height: 100%; | |
| background-size: cover; | |
| background-position: center; | |
| transition: transform 0.4s ease; | |
| z-index: 1; | |
| } | |
| .cube-card:hover .cube-bg { | |
| transform: scale(1.06); | |
| } | |
| .cube-overlay { | |
| position: absolute; | |
| top: 0; left: 0; width: 100%; height: 100%; | |
| background: linear-gradient(180deg, rgba(15, 23, 42, 0.3) 0%, rgba(15, 23, 42, 0.85) 100%); | |
| z-index: 2; | |
| } | |
| .cube-content { | |
| position: relative; | |
| z-index: 3; | |
| height: 100%; | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| } | |
| .cube-pi { | |
| background-color: var(--pi-red); | |
| border-color: rgba(255, 255, 255, 0.2); | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| } | |
| .cube-pi:hover { | |
| box-shadow: none ; | |
| } | |
| .cube-stand { | |
| background-color: #009bdd; | |
| border-color: rgba(255, 255, 255, 0.25); | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| } | |
| .cube-stand:hover { | |
| box-shadow: none ; | |
| } | |
| .stand-logo-wrapper { | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| transform: translate(-50%, -50%); | |
| width: 82%; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| pointer-events: none; | |
| } | |
| .stand-logo-composite { | |
| position: relative; | |
| width: 100%; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| } | |
| .stand-vector-logo { | |
| width: 100%; | |
| height: auto; | |
| object-fit: contain; | |
| filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.15)); | |
| } | |
| .stand-star-rotating { | |
| position: absolute; | |
| top: 10.5%; | |
| right: 3.2%; | |
| width: 13.8%; | |
| height: 13.8%; | |
| animation: rotateStar 6s linear infinite; | |
| } | |
| @keyframes rotateStar { | |
| 0% { transform: rotate(0deg); } | |
| 100% { transform: rotate(360deg); } | |
| } | |
| .cube-interactive { | |
| background-color: #8b5cf6; | |
| border-color: rgba(255, 255, 255, 0.25); | |
| display: flex; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| } | |
| .cube-interactive:hover { | |
| box-shadow: none ; | |
| } | |
| .interactive-vector-wrapper { | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| transform: translate(-50%, -50%); | |
| width: 65%; | |
| aspect-ratio: 1 / 1; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| pointer-events: none; | |
| } | |
| .interactive-vector-svg { | |
| width: 82%; | |
| height: 82%; | |
| animation: interactivePulse 3.5s ease-in-out infinite alternate; | |
| } | |
| @keyframes interactivePulse { | |
| 0% { transform: scale(0.98); filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.25)); } | |
| 100% { transform: scale(1.04); filter: drop-shadow(0 0 22px rgba(255, 255, 255, 0.6)); } | |
| } | |
| .logo-mask-wrapper { | |
| position: absolute; | |
| top: 50%; | |
| left: 50%; | |
| transform: translate(-50%, -50%); | |
| width: 65%; | |
| aspect-ratio: 1 / 1; | |
| display: flex; | |
| justify-content: center; | |
| align-items: center; | |
| pointer-events: none; | |
| } | |
| .pi-center-logo { | |
| width: 68%; | |
| height: 68%; | |
| object-fit: contain; | |
| border-radius: 50%; | |
| z-index: 2; | |
| } | |
| .circular-mask-text { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| animation: rotateText 22s linear infinite; | |
| z-index: 1; | |
| } | |
| @keyframes rotateText { | |
| from { transform: rotate(0deg); } | |
| to { transform: rotate(360deg); } | |
| } | |
| .cube-header { | |
| position: relative; | |
| z-index: 4; | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: center; | |
| width: 100%; | |
| } | |
| .cube-tag { | |
| font-size: 0.72rem; | |
| font-weight: 700; | |
| text-transform: uppercase; | |
| letter-spacing: 0.5px; | |
| padding: 5px 10px; | |
| border-radius: 20px; | |
| background: rgba(255, 255, 255, 0.15); | |
| backdrop-filter: blur(8px); | |
| color: #ffffff; | |
| } | |
| .tag-red { | |
| background: rgba(0, 0, 0, 0.2); | |
| color: #fff; | |
| } | |
| .cube-arrow { | |
| width: 34px; | |
| height: 34px; | |
| border-radius: 50%; | |
| background: rgba(255, 255, 255, 0.18); | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| transition: background 0.2s ease, transform 0.2s ease; | |
| } | |
| .cube-arrow svg { | |
| width: 16px; | |
| height: 16px; | |
| stroke: #ffffff; | |
| } | |
| .cube-card:hover .cube-arrow { | |
| background: rgba(255, 255, 255, 0.35); | |
| transform: translateX(3px); | |
| } | |
| .cube-footer { | |
| position: relative; | |
| z-index: 4; | |
| } | |
| .cube-title { | |
| font-family: var(--font-heading); | |
| font-size: clamp(1.2rem, 3.5vw, 1.5rem); | |
| font-weight: 800; | |
| line-height: 1.1; | |
| color: #ffffff; | |
| text-shadow: 0 2px 10px rgba(0,0,0,0.3); | |
| } | |
| .site-footer { | |
| margin-top: 10px; | |
| text-align: center; | |
| } | |
| .copyright { | |
| font-size: 0.85rem; | |
| color: var(--text-secondary); | |
| letter-spacing: 0.5px; | |
| font-weight: 500; | |
| } | |
| .toast-notification { | |
| position: fixed; | |
| bottom: 24px; | |
| left: 50%; | |
| transform: translateX(-50%); | |
| background: rgba(15, 23, 42, 0.9); | |
| border: 1px solid rgba(255, 255, 255, 0.15); | |
| color: #ffffff; | |
| padding: 12px 20px; | |
| border-radius: 30px; | |
| display: flex; | |
| align-items: center; | |
| gap: 10px; | |
| font-size: 0.88rem; | |
| font-weight: 600; | |
| box-shadow: none ; | |
| z-index: 100; | |
| transition: opacity 0.3s ease, transform 0.3s ease; | |
| } | |
| .toast-notification.hidden { | |
| opacity: 0; | |
| transform: translate(-50%, 20px); | |
| pointer-events: none; | |
| } | |
| .toast-icon svg { | |
| width: 18px; | |
| height: 18px; | |
| stroke: #38bdf8; | |
| } | |
| @media (max-width: 480px) { | |
| .cubes-grid { | |
| gap: 12px; | |
| } | |
| .cube-card { | |
| padding: 14px; | |
| border-radius: 18px; | |
| } | |
| .cube-tag { | |
| font-size: 0.62rem; | |
| padding: 4px 8px; | |
| } | |
| .cube-arrow { | |
| width: 28px; | |
| height: 28px; | |
| } | |
| .cube-arrow svg { | |
| width: 14px; | |
| height: 14px; | |
| } | |
| } | |
| .page-container { | |
| align-items: flex-start; | |
| } | |
| .page-header { | |
| width: 100%; | |
| margin-bottom: 12px; | |
| } | |
| .back-button { | |
| display: inline-flex; | |
| align-items: center; | |
| gap: 8px; | |
| color: var(--text-secondary); | |
| text-decoration: none; | |
| font-size: 0.9rem; | |
| font-weight: 600; | |
| padding: 8px 16px; | |
| border-radius: 20px; | |
| background: rgba(255, 255, 255, 0.06); | |
| border: 1px solid rgba(255, 255, 255, 0.1); | |
| transition: all 0.2s ease; | |
| } | |
| .back-button:hover { | |
| color: #ffffff; | |
| background: rgba(255, 255, 255, 0.14); | |
| transform: translateX(-3px); | |
| } | |
| .back-button svg { | |
| width: 18px; | |
| height: 18px; | |
| } | |
| .interactive-content { | |
| width: 100%; | |
| display: flex; | |
| flex-direction: column; | |
| gap: 20px; | |
| } | |
| .text-center { | |
| text-align: center; | |
| align-items: center; | |
| } | |
| .margin-auto { | |
| align-self: center ; | |
| } | |
| .downloadable-caption { | |
| font-size: 0.92rem; | |
| color: var(--text-secondary); | |
| font-weight: 500; | |
| margin-top: 4px; | |
| letter-spacing: 0.3px; | |
| } | |
| .desktop-app-grid { | |
| display: grid; | |
| grid-template-columns: repeat(5, 1fr); | |
| gap: 22px 14px; | |
| justify-items: center; | |
| align-items: flex-start; | |
| width: 100%; | |
| margin-top: 20px; | |
| } | |
| .app-slot-item { | |
| display: flex; | |
| flex-direction: column; | |
| align-items: center; | |
| gap: 8px; | |
| text-decoration: none; | |
| width: 100%; | |
| max-width: 90px; | |
| transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1); | |
| } | |
| .app-slot-item:hover { | |
| transform: translateY(-4px); | |
| } | |
| .apple-icon-box { | |
| width: 76px; | |
| height: 76px; | |
| border-radius: 18px; | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| box-shadow: none ; | |
| border: 1px solid rgba(255, 255, 255, 0.2); | |
| transition: box-shadow 0.25s ease, transform 0.25s ease; | |
| flex-shrink: 0; | |
| } | |
| .app-slot-item:hover .apple-icon-box { | |
| box-shadow: none ; | |
| } | |
| .apple-icon-box svg { | |
| width: 36px; | |
| height: 36px; | |
| stroke: #ffffff; | |
| filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2)); | |
| } | |
| .bg-apple-green { | |
| background: linear-gradient(135deg, #34d399 0%, #059669 100%); | |
| } | |
| .bg-apple-cyan { | |
| background: linear-gradient(135deg, #38bdf8 0%, #0284c7 100%); | |
| } | |
| .bg-apple-amber { | |
| background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%); | |
| } | |
| .apple-icon-label { | |
| font-size: 0.78rem; | |
| font-weight: 700; | |
| color: #ffffff; | |
| text-align: center; | |
| line-height: 1.25; | |
| text-shadow: 0 2px 4px rgba(0,0,0,0.5); | |
| } | |
| .empty-icon-box { | |
| width: 76px; | |
| height: 76px; | |
| border-radius: 18px; | |
| border: 2px dashed rgba(255, 255, 255, 0.12); | |
| background: rgba(255, 255, 255, 0.02); | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease; | |
| flex-shrink: 0; | |
| } | |
| .empty-slot:hover .empty-icon-box { | |
| border-color: rgba(255, 255, 255, 0.25); | |
| background: rgba(255, 255, 255, 0.05); | |
| } | |
| .empty-plus-sign { | |
| font-size: 1.2rem; | |
| font-weight: 600; | |
| color: rgba(255, 255, 255, 0.2); | |
| transition: color 0.2s ease; | |
| } | |
| .empty-slot:hover .empty-plus-sign { | |
| color: rgba(255, 255, 255, 0.5); | |
| } | |
| @media (max-width: 520px) { | |
| .desktop-app-grid { | |
| gap: 16px 10px; | |
| } | |
| .apple-icon-box, .empty-icon-box { | |
| width: 60px; | |
| height: 60px; | |
| border-radius: 14px; | |
| } | |
| .apple-icon-box svg { | |
| width: 28px; | |
| height: 28px; | |
| } | |
| .apple-icon-label { | |
| font-size: 0.7rem; | |
| } | |
| } | |
| img, svg, logo-img, .product-img, .modal-img, .thumb-img { | |
| -webkit-user-drag: none ; | |
| user-drag: none ; | |
| -webkit-touch-callout: none ; | |
| user-select: none ; | |
| pointer-events: auto ; | |
| } | |
| :root { | |
| --font-size-h1: clamp(1.3rem, 4.5vw + 0.5rem, 2.4rem); | |
| --font-size-h2: clamp(1.1rem, 3.5vw + 0.4rem, 1.8rem); | |
| --font-size-h3: clamp(0.95rem, 2.5vw + 0.3rem, 1.3rem); | |
| --font-size-hero: clamp(1.4rem, 5vw + 0.4rem, 2.5rem); | |
| --font-size-modal: clamp(1.15rem, 3.5vw + 0.4rem, 1.6rem); | |
| } | |
| h1, .main-title, .hero-text h1 { | |
| font-size: var(--font-size-hero) ; | |
| line-height: 1.2 ; | |
| word-break: break-word ; | |
| overflow-wrap: break-word ; | |
| } | |
| h2, .section-heading h2, .catalog-title, .dash-title, .form-title { | |
| font-size: var(--font-size-h2) ; | |
| line-height: 1.25 ; | |
| word-break: break-word ; | |
| } | |
| h3, .card-title { | |
| font-size: var(--font-size-h3) ; | |
| line-height: 1.3 ; | |
| word-break: break-word ; | |
| } | |
| .modal-title { | |
| font-size: var(--font-size-modal) ; | |
| line-height: 1.2 ; | |
| } | |
| @media (max-width: 768px) { | |
| .top-bar { | |
| font-size: 0.72rem ; | |
| padding: 6px 10px ; | |
| } | |
| .store-header, .header-inner, .page-header { | |
| padding: 10px 14px ; | |
| gap: 10px ; | |
| } | |
| .header-inner { | |
| display: flex ; | |
| flex-wrap: wrap ; | |
| justify-content: space-between ; | |
| align-items: center ; | |
| } | |
| .nav-left { | |
| gap: 8px ; | |
| flex-shrink: 0; | |
| } | |
| .logo-img, .brand-logo-text { | |
| height: 38px ; | |
| font-size: 1.2rem ; | |
| } | |
| .search-bar { | |
| order: 3 ; | |
| width: 100% ; | |
| max-width: 100% ; | |
| margin-top: 4px ; | |
| } | |
| .controls-right { | |
| order: 2 ; | |
| gap: 6px ; | |
| } | |
| .back-link, .back-button { | |
| padding: 4px 10px ; | |
| font-size: 0.78rem ; | |
| } | |
| .live-rate-badge, .location-badge, .lang-switch-btn { | |
| font-size: 0.7rem ; | |
| padding: 4px 8px ; | |
| } | |
| .hero-banner { | |
| padding: 20px 16px ; | |
| border-radius: 16px ; | |
| margin-bottom: 20px ; | |
| } | |
| .modal-content { | |
| max-height: 92vh ; | |
| overflow-y: auto ; | |
| border-radius: 18px ; | |
| } | |
| .modal-details { | |
| padding: 18px ; | |
| } | |
| .product-card { | |
| border-radius: 14px ; | |
| } | |
| } | |
| @media (max-width: 480px) { | |
| .hero-text h1, .main-title { | |
| font-size: 1.3rem ; | |
| } | |
| .card-body { | |
| padding: 12px ; | |
| } | |
| } | |
| .logo-mask-wrapper, | |
| .stand-logo-wrapper, | |
| .interactive-vector-wrapper { | |
| top: 50% ; | |
| left: 50% ; | |
| transform: translate(-50%, -50%) ; | |
| } | |
| .cube-beat .cube-bg { | |
| background-position: center center ; | |
| } | |
| @media (max-width: 768px) { | |
| .cubes-grid { | |
| gap: 18px ; | |
| } | |
| .cube-card { | |
| aspect-ratio: 1 / 1.30 ; | |
| padding: 18px 14px 16px 14px ; | |
| transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), | |
| aspect-ratio 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), | |
| box-shadow 0.4s ease ; | |
| display: flex ; | |
| flex-direction: column ; | |
| justify-content: space-between ; | |
| } | |
| .cube-card:hover, .cube-card:active { | |
| aspect-ratio: 1 / 1.35 ; | |
| transform: translateY(-4px) scale(1.01) ; | |
| } | |
| .cube-header { | |
| position: relative ; | |
| z-index: 10 ; | |
| } | |
| .cube-footer { | |
| position: relative ; | |
| z-index: 10 ; | |
| margin-top: auto ; | |
| } | |
| .cube-title { | |
| font-size: clamp(1.1rem, 4vw, 1.35rem) ; | |
| line-height: 1.2 ; | |
| text-shadow: 0 2px 8px rgba(0,0,0,0.85) ; | |
| } | |
| } | |
| .desktop-app-grid { | |
| display: grid ; | |
| grid-template-columns: repeat(4, 1fr) ; | |
| gap: 20px ; | |
| width: 100% ; | |
| max-width: 680px ; | |
| margin: 0 auto ; | |
| } | |
| @media (max-width: 600px) { | |
| .desktop-app-grid { | |
| grid-template-columns: repeat(4, 1fr) ; | |
| gap: 12px ; | |
| } | |
| } | |
| .cube-pi .logo-mask-wrapper { | |
| width: 90% ; | |
| height: 90% ; | |
| aspect-ratio: 1 / 1 ; | |
| top: 50% ; | |
| left: 50% ; | |
| transform: translate(-50%, -50%) ; | |
| } | |
| .cube-pi .pi-center-logo { | |
| width: 72% ; | |
| height: 72% ; | |
| } | |
| .circular-mask-text svg { | |
| width: 100% ; | |
| height: 100% ; | |
| } | |
| .cube-pi .logo-mask-wrapper { | |
| width: 82% ; | |
| height: 82% ; | |
| aspect-ratio: 1 / 1 ; | |
| top: 50% ; | |
| left: 50% ; | |
| transform: translate(-50%, -50%) ; | |
| display: flex ; | |
| align-items: center ; | |
| justify-content: center ; | |
| } | |
| .cube-pi .pi-center-logo { | |
| width: 88% ; | |
| height: 88% ; | |
| object-fit: contain ; | |
| border-radius: 0 ; | |
| filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.25)) ; | |
| } | |
| .cubes-grid { | |
| display: grid ; | |
| grid-template-columns: repeat(2, 1fr) ; | |
| gap: 16px ; | |
| width: 100% ; | |
| max-width: 480px ; | |
| margin: 0 auto ; | |
| } | |
| @media (max-width: 768px) { | |
| .cubes-grid { | |
| max-width: 360px ; | |
| gap: 14px ; | |
| } | |
| } | |
| .copyright a { | |
| color: #38bdf8 ; | |
| text-decoration: none ; | |
| font-weight: 700 ; | |
| transition: color 0.2s ease; | |
| } | |
| .copyright a:hover { | |
| color: #8b5cf6 ; | |
| text-decoration: underline ; | |
| } | |
| .cube-pi .logo-mask-wrapper { | |
| background: transparent ; | |
| box-shadow: none ; | |
| border-radius: 0 ; | |
| top: 50% ; | |
| left: 50% ; | |
| transform: translate(-50%, -50%) ; | |
| width: 62% ; | |
| height: 62% ; | |
| display: flex ; | |
| align-items: center ; | |
| justify-content: center ; | |
| } | |
| .cube-pi .pi-center-logo { | |
| width: 100% ; | |
| height: 100% ; | |
| object-fit: contain ; | |
| border-radius: 0 ; | |
| box-shadow: none ; | |
| filter: none ; | |
| } | |
| .cube-footer { | |
| text-align: center ; | |
| width: 100% ; | |
| display: flex ; | |
| justify-content: center ; | |
| align-items: center ; | |
| } | |
| .cube-title { | |
| text-align: center ; | |
| width: 100% ; | |
| margin: 0 auto ; | |
| } | |
| .cube-arrow { | |
| background: transparent ; | |
| width: 24px ; | |
| height: 24px ; | |
| padding: 0 ; | |
| border-radius: 0 ; | |
| box-shadow: none ; | |
| display: flex ; | |
| align-items: center ; | |
| justify-content: center ; | |
| color: rgba(255, 255, 255, 0.95) ; | |
| transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1) ; | |
| } | |
| .cube-arrow svg { | |
| width: 22px ; | |
| height: 22px ; | |
| stroke: rgba(255, 255, 255, 0.95) ; | |
| } | |
| .cube-card:hover .cube-arrow { | |
| transform: translateX(4px) ; | |
| } | |
| .cube-card:hover .cube-arrow svg { | |
| stroke: #ffffff ; | |
| } | |
| .cube-beat .cube-footer, | |
| .beat-footer { | |
| text-align: left ; | |
| justify-content: flex-start ; | |
| align-items: flex-start ; | |
| width: 100% ; | |
| } | |
| .cube-beat .cube-title, | |
| .beat-title { | |
| text-align: left ; | |
| margin: 0 ; | |
| } | |
| @media (max-width: 640px) { | |
| } | |
| .chat-pi-bar { | |
| grid-column: 1 / -1 ; | |
| width: 100% ; | |
| max-width: 100% ; | |
| background: #d6207e ; | |
| color: #ffffff ; | |
| text-align: center ; | |
| text-decoration: none ; | |
| font-family: 'Outfit', sans-serif ; | |
| font-size: 1.45rem ; | |
| font-weight: 800 ; | |
| letter-spacing: 2px ; | |
| text-transform: uppercase ; | |
| padding: 16px 20px ; | |
| border-radius: 22px ; | |
| box-shadow: none ; | |
| transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.2s ease, background 0.2s ease ; | |
| box-sizing: border-box ; | |
| border: none ; | |
| display: flex ; | |
| align-items: center ; | |
| justify-content: center ; | |
| margin: 0 ; | |
| cursor: pointer ; | |
| } | |
| .chat-pi-bar:hover { | |
| background: #be186d ; | |
| transform: translateY(-2px) ; | |
| box-shadow: none ; | |
| } | |
| .chat-pi-bar:active { | |
| transform: translateY(0) ; | |
| } | |
| @media (max-width: 640px) { | |
| .chat-pi-bar { | |
| font-size: 1.25rem ; | |
| padding: 14px 18px ; | |
| border-radius: 18px ; | |
| } | |
| } | |
| body { | |
| background-color: #ffffff ; | |
| background: #ffffff ; | |
| } | |
| .bg-radial, .bg-radial-1, .bg-radial-2, .bg-grid { | |
| display: none ; | |
| } | |
| .cube-card, | |
| .cube-pi, | |
| .cube-stand, | |
| .cube-beat, | |
| .cube-apps, | |
| .cube-arrow, | |
| .chat-pi-bar, | |
| .logo-mask-wrapper, | |
| .stand-logo-wrapper, | |
| .interactive-vector-wrapper { | |
| box-shadow: none ; | |
| filter: none ; | |
| -webkit-filter: none ; | |
| } | |
| .cube-card:hover, | |
| .cube-pi:hover, | |
| .cube-stand:hover, | |
| .cube-beat:hover, | |
| .cube-apps:hover, | |
| .chat-pi-bar:hover { | |
| box-shadow: none ; | |
| transform: translateY(-3px) ; | |
| } | |