/* Vibe keeps the existing feed renderers and actions inside a wider social workspace. */
@media (min-width: 1280px) {
    html:not([data-theme="light"]) body.desktop-navigation-enabled[data-page="vibe"]:has(#oneliners) {
        background: #091723 !important;
        background-image: none !important;
    }
}
body[data-page="vibe"] #oneliners { margin-top: -1.6rem; padding-top: 0 !important; background: #091723 !important; isolation: isolate; }
html:not([data-theme="light"]) body[data-page="vibe"] #oneliners > .category-scene::before {
    background-image: linear-gradient(180deg, #0917231a, #09172366 45%, #091723eb 70%, #091723), var(--category-image);
}
#oneliners .vibe-hero {
    position: relative; display: flex; align-items: center; justify-content: center;
    z-index: 1; min-height: 220px; width: 100%; overflow: hidden;
}
#oneliners .vibe-hero-copy { position: relative; width: min(850px, calc(100% - 32px)); text-align: center; }
#oneliners .vibe-hero .sec-header { margin: 0 0 14px !important; padding: 0 !important; text-align: center; }
#oneliners .vibe-hero .sec-header::after { display: none !important; }
#oneliners .vibe-hero .sec-header h2 { margin: 0 0 8px !important; font-size: 48px !important; line-height: 1.1 !important; letter-spacing: 0 !important; }
#oneliners .vibe-hero .sec-header p { margin: 0 !important; padding: 0 !important; color: #edf1f8 !important; font-size: 15px !important; white-space: normal !important; text-shadow: 0 1px 5px #06101d; }
#oneliners #olFilterRow { width: fit-content; max-width: 100%; margin: 0 auto !important; padding: 4px; gap: 3px; border: 1px solid #a6b6c744; border-radius: 999px; background: #0b1723ae; backdrop-filter: blur(10px); }
#oneliners #olFilterRow .sug-add-cat-btn { min-height: 38px; border-radius: 999px; color: #e0e7f0; }
#oneliners #olFilterRow .sug-add-cat-btn.active { background: #234e9f; border-color: #4b78da; color: #fff; }
#oneliners #olViewToggle { margin-left: 2px; }
#oneliners > .sec-container { position: relative; z-index: 1; width: min(1880px, calc(100% - 32px)); max-width: none !important; margin: 0 auto !important; padding: 12px 0 80px !important; }
#oneliners .vibe-dashboard-grid { display: grid; grid-template-columns: minmax(220px, 270px) minmax(0, 1fr) minmax(230px, 290px); align-items: start; gap: 18px; }
#oneliners .vibe-feed-main, #oneliners .vibe-left-rail, #oneliners .vibe-right-rail { min-width: 0; }
#oneliners .vibe-left-rail, #oneliners .vibe-right-rail { display: grid; gap: 16px; }
#oneliners :is(.vibe-left-rail,.vibe-right-rail)[hidden] { display: none !important; }
#oneliners:not(.vibe-authenticated) .vibe-dashboard-grid { display: block; max-width: 760px; margin: auto; }
#oneliners .vibe-profile-panel, #oneliners .vibe-rail-panel {
    overflow: hidden; border: 1px solid #ffffff1c; border-radius: 8px; background: #0d1e2be8;
    color: #edf2f7;
}
#oneliners .vibe-profile-cover { height: 105px; background-image: linear-gradient(#0a182226, #0a1822a3), var(--category-image, url('/assets/scenes/social.webp')); background-size: cover; background-position: center 65%; }
#oneliners .vibe-profile-details { position: relative; padding: 46px 18px 18px; }
#oneliners .vibe-profile-avatar {
    display: grid; place-items: center; overflow: hidden; flex: 0 0 auto;
    border: 2px solid #f2c14e; border-radius: 50%; background: #253546;
    color: #fff; font-weight: 700;
}
#oneliners .vibe-profile-avatar { position: absolute; left: 18px; top: -40px; width: 72px; height: 72px; font-size: 28px; box-shadow: 0 4px 12px #0008; }
#oneliners .vibe-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
#oneliners .vibe-profile-details h3 { margin: 0; font-size: 18px; line-height: 1.3; overflow-wrap: anywhere; }
#oneliners #vibeProfileHandle { margin: 3px 0 12px; color: #a8bfda; font-size: 12px; overflow-wrap: anywhere; }
#oneliners .vibe-profile-bio { margin: 0 0 16px; color: #cad3dc; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
#oneliners .vibe-profile-bio[hidden] { display: none; }
#oneliners .vibe-profile-details > button { width: 100%; min-height: 38px; border: 1px solid #40566b; border-radius: 6px; background: #1a2b3a; color: #f2f6fb; cursor: pointer; }
#oneliners .vibe-profile-details > button span { margin-left: 5px; }
#oneliners .vibe-rail-panel { padding: 16px; }
#oneliners .vibe-rail-panel h3 { margin: 0 0 12px; font-size: 15px; line-height: 1.3; }
#oneliners .vibe-left-rail .vibe-rail-panel > button { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 40px; padding: 7px 0; border: 0; border-top: 1px solid #2b3b4a; background: none; color: #d9e4ef; text-align: left; cursor: pointer; }
#oneliners .vibe-left-rail .vibe-rail-panel > button span { color: #f2c14e; }
#oneliners .vibe-rail-heading { display: flex; align-items: start; justify-content: space-between; gap: 8px; }
#oneliners .vibe-rail-heading button { border: 0; background: none; color: #9ebcfa; font-size: 12px; cursor: pointer; }
#oneliners .vibe-games-panel > button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 62px; padding: 8px 0; border: 0; border-top: 1px solid #2b3b4a; background: none; color: #dce7f3; text-align: left; cursor: pointer; }
#oneliners .vibe-games-panel > button > span:nth-child(2) { flex: 1; min-width: 0; }
#oneliners .vibe-games-panel strong, #oneliners .vibe-games-panel small { display: block; }
#oneliners .vibe-games-panel strong { font-size: 13px; }
#oneliners .vibe-games-panel small { margin-top: 2px; color: #a6b7c6; font-size: 11px; }
#oneliners .vibe-game-mark { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border-radius: 6px; background: #203b4b; font-size: 20px; }
#oneliners .vibe-connect-panel { background: linear-gradient(145deg, #102738, #221c35); }
#oneliners .vibe-connect-panel p { margin: 0 0 16px; color: #cad6e3; font-size: 13px; line-height: 1.5; }
#oneliners .vibe-connect-actions { display: flex; flex-wrap: wrap; gap: 8px; }
#oneliners .vibe-connect-actions button { min-height: 38px; padding: 6px 10px; border: 1px solid #637a90; border-radius: 6px; background: #233b50; color: #fff; font-size: 12px; cursor: pointer; }
#oneliners .vibe-connect-actions button:first-child { border-color: #f2c14e; background: #f2c14e; color: #242018; font-weight: 700; }
#oneliners .vibe-dashboard-grid button:focus-visible, #oneliners #olFilterRow button:focus-visible { outline: 2px solid #88d8c5; outline-offset: 2px; }
#oneliners .oneliners-flow.ol-view-feed, #oneliners #circleAllGrid { max-width: none !important; }
#oneliners .ol-view-feed .oneliner-card { margin-bottom: 14px !important; border: 1px solid #ffffff1c !important; border-radius: 8px !important; background: #0d1e2be8 !important; overflow: hidden; }
#oneliners .ol-view-feed .oneliner-card .card-inner { padding: 16px !important; }
#oneliners #circleAllGrid .feed-card { margin-bottom: 14px; padding: 16px; border: 1px solid #ffffff1c; border-radius: 8px; background: #0d1e2be8; }
#oneliners .ol-view-feed .oneliner-card:hover { background: #142839f0 !important; border-color: #a2bbcf38 !important; }
#oneliners #circleAllGrid .feed-card:hover { background: #142839f0; border-color: #a2bbcf38; }
#oneliners #circleAllGrid .feed-avatar { top: 16px; left: 16px; }
#oneliners .ol-view-feed .oneliner-media, #oneliners #circleAllGrid :is(.feed-photo,.oneliner-media) { max-height: 520px !important; }
#oneliners .ol-view-feed .oneliner-card .ol-post-author-name, #oneliners #circleAllGrid .feed-author-name { color: #f4f6f9; }
@media (max-width: 1550px) {
    #oneliners .vibe-dashboard-grid { grid-template-columns: minmax(205px, 250px) minmax(0, 1fr); }
    #oneliners .vibe-right-rail { display: none; }
}
@media (max-width: 1050px) {
    #oneliners .vibe-dashboard-grid { display: block; max-width: 760px; margin: auto; }
    #oneliners .vibe-left-rail { display: none; }
    #oneliners .vibe-hero-copy { width: min(680px, calc(100% - 36px)); margin: 0; }
}
@media (max-width: 600px) {
    #oneliners .vibe-hero { min-height: 190px; }
    #oneliners .vibe-hero .sec-header h2 { font-size: 34px !important; }
    #oneliners .vibe-hero .sec-header p { font-size: 13px !important; }
    #oneliners #olFilterRow { flex-wrap: nowrap; width: calc(100% - 20px); overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }
    #oneliners #olFilterRow::-webkit-scrollbar { display: none; }
    #oneliners #olFilterRow .sug-add-cat-btn { flex: 0 0 auto; }
    #oneliners > .sec-container { width: calc(100% - 24px); padding-top: 10px !important; }
}
html[data-theme="light"] body[data-page="vibe"] #oneliners { background: #fff !important; }
html[data-theme="light"] body #oneliners .vibe-hero .dav-letter { color: #f5f7fb !important; text-shadow: 0 2px 7px #081421a8 !important; }
html[data-theme="light"] body #oneliners .vibe-hero .dav-letter:nth-child(3n+2) { color: #f2a8cd !important; }
html[data-theme="light"] body #oneliners .vibe-hero .dav-letter:nth-child(3n) { color: #a5e3d0 !important; }
html[data-theme="light"] body #oneliners .vibe-hero .sec-header p { color: #263747 !important; text-shadow: 0 1px 4px #ffffffc9 !important; }
html[data-theme="light"] body #oneliners .vibe-hero #olFilterRow .sug-add-cat-btn:not(.active) { color: #eef3fa !important; }
html[data-theme="light"] body #oneliners .vibe-hero #olFilterRow .sug-add-cat-btn.active { background: #234e9f !important; border-color: #5d83d4 !important; color: #fff !important; }
html[data-theme="light"] #oneliners :is(.vibe-profile-panel,.vibe-rail-panel) { background: #f5f8fb; border-color: #ced9e3; color: #263747; }
html[data-theme="light"] #oneliners :is(.vibe-profile-bio,.vibe-connect-panel p) { color: #41566b; }
html[data-theme="light"] #oneliners #vibeProfileHandle { color: #355983; }
html[data-theme="light"] #oneliners .vibe-profile-details > button { background: #fff; border-color: #bed0de; color: #34495e; }
html[data-theme="light"] #oneliners .vibe-left-rail .vibe-rail-panel > button,
html[data-theme="light"] #oneliners .vibe-games-panel > button { color: #243747; border-color: #d7e0e8; }
html[data-theme="light"] #oneliners .vibe-games-panel small { color: #52667a; }
html[data-theme="light"] #oneliners .vibe-game-mark { background: #e4edf4; }
html[data-theme="light"] #oneliners .vibe-connect-actions button:not(:first-child) { background: #e8f1f7; color: #254257; }
html[data-theme="light"] #oneliners .ol-view-feed .oneliner-card,
html[data-theme="light"] #oneliners #circleAllGrid .feed-card { background: #fff !important; border-color: #d5dfe8 !important; }
