.ak-mood-guide {
  --mood-ink: #eeeafb;
  --mood-muted: #c5bdd7;
  --mood-panel: #211e33;
  --mood-tile: #2c2742;
  --mood-line: #55496d;
  --mood-accent: #b4f3d5;
  color: var(--mood-ink);
  display: grid;
  gap: .85rem;
  min-width: 0;
}
.ak-mood-guide__step {
  background: var(--mood-panel);
  border: 1px solid var(--mood-line);
  border-radius: 1.15rem;
  margin-block: .65rem;
  min-width: 0;
  padding: clamp(.8rem, 4vw, 1.3rem);
}
.ak-mood-guide__step h3 { font-size: 1.13rem; margin: 0 0 .55rem; }
.ak-mood-guide__step p { color: var(--mood-muted); line-height: 1.55; margin: .4rem 0 .85rem; }
.ak-mood-guide__step .ak-mood-guide__question { color: var(--mood-ink); font-weight: 700; }
.ak-mood-guide__grid, .ak-mood-guide__history {
  display: grid;
  gap: .55rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  margin: .7rem 0 0;
  padding: 0;
}
.ak-mood-guide__history { grid-template-columns: repeat(auto-fit, minmax(min(100%, 7.5rem), 1fr)); }
.ak-mood-guide__history li {
  background: var(--mood-tile);
  border-radius: .8rem;
  display: grid;
  gap: .25rem;
  list-style: none;
  min-width: 0;
  padding: .6rem;
}
.ak-mood-guide__history time { color: var(--mood-muted); font-size: .85rem; }
.ak-mood-guide button {
  appearance: none;
  background: var(--mood-tile);
  border: 1px solid var(--mood-line);
  border-radius: .8rem;
  color: var(--mood-ink);
  cursor: pointer;
  font: inherit;
  margin-block: .35rem 0;
  min-height: 44px;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: .55rem .7rem;
  text-align: start;
}
.ak-mood-guide button:enabled:hover { border-color: var(--mood-accent); }
.ak-mood-guide__help button { color: var(--mood-accent); }
.ak-mood-guide button:disabled { cursor: default; opacity: .72; }
.ak-mood-guide button:focus-visible, .ak-mood-guide textarea:focus-visible,
.ak-mood-guide h3:focus-visible { outline: 3px solid var(--mood-accent); outline-offset: 2px; }
.ak-mood-guide button + button { margin-inline-start: .4rem; }
.ak-mood-guide__grid button + button { margin-inline-start: 0; }
.ak-mood-guide__tile { align-content: start; display: grid; gap: .25rem; }
.ak-mood-guide__tile span { color: var(--mood-muted); font-size: .875rem; }
.ak-mood-guide .ak-mood-guide__icon { font-size: 1.25rem; line-height: 1.35; }
.ak-mood-guide__step label { display: block; }
.ak-mood-guide textarea, .ak-mood-guide p.ak-mood-guide__draft {
  background: var(--mood-tile);
  border: 1px solid var(--mood-line);
  border-radius: .7rem;
  box-sizing: border-box;
  color: var(--mood-ink);
  font: inherit;
  overflow-wrap: anywhere;
  padding: .65rem;
  white-space: pre-wrap;
  width: 100%;
}
.ak-mood-guide textarea { display: block; margin-block: .35rem; resize: vertical; }
.ak-mood-guide__step .ak-mood-guide__notice { color: var(--mood-accent); }
.ak-mood-guide__notice:empty { margin: 0; }