/* LingHoma coming-soon page. Fonts are self-hosted (see fonts/ and docs/WEBSITE_ASSETS.md). */
@font-face{font-family:"Young Serif";src:url("fonts/YoungSerif-Regular-latin.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-Variable-latin.woff") format("woff");font-weight:200 1000;font-style:normal;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/Nunito-Italic-Variable-latin.woff") format("woff");font-weight:200 1000;font-style:italic;font-display:swap}

:root{
  --cream:#f1ebde; --card:#fffdf7; --ink:#233a2d; --muted:#5b6b60;
  --green:#048848; --red:#ce2b37; --line:rgba(35,58,45,.14);
  --serif:"Young Serif",Georgia,"Times New Roman",serif;
  --display:"Nunito","Trebuchet MS",sans-serif;
  --body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --trans:"Nunito",system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;min-height:100vh;min-height:100svh;display:grid;place-items:center;
  padding:max(20px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(20px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  background:var(--cream) url("terrazzo.svg") repeat;
  color:var(--ink);font:16px/1.5 var(--body);
}
.card{
  width:min(480px,100%);background:var(--card);border-radius:28px;
  padding:34px 26px 24px;border:1px solid var(--line);
  box-shadow:0 2px 0 rgba(35,58,45,.06),0 26px 54px rgba(35,58,45,.24);
}
.brand{text-align:center;margin:0 0 22px}
.logo{margin:0;font:400 clamp(2.4rem,9vw,3.2rem)/1 var(--serif);letter-spacing:-.005em;color:var(--ink)}
.tag{margin:8px 0 0;font:600 .72rem var(--body);text-transform:uppercase;letter-spacing:.16em;color:var(--muted)}

.chat{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.row{display:flex;flex-direction:column;gap:2px;max-width:88%}
.row.you{align-self:flex-start}
.row.me{align-self:flex-end;align-items:flex-end}
.who{font:600 .72rem var(--body);color:var(--muted);margin:0 8px}
.m{margin:0;padding:11px 17px;border-radius:20px;font:800 1.3rem/1.2 var(--display)}
.m small{display:block;font:italic 600 .92rem/1.25 var(--trans);opacity:.94;margin-top:3px}
.you .m{background:var(--green);color:#fff;border-bottom-left-radius:5px}
.me .m{background:var(--red);color:#fff;border-bottom-right-radius:5px}
.soon .m{font-size:1.75rem;transform:rotate(-1.5deg)}
.time{font:500 .68rem var(--body);color:var(--muted);margin:0 8px}
.gap{height:8px}

.contact{margin:22px 0 0;padding-top:16px;border-top:1px dashed var(--line);text-align:center;font-size:.9rem;color:var(--muted)}
.contact a{color:var(--ink);font-weight:600;text-decoration-color:var(--green);text-underline-offset:3px}
.contact a:hover{color:var(--green)}
a:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:4px}

@media(max-width:420px){.card{padding:26px 18px 20px;border-radius:24px}.m{font-size:1.15rem}.soon .m{font-size:1.5rem}}
.page-404 .m{font-size:1.2rem}
.back{display:inline-block;margin-top:18px;background:var(--green);color:#fff;text-decoration:none;font:700 1rem var(--display);padding:10px 22px;border-radius:99px}
.back:focus-visible{outline-color:var(--ink)}