.public-topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 32px;height:64px;background:var(--card-bg);border-bottom:1px solid var(--card-border)}
.public-topbar .logo{font-size:20px;font-weight:700;color:var(--color-primary);text-decoration:none}
.public-topbar .logo span{color:var(--text-primary)}
.public-topbar nav{display:flex;align-items:center;gap:24px}
.public-topbar nav a{font-size:14px;color:var(--text-secondary);text-decoration:none;transition:color .15s}
.public-topbar nav a:hover{color:var(--text-primary);text-decoration:none}
.topbar-actions{display:flex;align-items:center;gap:12px}
.hero{text-align:center;padding:80px 32px 48px;background:linear-gradient(135deg,var(--color-primary-light) 0%,var(--bg-primary) 100%)}
.hero h1{font-size:44px;font-weight:800;color:var(--text-primary);line-height:1.15;margin-bottom:16px;letter-spacing:-.5px}
.hero h1 .gradient-text{background:linear-gradient(135deg,#1a73e8,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero p{font-size:18px;color:var(--text-secondary);max-width:560px;margin:0 auto 32px;line-height:1.6}
.hero-search{max-width:480px;margin:0 auto;position:relative}
.hero-search input{width:100%;padding:14px 20px 14px 48px;border:2px solid var(--border-color);border-radius:12px;background:var(--card-bg);color:var(--text-primary);font-size:16px;transition:border-color .2s,box-shadow .2s}
.hero-search input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 4px rgba(26,115,232,.15)}
.hero-search input::placeholder{color:var(--text-muted)}
.hero-search .search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--text-muted);pointer-events:none}
.hero-stats{display:flex;align-items:center;justify-content:center;gap:32px;margin-top:32px;font-size:14px;color:var(--text-secondary)}
.hero-stats strong{color:var(--text-primary);font-weight:600}
.category-bar{display:flex;align-items:center;justify-content:center;gap:8px;padding:24px 32px 8px;flex-wrap:wrap}
.category-pill{padding:6px 16px;border-radius:9999px;font-size:13px;font-weight:500;cursor:pointer;background:var(--bg-secondary);color:var(--text-secondary);border:1px solid var(--border-color);transition:all .15s}
.category-pill:hover{background:var(--bg-hover);color:var(--text-primary)}
.category-pill.active{background:var(--color-primary);color:white;border-color:var(--color-primary)}
.app-grid-section{padding:24px 32px 64px;max-width:1200px;margin:0 auto}
.app-grid-section h2{font-size:20px;font-weight:600;color:var(--text-primary);margin-bottom:20px}
.app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.app-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:24px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;overflow:hidden}
.app-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.12);border-color:var(--color-primary)}
.app-card-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;background:var(--color-primary-light)}
.app-card h3{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:8px}
.app-card p{font-size:13px;color:var(--text-secondary);line-height:1.5;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.app-card-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.app-card-tag{padding:3px 10px;border-radius:9999px;font-size:11px;font-weight:500;background:var(--bg-secondary);color:var(--text-secondary)}
.app-card-modules{font-size:11px;color:var(--text-muted);margin-top:8px}
.app-card.featured{border-color:var(--color-primary);border-width:2px}
.app-card.featured::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#1a73e8,#7c3aed)}
.app-card-badge{position:absolute;top:12px;right:12px;padding:3px 10px;border-radius:9999px;font-size:11px;font-weight:600;background:var(--color-success-light);color:var(--color-success)}
.app-preview-overlay{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.5);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .25s}
.app-preview-overlay.active{opacity:1;visibility:visible}
.app-preview{background:var(--card-bg);border-radius:20px;box-shadow:0 24px 64px rgba(0,0,0,.2);width:90%;max-width:640px;max-height:85vh;overflow:hidden;transform:scale(.95) translateY(12px);transition:transform .25s}
.app-preview-overlay.active .app-preview{transform:scale(1) translateY(0)}
.app-preview-header{display:flex;align-items:flex-start;gap:16px;padding:32px 32px 0}
.app-preview-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:28px;background:var(--color-primary-light);flex-shrink:0}
.app-preview-info{flex:1}
.app-preview-info h2{font-size:22px;font-weight:700;color:var(--text-primary)}
.app-preview-info .category-tag{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:9999px;font-size:12px;font-weight:500;background:var(--color-primary-light);color:var(--color-primary)}
.app-preview-close{width:36px;height:36px;border:none;background:var(--bg-secondary);color:var(--text-secondary);border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.app-preview-close:hover{background:var(--bg-hover)}
.app-preview-body{padding:24px 32px}
.app-preview-body p{font-size:14px;color:var(--text-secondary);line-height:1.7;margin-bottom:20px}
.app-preview-features{margin-bottom:24px}
.app-preview-features h4{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:12px}
.app-preview-features ul{list-style:none;padding:0}
.app-preview-features li{padding:6px 0;font-size:13px;color:var(--text-secondary);display:flex;align-items:center;gap:8px}
.app-preview-features li::before{content:"\2713";color:var(--color-success);font-weight:600}
.app-preview-modules-list{margin-bottom:24px}
.app-preview-modules-list h4{font-size:13px;font-weight:600;color:var(--text-primary);margin-bottom:12px}
.module-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;margin:0 8px 8px 0;background:var(--bg-secondary);border:1px solid var(--border-color);font-size:12px;color:var(--text-secondary)}
.app-preview-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 32px 24px;gap:12px}
.app-preview-footer .cta-text{font-size:13px;color:var(--text-muted)}
.skeleton{background:var(--bg-secondary);border-radius:8px;animation:pulse 1.5s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.skeleton-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:24px}
.skeleton-icon{width:48px;height:48px;border-radius:12px;margin-bottom:16px}
.skeleton-title{height:16px;width:60%;border-radius:4px;margin-bottom:12px}
.skeleton-text{height:12px;width:90%;border-radius:4px;margin-bottom:8px}
.skeleton-text-short{height:12px;width:40%;border-radius:4px}
.public-footer{text-align:center;padding:32px;border-top:1px solid var(--border-color);font-size:13px;color:var(--text-muted)}
.public-footer a{color:var(--color-primary);text-decoration:none}
.featured-cards{display:flex;gap:28px;justify-content:center;align-items:stretch;flex-wrap:wrap;padding:40px 32px 64px;max-width:1100px;margin:0 auto}
.featured-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:20px;padding:36px;width:400px;max-width:100%;display:flex;flex-direction:column;text-align:left;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;position:relative;overflow:hidden}
.featured-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.12);border-color:var(--color-primary)}
.featured-card.featured{border-color:var(--color-primary);border-width:2px}
.featured-card.featured::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#1a73e8,#7c3aed)}
.featured-card-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:28px;background:var(--color-primary-light);margin-bottom:20px}
.featured-card-title{font-size:20px;font-weight:700;color:var(--text-primary);margin-bottom:10px}
.featured-card p{font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:28px;flex:1}
.featured-card-footer{margin-top:auto}
.featured-card-footer .btn{width:100%}
@media(max-width:768px){.featured-cards{padding:24px 16px 48px}.featured-card{width:100%;padding:28px}}
@media(max-width:768px){.hero{padding:48px 20px 32px}.hero h1{font-size:28px}.hero p{font-size:15px}.app-grid-section{padding:16px}.app-grid{grid-template-columns:1fr}.public-topbar{padding:0 16px}.category-bar{padding:16px 16px 8px}}
.product-selection{max-width:960px;margin:0 auto;padding:0}
.product-selection-header{text-align:center;margin-bottom:40px}
.product-selection-header h1{font-size:28px;font-weight:700;color:var(--text-primary);margin-bottom:8px}
.product-selection-header p{font-size:15px;color:var(--text-secondary);max-width:480px;margin:0 auto;line-height:1.6}
.product-selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.ps-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:24px;display:flex;flex-direction:column;transition:transform .2s,box-shadow .2s,border-color .2s}
.ps-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.1);border-color:var(--color-primary)}
.ps-card-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;background:var(--color-primary-light)}
.ps-card-body{flex:1}
.ps-card-body h3{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:8px}
.ps-card-body p{font-size:13px;color:var(--text-secondary);line-height:1.5;margin-bottom:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ps-card-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ps-tag{padding:3px 10px;border-radius:9999px;font-size:11px;font-weight:500;background:var(--bg-secondary);color:var(--text-secondary)}
.ps-card-footer{margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color)}
.ps-subscribe-btn{width:100%;padding:10px 16px;font-size:14px;font-weight:500}
.btn-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;margin-right:6px;vertical-align:middle}
@keyframes spin{to{transform:rotate(360deg)}}
.empty-state{text-align:center;padding:64px 32px;color:var(--text-secondary)}
.empty-state p{font-size:15px}
@media(max-width:768px){.product-selection-grid{grid-template-columns:1fr}.product-selection-header h1{font-size:22px}}
.public-app-wrap{max-width:960px;margin:0 auto;padding:32px 32px 64px}
.public-app-wrap .card{margin-bottom:16px}
@media(max-width:768px){.public-app-wrap{padding:20px 16px 48px}}