:root{--ink:#17212b;--muted:#70808f;--line:#dce5eb;--blue:#16a1dc;--blue-dark:#087cae;--cream:#f7fafb;--paper:#fff;--accent:#f6b544;--shadow:0 18px 50px rgba(28,66,89,.10)}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:14px Inter,system-ui,sans-serif}button,input,textarea{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}.site-shell{min-height:100vh}.topbar{height:70px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.topbar-inner{max-width:1240px;height:100%;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:10px;align-items:center;font-weight:800;font-size:20px;letter-spacing:-.7px}.brand-mark{width:30px;height:30px;border-radius:9px;background:var(--blue);color:#fff;display:grid;place-items:center;font:bold 22px Georgia;font-style:italic}.brand-mark.large{width:52px;height:52px;border-radius:16px;font-size:38px}.topnav{display:flex;gap:30px;margin-left:90px}.topnav button{color:var(--muted);font-weight:600}.topnav button:hover,.text-button{color:var(--blue)}.topbar-actions{display:flex;align-items:center;gap:15px}.icon-button{font-size:26px;color:var(--muted)}.button{border-radius:9px;padding:12px 20px;font-weight:700;transition:.18s}.button-primary{background:var(--blue);color:#fff;box-shadow:0 7px 16px rgba(22,161,220,.22)}.button-primary:hover{background:var(--blue-dark);transform:translateY(-1px)}.button-dark{background:var(--ink);color:#fff}.button-outline{border:1px solid #c7d4dc;background:#fff}.button-ghost{border:1px solid #cad9e0}.button-small{padding:8px 14px;font-size:12px}.wide{width:100%}.eyebrow{margin:0 0 13px;color:var(--blue);font:700 10px 'Space Mono',monospace;letter-spacing:1.8px}.view{display:none}.active-view{display:block}.hero-wrap{max-width:1160px;margin:0 auto;padding:105px 35px 85px;display:grid;grid-template-columns:1fr 430px;gap:110px;align-items:center}.hero-copy h1{font-size:76px;line-height:.96;letter-spacing:-5px;margin:0 0 24px}.hero-copy h1 em{color:var(--blue);font-style:normal}.hero-lede{font-size:19px;line-height:1.65;color:var(--muted);max-width:485px}.hero-actions{display:flex;gap:12px;margin-top:31px}.fine-print{font-size:11px;color:#9babb6;margin-top:20px}.hero-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:21px;box-shadow:var(--shadow);position:relative;transform:rotate(2deg)}.card-tape{position:absolute;top:-13px;left:42%;width:85px;height:25px;background:#f7d990;opacity:.8;transform:rotate(-4deg)}.hero-card-header,.post-meta{display:flex;align-items:center;gap:7px}.hero-card-header{padding-bottom:17px;border-bottom:1px solid var(--line);color:var(--blue);font:700 10px 'Space Mono';letter-spacing:1px}.hero-card-header .mono{margin-left:auto;color:#a3b3bd;font-weight:400}.live-dot{width:7px;height:7px;border-radius:50%;background:#57c477}.mini-post{display:flex;gap:11px;padding:18px 0;border-bottom:1px solid #eef2f4}.mini-post.faded{opacity:.7;border:0}.mini-post strong{font-size:12px}.mini-post p{line-height:1.5;margin:6px 0;font-size:12px}.handle{color:#8b9ba6;font-size:12px}.mini-actions{color:#8fa3ae;font-size:11px;display:flex;gap:25px}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;flex:none;color:#fff;font-size:11px;font-weight:800}.avatar-xl{width:55px;height:55px}.avatar-xxl{width:92px;height:92px;font-size:22px;border:5px solid #fff}.avatar-sun{background:#f1aa3c}.avatar-plum{background:#8d6b98}.avatar-mint{background:#5eb7a5}.avatar-rose{background:#db7c91}.avatar-gold{background:#c99445}.hero-card-footer{color:#8ca0ab;font-size:11px;padding-top:14px}.feature-strip{background:#e8f5f9;border-top:1px solid #d8edf3;display:grid;grid-template-columns:repeat(3,1fr);padding:42px calc((100% - 1040px)/2);gap:55px}.feature-strip h3{margin:10px 0 6px;font-size:15px}.feature-strip p{margin:0;color:var(--muted);line-height:1.5;font-size:13px}.feature-icon{color:var(--blue);font-size:25px}.auth-view{min-height:calc(100vh - 70px);display:none;place-items:center;padding:50px}.auth-view.active-view{display:grid}.auth-panel{width:min(940px,100%);background:#fff;border:1px solid var(--line);border-radius:18px;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;box-shadow:var(--shadow)}.auth-intro{padding:60px;background:#e8f5f9}.auth-intro h2{font-size:44px;line-height:1;letter-spacing:-2px;margin:32px 0 15px}.auth-intro p:last-child{color:var(--muted);line-height:1.6}.auth-form{padding:60px;display:flex;flex-direction:column;gap:16px;justify-content:center}.auth-form label,.settings-card label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700}.auth-form input,.settings-card input,.settings-card textarea,.comment-box input,.table-search{border:1px solid #cedbe2;border-radius:7px;padding:12px;color:var(--ink);outline:none}.auth-form input:focus,.settings-card input:focus,.settings-card textarea:focus{border-color:var(--blue)}.form-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--blue)}.check{display:flex!important;flex-direction:row!important;align-items:center;color:var(--muted)!important;font-weight:400!important}.check input{accent-color:var(--blue)}.form-switch{text-align:center;color:var(--muted);font-size:12px}.text-button{font-weight:700}.app-view{max-width:1240px;margin:auto;padding:28px}.banner-ad,.post-ad,.skyscraper-ad{border:1px dashed #bed1da;background:#eef5f7;color:#9eb1bb;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 10px 'Space Mono';letter-spacing:1.2px}.banner-ad{height:90px;margin-bottom:25px}.ad-slot small{font:10px Inter;margin-top:7px;letter-spacing:0}.app-grid{display:grid;grid-template-columns:220px minmax(400px,650px) 230px;gap:32px}.sidebar{position:sticky;top:98px;height:max-content}.profile-snippet{padding:3px 5px 22px;border-bottom:1px solid var(--line)}.profile-snippet strong{display:block;margin-top:10px}.profile-snippet p{color:var(--muted);font-size:12px;line-height:1.5}.counts{display:flex;gap:13px;color:var(--muted);font-size:10px}.counts b{color:var(--ink);font-size:12px}.side-nav{display:flex;flex-direction:column;padding:16px 0}.side-nav button{padding:12px 9px;text-align:left;color:#637887;border-radius:8px;font-weight:600}.side-nav button:hover,.side-nav .selected{background:#e5f4f8;color:var(--blue)}.side-nav button span{margin-left:10px}.side-nav i{float:right;background:#f0ae43;color:#fff;border-radius:20px;font-size:10px;padding:2px 6px;font-style:normal}.feed-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:15px}.feed-heading h2{margin:0;font-size:25px}.filter-button{color:var(--blue);font-size:12px}.composer,.post{display:flex;gap:12px;background:#fff;border:1px solid var(--line);padding:17px;border-radius:10px;margin-bottom:12px}.composer textarea{width:100%;border:0;resize:none;min-height:52px;outline:0;font-size:16px}.composer-body{width:100%}.composer-footer{display:flex;justify-content:space-between;border-top:1px solid #edf1f3;padding-top:10px}.composer-tools{display:flex;gap:15px;color:var(--blue);font-size:19px}.post-content{min-width:0;flex:1}.post-meta{font-size:13px}.post-meta .more{margin-left:auto;color:#97a7b0;font-size:11px}.post-text{font-size:14px;line-height:1.6;margin:11px 0 13px}.hashtag{color:var(--blue)}.verified{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;font-size:9px;background:var(--blue);color:#fff}.badge{font-size:9px;border-radius:4px;padding:3px 5px;font-weight:700}.founder{background:#fff0cf;color:#b77b08}.developer{background:#e2f6ef;color:#27866c}.staff{background:#ece8f8;color:#7259aa}.beta{background:#e5f1fb;color:#3875a2}.post-actions{display:flex;justify-content:space-between;color:#91a2ad}.post-actions button{font-size:12px}.post-actions button:hover,.post-actions .liked,.post-actions .like-action:hover{color:#dc7183}.comment-box{display:none;gap:7px;margin-top:15px}.comment-box.open{display:flex}.comment-box input{flex:1;padding:8px;font-size:11px}.post-ad{height:100px;margin:10px 0}.right-rail{min-width:0}.skyscraper-ad{height:300px;margin-bottom:18px}.rail-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:15px}.rail-card-title{display:flex;justify-content:space-between;font-weight:700;font-size:13px;margin-bottom:10px}.rail-card-title button{color:var(--blue);font-size:11px}.follow-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid #edf1f3}.follow-row strong{display:block;font-size:11px}.follow-row .handle{font-size:10px}.follow-button{margin-left:auto;border:1px solid var(--blue);border-radius:5px;color:var(--blue);font-size:10px;padding:5px 7px}.follow-button.following{background:var(--blue);color:#fff}.rail-links{font-size:10px;color:#91a2ad;line-height:2;margin-top:15px}.profile-page{max-width:760px;margin:auto}.profile-banner{height:190px;border-radius:12px 12px 0 0;background:linear-gradient(115deg,#d4eff5,#8acfe0 55%,#f6d58c);position:relative}.banner-edit{position:absolute;right:15px;top:15px;background:#fff9;padding:8px 11px;border-radius:7px;font-size:11px}.profile-header{background:#fff;border:1px solid var(--line);border-top:0;padding:0 25px 25px;position:relative}.profile-header .avatar-xxl{position:relative;margin-top:-46px;margin-bottom:12px}.profile-header h2{margin:0 0 3px;font-size:22px}.profile-header p{color:var(--muted);line-height:1.5;max-width:550px}.joined{color:#8497a3;font-size:11px}.settings-link{position:absolute;right:20px;top:18px}.profile-stats{display:flex;gap:22px;margin-top:16px;color:var(--muted);font-size:11px}.profile-stats b{color:var(--ink);margin-right:3px}.profile-tabs{display:flex;background:#fff;border:1px solid var(--line);border-top:0}.profile-tabs button{flex:1;padding:15px;color:var(--muted);font-weight:600}.profile-tabs .active{color:var(--blue);border-bottom:2px solid var(--blue)}.profile-post-list .post{border-radius:0;border-top:0}.settings-layout{display:grid;grid-template-columns:190px 1fr;gap:35px;max-width:900px;margin:20px auto}.settings-menu{display:flex;flex-direction:column;gap:3px}.settings-menu h2{margin:0 0 18px;font-size:24px}.settings-menu button{text-align:left;padding:10px;color:var(--muted);border-radius:6px;font-size:12px}.settings-menu .selected{background:#e5f4f8;color:var(--blue);font-weight:700}.settings-menu .danger{color:#d66c70;margin-top:25px}.settings-card,.admin-table-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:27px}.section-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:26px}.section-heading h3{margin:0;font-size:18px}.section-heading p{color:var(--muted);font-size:12px;margin:6px 0}.settings-avatar-row{display:flex;align-items:center;gap:15px;margin-bottom:24px}.settings-avatar-row p{color:var(--muted);font-size:10px}.settings-card>label{margin:16px 0}.settings-card textarea{min-height:85px;resize:vertical}.setting-divider{height:1px;background:var(--line);margin:30px 0 22px}.status-row{background:#f7fafb;padding:14px;border-radius:7px;display:flex;justify-content:space-between;align-items:center}.status-row b,.status-row small{display:block}.status-row small{color:var(--muted);font-size:11px;margin-top:4px}.verified-badge{background:#e2f4fb;color:#1488ba}.admin-heading{display:flex;align-items:start;justify-content:space-between;max-width:1000px;margin:20px auto}.admin-heading h2{margin:0;font-size:29px}.admin-heading p:last-child{color:var(--muted)}.admin-stats{max-width:1000px;margin:25px auto;display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.admin-stats>div{background:#fff;border:1px solid var(--line);border-radius:9px;padding:18px}.admin-stats small,.admin-stats strong,.admin-stats span{display:block}.admin-stats small{font:10px 'Space Mono';color:#8ba0ac}.admin-stats strong{font-size:25px;margin:7px 0}.positive{color:#3aab82;font-size:11px}.warning{color:#d19130;font-size:11px}.admin-table-card{max-width:1000px;margin:0 auto}.table-search{width:165px;padding:9px;font-size:11px}table{width:100%;border-collapse:collapse}th{text-align:left;color:#93a4ae;font:10px 'Space Mono';padding:12px 8px;border-bottom:1px solid var(--line)}td{padding:13px 8px;border-bottom:1px solid #edf1f3;font-size:11px}td .badge{margin-right:4px}.table-user{display:flex;align-items:center;gap:8px}.table-user b,.table-user small{display:block}.table-user small{color:var(--muted);margin-top:3px}.status-dot{width:7px;height:7px;border-radius:50%;background:#58bc80;display:inline-block;margin-right:5px}
@media(max-width:900px){.hero-wrap{grid-template-columns:1fr;gap:45px;padding-top:65px}.hero-card{max-width:470px}.app-grid{grid-template-columns:180px minmax(0,1fr)}.right-rail{display:none}.topnav{margin-left:0}.feature-strip{padding:35px 25px;gap:20px}.admin-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.topbar{height:60px}.topbar-inner{padding:0 16px}.topnav{display:none}.hero-wrap{padding:60px 22px}.hero-copy h1{font-size:55px}.hero-card{transform:none}.feature-strip{grid-template-columns:1fr;padding:30px 25px}.auth-view{padding:20px}.auth-panel{grid-template-columns:1fr}.auth-intro{padding:35px}.auth-form{padding:35px}.app-view{padding:16px}.app-grid{display:block}.sidebar{position:static}.profile-snippet{display:none}.side-nav{flex-direction:row;overflow:auto;gap:4px}.side-nav button{white-space:nowrap}.side-nav button span{margin-left:4px}.sidebar>.wide{margin-bottom:20px}.banner-ad{height:55px}.settings-layout{grid-template-columns:1fr}.settings-menu{display:none}.admin-stats{grid-template-columns:1fr 1fr}.admin-table-card{overflow:auto;padding:15px}.admin-table-card table{min-width:650px}.admin-heading{gap:15px}.profile-banner{height:140px}}

/* Logged-out visitors should only see public navigation. */
.auth-only { display: none; }
.is-authenticated .auth-only { display: inline-flex; }
.is-authenticated [data-view="login"] { display: none; }
.empty-state { padding: 38px 20px; text-align: center; color: var(--muted); background: #fff; border: 1px solid var(--line); }
.empty-state-icon { color: var(--blue); font-size: 27px; margin-bottom: 8px; }
.empty-state strong { color: var(--ink); display: block; }
.empty-state p, .empty-rail-card p { font-size: 12px; line-height: 1.5; }
.empty-hero-card { min-height: 270px; }
.empty-hero-card .empty-state { border: 0; margin-top: 42px; }
.feed-empty-state { margin-top: 12px; }
.empty-rail-card { color: var(--ink); }
.post-actions .action-icon { font-size: 15px; line-height: 1; }
.post-actions button { display: inline-flex; align-items: center; gap: 5px; }
.post-actions .comment-action:hover { color: var(--blue); }
.post-actions .dislike-action:hover { color: #d98d38; }
.post-actions .report-action:hover { color: #d66c70; }
.comments-list { margin-top: 10px; }
.comment { padding: 9px 11px; margin-top: 6px; border-left: 2px solid #dcecf2; background: #f8fbfc; font-size: 11px; }
.comment strong { margin-right: 6px; }
.comment span, .comment p { color: var(--muted); }
.comment p { margin: 4px 0 0; line-height: 1.4; }
.notification-row { display: flex; gap: 12px; padding: 15px 0; border-top: 1px solid var(--line); }
.notification-row p { margin: 6px 0; color: var(--muted); }
.notification-row small { color: var(--muted); font-size: 10px; }
.messages-layout { max-width: 1050px; margin: 20px auto; display: grid; grid-template-columns: 330px 1fr; min-height: 620px; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.inbox-panel { border-right: 1px solid var(--line); padding: 14px 0; }
.messages-title { display: flex; justify-content: space-between; align-items: center; padding: 0 16px 12px; }
.messages-title h2 { margin: 0; font-size: 18px; }
.messages-title button { color: var(--muted); font-size: 17px; margin-left: 8px; }
.message-search { width: calc(100% - 26px); margin: 0 13px 12px; border: 1px solid var(--line); border-radius: 20px; padding: 10px 14px; outline: none; }
.conversation-row { display: flex; gap: 10px; align-items: center; padding: 13px 5px; border-top: 1px solid #edf1f3; cursor: pointer; }
.conversation-row:hover { background: #f5fafb; }
.conversation-row strong, .conversation-row small { display: block; }
.conversation-row small { color: var(--muted); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 190px; }
.thread-panel { display: flex; flex-direction: column; }
.thread-header { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--line); font-weight: 700; }
.thread-header small { display: block; color: var(--muted); font-size: 11px; font-weight: 400; margin-top: 4px; }
.thread-info { margin-left: auto; color: var(--muted); }
.thread-avatar { width: 34px; height: 34px; }
.message-thread { flex: 1; min-height: 430px; max-height: 470px; padding: 20px; overflow-y: auto; scroll-behavior: smooth; }
.message-bubble { max-width: 70%; width: fit-content; padding: 10px 13px; margin: 8px 0; background: #e8f5f9; border-radius: 16px 16px 16px 3px; font-size: 13px; }
.message-bubble.mine { margin-left: auto; background: var(--blue); color: #fff; border-radius: 12px 12px 3px 12px; }
.message-composer { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--line); padding: 10px 14px; }
.message-composer input { border: 1px solid #cedbe2; border-radius: 7px; padding: 10px; min-width: 0; }
.message-composer #messageRecipient { width: 125px; }
.message-composer #messageBody { flex: 1; width: auto; }
.composer-icon, .send-message { color: var(--blue); font-size: 18px; }
.send-message { margin-left: auto; }
.message-status { min-height: 16px; margin: 0 14px; color: #c46b42; font-size: 11px; }
.mobile-nav.auth-only { display: none; }
.people-to-message { display: none; padding: 10px 14px; border-bottom: 1px solid var(--line); background: #f8fbfc; }
.people-to-message.open { display: block; }
.people-to-message strong { font-size: 11px; }
.message-person { display: flex; align-items: center; gap: 8px; padding: 9px 0; cursor: pointer; font-size: 11px; }
@media(max-width:700px){
    .app-view { padding: 10px; }
    .app-grid .sidebar { display: none; }
    .messages-layout { grid-template-columns: 1fr; min-height: calc(100vh - 90px); margin: 0; border-radius: 8px; }
    .inbox-panel { border-right: 0; border-bottom: 1px solid var(--line); max-height: 245px; overflow-y: auto; }
    .messages-title { position: sticky; top: 0; background: #fff; z-index: 1; }
    .message-search { position: sticky; top: 44px; z-index: 1; background: #fff; }
    .thread-panel { min-height: 500px; }
    .message-thread { height: calc(100vh - 365px); min-height: 260px; max-height: none; flex: none; padding: 14px; }
    .message-bubble { max-width: 86%; font-size: 13px; }
    .message-composer { flex-wrap: wrap; padding: 10px; position: sticky; bottom: 0; background: #fff; }
    .message-composer #messageRecipient { width: calc(100% - 35px); }
    .message-composer #messageBody { width: calc(100% - 35px); order: 3; }
    .message-composer .composer-icon { width: 25px; }
    .message-composer .send-message { order: 4; }
    .mobile-nav.auth-only { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; height: 62px; background: #fff; border-top: 1px solid var(--line); justify-content: space-around; align-items: center; box-shadow: 0 -5px 20px rgba(28,66,89,.08); }
    .mobile-nav button { display: flex; flex-direction: column; align-items: center; gap: 3px; color: var(--muted); font-size: 19px; }
    .mobile-nav button span { font-size: 9px; }
    body { padding-bottom: 62px; }
}
.no-comments { color: var(--muted); font-size: 11px; margin: 10px 0; }
.users-heading { max-width: 800px; margin: 22px auto; }
.users-heading h2 { margin: 0 0 8px; font-size: 30px; }
.users-heading p:last-child { color: var(--muted); }
.users-grid { max-width: 800px; margin: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.user-card { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 20px; }
.user-card h3 { margin: 12px 0 2px; font-size: 16px; }
.user-card p { color: var(--muted); min-height: 35px; font-size: 12px; line-height: 1.5; }
.user-card-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; }
.profile-link { color: inherit; padding: 0; font-weight: inherit; }
.profile-link:hover { color: var(--blue); text-decoration: underline; }
.public-profile-card { background: #fff; border: 1px solid var(--line); }
.public-profile-actions { position: absolute; right: 20px; top: 18px; display: flex; gap: 8px; }
.public-profile-actions + h2 { padding-right: 190px; }
.profile-website { display: block; color: var(--blue); font-size: 12px; margin: 10px 0; }
.profile-image-frame { overflow: hidden; }
.profile-image-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.profile-banner { background-size: cover; background-position: center; }
.upload-label input[type="file"] { display: none; }
@media(max-width:650px){.users-grid{grid-template-columns:1fr}}