:root {
	--kazaru-accent: #287c71;
	--kazaru-accent-dark: #1e6058;
	--kazaru-text: #263238;
	--kazaru-radius: 10px;
	--kazaru-button-radius: 999px;
	--kazaru-box-border: 2px;
	--kazaru-marker-yellow: #ffe790;
	--kazaru-marker-blue: #aee5ee;
	--kazaru-marker-pink: #ffcbd8;
	--kazaru-point-bg: #eaf7f4;
	--kazaru-note-bg: #edf4fc;
	--kazaru-caution-bg: #fff4e4;
}

.kazaru-text { line-height: 1.9; color: var(--kazaru-local-text, var(--kazaru-text)); }
.kazaru-text--marker-yellow, .kazaru-text--marker-blue, .kazaru-text--marker-pink { display: inline; padding: 0 .08em; background-repeat: no-repeat; background-position: 0 88%; background-size: 100% .55em; }
.kazaru-text--marker-yellow { background-image: linear-gradient(transparent 0, var(--kazaru-local-accent, var(--kazaru-marker-yellow)) 0); }
.kazaru-text--marker-blue { background-image: linear-gradient(transparent 0, var(--kazaru-local-accent, var(--kazaru-marker-blue)) 0); }
.kazaru-text--marker-pink { background-image: linear-gradient(transparent 0, var(--kazaru-local-accent, var(--kazaru-marker-pink)) 0); }
.kazaru-text--underline { text-decoration: underline 3px var(--kazaru-local-accent, var(--kazaru-accent)); text-underline-offset: .3em; }

.kazaru-box { position: relative; margin: 1.5em 0; border-radius: var(--kazaru-radius); overflow: hidden; color: var(--kazaru-local-text, var(--kazaru-text)); }
.kazaru-box__title { padding: .65em 1em; font-weight: 700; }
.kazaru-box__title--hidden { display: none; }
.kazaru-box__content { padding: 1em 1.2em; line-height: 1.8; background: var(--kazaru-local-bg, #fff); }
.kazaru-box--point { border: var(--kazaru-box-border) solid var(--kazaru-local-accent, var(--kazaru-accent)); background: var(--kazaru-local-bg, var(--kazaru-point-bg)); }
.kazaru-box--point .kazaru-box__title { background: var(--kazaru-local-bg, var(--kazaru-point-bg)); color: var(--kazaru-local-text, var(--kazaru-accent-dark)); }
.kazaru-box--note { border: var(--kazaru-box-border) solid var(--kazaru-local-accent, #6c91c2); background: var(--kazaru-local-bg, var(--kazaru-note-bg)); }
.kazaru-box--note .kazaru-box__title { background: var(--kazaru-local-bg, var(--kazaru-note-bg)); color: var(--kazaru-local-text, #315f98); }
.kazaru-box--caution { border: var(--kazaru-box-border) solid var(--kazaru-local-accent, #e19b4d); background: var(--kazaru-local-bg, var(--kazaru-caution-bg)); }
.kazaru-box--caution .kazaru-box__title { background: var(--kazaru-local-bg, var(--kazaru-caution-bg)); color: var(--kazaru-local-text, #92520a); }
.kazaru-box--simple { border: 1px solid #cbd5d8; box-shadow: 0 5px 18px rgba(25, 45, 50, .08); }
.kazaru-box--simple .kazaru-box__title { background: #f4f7f7; }
.kazaru-box--square { border-radius: 0; }
.kazaru-box--border-dashed { border-style: dashed; }
.kazaru-box--border-double { border-style: double; border-width: max(4px, calc(var(--kazaru-box-border) * 2)); }
.kazaru-box--border-stripe { border: 5px solid transparent; background: linear-gradient(var(--kazaru-local-bg, #fff), var(--kazaru-local-bg, #fff)) padding-box, repeating-linear-gradient(135deg, var(--kazaru-local-accent, var(--kazaru-accent)) 0 4px, transparent 4px 8px) border-box; }

.kazaru-heading { margin: 1.8em 0 .9em; color: var(--kazaru-local-text, var(--kazaru-text)); font-size: clamp(1.25rem, 3vw, 1.7rem); line-height: 1.45; }
.kazaru-heading--left-line { padding: .45em .7em; border-left: 6px solid var(--kazaru-local-accent, var(--kazaru-accent)); background: var(--kazaru-local-bg, #f2f8f7); }
.kazaru-heading--bottom-line { padding: .35em .1em .5em; border-bottom: 3px solid var(--kazaru-local-accent, var(--kazaru-accent)); background: var(--kazaru-local-bg, transparent); }
.kazaru-heading--filled { padding: .65em .85em; border-radius: 6px; color: var(--kazaru-local-text, #fff); background: var(--kazaru-local-bg, var(--kazaru-local-accent, var(--kazaru-accent))); }
.kazaru-heading--accent { padding: .35em 0 .35em 1.2em; position: relative; }
.kazaru-heading--accent::before { content: ''; position: absolute; left: 0; top: .55em; width: .65em; height: .65em; border-radius: 50%; background: var(--kazaru-local-accent, var(--kazaru-accent)); box-shadow: .22em .22em 0 color-mix(in srgb, var(--kazaru-local-accent, var(--kazaru-accent)) 55%, white); }
.kazaru-heading--accent-square::before { border-radius: 2px; box-shadow: none; }
.kazaru-heading--accent-diamond::before { border-radius: 2px; transform: rotate(45deg) scale(.78); box-shadow: none; }
.kazaru-heading--accent-check::before { content: '\2713'; display: grid; place-items: center; width: .9em; height: .9em; top: .35em; border-radius: 50%; color: #fff; font-size: .82em; line-height: 1; box-shadow: none; }
.kazaru-heading--accent-double::before { box-shadow: .45em 0 0 color-mix(in srgb, var(--kazaru-local-accent, var(--kazaru-accent)) 55%, white); }

.kazaru-button-wrap { margin: 1.5em 0; text-align: center; }
.kazaru-button { position: relative; display: inline-block; min-width: 12em; padding: .85em 1.7em; border: 2px solid var(--kazaru-local-accent, var(--kazaru-accent)); border-radius: var(--kazaru-button-radius); overflow: hidden; font-weight: 700; text-align: center; text-decoration: none !important; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.kazaru-button:hover { transform: translateY(-2px); box-shadow: 0 7px 16px rgba(40, 124, 113, .22); }
.kazaru-button--solid { color: var(--kazaru-local-text, #fff) !important; background: var(--kazaru-local-bg, var(--kazaru-local-accent, var(--kazaru-accent))); }
.kazaru-button--solid:hover { background: var(--kazaru-accent-dark); }
.kazaru-button--outline { color: var(--kazaru-local-text, var(--kazaru-local-accent, var(--kazaru-accent))) !important; background: var(--kazaru-local-bg, #fff); }
.kazaru-button--soft { border-color: var(--kazaru-local-accent, #b8ddd8); color: var(--kazaru-local-text, #185d55) !important; background: var(--kazaru-local-bg, var(--kazaru-point-bg)); }
.kazaru-button--shine::after { content: ''; position: absolute; top: -60%; left: -45%; width: 28%; height: 220%; transform: rotate(24deg); background: linear-gradient(90deg, transparent, rgba(255,255,255,.82), transparent); animation: kazaru-button-shine 3.2s ease-in-out infinite; pointer-events: none; }
@keyframes kazaru-button-shine { 0%, 58% { left: -45%; } 82%, 100% { left: 125%; } }

.kazaru-bubble { display: flex; align-items: flex-start; gap: 14px; margin: 1.5em 0; color: var(--kazaru-local-text, var(--kazaru-text)); }
.kazaru-bubble--right { flex-direction: row-reverse; }
.kazaru-bubble__person { flex: 0 0 64px; text-align: center; }
.kazaru-bubble__avatar { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 5px; border-radius: 50%; color: #fff; background: var(--kazaru-local-accent, var(--kazaru-accent)); font-weight: 800; font-size: 1.25em; }
.kazaru-bubble__name { font-size: .75em; line-height: 1.3; overflow-wrap: anywhere; }
.kazaru-bubble__text { position: relative; flex: 1; min-width: 0; padding: 1em 1.2em; border-radius: 14px; line-height: 1.75; }
.kazaru-bubble--soft .kazaru-bubble__text { background: var(--kazaru-local-bg, var(--kazaru-point-bg)); }
.kazaru-bubble--outline .kazaru-bubble__text { border: 2px solid var(--kazaru-local-accent, var(--kazaru-accent)); background: var(--kazaru-local-bg, #fff); }
.kazaru-bubble__text::before { content: ''; position: absolute; top: 18px; left: -10px; border-width: 7px 11px 7px 0; border-style: solid; border-color: transparent var(--kazaru-local-bg, var(--kazaru-point-bg)) transparent transparent; }
.kazaru-bubble--right .kazaru-bubble__text::before { left: auto; right: -10px; transform: scaleX(-1); }
.kazaru-bubble--outline .kazaru-bubble__text::before { border-right-color: var(--kazaru-local-accent, var(--kazaru-accent)); }

@media (max-width: 480px) {
	.kazaru-bubble { gap: 9px; }
	.kazaru-bubble__person { flex-basis: 52px; }
	.kazaru-bubble__avatar { width: 48px; height: 48px; }
	.kazaru-bubble__text { padding: .8em 1em; }
}

@media (prefers-reduced-motion: reduce) {
	.kazaru-button { transition: none; }
	.kazaru-button--shine::after { animation: none; display: none; }
}

.kazaru-list { margin: 1.5em 0; padding: 1em 1.2em 1em 2.8em; border: 1px solid var(--kazaru-local-border, #d8e3e1); border-radius: var(--kazaru-radius); background: var(--kazaru-local-bg, #fff); color: var(--kazaru-local-text, var(--kazaru-text)); box-shadow: 0 4px 14px rgba(25, 45, 50, .06); }
.kazaru-list li { margin: .45em 0; padding-left: .25em; line-height: 1.75; }
.kazaru-list--bullet li::marker { color: var(--kazaru-local-accent, var(--kazaru-accent)); font-size: 1.2em; }
.kazaru-list--number { counter-reset: kazaru-list-number; list-style: none; padding-left: 1.2em; }
.kazaru-list--number li { position: relative; min-height: 1.75em; padding-left: 2.3em; counter-increment: kazaru-list-number; }
.kazaru-list--number li::before { content: counter(kazaru-list-number); position: absolute; top: .13em; left: 0; display: grid; place-items: center; width: 1.65em; height: 1.65em; border-radius: 50%; color: #fff; background: var(--kazaru-local-accent, var(--kazaru-accent)); font-size: .82em; font-weight: 700; line-height: 1; }
.kazaru-list--check { list-style: none; padding-left: 1.2em; background: var(--kazaru-local-bg, var(--kazaru-point-bg)); }
.kazaru-list--check li { position: relative; padding-left: 2em; }
.kazaru-list--check li::before { content: '\2713'; position: absolute; left: 0; top: .03em; color: var(--kazaru-local-accent, var(--kazaru-accent)); font-size: 1.2em; font-weight: 800; }
.kazaru-list--checkbox { list-style: none; padding-left: 1.2em; }
.kazaru-list--checkbox li { position: relative; padding-left: 2em; }
.kazaru-list--checkbox li::before { content: '\25A1'; position: absolute; left: 0; top: -.03em; color: var(--kazaru-local-accent, var(--kazaru-accent)); font-size: 1.35em; font-weight: 700; }
.kazaru-list--no-border { border-color: transparent; box-shadow: none; }
.kazaru-list-box { margin: 1.5em 0; border-radius: var(--kazaru-radius); overflow: hidden; color: var(--kazaru-local-text, var(--kazaru-text)); }
.kazaru-list__title { padding: .65em 1em; border: 1px solid var(--kazaru-local-border, var(--kazaru-local-accent, var(--kazaru-accent))); border-bottom: 0; border-radius: var(--kazaru-radius) var(--kazaru-radius) 0 0; font-weight: 700; }
.kazaru-list__title--point { background: var(--kazaru-local-bg, var(--kazaru-point-bg)); color: var(--kazaru-local-text, var(--kazaru-accent-dark)); }
.kazaru-list__title--note { background: var(--kazaru-local-bg, var(--kazaru-note-bg)); color: var(--kazaru-local-text, #315f98); }
.kazaru-list__title--caution { background: var(--kazaru-local-bg, var(--kazaru-caution-bg)); color: var(--kazaru-local-text, #92520a); }
.kazaru-list__title--simple { background: var(--kazaru-local-bg, #f4f7f7); }
.kazaru-list__title--no-border { border-color: transparent; }
.kazaru-list--with-title { margin-top: 0; border-radius: 0 0 var(--kazaru-radius) var(--kazaru-radius); }
.kazaru-list-box > .kazaru-list--with-title { margin-bottom: 0; }

:where(.kazaru-text,.kazaru-box,.kazaru-heading,.kazaru-button-wrap,.kazaru-bubble,.kazaru-list:not(.kazaru-list--with-title),.kazaru-list-box) { margin-top: var(--kazaru-local-mt, var(--kazaru-space-mt)) !important; margin-bottom: var(--kazaru-local-mb, var(--kazaru-space-mb)) !important; }
.kazaru-text, .kazaru-heading { padding-block: var(--kazaru-local-py, var(--kazaru-space-py)); padding-inline: var(--kazaru-local-px, var(--kazaru-space-px)); }
.kazaru-box .kazaru-box__content, .kazaru-list-box .kazaru-list, .kazaru-list:not(.kazaru-list--with-title), .kazaru-list-editor .kazaru-list { padding-block: var(--kazaru-local-py, var(--kazaru-space-py)); padding-inline: var(--kazaru-local-px, var(--kazaru-space-px)); }
.kazaru-button-wrap .kazaru-button, .kazaru-bubble .kazaru-bubble__text { padding-block: var(--kazaru-local-py, var(--kazaru-space-py)); padding-inline: var(--kazaru-local-px, var(--kazaru-space-px)); }

.kazaru-has-icon::before, .kazaru-has-icon::after { color: var(--kazaru-icon-color, currentColor); font-size: var(--kazaru-icon-size, 20px); line-height: 1; vertical-align: -.08em; }
.kazaru-icon--before::before { content: attr(data-kazaru-icon); margin-right: .45em; }
.kazaru-icon--after::after { content: attr(data-kazaru-icon); margin-left: .45em; }
.kazaru-mobile-only { display: none !important; }

@media (max-width: 767px) {
	:where(.kazaru-text,.kazaru-box,.kazaru-heading,.kazaru-button-wrap,.kazaru-bubble,.kazaru-list:not(.kazaru-list--with-title),.kazaru-list-box) { margin-top: var(--kazaru-local-mobile-mt, var(--kazaru-mobile-mt)) !important; margin-bottom: var(--kazaru-local-mobile-mb, var(--kazaru-mobile-mb)) !important; }
	.kazaru-text, .kazaru-heading, .kazaru-box .kazaru-box__content, .kazaru-list-box .kazaru-list, .kazaru-list:not(.kazaru-list--with-title), .kazaru-list-editor .kazaru-list, .kazaru-button-wrap .kazaru-button, .kazaru-bubble .kazaru-bubble__text { padding-block: var(--kazaru-local-mobile-py, var(--kazaru-mobile-py)); padding-inline: var(--kazaru-local-mobile-px, var(--kazaru-mobile-px)); }
	.kazaru-desktop-only { display: none !important; }
	.kazaru-mobile-only { display: block !important; }
	.kazaru-bubble.kazaru-mobile-only { display: flex !important; }
}