/* Shared web/native ergonomics. All device integrations are scoped to this app. */
:root{--app-safe-top:env(safe-area-inset-top,0px);--app-safe-bottom:env(safe-area-inset-bottom,0px);--keyboard-offset:0px}html{color-scheme:light}body{font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR',sans-serif;overscroll-behavior-y:none}button,a,input,textarea,select{touch-action:manipulation}button{-webkit-tap-highlight-color:transparent}button:active{filter:brightness(.97)}.modal{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.photo{background-size:300% 200%}.featurecard .photo,.detailpic .photo{aspect-ratio:1}.native-app body{padding-top:var(--app-safe-top)}.native-app .sidebar{top:var(--app-safe-top);height:calc(100dvh - var(--app-safe-top))}.native-app .modalback{top:var(--app-safe-top)}.native-app .modal{max-height:calc(100dvh - var(--app-safe-top) - 12px)}.app-paused *{animation-play-state:paused!important}.native-app .bottomnav{padding-bottom:calc(12px + var(--app-safe-bottom))}.keyboard-open .bottomnav{display:none}.keyboard-open .modal{max-height:calc(100dvh - var(--app-safe-top))}.keyboard-open .chatlog{height:clamp(100px,32dvh,260px)}.keyboard-open .chatnotice{margin-bottom:0}.keyboard-open .detailbottom{padding-bottom:10px}.keyboard-open .modalbody{padding-bottom:15px}.welcome-screen{position:fixed;inset:0;z-index:45;background:#faf7f1;overflow-y:auto;padding:calc(28px + var(--app-safe-top)) 25px calc(25px + var(--app-safe-bottom));display:flex;flex-direction:column;align-items:center}.welcome-wrap{width:100%;max-width:430px;display:flex;flex-direction:column;min-height:100%}.welcome-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.welcome-nav .brand{font-size:31px}.welcome-nav>span{font-size:8px;letter-spacing:1.5px;color:#a5aa9b}.welcome-collage{height:330px;position:relative;margin:0 -7px 30px;isolation:isolate}.welcome-collage:before{content:'';position:absolute;inset:8% 4%;border-radius:50%;border:1px solid #e1e5d4;transform:rotate(-16deg)}.welcome-collage:after{content:'';position:absolute;inset:12% 10%;border-radius:50%;background:#e9eddf;z-index:-1}.welcome-photo{position:absolute;width:50%;aspect-ratio:.8;border:7px solid #fffcf5;border-bottom:27px solid #fffcf5;box-shadow:0 14px 32px #46523715;border-radius:7px;overflow:hidden;top:25px;left:9%;transform:rotate(-11deg)}.welcome-photo .photo{height:100%;width:100%;aspect-ratio:1;background-size:auto 200%}.welcome-photo.second{left:auto;right:5%;top:70px;transform:rotate(12deg);width:48%}.welcome-sticker{position:absolute;left:2%;bottom:-1px;width:125px;height:125px;z-index:2;transform:rotate(-8deg)}.welcome-sticker .bunny{width:100%;height:100%}.welcome-word{position:absolute;right:4%;top:1px;color:#879879;font-family:Georgia,serif;font-style:italic;font-size:16px;transform:rotate(10deg)}.welcome-floatheart{position:absolute;color:#dfad9b;right:6%;bottom:12px;font-size:50px;transform:rotate(12deg)}.welcome-copy .eyebrow{font-size:9px;letter-spacing:2px;margin-bottom:12px}.welcome-copy h1{font-size:35px;line-height:1.45;font-weight:650;letter-spacing:-1.7px}.welcome-copy h1 span{color:#cb927c}.welcome-copy p{color:#929b85;font-size:12px;line-height:1.9;margin-top:15px}.welcome-bottom{margin-top:auto;padding-top:27px}.welcome-bottom .primary{min-height:52px;border-radius:15px;font-size:13px;background:#708361}.welcome-bottom .welcome-edit{display:block;width:100%;font-size:11px;color:#9ca58d;padding:15px}.welcome-disclosure{font-size:9px;color:#a4ac98;text-align:center;line-height:1.8;margin-top:9px}.welcome-demo-label{background:#efeddf;color:#98a183;padding:4px 9px;border-radius:20px;font-size:8px}.modalback.fullscreen-detail .modal{height:100dvh;max-height:100dvh;border-radius:0;max-width:650px}.modalback.fullscreen-detail{padding:0}.modalback.fullscreen-detail .detailpic .round{left:17px;right:auto}.modalback.fullscreen-detail .detailpic .round:before{content:'‹';font-size:25px;line-height:1}.modalback.fullscreen-detail .detailpic .round .icon{display:none}.modalback.fullscreen-detail .detailbottom{padding-bottom:calc(14px + var(--app-safe-bottom))}.back-label{font-size:12px;font-weight:500;color:#8a9979}.back-label button{padding:5px}.appbuildtag{color:#a2ac95;font-size:9px;display:block;text-align:center;margin:21px 0 4px}.native-app .appbuildtag{margin-bottom:var(--app-safe-bottom)}.native-app .topright .pill{font-size:8px}.native-app .chatlog{height:46dvh}.navtransition{animation:navtransition .2s ease-out}@keyframes navtransition{from{opacity:.6;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media(min-width:651px){.welcome-screen{background:#eeeee5;justify-content:center;padding:30px}.welcome-wrap{min-height:0;padding:27px;background:#faf7f1;border:1px solid #e4e7d7;border-radius:30px;box-shadow:0 20px 100px #3e533a0b}.welcome-collage{height:240px;margin-bottom:17px}.welcome-photo{width:44%;top:13px;left:13%;border-width:5px;border-bottom-width:20px}.welcome-photo.second{width:42%;top:38px;right:9%}.welcome-sticker{width:100px;height:100px;left:7%}.welcome-copy h1{font-size:28px}.welcome-copy p{font-size:11px}.welcome-bottom{padding-top:18px}.welcome-nav{margin-bottom:15px}.welcome-bottom .primary{min-height:46px}.welcome-bottom .welcome-edit{padding:10px}}@media(max-width:650px){.topbar{padding-top:4px}.bottomnav button{min-width:52px;min-height:43px}.bottomnav{padding-top:9px}.round{min-width:36px;min-height:36px}.modalback{bottom:var(--keyboard-offset)}.modal{max-height:92dvh}.modalhead .round{min-width:36px;min-height:36px}.modalback.fullscreen-detail{top:0}.native-app .modalback.fullscreen-detail{top:var(--app-safe-top)}.native-app .modalback.fullscreen-detail .modal{height:calc(100dvh - var(--app-safe-top));max-height:calc(100dvh - var(--app-safe-top))}.fullscreen-detail .detailpic .round{top:calc(14px + var(--app-safe-top))}.native-app .fullscreen-detail .detailpic .round{top:14px}.fullscreen-detail .detailcontent{padding-bottom:23px}.openfeature{touch-action:pan-y}.native-app .main{padding-bottom:calc(100px + var(--app-safe-bottom))}.native-app .topbar{height:67px}.chatform{padding-bottom:calc(14px + var(--app-safe-bottom))}.keyboard-open .chatform{padding-bottom:12px}.keyboard-open .quickreplies{padding-top:7px}.keyboard-open .chatlog{height:32dvh}.welcome-copy h1{font-size:32px}}@media(max-height:760px) and (max-width:650px){.welcome-collage{height:235px;margin-bottom:20px}.welcome-photo{width:43%;left:14%;top:9px}.welcome-photo.second{width:42%;right:8%;top:40px}.welcome-sticker{width:100px;height:100px;left:7%}.welcome-copy h1{font-size:29px}.welcome-copy p{font-size:11px;margin-top:10px}.welcome-nav{margin-bottom:17px}.welcome-bottom{padding-top:20px}}@media(prefers-reduced-motion:reduce){.navtransition{animation:none}}

@media(max-width:650px){.field,.modalbody .field{font-size:13px}.field input,.field select,.field textarea,.chatform input{font-size:16px}.inlinehint,.premium-foot,.footnote{font-size:11px!important;color:#748069!important}.postbody{font-size:14px}.selectpill,.choice,.closeword,.welcome-edit,.quickreplies button{min-height:44px}.tag{font-size:11px}.detailcontent .muted,.detailcontent p{font-size:13px;line-height:1.8}.welcome-disclosure{color:#75806b}.welcome-bottom .welcome-edit{font-size:12px;color:#727f65}}

/* Momo iPhone readability update: normal text 16px, labels 12–14px. */
@media(max-width:650px){
 body{font-size:16px;line-height:1.65}
 .titleline h1,.pagetop h1,.wide .pagetop h1{font-size:30px}
 .titleline{gap:12px;align-items:flex-start}.titleline>div{min-width:0}
 .titleline p,.greeting p,.pagetop p,.banner p,.empty p{font-size:15px;line-height:1.7}
 .titleline .eyebrow,.eyebrow,.detailcontent .eyebrow,.welcome-copy .eyebrow{font-size:12px;letter-spacing:1px}
 .edition{font-size:12px}.sectionhead h2{font-size:21px}.sectionhead{gap:12px}
 .textlink{font-size:14px;flex-shrink:0;min-height:44px}
 .topright .pill,.native-app .topright .pill{font-size:11px}
 .segmented{gap:18px}.segmented button{font-size:16px;min-height:44px}.segmented .filterbutton{font-size:14px}
 .story{flex-basis:62px}.story span{font-size:13px}.storyface{width:60px;height:60px}
 .featurebadge{font-size:12px}.aibadge{font-size:11px}.featuretop{gap:8px;flex-wrap:wrap}
 .featureinfo{right:20px}.featureinfo h2{font-size:32px}.featureinfo h2 span{font-size:26px}
 .featureinfo p{font-size:15px;line-height:1.6}.featureinfo .flag{font-size:13px}
 .featureinfo .tags .tag{font-size:12px;padding:4px 9px}.featurecard:after{inset:20% 0 0;background:linear-gradient(transparent,#192819cc)}
 .deckcounter{font-size:12px}.accentbanner h3{font-size:16px}.accentbanner p{font-size:14px;line-height:1.6}
 .accentbanner>div{min-width:0}.accentbanner .minibunny,.accentbanner>.icon{flex-shrink:0}
 .chip{font-size:14px;min-height:44px}.personline{flex-wrap:wrap;gap:3px 6px}.personline strong{font-size:17px}
 .personline .away{font-size:12px;margin-left:0;flex-basis:100%}
 .bio{font-size:14px;white-space:normal;overflow-wrap:anywhere;line-height:1.6}.tag{font-size:12px}
 .why{font-size:12px;line-height:1.6;align-items:flex-start}.why .icon{flex-shrink:0}
 .person .tagtop,.tagtop{font-size:11px;max-width:calc(100% - 50px);line-height:1.4}
 .bottomnav button{font-size:12px;min-height:48px;gap:5px}.bottomnav .dotnum{font-size:10px;min-width:16px;height:16px}
 .main,.native-app .main{padding-bottom:calc(116px + var(--app-safe-bottom))}
 .primary,.modalbody .primary,.detailbottom .primary,.welcome-bottom .primary{font-size:16px;min-height:52px}
 .secondary,.detailbottom .secondary{font-size:15px;min-height:48px}
 .modalhead h2{font-size:22px}.modalbody p,.detailcontent p,.detailcontent .muted,.questioncard p{font-size:16px;line-height:1.8}
 .detailcontent h2{font-size:30px}.detailcontent h3{font-size:18px}.detailcontent .tags .tag{font-size:14px}
 .detailstats small,.questioncard small{font-size:13px}.detailstats strong{font-size:15px;overflow-wrap:anywhere}
 .field,.modalbody .field{font-size:15px}.field input,.field select,.field textarea,.chatform input{font-size:17px}
 .selectpill,.choice,.reportchoices label,.checkchips label{font-size:15px;line-height:1.6}
 .stepcaption{font-size:12px}.wizard .subtitle{font-size:15px}.rangeval{font-size:15px}.rangeval b{font-size:17px}
 .inlinehint,.premium-foot,.footnote{font-size:13px!important;line-height:1.7}
 .sendhint,.chatnotice,.chatheadnote,.notebox,.closeword,.reportbtn,.back-label{font-size:13px;line-height:1.7}
 .bubble{font-size:16px;line-height:1.7}.quickreplies button{font-size:14px}.conversation p{font-size:15px}.conversation time{font-size:12px;flex-shrink:0}
 .conversation>div:not(.ava){min-width:0}.conversation p{overflow-wrap:anywhere}
 .postauthor b{font-size:16px}.postauthor small,.postauthor .topic{font-size:12px}.postbody{font-size:16px;line-height:1.85}
 .postauthor{flex-wrap:wrap}.postfooter button{font-size:14px;min-height:44px}.feedhead .primary{font-size:15px;min-height:44px}
 .commentline{font-size:16px}.commentline b{font-size:13px}.postmood{font-size:18px}
 .premiumhead{flex-wrap:wrap;gap:12px}.premiumhead .myavatar{flex-shrink:0}.premiumhead p,.myhead p{font-size:14px}
 .premiumhead button,.myhead button{font-size:14px;min-height:44px}.premiumhead h2,.myhead h2{font-size:24px}
 .progressheader b{font-size:16px}.progressheader span{font-size:14px}.completiontasks button{font-size:14px}
 .completiontasks button small,.ministats span,.menurow small,.stat span{font-size:13px;line-height:1.6}
 .ministats b{font-size:22px}.interestrow h3{font-size:17px}.interestrow p{font-size:14px}.interestrow button{font-size:13px;min-height:44px}
 .interestrow{flex-wrap:wrap}.interestrow>div:not(.ava){flex:1;min-width:0}.sentstamp{font-size:12px}
 .meetbody p{font-size:15px}.meetbody .primary{font-size:15px}.joinmeta{font-size:13px;gap:8px;flex-wrap:wrap}
 .switchrow b{font-size:16px}.switchrow small{font-size:13px}.switchrow input{flex-shrink:0}
 .welcome-copy p{font-size:16px;line-height:1.8}.welcome-bottom .welcome-edit{font-size:15px}
 .welcome-disclosure{font-size:12px;line-height:1.7}.welcome-demo-label{font-size:11px}.welcome-nav>span{font-size:11px;letter-spacing:1px}
 .appbuildtag{font-size:12px}#toast{font-size:15px;bottom:calc(108px + var(--app-safe-bottom))}
}
@media(max-width:374px){
 .main{padding-left:16px;padding-right:16px}.segmented{gap:14px}.featureinfo{left:16px;right:16px;bottom:16px}
 .featureinfo h2{font-size:29px}.featureinfo p{font-size:14px}.featureinfo .tags{gap:4px}
 .featureinfo .tags .tag{font-size:12px;padding:3px 7px}.edition{display:none}.detailstats{grid-template-columns:1fr}
 .completiontasks{grid-template-columns:1fr}.meetcard{grid-template-columns:80px 1fr}
}