/* A handwritten invitation, with readable UI underneath. Font license: assets/. */
@font-face{font-family:MiloHand;src:url('assets/HakgyoansimKkokkomaR.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
:root{--ink:#174c37;--red:#dc405a;--ivory:#f5efdf;--paper:#fff8f4;--yellow:#f0ef42;--rule:rgba(23,76,55,.18)}
body.r-page,body.s-page,body.room-page{background-color:#f3e8da;background-image:radial-gradient(ellipse at 90% 15%,rgba(239,115,144,.5),transparent 55%),radial-gradient(ellipse at 15% 75%,rgba(255,208,151,.35),transparent 50%),linear-gradient(125deg,#f6f0df 15%,#f3e5d5 50%,#edb0bd 100%);background-attachment:fixed}
body .u-grain,body .s-grain{opacity:.1}
body :is(h1,h2,h3),body :is(h1,h2,h3) :is(em,span,strong,b){font-family:Pretendard,sans-serif;font-weight:700;font-style:normal;letter-spacing:-.025em;line-height:1.4}
body .story-animals span,body .apply-animal-bubble{font-family:MiloHand,Pretendard,sans-serif;font-weight:400;font-style:normal;letter-spacing:0;line-height:1.4}
body :is(p,li,dt,dd,label,input,textarea,select){font-weight:500}
body .u-nav>a:first-child b,body .s-nav>a,body .room-nav>a{font-family:MiloHand,sans-serif;font-weight:400;font-size:38px;letter-spacing:-.025em;line-height:1;color:var(--ink)}
body .u-nav>a.milo-brand{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;justify-self:start}
body .u-nav .milo-brand small{font-family:MiloHand,sans-serif;font-size:14px;font-weight:400;line-height:1.3;letter-spacing:0;white-space:nowrap}
body .u-nav,body .s-nav,body .room-nav{background:rgba(245,239,223,.45);backdrop-filter:blur(14px);border-color:transparent}
body.r-page .story-hero h1{font-family:Pretendard,sans-serif;font-weight:750;font-size:clamp(32px,4.2vw,56px);line-height:1.4;letter-spacing:-.03em}
body .story-season{font-family:Pretendard,sans-serif;font-size:clamp(22px,2.5vw,30px);font-weight:600;line-height:1.6;letter-spacing:-.02em}
body .story-animals{width:100%;flex-shrink:0}
body .story-animals span{font-size:17px;line-height:1.3;background:#fffaf0;padding:8px 5px}
body .story-empathy>h2,body .story-answer h2,body .flow-story>h2,body .r-privacy>h2,body .r-process>h2{font-weight:700;letter-spacing:-.025em;line-height:1.4}
body .story-situations h3{font-size:clamp(25px,2.8vw,34px);font-weight:700;letter-spacing:-.025em;line-height:1.45}
body .flow-steps .flow-example{font-family:Pretendard,sans-serif;font-weight:500;font-size:15px;line-height:1.8;color:var(--red);opacity:1}
body .r-button,body .s-button{background:var(--ink);color:var(--ivory);border-color:var(--ink)}
body.r-page .r-apply h2{font-weight:750;letter-spacing:-.03em;line-height:1.4}
body .r-apply h2 em,body .r-invite h2 em{color:var(--red)}
body .a-step h2{font-weight:700;letter-spacing:-.025em;line-height:1.4}
/* A centered conversation, rather than a numbered benefits grid. */
body .story-situations{display:flex;flex-direction:column;gap:26px;width:100%;max-width:760px;margin:0 auto;text-align:left}
body .story-situations li{display:flex;align-items:flex-start;gap:14px;width:90%;align-self:flex-start}
body .story-situations li:nth-child(even){align-self:flex-end;flex-direction:row-reverse}
body .story-situations li>div{max-width:calc(100% - 72px)}
body .story-situations h3{position:relative;background:rgba(255,250,245,.9);border-radius:22px 22px 22px 5px;padding:18px 24px;margin:0;font-size:clamp(19px,2vw,25px);font-weight:650;line-height:1.5;letter-spacing:-.025em;word-break:keep-all}
body .story-situations li:nth-child(even) h3{border-radius:22px 22px 5px 22px;background:rgba(255,239,241,.9)}
body .story-situations p{opacity:1;font-size:14px;line-height:1.7;padding:9px 12px 0;margin:0;color:var(--ink);word-break:keep-all}
body .story-situations li:nth-child(even) p{text-align:right}
.empathy-animal{flex:0 0 58px;width:58px;height:58px;margin-top:4px;border-radius:50%;background-image:url('assets/lounge-tables.png');background-size:698.182% 465.455%;background-repeat:no-repeat}
.empathy-animal.rabbit{background-position:8% 7.463%}.empathy-animal.otter{background-position:32.675% 7.463%}.empathy-animal.dog{background-position:90% 7.463%}.empathy-animal.bear{background-position:34.954% 65.92%}.empathy-animal.fox{background-position:92.705% 67.164%}.empathy-animal.panda{background-position:65% 65.92%}
body .a-field :is(input,textarea,select),body .composer input{background:#fffaf0;border-radius:10px}
body .stage-card{background:#fffaf0;border-color:var(--rule);border-radius:18px}
body .bubble:not(.me){background:#fffaf0}
body .bubble.me{background:var(--ink)}
.launch-demo-link{display:block;width:fit-content;margin:18px auto 0;padding:8px 14px;font-size:12px;color:var(--ink);text-underline-offset:4px}
.journey-art{display:block;width:108px;height:108px;background-image:url('assets/journey-crayon-icons.png');background-size:200% 200%;background-repeat:no-repeat;flex-shrink:0}
.journey-art-1{background-position:0 0}.journey-art-2{background-position:100% 0}.journey-art-3{background-position:0 100%}.journey-art-4{background-position:100% 100%}
@media(max-width:620px){.journey-art{width:90px;height:90px}}
.launch-offer-badge{display:inline-block;color:#bc3e43;padding:4px 8px;transform:rotate(-3deg);font-family:MiloHand,Pretendard,sans-serif;font-weight:400;letter-spacing:.005em;line-height:1.15;text-transform:none}
body .r-invite .launch-offer-title:has(.launch-offer-badge){margin:20px 0 26px;font-size:clamp(52px,8vw,88px)}
.launch-original>span{display:block;font-size:23px;line-height:1.3;margin:6px 0;color:#c73350}
body .r-invite .launch-offer-title{font-size:clamp(36px,5vw,56px);margin:12px 0 24px;line-height:1.3}
body .r-invite .launch-original{font-size:17px;margin:0 0 2px;color:#626d60}.launch-original s{margin-left:8px;text-decoration-thickness:2px}
body .r-invite .launch-price{margin:0 0 22px;color:var(--red);line-height:1.1;display:flex;align-items:baseline;justify-content:center;gap:5px}.launch-price strong{font-size:clamp(72px,10vw,112px);font-weight:750;letter-spacing:-.055em}.launch-price span{font-size:30px;font-weight:650}
body .r-invite .launch-payment-note{font-size:15px;line-height:1.8;margin:20px 0 28px;word-break:keep-all}
body .r-process>.u-kicker{margin-bottom:28px}
body .r-process .drawn-journey li b{font-family:MiloHand,Pretendard,sans-serif;font-size:27px;font-weight:400;letter-spacing:0}
body .matching-quote{max-width:680px;margin:70px auto 0;padding:0 16px;text-align:center;color:var(--ink)}
.matching-quote>span{display:block;font-family:Georgia,serif;font-size:68px;line-height:.8;color:#b85767}
body .matching-quote p{font-size:17px;line-height:1.95;margin:16px 0 24px;word-break:keep-all}.matching-quote strong{font-weight:700}.matching-quote small{display:block;font-size:13px;line-height:1.7}
@media(max-width:620px){body .r-process .drawn-journey li b{font-size:24px}body .matching-quote p{font-size:15px}.matching-quote small{font-size:12px}}
body .r-process .drawn-journey{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;max-width:1000px;border:0;text-align:center}
body .drawn-journey li{display:flex;flex-direction:column;align-items:center;position:relative;padding:12px 0;border:0;gap:12px;min-width:0}
.drawn-journey svg{width:92px;height:92px;stroke:#263b30;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;fill:none;transform:rotate(-3deg)}
.drawn-journey li:nth-child(even) svg{transform:rotate(3deg)}
.drawn-journey .journey-check{stroke-width:6;stroke:#3e6d4c}
body .drawn-journey li b{font-size:20px;line-height:1.4}
body .drawn-journey li p{font-size:13px;line-height:1.7;margin:0;word-break:keep-all}
.drawn-journey li:not(:last-child):after{content:'›';position:absolute;right:-21px;top:42px;font-size:27px;font-weight:400;color:#6c806e}
@media(max-width:620px){body .r-process .drawn-journey{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px}.drawn-journey li:nth-child(2):after{display:none}body .drawn-journey li b{font-size:18px}body .drawn-journey li p{font-size:12px}.drawn-journey svg{width:76px;height:76px}.drawn-journey li:not(:last-child):after{right:-14px;top:34px}}
body.room-page .bubble.host{align-self:center;flex-shrink:0;width:fit-content;max-width:min(480px,100%);background:#e1ede6;color:#174c37;border:1px solid #b8d0c2;border-radius:14px;padding:13px 18px;font-size:14px;font-weight:550;line-height:1.75;text-align:center;opacity:1;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:600px){
 body.r-page .story-hero h1{font-size:30px;line-height:1.5}
 body .story-season{font-size:23px}
 body .story-animals span{font-size:15px}
 body .story-situations{gap:24px;max-width:100%}
 body .story-situations li{width:100%;gap:9px}
 body .story-situations li>div{max-width:calc(100% - 53px)}
 body .story-situations h3{font-size:18px;padding:14px 16px}
 body .story-situations p{font-size:12px;padding:8px 4px 0}
 .empathy-animal{flex-basis:44px;width:44px;height:44px}
 body .u-nav>a:first-child b,body .s-nav>a,body .room-nav>a{font-size:32px}
 body .a-step h2{font-size:34px}
}