*{box-sizing:border-box} :root{--navy:#082443;--navy2:#10385b;--teal:#11bdb8;--teal2:#65e4d8;--gold:#e4b85f;--paper:#f3f6f7;--ink:#172b40;--muted:#718094;--line:#e5ebef;--white:#fff;--shadow:0 15px 45px #08244312}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 "DM Sans",system-ui,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}.boot{min-height:100vh;display:grid;place-items:center;color:var(--navy);font-weight:800}.btn{border:0;border-radius:999px;padding:11px 17px;font-weight:800;font-size:12px;transition:.2s}.btn:hover{transform:translateY(-1px)}.primary{background:linear-gradient(110deg,var(--teal),var(--teal2));color:#052743;box-shadow:0 8px 24px #11bdb833}.dark{background:var(--navy);color:white}.outline{background:white;border:1px solid var(--line);color:var(--navy)}.field{width:100%;border:1px solid #dce5ea;background:white;border-radius:12px;padding:12px 14px;outline:none;color:var(--ink)}.field:focus{border-color:var(--teal);box-shadow:0 0 0 3px #11bdb81c}textarea.field{min-height:100px;resize:vertical}.card{background:white;border:1px solid var(--line);border-radius:18px;box-shadow:0 4px 20px #08244308}.muted{color:var(--muted)}.small{font-size:11px}.pill{font-size:10px;font-weight:800;background:#e8f8f7;color:#087e80;border-radius:99px;padding:5px 9px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#078f91}.auth{min-height:100vh;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 15% 20%,#11bdb82b,transparent 28%),linear-gradient(130deg,#061a32,#0b3c5c 72%,#07505a)}.authbox{width:min(460px,100%);padding:32px;background:white;border-radius:24px;box-shadow:0 30px 90px #00152c66}.logo{width:190px;display:block;margin:0 auto 22px}.authbox h1{text-align:center;color:var(--navy);font-size:25px;margin:0}.authbox>p{text-align:center;color:var(--muted);font-size:12px;margin:6px 0 24px}.form{display:grid;gap:13px}.form label{font-size:11px;font-weight:800;color:#536579}.form .btn{width:100%;margin-top:5px}.authfoot{text-align:center;font-size:12px;color:var(--muted);margin-top:20px}.link{border:0;background:none;color:#078f91;font-weight:800}.landing{min-height:100vh;color:white;background:radial-gradient(ellipse at 80% 30%,#0c5c6850,transparent 34%),linear-gradient(120deg,#061a32,#0a3151 70%,#07505a);overflow:hidden}.landnav{max-width:1200px;margin:auto;padding:20px 25px;display:flex;align-items:center;justify-content:space-between}.landnav img{width:160px;filter:brightness(0) invert(1)}.landhero{max-width:1200px;margin:auto;padding:65px 25px 90px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:45px}.landhero h1{font-size:clamp(45px,6vw,75px);letter-spacing:-3px;line-height:1.02;margin:18px 0}.landhero h1 span{background:linear-gradient(90deg,#fff,#8ef0e4 65%,#f1c96e);color:transparent;background-clip:text}.landhero p{color:#c4d4e1;max-width:550px;font-size:16px;line-height:1.8}.landhero .actions{display:flex;gap:12px;margin-top:25px;flex-wrap:wrap}.landvisual{display:grid;place-items:center;min-height:350px}.orbit{width:min(340px,75vw);aspect-ratio:1;border:1px solid #63e4d533;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 80px #11bdb81c,inset 0 0 70px #11bdb80d}.orbit img{width:185px;border-radius:42px;box-shadow:0 0 55px #11bdb844}.landbottom{text-align:center;padding:18px;color:#d5e2eb;background:#ffffff0c;font-size:12px}.shell{display:grid;grid-template-columns:235px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--navy);color:#d5e1e9;padding:22px 15px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.sidebrand{padding:0 10px 22px;border-bottom:1px solid #ffffff1b}.sidebrand img{width:145px;filter:brightness(0) invert(1)}.navgroup{font-size:9px;letter-spacing:1.8px;text-transform:uppercase;color:#829bad;font-weight:800;padding:21px 10px 8px}.nav{display:grid;gap:4px}.nav button{border:0;background:none;color:#b9cbd8;text-align:left;padding:11px 12px;border-radius:11px;font-size:12px;font-weight:700;display:flex;align-items:center;gap:12px}.nav button:hover,.nav button.active{background:#11bdb825;color:white;box-shadow:inset 3px 0 var(--teal)}.nav .ico{font-size:17px;width:20px;text-align:center}.sideuser{margin-top:auto;border-top:1px solid #ffffff20;padding:15px 6px 0;display:flex;align-items:center;gap:9px}.avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--teal),var(--navy2));color:white;font-weight:900;flex:none;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.sideuser b{display:block;color:white;font-size:11px}.sideuser small{color:#9db1c0;font-size:10px}.main{min-width:0}.top{height:72px;background:#ffffffed;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,3vw,38px);position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.top h2{margin:0;font-size:18px;color:var(--navy)}.topright{display:flex;gap:10px;align-items:center}.topright input{width:min(290px,28vw);border:1px solid var(--line);border-radius:99px;padding:10px 14px;font-size:11px}.content{max-width:1200px;margin:auto;padding:27px clamp(15px,3vw,38px) 115px}.welcome{padding:26px 28px;border-radius:20px;background:radial-gradient(circle at 90% 15%,#11bdb844,transparent 30%),linear-gradient(115deg,#082443,#0c5264);color:white;margin-bottom:20px}.welcome h2{margin:0 0 4px;font-size:24px}.welcome p{margin:0;color:#c6d8e4;font-size:12px}.welcome .btn{margin-top:15px}.cols{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}.feed{display:grid;gap:13px}.compose,.post,.sidecard{padding:17px}.compose-row,.posthead{display:flex;align-items:center;gap:10px}.compose-trigger{border:1px solid var(--line);background:#f7f9fa;color:#8794a1;text-align:left;border-radius:99px;padding:11px 15px;flex:1;font-size:11px}.posthead .meta{flex:1}.posthead strong{font-size:12px;color:var(--navy);display:block}.posthead small{font-size:10px;color:#8a98a6}.postbody{font-size:13px;color:#435568;margin:15px 0;white-space:pre-wrap;overflow-wrap:anywhere}.postimg{width:100%;max-height:350px;object-fit:cover;border-radius:13px;margin-bottom:10px}.postfoot{display:flex;gap:12px;border-top:1px solid var(--line);padding-top:11px;flex-wrap:wrap}.postfoot button{border:0;background:none;color:#6d7d8c;font-size:11px;font-weight:800;padding:5px 8px;border-radius:8px}.postfoot button:hover,.postfoot button.on{background:#e8f8f7;color:#078e91}.commentarea{border-top:1px solid var(--line);margin-top:12px;padding-top:10px}.comment{font-size:11px;color:#5c6b7c;margin:7px 0}.comment b{color:var(--navy)}.commentform{display:flex;gap:7px;margin-top:9px}.commentform input{flex:1;min-width:0;border:1px solid var(--line);border-radius:99px;padding:9px 12px;font-size:11px}.commentform button{border:0;background:var(--navy);color:white;border-radius:99px;padding:0 13px}.sidecard{margin-bottom:13px}.sidecard h3{font-size:13px;color:var(--navy);margin:0 0 12px}.person{display:flex;gap:8px;align-items:center;margin:11px 0}.person .details{flex:1;min-width:0}.person b{display:block;font-size:11px;color:var(--navy)}.person small{font-size:10px;color:var(--muted)}.person button{border:0;border-radius:99px;background:#e9f8f7;color:#087f81;font-size:10px;font-weight:800;padding:6px 9px}.pagehead{display:flex;justify-content:space-between;align-items:flex-end;gap:15px;margin-bottom:19px}.pagehead h2{font-size:24px;color:var(--navy);margin:3px 0}.pagehead p{font-size:11px;color:var(--muted);margin:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.community{padding:17px}.cover{height:78px;border-radius:12px;background:linear-gradient(120deg,#082443,#0a7778);margin-bottom:13px;position:relative;overflow:hidden}.community:nth-child(3n+2) .cover{background:linear-gradient(120deg,#12304e,#9b7540)}.community h3{font-size:14px;color:var(--navy);margin:0 0 5px}.community p{font-size:11px;color:var(--muted);min-height:48px}.community .btn{width:100%;margin-top:9px}.list{display:grid;gap:10px}.result{padding:14px;display:flex;gap:12px;align-items:center}.result .details{flex:1}.result b{font-size:12px;color:var(--navy)}.result p{font-size:10px;color:var(--muted);margin:2px 0}.result .btn{padding:8px 12px}.exploregrid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.tile{min-height:175px;border-radius:17px;padding:18px;color:white;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(145deg,#082443,#087d80);position:relative;overflow:hidden}.tile:nth-child(3n+2){background:linear-gradient(145deg,#173454,#927342)}.tile h3{margin:5px 0;font-size:18px}.tile p{font-size:10px;color:#d8e7ed;margin:0}.tile small{font-size:9px;letter-spacing:1.4px;color:#b8f4ed}.settings{padding:20px}.setting{padding:14px 0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px}.setting b{display:block;font-size:11px;color:var(--navy)}.setting small{display:block;font-size:10px;color:var(--muted)}.setting input,.setting select{accent-color:var(--teal)}.chatbox{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:450px;overflow:hidden}.chatlist{padding:15px;border-right:1px solid var(--line)}.chatlist button{width:100%;border:0;background:none;text-align:left;padding:10px;border-radius:10px;font-size:11px;color:var(--navy)}.chatlist button.active,.chatlist button:hover{background:#eaf7f6}.chatpane{display:flex;flex-direction:column;min-width:0}.chatmsgs{flex:1;min-height:320px;padding:18px;display:flex;flex-direction:column;gap:9px;background:#f9fbfb}.bubble{max-width:75%;padding:10px 13px;border-radius:14px;background:white;border:1px solid var(--line);font-size:11px;align-self:flex-start}.bubble.mine{background:#e1f8f5;border-color:#c5efea;align-self:flex-end}.chatform{display:flex;gap:8px;padding:12px}.chatform input{flex:1;min-width:0;border:1px solid var(--line);border-radius:99px;padding:10px 13px;font-size:11px}.chatform button{border:0;border-radius:50%;width:38px;background:var(--navy);color:white}.notice{padding:14px;border-bottom:1px solid var(--line);font-size:11px}.notice.unread{background:#f0fbfa}.notice b{color:var(--navy)}.notice p{margin:3px 0;color:var(--muted)}.profilehero{padding:22px;border-radius:18px;background:linear-gradient(110deg,#082443,#0b6570);color:white;display:flex;gap:15px;align-items:center;margin-bottom:15px}.profilehero .avatar{width:65px;height:65px;border:2px solid white}.profilehero h2{margin:0}.profilehero p{margin:4px 0;color:#c7dbe4;font-size:11px}.profilehero button{margin-left:auto}.bottom{position:fixed;z-index:30;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,1180px);min-height:70px;padding:7px 15px calc(7px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-around;gap:4px;background:rgba(34,37,40,.98);border:1px solid #ffffff16;border-bottom:0;border-radius:17px 17px 0 0;box-shadow:0 -10px 35px #071f3d20;backdrop-filter:blur(18px)}.bottom button{position:relative;min-width:55px;flex:1;max-width:130px;height:54px;border:0;background:transparent;color:#e8edf1;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom button.active{color:white;background:#ffffff0c}.bottom button.active:after{content:"";position:absolute;bottom:0;width:23px;height:3px;border-radius:9px;background:var(--teal);box-shadow:0 0 12px var(--teal)}.bottom .ico{font-size:25px;line-height:1}.bottom small{font-size:9px;color:#b6c2cb}.bottom button.active small{color:white}.badge{position:absolute;top:4px;right:calc(50% - 21px);background:#e94d5c;color:white;border-radius:20px;font-size:9px;padding:1px 5px}.modalbg{position:fixed;inset:0;background:#06172ccc;z-index:60;display:grid;place-items:center;padding:15px}.modal{width:min(560px,100%);max-height:90vh;overflow:auto;background:white;border-radius:20px;padding:22px}.modalhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.modalhead h3{margin:0;color:var(--navy)}.modalform{display:grid;gap:12px}.modalform label{font-size:11px;font-weight:800;color:#536579}.modalform .btn{justify-self:end}.toast{position:fixed;bottom:82px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:90;background:#082443;color:white;border-radius:12px;padding:11px 16px;box-shadow:0 10px 30px #00152b44;font-size:11px;transition:.25s;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.empty{text-align:center;padding:35px;color:var(--muted);font-size:12px}
@media(max-width:1000px){.shell{grid-template-columns:190px minmax(0,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.cols{grid-template-columns:1fr}.rightcol{display:grid;grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.shell{display:block;padding-bottom:70px}.sidebar{display:none}.top{height:60px;padding:0 13px}.top h2{font-size:15px}.topright input{width:42vw;padding:9px;font-size:10px}.content{padding:16px 12px 95px}.welcome{padding:20px}.welcome h2{font-size:20px}.pagehead{align-items:flex-start;flex-direction:column}.pagehead h2{font-size:21px}.grid{grid-template-columns:1fr}.exploregrid{grid-template-columns:repeat(2,1fr);gap:8px}.tile{min-height:150px;padding:13px}.tile h3{font-size:15px}.rightcol{grid-template-columns:1fr}.chatbox{grid-template-columns:1fr}.chatlist{display:flex;overflow:auto;border:0;border-bottom:1px solid var(--line);max-height:95px}.chatlist button{min-width:130px}.chatmsgs{min-height:250px}.bottom{width:100%;min-height:62px;padding:4px 2px calc(4px + env(safe-area-inset-bottom));gap:0;border-radius:14px 14px 0 0}.bottom button{min-width:0;height:49px;gap:0}.bottom .ico{font-size:23px}.bottom small{display:none}.profilehero{padding:15px;flex-wrap:wrap}.profilehero .avatar{width:52px;height:52px}.profilehero h2{font-size:17px}.profilehero button{margin-left:0}.authbox{padding:25px 19px}.landnav{padding:17px}.landnav img{width:135px}.landhero{grid-template-columns:1fr;padding:28px 20px 55px;gap:0}.landvisual{grid-row:1;min-height:230px}.orbit{width:220px}.orbit img{width:135px}.landhero h1{font-size:44px;letter-spacing:-2px}.landhero p{font-size:13px}}
@media(max-width:360px){.bottom .ico{font-size:20px}.exploregrid{grid-template-columns:1fr}}

/* Dark theme: saved on this device and applied to the signed-in workspace. */
body[data-theme="dark"]{--paper:#0c1724;--ink:#e7edf4;--muted:#9aabba;--line:#263747;--white:#142334;--shadow:0 15px 45px #0005;background:var(--paper);color:var(--ink)}
body[data-theme="dark"] .top{background:#111f2eef;border-color:var(--line)}
body[data-theme="dark"] .top h2,body[data-theme="dark"] .posthead strong,body[data-theme="dark"] .sidecard h3,body[data-theme="dark"] .community h3,body[data-theme="dark"] .result b,body[data-theme="dark"] .person b,body[data-theme="dark"] .setting b,body[data-theme="dark"] .notice b,body[data-theme="dark"] .comment b{color:#f2f6fa}
body[data-theme="dark"] .card,body[data-theme="dark"] .modal{background:#142334;border-color:var(--line);color:var(--ink);box-shadow:0 4px 20px #0002}
body[data-theme="dark"] .field,body[data-theme="dark"] .topright input,body[data-theme="dark"] .commentform input,body[data-theme="dark"] .chatform input{background:#0d1b29;border-color:#314456;color:#eef4f8}
body[data-theme="dark"] .field::placeholder,body[data-theme="dark"] input::placeholder{color:#8395a6}
body[data-theme="dark"] .compose-trigger{background:#0d1b29;border-color:#314456;color:#a9b7c5}
body[data-theme="dark"] .postbody,body[data-theme="dark"] .result p,body[data-theme="dark"] .comment,body[data-theme="dark"] .pagehead p{color:#bdc9d4}
body[data-theme="dark"] .chatmsgs{background:#0d1b29}body[data-theme="dark"] .bubble{background:#182b3e;border-color:#314456;color:#eaf0f5}body[data-theme="dark"] .bubble.mine{background:#124443;border-color:#1a6965}
body[data-theme="dark"] .notice.unread{background:#173a3b}body[data-theme="dark"] .pill{background:#164344;color:#8ce5dc}body[data-theme="dark"] .person button{background:#164344;color:#8ce5dc}
body[data-theme="dark"] .postfoot button{color:#b7c5d1}body[data-theme="dark"] .postfoot button:hover,body[data-theme="dark"] .postfoot button.on{background:#164344;color:#8ce5dc}
body[data-theme="dark"] .outline{background:#17283a;border-color:#35485a;color:#eaf1f7}body[data-theme="dark"] .empty{color:#a6b4c1}
body[data-theme="dark"] .authbox{background:#142334}body[data-theme="dark"] .authbox h1{color:#f2f6fa}body[data-theme="dark"] .form label{color:#c4d0dc}body[data-theme="dark"] .setting{border-color:var(--line)}
.theme-toggle{min-width:40px;padding:10px 12px;font-size:16px}
@media(max-width:720px){.topright{gap:6px}.topright input{width:min(38vw,190px)}.topright .btn{padding:9px 11px}}

/* Gensped profile cover photo */
.profilehero-cover{min-height:230px;background-size:cover;background-position:center;border-radius:18px;overflow:hidden;display:flex;align-items:flex-end;padding:0!important;background-color:#0b3c5c}
.profilehero-inner{width:100%;display:flex;align-items:center;gap:15px;padding:22px;background:linear-gradient(0deg,#061a32aa,transparent)}
.profilehero-inner .avatar{width:72px;height:72px;border:2px solid #fff}
.profilehero-inner h2,.profilehero-inner p,.profilehero-inner small{color:#fff}
.profilehero-inner button{margin-left:auto}
@media(max-width:650px){.profilehero-cover{min-height:200px}.profilehero-inner{padding:15px;flex-wrap:wrap}.profilehero-inner .avatar{width:56px;height:56px}.profilehero-inner button{margin-left:0}}

/* Gensped feed, verification and Explore media */
.verified{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:5px;border-radius:50%;background:#1688ed;color:#fff;font-size:11px;font-weight:900;vertical-align:middle}
.explore-tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 16px;scrollbar-width:thin}.explore-tabs button{flex:0 0 auto;border:1px solid var(--line,#ddd);background:var(--card,#fff);color:inherit;border-radius:999px;padding:8px 14px;cursor:pointer}.explore-tabs button.active{background:#0b6fd3;color:#fff;border-color:#0b6fd3}
.explore-media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.explore-media{position:relative;display:block;overflow:hidden;aspect-ratio:3/4;border:0;padding:0;background:#111;cursor:pointer}.explore-media img,.explore-media video{width:100%;height:100%;object-fit:cover;display:block}.playmark{position:absolute;top:10px;right:10px;color:#fff;text-shadow:0 1px 5px #000;font-size:18px}.media-caption{position:absolute;left:8px;right:8px;bottom:8px;color:#fff;font-size:12px;text-align:left;text-shadow:0 1px 4px #000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reel-overlay{position:fixed;inset:0;z-index:1000;background:#05070b;display:flex;align-items:center;justify-content:center;color:white}.reel-card{height:min(92vh,900px);width:min(100vw,520px);position:relative;background:#111;display:flex;align-items:center;justify-content:center}.reel-card video,.reel-card img{width:100%;height:100%;object-fit:contain}.reel-info{position:absolute;left:16px;right:16px;bottom:18px;padding:50px 10px 12px;background:linear-gradient(transparent,#000b);text-shadow:0 1px 3px #000}.reel-info p{margin:6px 0}.reel-close,.reel-prev,.reel-next{position:absolute;z-index:2;border:0;border-radius:50%;width:42px;height:42px;background:#ffffff22;color:white;font-size:20px;cursor:pointer}.reel-close{top:18px;right:18px}.reel-prev{top:45%;left:max(12px,calc(50% - 300px))}.reel-next{top:55%;right:max(12px,calc(50% - 300px))}.reel-prev:disabled,.reel-next:disabled{opacity:.25;cursor:not-allowed}
@media(max-width:640px){.explore-media-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}.reel-card{height:100dvh;width:100vw}.reel-prev,.reel-next{width:36px;height:36px;background:#0008}}

/* Visual fixes and profile/media interactions */
.sidebrand img{filter:none!important;width:82px;max-height:82px;object-fit:contain;border-radius:16px;background:transparent}
.sidebrand{display:flex;align-items:center;min-height:92px}
.explore-tabs button{background:var(--white)!important;color:var(--ink)!important;border-color:var(--line)!important}
.explore-tabs button.active{background:#0b6fd3!important;color:#fff!important;border-color:#0b6fd3!important}
body[data-theme="dark"] .explore-tabs button{background:#142334!important;color:#e7edf4!important;border-color:#314456!important}
body[data-theme="dark"] .explore-tabs button.active{background:#0b6fd3!important;color:#fff!important}
.profile-link{border:0;padding:0;cursor:pointer}
.profile-name{border:0;background:transparent;color:inherit;padding:0;font:inherit;font-weight:800;cursor:pointer;text-align:left}
.profile-name:hover{text-decoration:underline;color:var(--teal)}
.post-media-open{display:block;width:100%;border:0;padding:0;background:transparent;cursor:zoom-in;text-align:left}
.post-media-open .postimg{display:block}
.follow-update{padding:10px 0;border-bottom:1px solid var(--line)}
.follow-update p{font-size:11px;color:var(--ink);margin:5px 0}
.follow-update img{width:100%;max-height:130px;object-fit:cover;border-radius:10px;margin:5px 0}
.follow-update small{display:block;color:var(--muted);font-size:10px}
body[data-theme="dark"] .follow-update p{color:#bdc9d4}


/* Gensped media sizing: preserve original aspect ratio and show the whole upload. */
.post-media-frame{width:100%;max-width:100%;margin:12px 0;display:flex;justify-content:center;align-items:center;overflow:hidden;border-radius:14px;background:var(--media-bg,#101923)}
.post-media-frame .post-media-open{display:block;width:100%;max-width:100%;border:0;padding:0;background:transparent;cursor:zoom-in}
.post-media-frame .postimg{display:block;width:100%;height:auto;max-height: min(78vh,760px);object-fit:contain;object-position:center;margin:0;border-radius:0;background:transparent}
.post-media-frame.video-frame .postimg{max-height:min(78vh,760px);aspect-ratio:auto}
.post-media-frame.image-frame .postimg{max-height:min(78vh,760px)}
.profile-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#helpform{max-width:760px}
#helpform .field{width:100%}
[data-theme="dark"] .post-media-frame{background:#080e16}
[data-theme="dark"] .post-media-open{background:#080e16}
[data-theme="dark"] .help-card,[data-theme="dark"] #helpform{color:var(--text)}
@media(max-width:650px){.post-media-frame .postimg{max-height:72vh}.profile-actions{width:100%}}

/* Social-feed media sizing: compact, responsive, and consistent across post cards */
.post-media-frame{width:100%;max-width:100%;height:auto;max-height:500px;margin:12px auto;display:flex;justify-content:center;align-items:center;overflow:hidden;border-radius:14px;background:var(--media-bg,#101923)}
.post-media-frame .post-media-open{width:100%;max-width:100%;max-height:500px;display:flex;justify-content:center;align-items:center;overflow:hidden;border:0;padding:0;background:transparent;cursor:zoom-in}
.post-media-frame .postimg{display:block;width:auto;height:auto;max-width:100%;max-height:500px;object-fit:contain;object-position:center;margin:0;border-radius:0}
.post-media-frame.video-frame video.postimg{width:100%;height:auto;max-height:500px;object-fit:contain}
.post-media-frame.image-frame img.postimg{width:auto;height:auto;max-width:100%;max-height:500px;object-fit:contain}
.profilehero.profilehero-cover{min-height:300px;height:auto;max-height:none;background-size:cover;background-position:center;position:relative;padding:150px 24px 22px}
.profilehero-inner{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap}
.profilehero-inner .avatar{width:112px;height:112px;flex:0 0 112px;border:4px solid var(--card,#fff);font-size:30px}
.profilehero-inner>div{min-width:180px;flex:1}
.profile-details{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:10px;font-size:13px}
.profile-details span{display:inline-flex;gap:5px;align-items:center}
.profile-details a{color:var(--accent,#11b9aa);text-decoration:underline}
@media(max-width:700px){
 .post-media-frame,.post-media-frame .post-media-open{max-height:420px}
 .post-media-frame .postimg,.post-media-frame.video-frame video.postimg,.post-media-frame.image-frame img.postimg{max-height:420px}
 .profilehero.profilehero-cover{min-height:260px;padding:120px 14px 18px}
 .profilehero-inner .avatar{width:88px;height:88px;flex-basis:88px}
}

/* Gensped compact social-media feed: avoid oversized full-width photos */
.post-media-frame{
  width:100%; max-width:680px; height:auto; max-height:380px;
  margin:12px auto; display:flex; justify-content:center; align-items:center;
  overflow:hidden; border-radius:12px; background:var(--media-bg,#101923);
}
.post-media-frame .post-media-open{
  display:flex; justify-content:center; align-items:center;
  width:100%; max-width:680px; max-height:380px; overflow:hidden;
  border:0; padding:0; background:transparent; cursor:zoom-in;
}
.post-media-frame img.postimg{
  display:block; width:auto; height:auto; max-width:100%; max-height:380px;
  object-fit:contain; margin:0; border-radius:0;
}
.post-media-frame video.postimg{
  display:block; width:100%; height:auto; max-width:680px; max-height:380px;
  aspect-ratio:16/9; object-fit:contain; margin:0;
}
.profilehero.profilehero-cover{
  min-height:250px; height:auto; max-height:320px; overflow:hidden;
  background-size:cover; background-position:center;
  padding:150px 24px 18px; border-radius:16px;
}
.profilehero-inner{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.profilehero-inner .avatar{width:104px;height:104px;flex:0 0 104px;border:4px solid var(--card,#fff)}
.profile-details{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:10px;font-size:13px}
.profile-details span{display:inline-flex;gap:5px;align-items:center}
@media(max-width:700px){
 .post-media-frame,.post-media-frame .post-media-open{max-height:300px}
 .post-media-frame img.postimg,.post-media-frame video.postimg{max-height:300px}
 .post-media-frame video.postimg{width:100%}
 .profilehero.profilehero-cover{min-height:220px;max-height:280px;padding:115px 14px 14px}
 .profilehero-inner .avatar{width:84px;height:84px;flex-basis:84px}
}

/* Responsive layout refinement: connection updates in a left rail on desktop */
.cols{display:grid;grid-template-columns:minmax(190px,240px) minmax(0,1fr) 230px;gap:16px;align-items:start}
.leftcol,.rightcol{display:grid;gap:13px;min-width:0}
.leftcol .sidecard,.rightcol .sidecard{padding:14px;min-width:0}
.leftcol .follow-update{padding:9px 0;border-bottom:1px solid var(--line)}
.leftcol .follow-update:last-child{border-bottom:0}
.leftcol .follow-update img{display:block;width:100%;max-width:150px;max-height:110px;object-fit:cover;border-radius:9px;margin:7px 0}
.feed{min-width:0}
.post{min-width:0}
.post-media-frame{width:100%;max-width:520px;max-height:340px;margin:12px auto;overflow:hidden;border-radius:12px}
.post-media-frame .post-media-open{width:100%;max-width:520px;max-height:340px;display:flex;justify-content:center;align-items:center;overflow:hidden}
.post-media-frame img.postimg{width:auto;height:auto;max-width:100%;max-height:340px;object-fit:contain}
.post-media-frame video.postimg{width:100%;max-width:520px;max-height:340px;aspect-ratio:16/9;object-fit:contain}
.postimg{max-width:100%}
@media(max-width:1100px){
 .cols{grid-template-columns:minmax(170px,210px) minmax(0,1fr)}
 .rightcol{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 html,body{width:100%;min-width:0;overflow-x:hidden}
 .shell{display:block;width:100%;min-width:0}
 .main{width:100%;min-width:0}
 .top{height:auto;min-height:58px;padding:10px 12px;gap:8px}
 .top h2{font-size:15px}
 .topright{min-width:0;gap:5px}
 .topright input{width:min(38vw,150px);min-width:80px;padding:8px 10px}
 .topright .btn{padding:8px 10px;font-size:10px}
 .content{width:100%;max-width:100%;padding:14px 10px 95px}
 .welcome{padding:17px;margin-bottom:12px}
 .welcome h2{font-size:20px}
 .cols{display:flex;flex-direction:column;gap:12px;width:100%}
 .leftcol{order:0;width:100%;display:block}
 .leftcol .sidecard{padding:12px}
 .feed{order:1;width:100%;display:grid;gap:10px}
 .rightcol{order:2;width:100%;display:grid;grid-template-columns:1fr}
 .compose,.post{padding:12px;border-radius:14px}
 .postbody{font-size:14px;margin:10px 0}
 .post-media-frame,.post-media-frame .post-media-open{max-width:100%;max-height:300px}
 .post-media-frame img.postimg{max-width:100%;max-height:300px}
 .post-media-frame video.postimg{width:100%;max-width:100%;max-height:300px}
 .bottom{position:fixed;left:0;right:0;bottom:0;width:100%;z-index:30;padding-bottom:env(safe-area-inset-bottom)}
 .bottom button{min-width:0;flex:1}
 .bottom small{font-size:9px}
}
@media(max-width:420px){
 .top h2{font-size:13px}
 .topright input{width:92px}
 .topright #signout{display:none}
 .post-media-frame,.post-media-frame .post-media-open{max-height:260px}
 .post-media-frame img.postimg,.post-media-frame video.postimg{max-height:260px}
 .posthead{gap:7px}
 .posthead small{font-size:9px}
 .postfoot{gap:4px}
 .postfoot button{font-size:10px;padding:5px}
}

/* Facebook-inspired profile: personal details at left, cover and posts at right */
.profile-layout{display:grid;grid-template-columns:minmax(220px,290px) minmax(0,1fr);gap:18px;align-items:start}
.profile-info-card{padding:20px;position:sticky;top:82px;min-width:0}
.profile-info-card>.avatar{width:104px;height:104px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 12px}
.profile-info-card h2{text-align:center;margin:6px 0 8px;font-size:21px}
.profile-info-card>p,.profile-info-card>small{display:block;text-align:center}
.profile-info-card .profile-details{display:grid;gap:12px;margin:18px 0}
.profile-detail-row{display:flex;gap:10px;align-items:flex-start;line-height:1.35}
.profile-detail-row>b{width:22px;flex:0 0 22px}
.profile-detail-row span{display:grid;gap:2px;min-width:0;overflow-wrap:anywhere}
.profile-detail-row small{opacity:.7}
.profile-info-card #edit-profile{width:100%}
.profile-main{display:grid;gap:14px;min-width:0}
.profile-cover-strip{height:220px;border-radius:16px;background:linear-gradient(115deg,#092c50,#0c8e9b 55%,#20c8b9);background-size:cover;background-position:center}
.profile-main .compose,.profile-main .settings{min-width:0}
.profile-main .post-media-frame{max-width:620px;max-height:420px}
.profile-main .post-media-frame img.postimg{max-height:420px;max-width:100%;width:auto}
.profile-main .post-media-frame video.postimg{max-height:420px;width:100%}
.postfoot{display:flex;justify-content:space-around;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:9px;margin-top:10px}
.postfoot button{flex:1;min-width:90px;text-align:center;padding:9px 6px;border-radius:8px}
.postfoot button:hover{background:var(--hover,rgba(128,128,128,.12))}
@media(max-width:760px){
 .profile-layout{grid-template-columns:1fr;gap:12px}
 .profile-info-card{position:static;order:0}
 .profile-main{order:1}
 .profile-cover-strip{height:150px}
 .profile-info-card>.avatar{width:84px;height:84px}
 .profile-main .post-media-frame{max-height:300px}
 .profile-main .post-media-frame img.postimg,.profile-main .post-media-frame video.postimg{max-height:300px}
}

/* Gensped visual polish: luminous accents, cleaner hierarchy, and accessible focus states. */
:root{--teal:#20d6ca;--teal2:#8bf4e7;--gold:#f0c76e}
:focus-visible{outline:3px solid #20d6ca!important;outline-offset:3px}
.btn.primary{background:linear-gradient(115deg,#16cbbf,#8bf4e7 55%,#f0c76e);box-shadow:0 8px 26px #13cfc34a,0 0 0 1px #ffffff26 inset}
.btn.primary:hover{box-shadow:0 12px 34px #13cfc36b,0 0 22px #20d6ca55;transform:translateY(-2px)}
.card{transition:border-color .2s ease,box-shadow .2s ease}
.card:hover{border-color:#20d6ca55}
.sidebar{background:radial-gradient(ellipse at 15% 0%,#0d6170 0%,transparent 38%),linear-gradient(180deg,#071d35,#082b48 70%,#063b49)}
.sidebrand img{width:76px;height:76px;object-fit:contain;border-radius:17px;box-shadow:0 0 28px #20d6ca25}
.top{box-shadow:0 5px 24px #08244308}
.welcome{box-shadow:0 15px 45px #08244322,0 0 35px #20d6ca18}
.compose-trigger:focus{border-color:#20d6ca;box-shadow:0 0 0 3px #20d6ca22}
.post{overflow:hidden}
.post-media-frame{box-shadow:0 8px 28px #00000012}
.verified{box-shadow:0 0 12px #1688ed55}
body[data-theme="dark"] .top{background:#101e2ef2}
body[data-theme="dark"] .card{box-shadow:0 8px 28px #0003}
body[data-theme="dark"] .card:hover{border-color:#20d6ca66;box-shadow:0 10px 34px #0005,0 0 18px #20d6ca12}
body[data-theme="dark"] .sidebrand img{box-shadow:0 0 28px #20d6ca35}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Gensped owner/admin dashboard */
.admin-wrap{max-width:1120px;margin:0 auto}.admin-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 18px}
.admin-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
.admin-stats .card{padding:20px;display:flex;flex-direction:column;gap:8px}.admin-stats small{color:var(--muted)}.admin-stats strong{font-size:30px;color:var(--teal,#20d6ca)}
.admin-intro,.admin-list{padding:20px}.admin-list h3{margin-top:0}
.admin-record{padding:16px 0;border-top:1px solid var(--line,#ddd)}.admin-record-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.admin-record-head small,.admin-record small{display:block;color:var(--muted);margin-top:5px;overflow-wrap:anywhere}
.admin-record p{overflow-wrap:anywhere}.admin-record details{margin:10px 0;color:var(--muted)}.admin-record pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;max-height:220px;overflow:auto;padding:12px;background:var(--surface2,#f4f6f8);border-radius:10px}
.admin-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
@media(max-width:700px){.admin-stats{grid-template-columns:1fr}.admin-actions .btn{flex:1;min-width:100px}.admin-tabs{overflow-x:auto;flex-wrap:nowrap}.admin-tabs .btn{white-space:nowrap}}

.admin-member-search{width:100%;margin:10px 0 16px}.admin-member{padding:14px 0}
.admin-member .admin-actions .btn{font-size:12px}


/* GENSPED DEVICE-FIT RESPONSIVE REFINEMENT */
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{width:100%;max-width:100%;margin:0;overflow-x:clip}
img,video,iframe,canvas,svg{max-width:100%}
button,input,select,textarea{font:inherit;max-width:100%}
button,.btn{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.shell,.main,.content,.cols,.feed,.card,.admin-wrap,.profile-layout,.profile-main{min-width:0;max-width:100%}
.postbody,.admin-record,.admin-record pre,.profile-detail-row,.notice,.comment{overflow-wrap:anywhere;word-break:break-word}
.content{padding-left:clamp(10px,2.6vw,38px);padding-right:clamp(10px,2.6vw,38px)}
.post-media-frame,.post-media-frame .post-media-open{max-width:100%}
.post-media-frame img,.post-media-frame video{max-width:100%;height:auto}
.explore-tabs,.admin-tabs,.chatlist{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.admin-tabs{max-width:100%;padding-bottom:5px}
.admin-tabs .btn{flex:0 0 auto}
.bottom{padding-left:max(5px,env(safe-area-inset-left));padding-right:max(5px,env(safe-area-inset-right));padding-bottom:calc(6px + env(safe-area-inset-bottom));}
.bottom button{min-width:0;max-width:none;flex:1 1 0;padding:4px 1px}
.bottom .ico{line-height:1.1}
.bottom small{font-size:10px;white-space:nowrap}
.field,input,textarea,select{min-width:0}
@media(max-width:760px){
  html,body{min-height:100%;overscroll-behavior-x:none}
  .shell{display:block;width:100%;padding:0 0 calc(72px + env(safe-area-inset-bottom))}
  .sidebar{display:none!important}
  .main{width:100%;max-width:100%;margin:0}
  .top{position:sticky;top:0;z-index:40;display:flex;align-items:center;min-height:58px;height:auto;padding:9px 10px;gap:8px}
  .top h2{font-size:clamp(13px,3.8vw,17px);line-height:1.2;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .topright{display:flex;align-items:center;gap:5px;flex:0 0 auto}
  .topright input{width:clamp(74px,25vw,155px);min-width:0;padding:8px 9px;font-size:12px}
  .topright .btn{padding:8px 9px;min-height:36px;font-size:11px}
  .topright #signout{display:none}
  .content{width:100%;max-width:100%;padding:12px 10px calc(90px + env(safe-area-inset-bottom));margin:0}
  .welcome{border-radius:15px;padding:16px;margin-bottom:12px}
  .welcome h2{font-size:clamp(18px,5vw,23px)}
  .pagehead{gap:8px;margin-bottom:12px}
  .pagehead h2{font-size:clamp(19px,5.5vw,24px)}
  .cols{display:flex!important;flex-direction:column;width:100%;gap:12px}
  .leftcol,.feed,.rightcol{width:100%;max-width:100%;min-width:0}
  .leftcol{order:0}.feed{order:1}.rightcol{order:2;display:grid;grid-template-columns:minmax(0,1fr)}
  .compose,.post,.sidecard,.admin-list,.admin-intro{padding:12px;border-radius:14px}
  .posthead{align-items:flex-start;flex-wrap:wrap}
  .posthead .meta{min-width:0;flex:1}
  .post-media-frame,.post-media-frame .post-media-open{width:100%;max-width:100%;max-height:min(62svh,420px)}
  .post-media-frame img.postimg,.post-media-frame video.postimg{max-width:100%;max-height:min(62svh,420px);object-fit:contain}
  .explore-media-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
  .profile-layout{display:flex;flex-direction:column;width:100%;gap:12px}
  .profile-info-card{position:static;width:100%;order:0}
  .profile-main{width:100%;order:1}
  .profilehero-cover{width:100%;min-height:190px;max-height:260px}
  .profilehero-inner{gap:10px;flex-wrap:wrap}
  .profilehero-inner button{margin-left:0}
  .admin-wrap{width:100%}
  .admin-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .admin-stats .card{padding:12px}
  .admin-stats strong{font-size:24px}
  .admin-record-head{gap:8px}
  .admin-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .admin-actions .btn{width:100%;min-width:0;white-space:normal;padding:9px 6px;font-size:12px}
  .bottom{position:fixed;left:0;right:0;bottom:0;transform:none;width:100%;height:auto;min-height:58px;max-height:calc(68px + env(safe-area-inset-bottom));display:flex;justify-content:space-around;gap:2px;border-radius:14px 14px 0 0;z-index:1000;overflow-x:auto;overflow-y:hidden}
  .bottom button{height:48px;min-width:0;flex:1 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
  .bottom .ico{font-size:20px}
  .bottom small{display:block;font-size:9px;line-height:1}
  .modal{width:min(96vw,560px);max-height:88svh;overflow:auto}
  .modal-backdrop{padding:10px;align-items:flex-end}
  .chatbox{grid-template-columns:minmax(0,1fr)}
  .chatlist{max-width:100%;overflow-x:auto}
  .chatmsgs{min-height:220px;max-height:55svh;overflow:auto}
}
@media(max-width:390px){
  .topright input{width:74px}
  .topright .theme-toggle{padding:7px!important}
  .content{padding-left:8px;padding-right:8px}
  .bottom small{font-size:8px}
  .admin-stats{grid-template-columns:1fr 1fr}
  .admin-actions{grid-template-columns:1fr 1fr}
  .explore-media-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:761px) and (max-width:1100px){
  .shell{grid-template-columns:190px minmax(0,1fr)}
  .cols{grid-template-columns:minmax(0,1fr) 230px}
  .leftcol{display:none}
  .rightcol{grid-column:auto;grid-template-columns:1fr}
}
@media(hover:none) and (pointer:coarse){
  button,.btn,.nav button,.bottom button{min-height:42px}
  input,select,textarea{font-size:16px}
}


/* PROFILE MOBILE REDESIGN: cover first, overlapping avatar, compact details */
@media(max-width:760px){
  .profile-layout{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch;
    gap:12px!important;
    width:100%;
  }
  .profile-layout>.profile-info-card{order:1!important}
  .profile-layout>.profile-main{display:contents!important}
  .profile-layout>.profile-cover-strip{order:0!important}
  .profile-layout>.compose{order:2!important}
  .profile-layout>.settings{order:3!important}
  .profile-layout>.profile-main>.profile-cover-strip{order:0!important}
  .profile-layout>.profile-main>.compose{order:2!important}
  .profile-layout>.profile-main>.settings{order:3!important}
  .profile-cover-strip{
    display:block!important;
    width:100%!important;
    height:clamp(145px,38vw,205px)!important;
    min-height:0!important;
    border-radius:16px 16px 10px 10px!important;
    background-image:linear-gradient(120deg,#08294a,#087d87 58%,#20c8b9)!important;
    background-size:cover!important;
    background-position:center!important;
    margin:0!important;
  }
  .profile-info-card{
    position:relative!important;
    width:100%!important;
    margin-top:-58px!important;
    padding:68px 16px 16px!important;
    border-radius:16px!important;
    text-align:left!important;
    overflow:visible!important;
  }
  .profile-info-card>.avatar{
    position:absolute!important;
    top:-48px!important;
    left:17px!important;
    width:88px!important;
    height:88px!important;
    margin:0!important;
    border:4px solid var(--white,#142334)!important;
    box-shadow:0 4px 18px #0004!important;
  }
  .profile-info-card h2{
    text-align:left!important;
    font-size:clamp(21px,6vw,27px)!important;
    line-height:1.15!important;
    margin:0 0 7px!important;
    overflow-wrap:anywhere;
  }
  .profile-info-card>p{
    text-align:left!important;
    font-size:14px!important;
    line-height:1.45!important;
    margin:6px 0!important;
  }
  .profile-info-card>small{
    text-align:left!important;
    display:block!important;
    color:var(--muted)!important;
    line-height:1.4;
  }
  .profile-info-card .profile-details{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:15px 0!important;
    padding-top:13px;
    border-top:1px solid var(--line);
  }
  .profile-info-card .profile-detail-row{
    display:flex!important;
    min-width:0;
    gap:7px!important;
    align-items:flex-start!important;
    font-size:12px!important;
    line-height:1.35!important;
  }
  .profile-info-card .profile-detail-row>b{flex:0 0 19px!important;width:19px!important}
  .profile-info-card .profile-detail-row span{min-width:0;overflow-wrap:anywhere}
  .profile-info-card .profile-detail-row small{font-size:10px!important;display:block;margin-bottom:2px}
  .profile-info-card #edit-profile{width:auto!important;min-width:150px;padding:12px 22px!important}
  .profile-layout>.compose,.profile-layout>.settings,
  .profile-layout>.profile-main>.compose,.profile-layout>.profile-main>.settings{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  .profile-layout .settings h3{font-size:20px;margin:0 0 14px}
}
@media(max-width:390px){
  .profile-info-card .profile-details{grid-template-columns:1fr!important}
  .profile-cover-strip{height:145px!important}
  .profile-info-card{padding-left:13px!important;padding-right:13px!important}
}

/* Live unread count badges */
.nav button{position:relative}
.count-badge{
 display:inline-flex;align-items:center;justify-content:center;
 min-width:19px;height:19px;padding:0 5px;margin-left:auto;
 border-radius:999px;background:#e5484d;color:#fff;
 font-size:11px;font-weight:800;font-style:normal;line-height:1;
 box-shadow:0 0 0 2px var(--surface,#142334);
}
.bottom button{position:relative}
.bottom .count-badge{
 position:absolute;top:2px;left:calc(50% + 5px);margin:0;
 min-width:17px;height:17px;padding:0 4px;font-size:10px;
}