/* ========================================================================== Neon Grid theme — override layer, scoped to . Loads AFTER the base assets/front.css, so these rules win the cascade. ========================================================================== */ body.theme-neon{background:#0a0a0f} /* denser, 16:9 tile grid (vs. the Default 4:3 cards) */ .theme-neon .grid-cams{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:9px} @media(max-width:640px){.theme-neon .grid-cams{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}} .theme-neon .cam{position:relative;display:block;border-radius:9px;overflow:hidden;background:#14141c;transition:transform .18s,box-shadow .18s} .theme-neon .cam:hover{transform:translateY(-2px);box-shadow:0 8px 26px rgba(0,0,0,.55)} .theme-neon .cam-thumb{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;border-radius:0} .theme-neon .cam-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s} .theme-neon .cam:hover .cam-thumb img{transform:scale(1.07)} /* base badges/meta from the default card are not used here */ .theme-neon .cam-meta,.theme-neon .badge,.theme-neon .viewers{display:none!important} /* overlaid badges */ .theme-neon .gc-live{position:absolute;top:7px;left:7px;z-index:3;background:#12e29b;color:#04120c;font:800 10px/1 system-ui,sans-serif;letter-spacing:.6px;padding:3px 6px;border-radius:4px;text-transform:uppercase;box-shadow:0 0 0 2px rgba(0,0,0,.25)} .theme-neon .gc-hd{position:absolute;top:7px;right:7px;z-index:3;background:rgba(0,0,0,.72);color:#fff;font:700 10px/1 system-ui,sans-serif;padding:3px 6px;border-radius:4px} /* bottom gradient overlay with name + viewers/country */ .theme-neon .gc-ov{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:20px 9px 7px;display:flex;flex-direction:column;gap:3px;background:linear-gradient(to top,rgba(0,0,0,.86),rgba(0,0,0,.32) 60%,transparent);pointer-events:none} .theme-neon .gc-nm{font:700 .93rem/1.1 system-ui,sans-serif;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .theme-neon .gc-nm.g-female{color:#ff74b3} .theme-neon .gc-nm.g-male{color:#5fc9ff} .theme-neon .gc-nm.g-couple{color:#ffd24a} .theme-neon .gc-nm.g-trans{color:#c88bff} .theme-neon .gc-r{display:flex;justify-content:space-between;align-items:center;color:#e2e5ef;font:600 .72rem/1 system-ui,sans-serif;min-height:13px} .theme-neon .gc-vw{display:inline-flex;align-items:center;gap:3px} .theme-neon .gc-cc{opacity:.85;letter-spacing:.4px;margin-left:auto} /* compact header + smaller hero so the grid dominates (Chaturbate-like) */ .theme-neon .hero-h1{font-size:1.45rem;margin:.2em 0 .5em} .theme-neon .hero-h1 span{opacity:.6;font-weight:500} .theme-neon .site-head{border-bottom:1px solid rgba(255,255,255,.06)} /* recolor the hero + model-page signup box away from the default pink/purple */ .theme-neon .hero{background:radial-gradient(900px 300px at 18% -40%, rgba(18,226,155,.22), transparent), radial-gradient(900px 300px at 92% -50%, rgba(95,201,255,.20), transparent)} .theme-neon .signup{background:linear-gradient(180deg,rgba(18,226,155,.10),transparent);border-color:rgba(18,226,155,.28)} .theme-neon .clip-cta-in{box-shadow:0 10px 30px rgba(18,226,155,.30)} /* accent shift: neon-green cues instead of pink */ body.theme-neon{--brand:#12e29b;--brand2:#5fc9ff} .theme-neon .sb-list a.on{background:rgba(18,226,155,.15)!important;color:#12e29b!important;font-weight:700} /* ========================================================================== Chaturbate-style filter sidebar (Neon) ========================================================================== */ .theme-neon .nsb .sb-inner{display:flex;flex-direction:column;gap:15px} .theme-neon .nsb-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:-2px} .theme-neon .nsb-title{font:800 13px/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.6px;color:#cfd3e0} .theme-neon .nsb-x{background:none;border:0;color:#9aa0b4;font-size:22px;line-height:1;cursor:pointer;padding:0 4px} .theme-neon .nsb-x:hover{color:#fff} .theme-neon .nsb-sec h3{font:800 12px/1 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.6px;color:#8a90a6;margin:0 0 8px} .theme-neon .nsb-sec h3 .nsb-reset{font-weight:600;text-transform:none;letter-spacing:0;color:#12e29b;font-size:11px} .theme-neon .nsb-pills{display:flex;flex-wrap:wrap;gap:6px} .theme-neon .nsb-pill{display:inline-block;padding:5px 9px;border:1px solid rgba(255,255,255,.14);border-radius:7px;background:#14141c;color:#dfe2ec;font:600 12px/1.1 system-ui,sans-serif;text-decoration:none;white-space:nowrap;transition:border-color .15s,color .15s,background .15s} .theme-neon .nsb-pill:hover{border-color:#12e29b;color:#fff} .theme-neon .nsb-pill.on{background:rgba(18,226,155,.15);border-color:#12e29b;color:#12e29b;font-weight:700} .theme-neon .nsb-search input{width:100%;box-sizing:border-box;padding:7px 10px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:#0f0f16;color:#fff;font-size:13px;margin-bottom:8px} .theme-neon .nsb-search input:focus{outline:none;border-color:#12e29b} .theme-neon .nsb-pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:9px;color:#9aa0b4;font:600 12px/1 system-ui,sans-serif} .theme-neon .nsb-pager button{background:none;border:0;color:#c7ccdc;cursor:pointer;font:600 12px/1 system-ui,sans-serif;padding:2px} .theme-neon .nsb-pager button:hover{color:#12e29b} .theme-neon .nsb-all{display:inline-block;margin-top:10px;color:#12e29b;font:700 12px/1 system-ui,sans-serif;text-decoration:none} .theme-neon .nsb-all:hover{text-decoration:underline} .theme-neon .nsb-age{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:#9aa0b4;font:600 12px/1 system-ui,sans-serif} .theme-neon .nsb-age input{width:52px;box-sizing:border-box;padding:6px 8px;border:1px solid rgba(255,255,255,.16);border-radius:7px;background:#0f0f16;color:#fff;font-size:13px} .theme-neon .nsb-age input:focus{outline:none;border-color:#12e29b} .theme-neon .nsb-age button{padding:6px 12px;border:0;border-radius:7px;background:#12e29b;color:#04120c;font-weight:800;cursor:pointer} /* reopen FAB + desktop collapse */ .theme-neon .nsb-open{display:none} @media(min-width:901px){ body.theme-neon.nsb-collapsed .sidebar{display:none} body.theme-neon.nsb-collapsed .layout{grid-template-columns:1fr} body.theme-neon.nsb-collapsed .nsb-open{position:fixed;left:14px;bottom:16px;z-index:120;display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border:0;border-radius:10px;background:#12e29b;color:#04120c;font-weight:800;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.45)} }