/* All selectors are namespaced so Cocoon styles remain unaffected. */
.couleur-fortune {
  --cl-ink: #292727;
  --cl-muted: #928a89;
  --cl-rose: #b48188;
  --cl-rose-light: #f8f2f0;
  --cl-line: #eee6e4;
  box-sizing: border-box;
  width: 100%;
  padding: 24px 22px 20px;
  border: 1px solid var(--cl-line);
  background: #fff;
  color: var(--cl-ink);
  font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 400;
  line-height: 1.85;
}
.couleur-fortune *, .couleur-fortune *::before, .couleur-fortune *::after { box-sizing: border-box; }
.couleur-fortune :is(h2, h3, p) { margin: 0; padding: 0; border: 0; color: inherit; background: none; line-height: inherit; }
.couleur-fortune__head { display: flex; gap: 12px; align-items: end; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid var(--cl-line); }
.couleur-fortune__eyebrow { font-family: Georgia, serif; font-size: 10px; font-weight: 400; letter-spacing: .18em; color: var(--cl-rose); }
.couleur-fortune__head h2 { font-size: 22px; font-weight: 500; letter-spacing: .05em; }
.couleur-fortune__head time { font-family: Georgia, serif; font-size: 11px; color: var(--cl-muted); white-space: nowrap; padding-bottom: 3px; }
.couleur-fortune__intro { font-size: 12px; color: var(--cl-muted); padding: 13px 0 12px; }
.couleur-fortune__sun { color: var(--cl-rose); padding-right: 4px; }
.couleur-fortune__sign-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.couleur-fortune__sign { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 0; margin: 0; padding: 6px 1px 5px; border: 1px solid transparent; border-radius: 4px; background: transparent; cursor: pointer; box-shadow: none; color: #80716e; transition: background .2s ease; min-width: 0; font-family: inherit; line-height: 1.3; }
.couleur-fortune__sign:hover, .couleur-fortune__sign.is-selected { background: var(--cl-rose-light); border-color: #eadbd9; color: #895d64; }
.couleur-fortune__sign:focus-visible { outline: 2px solid var(--cl-rose); outline-offset: 2px; }
.couleur-fortune__sign-symbol { font-size: 24px; line-height: 1.45; font-family: Georgia, serif; }
.couleur-fortune__sign-name { font-size: 9px; letter-spacing: -.04em; white-space: nowrap; }
.couleur-fortune__reading { margin-top: 22px; }
.couleur-fortune__picked { display: flex; align-items: center; gap: 13px; padding-bottom: 14px; }
.couleur-fortune__picked-symbol { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; flex: 0 0 54px; border-radius: 50%; background: #f7eae9; font-family: Georgia, serif; font-size: 37px; color: #b47f87; }
.couleur-fortune__picked h3 { font-weight: 500; font-size: 19px; }
.couleur-fortune__period { display: block; font-size: 11px; color: var(--cl-muted); font-family: Georgia, serif; }
.couleur-fortune__overall { margin-left: auto; align-self: center; white-space: nowrap; font-size: 15px; letter-spacing: 0; }
.couleur-fortune__stars-on { color: #c49c63; }
.couleur-fortune__stars-off { color: #d6d0cd; }
.couleur-fortune__message { padding-bottom: 18px !important; font-size: 14px; line-height: 2 !important; }
.couleur-fortune__ratings { border-top: 1px solid var(--cl-line); }
.couleur-fortune__rating-row { padding: 11px 0; border-bottom: 1px solid var(--cl-line); }
.couleur-fortune__rating-top { display: flex; justify-content: space-between; align-items: center; color: #986b70; font-size: 13px; }
.couleur-fortune__stars { letter-spacing: .04em; font-size: 13px; }
.couleur-fortune__rating-row p { padding-top: 2px; font-size: 12px; color: #6e6766; }
.couleur-fortune__luck { display: grid; grid-template-columns: 1fr 1fr; gap: 15px 11px; padding: 16px; margin-top: 17px; background: var(--cl-rose-light); }
.couleur-fortune__luck small { display: block; color: #ad898c; font-size: 10px; letter-spacing: .03em; }
.couleur-fortune__luck strong { display: block; margin-top: 1px; font-size: 12px; color: #55494b; font-weight: 500; }
.couleur-fortune__action { grid-column: 1 / -1; padding-top: 8px; border-top: 1px solid #eadbd9; }
.couleur-fortune__footnote { padding-top: 12px !important; font-size: 10px; color: var(--cl-muted) !important; }
.couleur-fortune__loading { font-size: 13px; color: var(--cl-muted); }
.couleur-fortune--full { max-width: 870px; margin-left: auto; margin-right: auto; padding: 36px; }
.couleur-fortune--full .couleur-fortune__sign-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.couleur-fortune--full .couleur-fortune__sign-name { font-size: 10px; }
.couleur-fortune--full .couleur-fortune__message { font-size: 16px; }
.couleur-fortune--full .couleur-fortune__ratings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.couleur-fortune--full .couleur-fortune__luck { grid-template-columns: 1fr 1fr 2fr; }
.couleur-fortune--full .couleur-fortune__action { grid-column: auto; padding-top: 0; padding-left: 14px; border-top: 0; border-left: 1px solid #eadbd9; }
@media (max-width: 840px) { .couleur-fortune--full .couleur-fortune__sign-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } .couleur-fortune--full .couleur-fortune__ratings { display: block; } .couleur-fortune--full .couleur-fortune__luck { grid-template-columns: 1fr 1fr; } .couleur-fortune--full .couleur-fortune__action { grid-column: 1/-1; padding: 8px 0 0; border-left: 0; border-top: 1px solid #eadbd9; } }
@media (max-width: 480px) { .couleur-fortune, .couleur-fortune--full { padding: 18px 14px 15px; } .couleur-fortune__head h2 { font-size: 20px; } .couleur-fortune__picked-symbol { width: 46px; height: 46px; flex-basis: 46px; font-size: 32px; } .couleur-fortune__overall { font-size: 12px; } .couleur-fortune__sign-grid { gap: 2px; } .couleur-fortune__sign-symbol { font-size: 21px; } .couleur-fortune__sign-name { font-size: 8px; } }
@media (prefers-reduced-motion: reduce) { .couleur-fortune__sign { transition: none; } }