/* Facebook-style social layout with Vibespace's visual identity. */
[data-palette=daylight] .follow,[data-palette=daylight] .tabs button.active,[data-palette=daylight] .build-actions .open-build,[data-palette=daylight] .text-button,[data-palette=daylight] .social-sidebar nav a span,[data-palette=daylight] .post-copy .tag:before,[data-palette=daylight] .composer-actions button:first-child span,[data-palette=daylight] .platform-header nav a.active{color:#56661e}
body{background:var(--bg);line-height:1.5}.platform-header{position:fixed;z-index:30;inset:0 0 auto;height:64px;padding:0 20px;gap:15px;background:var(--panel);box-shadow:0 2px 7px #0002;border-bottom:1px solid var(--line)}.brand{font-size:26px;gap:7px}.brand svg{width:31px}.platform-header nav{position:absolute;left:53%;transform:translateX(-50%);top:0;margin:0;gap:7px;height:64px;align-items:center}.platform-header nav a{font-size:0;width:81px;height:58px;border-radius:8px;justify-content:center;position:relative;padding:0;color:var(--muted)}.platform-header nav svg{width:24px;height:24px;display:block;stroke-width:1.8}.platform-header nav a.active{background:transparent;color:var(--lime);border-radius:0}.platform-header nav a.active:after{content:'';height:3px;background:var(--lime);position:absolute;left:0;right:0;bottom:-3px}.platform-header nav a:hover{background:color-mix(in srgb,var(--text) 6%,var(--panel))}.header-actions{margin-left:auto;gap:10px}.account-chip{display:block}.palette-open{width:38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--text) 9%,var(--panel));color:var(--text);font-size:22px}.primary.compact{font-size:12px;padding:9px 13px;border-radius:20px}.topbar{position:fixed;top:12px;left:199px;width:211px;z-index:35;height:40px;padding:0;margin:0}.search{width:100%;border:0;border-radius:24px;background:color-mix(in srgb,var(--text) 6%,var(--panel));padding:11px 12px;margin:0}.search input{font-size:12px}.search kbd{display:none}.social-sidebar{position:fixed;left:0;top:82px;width:238px;padding:0 12px;z-index:10}.sidebar-account{padding:10px 12px;display:flex;align-items:center;gap:11px;width:100%;text-align:left;font-size:14px;border-radius:8px}.sidebar-account .avatar{width:37px;height:37px;background:var(--pink)}.social-sidebar nav{display:grid;gap:3px;margin:5px 0 19px}.social-sidebar nav a{display:flex;align-items:center;gap:15px;padding:11px 16px;border-radius:8px;font-size:14px;font-weight:500}.social-sidebar nav a span{font-size:24px;width:25px;line-height:1;color:var(--lime);text-align:center}.social-sidebar nav a.active,.sidebar-account:hover,.sidebar-shortcut:hover{background:color-mix(in srgb,var(--text) 7%,var(--bg))}.social-sidebar nav a:hover{background:color-mix(in srgb,var(--text) 5%,var(--bg))}.social-sidebar hr{border:0;border-top:1px solid var(--line);margin:0 12px 19px}.shortcut-label{padding:0 15px;font-size:14px;font-weight:600;color:var(--muted);margin-bottom:9px}.sidebar-shortcut{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:8px;text-align:left;font-size:13px;width:100%}.shortcut-code{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:var(--panel);border:1px solid var(--line);font-size:15px;color:var(--pink)}.sidebar-note{margin:22px 13px;padding:18px;border:1px solid var(--line);border-radius:12px;background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--lime) 12%,transparent),transparent 70%),var(--panel)}.sidebar-note>span{color:var(--lime);font-size:29px}.sidebar-note h3{font-size:23px;font-weight:800;line-height:1.18;letter-spacing:-1px;margin:8px 0 10px}.sidebar-note p{font-size:12px;color:var(--muted);line-height:1.6}.sidebar-disclosure{display:block;margin:15px 25px;font-size:11px;color:var(--muted);line-height:1.7}.app-shell{margin:0}main{max-width:1180px;margin-left:245px;padding:90px 28px 45px;min-height:100vh}.social-layout{display:grid;grid-template-columns:minmax(0,600px) 255px;gap:45px;justify-content:center}.feed-column{min-width:0}.build-grid,.wide-grid{grid-template-columns:1fr;gap:18px}.space-stories{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-bottom:22px}.space-story{border:1px solid var(--line);border-radius:12px;height:175px;overflow:hidden;position:relative;text-align:left;padding:0;background:var(--panel);box-shadow:0 2px 4px #0002;transition:transform .15s}.space-story:hover{transform:translateY(-3px)}.story-art{position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,#fff5,transparent 60%),var(--story-color,var(--lime));display:grid;place-items:center;color:#342c3d}.story-art:before{content:'';position:absolute;width:100px;height:100px;border:1px solid #51454344;border-radius:50%;transform:rotate(15deg);left:-25px;top:30px}.story-art span{font-size:68px;font-weight:800;transform:rotate(-15deg)}.space-story:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#20251cee)}.space-story .avatar{position:absolute;left:11px;top:11px;border:3px solid var(--lime);width:34px;height:34px;z-index:2;font-size:11px}.space-story strong{position:absolute;bottom:12px;left:12px;font-size:11px;z-index:2;color:#fff}.create-space .story-art{inset:0 0 46px;background:radial-gradient(#d4f76b22 1px,transparent 1px) 0 0/10px 10px,#30372a;color:var(--lime)}.create-space .story-art span{font:600 30px monospace;transform:rotate(-10deg)}.create-space:after{display:none}.create-space strong{color:var(--text);left:0;right:0;text-align:center;bottom:9px}.create-space>b{position:absolute;bottom:30px;left:calc(50% - 17px);width:34px;height:34px;border:4px solid var(--panel);border-radius:50%;display:grid;place-items:center;background:var(--lime);color:#243018;font-size:24px;font-weight:400;line-height:1}.composer{border:1px solid var(--line);border-radius:11px;background:var(--panel);padding:13px 16px;box-shadow:0 1px 3px #0001}.composer-top{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding-bottom:13px}.composer-top>button:first-child{padding:0}.composer .avatar{height:39px;width:39px;background:var(--pink);font-size:15px}.compose-prompt{flex:1;text-align:left;background:color-mix(in srgb,var(--text) 6%,var(--panel));color:var(--muted);border-radius:25px;padding:11px 16px;font-size:14px}.compose-prompt:hover{background:color-mix(in srgb,var(--text) 10%,var(--panel))}.composer-actions{display:flex;justify-content:space-around;gap:4px;padding-top:10px}.composer-actions button{font-size:11px;font-weight:600;display:flex;align-items:center;gap:8px;border-radius:7px;padding:7px 6px;color:var(--muted)}.composer-actions button:hover{background:color-mix(in srgb,var(--text) 5%,var(--panel))}.composer-actions span{font-size:19px;line-height:1;color:var(--lime)}.composer-actions button:nth-child(2) span{color:var(--pink)}.composer-actions button:nth-child(3) span{font:600 13px monospace;color:#e7b899}.feed-toolbar{margin:17px 0 13px;border:0;min-height:30px}.tabs{gap:18px}.tabs button{padding:5px 0;font-size:12px;color:var(--muted)}.tabs button.active{color:var(--lime)}.tabs button.active:after{display:none}.filter select{font-size:11px;background:var(--bg);color:var(--muted);border:0}.feed-toolbar h1{font-size:24px}.build-card{border-radius:11px;background:var(--panel);border-color:var(--line);box-shadow:0 1px 3px #0001;transition:border-color .2s}.build-card:hover{transform:none;border-color:color-mix(in srgb,var(--muted) 60%,var(--line))}.post-byline{display:flex;align-items:center;justify-content:space-between;padding:16px 17px 0}.post-author{display:flex;align-items:center;gap:11px;padding:0;text-align:left}.post-author .avatar{width:39px;height:39px;font-size:14px}.post-author strong{display:block;font-size:13px;font-weight:600;color:var(--text)}.post-author small{display:block;font-size:11px;color:var(--muted);margin-top:3px}.post-save{font-size:23px;line-height:1;color:var(--muted);padding:6px 9px;border-radius:50%}.post-save:hover{background:color-mix(in srgb,var(--text) 6%,var(--panel))}.post-save.saved{color:var(--lime)}.post-copy{padding:14px 17px 17px}.post-copy h3{font-size:16px;font-weight:600;letter-spacing:-.2px;margin-bottom:7px}.post-copy h3 button{font:inherit;padding:0;text-align:left}.post-copy>p{font-size:13px;color:var(--text);line-height:1.7}.post-copy .tags{margin-top:11px}.post-copy .tag{border:0;background:none;color:var(--muted);padding:0;font-size:11px;margin-right:9px}.post-copy .tag:before{content:'#';color:var(--lime)}.project-visual{height:309px;padding:35px 60px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.mock-window{height:230px;width:92%;max-width:420px;box-shadow:0 12px 30px #0002;border-radius:8px}.mock-top{height:29px;padding:0 13px;gap:5px}.mock-top i{width:5px;height:5px}.mock-top small{font-size:8px}.mock-body{padding:31px 30px}.mock-body h3{font-size:29px;line-height:1.1;font-weight:700}.mock-caption{font-size:10px;margin:10px 0 15px}.mock-pill{font-size:9px;padding:6px 13px}.garden-icon{font-size:65px}.visual-garden .mock-body{gap:25px}.orbit-sphere{height:104px;width:104px}.orbit-sphere:after{width:158px;height:40px;top:34px;left:-28px}.orbit-caption{font-size:11px;margin-top:18px}.canvas-row{gap:7px;margin-top:16px}.canvas-swatch{height:64px}.focus-time{font-size:67px;margin:12px}.custom-symbol{font-size:74px}.post-stats{display:flex;justify-content:space-between;align-items:center;padding:12px 17px 10px;color:var(--muted);font-size:11px}.post-stats i{font-style:normal;background:var(--pink);color:#302437;border-radius:50%;display:inline-grid;place-items:center;width:19px;height:19px;margin-right:5px;font-size:10px}.post-stats button{font-size:11px;padding:0;color:var(--muted)}.build-actions{margin:0 14px;padding:5px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.build-actions button{font-size:12px;font-weight:500;padding:9px 2px;border-radius:6px;color:var(--muted)}.build-actions button:hover{background:color-mix(in srgb,var(--text) 5%,var(--panel))}.build-actions .open-build{margin:0;color:var(--lime)}.build-actions .liked{color:var(--pink)}.rail{display:flex;flex-direction:column;gap:24px;padding-top:5px}.rail-card{background:transparent;border:0;padding:0;border-radius:0}.rail-card:first-child{order:2;border-top:1px solid var(--line);padding-top:22px}.rail-card:nth-child(2){order:1}.rail-title h3{font-size:15px;font-weight:600;color:var(--muted)}.rail-title>span{color:var(--muted)}.people{gap:20px}.person .avatar{width:36px;height:36px;font-size:12px}.person-info strong{font-size:12px}.person-info small{font-size:10px;line-height:1.5;display:block}.follow{border:0;background:color-mix(in srgb,var(--lime) 10%,var(--bg));color:var(--lime);padding:7px 9px;border-radius:6px;font-size:10px}.follow.followed{background:var(--panel);color:var(--muted)}.manifesto{display:none}.community-note{order:3;font-size:11px;color:var(--muted)}.featured-preview{height:156px}.mini-profile{color:#dfd0ff}.rail-card>p{font-size:12px}.featured-maker strong{font-size:12px}.featured-maker small{font-size:11px}.rail-card .text-button{font-size:11px}.profile-route .social-sidebar{display:none}.profile-route main{margin:0 auto;max-width:1180px;padding-top:92px}.profile-route .topbar{left:199px}.profile-route .wide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-route .project-visual{height:280px;padding:30px}.profile-route .mock-window{height:210px}.profile-route .profile-frame{border:0}.profile-topline{margin-bottom:22px}.profile-build-heading{margin-top:28px}.profile-build-heading h2{font-size:22px}.empty{background:var(--panel);border:1px dashed var(--line)}footer{margin-left:273px;max-width:900px;margin-right:28px;font-size:11px}footer .footer-brand,footer span{color:var(--muted)}.profile-route footer{margin:0 auto;max-width:1124px}.palette-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}dialog:has(.palette-grid){width:920px}.palette-choice{text-align:left;background:var(--choice-bg);color:var(--choice-text);border:1px solid var(--choice-border);padding:14px;border-radius:12px;min-width:0}.palette-choice:hover,.palette-choice[aria-pressed=true]{outline:2px solid var(--choice-accent);outline-offset:2px}.palette-choice>strong{display:block;font-size:15px;margin:15px 0 5px}.palette-choice>small{color:var(--choice-muted);font-size:11px;display:block;line-height:1.7}.palette-mini{height:145px;border:1px solid var(--choice-border);border-radius:7px;overflow:hidden;background:var(--choice-bg)}.mini-chrome{background:var(--choice-panel);border-bottom:1px solid var(--choice-border);padding:9px 7px;font-size:10px;color:var(--choice-accent);display:flex;gap:5px}.mini-chrome b{font-size:10px;font-weight:600;letter-spacing:-.2px;color:var(--choice-text)}.mini-chrome>span{margin-left:auto;font-size:11px}.mini-layout{display:grid;grid-template-columns:1fr 2.7fr 1fr;gap:6px;padding:10px 7px}.mini-layout i{height:5px;display:block;margin:0 0 9px;background:var(--choice-border);border-radius:2px}.mini-compose{height:17px;background:var(--choice-panel);border:1px solid var(--choice-border);border-radius:4px;margin-bottom:7px}.mini-post{height:74px;background:var(--choice-panel);padding-top:15px;border:1px solid var(--choice-border);border-radius:4px;overflow:hidden}.mini-post>span{height:42px;display:grid;place-items:center;color:#35243d;font-size:28px}.palette-swatches{display:flex;gap:5px;margin-top:12px}.palette-swatches span{height:21px;flex:1;border-radius:4px;border:1px solid var(--choice-border)}dialog{background:var(--panel);border-color:var(--line)}.modal-header,.modal-footer{border-color:var(--line)}.field input,.field textarea,.field select,.comment-form input{background:var(--bg);border-color:var(--line);color:var(--text)}.field{color:var(--text)}.comment{background:var(--panel);border:1px solid var(--line)}.secondary{background:var(--panel);border-color:var(--line)}.secondary:hover{background:color-mix(in srgb,var(--text) 8%,var(--panel))}.editor-toolbar,.pane-label,.editor-details,.preview-pane{background:var(--panel);border-color:var(--line)}.editor-help{color:var(--muted)}.code-pane textarea{background:var(--bg);color:var(--text)}.editor-toolbar span{color:var(--muted)}.demo-note,.validation-note{color:var(--muted)}.badge{color:var(--muted)}
@media(min-width:1600px){main{margin-left:270px;max-width:1240px}.social-layout{grid-template-columns:minmax(0,640px) 280px;gap:70px}.social-sidebar{width:265px}.space-story{height:190px}.platform-header nav a{width:95px}}
@media(max-width:1250px){.platform-header nav{left:56%}.platform-header nav a{width:65px}.topbar{width:177px}.social-sidebar{width:210px}main{margin-left:211px;padding-left:25px;padding-right:25px}.social-layout{grid-template-columns:minmax(0,580px) 225px;gap:28px}.person-info small{font-size:9px}.project-visual{padding:35px 35px}}
@media(max-width:1100px){.rail{display:none}.social-layout{grid-template-columns:minmax(0,650px)}.social-sidebar{width:222px}main{margin-left:225px}.platform-header nav{left:59%}.platform-header nav a{width:53px}.topbar{width:145px}.search input{font-size:11px}.platform-header .compact{font-size:0;width:36px;padding:4px}.platform-header .compact:first-letter{font-size:22px}.header-actions{gap:8px}.person-info small{font-size:10px}.space-story{height:172px}footer{margin-left:250px}}
@media(max-width:850px){.platform-header nav{left:57%}.platform-header nav a{width:55px}.brand{font-size:0;gap:0}.brand>span{display:none}.brand svg{width:33px}.topbar,.profile-route .topbar{left:67px;width:180px}.social-sidebar{display:none}main{margin-left:0;max-width:710px;margin-right:auto;margin-left:auto;padding-top:88px}.social-layout{grid-template-columns:minmax(0,650px)}.profile-route main{padding-left:24px;padding-right:24px}footer{margin:0 25px}.profile-route footer{margin:0 25px}}
@media(max-width:720px){.platform-header{height:112px;flex-wrap:nowrap;align-content:normal;align-items:flex-start;padding:13px 17px;background:var(--panel);gap:0}.brand{font-size:0;height:33px}.brand svg{height:33px;width:33px}.header-actions{align-items:center;height:34px;gap:8px}.account-chip .avatar{width:32px;height:32px}.palette-open{height:32px;width:32px;font-size:21px}.platform-header .compact{font-size:0;height:32px;width:32px;padding:3px}.platform-header nav{left:0;top:57px;transform:none;width:100%;height:55px;justify-content:space-around;gap:0;padding:0 9px}.platform-header nav a{width:18%;height:50px;font-size:0;padding:0;border-radius:8px;gap:0}.platform-header nav svg{width:22px;height:22px;display:block}.platform-header nav a.active:after{bottom:-3px}.topbar,.profile-route .topbar{top:13px;left:61px;width:calc(100% - 210px);height:34px;padding:0}.search{padding:9px 10px;height:34px;gap:6px}.search input{font-size:12px;min-width:0}.search svg{width:14px;height:14px}.search kbd{display:none}main{padding:132px 15px 35px;max-width:650px;min-height:100vh}.space-stories{gap:7px;margin-bottom:16px}.space-story{height:148px;border-radius:10px}.space-story .avatar{left:7px;top:8px;height:29px;width:29px;font-size:10px;border-width:2px}.space-story strong{font-size:9px;left:8px;bottom:11px;line-height:1.3}.story-art span{font-size:50px}.create-space strong{left:0;bottom:10px;font-size:9px}.create-space .story-art span{font-size:21px}.create-space .story-art{bottom:43px}.create-space>b{bottom:28px;width:30px;height:30px;left:calc(50% - 15px);font-size:21px}.composer{padding:12px;border-radius:10px}.composer-top{gap:8px}.compose-prompt{font-size:13px;padding:11px 12px}.composer-actions{gap:3px}.composer-actions button{font-size:10px;gap:5px;padding:6px 2px}.composer-actions span{font-size:16px}.composer-actions button:nth-child(3) span{font-size:11px}.feed-toolbar{margin:17px 3px 12px}.tabs{gap:18px}.tabs button{font-size:12px}.filter{max-width:100px}.filter select{width:100%;font-size:11px}.build-card{border-radius:10px}.post-byline{padding:14px 13px 0}.post-copy{padding:13px 14px 16px}.post-copy h3{font-size:16px}.post-copy p{font-size:13px}.project-visual{height:266px;padding:28px 25px}.mock-window{height:206px;max-width:360px;width:95%}.mock-body{padding:25px 23px}.mock-body h3{font-size:24px}.mock-caption{font-size:9px;margin:8px 0 12px}.garden-icon{font-size:54px}.visual-garden .mock-body{gap:20px}.orbit-sphere{width:94px;height:94px}.orbit-sphere:after{width:148px;height:35px;top:28px;left:-28px}.focus-time{font-size:59px}.canvas-swatch{height:55px}.post-stats{padding:11px 14px 9px}.build-actions{margin:0 10px;padding:5px 0}.build-actions button{font-size:11px;padding:10px 1px}.profile-route main{padding:133px 15px 35px}.profile-route .wide-grid{grid-template-columns:1fr}.profile-topline{margin-bottom:17px}.profile-controls button{font-size:11px;padding:8px 10px}.profile-crumbs{font-size:11px}.profile-route .project-visual{height:266px;padding:28px 25px}.profile-route .mock-window{height:206px}.profile-route footer,footer{margin:0 15px}.palette-grid{grid-template-columns:1fr;gap:16px}.palette-choice{display:grid;grid-template-columns:140px 1fr;grid-template-rows:auto auto auto;gap:3px 15px;padding:13px}.palette-mini{grid-row:1/4;height:133px;grid-column:1}.palette-choice>strong{margin:8px 0 3px;font-size:15px}.palette-choice>small{font-size:11px}.palette-swatches{margin-top:9px}.mini-layout{grid-template-columns:1fr 3fr 1fr;gap:4px;padding:9px 6px}.mini-chrome{font-size:9px;padding:9px 5px;gap:3px}.mini-chrome b{font-size:9px}.mini-chrome>span{display:none}.palette-swatches span{height:23px}.editor-toolbar button,.editor-toolbar label{font-size:11px}.field input,.field textarea,.search input,.comment-form input{font-size:16px}.search input{font-size:13px}.compose-prompt{min-width:0}.editor-details{gap:12px}}
@media(max-width:380px){.space-story{height:138px}.space-story strong{font-size:8px}.composer-actions button{font-size:9px}.post-author strong{font-size:12px}.post-author small{font-size:10px}.project-visual{padding:28px 19px}.mock-body{padding:25px 18px}.garden-icon{font-size:44px}.visual-garden .mock-body{gap:14px}.build-actions button{font-size:10px}.palette-choice{grid-template-columns:115px 1fr;gap:3px 12px}.palette-mini{height:130px}}
