:root {
  --bg: #fbf8f1;
  --ink: #1d1d1d;
  --sub: #5b5b5b;
  --accent: #1f6b52;
  --accent-ink: #ffffff;
  --memo-bg: #fff3c4;
  --memo-ink: #3d3000;
  --listen: #c0392b;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: "Hiragino Maru Gothic ProN", "Hiragino Sans", system-ui, sans-serif;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
.screen {
  display: none;
  position: fixed;
  inset: 0;
  padding: max(24px, env(safe-area-inset-top)) 32px max(24px, env(safe-area-inset-bottom));
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 2vh;
}
.screen.on { display: flex; }

/* 時計 */
.date { font-size: 6vmin; font-weight: bold; }
.date span + span { margin-left: 0.6em; }
.time { font-size: 18vmin; font-weight: bold; line-height: 1.1; letter-spacing: 0.02em; }
.time #cPeriod { font-size: 0.4em; margin-right: 0.3em; vertical-align: 0.6em; }
.memo {
  background: var(--memo-bg);
  color: var(--memo-ink);
  font-size: 5.5vmin;
  line-height: 1.5;
  padding: 2vh 4vw;
  border-radius: 16px;
  max-width: 90vw;
  white-space: pre-wrap;
}
.talk-btn {
  margin-top: 2vh;
  background: var(--accent);
  color: var(--accent-ink);
  font-size: 9vmin;
  font-weight: bold;
  padding: 3vh 14vw;
  border-radius: 999px;
  box-shadow: 0 6px 0 rgba(0, 0, 0, 0.2);
}
.hint { font-size: 4vmin; color: var(--sub); }
.setup { font-size: 3vmin; color: #a33; }

/* 会話中 */
.status { font-size: 8vmin; font-weight: bold; color: var(--accent); }
.status.listening { color: var(--listen); animation: pulse 1.6s ease-in-out infinite; }
.you { font-size: 5vmin; color: var(--sub); max-width: 90vw; min-height: 1.5em; }
.ai { font-size: 7vmin; line-height: 1.5; max-width: 90vw; font-weight: bold; }
@keyframes pulse { 50% { opacity: 0.45; } }

#debugLog { position: fixed; bottom: 0; left: 0; right: 0; height: 25vh; overflow: auto; z-index: 10; background: #111e; color: white; font: 14px monospace; white-space: pre-wrap; margin: 0; padding: 8px; }