*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg: #f4f1eb;
  --paper: #ffffff;
  --cream: #f7f3ec;
  --ink: #1a1a1a;
  --muted: #8b8b8b;
  --line: #ece8e1;
  --peach: #f8e4d6;
  --accent: #e07b55;
  --accent-2: #d46a3a;
  --grad: linear-gradient(90deg, #f4c4a6 0%, #ea9a74 42%, #e07a55 100%);
  --green: #1f7a3d;
  --green-bg: #e7f6ec;
  --lock: #3d4a5c;
  --radius: 18px;
  --app: 480px;
}

html, body {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #e4e0d8;
  color: var(--ink);
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}

button, a { font-family: inherit; color: inherit; appearance: none; -webkit-appearance: none; }

body {
  display: flex;
  justify-content: center;
}

.app {
  width: 100%;
  max-width: var(--app);
  min-height: 100vh;
  background: #e4e0d8;
  position: relative;
  overflow-x: clip;
}

.page {
  margin: 0 10px;
  background: var(--paper);
  border-radius: 18px 18px 0 0;
  box-shadow: 0 0 40px rgba(0, 0, 0, .06);
  padding-bottom: 118px;
  overflow: clip;
}

body.is-chat,
body.is-thread { overflow: hidden; }

img { display: block; max-width: 100%; }

img, video {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
}

.wm {
  position: absolute;
  left: auto;
  right: 8px;
  bottom: 8px;
  transform: none;
  z-index: 6;
  color: rgba(255, 255, 255, .72);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .01em;
  white-space: nowrap;
  pointer-events: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
  font-family: Inter, -apple-system, sans-serif;
}
