/* Core blocks only. No styles outside article content / its block editor. */
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-cards {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: 0;
  margin-block: 20px 36px; padding: 20px 12px; border: 1px solid #ddd5f5;
  border-radius: 10px; background: #fff;
}
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card {
  position: relative; min-width: 0; margin: 0; padding: 0 10px;
  border-right: 1px solid var(--color-line, #e1dcf2); text-align: center;
  color: var(--color-ink, #24177f);
}
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card:last-child { border-right: 0; }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-image {
  display: block; width: 80px; max-width: 100%; height: 80px; margin: 0 auto 12px;
}
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-image img {
  display: block; width: 100%; height: 80px; object-fit: contain; border-radius: 0;
}
/* Keep the editor's unselected-media controls usable; actual images stay 80px. */
.editor-styles-wrapper .spiru-meaning-image:has(.components-placeholder) {
  width: 100%; height: auto; min-height: 160px;
}
.editor-styles-wrapper .spiru-meaning-image .components-placeholder {
  min-width: 0; max-width: 100%;
}
/* Optical centering belongs to these existing assets, never the card order. */
.spiru-meaning-image img[src*="/single-meaning-resonance"] { transform: translateX(-1.5px); }
.spiru-meaning-image img[src*="/single-meaning-attraction"] { transform: translateX(-.8px); }
.spiru-meaning-image img[src*="/single-meaning-soul-tie"] { transform: translateX(-3.4px); }
.spiru-meaning-image img[src*="/single-meaning-turning-point"] { transform: translateX(-10px); }
.spiru-meaning-image img[src*="/single-meaning-mirror"] { transform: translateX(-12px); }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-label {
  margin: 0; padding: 0; font-family: var(--font-body, 'Noto Sans JP', sans-serif);
  font-size: 13px; font-weight: 700; line-height: 1.8;
}
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-label a { color: inherit; text-decoration: none; }
.spiru-article .spiru-meaning-label a::after { content: ''; position: absolute; inset: 0; }
.spiru-article .spiru-meaning-card:has(a:focus-visible) { outline: 2px solid var(--color-primary, #2f1a9b); outline-offset: 3px; border-radius: 4px; }
.spiru-article .spiru-meaning-card:hover:has(a) { color: var(--color-primary-2, #5c43bd); }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-description {
  margin: 6px 0 0; padding: 0; font-size: 12px; line-height: 1.8;
}
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks { display: grid; gap: 12px; margin-block: 20px 32px; }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks > .wp-block-details { margin: 0; border: 1px solid #e4ddf5; border-radius: 8px; background: #fff; }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks > .wp-block-details > summary { min-height: 44px; padding: 14px 18px; border-radius: 8px; background: #f8f5fd; font-size: 16px; font-weight: 700; line-height: 1.95; cursor: pointer; }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks .faq-item__body { margin: 0; padding: 4px 18px 12px; }
:is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks .faq-item__body > p { margin-block: 10px; }
@media (min-width: 768px) and (max-width: 1023px) {
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 24px; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card:nth-child(3n) { border-right: 0; }
}
@media (max-width: 767px) {
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px 8px; row-gap: 20px; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card:nth-child(even) { border-right: 0; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card:only-child { grid-column: 1 / -1; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks > .wp-block-details > summary { padding: 12px 14px; font-size: 15px; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-faq-blocks .faq-item__body { padding-inline: 14px; }
}
@media (max-width: 359px) {
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-card { padding-inline: 6px; }
  :is(.spiru-article .spiru-content, .editor-styles-wrapper) .spiru-meaning-label { font-size: 12px; }
}
