/* OUR JOURNEY 4.8 | coherent design system for every rendered PHP screen */
:root {
 --oj48-bg:#061327; --oj48-card:#14223b; --oj48-card2:#211d3e;
 --oj48-line:rgba(191,143,218,.32); --oj48-text:#f8f5ff;
 --oj48-muted:#b6bed2; --oj48-pink:#89c9f1; --oj48-blue:#6cb9ff;
 --oj48-gradient:linear-gradient(115deg,#39acdd 0%,#4ca0d6 100%);
 --oj48-radius:21px; --oj48-shadow:0 14px 35px rgba(0,4,22,.23);
}
*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;overflow-x:clip;scroll-behavior:smooth}
body{max-width:100%;overflow-x:clip;color-scheme:dark}
:where(img,video,canvas,svg){max-width:100%}
:where(img,video){height:auto}
:where(main,section,article,aside,form,fieldset,.card,.panel,.container){min-width:0}
:where(h1,h2,h3,h4,p,li,td,th,label){overflow-wrap:break-word}
:where(h1,h2,h3){text-wrap:balance;line-height:1.19;letter-spacing:-.022em}
:where(p,li){line-height:1.55}
:where(input,select,textarea,button){font:inherit}
:where(input,textarea,select){min-width:0;max-width:100%}
:where(button,[type=submit],a){-webkit-tap-highlight-color:transparent}
:where(a,button,input,textarea,select,summary):focus-visible{outline:2px solid var(--oj48-pink);outline-offset:3px}
:where(button,[role=button],summary){cursor:pointer}
:where(.panel,.card,.ojm-feed-post,.oj-profile-post,.oj-member-card){
 border-radius:var(--oj48-radius);
}
:where(.panel,.card){box-shadow:var(--oj48-shadow)}
:where(.panel,.card,.ojm-feed-post,.oj-profile-post){overflow-wrap:anywhere}
:where(.muted,.subtle,.hint,small){color:var(--oj48-muted)}
:where(table){width:100%;border-collapse:collapse}
:where(td,th){vertical-align:top}
:where(.table-wrap,.table-responsive,[class*=table-scroll]){max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
:where(.actions,.button-row,.form-actions){display:flex;flex-wrap:wrap;gap:10px;align-items:center}
:where(.grid,.cards,.card-grid){min-width:0}
:where(.grid>*,.cards>*,.card-grid>*){min-width:0}
:where(.panel,.card) :where(input,textarea,select){border-radius:13px}
:where(.panel,.card) :where(button,[type=submit]){border-radius:13px}
:where(.panel,.card) :where(h2,h3){margin-top:0}
:where(.oj3-global-nav,.oj-v3-mobile-nav){isolation:isolate}
:where(.oj3-global-nav) img[src*="logo"],:where(.ojm-brand) img[src*="logo"]{
 object-fit:contain;background:transparent;border:0;
}
:where(.ojm-newsfeed,.oj-connect,.oj-member-profile){width:min(100%,940px);margin-inline:auto}
.ojm-newsfeed .ojm-feed-post{transition:border-color .2s ease,box-shadow .2s ease}
.ojm-newsfeed .ojm-feed-post:focus-within{border-color:rgba(235,143,220,.7)!important}
.ojm-newsfeed .ojm-feed-post .actions{display:flex;gap:12px;flex-wrap:wrap}
.ojm-newsfeed .ojm-feed-post :where(input,textarea){width:100%}
.ojm-newsfeed .ojm-feed-post :where(.ojm-feed-like,.oj47-heart){box-shadow:none!important}
.ojm-newsfeed .ojm-feed-post :where(.ojm-feed-like){background:transparent!important;border:0!important}
.ojm-newsfeed .ojm-feed-post .oj47-heart{font-size:29px!important}
.ojm-newsfeed .ojm-feed-post :where(details,summary){max-width:100%}
.oj47-compose-launch{box-shadow:0 8px 23px rgba(168,62,199,.2)}
:where(.auth-card,.login-card,.register-card){max-width:680px;margin-inline:auto}
:where(.auth-card,.login-card,.register-card) :where(input,select){max-width:100%}
:where(.auth-card,.login-card,.register-card) img[src*="logo"]{object-fit:contain}
:where(.oj-v3-mobile-nav){padding-bottom:max(7px,env(safe-area-inset-bottom))}
@media(max-width:800px){
 body{font-size:16px}
 :where(main,.container,.content,.page-wrap){max-width:100%}
 :where(.panel,.card){padding-inline:clamp(14px,3.5vw,22px)}
 :where(.grid,.cards,.card-grid){grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
 :where(.oj3-global-nav){max-width:100%}
 :where(.oj3-global-nav) img[src*="logo"]{width:clamp(44px,11vw,62px);height:auto}
 :where(.ojm-newsfeed,.oj-connect,.oj-member-profile){padding-inline:clamp(10px,3vw,18px)}
 :where(.ojm-newsfeed) .ojm-feed-post{padding:clamp(13px,3vw,20px)!important}
 :where(.ojm-newsfeed) .ojm-feed-tools{display:flex;flex-wrap:wrap;gap:8px}
 :where(.ojm-newsfeed) .ojm-feed-tools a{white-space:nowrap}
 :where(.oj-v3-mobile-nav) a{min-width:0;font-size:clamp(11px,2.9vw,15px)}
 :where(.oj-v3-mobile-nav) a span{font-size:clamp(20px,5vw,28px)}
}
@media(max-width:430px){
 :where(.ojm-newsfeed) .ojm-feed-title{gap:9px}
 :where(.ojm-newsfeed) .ojm-feed-title h1{font-size:27px}
 :where(.ojm-newsfeed) .ojm-feed-title>a{font-size:13px;padding:10px 12px!important}
 :where(.panel,.card){border-radius:18px}
 :where(.actions,.button-row,.form-actions)>*{max-width:100%}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}