/*
	Theme Name: Dayzy Harmony
	Author: Evolved Designs
	Version: 0.0.1.1
*/

@font-face {
    font-family: 'Birds of Paradise';
    src: url('fonts/birds_of_paradise__commercial_version-webfont.woff') format('woff'),
         url('fonts/birds_of_paradise__commercial_version-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: fallback;
	size-adjust: 100%;
	ascent-override: 90%;
	descent-override: 24%;
	line-gap-override: 0%;

}

/* Harmony launch pass: richer planning tools without changing the visual system. */
.harmony-glance-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 20px;
}

.harmony-glance-grid--three {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.harmony-glance-grid article {
	display: flex;
	min-width: 0;
	align-items: center;
	gap: 13px;
	padding: 17px 18px;
	border: 1px solid var(--harmony-suite-border);
	border-radius: 17px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 10px 28px rgba(41, 31, 72, 0.045);
}

.harmony-glance-grid strong {
	display: block;
	color: var(--harmony-suite-ink);
	font-size: clamp(22px, 3vw, 30px);
	line-height: 1;
}

.harmony-glance-grid p {
	margin: 5px 0 0;
	color: var(--harmony-suite-muted);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.35;
}

.harmony-glance-icon {
	display: grid;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	place-items: center;
	border-radius: 13px;
	background: var(--harmony-suite-accent-soft);
	color: var(--harmony-suite-accent);
}

.harmony-glance-icon.is-today {
	background: #fff0f7;
	color: #c6508d;
}

.harmony-glance-icon.is-week {
	background: #eef1ff;
	color: #6177d9;
}

.harmony-glance-icon.is-done {
	background: #edf8f1;
	color: #4d8b68;
}

.harmony-panel-intro {
	margin: 10px 0 0;
}

.harmony-tool-grid,
.harmony-module-layout {
	grid-template-columns: minmax(290px, 0.78fr) minmax(0, 1.32fr);
}

.harmony-item-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin: 8px 0 5px;
	color: var(--harmony-suite-muted);
	font-size: 12px;
	font-weight: 700;
}

.harmony-item-meta span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.harmony-item-meta i {
	color: var(--harmony-suite-accent);
	font-size: 11px;
}

.harmony-calendar-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 7px;
	margin: 0 0 16px;
}

.harmony-calendar-filters > span {
	margin-right: 3px;
	color: var(--harmony-suite-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.harmony-calendar-filters button {
	min-height: 32px;
	padding: 6px 10px;
	border: 1px solid var(--harmony-suite-border);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-suite-muted);
	font: inherit;
	font-size: 12px;
	font-weight: 800;
	cursor: pointer;
}

.harmony-calendar-filters button:hover,
.harmony-calendar-filters button:focus-visible,
.harmony-calendar-filters button.is-active {
	border-color: #cfc3ec;
	background: var(--harmony-suite-accent-soft);
	color: #4f329c;
}

[data-harmony-calendar-area][hidden] {
	display: none !important;
}

.harmony-progress-card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
	gap: 12px;
}

.harmony-progress-card {
	min-width: 0;
	padding: 18px;
	border: 1px solid #e8e1f2;
	border-radius: 17px;
	background:
		radial-gradient(circle at 100% 0%, rgba(247, 164, 200, 0.13), transparent 34%),
		#fcfbfe;
}

.harmony-progress-card__heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
}

.harmony-progress-card__heading span,
.harmony-family-plan-list article > div > span {
	color: var(--harmony-suite-pink);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.harmony-progress-card__heading h3 {
	margin: 5px 0 0;
	color: var(--harmony-suite-ink);
	font-size: 18px;
	line-height: 1.25;
}

.harmony-progress-card__heading > strong {
	color: var(--harmony-suite-accent);
	font-size: 18px;
	line-height: 1;
}

.harmony-progress-track {
	height: 9px;
	margin: 16px 0 10px;
	overflow: hidden;
	border-radius: 999px;
	background: #ebe7f2;
}

.harmony-progress-track i {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #8ea4ff, #a98cff 58%, #f18ab9);
}

.harmony-progress-card > p {
	margin: 8px 0 0;
	color: var(--harmony-suite-muted);
	font-size: 13px;
	line-height: 1.55;
}

.harmony-next-step {
	margin-top: 14px;
	padding: 12px 13px;
	border: 1px solid #ebe5f3;
	border-radius: 13px;
	background: #ffffff;
}

.harmony-next-step span {
	color: var(--harmony-suite-accent);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.harmony-next-step p {
	margin: 5px 0 0;
	color: var(--harmony-suite-ink);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
}

.harmony-progress-card .harmony-row-actions {
	margin-top: 14px;
}

.harmony-progress-card .harmony-row-actions button,
.harmony-progress-card .harmony-row-actions summary {
	min-height: 34px;
	padding: 7px 10px;
	border: 1px solid #dcd5ec;
	border-radius: 10px;
	background: #ffffff;
	color: #5c477e;
	font: inherit;
	font-size: 12px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-progress-card .harmony-row-actions button.is-danger {
	border-color: #f0d1db;
	color: #a43f60;
}

.harmony-inline-editor label {
	display: grid;
	gap: 5px;
	color: #554f65;
	font-size: 11px;
	font-weight: 900;
}

.harmony-inline-editor label > span {
	display: block;
}

.harmony-inline-editor output {
	color: var(--harmony-suite-accent);
	font-weight: 900;
}

.harmony-preserve-lines {
	white-space: pre-line;
}

.harmony-family-plan-list article {
	align-items: flex-start;
}

.harmony-gentle-carry .harmony-panel-heading > span {
	color: var(--harmony-suite-muted);
	font-size: 12px;
	font-weight: 800;
}

@media (max-width: 1040px) {
	.harmony-glance-grid,
	.harmony-glance-grid--three {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-tool-grid,
	.harmony-module-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 620px) {
	.harmony-glance-grid,
	.harmony-glance-grid--three {
		grid-template-columns: 1fr 1fr;
		gap: 9px;
	}

	.harmony-glance-grid article {
		align-items: flex-start;
		padding: 13px;
	}

	.harmony-glance-icon {
		flex-basis: 34px;
		width: 34px;
		height: 34px;
		border-radius: 11px;
	}

	.harmony-glance-grid strong {
		font-size: 22px;
	}

	.harmony-inline-tabs {
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		justify-content: flex-start;
		scrollbar-width: none;
	}

	.harmony-inline-tabs::-webkit-scrollbar {
		display: none;
	}

	.harmony-inline-tabs a {
		flex: 0 0 auto;
		white-space: nowrap;
	}

	.harmony-row-actions {
		flex-wrap: wrap;
	}

	.harmony-inline-editor form {
		right: auto;
		left: 0;
		width: min(82vw, 360px);
	}

	.harmony-progress-card-grid {
		grid-template-columns: 1fr;
	}
}
@font-face {
    font-family: 'Raleway';
    src: url('fonts/Raleway-VariableFont_wght.ttf') format('truetype');
    font-weight: 400 700; /* variable range */
    font-style: normal;
	font-display: fallback;
	size-adjust: 101%;
	ascent-override: 92%;
	descent-override: 24%;
	line-gap-override: 0%;
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
	font-display: fallback;
	size-adjust: 100%;
	ascent-override: 92%;
	descent-override: 24%;
	line-gap-override: 0%;
}
@font-face {
    font-family: 'Alex Brush';
    src: url('fonts/AlexBrush-Regular.ttf') format('truetype');
    font-weight: 400 700; /* variable range */
    font-style: normal;
	font-display: fallback;
	size-adjust: 100%;
	ascent-override: 90%;
	descent-override: 24%;
	line-gap-override: 0%;
}

@font-face {
	font-family: 'Poppins Fallback';
	src: local('Arial');
	size-adjust: 101%;
	ascent-override: 92%;
	descent-override: 24%;
	line-gap-override: 0%;
}

@font-face {
	font-family: 'Raleway Fallback';
	src: local('Arial');
	size-adjust: 99%;
	ascent-override: 92%;
	descent-override: 24%;
	line-gap-override: 0%;
}

@font-face {
	font-family: 'Moments Script Fallback';
	src: local('Georgia');
	size-adjust: 96%;
	ascent-override: 88%;
	descent-override: 24%;
	line-gap-override: 0%;
}

* {
	box-sizing: border-box;
}

html {
	line-height: 1.15;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	color: #172033;
	background: #ffffff;
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
}

a {
	color: inherit;
}

img {
	max-width: 100%;
	height: auto;
}

button,
input,
textarea,
select {
	font: inherit;
}

:root {
	--harmony-blue: #7f9cff;
	--harmony-blue-2: #f7a4c8;
	--harmony-purple: #a98cff;
	--harmony-pink: #f7a4c8;
	--harmony-rose: #ffe7f0;
	--harmony-lavender: #f1edff;
	--harmony-navy: #111827;
	--harmony-ink: #263244;
	--harmony-muted: #6b7280;
	--harmony-soft: #f4f0ff;
	--harmony-soft-2: #f7fbff;
	--harmony-paper: #ffffff;
	--harmony-teal: #87b99f;
	--harmony-mint: #f0f8f3;
	--harmony-line: rgba(23, 32, 51, 0.12);
	--harmony-shadow: 0 18px 44px rgba(127, 156, 255, 0.16);
}

.harmony-container {
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 24px;
}

.harmony-header {
	position: relative;
	top: 0;
	z-index: 60;
	border-bottom: 1px solid var(--harmony-line);
	background: rgba(255, 255, 255, 0.94);
	backdrop-filter: blur(16px);
}

.harmony-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 84px;
}

.harmony-header__panel {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 24px;
	flex: 1 1 auto;
}

.harmony-header__mobile-controls {
	display: none;
	align-items: center;
	gap: 10px;
}

.harmony-logo {
	display: inline-flex;
	align-items: baseline;
	gap: 7px;
	color: var(--harmony-navy);
	text-decoration: none;
	white-space: nowrap;
}

.harmony-logo__main {
	color: var(--harmony-purple);
	font-size: 38px;
	font-weight: 500;
	line-height: 1;
}

.harmony-logo__by {
	color: var(--harmony-muted);
	font-size: 13px;
	font-weight: 700;
}

.harmony-logo__dayzy {
	color: var(--harmony-navy);
	font-size: 18px;
	font-weight: 900;
}

.harmony-menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	position: relative;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid rgba(127, 156, 255, 0.28);
	border-radius: 12px;
	background: #ffffff;
	cursor: pointer;
}

.harmony-menu-toggle span {
	position: absolute;
	left: 50%;
	display: block;
	width: 20px;
	height: 2px;
	background: var(--harmony-blue);
	border-radius: 999px;
	transform: translateX(-50%);
	transition: top 0.24s ease, transform 0.24s ease, opacity 0.24s ease;
}

.harmony-menu-toggle span:nth-child(1) {
	top: 14px;
}

.harmony-menu-toggle span:nth-child(2) {
	top: 22px;
}

.harmony-menu-toggle span:nth-child(3) {
	top: 30px;
}

.harmony-menu-toggle.is-active {
	border-color: var(--harmony-blue);
	background: var(--harmony-soft);
	box-shadow: 0 10px 24px rgba(127, 156, 255, 0.16);
}

.harmony-menu-toggle.is-active span:nth-child(1) {
	top: 22px;
	transform: translateX(-50%) rotate(45deg);
}

.harmony-menu-toggle.is-active span:nth-child(2) {
	opacity: 0;
}

.harmony-menu-toggle.is-active span:nth-child(3) {
	top: 22px;
	transform: translateX(-50%) rotate(-45deg);
}

.harmony-menu {
	display: flex;
	align-items: center;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.harmony-menu a {
	color: var(--harmony-ink);
	font-size: 15px;
	font-weight: 850;
	text-decoration: none;
}

.harmony-menu a:hover,
.harmony-menu a:focus {
	color: var(--harmony-blue);
}

.harmony-header__actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

.harmony-button,
.harmony-header__cta,
.harmony-signin-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid var(--harmony-blue);
	border-radius: 999px;
	font-size: 14px;
	font-weight: 900;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.harmony-button--primary,
.harmony-header__cta {
	background: linear-gradient(135deg, var(--harmony-blue), var(--harmony-blue-2));
	color: #ffffff;
	box-shadow: 0 14px 30px rgba(127, 156, 255, 0.24);
}

.harmony-button--primary:hover,
.harmony-button--primary:focus,
.harmony-header__cta:hover,
.harmony-header__cta:focus {
	transform: translateY(-1px);
	box-shadow: 0 18px 38px rgba(247, 164, 200, 0.28);
}

.harmony-button--secondary,
.harmony-signin-button {
	background: #ffffff;
	color: var(--harmony-blue);
	box-shadow: none;
}

.harmony-button--secondary:hover,
.harmony-button--secondary:focus,
.harmony-signin-button:hover,
.harmony-signin-button:focus {
	background: var(--harmony-soft);
}

.harmony-button--danger {
	border-color: rgba(220, 38, 38, 0.28);
	background: #fff1f1;
	color: #b42318;
	box-shadow: none;
}

.harmony-account-menu {
	position: relative;
}

.harmony-account-menu summary {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(127, 156, 255, 0.26);
	border-radius: 50%;
	background: var(--harmony-soft);
	color: var(--harmony-navy);
	cursor: pointer;
	list-style: none;
	box-shadow: 0 12px 26px rgba(23, 32, 51, 0.1);
}

.harmony-account-menu summary::-webkit-details-marker {
	display: none;
}

.harmony-account-menu summary span {
	font-size: 14px;
	font-weight: 900;
}

.harmony-account-menu__dropdown {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	z-index: 90;
	min-width: 230px;
	padding: 12px;
	border: 1px solid var(--harmony-line);
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 22px 50px rgba(23, 32, 51, 0.16);
}

.harmony-account-menu__dropdown strong,
.harmony-account-menu__dropdown a {
	display: block;
}

.harmony-account-menu__dropdown strong {
	padding: 8px 10px 12px;
	color: var(--harmony-navy);
	font-size: 14px;
}

.harmony-account-menu__dropdown a {
	padding: 10px;
	border-radius: 10px;
	color: var(--harmony-ink);
	font-size: 14px;
	font-weight: 800;
	text-decoration: none;
}

.harmony-account-menu__dropdown a:hover,
.harmony-account-menu__dropdown a:focus {
	background: var(--harmony-soft);
	color: var(--harmony-blue);
}

.harmony-page {
	overflow: hidden;
}

.harmony-home-hero {
	padding: 86px 0 72px;
	background:
		radial-gradient(circle at 86% 12%, rgba(247, 164, 200, 0.32), transparent 34%),
		radial-gradient(circle at 10% 92%, rgba(127, 156, 255, 0.24), transparent 40%),
		linear-gradient(180deg, #ffffff 0%, #fbf7ff 100%);
	color: var(--harmony-navy);
}

.harmony-home-hero__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.72fr) minmax(560px, 1fr);
	align-items: center;
	gap: 46px;
}

.harmony-home-copy h1 {
	margin: 0;
	color: #050505;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 64px;
	line-height: 1;
	font-weight: 900;
}

.harmony-home-copy p {
	margin: 20px 0 0;
	color: var(--harmony-ink);
	font-size: 18px;
	line-height: 1.7;
}

.harmony-home-copy .harmony-eyebrow {
	color: var(--harmony-blue);
}

.harmony-highlight {
	display: inline;
	padding: 0 12px 2px;
	border-radius: 999px;
	background: #ffe7f0;
	color: #050505;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.harmony-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.harmony-home-hero .harmony-button--secondary {
	border-color: rgba(127, 156, 255, 0.24);
	background: #ffffff;
	color: var(--harmony-blue);
}

.harmony-home-hero .harmony-proof-row span {
	border-color: rgba(127, 156, 255, 0.16);
	background: #ffffff;
	color: var(--harmony-navy);
	box-shadow: 0 14px 34px rgba(16, 36, 60, 0.1);
}

.harmony-family-preview {
	position: relative;
	display: grid;
	grid-template-columns: minmax(220px, 0.72fr) minmax(240px, 0.82fr);
	gap: 18px;
	align-items: center;
}

.harmony-phone {
	border: 1px solid rgba(1, 118, 211, 0.1);
	border-radius: 36px;
	background: #ffffff;
	box-shadow: 0 26px 70px rgba(23, 32, 51, 0.14);
	color: var(--harmony-navy);
}

.harmony-phone--family {
	min-height: 520px;
	padding: 26px;
}

.harmony-phone--day {
	min-height: 560px;
	padding: 26px;
}

.harmony-phone--month {
	grid-column: 1 / -1;
	width: min(100%, 620px);
	margin: -18px auto 0;
	padding: 22px;
}

.harmony-phone-status {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	color: rgba(23, 32, 51, 0.48);
	font-size: 13px;
	font-weight: 800;
}

.harmony-circle-banner {
	display: grid;
	place-items: center;
	min-height: 112px;
	margin: 28px 0 24px;
	border-radius: 26px;
	background: #d7f3d9;
	font-size: 48px;
}

.harmony-phone label {
	display: block;
	color: var(--harmony-muted);
	font-size: 13px;
	font-weight: 900;
}

.harmony-phone--family > strong {
	display: block;
	margin: 9px 0 24px;
	padding: 14px 18px;
	border: 1px solid var(--harmony-line);
	border-radius: 999px;
	color: #050505;
	font-size: 28px;
	font-weight: 500;
}

.harmony-member-list {
	display: grid;
	gap: 12px;
	padding-top: 18px;
	border-top: 1px solid var(--harmony-line);
}

.harmony-member-list div,
.harmony-invite-row {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--harmony-ink);
	font-size: 20px;
}

.harmony-member-list span,
.harmony-invite-row b {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border: 3px solid #7f63dd;
	border-radius: 50%;
	background: #e9e4ff;
	color: #4d35a6;
	font-size: 15px;
	font-weight: 900;
}

.harmony-invite-row {
	margin-top: 18px;
	color: #6f86a6;
}

.harmony-invite-row b {
	border-color: #d9dff8;
	background: #ffffff;
	color: #7e8baa;
	font-size: 28px;
	line-height: 1;
}

.harmony-day-tabs {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 28px;
	margin: 24px 0;
}

.harmony-day-tabs span {
	width: 28px;
	height: 24px;
	border-radius: 7px;
	border: 2px solid #b7c3cf;
}

.harmony-day-tabs b {
	padding: 13px 28px;
	border-radius: 12px;
	background: #dcebff;
	color: #315b86;
	font-size: 20px;
}

.harmony-day-agenda {
	display: grid;
	gap: 10px;
}

.harmony-day-agenda div,
.harmony-day-card > div:not(.harmony-day-card__top) {
	position: relative;
	display: grid;
	grid-template-columns: 70px 1fr;
	gap: 10px;
	min-height: 78px;
	padding: 14px;
	border-radius: 16px;
	color: #172033;
}

.harmony-day-agenda time,
.harmony-day-card time {
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
}

.harmony-day-agenda strong,
.harmony-day-card strong {
	display: block;
	color: #111111;
	font-size: 21px;
}

.harmony-day-agenda span,
.harmony-day-card span {
	display: block;
	color: rgba(23, 32, 51, 0.58);
	font-size: 12px;
	font-weight: 900;
}

.is-pink {
	background: #ffe5ef;
}

.is-green {
	background: #edf8f1;
}

.is-yellow {
	background: #fff4bc;
}

.is-purple {
	background: #ddd9ff;
}

.is-blue {
	background: #dcebff;
}

.is-lavender {
	background: #f1edff;
}

.is-rose {
	background: #ffe7f0;
}

.is-softgreen {
	background: #f0f8f3;
}

.harmony-mini-month {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	overflow: hidden;
	border: 1px solid #d9e1e9;
	border-radius: 18px;
}

.harmony-mini-month div {
	min-height: 70px;
	padding: 8px;
	border-right: 1px solid #d9e1e9;
	border-bottom: 1px solid #d9e1e9;
	background: #ffffff;
}

.harmony-mini-month span {
	display: block;
	color: #1f2937;
	font-size: 18px;
}

.harmony-mini-month b {
	display: block;
	margin-top: 5px;
	padding: 3px 5px;
	overflow: hidden;
	border-radius: 5px;
	background: #dcebff;
	color: #385575;
	font-size: 10px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.harmony-mini-month .has-note:nth-child(3n) b {
	background: #ffe5ef;
}

.harmony-mini-month .has-note:nth-child(4n) b {
	background: #dff4d8;
}

.harmony-app-preview {
	display: grid;
	grid-template-columns: minmax(170px, 0.52fr) minmax(260px, 0.9fr) minmax(160px, 0.5fr);
	min-height: 570px;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 30px;
	background: rgba(255, 255, 255, 0.12);
	box-shadow: 0 28px 80px rgba(7, 22, 40, 0.32);
	backdrop-filter: blur(16px);
}

.harmony-preview-sidebar,
.harmony-preview-hub {
	padding: 18px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--harmony-navy);
}

.harmony-preview-profile,
.harmony-preview-thread,
.harmony-preview-top,
.harmony-preview-compose {
	display: flex;
	align-items: center;
	gap: 12px;
}

.harmony-preview-profile {
	margin-bottom: 18px;
}

.harmony-preview-profile span,
.harmony-preview-thread b,
.harmony-preview-call-grid span {
	display: grid;
	place-items: center;
	flex: 0 0 42px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--harmony-blue);
	color: #ffffff;
	font-weight: 900;
}

.harmony-preview-profile strong,
.harmony-preview-thread strong,
.harmony-preview-top strong,
.harmony-preview-hub strong {
	display: block;
	color: var(--harmony-navy);
	font-size: 14px;
}

.harmony-preview-profile small,
.harmony-preview-thread small,
.harmony-preview-top small,
.harmony-preview-hub small {
	display: block;
	margin-top: 4px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 800;
}

.harmony-preview-thread {
	margin-top: 10px;
	padding: 12px;
	border-radius: 18px;
	background: #ffffff;
	box-shadow: 0 10px 26px rgba(23, 32, 51, 0.08);
}

.harmony-preview-thread.is-active {
	background: var(--harmony-soft);
}

.harmony-preview-chat {
	display: flex;
	flex-direction: column;
	padding: 18px;
	background:
		radial-gradient(circle at 100% 0%, rgba(137, 216, 255, 0.22), transparent 30%),
		#f8fcff;
	color: var(--harmony-navy);
}

.harmony-preview-top {
	justify-content: space-between;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--harmony-line);
}

.harmony-preview-actions {
	display: flex;
	gap: 7px;
}

.harmony-preview-actions span {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--harmony-soft);
}

.harmony-preview-call {
	margin: 18px 0;
	padding: 16px;
	border-radius: 22px;
	background: linear-gradient(135deg, #10243c, #0176d3);
	color: #ffffff;
}

.harmony-preview-call-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
}

.harmony-preview-call-grid span {
	width: 100%;
	height: 70px;
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.16);
}

.harmony-preview-call p {
	margin: 12px 0 0;
	color: rgba(255, 255, 255, 0.84);
	font-weight: 900;
}

.harmony-preview-bubble {
	max-width: 82%;
	margin: 8px 0;
	padding: 13px 14px;
	border-radius: 18px 18px 18px 5px;
	background: #ffffff;
	color: var(--harmony-ink);
	box-shadow: 0 10px 22px rgba(23, 32, 51, 0.08);
	line-height: 1.5;
}

.harmony-preview-bubble.is-own {
	align-self: flex-end;
	border-radius: 18px 18px 5px 18px;
	background: var(--harmony-mint);
}

.harmony-preview-compose {
	justify-content: space-between;
	margin-top: auto;
	padding: 12px 14px;
	border: 1px solid var(--harmony-line);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-muted);
	font-weight: 800;
}

.harmony-preview-compose b {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--harmony-blue);
	color: #ffffff;
}

.harmony-preview-hub h2 {
	margin: 0 0 14px;
	color: var(--harmony-navy);
	font-size: 26px;
}

.harmony-preview-hub div {
	margin-top: 12px;
	padding: 13px;
	border: 1px solid var(--harmony-line);
	border-radius: 18px;
	background: #ffffff;
}

.harmony-preview-hub span {
	display: block;
	margin-bottom: 8px;
	color: var(--harmony-blue);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 11px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-preview-topline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	color: var(--harmony-muted);
	font-size: 13px;
	font-weight: 900;
}

.harmony-preview-topline strong {
	color: var(--harmony-navy);
	font-size: 18px;
}

.harmony-problem-solution {
	background: #ffffff;
}

.harmony-smart-section,
.harmony-categories-section {
	background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
}

.harmony-smart-flow {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.harmony-smart-flow div {
	padding: 18px;
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 22px;
	background: #ffffff;
	box-shadow: 0 12px 30px rgba(23, 32, 51, 0.06);
}

.harmony-smart-flow span {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin-bottom: 12px;
	border-radius: 50%;
	background: var(--harmony-soft);
	color: var(--harmony-blue);
	font-weight: 900;
}

.harmony-smart-flow strong {
	display: block;
	color: var(--harmony-navy);
	font-size: 18px;
}

.harmony-smart-flow p {
	margin: 8px 0 0;
	color: var(--harmony-muted);
	line-height: 1.55;
}

.harmony-simple-hero {
	padding: 92px 0 72px;
	background:
		radial-gradient(circle at 12% 14%, rgba(247, 164, 200, 0.24), transparent 32%),
		radial-gradient(circle at 86% 24%, rgba(127, 156, 255, 0.22), transparent 34%),
		linear-gradient(180deg, #ffffff 0%, #fbf7ff 100%);
}

.harmony-simple-hero .harmony-container {
	max-width: 900px;
}

.harmony-simple-hero h1 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 58px;
	line-height: 1;
}

.harmony-simple-hero p {
	margin: 18px 0 0;
	color: var(--harmony-ink);
	font-size: 18px;
	line-height: 1.7;
}

.harmony-eyebrow {
	margin: 0 0 14px;
	color: var(--harmony-blue);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.harmony-signup-hero {
	padding: 84px 0 96px;
	background:
		radial-gradient(circle at 8% 8%, rgba(0, 161, 224, 0.16), transparent 30%),
		linear-gradient(180deg, #ffffff 0%, var(--harmony-soft-2) 100%);
}

.harmony-signup-grid,
.harmony-dashboard-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 0.92fr) minmax(360px, 0.72fr);
	align-items: start;
	gap: 54px;
}

.harmony-signup-copy {
	padding-top: 36px;
}

.harmony-signup-copy h1,
.harmony-dashboard-hero h1 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 60px;
	line-height: 1.02;
	font-weight: 900;
}

.harmony-signup-copy p,
.harmony-dashboard-hero p,
.harmony-section-heading p {
	margin: 18px 0 0;
	color: var(--harmony-muted);
	font-size: 18px;
	line-height: 1.7;
}

.harmony-proof-row {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 28px;
}

.harmony-proof-row span {
	padding: 11px 14px;
	border: 1px solid rgba(1, 118, 211, 0.2);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-navy);
	font-size: 14px;
	font-weight: 900;
	box-shadow: 0 10px 24px rgba(23, 32, 51, 0.08);
}

.harmony-signup-card,
.harmony-dashboard-plan-card,
.harmony-dashboard-subscription,
.harmony-dashboard-card,
.harmony-next-panel,
.harmony-card,
.harmony-subscription-current,
.harmony-pricing-card {
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: #ffffff;
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.08);
}

.harmony-signup-card {
	padding: 28px;
}

.harmony-signup-card__top span,
.harmony-dashboard-plan-card span,
.harmony-dashboard-subscription__meta span,
.harmony-dashboard-card span,
.harmony-card span,
.harmony-subscription-current__meta span,
.harmony-pricing-card > span,
.harmony-billing-grid span {
	display: block;
	color: var(--harmony-blue);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-signup-card__top h2 {
	margin: 8px 0 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 32px;
	line-height: 1.08;
}

.harmony-signup-card__top p,
.harmony-signin-note {
	margin: 10px 0 0;
	color: var(--harmony-muted);
	line-height: 1.55;
}

.harmony-form,
.harmony-auth-form.is-active {
	display: grid;
	gap: 16px;
}

.harmony-form {
	margin-top: 22px;
}

.harmony-form label,
.harmony-auth-form label {
	display: grid;
	gap: 8px;
	color: var(--harmony-navy);
	font-size: 13px;
	font-weight: 900;
}

.harmony-form input,
.harmony-auth-form input {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--harmony-line);
	border-radius: 12px;
	background: #ffffff;
	color: var(--harmony-navy);
	outline: none;
}

.harmony-form input:focus,
.harmony-auth-form input:focus {
	border-color: var(--harmony-blue);
	box-shadow: 0 0 0 4px rgba(1, 118, 211, 0.12);
}

.harmony-field-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.harmony-auth-check {
	display: flex !important;
	flex-direction: row;
	align-items: flex-start;
	gap: 10px !important;
	color: var(--harmony-muted) !important;
	font-weight: 700 !important;
	line-height: 1.5;
}

.harmony-auth-check input {
	width: 18px;
	min-height: 18px;
	margin-top: 2px;
}

.harmony-auth-check a,
.harmony-signin-note button,
.harmony-auth-form a,
.harmony-auth-form p button {
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--harmony-blue);
	cursor: pointer;
	font-weight: 900;
	text-decoration: none;
}

.harmony-form-message {
	margin: 18px 0;
	padding: 13px 14px;
	border: 1px solid rgba(1, 118, 211, 0.24);
	border-radius: 12px;
	background: var(--harmony-soft);
	color: var(--harmony-navy);
	font-weight: 800;
	line-height: 1.5;
}

.harmony-form-message--success {
	border-color: rgba(15, 118, 110, 0.22);
	background: var(--harmony-mint);
	color: var(--harmony-teal);
}

.harmony-content-section,
.harmony-dashboard-content {
	padding: 72px 0;
	background: #ffffff;
}

.harmony-section-heading {
	max-width: 760px;
	margin: 0 auto 34px;
	text-align: center;
}

.harmony-section-heading h2,
.harmony-dashboard-subscription h2,
.harmony-next-panel h2,
.harmony-subscription-current h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 40px;
	line-height: 1.08;
}

.harmony-card-grid,
.harmony-dashboard-grid,
.harmony-pricing-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.harmony-card-grid--four {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.harmony-card,
.harmony-dashboard-card {
	padding: 24px;
}

.harmony-card h3,
.harmony-dashboard-card strong {
	display: block;
	margin: 14px 0 0;
	color: var(--harmony-navy);
	font-size: 24px;
	line-height: 1.12;
}

.harmony-card p,
.harmony-dashboard-card p,
.harmony-next-panel p,
.harmony-subscription-current p,
.harmony-pricing-card p,
.harmony-pricing-card li {
	color: var(--harmony-muted);
	line-height: 1.65;
}

.harmony-dashboard-hero {
	padding: 74px 0;
	background:
		radial-gradient(circle at 88% 12%, rgba(0, 161, 224, 0.22), transparent 30%),
		linear-gradient(135deg, #10243c 0%, #0176d3 56%, #00a1e0 100%);
	color: #ffffff;
}

.harmony-product-hero {
	background:
		radial-gradient(circle at 88% 12%, rgba(0, 161, 224, 0.22), transparent 30%),
		linear-gradient(135deg, #10243c 0%, #0176d3 56%, #00a1e0 100%);
}

.harmony-dashboard-hero h1,
.harmony-dashboard-hero p,
.harmony-dashboard-hero .harmony-eyebrow {
	color: #ffffff;
}

.harmony-dashboard-hero p {
	max-width: 690px;
	color: rgba(255, 255, 255, 0.82);
}

.harmony-dashboard-plan-card {
	min-height: 150px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
}

.harmony-dashboard-plan-card strong {
	color: var(--harmony-navy);
	font-size: 28px;
	line-height: 1.05;
}

.harmony-dashboard-plan-card em {
	width: fit-content;
	padding: 7px 10px;
	border-radius: 999px;
	background: var(--harmony-mint);
	color: var(--harmony-teal);
	font-size: 12px;
	font-style: normal;
	font-weight: 900;
}

.harmony-dashboard-subscription {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 0.64fr) auto;
	align-items: center;
	gap: 22px;
	margin-bottom: 28px;
	padding: 26px;
}

.harmony-dashboard-subscription p {
	margin: 12px 0 0;
	color: var(--harmony-muted);
	line-height: 1.6;
}

.harmony-dashboard-subscription__meta,
.harmony-subscription-current__meta,
.harmony-billing-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
}

.harmony-dashboard-subscription__meta div,
.harmony-subscription-current__meta div,
.harmony-billing-grid div {
	padding: 14px;
	border: 1px solid var(--harmony-line);
	border-radius: 14px;
	background: var(--harmony-soft-2);
}

.harmony-dashboard-subscription__meta strong,
.harmony-subscription-current__meta strong,
.harmony-billing-grid strong {
	display: block;
	margin-top: 8px;
	color: var(--harmony-navy);
	font-size: 15px;
	line-height: 1.4;
}

.harmony-dashboard-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.harmony-dashboard-card {
	min-height: 210px;
}

.harmony-next-panel {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 28px;
	padding: 28px;
	background:
		radial-gradient(circle at 100% 100%, rgba(0, 161, 224, 0.18), transparent 42%),
		#ffffff;
}

.harmony-feature-band {
	background: linear-gradient(180deg, #ffffff 0%, var(--harmony-soft-2) 100%);
}

.harmony-split-section {
	background: #ffffff;
}

.harmony-split {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(420px, 1fr);
	align-items: center;
	gap: 42px;
}

.harmony-split h2,
.harmony-launch-panel h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 44px;
	line-height: 1.05;
}

.harmony-split p,
.harmony-launch-panel p {
	color: var(--harmony-muted);
	font-size: 17px;
	line-height: 1.7;
}

.harmony-use-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.harmony-use-grid div {
	min-height: 140px;
	padding: 20px;
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: var(--harmony-soft-2);
}

.harmony-use-grid strong,
.harmony-use-grid span {
	display: block;
}

.harmony-use-grid strong {
	color: var(--harmony-navy);
	font-size: 20px;
}

.harmony-use-grid span {
	margin-top: 10px;
	color: var(--harmony-muted);
	line-height: 1.55;
}

.harmony-launch-section {
	padding: 74px 0;
	background: var(--harmony-soft-2);
}

.harmony-launch-panel {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 34px;
	border: 1px solid rgba(1, 118, 211, 0.16);
	border-radius: 28px;
	background: #ffffff;
	box-shadow: var(--harmony-shadow);
}

.harmony-app-shell {
	display: grid;
	grid-template-columns: minmax(250px, 0.58fr) minmax(420px, 1fr) minmax(300px, 0.64fr);
	gap: 18px;
	align-items: start;
}

.harmony-circle-rail,
.harmony-conversation-panel,
.harmony-right-rail > section,
.harmony-detail-hub {
	border: 1px solid var(--harmony-line);
	border-radius: 28px;
	background: #ffffff;
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.08);
}

.harmony-circle-rail,
.harmony-conversation-panel,
.harmony-right-rail > section,
.harmony-detail-hub {
	padding: 22px;
}

.harmony-rail-top h2,
.harmony-conversation-header h2,
.harmony-panel-heading h2,
.harmony-video-card h2,
.harmony-detail-copy h2 {
	margin: 0;
	color: var(--harmony-navy);
	line-height: 1.08;
}

.harmony-circle-list,
.harmony-chat-thread,
.harmony-reminder-list,
.harmony-detail-grid {
	display: grid;
	gap: 12px;
}

.harmony-circle-list {
	margin: 18px 0;
}

.harmony-circle-chip {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	border: 1px solid var(--harmony-line);
	border-radius: 20px;
	background: #ffffff;
}

.harmony-circle-chip.is-active {
	border-color: rgba(1, 118, 211, 0.26);
	background: var(--harmony-soft);
}

.harmony-circle-chip > span {
	display: grid;
	place-items: center;
	flex: 0 0 46px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--circle-color, var(--harmony-blue));
	color: #ffffff;
	font-weight: 900;
}

.harmony-circle-chip strong,
.harmony-circle-chip small {
	display: block;
}

.harmony-circle-chip strong {
	color: var(--harmony-navy);
}

.harmony-circle-chip small {
	margin-top: 4px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.35;
}

.harmony-mini-form,
.harmony-compose,
.harmony-detail-form {
	display: grid;
	gap: 12px;
}

.harmony-mini-form label,
.harmony-compose label,
.harmony-detail-form label {
	display: grid;
	gap: 7px;
	color: var(--harmony-navy);
	font-size: 12px;
	font-weight: 900;
}

.harmony-mini-form input,
.harmony-mini-form textarea,
.harmony-mini-form select,
.harmony-compose input,
.harmony-compose textarea,
.harmony-compose select,
.harmony-detail-form input,
.harmony-detail-form textarea,
.harmony-detail-form select,
.harmony-form select {
	width: 100%;
	min-height: 44px;
	padding: 10px 12px;
	border: 1px solid var(--harmony-line);
	border-radius: 12px;
	background: #ffffff;
	color: var(--harmony-navy);
	outline: none;
}

.harmony-mini-form textarea,
.harmony-compose textarea,
.harmony-detail-form textarea {
	resize: vertical;
}

.harmony-conversation-panel {
	min-height: 720px;
	display: flex;
	flex-direction: column;
	background:
		radial-gradient(circle at 100% 0%, rgba(0, 161, 224, 0.12), transparent 30%),
		var(--harmony-soft-2);
}

.harmony-conversation-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--harmony-line);
}

.harmony-conversation-header p {
	margin: 8px 0 0;
	color: var(--harmony-muted);
	line-height: 1.55;
}

.harmony-call-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.harmony-call-actions button {
	min-height: 36px;
	padding: 0 12px;
	border: 1px solid rgba(1, 118, 211, 0.2);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-blue);
	cursor: pointer;
	font-size: 12px;
	font-weight: 900;
}

.harmony-chat-thread {
	flex: 1;
	align-content: start;
	padding: 18px 0;
}

.harmony-message {
	width: min(86%, 560px);
	padding: 16px;
	border-radius: 22px 22px 22px 6px;
	background: #ffffff;
	box-shadow: 0 12px 26px rgba(23, 32, 51, 0.08);
}

.harmony-message.is-own {
	justify-self: end;
	border-radius: 22px 22px 6px 22px;
	background: var(--harmony-mint);
}

.harmony-message span,
.harmony-detail-grid span {
	display: block;
	color: var(--harmony-blue);
	font-size: 11px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-message h3,
.harmony-detail-grid h3 {
	margin: 8px 0 0;
	color: var(--harmony-navy);
	font-size: 18px;
	line-height: 1.18;
}

.harmony-message p,
.harmony-detail-grid p {
	margin: 9px 0 0;
	color: var(--harmony-ink);
	line-height: 1.55;
}

.harmony-message small {
	display: block;
	margin-top: 10px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 800;
}

.harmony-compose {
	margin-top: auto;
	padding: 16px;
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: #ffffff;
}

.harmony-right-rail {
	display: grid;
	gap: 18px;
}

.harmony-video-card {
	background:
		radial-gradient(circle at 100% 0%, rgba(0, 161, 224, 0.18), transparent 34%),
		#ffffff;
}

.harmony-video-card h2 {
	font-size: 26px;
}

.harmony-video-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 18px 0;
}

.harmony-video-grid span {
	display: grid;
	place-items: center;
	min-height: 86px;
	border-radius: 20px;
	background: linear-gradient(135deg, #10243c, #0176d3);
	color: #ffffff;
	font-size: 22px;
	font-weight: 900;
}

.harmony-reminder-list div {
	display: grid;
	grid-template-columns: 56px 1fr;
	gap: 10px;
	padding: 13px;
	border: 1px solid var(--harmony-line);
	border-radius: 18px;
	background: var(--harmony-soft-2);
}

.harmony-reminder-list time {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: 16px;
	background: #ffffff;
	color: var(--harmony-blue);
	font-size: 12px;
	font-weight: 900;
	text-align: center;
}

.harmony-reminder-list strong,
.harmony-reminder-list span {
	display: block;
}

.harmony-reminder-list strong {
	color: var(--harmony-navy);
}

.harmony-reminder-list span {
	margin-top: 5px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 800;
}

.harmony-reminder-card .harmony-mini-form {
	margin-top: 18px;
}

.harmony-calendar-board {
	display: grid;
	grid-template-columns: minmax(240px, 0.52fr) minmax(420px, 0.98fr) minmax(280px, 0.58fr);
	gap: 18px;
	align-items: stretch;
	margin: 28px 0;
}

.harmony-calendar-copy,
.harmony-month-card,
.harmony-day-card {
	border: 1px solid var(--harmony-line);
	border-radius: 28px;
	background: #ffffff;
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.08);
}

.harmony-calendar-copy {
	padding: 26px;
	background:
		radial-gradient(circle at 0% 0%, rgba(203, 244, 240, 0.72), transparent 44%),
		#ffffff;
}

.harmony-calendar-copy h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 34px;
	line-height: 1.08;
}

.harmony-calendar-copy p {
	color: var(--harmony-muted);
	line-height: 1.65;
}

.harmony-month-card {
	padding: 22px;
}

.harmony-month-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

.harmony-month-top strong {
	color: var(--harmony-navy);
	font-size: 30px;
}

.harmony-month-top button {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--harmony-line);
	border-radius: 50%;
	background: #ffffff;
	color: var(--harmony-muted);
	cursor: pointer;
	font-size: 26px;
}

.harmony-month-days,
.harmony-month-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
}

.harmony-month-days span {
	padding: 0 6px 8px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
	text-align: center;
}

.harmony-month-grid {
	overflow: hidden;
	border: 1px solid #d9e1e9;
	border-radius: 18px;
}

.harmony-month-grid div {
	min-height: 88px;
	padding: 8px;
	border-right: 1px solid #d9e1e9;
	border-bottom: 1px solid #d9e1e9;
	background: #ffffff;
}

.harmony-month-grid span {
	display: block;
	color: #1f2937;
	font-size: 18px;
}

.harmony-month-grid b {
	display: block;
	margin-top: 6px;
	padding: 4px 5px;
	overflow: hidden;
	border-radius: 6px;
	background: #dcebff;
	color: #385575;
	font-size: 10px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.harmony-month-grid .has-note:nth-child(3n) b {
	background: #ffe5ef;
}

.harmony-month-grid .has-note:nth-child(4n) b {
	background: #dff4d8;
}

.harmony-day-card {
	display: grid;
	gap: 12px;
	padding: 22px;
}

.harmony-day-card__top {
	display: block !important;
	min-height: 0 !important;
	padding: 0 0 8px !important;
	background: transparent !important;
}

.harmony-day-card__top span {
	display: block;
	color: var(--harmony-blue);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-day-card__top strong {
	display: block;
	margin-top: 6px;
	color: var(--harmony-navy);
	font-size: 28px;
	line-height: 1.08;
}

.harmony-detail-hub {
	display: grid;
	grid-template-columns: minmax(0, 0.74fr) minmax(360px, 1fr) minmax(280px, 0.72fr);
	gap: 20px;
	align-items: start;
	margin: 28px 0;
}

.harmony-detail-copy p {
	color: var(--harmony-muted);
	line-height: 1.7;
}

.harmony-detail-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.harmony-detail-grid article {
	padding: 17px;
	border: 1px solid var(--harmony-line);
	border-radius: 20px;
	background: var(--harmony-soft-2);
}

.harmony-detail-form {
	padding: 18px;
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: #ffffff;
}

.harmony-subscription-notice {
	margin-bottom: 18px;
	padding: 14px 16px;
	border: 1px solid rgba(1, 118, 211, 0.24);
	border-radius: 12px;
	background: var(--harmony-soft);
	color: var(--harmony-navy);
	font-weight: 800;
	line-height: 1.5;
}

.harmony-subscription-notice--success {
	border-color: rgba(15, 118, 110, 0.22);
	background: var(--harmony-mint);
	color: var(--harmony-teal);
}

.harmony-subscription-notice--warning {
	border-color: rgba(1, 118, 211, 0.28);
	background: #eef8ff;
}

.harmony-subscription-notice--error {
	border-color: rgba(220, 38, 38, 0.26);
	background: #fff1f1;
	color: #b42318;
}

.harmony-subscription-current {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 0.62fr);
	align-items: center;
	gap: 24px;
	margin-bottom: 30px;
	padding: 26px;
}

.harmony-subscription-badges,
.harmony-subscription-actions,
.harmony-pricing-card__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 18px;
}

.harmony-subscription-badges span {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 8px 11px;
	border: 1px solid var(--harmony-line);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
}

.harmony-subscription-badges span.is-active {
	border-color: rgba(15, 118, 110, 0.22);
	background: var(--harmony-mint);
	color: var(--harmony-teal);
}

.harmony-subscription-badges span.is-paused {
	border-color: rgba(220, 38, 38, 0.22);
	background: #fff1f1;
	color: #b42318;
}

.harmony-subscription-actions {
	grid-column: 1 / -1;
	margin-top: 0;
}

.harmony-pricing-grid {
	margin-top: 18px;
}

.harmony-pricing-card {
	position: relative;
	display: flex;
	min-height: 510px;
	flex-direction: column;
	padding: 26px;
}

.harmony-pricing-card.is-featured {
	border-color: rgba(1, 118, 211, 0.44);
	box-shadow: 0 24px 58px rgba(1, 118, 211, 0.18);
	transform: translateY(-8px);
}

.harmony-pricing-card.is-selected {
	outline: 3px solid rgba(1, 118, 211, 0.14);
}

.harmony-pricing-card.is-current::after {
	content: "Current";
	position: absolute;
	top: 16px;
	right: 16px;
	padding: 7px 10px;
	border-radius: 999px;
	background: var(--harmony-mint);
	color: var(--harmony-teal);
	font-size: 11px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-pricing-card h3 {
	margin: 10px 0 0;
	color: var(--harmony-navy);
	font-size: 30px;
	line-height: 1.08;
}

.harmony-pricing-card > strong {
	display: block;
	margin-top: 18px;
	color: var(--harmony-navy);
	font-size: 42px;
	line-height: 1;
}

.harmony-pricing-card small {
	color: var(--harmony-muted);
	font-size: 14px;
	font-weight: 800;
}

.harmony-pricing-card ul {
	display: grid;
	gap: 10px;
	margin: 18px 0 24px;
	padding: 0;
	list-style: none;
}

.harmony-pricing-card li {
	position: relative;
	padding-left: 24px;
}

.harmony-pricing-card li::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--harmony-blue), var(--harmony-blue-2));
}

.harmony-pricing-card__actions {
	margin-top: auto;
}

.harmony-pricing-card__actions form,
.harmony-pricing-card__actions .harmony-button {
	width: 100%;
}

.harmony-subscription-billing {
	margin-top: 30px;
}

.harmony-billing-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.harmony-footer {
	padding: 58px 0 26px;
	background: var(--harmony-navy);
	color: #ffffff;
}

.harmony-footer .harmony-logo__dayzy {
	color: #ffffff;
}

.harmony-footer__grid {
	display: grid;
	grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.4fr);
	gap: 48px;
}

.harmony-footer__brand p {
	max-width: 420px;
	color: rgba(255, 255, 255, 0.72);
	line-height: 1.65;
}

.harmony-footer__nav {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
}

.harmony-footer__nav h2 {
	margin: 0 0 14px;
	color: #ffffff;
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 14px;
	text-transform: uppercase;
}

.harmony-footer__nav a,
.harmony-footer-link-button {
	display: block;
	margin: 10px 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: rgba(255, 255, 255, 0.72);
	cursor: pointer;
	text-align: left;
	text-decoration: none;
}

.harmony-footer__nav a:hover,
.harmony-footer__nav a:focus,
.harmony-footer-link-button:hover,
.harmony-footer-link-button:focus {
	color: #89d8ff;
}

.harmony-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: 42px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.harmony-footer__bottom p {
	margin: 0;
	color: rgba(255, 255, 255, 0.72);
}

.dayzy-footer-social {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
}

.dayzy-footer-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 8px 12px;
	border: 1px solid rgba(7, 23, 53, 0.12);
	border-radius: 999px;
	background: #ffffff;
	color: #071735;
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
	font-size: 12px;
	font-weight: 800;
	text-decoration: none;
}

.dayzy-footer-social a:hover,
.dayzy-footer-social a:focus {
	border-color: rgba(7, 23, 53, 0.28);
	background: #f5f8ff;
}

.harmony-modal-open {
	overflow: hidden;
}

.harmony-auth-modal[hidden],
.harmony-auth-form {
	display: none;
}

.harmony-auth-modal {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: grid;
	place-items: center;
	padding: 24px;
}

.harmony-auth-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(16, 36, 60, 0.68);
	backdrop-filter: blur(8px);
}

.harmony-auth-modal__dialog {
	position: relative;
	z-index: 1;
	width: min(100%, 500px);
	max-height: calc(100vh - 48px);
	overflow: auto;
	padding: 28px;
	border: 1px solid rgba(1, 118, 211, 0.2);
	border-radius: 20px;
	background: #ffffff;
	box-shadow: 0 30px 80px rgba(16, 36, 60, 0.32);
}

.harmony-auth-modal__close {
	position: absolute;
	top: 14px;
	right: 14px;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border: 1px solid var(--harmony-line);
	border-radius: 50%;
	background: #ffffff;
	color: var(--harmony-navy);
	cursor: pointer;
	font-size: 24px;
	line-height: 1;
}

.harmony-auth-modal__header h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: 34px;
	line-height: 1.08;
}

.harmony-auth-modal__header p:last-child,
.harmony-auth-form p {
	margin: 12px 0 0;
	color: var(--harmony-muted);
	line-height: 1.6;
}

.harmony-auth-tabs {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
	margin: 22px 0;
	padding: 6px;
	border-radius: 14px;
	background: var(--harmony-soft);
}

.harmony-auth-tabs button {
	min-height: 42px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: var(--harmony-muted);
	cursor: pointer;
	font-size: 13px;
	font-weight: 900;
}

.harmony-auth-tabs button.is-active {
	background: #ffffff;
	color: var(--harmony-navy);
	box-shadow: 0 8px 18px rgba(23, 32, 51, 0.08);
}

.alignright {
	float: right;
}

.alignleft {
	float: left;
}

.aligncenter {
	text-align: center;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.gallery-item {
	display: inline-block;
	text-align: left;
	vertical-align: top;
	margin: 0 0 1.5em;
	padding: 0 1em 0 0;
	width: 50%;
}

.gallery-columns-1 .gallery-item {
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-caption {
	display: block;
	margin-bottom: 0;
}

@media (max-width: 1040px) {
	.harmony-header__inner {
		flex-wrap: wrap;
		justify-content: center;
		padding: 14px 24px 18px;
	}

	.harmony-nav {
		order: 3;
		width: 100%;
		overflow-x: auto;
	}

	.harmony-menu {
		justify-content: center;
		min-width: max-content;
	}

	.harmony-signup-grid,
	.harmony-home-hero__grid,
	.harmony-app-preview,
	.harmony-family-preview,
	.harmony-split,
	.harmony-app-shell,
	.harmony-calendar-board,
	.harmony-detail-hub,
	.harmony-dashboard-hero__inner,
	.harmony-dashboard-subscription,
	.harmony-subscription-current,
	.harmony-footer__grid {
		grid-template-columns: 1fr;
	}

	.harmony-dashboard-grid,
	.harmony-card-grid,
	.harmony-card-grid--four,
	.harmony-use-grid,
	.harmony-detail-grid,
	.harmony-pricing-grid,
	.harmony-footer__nav {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-app-preview {
		min-height: auto;
	}

	.harmony-preview-sidebar,
	.harmony-preview-hub {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}

	.harmony-preview-profile,
	.harmony-preview-hub h2 {
		grid-column: 1 / -1;
	}

	.harmony-phone--month {
		margin-top: 0;
	}
}

@media (max-width: 720px) {
	.harmony-container {
		padding: 0 18px;
	}

	.harmony-logo__main {
		font-size: 31px;
	}

	.harmony-menu {
		justify-content: flex-start;
		gap: 18px;
	}

	.harmony-header__actions {
		width: 100%;
		justify-content: center;
	}

	.harmony-signup-hero,
	.harmony-home-hero,
	.harmony-dashboard-hero,
	.harmony-content-section,
	.harmony-dashboard-content,
	.harmony-launch-section {
		padding: 56px 0;
	}

	.harmony-signup-copy {
		padding-top: 0;
	}

	.harmony-signup-copy h1,
	.harmony-home-copy h1,
	.harmony-dashboard-hero h1 {
		font-size: 44px;
		line-height: 1.02;
	}

	.harmony-section-heading h2,
	.harmony-dashboard-subscription h2,
	.harmony-next-panel h2,
	.harmony-subscription-current h2 {
		font-size: 32px;
	}

	.harmony-signup-copy p,
	.harmony-dashboard-hero p,
	.harmony-section-heading p {
		font-size: 16px;
	}

	.harmony-field-grid,
	.harmony-dashboard-grid,
	.harmony-card-grid,
	.harmony-card-grid--four,
	.harmony-use-grid,
	.harmony-detail-grid,
	.harmony-pricing-grid,
	.harmony-footer__nav,
	.harmony-dashboard-subscription__meta,
	.harmony-subscription-current__meta,
	.harmony-billing-grid {
		grid-template-columns: 1fr;
	}

	.harmony-signup-card,
	.harmony-auth-modal__dialog,
	.harmony-dashboard-subscription,
	.harmony-subscription-current,
	.harmony-pricing-card,
	.harmony-next-panel,
	.harmony-launch-panel,
	.harmony-circle-rail,
	.harmony-conversation-panel,
	.harmony-right-rail > section,
	.harmony-detail-hub {
		padding: 22px;
	}

	.harmony-next-panel,
	.harmony-launch-panel,
	.harmony-conversation-header,
	.harmony-footer__bottom {
		align-items: stretch;
		flex-direction: column;
	}

	.harmony-preview-sidebar,
	.harmony-preview-hub {
		grid-template-columns: 1fr;
	}

	.harmony-preview-call-grid,
	.harmony-video-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-phone--month {
		grid-column: 1 / -1;
	}

	.harmony-phone--family,
	.harmony-phone--day {
		min-height: auto;
	}

	.harmony-month-days,
	.harmony-month-grid,
	.harmony-mini-month {
		grid-template-columns: repeat(7, minmax(44px, 1fr));
		overflow-x: auto;
	}

	.harmony-message {
		width: 100%;
	}

	.harmony-button {
		width: 100%;
	}

	.harmony-pricing-card.is-featured {
		transform: none;
	}
}

/* Harmony product treatment */
.harmony-logo__main {
	color: #111827;
}

.harmony-logo__dayzy,
.harmony-eyebrow,
.harmony-menu a:hover,
.harmony-menu a:focus {
	color: var(--harmony-blue);
}

.harmony-button--primary,
.harmony-header__cta {
	background: linear-gradient(135deg, #6f63ff, #f04ca9);
	box-shadow: 0 14px 30px rgba(111, 99, 255, 0.2);
}

.harmony-home-hero {
	background:
		radial-gradient(circle at 18% 18%, rgba(255, 232, 115, 0.72), transparent 28%),
		radial-gradient(circle at 88% 18%, rgba(212, 244, 231, 0.9), transparent 34%),
		radial-gradient(circle at 70% 88%, rgba(231, 205, 255, 0.78), transparent 38%),
		linear-gradient(180deg, #ffffff 0%, #fffaf1 52%, #fbf6ff 100%);
}

.harmony-home-copy h1,
.harmony-section-heading h2,
.harmony-split h2,
.harmony-launch-panel h2 {
	color: #050505;
}

.harmony-highlight {
	display: inline;
	padding: 0.03em 0.18em;
	border-radius: 14px;
	background: linear-gradient(90deg, rgba(255, 235, 113, 0.86), rgba(225, 249, 213, 0.86));
	color: #050505;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.harmony-life-preview {
	grid-template-columns: minmax(230px, 0.8fr) minmax(230px, 0.8fr);
	align-items: start;
	gap: 22px;
}

.harmony-life-preview .harmony-phone {
	border: 0;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 28px 70px rgba(89, 72, 141, 0.16);
}

.harmony-phone--shopping {
	min-height: 620px;
}

.harmony-phone--budget {
	min-height: 560px;
}

.harmony-phone--projects {
	grid-column: 1 / -1;
	min-height: 430px;
}

.harmony-phone-actions,
.harmony-filter-row,
.harmony-budget-toggle {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 16px 0;
}

.harmony-phone-actions span,
.harmony-filter-row span,
.harmony-filter-row b,
.harmony-budget-toggle span,
.harmony-budget-toggle b,
.harmony-list-tools span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 8px 14px;
	border: 1px solid rgba(111, 99, 255, 0.16);
	border-radius: 12px;
	background: #f2f8ff;
	color: #263244;
	font-size: 12px;
	font-weight: 900;
	white-space: nowrap;
}

.harmony-filter-row b,
.harmony-budget-toggle b,
.harmony-list-tools span:first-child {
	background: #ffffff;
	color: #111827;
	box-shadow: 0 8px 18px rgba(17, 24, 39, 0.08);
}

.harmony-list-banner {
	display: grid;
	gap: 8px;
	padding: 22px;
	border-radius: 20px;
	background: #ddf5c9;
	box-shadow: inset 0 0 0 1px rgba(39, 124, 104, 0.1);
}

.harmony-list-banner span,
.harmony-list-banner em {
	color: #355441;
	font-size: 12px;
	font-style: normal;
	font-weight: 900;
}

.harmony-list-banner strong {
	color: #111827;
	font-size: 34px;
	font-weight: 500;
}

.harmony-shopping-rows,
.harmony-list-thread {
	display: grid;
	gap: 12px;
}

.harmony-shopping-rows > div,
.harmony-list-item {
	display: grid;
	grid-template-columns: 24px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
	padding: 14px;
	border: 1px solid rgba(17, 24, 39, 0.08);
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 10px 24px rgba(17, 24, 39, 0.06);
}

.harmony-shopping-rows > div > span,
.harmony-list-item > span {
	width: 20px;
	height: 20px;
	border: 2px solid #7aa9d7;
	border-radius: 50%;
}

.harmony-shopping-rows strong,
.harmony-list-item strong {
	color: #111827;
	font-size: 16px;
}

.harmony-shopping-rows small,
.harmony-list-item small {
	color: var(--harmony-blue);
	font-size: 11px;
	font-weight: 900;
}

.harmony-shopping-rows em,
.harmony-list-item em {
	color: #6b7280;
	font-size: 12px;
	font-style: normal;
	font-weight: 900;
}

.harmony-shopping-rows .is-checked,
.harmony-list-item.is-checked {
	color: #8b95a1;
	text-decoration: line-through;
}

.harmony-shopping-rows .is-checked > span {
	background: #8fb2f3;
	border-color: #8fb2f3;
}

.harmony-shopping-rows .is-featured,
.harmony-list-item.is-featured {
	border-color: rgba(39, 124, 104, 0.22);
	transform: translateX(-16px);
	box-shadow: 0 16px 34px rgba(39, 124, 104, 0.14);
}

.harmony-preview-month {
	margin: 14px 0;
}

.harmony-budget-preview-grid,
.harmony-budget-mini-grid,
.harmony-budget-category-board {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.harmony-budget-preview-grid--small {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.harmony-budget-preview-grid > div,
.harmony-budget-mini-grid > div,
.harmony-budget-category-board > div {
	display: grid;
	gap: 8px;
	min-height: 92px;
	padding: 16px;
	border-radius: 18px;
	color: #111827;
	box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.06);
}

.harmony-budget-preview-grid strong,
.harmony-budget-mini-grid strong,
.harmony-budget-category-board strong {
	font-size: 13px;
	font-weight: 900;
}

.harmony-budget-preview-grid span,
.harmony-budget-mini-grid span,
.harmony-budget-category-board span {
	align-self: end;
	font-size: 18px;
	font-weight: 900;
}

.harmony-budget-ring {
	position: relative;
	display: grid;
	place-items: center;
	min-height: 180px;
	margin: 18px 0;
	text-align: center;
}

.harmony-budget-ring i {
	position: absolute;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background:
		conic-gradient(#77c26f 0 24%, #f04ca9 24% 38%, #ffca45 38% 50%, #8fb2f3 50% 66%, #6f63ff 66% 82%, #ef8f39 82% 100%);
	-webkit-mask: radial-gradient(circle, transparent 52px, #000 53px);
	mask: radial-gradient(circle, transparent 52px, #000 53px);
}

.harmony-budget-ring strong {
	display: block;
	color: #277c68;
	font-size: 28px;
}

.harmony-budget-ring span {
	color: #6b7280;
	font-size: 12px;
	font-weight: 900;
}

.harmony-budget-ring--compact {
	min-height: 150px;
}

.harmony-budget-ring--compact i {
	width: 126px;
	height: 126px;
}

.is-green {
	background: #ddf5c9 !important;
}

.is-yellow {
	background: #fff2a8 !important;
}

.is-peach {
	background: #ffd9c6 !important;
}

.is-blue {
	background: #dff2ff !important;
}

.is-pink {
	background: #ffddeb !important;
}

.is-purple {
	background: #efdcff !important;
}

.is-mint {
	background: #dcfbef !important;
}

.harmony-project-preview-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.harmony-project-preview-grid > div,
.harmony-project-card {
	position: relative;
	display: grid;
	gap: 12px;
	min-height: 150px;
	padding: 18px;
	border: 0;
	border-radius: 22px;
	color: #111827;
	box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.06), 0 14px 28px rgba(17, 24, 39, 0.08);
}

.harmony-project-preview-grid span {
	font-size: 12px;
	font-weight: 900;
}

.harmony-project-preview-grid strong {
	font-size: 20px;
	line-height: 1.18;
}

.harmony-project-preview-grid em,
.harmony-project-card em {
	align-self: end;
	justify-self: end;
	display: inline-grid;
	place-items: center;
	width: 58px;
	height: 58px;
	border: 6px solid rgba(111, 99, 255, 0.7);
	border-left-color: rgba(255, 255, 255, 0.82);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55);
	color: #111827;
	font-style: normal;
	font-weight: 900;
}

.harmony-add-tile {
	display: grid !important;
	place-items: center;
	border: 2px solid rgba(111, 99, 255, 0.34) !important;
	background: #ffffff !important;
	color: #6f63ff !important;
	font-size: 48px;
	font-weight: 300;
}

.harmony-dashboard-hero {
	background:
		radial-gradient(circle at 12% 18%, rgba(255, 202, 69, 0.28), transparent 28%),
		radial-gradient(circle at 86% 18%, rgba(240, 76, 169, 0.24), transparent 32%),
		linear-gradient(135deg, #2b195a 0%, #6f63ff 54%, #f04ca9 100%);
}

.harmony-list-count {
	display: grid;
	justify-items: center;
	gap: 2px;
	min-width: 110px;
	padding: 14px;
	border-radius: 18px;
	background: #fff6d9;
	color: #111827;
}

.harmony-list-count strong {
	font-size: 32px;
}

.harmony-list-count span {
	color: #6b7280;
	font-size: 12px;
	font-weight: 900;
}

.harmony-list-tools {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 18px;
}

.harmony-list-item {
	grid-template-columns: 24px minmax(0, 1fr) minmax(72px, auto);
	align-items: start;
}

.harmony-list-item p {
	margin: 7px 0 0;
	color: #526071;
	line-height: 1.45;
}

.harmony-budget-snapshot {
	background:
		radial-gradient(circle at 86% 12%, rgba(255, 202, 69, 0.32), transparent 34%),
		#ffffff !important;
}

.harmony-budget-mini-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.harmony-budget-mini-grid > div {
	min-height: 76px;
	padding: 12px;
	border-radius: 16px;
}

.harmony-budget-board {
	background:
		linear-gradient(135deg, rgba(255, 246, 217, 0.9), rgba(251, 247, 255, 0.96));
}

.harmony-budget-category-board {
	align-content: start;
	padding: 22px;
	border-radius: 28px;
	background: #ffffff;
	box-shadow: 0 24px 54px rgba(89, 72, 141, 0.12);
}

.harmony-budget-summary-card > div:not(.harmony-day-card__top) {
	margin-top: 12px;
	border-radius: 16px;
}

.harmony-project-hub {
	background:
		radial-gradient(circle at 0% 0%, rgba(231, 205, 255, 0.55), transparent 35%),
		#ffffff;
}

.harmony-project-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.harmony-project-card h3 {
	color: #111827;
	font-size: 22px;
}

.harmony-project-card p {
	color: #263244;
}

.harmony-auth-modal__dialog,
.harmony-signup-card,
.harmony-subscription-current,
.harmony-pricing-card,
.harmony-dashboard-subscription {
	box-shadow: 0 24px 54px rgba(89, 72, 141, 0.13);
}

@media (max-width: 1040px) {
	.harmony-life-preview,
	.harmony-project-grid {
		grid-template-columns: 1fr;
	}

	.harmony-phone--shopping,
	.harmony-phone--budget,
	.harmony-phone--projects {
		min-height: auto;
	}

	.harmony-shopping-rows .is-featured,
	.harmony-list-item.is-featured {
		transform: none;
	}
}

@media (max-width: 720px) {
	.harmony-project-preview-grid,
	.harmony-budget-preview-grid,
	.harmony-budget-preview-grid--small,
	.harmony-budget-category-board,
	.harmony-budget-mini-grid {
		grid-template-columns: 1fr;
	}

	.harmony-list-item {
		grid-template-columns: 24px minmax(0, 1fr);
	}

	.harmony-list-item em {
		grid-column: 2;
	}
}

/* Harmony life system refinements */
.harmony-logo__main {
	color: var(--harmony-purple);
	font-weight: 500;
}

.harmony-logo__dayzy,
.harmony-eyebrow,
.harmony-menu a:hover,
.harmony-menu a:focus {
	color: var(--harmony-blue);
}

.harmony-button--primary,
.harmony-header__cta {
	background: linear-gradient(135deg, var(--harmony-blue), var(--harmony-pink));
	box-shadow: 0 14px 30px rgba(127, 156, 255, 0.2);
}

.harmony-home-hero {
	background:
		radial-gradient(circle at 86% 12%, rgba(247, 164, 200, 0.32), transparent 34%),
		radial-gradient(circle at 10% 92%, rgba(127, 156, 255, 0.24), transparent 40%),
		linear-gradient(180deg, #ffffff 0%, #fbf7ff 100%);
}

.harmony-highlight {
	background: linear-gradient(90deg, rgba(255, 231, 240, 0.95), rgba(241, 237, 255, 0.95));
}

.harmony-dashboard-hero {
	background:
		radial-gradient(circle at 12% 18%, rgba(247, 164, 200, 0.22), transparent 28%),
		radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.22), transparent 30%),
		linear-gradient(135deg, #8ea4ff 0%, #a98cff 52%, #f7a4c8 100%);
}

.harmony-progress-card,
.harmony-smart-board {
	background:
		radial-gradient(circle at 0% 0%, rgba(241, 237, 255, 0.78), transparent 35%),
		#ffffff !important;
}

.harmony-list-count {
	background: var(--harmony-lavender);
}

.harmony-shopping-rows .is-featured,
.harmony-list-item.is-featured {
	border-color: rgba(127, 156, 255, 0.26);
	box-shadow: 0 16px 34px rgba(127, 156, 255, 0.14);
}

.is-green,
.is-mint,
.is-softgreen {
	background: #f0f8f3 !important;
}

.is-yellow {
	background: #fff8d9 !important;
}

.is-peach {
	background: #fff0e7 !important;
}

.is-blue {
	background: #e8f0ff !important;
}

.is-pink {
	background: #ffe7f0 !important;
}

.is-purple,
.is-lavender {
	background: #f1edff !important;
}

.is-rose {
	background: #fff3f8 !important;
}

@media (min-width: 1041px) {
	.harmony-account-menu--mobile {
		display: none !important;
	}
}

@media (max-width: 1040px) {
	.harmony-header__inner {
		position: relative;
		flex-wrap: nowrap;
		justify-content: space-between;
		min-height: 74px;
		padding: 0 24px;
	}

	.harmony-header__mobile-controls {
		display: flex;
	}

	.harmony-menu-toggle {
		display: inline-flex;
	}

	.harmony-account-menu--desktop {
		display: none !important;
	}

	.harmony-header__panel {
		position: absolute;
		top: calc(100% + 10px);
		left: 24px;
		right: 24px;
		z-index: 80;
		display: grid;
		gap: 18px;
		padding: 18px;
		border: 1px solid var(--harmony-line);
		border-radius: 22px;
		background: rgba(255, 255, 255, 0.98);
		box-shadow: 0 22px 54px rgba(23, 32, 51, 0.16);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translateY(-8px);
		transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
	}

	.harmony-header__panel.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	.harmony-nav {
		order: initial;
		width: auto;
		overflow: visible;
	}

	.harmony-menu {
		display: grid;
		min-width: 0;
		gap: 8px;
	}

	.harmony-menu a {
		display: block;
		padding: 12px;
		border-radius: 14px;
		background: var(--harmony-soft-2);
	}

	.harmony-header__actions {
		width: auto;
		justify-content: flex-start;
	}

	body.harmony-menu-open {
		overflow: hidden;
	}

	.harmony-smart-flow {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 720px) {
	.harmony-header__inner {
		padding: 0 18px;
	}

	.harmony-header__panel {
		left: 18px;
		right: 18px;
	}

	.harmony-logo__main {
		font-size: 30px;
	}

	.harmony-smart-flow {
		grid-template-columns: 1fr;
	}

	.harmony-simple-hero h1 {
		font-size: 40px;
	}
}

/* Calendar-first Harmony planner */
.harmony-logo__main {
	color: #7f9cff;
	font-family: "Alex Brush", cursive;
	font-size: 62px;
	font-weight: 400;
	letter-spacing: 3px;
	line-height: 1;
	text-shadow: 1px 0 #7f9cff;
	filter: drop-shadow(0 0 .6px #7f9cff);
}

.harmony-logo__by {
	color: #7a6453;
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 14px;
	font-weight: 300;
}

.harmony-logo__dayzy {
	color: #7a6453;
	font-family: "Birds of Paradise", cursive;
	font-size: 20px;
	font-weight: 400;
	letter-spacing: 2px;
}

.harmony-planner-hero {
	background:
		radial-gradient(circle at 8% 18%, rgba(247, 164, 200, 0.22), transparent 30%),
		radial-gradient(circle at 88% 14%, rgba(127, 156, 255, 0.24), transparent 34%),
		linear-gradient(180deg, #ffffff 0%, #f7fbff 58%, #fbf7ff 100%);
}

.harmony-planner-preview {
	display: grid;
	grid-template-columns: minmax(360px, 1fr) minmax(230px, 0.58fr);
	gap: 16px;
	align-items: stretch;
}

.harmony-preview-calendar,
.harmony-preview-module-list {
	padding: 20px;
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 22px 54px rgba(17, 24, 39, 0.1);
}

.harmony-preview-week {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 8px;
	margin-top: 18px;
}

.harmony-preview-week div {
	min-height: 178px;
	padding: 12px;
	border: 1px solid rgba(17, 24, 39, 0.08);
	border-radius: 18px;
	background: #ffffff;
}

.harmony-preview-week span,
.harmony-preview-week strong,
.harmony-preview-week em {
	display: block;
}

.harmony-preview-week span {
	color: var(--harmony-muted);
	font-size: 11px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-preview-week strong {
	margin-top: 6px;
	color: var(--harmony-navy);
	font-size: 26px;
}

.harmony-preview-week em,
.harmony-calendar-chip {
	margin-top: 14px;
	padding: 7px 8px;
	overflow: hidden;
	border-radius: 999px;
	color: #172033;
	font-size: 11px;
	font-style: normal;
	font-weight: 900;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.harmony-preview-module-list {
	display: grid;
	gap: 12px;
}

.harmony-preview-module-list > div:not(.harmony-preview-topline) {
	display: grid;
	grid-template-columns: 12px 1fr;
	gap: 8px 10px;
	padding: 14px;
	border: 1px solid rgba(17, 24, 39, 0.08);
	border-radius: 18px;
	background: #ffffff;
}

.harmony-preview-module-list b {
	grid-row: span 2;
	width: 12px;
	border-radius: 999px;
}

.harmony-preview-module-list strong,
.harmony-preview-module-list span {
	display: block;
}

.harmony-preview-module-list strong {
	color: var(--harmony-navy);
}

.harmony-preview-module-list span {
	color: var(--harmony-muted);
	line-height: 1.45;
}

.harmony-module-grid,
.harmony-calendar-use-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.harmony-module-grid article,
.harmony-calendar-use-list div {
	min-height: 210px;
	padding: 22px;
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 24px;
	background: #ffffff;
	box-shadow: 0 16px 40px rgba(17, 24, 39, 0.06);
}

.harmony-module-grid article > span {
	display: block;
	width: 44px;
	height: 12px;
	margin-bottom: 18px;
	border-radius: 999px;
}

.harmony-module-grid h3,
.harmony-calendar-use-list strong {
	margin: 0;
	color: var(--harmony-navy);
	font-size: 22px;
}

.harmony-module-grid p,
.harmony-calendar-use-list span {
	display: block;
	margin-top: 10px;
	color: var(--harmony-muted);
	line-height: 1.6;
}

.harmony-calendar-focus-section {
	background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
}

.is-finance,
.is-finances {
	background: #e8f0ff !important;
}

.is-family,
.is-family-life {
	background: #ffe7f0 !important;
}

.is-goal,
.is-goals {
	background: #f1edff !important;
}

.is-task,
.is-tasks {
	background: #eaf7ff !important;
}

.harmony-dashboard-app {
	background: #ffffff;
	min-height: 100vh;
	color: var(--harmony-ink);
	overflow: visible;
}

.harmony-dashboard-shell {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	min-height: calc(100vh - 1px);
}

.harmony-dashboard-sidebar {
	position: sticky;
	top: 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: 100vh;
	padding: 28px 24px;
	border-right: 1px solid rgba(127, 156, 255, 0.18);
	background: #ffffff;
	z-index: 30;
}

.harmony-dashboard-nav {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	padding: 0;
}

.harmony-dashboard-nav a {
	box-sizing: border-box;
	flex: 0 0 42px;
	display: flex;
	align-items: center;
	gap: 12px;
	height: 42px;
	min-height: 42px;
	padding: 0 12px;
	border-radius: 0;
	background: transparent;
	color: #5f6978;
	font-size: 15px;
	font-weight: 750;
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}

.harmony-dashboard-nav a:hover,
.harmony-dashboard-nav a:focus-visible,
.harmony-dashboard-nav a.is-active {
	background: var(--harmony-soft);
	color: var(--harmony-navy);
}

.harmony-dashboard-nav i {
	width: 18px;
	color: var(--harmony-blue);
	font-style: normal;
	font-weight: 900;
	text-align: center;
}

.harmony-dashboard-drawer-head,
.harmony-dashboard-mobilebar,
.harmony-dashboard-sidebar-scrim {
	display: none;
}

.harmony-dashboard-main {
	min-width: 0;
	padding: 0 0 70px;
}

.harmony-dashboard-app .harmony-container {
	max-width: none;
	padding: 0 34px;
}

.harmony-dashboard-app .harmony-dashboard-hero {
	padding: 42px 0;
	background:
		radial-gradient(circle at 12% 18%, rgba(247, 164, 200, 0.2), transparent 28%),
		radial-gradient(circle at 86% 18%, rgba(255, 255, 255, 0.28), transparent 30%),
		linear-gradient(135deg, #7f9cff 0%, #a98cff 54%, #f7a4c8 100%);
}

.harmony-dashboard-app .harmony-dashboard-content {
	padding: 30px 0 70px;
}

.harmony-dashboard-stats {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 18px;
}

.harmony-stat-card {
	min-height: 116px;
	padding: 16px;
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 18px;
	background: #ffffff;
	color: var(--harmony-navy);
	text-decoration: none;
	box-shadow: 0 12px 28px rgba(17, 24, 39, 0.06);
}

.harmony-stat-card span,
.harmony-stat-card strong,
.harmony-stat-card p {
	display: block;
}

.harmony-stat-card span {
	color: var(--harmony-blue);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-stat-card strong {
	margin-top: 8px;
	font-size: 32px;
	line-height: 1;
}

.harmony-stat-card p {
	margin: 8px 0 0;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 800;
}

.harmony-planner-board {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 0.36fr);
	gap: 18px;
	align-items: start;
}

.harmony-planner-calendar,
.harmony-panel-card {
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 24px;
	background: #ffffff;
	box-shadow: 0 16px 40px rgba(17, 24, 39, 0.06);
}

.harmony-planner-calendar {
	padding: 22px;
}

.harmony-calendar-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}

.harmony-calendar-toolbar h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-size: 34px;
}

.harmony-calendar-switcher {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.harmony-calendar-switcher a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 0 12px;
	border: 1px solid rgba(127, 156, 255, 0.2);
	border-radius: 999px;
	background: var(--harmony-soft-2);
	color: var(--harmony-navy);
	font-size: 12px;
	font-weight: 900;
	text-decoration: none;
}

.harmony-calendar-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	border: 1px solid var(--harmony-line);
	border-radius: 18px;
	overflow: hidden;
}

.harmony-calendar-weekday,
.harmony-calendar-day {
	min-height: 116px;
	padding: 10px;
	border-right: 1px solid var(--harmony-line);
	border-bottom: 1px solid var(--harmony-line);
	background: #ffffff;
}

.harmony-calendar-weekday {
	min-height: 38px;
	background: var(--harmony-soft-2);
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-calendar-day strong {
	display: block;
	color: var(--harmony-navy);
	font-size: 16px;
}

.harmony-calendar-day.is-today {
	background: #fff7fb;
	box-shadow: inset 0 0 0 2px rgba(247, 164, 200, 0.5);
}

.harmony-calendar-day.is-empty {
	background: #f8fafc;
}

.harmony-calendar-chip {
	display: block;
	margin-top: 6px;
}

.harmony-calendar-day em {
	display: block;
	margin-top: 6px;
	color: var(--harmony-muted);
	font-size: 11px;
	font-style: normal;
	font-weight: 900;
}

.harmony-planner-side,
.harmony-module-workspace {
	display: grid;
	gap: 18px;
}

.harmony-panel-card {
	padding: 22px;
}

.harmony-panel-card h2 {
	margin: 0 0 12px;
	color: var(--harmony-navy);
	font-size: 25px;
	line-height: 1.12;
}

.harmony-panel-card p {
	color: var(--harmony-muted);
	line-height: 1.6;
}

.harmony-upcoming-list,
.harmony-task-list {
	display: grid;
	gap: 10px;
}

.harmony-upcoming-list div,
.harmony-module-card article {
	padding: 12px;
	border: 1px solid rgba(17, 24, 39, 0.08);
	border-radius: 16px;
	background: var(--harmony-soft-2);
}

.harmony-upcoming-list time,
.harmony-upcoming-list strong,
.harmony-upcoming-list span,
.harmony-task-list strong,
.harmony-task-list small,
.harmony-module-card strong,
.harmony-module-card span {
	display: block;
}

.harmony-upcoming-list time,
.harmony-task-list small {
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
}

.harmony-upcoming-list strong,
.harmony-task-list strong,
.harmony-module-card strong {
	margin-top: 4px;
	color: var(--harmony-navy);
}

.harmony-upcoming-list span {
	display: inline-flex;
	width: max-content;
	margin-top: 8px;
	padding: 5px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 900;
}

.harmony-task-list {
	margin-top: 16px;
}

.harmony-module-workspace {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 18px;
}

.harmony-module-card article {
	margin-top: 10px;
}

.harmony-module-card article span {
	margin-top: 6px;
	color: var(--harmony-muted);
	line-height: 1.55;
}

@media (max-width: 1180px) {
	.harmony-dashboard-stats,
	.harmony-module-grid,
	.harmony-calendar-use-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-planner-preview,
	.harmony-planner-board {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 900px) {
	.harmony-dashboard-shell {
		display: block;
	}

	.harmony-dashboard-mobilebar {
		position: fixed;
		top: var(--harmony-dashboard-tab-top, 50svh);
		left: 0;
		z-index: 10010;
		display: block;
		width: 42px;
		height: 76px;
		padding: 0;
		transform: translateY(-50%);
		pointer-events: none;
		background: transparent;
	}

	.harmony-dashboard-sidebar-toggle,
	.harmony-dashboard-drawer-close {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 42px;
		border: 1px solid rgba(127, 156, 255, 0.18);
		border-radius: 7px;
		background: #ffffff;
		color: var(--harmony-blue);
		font: inherit;
		font-size: 13px;
		font-weight: 900;
		cursor: pointer;
		box-shadow: 0 8px 18px rgba(17, 24, 39, 0.05);
	}

	.harmony-dashboard-sidebar-toggle {
		width: 42px;
		height: 76px;
		min-height: 76px;
		padding: 0 5px 0 0;
		border-left: 0;
		border-radius: 0 999px 999px 0;
		font-size: 20px;
		box-shadow: 10px 12px 32px rgba(17, 24, 39, 0.16);
		pointer-events: auto;
	}

	.harmony-dashboard-drawer-close {
		width: 42px;
		height: 42px;
		min-height: 42px;
		padding: 0;
	}

	.harmony-dashboard-sidebar {
		position: fixed !important;
		top: 0;
		right: auto;
		bottom: 0;
		left: 0;
		z-index: 10020;
		width: min(326px, calc(100vw - 34px));
		height: 100dvh !important;
		min-height: 0;
		display: flex !important;
		flex-direction: column !important;
		gap: 8px !important;
		padding: 10px 18px 18px !important;
		border-right: 1px solid rgba(127, 156, 255, 0.18) !important;
		background: #ffffff !important;
		box-shadow: 24px 0 70px rgba(17, 24, 39, 0.22);
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateX(-104%);
		transition: transform 0.22s ease;
	}

	.harmony-dashboard-sidebar.is-open {
		transform: translateX(0);
	}

	.harmony-dashboard-drawer-head {
		display: flex;
		justify-content: flex-end;
	}

	.harmony-dashboard-sidebar-scrim {
		position: fixed;
		inset: 0;
		z-index: 10015;
		display: block;
		background: rgba(15, 23, 42, 0.42);
		backdrop-filter: blur(4px);
	}

	.harmony-dashboard-sidebar-scrim[hidden] {
		display: none;
	}

	body.harmony-dashboard-sidebar-open {
		overflow: hidden;
	}

	.harmony-calendar-grid {
		min-width: 760px;
	}

	.harmony-planner-calendar {
		overflow-x: auto;
	}
}

@media (max-width: 720px) {
	.harmony-logo__main {
		font-size: 38px;
	}

	.harmony-logo__dayzy {
		font-size: 17px;
	}

	.harmony-dashboard-app .harmony-container {
		padding: 0 18px;
	}

	.harmony-dashboard-stats,
	.harmony-module-workspace,
	.harmony-module-grid,
	.harmony-calendar-use-list,
	.harmony-preview-week {
		grid-template-columns: 1fr;
	}

	.harmony-preview-week div {
		min-height: 110px;
	}

	.harmony-calendar-toolbar {
		align-items: stretch;
		flex-direction: column;
	}
}

/* Keep the logged-in mobile header inside the viewport. */
@media (max-width: 1040px) {
	.harmony-header {
		width: 100%;
		overflow-x: clip;
	}

	.harmony-header > .harmony-container {
		max-width: 100%;
		padding-right: 0;
		padding-left: 0;
	}

	.harmony-header__inner {
		width: 100%;
		min-width: 0;
		gap: 12px;
		padding-right: clamp(12px, 4vw, 18px);
		padding-left: clamp(12px, 4vw, 18px);
	}

	.harmony-logo {
		flex: 1 1 auto;
		min-width: 0;
		gap: 5px;
		overflow: hidden;
	}

	.harmony-logo__main {
		font-size: clamp(34px, 8vw, 46px);
		letter-spacing: 1px;
	}

	.harmony-logo__by {
		flex: 0 0 auto;
		font-size: 12px;
	}

	.harmony-logo__dayzy {
		flex: 0 0 auto;
		font-size: clamp(14px, 3.8vw, 17px);
		letter-spacing: 1px;
	}

	.harmony-header__mobile-controls {
		flex: 0 0 auto;
		gap: 8px;
	}

	.harmony-account-menu summary,
	.harmony-menu-toggle {
		width: 42px;
		height: 42px;
		min-width: 42px;
	}

	.harmony-header__panel {
		left: clamp(12px, 4vw, 18px);
		right: clamp(12px, 4vw, 18px);
		max-width: calc(100vw - 24px);
	}
}

@media (max-width: 360px) {
	.harmony-header__inner {
		gap: 8px;
		padding-right: 10px;
		padding-left: 10px;
	}

	.harmony-logo__main {
		font-size: 31px;
	}

	.harmony-logo__by {
		font-size: 11px;
	}

	.harmony-logo__dayzy {
		font-size: 13px;
	}

	.harmony-header__mobile-controls {
		gap: 6px;
	}

	.harmony-account-menu summary,
	.harmony-menu-toggle {
		width: 40px;
		height: 40px;
		min-width: 40px;
	}
}

/* Keep the Dayzy wordmark black across product branding. */
.harmony-logo__dayzy {
	color: #000000 !important;
}

.harmony-blog-hero,
.harmony-single-hero {
	padding: 86px 0;
	background:
		radial-gradient(circle at 18% 20%, rgba(247, 164, 200, 0.28), transparent 30%),
		radial-gradient(circle at 84% 12%, rgba(127, 156, 255, 0.32), transparent 28%),
		linear-gradient(135deg, #f7fbff 0%, #f1edff 52%, #ffffff 100%);
}

.harmony-blog-hero__inner,
.harmony-single-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 0.48fr);
	align-items: center;
	gap: 38px;
}

.harmony-blog-hero h1,
.harmony-single-hero h1 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(42px, 6vw, 74px);
	line-height: 0.98;
}

.harmony-single-hero h1 {
	margin-top: 16px;
}

.harmony-blog-hero p,
.harmony-single-hero p {
	max-width: 720px;
	color: var(--harmony-ink);
	font-size: 20px;
	line-height: 1.58;
}

.harmony-blog-hero__panel {
	padding: 28px;
	border: 1px solid var(--harmony-line);
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.78);
	box-shadow: var(--harmony-shadow);
}

.harmony-blog-hero__panel span,
.harmony-blog-card__meta span,
.harmony-single-meta,
.harmony-single-quick {
	color: var(--harmony-purple);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-blog-hero__panel strong {
	display: block;
	margin-top: 12px;
	color: var(--harmony-navy);
	font-size: 24px;
	line-height: 1.22;
}

.harmony-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

.harmony-blog-card {
	overflow: hidden;
	border: 1px solid var(--harmony-line);
	border-radius: 24px;
	background: #ffffff;
	box-shadow: 0 16px 38px rgba(127, 156, 255, 0.1);
}

.harmony-blog-card__media,
.harmony-blog-card__placeholder {
	display: block;
	aspect-ratio: 16 / 10;
	background:
		radial-gradient(circle at 24% 18%, rgba(247, 164, 200, 0.42), transparent 30%),
		linear-gradient(135deg, var(--harmony-blue), var(--harmony-purple));
}

.harmony-blog-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.harmony-blog-card__body {
	padding: 22px;
}

.harmony-blog-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 12px;
}

.harmony-blog-card h3,
.harmony-blog-empty h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-size: 24px;
	line-height: 1.15;
}

.harmony-blog-card p,
.harmony-blog-empty p {
	color: var(--harmony-muted);
	line-height: 1.6;
}

.harmony-blog-card__link {
	display: inline-flex;
	margin-top: 12px;
	color: var(--harmony-blue);
	font-weight: 900;
	text-decoration: none;
}

.harmony-blog-pagination {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 36px;
}

.harmony-blog-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: 0 14px;
	border: 1px solid var(--harmony-line);
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-navy);
	font-weight: 900;
	text-decoration: none;
}

.harmony-blog-pagination .current {
	background: var(--harmony-blue);
	color: #ffffff;
}

.harmony-blog-empty {
	max-width: 760px;
	margin: 0 auto;
	padding: 38px;
	border: 1px solid var(--harmony-line);
	border-radius: 28px;
	background: linear-gradient(135deg, #ffffff, var(--harmony-soft));
	text-align: center;
	box-shadow: var(--harmony-shadow);
}

.harmony-single-back {
	display: inline-flex;
	margin-bottom: 22px;
	color: var(--harmony-blue);
	font-weight: 900;
	text-decoration: none;
}

.harmony-single-meta,
.harmony-single-quick {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.harmony-single-media {
	overflow: hidden;
	margin: 0;
	border-radius: 30px;
	background: #ffffff;
	box-shadow: var(--harmony-shadow);
}

.harmony-single-media img,
.harmony-single-placeholder {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.harmony-single-placeholder {
	display: grid;
	place-items: center;
	background:
		radial-gradient(circle at 26% 18%, rgba(247, 164, 200, 0.42), transparent 30%),
		linear-gradient(135deg, var(--harmony-blue), var(--harmony-purple));
	color: #ffffff;
	font-size: 28px;
	font-weight: 900;
}

.harmony-single-layout {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	align-items: start;
	gap: 42px;
	padding: 76px 24px;
}

.harmony-single-rail > div {
	position: sticky;
	top: 112px;
	padding: 24px;
	border: 1px solid var(--harmony-line);
	border-radius: 24px;
	background: #ffffff;
	box-shadow: 0 16px 40px rgba(127, 156, 255, 0.08);
}

.harmony-single-rail strong,
.harmony-single-share span {
	display: block;
	margin-bottom: 16px;
	color: var(--harmony-navy);
	font-size: 18px;
}

.harmony-single-rail dl {
	display: grid;
	gap: 16px;
	margin: 0 0 20px;
}

.harmony-single-rail dt {
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-single-rail dd {
	margin: 5px 0 0;
	color: var(--harmony-navy);
	font-weight: 850;
	line-height: 1.4;
}

.harmony-single-share {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
	padding-top: 18px;
	border-top: 1px solid var(--harmony-line);
}

.harmony-single-share span {
	flex: 0 0 100%;
	margin-bottom: 2px;
}

.harmony-single-share a,
.harmony-single-tags a {
	display: inline-flex;
	padding: 9px 11px;
	border-radius: 999px;
	background: var(--harmony-lavender);
	color: var(--harmony-blue);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
}

.harmony-single-editor {
	color: var(--harmony-ink);
	font-size: 18px;
	line-height: 1.82;
}

.harmony-single-editor > *:first-child {
	margin-top: 0;
}

.harmony-single-editor h2,
.harmony-single-editor h3 {
	color: var(--harmony-navy);
	line-height: 1.12;
}

.harmony-single-editor img {
	border-radius: 22px;
	box-shadow: var(--harmony-shadow);
}

.harmony-single-tags,
.harmony-single-nav {
	margin-top: 36px;
}

.harmony-single-tags span {
	display: block;
	margin-bottom: 10px;
	color: var(--harmony-muted);
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-single-nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.harmony-single-nav a {
	padding: 20px;
	border: 1px solid var(--harmony-line);
	border-radius: 20px;
	background: #ffffff;
	box-shadow: 0 14px 30px rgba(127, 156, 255, 0.07);
	text-decoration: none;
}

.harmony-single-nav span {
	display: block;
	margin-bottom: 6px;
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-single-nav strong {
	color: var(--harmony-navy);
	line-height: 1.25;
}

.harmony-single-related {
	padding: 72px 0 88px;
	background: var(--harmony-soft-2);
}

.harmony-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 16px;
	align-items: center;
}

.harmony-footer__legal a {
	color: rgba(255, 255, 255, 0.74);
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
}

.harmony-footer__legal a:hover,
.harmony-footer__legal a:focus {
	color: #ffffff;
}

.harmony-support-page {
	background: linear-gradient(180deg, #ffffff 0%, var(--harmony-soft-2) 100%);
	color: var(--harmony-navy);
}

.harmony-support-hero {
	padding: 86px 0 58px;
	background:
		radial-gradient(circle at 86% 12%, rgba(247, 164, 200, 0.22), transparent 30%),
		linear-gradient(135deg, #ffffff 0%, var(--harmony-lavender) 100%);
}

.harmony-support-hero__inner {
	max-width: 860px;
}

.harmony-support-hero h1 {
	max-width: 820px;
	margin: 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(42px, 6vw, 76px);
	line-height: 0.98;
	letter-spacing: 0;
}

.harmony-support-hero p:not(.harmony-eyebrow) {
	max-width: 720px;
	margin: 20px 0 0;
	color: var(--harmony-ink);
	font-size: 20px;
	line-height: 1.65;
}

.harmony-support-section {
	padding: 54px 0;
}

.harmony-support-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.harmony-support-card,
.harmony-support-form-card {
	border: 1px solid var(--harmony-line);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.07);
}

.harmony-support-card {
	padding: 24px;
}

.harmony-support-card h2 {
	margin: 0 0 10px;
	color: var(--harmony-navy);
	font-size: 24px;
	line-height: 1.15;
}

.harmony-support-card p {
	margin: 0;
	color: var(--harmony-muted);
	font-size: 16px;
	line-height: 1.65;
}

.harmony-support-form-card {
	max-width: 760px;
	margin: 0 auto;
	padding: clamp(24px, 4vw, 36px);
}

.harmony-support-form {
	display: grid;
	gap: 16px;
}

.harmony-support-form label {
	display: grid;
	gap: 8px;
	color: var(--harmony-navy);
	font-weight: 900;
}

.harmony-support-form input,
.harmony-support-form textarea {
	width: 100%;
	border: 1px solid var(--harmony-line);
	border-radius: 16px;
	background: #ffffff;
	color: var(--harmony-navy);
	font: inherit;
	padding: 13px 14px;
}

.harmony-support-alert {
	margin-bottom: 18px;
	padding: 14px 16px;
	border-radius: 16px;
	background: var(--harmony-rose);
	color: var(--harmony-navy);
	font-weight: 800;
}

.harmony-support-alert--success {
	background: var(--harmony-lavender);
	color: var(--harmony-blue);
}

.harmony-support-link-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	justify-content: center;
}

.harmony-support-link-row a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 16px;
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-blue);
	font-size: 14px;
	font-weight: 900;
	text-decoration: none;
	box-shadow: 0 10px 26px rgba(23, 32, 51, 0.07);
}

.harmony-cookie-consent {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 9999;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 18px;
	align-items: center;
	width: min(720px, calc(100% - 36px));
	padding: 18px;
	border: 1px solid rgba(127, 156, 255, 0.22);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 24px 70px rgba(23, 32, 51, 0.16);
}

.harmony-cookie-consent[hidden] {
	display: none;
}

.harmony-cookie-consent strong {
	display: block;
	margin-bottom: 4px;
	color: var(--harmony-navy);
}

.harmony-cookie-consent p {
	margin: 0;
	color: var(--harmony-muted);
	font-size: 14px;
	line-height: 1.45;
}

.harmony-cookie-consent__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	justify-content: flex-end;
}

.harmony-cookie-consent__actions a,
.harmony-cookie-consent__actions button {
	border: 0;
	border-radius: 999px;
	background: var(--harmony-lavender);
	color: var(--harmony-blue);
	cursor: pointer;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	padding: 10px 14px;
	text-decoration: none;
}

.harmony-cookie-consent__actions button {
	background: linear-gradient(135deg, var(--harmony-blue), var(--harmony-purple));
	color: #ffffff;
}

@media (max-width: 900px) {
	.harmony-blog-hero__inner,
	.harmony-single-hero__inner,
	.harmony-blog-grid,
	.harmony-single-layout,
	.harmony-single-nav {
		grid-template-columns: 1fr;
	}

	.harmony-blog-hero,
	.harmony-single-hero {
		padding: 66px 0;
	}

	.harmony-single-layout {
		padding: 56px 24px;
	}

	.harmony-single-rail > div {
		position: static;
	}

	.harmony-support-grid,
	.harmony-cookie-consent {
		grid-template-columns: 1fr;
	}

	.harmony-cookie-consent__actions {
		justify-content: flex-start;
	}
}

/* Blog polish: calm editorial cards, readable articles, and modern FAQ/fact blocks. */
.harmony-blog-card {
	transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.harmony-blog-card:hover {
	transform: translateY(-4px);
	border-color: rgba(127, 156, 255, 0.28);
	box-shadow: 0 24px 58px rgba(127, 156, 255, 0.16);
}

.harmony-blog-card__media,
.harmony-blog-card__placeholder {
	aspect-ratio: 16 / 9;
	max-height: 224px;
}

.harmony-blog-card h3 a {
	color: inherit;
	text-decoration: none;
}

.harmony-single-hero__inner {
	grid-template-columns: minmax(0, 1fr) minmax(260px, 0.44fr);
}

.harmony-single-media {
	max-width: 500px;
	justify-self: end;
}

.harmony-single-media img,
.harmony-single-placeholder {
	aspect-ratio: 16 / 10;
	max-height: 350px;
}

.harmony-single-main {
	padding: clamp(24px, 4vw, 44px);
	border: 1px solid rgba(127, 156, 255, 0.15);
	border-radius: 30px;
	background: #ffffff;
	box-shadow: 0 22px 56px rgba(23, 32, 51, 0.07);
}

.harmony-single-editor {
	max-width: 790px;
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
	font-size: clamp(17px, 1.25vw, 19px);
	line-height: 1.84;
	letter-spacing: 0;
}

.harmony-single-editor p {
	margin: 0 0 1.35em;
}

.harmony-single-editor h2,
.harmony-single-editor h3,
.harmony-single-editor h4 {
	letter-spacing: 0;
}

.harmony-single-editor h2 {
	margin: 2.25em 0 0.72em;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(30px, 4vw, 44px);
	line-height: 1.08;
}

.harmony-single-editor h3 {
	margin: 2em 0 0.65em;
	font-size: clamp(23px, 3vw, 31px);
	line-height: 1.16;
}

.harmony-single-editor h4 {
	margin: 1.8em 0 0.6em;
	font-size: clamp(19px, 2.2vw, 23px);
	line-height: 1.25;
	color: var(--harmony-blue);
}

.harmony-single-editor ul,
.harmony-single-editor ol {
	margin: 1.45em 0 2em;
	padding: 22px 24px 22px 48px;
	border: 1px solid rgba(127, 156, 255, 0.15);
	border-radius: 24px;
	background: linear-gradient(135deg, #ffffff, rgba(247, 164, 200, 0.11));
	box-shadow: 0 14px 34px rgba(23, 32, 51, 0.05);
}

.harmony-single-editor li {
	margin: 0.68em 0;
	padding-left: 0.15em;
}

.harmony-single-editor li::marker {
	color: var(--harmony-purple);
	font-weight: 900;
}

.harmony-single-editor blockquote,
.harmony-single-editor .dayzy-ai-blog-facts,
.harmony-single-editor .dayzy-ai-blog-fact,
.harmony-single-editor .dayzy-ai-blog-quick-facts {
	margin: 2.2em 0;
	padding: clamp(22px, 4vw, 32px);
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 28px;
	background:
		radial-gradient(circle at 8% 0%, rgba(247, 164, 200, 0.16), transparent 34%),
		linear-gradient(135deg, #ffffff, var(--harmony-soft-2));
	box-shadow: 0 18px 44px rgba(23, 32, 51, 0.07);
}

.harmony-single-editor .dayzy-ai-blog-faq,
.harmony-single-editor .dayzy-ai-blog-cta {
	margin: clamp(42px, 7vw, 68px) 0 0;
	padding: clamp(24px, 4vw, 36px);
	border: 1px solid rgba(127, 156, 255, 0.17);
	border-radius: 30px;
	background: linear-gradient(135deg, #ffffff, rgba(169, 140, 255, 0.11));
	box-shadow: 0 22px 54px rgba(23, 32, 51, 0.07);
}

.harmony-single-editor .dayzy-ai-blog-faq h2,
.harmony-single-editor .dayzy-ai-blog-cta h2 {
	margin-top: 0;
}

.harmony-single-editor .dayzy-ai-blog-faq h3 {
	margin-top: 1.45em;
	padding-top: 1.25em;
	border-top: 1px solid rgba(127, 156, 255, 0.14);
}

.harmony-single-editor .dayzy-ai-blog-faq h3:first-of-type {
	padding-top: 0;
	border-top: 0;
}

.harmony-single-editor .dayzy-ai-blog-cta a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: 6px;
	padding: 11px 18px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--harmony-blue), var(--harmony-purple));
	color: #ffffff;
	font-size: 14px;
	font-weight: 900;
	text-decoration: none;
}

.harmony-single-tags {
	align-items: flex-start;
	gap: 10px;
}

.harmony-single-tags span {
	flex: 0 0 100%;
	margin-bottom: 2px;
}

.harmony-single-tags a {
	margin: 0;
}

@media (max-width: 900px) {
	.harmony-single-hero__inner {
		grid-template-columns: 1fr;
	}

	.harmony-single-media {
		width: 100%;
		max-width: 100%;
		justify-self: stretch;
	}

	.harmony-single-media img,
	.harmony-single-placeholder {
		max-height: 280px;
	}

	.harmony-single-main {
		padding: 24px;
		border-radius: 24px;
	}

	.harmony-single-editor ul,
	.harmony-single-editor ol {
		padding: 20px 20px 20px 36px;
	}

	.harmony-single-tags a {
		flex: 1 1 auto;
		justify-content: center;
		text-align: center;
	}
}

/* Dayzy family authenticated header alignment */
.harmony-header {
	background: #ffffff;
	box-shadow: 0 10px 28px rgba(23, 32, 51, 0.05);
}

.harmony-header__inner {
	min-height: 76px;
}

.harmony-header__panel {
	gap: 18px;
}

.harmony-menu {
	gap: 18px;
}

.harmony-menu--authenticated {
	gap: 8px;
}

.harmony-menu--authenticated a {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 8px 10px;
	border-radius: 999px;
}

.harmony-menu--authenticated a:hover,
.harmony-menu--authenticated a:focus {
	background: var(--harmony-lavender);
}

.harmony-header-icon,
.harmony-header-alert summary {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(127, 156, 255, 0.26);
	border-radius: 50%;
	background: #ffffff;
	color: var(--harmony-blue);
	text-decoration: none;
	box-shadow: 0 12px 26px rgba(23, 32, 51, 0.08);
	cursor: pointer;
	list-style: none;
}

.harmony-header-alert {
	position: relative;
}

.harmony-header-alert summary::-webkit-details-marker {
	display: none;
}

.harmony-header-alert__dropdown {
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	z-index: 90;
	width: 260px;
	padding: 16px;
	border: 1px solid var(--harmony-line);
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 22px 50px rgba(23, 32, 51, 0.16);
}

.harmony-header-alert__dropdown strong {
	display: block;
	margin-bottom: 6px;
	color: var(--harmony-navy);
	font-size: 14px;
}

.harmony-header-alert__dropdown p {
	margin: 0;
	color: var(--harmony-ink);
	font-size: 13px;
	line-height: 1.4;
}

.harmony-header-icon--mobile,
.harmony-header-alert--mobile {
	display: none;
}

.harmony-account-menu summary {
	overflow: hidden;
	padding: 0;
}

.harmony-account-menu__avatar {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	border-radius: 50%;
	object-fit: cover;
}

@media (max-width: 1040px) {
	.harmony-header-icon--desktop,
	.harmony-header-alert--desktop {
		display: none;
	}

	.harmony-header-icon--mobile,
	.harmony-header-alert--mobile {
		display: inline-grid;
	}

	.harmony-header__mobile-controls {
		gap: 8px;
	}

	.harmony-header-icon,
	.harmony-header-alert summary,
	.harmony-account-menu summary,
	.harmony-menu-toggle {
		width: 40px;
		height: 40px;
	}

	.harmony-header-alert--mobile .harmony-header-alert__dropdown {
		right: 0;
		width: min(260px, calc(100vw - 48px));
	}
}

/* Wider single-post reading layout with the article guide integrated into the hero. */
.harmony-single-hero__panel {
	display: grid;
	align-self: stretch;
	gap: 18px;
}

.harmony-single-hero__panel .harmony-single-media {
	width: 100%;
	max-width: none;
	justify-self: stretch;
}

.harmony-single-hero__panel .harmony-single-rail > div {
	position: static;
	top: auto;
	border-color: rgba(127, 156, 255, 0.2);
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 24px 58px rgba(67, 82, 145, 0.16);
}

.harmony-single-hero__panel .harmony-single-rail dl {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 18px;
}

.harmony-single-hero__panel .harmony-single-rail dl > div:last-child {
	grid-column: 1 / -1;
}

.harmony-single-layout {
	display: block;
	width: min(1120px, 100%);
	padding-top: clamp(64px, 8vw, 96px);
	padding-bottom: clamp(64px, 8vw, 96px);
}

/* Unified header utilities and mobile drawer. */
.harmony-mobile-account,
.harmony-mobile-app-nav,
.harmony-mobile-notifications,
.harmony-mobile-secondary-actions,
.harmony-mobile-utility-nav {
	display: none;
}

.harmony-header-icon svg,
.harmony-header-alert summary svg {
	width: 21px;
	height: 21px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.harmony-header-icon:hover,
.harmony-header-icon:focus-visible,
.harmony-header-alert summary:hover,
.harmony-header-alert summary:focus-visible {
	border-color: var(--harmony-purple);
	background: var(--harmony-lavender);
	color: #6347ba;
	outline: 3px solid rgba(169, 140, 255, 0.22);
	outline-offset: 2px;
}

.harmony-header-alert summary {
	position: relative;
}

.harmony-header-alert__count {
	position: absolute;
	top: -5px;
	right: -5px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	border: 2px solid #ffffff;
	border-radius: 999px;
	background: #d73f78;
	color: #ffffff;
	font-size: 10px;
	font-weight: 900;
	line-height: 1;
}

.harmony-notification-list {
	display: grid;
	gap: 6px;
	max-height: 330px;
	overflow-y: auto;
}

.harmony-notification-list a {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 2px 10px;
	padding: 10px;
	border-radius: 12px;
	color: var(--harmony-ink);
	text-decoration: none;
}

.harmony-notification-list a:hover,
.harmony-notification-list a:focus-visible {
	background: var(--harmony-lavender);
	outline: none;
}

.harmony-notification-list a span {
	grid-column: 1 / -1;
	color: #7658c7;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.harmony-notification-list a strong {
	min-width: 0;
	overflow: hidden;
	color: var(--harmony-navy);
	font-size: 13px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.harmony-notification-list a time {
	color: var(--harmony-muted);
	font-size: 12px;
	font-weight: 700;
}

.harmony-notification-empty {
	margin: 0;
	padding: 10px;
	color: var(--harmony-muted);
	font-size: 13px;
	line-height: 1.45;
}

@media (max-width: 1040px) {
	.harmony-header__inner {
		min-height: 68px;
	}

	.harmony-header__mobile-controls {
		display: flex;
		flex: 0 0 42px;
		width: 42px;
	}

	.harmony-menu-toggle,
	.harmony-account-menu summary,
	.harmony-header-icon,
	.harmony-header-alert summary {
		width: 42px;
		min-width: 42px;
		max-width: 42px;
		height: 42px;
		padding: 0;
	}

	.harmony-menu-toggle {
		display: inline-flex;
		flex: 0 0 42px;
		border-color: rgba(99, 71, 186, 0.28);
		border-radius: 11px;
		background: #ffffff;
		box-shadow: none;
	}

	.harmony-menu-toggle span {
		width: 18px;
		height: 2px;
		background: #5f43b2;
	}

	.harmony-menu-toggle span:nth-child(1) {
		top: 14px;
	}

	.harmony-menu-toggle span:nth-child(2) {
		top: 20px;
	}

	.harmony-menu-toggle span:nth-child(3) {
		top: 26px;
	}

	.harmony-menu-toggle.is-active span:nth-child(1),
	.harmony-menu-toggle.is-active span:nth-child(3) {
		top: 20px;
	}

	.harmony-logo__main {
		font-size: clamp(29px, 8vw, 38px);
	}

	.harmony-header__panel {
		top: 100%;
		left: 0;
		right: 0;
		align-content: start;
		gap: 16px;
		width: 100%;
		max-width: none;
		max-height: calc(100vh - 68px);
		max-height: calc(100dvh - 68px);
		padding: 18px clamp(16px, 5vw, 28px) 28px;
		border-width: 1px 0 0;
		border-radius: 0 0 20px 20px;
		overflow-y: auto;
		background: #ffffff;
		box-shadow: 0 24px 50px rgba(31, 24, 62, 0.18);
		transform: translateY(-6px);
	}

	.harmony-header__panel.is-open {
		transform: translateY(0);
	}

	.harmony-mobile-account {
		display: block;
		padding-bottom: 14px;
		border-bottom: 1px solid var(--harmony-line);
	}

	.harmony-mobile-account summary {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		align-items: center;
		gap: 12px;
		min-height: 58px;
		padding: 7px 12px 7px 7px;
		border: 1px solid rgba(127, 156, 255, 0.24);
		border-radius: 14px;
		background: #f8f6ff;
		cursor: pointer;
		list-style: none;
	}

	.harmony-mobile-account summary::-webkit-details-marker,
	.harmony-mobile-notifications summary::-webkit-details-marker {
		display: none;
	}

	.harmony-mobile-account[open] summary,
	.harmony-mobile-notifications[open] summary {
		border-color: rgba(99, 71, 186, 0.38);
		background: var(--harmony-lavender);
	}

	.harmony-mobile-account img {
		width: 44px;
		height: 44px;
		border: 2px solid #eee8ff;
		border-radius: 50%;
		object-fit: cover;
	}

	.harmony-mobile-account summary > div {
		display: grid;
		gap: 3px;
		min-width: 0;
	}

	.harmony-mobile-account summary > div span {
		color: var(--harmony-muted);
		font-size: 11px;
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}

	.harmony-mobile-account summary > div strong {
		min-width: 0;
		overflow: hidden;
		color: var(--harmony-navy);
		font-size: 15px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.harmony-mobile-dropdown-caret {
		display: block;
		width: 8px;
		height: 8px;
		margin-right: 3px;
		border-right: 2px solid #6f55bb;
		border-bottom: 2px solid #6f55bb;
		transform: translateY(-2px) rotate(45deg);
		transition: transform 0.2s ease;
	}

	.harmony-mobile-account[open] .harmony-mobile-dropdown-caret,
	.harmony-mobile-notifications[open] .harmony-mobile-dropdown-caret {
		transform: translateY(2px) rotate(225deg);
	}

	.harmony-mobile-account-menu {
		display: grid;
		gap: 3px;
		margin-top: 8px;
		padding: 6px;
		border: 1px solid var(--harmony-line);
		border-radius: 13px;
		background: #ffffff;
	}

	.harmony-mobile-app-nav {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 7px;
	}

	.harmony-mobile-app-nav a,
	.harmony-mobile-account-menu a,
	.harmony-mobile-utility-nav a {
		display: flex;
		align-items: center;
		min-height: 42px;
		padding: 10px 12px;
		border-radius: 11px;
		color: var(--harmony-ink);
		font-size: 14px;
		font-weight: 800;
		text-decoration: none;
	}

	.harmony-mobile-app-nav a {
		background: #f8f6ff;
	}

	.harmony-mobile-app-nav a:hover,
	.harmony-mobile-app-nav a:focus-visible,
	.harmony-mobile-account-menu a:hover,
	.harmony-mobile-account-menu a:focus-visible,
	.harmony-mobile-utility-nav a:hover,
	.harmony-mobile-utility-nav a:focus-visible {
		background: var(--harmony-lavender);
		color: #5f43b2;
		outline: 2px solid rgba(169, 140, 255, 0.28);
	}

	.harmony-mobile-notifications {
		display: block;
		width: 100%;
	}

	.harmony-mobile-notifications summary {
		position: relative;
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		align-items: center;
		gap: 8px;
		width: 100%;
		min-height: 46px;
		padding: 9px 10px;
		border: 1px solid rgba(127, 156, 255, 0.24);
		border-radius: 12px;
		background: #ffffff;
		color: var(--harmony-navy);
		cursor: pointer;
		list-style: none;
	}

	.harmony-mobile-notifications summary svg {
		width: 21px;
		height: 21px;
		fill: none;
		stroke: #6f55bb;
		stroke-width: 1.9;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	.harmony-mobile-notifications summary strong {
		min-width: 0;
		overflow: hidden;
		font-size: 14px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.harmony-mobile-notification-count {
		position: absolute;
		top: 5px;
		left: 23px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 22px;
		height: 22px;
		padding: 0 6px;
		border-radius: 999px;
		background: #d73f78;
		color: #ffffff;
		font-size: 11px;
		font-weight: 900;
	}

	.harmony-mobile-notification-panel {
		position: relative;
		z-index: 2;
		width: calc(200% + 8px);
		margin-top: 8px;
		padding: 6px;
		border: 1px solid var(--harmony-line);
		border-radius: 13px;
		background: #ffffff;
	}

	.harmony-mobile-section-heading {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		padding: 0 8px;
		color: var(--harmony-navy);
		font-size: 14px;
	}

	.harmony-mobile-section-heading span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 22px;
		height: 22px;
		padding: 0 6px;
		border-radius: 999px;
		background: #d73f78;
		color: #ffffff;
		font-size: 11px;
		font-weight: 900;
	}

	.harmony-notification-list--mobile {
		max-height: 240px;
		overflow-y: auto;
	}

	.harmony-mobile-utility-nav {
		display: grid;
		gap: 3px;
	}

	.harmony-mobile-secondary-actions {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: 8px;
	}

	.harmony-mobile-help-link {
		display: flex;
		align-items: center;
		width: 100%;
		min-height: 46px;
		padding: 9px 10px;
		gap: 10px;
		border: 1px solid rgba(127, 156, 255, 0.24);
		border-radius: 12px;
		background: #ffffff;
		color: var(--harmony-ink);
		font-size: 13px;
		font-weight: 800;
		text-decoration: none;
	}

	.harmony-mobile-help-link svg {
		width: 20px;
		height: 20px;
		fill: none;
		stroke: #6f55bb;
		stroke-width: 1.9;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	.harmony-mobile-help-link span {
		flex: 1;
	}

	.harmony-mobile-help-link .harmony-mobile-help-link__arrow {
		width: 14px;
		height: 14px;
		margin-left: auto;
	}

	body.logged-in .harmony-header__actions {
		display: none;
	}

	.harmony-account-menu--mobile,
	.harmony-header-icon--mobile,
	.harmony-header-alert--mobile {
		display: none !important;
	}
}

@media (max-width: 380px) {
	.harmony-logo__main {
		font-size: 27px;
	}

	.harmony-logo__by {
		display: none;
	}

	.harmony-logo__dayzy {
		font-size: 13px;
	}

	.harmony-mobile-app-nav {
		grid-template-columns: 1fr;
	}
}

.harmony-single-main {
	max-width: 1120px;
	margin: 0 auto;
	padding: clamp(30px, 5vw, 58px);
}

.harmony-single-editor,
.harmony-single-tags,
.harmony-single-nav {
	max-width: 980px;
	margin-right: auto;
	margin-left: auto;
}

.harmony-single-editor li > ul,
.harmony-single-editor li > ol {
	margin: 0.72em 0 0.2em;
	padding: 0 0 0 1.15em !important;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.harmony-single-editor li > ul li > ul,
.harmony-single-editor li > ul li > ol,
.harmony-single-editor li > ol li > ul,
.harmony-single-editor li > ol li > ol {
	padding-left: 1.15em !important;
}

@media (max-width: 900px) {
	.harmony-single-hero__panel {
		gap: 16px;
	}

	.harmony-single-hero__panel .harmony-single-rail dl {
		grid-template-columns: 1fr;
	}

	.harmony-single-hero__panel .harmony-single-rail dl > div:last-child {
		grid-column: auto;
	}

	.harmony-single-main {
		padding: 22px;
	}
}

/* Homepage hero refresh: calm planning rhythm instead of app mockups. */
.harmony-home-hero {
	padding: clamp(84px, 9vw, 118px) 0 clamp(74px, 8vw, 104px);
	background:
		radial-gradient(circle at 86% 14%, rgba(247, 164, 200, 0.3), transparent 34%),
		radial-gradient(circle at 8% 90%, rgba(127, 156, 255, 0.25), transparent 38%),
		linear-gradient(180deg, #ffffff 0%, #fbf7ff 100%);
}

.harmony-home-hero__grid {
	grid-template-columns: minmax(0, 0.86fr) minmax(320px, 0.58fr);
	gap: clamp(34px, 6vw, 68px);
}

.harmony-hero-rhythm {
	display: grid;
	gap: 18px;
}

.harmony-rhythm-calendar {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	align-items: end;
	gap: 10px;
	min-height: 330px;
	padding: 32px;
	border: 1px solid rgba(127, 156, 255, 0.18);
	border-radius: 38px;
	background:
		radial-gradient(circle at 12% 20%, rgba(247, 164, 200, 0.26), transparent 32%),
		linear-gradient(135deg, #ffffff, #f5f8ff);
	box-shadow: 0 30px 80px rgba(67, 82, 145, 0.12);
}

.harmony-rhythm-calendar span {
	display: grid;
	place-items: end center;
	min-height: var(--bar-height, 150px);
	padding: 14px 8px;
	border-radius: 999px 999px 18px 18px;
	background: rgba(127, 156, 255, 0.13);
	color: var(--harmony-blue);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-rhythm-calendar span:nth-child(1) { --bar-height: 118px; background: rgba(127, 156, 255, 0.13); }
.harmony-rhythm-calendar span:nth-child(2) { --bar-height: 184px; background: rgba(247, 164, 200, 0.24); }
.harmony-rhythm-calendar span:nth-child(3) { --bar-height: 142px; background: rgba(180, 214, 255, 0.36); }
.harmony-rhythm-calendar span:nth-child(4) { --bar-height: 214px; background: rgba(202, 183, 255, 0.24); }
.harmony-rhythm-calendar span:nth-child(5) { --bar-height: 166px; background: rgba(221, 244, 224, 0.42); }

.harmony-rhythm-calendar strong {
	position: absolute;
	top: 28px;
	left: 30px;
	color: var(--harmony-navy);
	font-size: clamp(24px, 3vw, 34px);
	line-height: 1.08;
}

.harmony-rhythm-note {
	padding: 24px;
	border: 1px solid rgba(127, 156, 255, 0.16);
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 22px 54px rgba(67, 82, 145, 0.08);
}

.harmony-rhythm-note span {
	display: block;
	margin-bottom: 10px;
	color: var(--harmony-purple);
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.harmony-rhythm-note strong {
	display: block;
	color: var(--harmony-navy);
	font-size: clamp(22px, 2.8vw, 30px);
	line-height: 1.12;
}

.harmony-rhythm-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.harmony-rhythm-tags span {
	display: inline-flex;
	min-height: 38px;
	align-items: center;
	padding: 9px 14px;
	border-radius: 999px;
	background: #ffffff;
	color: var(--harmony-navy);
	font-size: 13px;
	font-weight: 900;
	box-shadow: 0 12px 28px rgba(67, 82, 145, 0.08);
}

@media (max-width: 1040px) {
	.harmony-home-hero__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 620px) {
	.harmony-rhythm-calendar {
		min-height: 280px;
		padding: 26px 20px;
	}

	.harmony-rhythm-calendar strong {
		position: static;
		grid-column: 1 / -1;
		order: -1;
	}
}

/* Dayzy suite workspace — 2026 */
:root {
	--harmony-suite-canvas: #f6f5fa;
	--harmony-suite-surface: #ffffff;
	--harmony-suite-ink: #211d35;
	--harmony-suite-muted: #68637a;
	--harmony-suite-border: #e6e2ef;
	--harmony-suite-accent: #7654c5;
	--harmony-suite-accent-soft: #eee9fb;
	--harmony-suite-pink: #d86fa6;
}

.harmony-suite-app {
	min-height: 100vh;
	background: var(--harmony-suite-canvas);
	color: var(--harmony-suite-ink);
}

.harmony-suite-app .harmony-dashboard-shell {
	grid-template-columns: 236px minmax(0, 1fr);
	min-height: calc(100vh - 78px);
}

.harmony-suite-app .harmony-dashboard-sidebar {
	padding: 28px 16px;
	border-right: 1px solid var(--harmony-suite-border);
	background: rgba(255, 255, 255, 0.96);
}

.harmony-suite-app .harmony-dashboard-nav {
	gap: 5px;
}

.harmony-suite-app .harmony-dashboard-nav a {
	min-height: 46px;
	padding: 10px 12px;
	border-radius: 13px;
	color: #5e5870;
	font-size: 14px;
	font-weight: 800;
}

.harmony-suite-app .harmony-dashboard-nav a:hover,
.harmony-suite-app .harmony-dashboard-nav a:focus-visible {
	background: #f4f1fb;
	color: var(--harmony-suite-ink);
}

.harmony-suite-app .harmony-dashboard-nav a.is-active {
	background: var(--harmony-suite-accent-soft);
	color: #4f329c;
}

.harmony-suite-app .harmony-dashboard-nav i {
	display: grid;
	width: 25px;
	height: 25px;
	place-items: center;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.8);
	font-size: 13px;
	font-style: normal;
}

.harmony-suite-heading {
	padding: 54px 6% 48px;
	background:
		radial-gradient(circle at 14% 12%, rgba(230, 116, 177, 0.24), transparent 26%),
		linear-gradient(135deg, #251b45 0%, #49337c 58%, #312052 100%);
	color: #ffffff;
}

.harmony-suite-heading .harmony-eyebrow {
	margin: 0 0 10px;
	color: #f39ac9;
}

.harmony-suite-heading h1 {
	max-width: 760px;
	margin: 0 0 12px;
	color: #ffffff;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(38px, 5vw, 58px);
	line-height: 1.02;
	letter-spacing: -0.035em;
}

.harmony-suite-heading > .harmony-container > p:last-child {
	max-width: 680px;
	margin: 0;
	color: rgba(255, 255, 255, 0.82);
	font-size: 18px;
	line-height: 1.6;
}

.harmony-suite-content {
	padding: 34px 6% 76px;
	background: var(--harmony-suite-canvas);
}

.harmony-today-grid,
.harmony-calendar-workspace,
.harmony-tool-grid,
.harmony-module-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.55fr) minmax(300px, 0.75fr);
	gap: 20px;
	align-items: start;
	margin-bottom: 20px;
}

.harmony-module-layout > :only-child {
	grid-column: 1 / -1;
}

.harmony-workspace-panel {
	padding: 26px;
	border: 1px solid var(--harmony-suite-border);
	border-radius: 20px;
	background: var(--harmony-suite-surface);
	box-shadow: 0 14px 38px rgba(41, 31, 72, 0.055);
}

.harmony-workspace-panel > .harmony-eyebrow,
.harmony-panel-heading .harmony-eyebrow {
	margin: 0 0 7px;
	color: var(--harmony-suite-pink);
}

.harmony-workspace-panel > h2,
.harmony-panel-heading h2 {
	margin: 0;
	color: var(--harmony-suite-ink);
	font-size: clamp(23px, 3vw, 32px);
	line-height: 1.08;
}

.harmony-workspace-panel > p {
	color: var(--harmony-suite-muted);
	line-height: 1.65;
}

.harmony-panel-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 20px;
}

.harmony-panel-heading > a,
.harmony-inline-tabs a {
	color: var(--harmony-suite-accent);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
}

.harmony-agenda-list,
.harmony-action-list,
.harmony-record-list {
	display: grid;
	gap: 10px;
}

.harmony-agenda-list article {
	display: grid;
	grid-template-columns: 66px minmax(0, 1fr);
	gap: 15px;
	align-items: start;
	padding: 14px 0;
	border-bottom: 1px solid var(--harmony-suite-border);
}

.harmony-agenda-list article:last-child {
	border-bottom: 0;
}

.harmony-agenda-list time {
	display: grid;
	gap: 2px;
	padding: 8px;
	border-radius: 12px;
	background: #f5f2fb;
	text-align: center;
}

.harmony-agenda-list time b {
	color: var(--harmony-suite-accent);
	font-size: 12px;
	text-transform: uppercase;
}

.harmony-agenda-list time span {
	font-size: 13px;
	font-weight: 800;
}

.harmony-agenda-list h3,
.harmony-action-list h3,
.harmony-record-list h3 {
	margin: 5px 0 3px;
	color: var(--harmony-suite-ink);
	font-size: 17px;
	line-height: 1.25;
}

.harmony-agenda-list p,
.harmony-action-list p,
.harmony-record-list p {
	margin: 0;
	color: var(--harmony-suite-muted);
	font-size: 14px;
	line-height: 1.5;
}

.harmony-type-label,
.harmony-action-list article > div > span {
	color: var(--harmony-suite-pink);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.harmony-action-list article,
.harmony-record-list article {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 15px 16px;
	border: 1px solid #ece8f3;
	border-radius: 15px;
	background: #fcfbfe;
}

.harmony-action-list article.is-complete {
	opacity: 0.62;
}

.harmony-action-list article.is-complete h3 {
	text-decoration: line-through;
}

.harmony-row-actions {
	display: flex;
	gap: 7px;
}

.harmony-inline-editor {
	position: relative;
}

.harmony-inline-editor summary {
	display: inline-flex;
	min-height: 34px;
	align-items: center;
	padding: 7px 10px;
	border: 1px solid #dcd5ec;
	border-radius: 10px;
	background: #ffffff;
	color: #5c477e;
	font-size: 12px;
	font-weight: 900;
	cursor: pointer;
	list-style: none;
}

.harmony-inline-editor summary::-webkit-details-marker {
	display: none;
}

.harmony-inline-editor form {
	position: absolute;
	right: 0;
	top: calc(100% + 8px);
	z-index: 20;
	display: grid;
	width: min(360px, 78vw);
	gap: 8px;
	padding: 14px;
	border: 1px solid var(--harmony-suite-border);
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 20px 50px rgba(38, 28, 65, 0.16);
}

.harmony-inline-editor input,
.harmony-inline-editor select,
.harmony-inline-editor textarea {
	width: 100%;
	padding: 9px 10px;
	border: 1px solid #ddd7e8;
	border-radius: 9px;
	font: inherit;
}

.harmony-action-list button,
.harmony-record-list button {
	min-height: 34px;
	padding: 7px 10px;
	border: 1px solid #dcd5ec;
	border-radius: 10px;
	background: #ffffff;
	color: #5c477e;
	font: inherit;
	font-size: 12px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-action-list button.is-danger,
.harmony-record-list button.is-danger {
	border-color: #f0d1db;
	color: #a43f60;
}

.harmony-empty-state {
	padding: 24px;
	border: 1px dashed #d9d1e8;
	border-radius: 16px;
	background: #faf8fd;
}

.harmony-empty-state strong {
	display: block;
	margin-bottom: 5px;
	color: var(--harmony-suite-ink);
	font-size: 17px;
}

.harmony-empty-state p {
	margin: 0;
	color: var(--harmony-suite-muted);
}

.harmony-suite-app .harmony-mini-form {
	margin-top: 20px;
}

.harmony-suite-app .harmony-mini-form label > span {
	color: #554f65;
	font-size: 12px;
	font-weight: 900;
}

.harmony-suite-app .harmony-mini-form input,
.harmony-suite-app .harmony-mini-form select,
.harmony-suite-app .harmony-mini-form textarea {
	border-color: #ddd7e8;
	background: #ffffff;
}

.harmony-suite-app .harmony-mini-form input:focus,
.harmony-suite-app .harmony-mini-form select:focus,
.harmony-suite-app .harmony-mini-form textarea:focus {
	border-color: var(--harmony-suite-accent);
	box-shadow: 0 0 0 3px rgba(118, 84, 197, 0.12);
	outline: 0;
}

.harmony-suite-app .harmony-button--primary {
	background: linear-gradient(135deg, #7654c5, #9c64ba);
	box-shadow: none;
}

.harmony-calendar-workspace {
	grid-template-columns: minmax(0, 1fr) 330px;
}

.harmony-suite-app .harmony-planner-calendar {
	padding: 24px;
}

.harmony-suite-app .harmony-calendar-grid {
	gap: 5px;
}

.harmony-suite-app .harmony-calendar-day,
.harmony-suite-app .harmony-calendar-weekday {
	border-color: #e7e2ef;
	background: #ffffff;
}

.harmony-suite-app .harmony-calendar-day.is-today {
	border-color: var(--harmony-suite-accent);
	box-shadow: inset 0 0 0 1px var(--harmony-suite-accent);
}

.harmony-suite-app .harmony-calendar-chip.is-done {
	opacity: 0.55;
	text-decoration: line-through;
}

.harmony-inline-tabs {
	display: inline-flex;
	gap: 4px;
	padding: 4px;
	border-radius: 12px;
	background: #f3f0f8;
}

.harmony-inline-tabs a {
	padding: 7px 10px;
	border-radius: 9px;
}

.harmony-inline-tabs a.is-active {
	background: #ffffff;
	color: var(--harmony-suite-ink);
	box-shadow: 0 3px 10px rgba(45, 34, 78, 0.08);
}

.harmony-break-hero {
	background:
		radial-gradient(circle at 84% 18%, rgba(135, 185, 159, 0.28), transparent 28%),
		radial-gradient(circle at 14% 16%, rgba(247, 164, 200, 0.22), transparent 26%),
		linear-gradient(135deg, #241d3b 0%, #4b397b 58%, #2f3f64 100%);
}

.harmony-break-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.22fr) minmax(280px, 0.78fr);
	gap: 20px;
	align-items: stretch;
	margin-bottom: 20px;
}

.harmony-break-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(286px, 0.34fr);
	gap: 20px;
	align-items: start;
}

.harmony-break-main,
.harmony-break-side {
	min-width: 0;
}

.harmony-break-side {
	display: grid;
	gap: 20px;
}

.harmony-break-tab-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
	padding: 6px;
	border: 1px solid var(--harmony-suite-border);
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 10px 26px rgba(41, 31, 72, 0.045);
}

.harmony-break-tab-list button,
.harmony-coloring-filters button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 8px 14px;
	border: 1px solid transparent;
	border-radius: 12px;
	background: transparent;
	color: #5e5870;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-break-tab-list button:hover,
.harmony-break-tab-list button:focus-visible,
.harmony-coloring-filters button:hover,
.harmony-coloring-filters button:focus-visible {
	border-color: rgba(118, 84, 197, 0.18);
	background: #f6f2ff;
	color: var(--harmony-suite-ink);
	outline: 0;
}

.harmony-break-tab-list button.is-active,
.harmony-coloring-filters button.is-active {
	background: var(--harmony-suite-accent-soft);
	color: #4f329c;
	box-shadow: 0 6px 18px rgba(41, 31, 72, 0.08);
}

.harmony-break-tab-panel[hidden] {
	display: none;
}

.harmony-break-breath-panel,
.harmony-break-quote-panel,
.harmony-break-mini-panel,
.harmony-break-reset-panel {
	min-width: 0;
}

.harmony-break-breath-panel > p:not(.harmony-eyebrow),
.harmony-break-quote-panel > p {
	margin: 12px 0 0;
}

.harmony-breath-stage {
	position: relative;
	width: min(380px, 100%);
	margin: 24px auto;
}

.harmony-breath-orb {
	position: relative;
	display: grid;
	place-items: center;
	width: min(330px, 78vw);
	max-width: 100%;
	aspect-ratio: 1;
	margin: 0 auto;
	border: 1px solid rgba(118, 84, 197, 0.16);
	border-radius: 42%;
	background:
		radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.92) 0 20%, transparent 55%),
		linear-gradient(145deg, #f2edff, #e8f6ee);
	box-shadow: inset 0 0 60px rgba(255, 255, 255, 0.48);
	overflow: hidden;
	transition: width 0.35s ease, height 0.35s ease, border-radius 0.35s ease, background 0.35s ease;
}

.harmony-breath-orb::after {
	content: "";
	position: absolute;
	inset: 18px;
	border: 1px solid rgba(118, 84, 197, 0.13);
	border-radius: 38%;
	pointer-events: none;
}

.harmony-breath-motion {
	position: absolute;
	z-index: 1;
	display: block;
	inset: 12%;
}

.harmony-breath-defs {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.harmony-breath-motion i {
	position: absolute;
	display: none;
	background: linear-gradient(145deg, rgba(118, 84, 197, 0.58), rgba(135, 185, 159, 0.72));
	box-shadow: 0 10px 28px rgba(86, 61, 147, 0.16);
}

.harmony-breath-wave,
.harmony-breath-orbit-map {
	display: none;
}

.harmony-breath-cue {
	margin: 10px 0 0;
	color: #473763;
	text-align: center;
}

.harmony-breath-cue b {
	display: inline-block;
	font-size: 12px;
	font-weight: 900;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.harmony-breath-motion-toggle {
	display: inline-flex;
	gap: 7px;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	margin: 7px auto 0;
	padding: 7px 12px;
	border: 1px solid rgba(118, 84, 197, 0.18);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.86);
	color: #5a4a75;
	font: inherit;
	font-size: 11px;
	font-weight: 800;
	cursor: pointer;
}

.harmony-breath-motion-toggle:hover,
.harmony-breath-motion-toggle:focus-visible {
	border-color: rgba(118, 84, 197, 0.38);
	background: #ffffff;
	color: #4f329c;
	outline: 0;
}

/* Drift: overlapping, rounded forms continuously pour into one another. */
.harmony-breath-orb.is-drift {
	border-radius: 45% 55% 48% 52% / 54% 44% 56% 46%;
}

.harmony-breath-orb.is-drift .harmony-breath-motion {
	inset: 14%;
	filter: url("#harmonyBreathGoo") saturate(1.08);
	animation: harmonyBreathLavaField 12s cubic-bezier(0.45, 0.05, 0.32, 1) infinite;
}

.harmony-breath-orb.is-drift .harmony-breath-motion::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: 14%;
	left: 12%;
	width: 76%;
	height: 70%;
	border-radius: 58% 42% 63% 37% / 46% 60% 40% 54%;
	background: linear-gradient(145deg, rgba(118, 84, 197, 0.62), rgba(135, 185, 159, 0.74));
	box-shadow: 0 18px 42px rgba(86, 61, 147, 0.14);
	animation: harmonyBreathLavaCore 11s ease-in-out infinite;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i {
	z-index: 2;
	display: block;
	width: 48%;
	height: 48%;
	border-radius: 58% 42% 63% 37% / 46% 60% 40% 54%;
	background: linear-gradient(145deg, rgba(118, 84, 197, 0.56), rgba(135, 185, 159, 0.68));
	box-shadow: none;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i:nth-child(1) {
	top: 1%;
	left: 35%;
	width: 43%;
	height: 51%;
	opacity: 0.76;
	animation: harmonyBreathLavaA 9s ease-in-out infinite;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i:nth-child(2) {
	top: 30%;
	left: 0;
	width: 50%;
	height: 46%;
	opacity: 0.68;
	animation: harmonyBreathLavaB 11s ease-in-out -2.8s infinite;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i:nth-child(3) {
	top: 30%;
	left: 51%;
	width: 48%;
	height: 51%;
	opacity: 0.7;
	animation: harmonyBreathLavaC 10s ease-in-out -4.2s infinite;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i:nth-child(4) {
	top: 61%;
	left: 27%;
	width: 47%;
	height: 36%;
	opacity: 0.64;
	animation: harmonyBreathLavaB 12s ease-in-out -6s infinite reverse;
}

.harmony-breath-orb.is-drift .harmony-breath-motion i:nth-child(n+5) {
	display: none;
}

/* Current: a flat wave travels continuously from left to right. */
.harmony-breath-orb.is-current {
	border-radius: 34px;
}

.harmony-breath-orb.is-current .harmony-breath-motion {
	inset: 21% 0;
	overflow: hidden;
}

.harmony-breath-orb.is-current .harmony-breath-wave {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.harmony-breath-wave path {
	fill: none;
	stroke: #ffffff;
	stroke-linecap: round;
	transform-box: fill-box;
	transform-origin: center;
}

.harmony-breath-wave-line {
	stroke-width: 9;
	animation:
		harmonyBreathWaveTravel 5.5s linear infinite,
		harmonyBreathWaveWeight 10s ease-in-out infinite;
}

.harmony-breath-wave-echo {
	stroke-width: 4;
	opacity: 0.28;
	animation:
		harmonyBreathWaveTravel 5.5s linear -2.75s infinite,
		harmonyBreathWaveEchoWeight 10s ease-in-out infinite;
}

.harmony-breath-wave-fill:not(.harmony-breath-wave-fill--echo) {
	filter: drop-shadow(0 10px 14px rgba(86, 61, 147, 0.2));
}

.harmony-breath-wave-fill--echo {
	opacity: 0.72;
}

.harmony-breath-orb.is-current .harmony-breath-motion i {
	display: none;
}

/* Orbit: a small planetary system connected by clean relationship lines. */
.harmony-breath-orb.is-orbit {
	border-radius: 50%;
}

.harmony-breath-orb.is-orbit .harmony-breath-motion {
	inset: 11%;
	border-radius: 50%;
	animation: harmonyBreathPlanetSystem 10s ease-in-out infinite;
}

.harmony-breath-orb.is-orbit .harmony-breath-orbit-map {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
	filter: drop-shadow(0 14px 20px rgba(86, 61, 147, 0.13));
}

.harmony-breath-orbit-lines line {
	stroke: rgba(99, 77, 151, 0.34);
	stroke-width: 2.5;
	stroke-linecap: round;
}

.harmony-breath-planets circle {
	fill: url("#harmonyBreathPlanetGradient");
	stroke: rgba(255, 255, 255, 0.86);
	stroke-width: 3;
}

.harmony-breath-orb.is-orbit .harmony-breath-motion i {
	display: none;
}

/* Bloom: rounded petals turn and unfold without a pointed outer silhouette. */
.harmony-breath-orb.is-bloom {
	border-radius: 46% 54% 50% 50% / 55% 47% 53% 45%;
}

.harmony-breath-orb.is-bloom .harmony-breath-motion {
	inset: 18%;
	animation: harmonyBreathBloomField 10s cubic-bezier(0.45, 0.05, 0.32, 1) infinite;
}

.harmony-breath-orb.is-bloom .harmony-breath-motion i {
	top: 34%;
	left: 38%;
	display: block;
	width: 24%;
	height: 34%;
	border-radius: 70% 48% 66% 50%;
	transform-origin: 50% 50%;
}

.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(1) { transform: translateY(-72%) rotate(0deg); }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(2) { transform: translate(54%, -48%) rotate(45deg); opacity: 0.82; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(3) { transform: translateX(76%) rotate(90deg); opacity: 0.7; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(4) { transform: translate(54%, 48%) rotate(135deg); opacity: 0.82; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(5) { transform: translateY(72%) rotate(180deg); }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(6) { transform: translate(-54%, 48%) rotate(225deg); opacity: 0.82; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(7) { transform: translateX(-76%) rotate(270deg); opacity: 0.7; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(8) { transform: translate(-54%, -48%) rotate(315deg); opacity: 0.82; }
.harmony-breath-orb.is-bloom .harmony-breath-motion i:nth-child(n+9) { display: none; }

/* The original Harmony breathing meter remains available as requested. */
.harmony-breath-orb.is-classic {
	border-radius: 42%;
}

.harmony-breath-orb.is-classic .harmony-breath-motion {
	top: 50%;
	right: 20px;
	bottom: auto;
	left: 20px;
	height: 86px;
	padding: 10px;
	border: 1px solid rgba(118, 84, 197, 0.16);
	border-radius: 22px;
	background: linear-gradient(135deg, #fbf9ff 0%, #f3fbf5 100%);
	overflow: hidden;
	transform: translateY(-50%);
}

.harmony-breath-orb.is-classic .harmony-breath-motion i {
	top: 10px;
	right: 10px;
	display: none;
	width: 42%;
	height: calc(100% - 20px);
	border-radius: 16px;
	background: linear-gradient(135deg, rgba(118, 84, 197, 0.24), rgba(135, 185, 159, 0.32));
	box-shadow: none;
}

.harmony-breath-orb.is-classic .harmony-breath-motion i:first-of-type {
	display: block;
	animation: harmonyBreathClassicMeter 6s ease-in-out infinite;
}

.harmony-breath-orb.is-paused .harmony-breath-motion,
.harmony-breath-orb.is-paused .harmony-breath-motion i,
.harmony-breath-orb.is-paused .harmony-breath-motion::before,
.harmony-breath-orb.is-paused .harmony-breath-motion::after,
.harmony-breath-orb.is-paused .harmony-breath-wave path {
	animation-play-state: paused !important;
}

@keyframes harmonyBreathLavaField {
	0%, 100% { transform: translate(-5%, 6%) rotate(-7deg) scale(0.84, 0.9); }
	38% { transform: translate(5%, -4%) rotate(4deg) scale(1, 1.03); }
	68% { transform: translate(2%, 1%) rotate(9deg) scale(0.94, 1); }
}

@keyframes harmonyBreathLavaCore {
	0%, 100% { transform: rotate(-10deg) scale(0.9, 1.06); border-radius: 58% 42% 63% 37% / 46% 60% 40% 54%; }
	32% { transform: rotate(8deg) scale(1.08, 0.88); border-radius: 37% 63% 44% 56% / 62% 38% 66% 34%; }
	64% { transform: rotate(24deg) scale(0.92, 1.12); border-radius: 66% 34% 57% 43% / 35% 61% 39% 65%; }
	82% { transform: rotate(12deg) scale(1.04, 0.94); border-radius: 43% 57% 68% 32% / 58% 42% 54% 46%; }
}

@keyframes harmonyBreathLavaA {
	0%, 100% { transform: translate(-8%, -4%) rotate(-12deg) scale(0.9, 1.08); border-radius: 58% 42% 63% 37% / 46% 60% 40% 54%; }
	34% { transform: translate(22%, 18%) rotate(12deg) scale(1.18, 0.82); border-radius: 38% 62% 46% 54% / 64% 40% 60% 36%; }
	68% { transform: translate(5%, 36%) rotate(28deg) scale(0.86, 1.16); border-radius: 66% 34% 58% 42% / 38% 56% 44% 62%; }
}

@keyframes harmonyBreathLavaB {
	0%, 100% { transform: translate(8%, -10%) rotate(8deg) scale(1.06, 0.86); border-radius: 44% 56% 68% 32% / 62% 36% 64% 38%; }
	42% { transform: translate(-25%, 24%) rotate(-18deg) scale(0.82, 1.18); border-radius: 64% 36% 42% 58% / 40% 66% 34% 60%; }
	72% { transform: translate(-4%, 38%) rotate(-34deg) scale(1.16, 0.88); border-radius: 36% 64% 56% 44% / 68% 42% 58% 32%; }
}

@keyframes harmonyBreathLavaC {
	0%, 100% { transform: translate(-5%, 12%) rotate(-4deg) scale(0.88, 1.12); border-radius: 62% 38% 50% 50% / 40% 58% 42% 60%; }
	45% { transform: translate(18%, -22%) rotate(22deg) scale(1.2, 0.82); border-radius: 42% 58% 66% 34% / 58% 38% 62% 42%; }
	76% { transform: translate(-18%, -4%) rotate(38deg) scale(0.9, 1.14); border-radius: 68% 32% 38% 62% / 34% 64% 36% 66%; }
}

@keyframes harmonyBreathWaveTravel {
	from { transform: translateX(-270px); }
	to { transform: translateX(0); }
}

@keyframes harmonyBreathWaveWeight {
	0%, 100% { stroke-width: 8; }
	50% { stroke-width: 18; }
}

@keyframes harmonyBreathWaveEchoWeight {
	0%, 100% { stroke-width: 3; opacity: 0.2; }
	50% { stroke-width: 9; opacity: 0.42; }
}

@keyframes harmonyBreathPlanetSystem {
	0%, 100% { transform: scale(0.82); }
	50% { transform: scale(1); }
}

@keyframes harmonyBreathBloomField {
	0%, 100% { transform: translate(-4%, 4%) rotate(-14deg) scale(0.62); }
	40% { transform: translate(4%, -3%) rotate(24deg) scale(1); }
	65% { transform: translate(1%, -1%) rotate(38deg) scale(0.92); }
}

@keyframes harmonyBreathClassicMeter {
	0%, 100% { width: 34%; }
	50% { width: 82%; }
}

@media (prefers-reduced-motion: reduce) {
	.harmony-breath-motion,
	.harmony-breath-motion i,
	.harmony-breath-motion::before,
	.harmony-breath-motion::after,
	.harmony-breath-wave path {
		animation: none !important;
	}

	.harmony-breath-orb.is-classic .harmony-breath-motion i:first-of-type {
		width: 58%;
	}
}

.harmony-breath-guide {
	margin: 24px 0 20px;
	padding: 20px;
	border: 1px solid rgba(118, 84, 197, 0.14);
	border-radius: 22px;
	background: linear-gradient(145deg, #fcfbff, #f6fbf8);
}

.harmony-break-disclosure {
	margin-top: 16px;
	border: 1px solid #e7e1ef;
	border-radius: 18px;
	background: #ffffff;
	overflow: hidden;
}

.harmony-break-disclosure > summary {
	display: flex;
	gap: 14px;
	align-items: center;
	justify-content: space-between;
	min-height: 64px;
	padding: 14px 16px;
	color: var(--harmony-suite-ink);
	list-style: none;
	cursor: pointer;
}

.harmony-break-disclosure > summary::-webkit-details-marker {
	display: none;
}

.harmony-break-disclosure > summary > span {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 2px 10px;
	align-items: center;
}

.harmony-break-disclosure > summary > span > i {
	grid-row: 1 / span 2;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 13px;
	background: var(--harmony-suite-accent-soft);
	color: #6749aa;
}

.harmony-break-disclosure > summary strong,
.harmony-break-disclosure > summary small {
	display: block;
}

.harmony-break-disclosure > summary strong {
	font-size: 15px;
}

.harmony-break-disclosure > summary small {
	color: var(--harmony-suite-muted);
	font-size: 12px;
	font-weight: 700;
}

.harmony-break-disclosure > summary > i {
	color: #7654c5;
	transition: transform 0.2s ease;
}

.harmony-break-disclosure[open] > summary > i {
	transform: rotate(180deg);
}

.harmony-break-disclosure-body {
	padding: 0 16px 16px;
	border-top: 1px solid #eee9f4;
}

.harmony-break-disclosure-body > p {
	margin: 14px 0;
	color: var(--harmony-suite-muted);
	font-size: 13px;
	line-height: 1.55;
}

.harmony-breath-shape-picker {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 9px;
}

.harmony-breath-shape-picker button {
	display: grid;
	place-items: center;
	gap: 4px;
	min-width: 0;
	padding: 13px 8px;
	border: 1px solid #e5dfed;
	border-radius: 15px;
	background: #fbfafe;
	color: #544c63;
	font: inherit;
	cursor: pointer;
}

.harmony-breath-shape-picker button i {
	color: #7654c5;
	font-size: 20px;
}

.harmony-breath-shape-picker button span {
	font-size: 13px;
	font-weight: 900;
}

.harmony-breath-shape-picker button small {
	color: var(--harmony-suite-muted);
	font-size: 10px;
	line-height: 1.2;
}

.harmony-breath-shape-picker button.is-active {
	border-color: rgba(118, 84, 197, 0.42);
	background: var(--harmony-suite-accent-soft);
	box-shadow: 0 7px 18px rgba(73, 50, 128, 0.09);
}

.harmony-stretch-disclosure {
	margin-top: 18px;
}

.harmony-stretch-disclosure .harmony-guided-reset {
	margin: 16px 0 0;
}

.harmony-break-steps {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.harmony-break-steps li,
.harmony-reset-list article,
.harmony-break-mini-panel a {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px;
	border: 1px solid #ece8f3;
	border-radius: 16px;
	background: #fcfbfe;
}

.harmony-break-steps strong,
.harmony-reset-list strong,
.harmony-break-mini-panel span {
	display: block;
	color: var(--harmony-suite-ink);
	font-weight: 900;
}

.harmony-break-steps span,
.harmony-reset-list span {
	display: block;
	margin-top: 3px;
	color: var(--harmony-suite-muted);
	font-size: 14px;
	line-height: 1.5;
}

.harmony-break-quote-panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(241, 237, 255, 0.82)),
		#ffffff;
}

.harmony-break-quote-panel h2 {
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(28px, 4vw, 42px);
	line-height: 1.06;
}

.harmony-break-tab-list .harmony-break-surprise {
	margin-left: auto;
	background: linear-gradient(135deg, #7654c5, #d85d97);
	color: #ffffff;
}

.harmony-break-tab-list .harmony-break-surprise:hover,
.harmony-break-tab-list .harmony-break-surprise:focus-visible {
	border-color: transparent;
	background: linear-gradient(135deg, #6542b9, #c84984);
	color: #ffffff;
}

.harmony-break-surprise i,
.harmony-break-side-surprise i {
	margin-right: 7px;
}

.harmony-guided-reset {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 18px 24px;
	align-items: center;
	margin-top: 24px;
	padding: 20px;
	border: 1px solid rgba(118, 84, 197, 0.2);
	border-radius: 20px;
	background: linear-gradient(135deg, #f7f3ff 0%, #f2fbf5 100%);
}

.harmony-guided-reset-copy h3 {
	margin: 5px 0 6px;
	color: var(--harmony-suite-ink);
	font-size: clamp(21px, 3vw, 28px);
	line-height: 1.15;
}

.harmony-guided-reset-copy > p:last-child {
	margin: 0;
	color: var(--harmony-suite-muted);
	line-height: 1.55;
}

.harmony-guided-reset-timer {
	display: grid;
	place-items: center;
	min-width: 126px;
	min-height: 108px;
	padding: 14px;
	border: 1px solid rgba(118, 84, 197, 0.18);
	border-radius: 18px;
	background: rgba(255, 255, 255, 0.88);
	box-shadow: 0 10px 26px rgba(56, 39, 96, 0.08);
	text-align: center;
}

.harmony-guided-reset-timer strong {
	display: block;
	color: #4b337e;
	font-size: 31px;
	font-variant-numeric: tabular-nums;
	line-height: 1;
}

.harmony-guided-reset-timer span {
	max-width: 104px;
	color: var(--harmony-suite-muted);
	font-size: 11px;
	font-weight: 800;
	line-height: 1.25;
}

.harmony-guided-reset-progress {
	grid-column: 1 / -1;
	height: 7px;
	border-radius: 999px;
	background: rgba(118, 84, 197, 0.12);
	overflow: hidden;
}

.harmony-guided-reset-progress i {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #7654c5, #87b99f);
	transition: width 0.35s ease;
}

.harmony-guided-reset-actions {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.harmony-guided-reset-actions button,
.harmony-puzzle-footer button,
.harmony-word-game button,
.harmony-quote-next,
.harmony-break-side-surprise {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 10px 16px;
	border: 1px solid rgba(118, 84, 197, 0.22);
	border-radius: 13px;
	background: #7654c5;
	color: #ffffff;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-guided-reset-actions button:last-child,
.harmony-word-game button.is-secondary {
	background: #ffffff;
	color: #513c85;
}

.harmony-guided-reset-actions button:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.harmony-guided-reset.is-complete {
	border-color: rgba(80, 163, 117, 0.35);
	background: linear-gradient(135deg, #f1fff6, #faf7ff);
}

.harmony-break-nature .harmony-panel-heading p,
.harmony-break-stories .harmony-panel-heading p,
.harmony-break-puzzles .harmony-panel-heading p,
.harmony-break-move .harmony-panel-heading p {
	max-width: 680px;
}

.harmony-sound-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 20px;
}

.harmony-sound-card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: 13px;
	align-items: center;
	min-width: 0;
	padding: 16px;
	border: 1px solid #e8e3f0;
	border-radius: 18px;
	background: #fcfbfe;
	transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.harmony-sound-card.is-playing {
	border-color: rgba(118, 84, 197, 0.38);
	background: linear-gradient(135deg, #f3edff, #eef9f2);
	transform: translateY(-2px);
}

.harmony-sound-icon {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	border-radius: 15px;
	background: var(--harmony-suite-accent-soft);
	color: #6847b2;
	font-size: 18px;
}

.harmony-sound-copy {
	min-width: 0;
}

.harmony-sound-copy h3 {
	margin: 0;
	color: var(--harmony-suite-ink);
	font-size: 16px;
	line-height: 1.2;
}

.harmony-sound-copy p {
	margin: 4px 0;
	color: var(--harmony-suite-muted);
	font-size: 13px;
	line-height: 1.45;
}

.harmony-sound-copy small {
	display: block;
	color: #7a7389;
	font-size: 10px;
	font-weight: 800;
}

.harmony-sound-toggle {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: #7654c5;
	color: #ffffff;
	cursor: pointer;
}

.harmony-sound-toggle span {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.harmony-sound-card.is-playing .harmony-sound-toggle {
	background: #3d8a63;
}

.harmony-sound-volume {
	display: flex;
	gap: 10px;
	align-items: center;
	max-width: 420px;
	margin-top: 20px;
	color: var(--harmony-suite-ink);
	font-size: 13px;
	font-weight: 900;
}

.harmony-sound-volume input {
	flex: 1;
	accent-color: #7654c5;
}

.harmony-sound-credit,
.harmony-move-note {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	margin: 14px 0 0;
	color: var(--harmony-suite-muted);
	font-size: 12px;
	line-height: 1.5;
}

.harmony-story-list {
	display: grid;
	gap: 12px;
	margin-top: 20px;
}

.harmony-story {
	border: 1px solid #e8e3f0;
	border-radius: 18px;
	background: #fcfbfe;
	overflow: hidden;
}

.harmony-story summary {
	display: flex;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	padding: 17px 18px;
	list-style: none;
	cursor: pointer;
}

.harmony-story summary::-webkit-details-marker {
	display: none;
}

.harmony-story summary span,
.harmony-story summary strong,
.harmony-story summary small {
	display: block;
}

.harmony-story summary small {
	margin-bottom: 4px;
	color: #7654c5;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.harmony-story summary strong {
	color: var(--harmony-suite-ink);
	font-size: 19px;
	line-height: 1.25;
}

.harmony-story summary i {
	color: #7654c5;
	transition: transform 0.2s ease;
}

.harmony-story[open] summary i {
	transform: rotate(180deg);
}

.harmony-story-body {
	max-width: 720px;
	padding: 2px 22px 24px;
	color: #423b50;
}

.harmony-story-body p {
	margin: 0 0 1em;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 17px;
	line-height: 1.72;
}

.harmony-story-shelf {
	margin-top: 20px;
}

.harmony-story-picker {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(190px, 0.34fr);
	gap: 9px;
	padding: 3px 2px 12px;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: x proximity;
	scrollbar-color: rgba(118, 84, 197, 0.25) transparent;
}

.harmony-story-picker button {
	display: grid;
	gap: 4px;
	align-content: center;
	min-height: 74px;
	padding: 12px 14px;
	border: 1px solid #e6e0ed;
	border-radius: 15px;
	background: #fbfafe;
	color: var(--harmony-suite-ink);
	font: inherit;
	text-align: left;
	scroll-snap-align: start;
	cursor: pointer;
}

.harmony-story-picker button small {
	color: #7654c5;
	font-size: 10px;
	font-weight: 900;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.harmony-story-picker button strong {
	font-size: 14px;
	line-height: 1.25;
}

.harmony-story-picker button.is-active {
	border-color: rgba(118, 84, 197, 0.38);
	background: var(--harmony-suite-accent-soft);
	box-shadow: 0 8px 20px rgba(64, 44, 113, 0.08);
}

.harmony-story-stage {
	border: 1px solid #e8e3f0;
	border-radius: 20px;
	background:
		linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(246, 251, 248, 0.9)),
		#ffffff;
	overflow: hidden;
}

.harmony-story-stage .harmony-story {
	border: 0;
	border-radius: 0;
	background: transparent;
}

.harmony-story[hidden] {
	display: none;
}

.harmony-story header {
	padding: 22px 24px 8px;
}

.harmony-story header h3 {
	margin: 5px 0 0;
	color: var(--harmony-suite-ink);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(28px, 4vw, 38px);
	line-height: 1.08;
}

.harmony-story-stage .harmony-story-body {
	max-height: min(58vh, 620px);
	max-width: none;
	padding: 10px 24px 26px;
	overflow-y: auto;
	scrollbar-color: rgba(118, 84, 197, 0.28) transparent;
}

.harmony-story-stage .harmony-story-body:focus-visible {
	outline: 3px solid rgba(118, 84, 197, 0.24);
	outline-offset: -5px;
}

.harmony-story-controls {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 12px;
	align-items: center;
	margin-top: 12px;
}

.harmony-story-controls button {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 10px 14px;
	border: 1px solid rgba(118, 84, 197, 0.22);
	border-radius: 13px;
	background: #ffffff;
	color: #513c85;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-story-controls button:last-child {
	justify-self: end;
	background: #7654c5;
	color: #ffffff;
}

.harmony-story-controls p {
	margin: 0;
	color: var(--harmony-suite-muted);
	font-size: 12px;
	white-space: nowrap;
}

.harmony-puzzle-picker {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(110px, 0.22fr);
	gap: 8px;
	margin: 20px 0 16px;
	padding: 6px;
	border-radius: 15px;
	background: #f2eff7;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scrollbar-color: rgba(118, 84, 197, 0.26) transparent;
}

.harmony-puzzle-picker button {
	display: flex;
	gap: 8px;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 9px 12px;
	border: 0;
	border-radius: 11px;
	background: transparent;
	color: #625a72;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-puzzle-picker button.is-active {
	background: #ffffff;
	color: #513c85;
	box-shadow: 0 6px 16px rgba(52, 38, 89, 0.08);
}

.harmony-puzzle-panel {
	padding: 18px;
	border: 1px solid #e8e3f0;
	border-radius: 18px;
	background: linear-gradient(145deg, #fcfbfe, #f7fbf8);
}

.harmony-puzzle-panel[hidden] {
	display: none;
}

.harmony-puzzle-heading,
.harmony-puzzle-footer {
	display: flex;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
}

.harmony-puzzle-heading h3 {
	margin: 0 0 3px;
	color: var(--harmony-suite-ink);
	font-size: 21px;
}

.harmony-puzzle-heading p,
.harmony-puzzle-footer p {
	margin: 0;
	color: var(--harmony-suite-muted);
	font-size: 13px;
}

.harmony-puzzle-heading > span {
	padding: 7px 10px;
	border-radius: 999px;
	background: var(--harmony-suite-accent-soft);
	color: #5d438e;
	font-size: 11px;
	font-weight: 900;
	white-space: nowrap;
}

.harmony-memory-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 9px;
	max-width: 520px;
	margin: 18px auto;
}

.harmony-memory-grid button {
	position: relative;
	aspect-ratio: 1;
	padding: 0;
	border: 0;
	border-radius: 16px;
	background: #7654c5;
	color: #ffffff;
	font-size: 23px;
	cursor: pointer;
	transform-style: preserve-3d;
	transition: transform 0.25s ease, background 0.2s ease;
}

.harmony-memory-grid button span {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	backface-visibility: hidden;
}

.harmony-memory-face {
	transform: rotateY(180deg);
}

.harmony-memory-grid button.is-open,
.harmony-memory-grid button.is-matched {
	background: #ffffff;
	color: #7654c5;
	box-shadow: inset 0 0 0 2px rgba(118, 84, 197, 0.25);
	transform: rotateY(180deg);
}

.harmony-memory-grid button.is-matched {
	color: #3d8a63;
	box-shadow: inset 0 0 0 2px rgba(61, 138, 99, 0.3);
}

.harmony-word-game {
	max-width: 560px;
	margin: 0 auto;
	text-align: center;
}

.harmony-word-game > strong {
	display: block;
	margin: 12px 0 8px;
	color: #513c85;
	font-size: clamp(34px, 7vw, 56px);
	letter-spacing: 0.12em;
	line-height: 1;
}

.harmony-word-game > p:not(.harmony-eyebrow) {
	margin: 8px 0 16px;
	color: var(--harmony-suite-muted);
}

.harmony-word-game label {
	display: block;
	margin: 0 0 7px;
	color: var(--harmony-suite-ink);
	font-size: 13px;
	font-weight: 900;
	text-align: left;
}

.harmony-word-game input {
	width: 100%;
	height: 48px;
	padding: 10px 14px;
	border: 1px solid #ddd6e8;
	border-radius: 13px;
	background: #ffffff;
	font: inherit;
}

.harmony-word-game > div {
	display: flex;
	gap: 10px;
	justify-content: center;
	margin-top: 12px;
}

.harmony-word-game p.is-correct {
	color: #2f7b55;
	font-weight: 800;
}

.harmony-word-game p.is-try-again {
	color: #9a5b30;
	font-weight: 800;
}

.harmony-slide-grid {
	display: grid;
	grid-template-columns: repeat(3, 82px);
	gap: 8px;
	justify-content: center;
	margin: 20px auto;
}

.harmony-slide-grid button {
	width: 82px;
	height: 82px;
	border: 0;
	border-radius: 16px;
	background: linear-gradient(145deg, #7654c5, #6042a6);
	box-shadow: 0 8px 16px rgba(64, 43, 112, 0.16);
	color: #ffffff;
	font: inherit;
	font-size: 26px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-slide-grid button.is-empty {
	background: rgba(118, 84, 197, 0.08);
	box-shadow: inset 0 0 0 1px rgba(118, 84, 197, 0.1);
}

.harmony-slide-grid.is-solved button:not(.is-empty) {
	background: linear-gradient(145deg, #4d9a70, #357a55);
}

.harmony-puzzle-footer > div {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.harmony-puzzle-footer button.is-secondary {
	background: #ffffff;
	color: #513c85;
}

.harmony-sudoku-grid,
.harmony-lights-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 4px;
	width: min(100%, 350px);
	margin: 20px auto;
	padding: 7px;
	border: 3px solid #6045a1;
	border-radius: 16px;
	background: #6045a1;
}

.harmony-sudoku-grid input {
	width: 100%;
	aspect-ratio: 1;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: #ffffff;
	color: var(--harmony-suite-ink);
	font: inherit;
	font-size: 23px;
	font-weight: 900;
	text-align: center;
}

.harmony-sudoku-grid input:nth-child(2),
.harmony-sudoku-grid input:nth-child(6),
.harmony-sudoku-grid input:nth-child(10),
.harmony-sudoku-grid input:nth-child(14) {
	margin-right: 4px;
}

.harmony-sudoku-grid input:nth-child(n+5):nth-child(-n+8) {
	margin-bottom: 4px;
}

.harmony-sudoku-grid input.is-given {
	background: #ece5fb;
	color: #513c85;
}

.harmony-sudoku-grid input.is-wrong {
	background: #fff0ed;
	box-shadow: inset 0 0 0 2px #d56b54;
}

.harmony-lights-grid {
	gap: 8px;
	padding: 10px;
	border: 0;
	background: #322842;
}

.harmony-lights-grid button {
	aspect-ratio: 1;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 13px;
	background: #453852;
	color: #8b7c9d;
	font-size: 22px;
	cursor: pointer;
}

.harmony-lights-grid button.is-on {
	background: #f4d36a;
	box-shadow: 0 0 22px rgba(244, 211, 106, 0.52);
	color: #745713;
}

.harmony-maze-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 3px;
	width: min(100%, 390px);
	aspect-ratio: 1;
	margin: 20px auto 12px;
	padding: 8px;
	border: 2px solid #7654c5;
	border-radius: 18px;
	background: #f0ebf7;
}

.harmony-maze-grid span {
	display: grid;
	place-items: center;
	border-radius: 6px;
}

.harmony-maze-grid .is-wall {
	background: #5d4974;
}

.harmony-maze-grid .is-path {
	background: #ffffff;
}

.harmony-maze-grid .is-player {
	background: #f8d9ed;
	color: #bf4e8a;
	font-size: 17px;
}

.harmony-maze-grid .is-goal {
	background: #dff3e5;
	color: #3d8a63;
	font-size: 18px;
}

.harmony-maze-controls {
	display: grid;
	grid-template-columns: repeat(3, 48px);
	grid-template-areas:
		". up ."
		"left down right";
	gap: 6px;
	justify-content: center;
	margin: 0 auto 18px;
}

.harmony-maze-controls button {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 1px solid rgba(118, 84, 197, 0.2);
	border-radius: 14px;
	background: #ffffff;
	color: #6547aa;
	font-size: 16px;
	cursor: pointer;
}

.harmony-maze-controls button[data-harmony-maze-move="up"] { grid-area: up; }
.harmony-maze-controls button[data-harmony-maze-move="left"] { grid-area: left; }
.harmony-maze-controls button[data-harmony-maze-move="down"] { grid-area: down; }
.harmony-maze-controls button[data-harmony-maze-move="right"] { grid-area: right; }

.harmony-sum-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 9px;
	max-width: 440px;
	margin: 22px auto;
}

.harmony-sum-grid button,
.harmony-pattern-choices button,
.harmony-find-grid button {
	aspect-ratio: 1;
	padding: 0;
	border: 1px solid rgba(118, 84, 197, 0.18);
	border-radius: 15px;
	background: #ffffff;
	color: #513c85;
	font: inherit;
	font-size: 23px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-sum-grid button.is-selected {
	border-color: #7654c5;
	background: #7654c5;
	color: #ffffff;
	box-shadow: 0 8px 18px rgba(78, 53, 136, 0.18);
}

.harmony-pattern-sequence,
.harmony-pattern-choices {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 8px;
	max-width: 560px;
	margin: 22px auto 16px;
}

.harmony-pattern-sequence span {
	display: grid;
	place-items: center;
	aspect-ratio: 1;
	border: 1px solid #e4ddec;
	border-radius: 15px;
	background: #ffffff;
	color: #7654c5;
	font-size: 24px;
}

.harmony-pattern-sequence span:last-child {
	border-style: dashed;
	background: #f5f0fb;
}

.harmony-pattern-choices {
	grid-template-columns: repeat(4, minmax(0, 70px));
	justify-content: center;
	margin-top: 0;
}

.harmony-pattern-choices button.is-correct {
	border-color: #3d8a63;
	background: #dff3e5;
	color: #2f7853;
}

.harmony-pattern-choices button.is-wrong {
	border-color: #d56b54;
	background: #fff0ed;
	color: #a24635;
}

.harmony-find-grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 6px;
	max-width: 430px;
	margin: 22px auto;
}

.harmony-find-grid button {
	border-radius: 10px;
	font-size: 17px;
}

.harmony-find-grid button.is-found {
	border-color: #3d8a63;
	background: #dff3e5;
	color: #2f7853;
}

.harmony-puzzle-footer p.is-correct,
.harmony-puzzle-panel p.is-correct {
	color: #2f7853;
	font-weight: 900;
}

.harmony-puzzle-footer p.is-try-again,
.harmony-puzzle-panel p.is-try-again {
	color: #a15a3c;
	font-weight: 800;
}

.harmony-move-player {
	position: relative;
	gap: 22px 28px;
	margin-top: 22px;
	padding: 26px;
	overflow: hidden;
}

.harmony-move-visual {
	position: absolute;
	top: 0;
	right: 0;
	display: grid;
	place-items: center;
	width: 170px;
	height: 100%;
	color: rgba(118, 84, 197, 0.32);
	font-size: 76px;
	pointer-events: none;
}

.harmony-move-visual span {
	position: absolute;
	width: 118px;
	height: 118px;
	border: 18px solid rgba(135, 185, 159, 0.16);
	border-radius: 50%;
	animation: harmonyMoveHalo 4s ease-in-out infinite;
}

@keyframes harmonyMoveHalo {
	50% { transform: scale(1.12); }
}

.harmony-move-player > :not(.harmony-move-visual) {
	position: relative;
	z-index: 1;
}

.harmony-move-player .harmony-guided-reset-copy {
	max-width: 620px;
	padding-right: 120px;
}

.harmony-move-player .harmony-guided-reset-copy > p:last-child {
	margin-top: 9px;
}

.harmony-move-player .harmony-guided-reset-progress {
	margin-top: 2px;
}

.harmony-move-player .harmony-guided-reset-actions {
	gap: 12px;
	margin-top: 2px;
}

.harmony-move-player .harmony-guided-reset-actions button {
	min-width: 145px;
	min-height: 46px;
}

.harmony-break-move .harmony-move-note {
	margin-top: 16px;
	padding: 13px 15px;
	border: 1px solid rgba(118, 84, 197, 0.13);
	border-radius: 14px;
	background: #faf8fd;
	font-size: 13px;
}

.harmony-break-quote-panel blockquote {
	margin: 14px 0 0;
}

.harmony-break-quote-panel blockquote > p {
	margin: 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(29px, 4.6vw, 48px);
	line-height: 1.14;
}

.harmony-break-quote-panel blockquote footer {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 10px;
	align-items: baseline;
	margin-top: 18px;
	color: #5d536d;
	font-size: 14px;
}

.harmony-break-quote-panel blockquote cite {
	font-size: 12px;
	opacity: 0.78;
}

.harmony-quote-summary {
	margin-top: 24px;
	padding: 17px 18px;
	border-left: 4px solid #87b99f;
	border-radius: 4px 15px 15px 4px;
	background: rgba(135, 185, 159, 0.11);
}

.harmony-quote-summary span {
	display: block;
	margin-bottom: 4px;
	color: #3c7357;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.harmony-quote-summary p {
	margin: 0;
	color: #3e374a;
	line-height: 1.55;
}

.harmony-quote-summary p + p {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid rgba(77, 137, 102, 0.16);
}

.harmony-quote-next {
	align-self: flex-start;
	margin-top: 18px;
}

.harmony-break-quote-panel.is-changing blockquote {
	animation: harmonyQuoteIn 0.35s ease;
}

@keyframes harmonyQuoteIn {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.harmony-break-side-surprise {
	width: 100%;
	margin: 4px 0 2px;
	background: linear-gradient(135deg, #7654c5, #d85d97);
}

.harmony-break-mini-panel .harmony-break-side-surprise span {
	color: #ffffff;
}

.harmony-break-coloring {
	margin-bottom: 20px;
}

.harmony-break-coloring .harmony-button {
	gap: 8px;
}

.harmony-coloring-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: -2px 0 16px;
}

.harmony-coloring-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.harmony-coloring-card {
	min-width: 0;
	padding: 12px;
	border: 1px solid #ece8f3;
	border-radius: 18px;
	background: #fcfbfe;
}

.harmony-coloring-sheet {
	display: grid;
	place-items: center;
	aspect-ratio: 2 / 3;
	border: 1px solid #ded7ea;
	border-radius: 14px;
	background: #ffffff;
	overflow: hidden;
}

.harmony-coloring-sheet img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.harmony-coloring-sheet svg {
	width: 100%;
	height: 100%;
	padding: 16px;
}

.harmony-coloring-sheet path,
.harmony-coloring-sheet circle,
.harmony-coloring-sheet ellipse,
.harmony-coloring-sheet line,
.harmony-coloring-sheet polyline,
.harmony-coloring-sheet rect {
	fill: none;
	stroke: #2b2540;
	stroke-width: 5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.harmony-coloring-card h3 {
	margin: 14px 0 6px;
	color: var(--harmony-suite-ink);
	font-size: 18px;
	line-height: 1.2;
}

.harmony-coloring-card p {
	margin: 0;
	color: var(--harmony-suite-muted);
	font-size: 14px;
	line-height: 1.5;
}

.harmony-coloring-card-actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin-top: 14px;
}

.harmony-coloring-card-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 38px;
	padding: 8px 13px;
	border: 1px solid rgba(118, 84, 197, 0.2);
	border-radius: 12px;
	background: #ffffff;
	color: var(--harmony-suite-accent);
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-coloring-card-button.is-primary {
	border-color: var(--harmony-suite-accent);
	background: var(--harmony-suite-accent);
	color: #ffffff;
}

.harmony-coloring-card-button:hover,
.harmony-coloring-card-button:focus-visible {
	background: #f6f2ff;
	color: #4f329c;
	outline: 0;
}

.harmony-coloring-card-button.is-primary:hover,
.harmony-coloring-card-button.is-primary:focus-visible {
	background: #6043aa;
	color: #ffffff;
}

.harmony-coloring-card-button:disabled {
	cursor: wait;
	opacity: 0.55;
}

.harmony-coloring-card.is-hidden {
	display: none;
}

body.harmony-coloring-studio-open {
	overflow: hidden;
}

.harmony-coloring-studio[hidden] {
	display: none !important;
}

.harmony-coloring-studio {
	position: fixed;
	inset: 0;
	z-index: 1000000;
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	width: 100%;
	height: 100vh;
	height: 100dvh;
	background:
		radial-gradient(circle at 8% 0%, rgba(247, 164, 200, 0.22), transparent 28%),
		radial-gradient(circle at 96% 100%, rgba(135, 185, 159, 0.24), transparent 30%),
		#f8f6fb;
	opacity: 0;
	transform: scale(0.995);
	transition: opacity 180ms ease, transform 180ms ease;
}

.harmony-coloring-studio.is-open {
	opacity: 1;
	transform: scale(1);
}

.harmony-coloring-studio-header {
	position: relative;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 78px;
	padding: 12px 20px;
	border-bottom: 1px solid rgba(91, 72, 139, 0.15);
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 8px 24px rgba(38, 28, 66, 0.07);
	backdrop-filter: blur(14px);
}

.harmony-coloring-studio-kicker {
	margin: 0 0 2px;
	color: var(--harmony-suite-accent);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: 0.12em;
	line-height: 1.2;
	text-transform: uppercase;
}

.harmony-coloring-studio-header h2 {
	margin: 0;
	color: var(--harmony-suite-ink);
	font-size: clamp(20px, 2.2vw, 29px);
	line-height: 1.1;
}

.harmony-coloring-studio-header-actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.harmony-coloring-studio-header-actions button,
.harmony-coloring-celebration button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 42px;
	padding: 8px 13px;
	border: 1px solid rgba(118, 84, 197, 0.2);
	border-radius: 13px;
	background: #ffffff;
	color: #514a62;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-coloring-studio-header-actions button:hover,
.harmony-coloring-studio-header-actions button:focus-visible,
.harmony-coloring-celebration button:hover,
.harmony-coloring-celebration button:focus-visible {
	border-color: rgba(118, 84, 197, 0.5);
	background: #f5f1ff;
	outline: 0;
}

.harmony-coloring-studio-header-actions button:disabled {
	cursor: not-allowed;
	opacity: 0.42;
}

.harmony-coloring-studio-header-actions button.is-confirming {
	border-color: #c94f68;
	background: #fff0f3;
	color: #a72f4b;
	box-shadow: 0 0 0 3px rgba(201, 79, 104, 0.12);
	animation: harmonyResetConfirm 800ms ease-in-out infinite alternate;
}

@keyframes harmonyResetConfirm {
	to {
		box-shadow: 0 0 0 5px rgba(201, 79, 104, 0.2);
	}
}

.harmony-coloring-studio-header-actions .is-download,
.harmony-coloring-celebration button {
	border-color: var(--harmony-suite-accent);
	background: var(--harmony-suite-accent);
	color: #ffffff;
}

.harmony-coloring-studio-header-actions .is-download:hover,
.harmony-coloring-studio-header-actions .is-download:focus-visible,
.harmony-coloring-celebration button:hover,
.harmony-coloring-celebration button:focus-visible {
	background: #6043aa;
	color: #ffffff;
}

.harmony-coloring-studio-header-actions .harmony-coloring-studio-close {
	width: 44px;
	min-width: 44px;
	padding: 0;
	border-color: rgba(154, 59, 95, 0.25);
	background: #fff6f8;
	color: #9a3b5f;
	font-size: 18px;
}

.harmony-coloring-studio-body {
	display: grid;
	grid-template-columns: 196px minmax(0, 1fr);
	min-width: 0;
	min-height: 0;
	overflow: hidden;
}

.harmony-crayon-sidebar {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
	min-width: 0;
	min-height: 0;
	padding: 16px 12px;
	border-right: 1px solid rgba(91, 72, 139, 0.15);
	background: rgba(255, 255, 255, 0.84);
}

.harmony-crayon-sidebar-heading {
	padding: 0 5px 12px;
}

.harmony-crayon-sidebar-heading p {
	margin: 0;
	color: var(--harmony-suite-ink);
	font-size: 14px;
	font-weight: 900;
}

.harmony-crayon-sidebar-heading span {
	display: block;
	margin-top: 2px;
	color: var(--harmony-suite-muted);
	font-size: 12px;
	line-height: 1.25;
}

.harmony-crayon-palette {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-content: start;
	gap: 8px;
	min-height: 0;
	padding: 4px 5px 18px;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-color: rgba(118, 84, 197, 0.45) transparent;
	scrollbar-width: thin;
}

.harmony-crayon {
	position: relative;
	display: grid;
	place-items: center;
	min-width: 0;
	padding: 5px 2px 7px;
	border: 2px solid transparent;
	border-radius: 16px;
	background: transparent;
	color: #504a5c;
	font: inherit;
	cursor: pointer;
}

.harmony-crayon:hover,
.harmony-crayon:focus-visible {
	background: #f3eff9;
	outline: 0;
}

.harmony-crayon.is-selected {
	border-color: var(--crayon-color);
	background: #ffffff;
	box-shadow: 0 7px 16px rgba(49, 36, 78, 0.09);
}

.harmony-crayon-swatch {
	position: relative;
	display: block;
	width: 42px;
	height: 42px;
	border: 3px solid rgba(255, 255, 255, 0.94);
	border-radius: 50%;
	background:
		radial-gradient(circle at 32% 25%, rgba(255, 255, 255, 0.42), transparent 23%),
		radial-gradient(circle at 65% 72%, rgba(0, 0, 0, 0.12), transparent 46%),
		var(--crayon-color);
	box-shadow: 0 0 0 1px rgba(36, 30, 49, 0.14), 0 4px 9px rgba(36, 30, 49, 0.14);
}

.harmony-crayon-swatch::after {
	content: "";
	position: absolute;
	inset: 7px;
	border: 1px dashed rgba(255, 255, 255, 0.45);
	border-radius: 50%;
}

.harmony-crayon-label {
	display: block;
	width: 100%;
	margin-top: 5px;
	overflow: hidden;
	font-size: 9px;
	font-weight: 800;
	line-height: 1.15;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.harmony-coloring-workspace {
	position: relative;
	min-width: 0;
	min-height: 0;
	padding: 18px 22px 42px;
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.harmony-coloring-tools {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	width: min(720px, 100%);
	margin: 0 auto 10px;
}

.harmony-coloring-tool-picker,
.harmony-coloring-brush-sizes {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px;
	border: 1px solid rgba(118, 84, 197, 0.18);
	border-radius: 14px;
	background: #ffffff;
}

.harmony-coloring-tools button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 38px;
	padding: 7px 13px;
	border: 0;
	border-radius: 10px;
	background: transparent;
	color: #5c5668;
	font: inherit;
	font-size: 13px;
	font-weight: 900;
	cursor: pointer;
}

.harmony-coloring-tools button:hover,
.harmony-coloring-tools button:focus-visible,
.harmony-coloring-tools button.is-active {
	background: #eee8fb;
	color: #4f329c;
	outline: 0;
}

.harmony-coloring-brush-sizes button {
	width: 36px;
	padding: 0;
}

.harmony-coloring-brush-sizes button i {
	display: block;
	border-radius: 50%;
	background: currentColor;
}

.harmony-coloring-brush-sizes button[data-harmony-brush-size="small"] i {
	width: 7px;
	height: 7px;
}

.harmony-coloring-brush-sizes button[data-harmony-brush-size="medium"] i {
	width: 12px;
	height: 12px;
}

.harmony-coloring-brush-sizes button[data-harmony-brush-size="large"] i {
	width: 18px;
	height: 18px;
}

.harmony-coloring-instructions {
	margin: 0 auto 10px;
	color: #5c5668;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}

.harmony-coloring-progress {
	display: flex;
	align-items: center;
	gap: 10px;
	width: min(720px, 100%);
	margin: 0 auto 14px;
	color: #665f72;
	font-size: 12px;
	font-weight: 800;
}

.harmony-coloring-progress > span {
	flex: 0 0 auto;
}

.harmony-coloring-progress b {
	color: #4f329c;
}

.harmony-coloring-progress > div {
	flex: 1 1 auto;
	height: 8px;
	border-radius: 999px;
	background: rgba(118, 84, 197, 0.11);
	overflow: hidden;
}

.harmony-coloring-progress i {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #7f9cff, #d56f9d, #f1b94e, #72bc91);
	transition: width 240ms ease;
}

.harmony-coloring-canvas-wrap {
	position: relative;
	width: min(720px, 100%);
	min-height: 280px;
	margin: 0 auto;
	border: 1px solid rgba(91, 72, 139, 0.17);
	border-radius: 20px;
	background: #ffffff;
	box-shadow: 0 18px 46px rgba(42, 31, 68, 0.12);
	overflow: hidden;
}

.harmony-coloring-canvas-wrap canvas {
	display: block;
	width: 100%;
	height: auto;
	background: #ffffff;
	cursor: crosshair;
	touch-action: manipulation;
	transition: opacity 160ms ease;
}

.harmony-coloring-canvas-wrap canvas.is-loading {
	opacity: 0;
}

.harmony-coloring-canvas-wrap canvas.is-filling {
	cursor: progress;
}

.harmony-coloring-canvas-wrap canvas.is-freehand {
	cursor: crosshair;
	touch-action: none;
}

.harmony-coloring-loading {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: grid;
	place-content: center;
	gap: 10px;
	padding: 24px;
	background: #ffffff;
	color: #625b70;
	font-size: 14px;
	font-weight: 800;
	text-align: center;
}

.harmony-coloring-loading[hidden] {
	display: none;
}

.harmony-coloring-loading i {
	color: var(--harmony-suite-accent);
	font-size: 25px;
	animation: harmonyColoringSpin 900ms linear infinite;
}

@keyframes harmonyColoringSpin {
	to {
		transform: rotate(360deg);
	}
}

.harmony-coloring-celebration {
	position: fixed;
	top: 94px;
	left: calc(50% + 98px);
	z-index: 5;
	width: min(390px, calc(100vw - 240px));
	padding: 20px;
	border: 1px solid rgba(118, 84, 197, 0.2);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.97);
	box-shadow: 0 22px 70px rgba(47, 35, 75, 0.24);
	text-align: center;
	transform: translateX(-50%);
	animation: harmonyColoringCelebrate 420ms cubic-bezier(0.2, 0.85, 0.3, 1.25) both;
}

.harmony-coloring-celebration[hidden] {
	display: none;
}

.harmony-coloring-download-status {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 1000002;
	margin: 0;
	padding: 12px 16px;
	border: 1px solid rgba(77, 136, 102, 0.24);
	border-radius: 14px;
	background: #effbf3;
	color: #286142;
	box-shadow: 0 14px 36px rgba(35, 73, 50, 0.18);
	font-size: 13px;
	font-weight: 900;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity 180ms ease, transform 180ms ease;
}

.harmony-coloring-download-status[hidden] {
	display: none;
}

.harmony-coloring-download-status.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.harmony-coloring-celebration .harmony-eyebrow {
	margin: 0;
}

.harmony-coloring-celebration h3 {
	margin: 5px 0;
	color: var(--harmony-suite-ink);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(27px, 4vw, 38px);
	line-height: 1.05;
}

.harmony-coloring-celebration > p:not(.harmony-eyebrow) {
	margin: 0 0 13px;
	color: var(--harmony-suite-muted);
	font-size: 14px;
}

.harmony-coloring-confetti {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.harmony-coloring-confetti i {
	position: absolute;
	top: -8px;
	left: var(--confetti-left, 12%);
	width: 8px;
	height: 16px;
	border-radius: 4px;
	background: var(--confetti-color, #7f9cff);
	transform: rotate(var(--confetti-rotate, 18deg));
}

.harmony-coloring-confetti i:nth-child(2) { --confetti-left: 28%; --confetti-color: #f2ad8e; --confetti-rotate: -22deg; }
.harmony-coloring-confetti i:nth-child(3) { --confetti-left: 50%; --confetti-color: #f4d43f; --confetti-rotate: 34deg; }
.harmony-coloring-confetti i:nth-child(4) { --confetti-left: 72%; --confetti-color: #75d5ad; --confetti-rotate: -14deg; }
.harmony-coloring-confetti i:nth-child(5) { --confetti-left: 89%; --confetti-color: #ee74aa; --confetti-rotate: 26deg; }

@keyframes harmonyColoringCelebrate {
	from {
		opacity: 0;
		transform: translate(-50%, -16px) scale(0.94);
	}

	to {
		opacity: 1;
		transform: translate(-50%, 0) scale(1);
	}
}

.harmony-reset-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-top: 18px;
}

.harmony-break-side .harmony-reset-list {
	grid-template-columns: 1fr;
}

.harmony-reset-list i,
.harmony-break-mini-panel i {
	display: grid;
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	place-items: center;
	border-radius: 12px;
	background: #f1edff;
	color: var(--harmony-suite-accent);
}

.harmony-break-mini-panel {
	display: grid;
	align-content: start;
	gap: 10px;
}

.harmony-break-reset-panel .harmony-reset-list {
	margin-top: 14px;
}

.harmony-break-mini-panel h2 {
	margin-bottom: 8px;
}

.harmony-break-mini-panel a {
	align-items: center;
	color: var(--harmony-suite-ink);
	text-decoration: none;
}

.harmony-break-mini-panel a:hover,
.harmony-break-mini-panel a:focus-visible {
	border-color: rgba(118, 84, 197, 0.34);
	background: #f6f2ff;
}

@media (max-width: 900px) {
	.harmony-suite-app .harmony-dashboard-shell {
		display: block;
	}

	.harmony-suite-heading {
		padding: 42px 6% 38px;
	}

	.harmony-today-grid,
	.harmony-calendar-workspace,
	.harmony-tool-grid,
	.harmony-module-layout,
	.harmony-break-grid,
	.harmony-break-layout {
		grid-template-columns: 1fr;
	}

	.harmony-capture-panel {
		order: -1;
	}
}

@media (max-width: 760px) {
	.harmony-coloring-studio {
		grid-template-rows: auto minmax(0, 1fr);
	}

	.harmony-coloring-studio-header {
		min-height: 64px;
		padding: 8px 10px 8px 14px;
	}

	.harmony-coloring-studio-kicker {
		display: none;
	}

	.harmony-coloring-studio-header h2 {
		font-size: 19px;
	}

	.harmony-coloring-studio-header-actions {
		gap: 5px;
	}

	.harmony-coloring-studio-header-actions button {
		width: 40px;
		min-width: 40px;
		min-height: 40px;
		padding: 0;
	}

	.harmony-coloring-studio-header-actions button span {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.harmony-coloring-studio-header-actions .harmony-coloring-studio-close {
		width: 42px;
		min-width: 42px;
	}

	.harmony-coloring-studio-body {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto minmax(0, 1fr);
	}

	.harmony-crayon-sidebar {
		display: block;
		padding: 8px 8px 6px;
		border-right: 0;
		border-bottom: 1px solid rgba(91, 72, 139, 0.15);
	}

	.harmony-crayon-sidebar-heading {
		display: flex;
		align-items: baseline;
		gap: 7px;
		padding: 0 5px 5px;
	}

	.harmony-crayon-sidebar-heading p,
	.harmony-crayon-sidebar-heading span {
		margin: 0;
		font-size: 11px;
	}

	.harmony-crayon-palette {
		display: grid;
		grid-template-columns: none;
		grid-template-rows: 58px;
		grid-auto-flow: column;
		grid-auto-columns: 52px;
		gap: 5px;
		padding: 2px 6px 6px;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x proximity;
	}

	.harmony-crayon {
		height: 56px;
		padding: 3px;
		border-radius: 13px;
		scroll-snap-align: start;
	}

	.harmony-crayon-swatch {
		width: 38px;
		height: 38px;
	}

	.harmony-crayon-label {
		display: none;
	}

	.harmony-coloring-workspace {
		padding: 12px 10px 34px;
	}

	.harmony-coloring-tools {
		gap: 7px;
		margin-bottom: 8px;
	}

	.harmony-coloring-tools button {
		min-height: 36px;
		padding: 6px 10px;
		font-size: 12px;
	}

	.harmony-coloring-instructions {
		font-size: 12px;
	}

	.harmony-coloring-progress {
		margin-bottom: 9px;
	}

	.harmony-coloring-canvas-wrap {
		border-radius: 14px;
	}

	.harmony-coloring-celebration {
		top: 136px;
		left: 50%;
		width: min(350px, calc(100vw - 30px));
		padding: 17px;
	}

	.harmony-coloring-download-status {
		right: 12px;
		bottom: 12px;
		left: 12px;
		text-align: center;
	}
}

@media (max-width: 620px) {
	.harmony-suite-heading h1 {
		font-size: 38px;
	}

	.harmony-suite-content {
		padding: 24px 5% 58px;
	}

	.harmony-workspace-panel {
		padding: 19px;
		border-radius: 17px;
	}

	.harmony-panel-heading,
	.harmony-action-list article,
	.harmony-record-list article {
		align-items: flex-start;
		flex-direction: column;
	}

	.harmony-calendar-grid {
		overflow-x: auto;
		grid-template-columns: repeat(7, minmax(82px, 1fr));
	}

	.harmony-coloring-grid,
	.harmony-reset-list {
		grid-template-columns: 1fr;
	}

	.harmony-coloring-card-actions {
		grid-template-columns: 1fr;
	}

	.harmony-break-tab-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		padding: 8px;
		overflow: visible;
	}

	.harmony-break-tab-list button {
		width: 100%;
		min-width: 0;
		min-height: 42px;
		padding: 8px 10px;
		line-height: 1.15;
		white-space: normal;
	}

	.harmony-break-tab-list .harmony-break-surprise {
		margin-left: 0;
	}

	.harmony-guided-reset {
		grid-template-columns: 1fr;
		gap: 14px;
		padding: 16px;
	}

	.harmony-breath-guide {
		padding: 14px;
	}

	.harmony-breath-shape-picker {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-breath-shape-picker > :last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}

	.harmony-break-disclosure-body {
		padding-right: 12px;
		padding-left: 12px;
	}

	.harmony-guided-reset-timer {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 12px;
		min-width: 0;
		min-height: 76px;
		text-align: left;
	}

	.harmony-guided-reset-timer strong {
		font-size: 28px;
	}

	.harmony-guided-reset-timer span {
		max-width: none;
	}

	.harmony-sound-grid {
		grid-template-columns: 1fr;
	}

	.harmony-sound-card {
		padding: 13px;
	}

	.harmony-story summary {
		padding: 15px;
	}

	.harmony-story-picker {
		grid-auto-columns: minmax(172px, 74vw);
	}

	.harmony-story header {
		padding: 18px 17px 7px;
	}

	.harmony-story-body {
		padding: 2px 16px 20px;
	}

	.harmony-story-stage .harmony-story-body {
		max-height: 54vh;
		padding: 8px 17px 22px;
	}

	.harmony-story-body p {
		font-size: 16px;
		line-height: 1.65;
	}

	.harmony-story-controls {
		grid-template-columns: 1fr 1fr;
	}

	.harmony-story-controls p {
		grid-column: 1 / -1;
		grid-row: 1;
		text-align: center;
	}

	.harmony-story-controls button {
		grid-row: 2;
		width: 100%;
	}

	.harmony-puzzle-picker button {
		flex-direction: column;
		gap: 3px;
		padding: 8px 5px;
		font-size: 11px;
	}

	.harmony-puzzle-panel {
		padding: 14px;
	}

	.harmony-memory-grid {
		gap: 7px;
	}

	.harmony-memory-grid button {
		border-radius: 12px;
		font-size: 19px;
	}

	.harmony-slide-grid {
		grid-template-columns: repeat(3, minmax(0, 72px));
	}

	.harmony-slide-grid button {
		width: 100%;
		height: auto;
		aspect-ratio: 1;
		border-radius: 13px;
	}

	.harmony-puzzle-footer {
		align-items: flex-start;
		flex-direction: column;
	}

	.harmony-puzzle-footer > div,
	.harmony-puzzle-footer > div button {
		width: 100%;
	}

	.harmony-sudoku-grid,
	.harmony-lights-grid {
		width: min(100%, 310px);
	}

	.harmony-sum-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.harmony-pattern-sequence {
		gap: 4px;
	}

	.harmony-pattern-sequence span {
		border-radius: 10px;
		font-size: 18px;
	}

	.harmony-find-grid {
		gap: 4px;
	}

	.harmony-find-grid button {
		border-radius: 8px;
		font-size: 15px;
	}

	.harmony-word-game > strong {
		font-size: clamp(28px, 9vw, 42px);
		letter-spacing: 0.08em;
	}

	.harmony-word-game > div {
		align-items: stretch;
		flex-direction: column;
	}

	.harmony-move-visual {
		display: none;
	}

	.harmony-move-player {
		gap: 16px;
		margin-top: 18px;
		padding: 18px;
	}

	.harmony-move-player .harmony-guided-reset-copy {
		padding-right: 0;
	}

	.harmony-move-player .harmony-guided-reset-actions button {
		width: 100%;
	}

	.harmony-break-quote-panel blockquote > p {
		font-size: 29px;
	}

	.harmony-quote-next {
		width: 100%;
	}

	.harmony-breath-orb {
		width: min(280px, 76vw);
	}
}

/* ------------------------------------------------------------------
   Settings shell (standardized across the Dayzy suite)
   ------------------------------------------------------------------ */

.harmony-settings-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 22px;
	padding: 6px;
	border: 1px solid var(--harmony-line);
	border-radius: 999px;
	background: var(--harmony-paper);
	box-shadow: var(--harmony-shadow);
	width: fit-content;
	max-width: 100%;
}

.harmony-settings-tabs a {
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	border-radius: 999px;
	color: var(--harmony-ink);
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.harmony-settings-tabs a:hover,
.harmony-settings-tabs a:focus {
	color: var(--harmony-navy);
	background: var(--harmony-lavender);
}

.harmony-settings-tabs a.is-active {
	background: var(--harmony-blue);
	color: #ffffff;
}

.harmony-form-message--error {
	background: #fdecec;
	border: 1px solid #f0b9b9;
	color: #8a2727;
}

.harmony-form-message--warning {
	background: #fff7e6;
	border: 1px solid #f0d9a8;
	color: #7a5b1e;
}

.harmony-settings-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr);
	gap: 22px;
	align-items: start;
}

.harmony-settings-row--toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	padding: 14px 0;
	border-bottom: 1px solid var(--harmony-line);
}

.harmony-settings-row--toggle > span {
	display: block;
	color: var(--harmony-navy);
	font-weight: 600;
	font-size: 15px;
}

.harmony-settings-row--toggle > span small {
	display: block;
	margin-top: 2px;
	color: var(--harmony-muted);
	font-weight: 400;
	font-size: 13px;
	line-height: 1.5;
}

.harmony-settings-row--toggle > strong {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.harmony-notification-status {
	min-width: 26px;
	color: var(--harmony-muted);
	font-size: 12.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.harmony-notification-toggle {
	position: relative;
	display: inline-block;
	width: 46px;
	height: 26px;
	cursor: pointer;
}

.harmony-notification-toggle input {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
}

.harmony-notification-toggle span {
	position: absolute;
	inset: 0;
	border-radius: 999px;
	background: #dcd8ec;
	transition: background 160ms ease;
}

.harmony-notification-toggle span::before {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 2px 6px rgba(17, 24, 39, 0.25);
	transition: transform 160ms ease;
}

.harmony-notification-toggle input:checked + span {
	background: var(--harmony-blue);
}

.harmony-notification-toggle input:checked + span::before {
	transform: translateX(20px);
}

.harmony-notification-toggle input:focus-visible + span {
	outline: 2px solid var(--harmony-purple);
	outline-offset: 2px;
}

.harmony-notification-recent {
	display: grid;
	gap: 6px;
	margin: 12px 0;
}

.harmony-notification-recent a {
	display: block;
	padding: 10px 12px;
	border: 1px solid var(--harmony-line);
	border-radius: 12px;
	background: var(--harmony-soft-2);
	text-decoration: none;
}

.harmony-notification-recent a b {
	display: block;
	color: var(--harmony-navy);
	font-size: 13.5px;
}

.harmony-notification-recent a span {
	display: block;
	margin-top: 2px;
	color: var(--harmony-ink);
	font-size: 12.5px;
	line-height: 1.5;
}

.harmony-dashboard-upgrade {
	margin-top: 22px;
	margin-bottom: 0;
	border: 1px solid var(--harmony-line);
	background: linear-gradient(150deg, var(--harmony-lavender) 0%, var(--harmony-rose) 100%);
}

.harmony-dashboard-upgrade .harmony-eyebrow i {
	margin-right: 4px;
	color: var(--harmony-blue);
}

.harmony-dashboard-upgrade .harmony-button {
	margin-top: 12px;
}

.harmony-account-menu__welcome {
	color: inherit;
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}

.harmony-header-action {
	display: inline-flex;
	align-items: center;
	padding: 9px 16px;
	border-radius: 999px;
	border: 1px solid var(--harmony-line);
	background: var(--harmony-paper);
	color: var(--harmony-navy);
	font-family: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.harmony-header-action:hover,
.harmony-header-action:focus {
	background: var(--harmony-lavender);
}

/* ------------------------------------------------------------------
   Help Center / Contact / How It Works (standardized; light pastel hero)
   ------------------------------------------------------------------ */

.harmony-help-hero {
	padding: 120px 0 72px;
	background:
		radial-gradient(circle at 14% 22%, rgba(127, 156, 255, 0.25), transparent 32%),
		linear-gradient(135deg, #f1edff 0%, #ffe7f0 55%, #f7fbff 100%);
	color: var(--harmony-ink);
}

.harmony-help-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: 44px;
	align-items: center;
}

.harmony-help-hero__copy h1 {
	margin: 0 0 14px;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(32px, 4.4vw, 52px);
	line-height: 1.14;
}

.harmony-help-hero__copy > p {
	margin: 0 0 24px;
	max-width: 560px;
	color: var(--harmony-ink);
	font-size: 17px;
	line-height: 1.65;
}

.harmony-help-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
}

.harmony-help-hero__panel {
	padding: 26px 24px;
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.82);
	box-shadow: var(--harmony-shadow);
}

.harmony-help-hero__panel h2 {
	margin: 0 0 12px;
	color: var(--harmony-navy);
	font-size: 18px;
}

.harmony-help-hero__panel ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 10px;
}

.harmony-help-hero__panel li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	color: var(--harmony-ink);
	font-size: 14.5px;
	line-height: 1.5;
}

.harmony-help-hero__panel li i {
	margin-top: 3px;
	color: var(--harmony-blue);
}

.harmony-help-hero__panel a {
	color: var(--harmony-navy);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.harmony-help-section {
	padding: 56px 0;
}

.harmony-help-heading {
	margin: 0 0 30px;
}

.harmony-help-heading h2 {
	margin: 0;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(26px, 3.2vw, 36px);
}

.harmony-help-topics__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 22px;
}

.harmony-help-topic {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.harmony-help-topic__icon {
	margin-bottom: 12px;
	font-size: 22px;
	color: var(--harmony-blue);
}

.harmony-help-topic ul {
	margin: 10px 0 14px;
	padding: 0 0 0 18px;
	display: grid;
	gap: 6px;
	color: var(--harmony-ink);
	font-size: 14px;
	line-height: 1.55;
}

.harmony-help-topic > a {
	margin-top: auto;
	color: var(--harmony-navy);
	font-weight: 600;
	font-size: 14.5px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.harmony-help-steps__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 22px;
}

.harmony-help-step {
	padding: 24px 22px;
	border: 1px solid var(--harmony-line);
	border-radius: 20px;
	background: var(--harmony-paper);
	box-shadow: var(--harmony-shadow);
}

.harmony-help-step__number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin-bottom: 12px;
	border-radius: 999px;
	background: var(--harmony-lavender);
	color: var(--harmony-navy);
	font-weight: 700;
}

.harmony-help-step h3 {
	margin: 0 0 6px;
	color: var(--harmony-navy);
	font-size: 17px;
}

.harmony-help-step p {
	margin: 0;
	color: var(--harmony-ink);
	font-size: 14.5px;
	line-height: 1.6;
}

.harmony-help-form__card {
	max-width: 760px;
	padding: 34px 32px;
	border: 1px solid var(--harmony-line);
	border-radius: 22px;
	background: var(--harmony-paper);
	box-shadow: var(--harmony-shadow);
}

.harmony-help-faq__list {
	display: grid;
	gap: 12px;
	max-width: 820px;
}

.harmony-help-faq__item {
	border: 1px solid var(--harmony-line);
	border-radius: 16px;
	background: var(--harmony-paper);
	padding: 0 20px;
}

.harmony-help-faq__item summary {
	padding: 16px 28px 16px 0;
	color: var(--harmony-navy);
	cursor: pointer;
	font-weight: 600;
	font-size: 15.5px;
	list-style: none;
	position: relative;
}

.harmony-help-faq__item summary::-webkit-details-marker {
	display: none;
}

.harmony-help-faq__item summary::after {
	content: "+";
	position: absolute;
	right: 2px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--harmony-blue);
	font-size: 20px;
}

.harmony-help-faq__item[open] summary::after {
	content: "\2013";
}

.harmony-help-faq__item p {
	margin: 0;
	padding: 0 0 16px;
	color: var(--harmony-ink);
	font-size: 14.5px;
	line-height: 1.65;
}

.harmony-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.harmony-how-cta__inner {
	padding: 52px 6%;
	border: 1px solid var(--harmony-line);
	border-radius: 26px;
	background: linear-gradient(150deg, var(--harmony-lavender) 0%, var(--harmony-rose) 100%);
	text-align: center;
}

.harmony-how-cta__inner h2 {
	margin: 0 0 8px;
	color: var(--harmony-navy);
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(26px, 3.2vw, 36px);
}

.harmony-how-cta__inner p {
	margin: 0 0 20px;
	color: var(--harmony-ink);
}

.harmony-how-cta__inner .harmony-help-hero__actions {
	justify-content: center;
}

@media (max-width: 880px) {
	.harmony-help-hero__inner {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.harmony-help-hero {
		padding: 104px 0 56px;
	}

	.harmony-settings-tabs {
		width: 100%;
		border-radius: 18px;
	}

	.harmony-settings-grid {
		grid-template-columns: 1fr;
	}
}

/* Keep the Harmony wordmark aligned with the Moments by Dayzy logo system. */
.harmony-logo {
	flex: 0 0 auto;
	align-items: baseline;
	gap: 6px;
	min-width: auto;
	overflow: visible;
}

.harmony-logo__main {
	color: #7f9cff;
	font-family: "Alex Brush", "Moments Script Fallback", cursive;
	font-size: 62px;
	font-weight: 700;
	letter-spacing: 4px;
	line-height: 1;
	text-shadow: 1px 0 #7f9cff;
	filter: drop-shadow(0 0 .6px #7f9cff);
}

.harmony-logo__by {
	display: inline;
	flex: 0 0 auto;
	color: #7a6453;
	font-family: 'Raleway', 'Raleway Fallback', sans-serif;
	font-size: 14px;
	font-weight: 200;
}

.harmony-logo__dayzy {
	flex: 0 0 auto;
	color: #000000 !important;
	font-family: "Birds of Paradise", cursive;
	font-size: 20px;
	font-weight: 400;
	letter-spacing: 2px;
}

@media (max-width: 1200px) {
	.harmony-logo__main {
		font-size: 50px;
		letter-spacing: 3px;
	}

	.harmony-logo__dayzy {
		font-size: 18px;
	}
}

@media (max-width: 1040px) {
	.harmony-header__inner {
		padding-right: clamp(32px, 8vw, 44px);
		padding-left: clamp(32px, 8vw, 44px);
	}

	.harmony-logo__main {
		font-size: 44px;
		letter-spacing: 2px;
	}

	.harmony-logo__by {
		font-size: 12px;
	}

	.harmony-logo__dayzy {
		font-size: 16px;
		letter-spacing: 1px;
	}
}

@media (max-width: 640px) {
	.harmony-logo {
		gap: 4px;
	}

	.harmony-logo__main {
		font-size: 32px;
		letter-spacing: 2px;
	}

	.harmony-logo__by {
		display: inline;
		font-size: 11px;
	}

	.harmony-logo__dayzy {
		font-size: 14px;
		letter-spacing: 0.5px;
	}
}

/* Shared authenticated header/nav pattern. Keep these rules last so they override older Harmony header passes. */
.harmony-header__desktop-actions {
	display: flex;
	align-items: center;
	gap: 10px;
}

.harmony-mobile-account-panel,
.harmony-mobile-menu-label,
.harmony-account-menu--mobile,
.harmony-account-menu__chevron,
.harmony-header-control__label,
.harmony-header-control__chevron {
	display: none;
}

.harmony-account-menu__dropdown a {
	display: flex;
	align-items: center;
	gap: 10px;
}

.harmony-account-menu__dropdown a i {
	width: 16px;
	color: #7658c7;
	text-align: center;
}

.harmony-header-icon > i:first-child,
.harmony-header-alert summary > i:first-child {
	font-size: 19px;
	line-height: 1;
}

@media (min-width: 1041px) {
	.harmony-header__inner {
		width: 100%;
		max-width: none;
		min-height: 76px;
		padding: 10px 5%;
	}

	.harmony-header__panel {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		gap: 5%;
		margin-left: auto;
	}

	.harmony-nav {
		margin-top: 10px;
	}

	.harmony-mobile-menu-label {
		display: none;
	}

	.harmony-menu,
	.harmony-menu--authenticated,
	.harmony-menu--mobile-app {
		display: flex;
		align-items: center;
		gap: 40px;
		margin: 0;
		padding: 0;
		list-style: none;
		font-family: "Poppins", "Poppins Fallback", Arial, sans-serif;
		font-size: 16px;
		font-weight: 400;
		letter-spacing: 1px;
	}

	.harmony-menu li {
		white-space: nowrap;
	}

	.harmony-menu a,
	.harmony-menu--authenticated a,
	.harmony-menu--mobile-app a {
		display: inline;
		min-height: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: #000000;
		font-family: "Poppins", "Poppins Fallback", Arial, sans-serif;
		font-size: 16px;
		font-weight: 400;
		letter-spacing: 1px;
		text-decoration: none;
	}

	.harmony-menu a:hover,
	.harmony-menu a:focus,
	.harmony-menu--authenticated a:hover,
	.harmony-menu--authenticated a:focus,
	.harmony-menu--mobile-app a:hover,
	.harmony-menu--mobile-app a:focus {
		background: transparent;
		color: var(--harmony-blue);
	}

	.harmony-header__actions {
		display: flex;
		align-items: center;
		gap: 20px;
		margin-top: 10px;
	}

	.harmony-header__desktop-actions {
		display: flex;
		align-items: center;
		gap: 20px;
	}

	.harmony-mobile-account-panel {
		display: none !important;
	}

	.harmony-signin-button,
	.harmony-header__cta,
	.harmony-header-action {
		min-height: 0;
		padding: 8px 18px;
		border-radius: 6px;
		box-shadow: none;
		font-family: "Poppins", "Poppins Fallback", Arial, sans-serif;
		font-size: 16px;
		font-weight: 600;
		letter-spacing: 1px;
		line-height: 1.2;
	}

	.harmony-signin-button,
	.harmony-header-action {
		border: 1px solid var(--harmony-blue);
		background: #ffffff;
		color: var(--harmony-blue);
	}

	.harmony-header__cta {
		border: 1px solid var(--harmony-blue);
		background: var(--harmony-blue);
		color: #ffffff;
	}

	.harmony-signin-button:hover,
	.harmony-signin-button:focus,
	.harmony-header-action:hover,
	.harmony-header-action:focus {
		background: var(--harmony-soft);
		box-shadow: none;
		transform: none;
	}

	.harmony-header__cta:hover,
	.harmony-header__cta:focus {
		background: var(--harmony-blue);
		box-shadow: none;
		transform: none;
	}

	.harmony-header__desktop-actions > .harmony-header-icon,
	.harmony-header-alert--desktop > summary {
		display: grid;
		place-items: center;
		position: relative;
		flex: 0 0 38px;
		width: 38px;
		min-width: 38px;
		height: 38px;
		min-height: 38px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: #ffffff;
		color: #5f5852;
		box-shadow: none;
		font-size: 16px;
		line-height: 1;
		text-decoration: none;
		cursor: pointer;
		list-style: none;
	}

	.harmony-header-alert--desktop > summary::marker,
	.harmony-header-alert--desktop > summary::-webkit-details-marker {
		display: none;
		content: "";
	}

	.harmony-header__desktop-actions > .harmony-header-icon {
		margin-left: -10px;
	}

	.harmony-header__desktop-actions > .harmony-header-icon:hover,
	.harmony-header__desktop-actions > .harmony-header-icon:focus,
	.harmony-header-alert--desktop > summary:hover,
	.harmony-header-alert--desktop > summary:focus {
		background: #f7f3ef;
		color: var(--harmony-blue);
		transform: none;
	}

	.harmony-header__desktop-actions > .harmony-header-icon > .fa-circle-question,
	.harmony-header-alert--desktop > summary > .fa-bell {
		display: inline-grid;
		place-items: center;
		width: auto;
		height: auto;
		margin: 0;
		color: currentColor;
		font-size: 20px;
		line-height: 1;
	}

	.harmony-header__desktop-actions .harmony-header-control__label,
	.harmony-header__desktop-actions .harmony-header-control__chevron {
		display: none !important;
	}

	.harmony-header-alert--desktop .harmony-header-alert__count {
		top: 0;
		right: 0;
	}

	.harmony-account-menu--desktop {
		position: relative;
	}

	.harmony-account-menu--desktop summary {
		display: flex;
		align-items: center;
		place-items: initial;
		gap: 10px;
		width: auto;
		min-width: 0;
		max-width: none;
		height: auto;
		min-height: 0;
		padding: 6px 12px;
		border: 1px solid #e4d8cc;
		border-radius: 999px;
		background: #ffffff;
		box-shadow: none;
		color: #2b2b2b;
		cursor: pointer;
		overflow: visible;
	}

	.harmony-account-menu--desktop summary::marker,
	.harmony-account-menu--desktop summary::-webkit-details-marker {
		display: none;
		content: "";
	}

	.harmony-account-menu--desktop summary:hover,
	.harmony-account-menu--desktop summary:focus {
		background: #f7f3ef;
		color: var(--harmony-blue);
		transform: none;
	}

	.harmony-account-menu--desktop .harmony-account-menu__avatar {
		width: 30px;
		height: 30px;
		border-radius: 50%;
	}

	.harmony-account-menu--desktop .harmony-account-menu__welcome {
		display: inline-flex;
		align-items: center;
		color: inherit;
		font-family: "Poppins", "Poppins Fallback", Arial, sans-serif;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.2;
		white-space: nowrap;
	}

	.harmony-account-menu--desktop .harmony-account-menu__chevron {
		display: inline-flex;
		align-items: center;
		color: #7a6453;
		font-size: 12px;
		line-height: 1;
	}

	.harmony-account-menu--desktop .harmony-account-menu__dropdown {
		top: 110%;
		right: auto;
		left: 0;
		width: max-content;
		min-width: 100%;
	}

	.harmony-account-menu--desktop .harmony-account-menu__dropdown strong,
	.harmony-account-menu--desktop .harmony-account-menu__dropdown i {
		display: none;
	}

	.harmony-header-alert--desktop .harmony-header-alert__dropdown {
		top: 110%;
	}
}

@media (max-width: 1040px) {
	.harmony-nav {
		width: 100%;
	}

	.harmony-nav--authenticated {
		order: 1;
	}

	.harmony-mobile-menu-label {
		display: block;
		margin: 0 0 9px;
		color: #7658c7;
		font-size: 11px;
		font-weight: 900;
		letter-spacing: 0.1em;
		text-transform: uppercase;
	}

	.harmony-menu--mobile-app {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 7px;
		width: 100%;
	}

	.harmony-menu--mobile-app a {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 11px 12px;
		border: 1px solid rgba(127, 156, 255, 0.16);
		border-radius: 12px;
		background: rgba(255, 255, 255, 0.9);
		color: var(--harmony-ink);
		font-size: 13.5px;
		font-weight: 800;
	}

	.harmony-menu--mobile-app a:hover,
	.harmony-menu--mobile-app a:focus-visible {
		border-color: rgba(99, 71, 186, 0.34);
		background: #ffffff;
		color: #6347ba;
		outline: 2px solid rgba(169, 140, 255, 0.22);
	}

	body.logged-in .harmony-header__actions {
		display: block !important;
		width: 100%;
	}

	.harmony-header__desktop-actions {
		display: none !important;
	}

	.harmony-mobile-account-panel {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: 8px;
		width: 100%;
	}

	.harmony-account-menu--mobile {
		display: block !important;
		order: 1;
		grid-column: 1 / -1;
		padding-bottom: 10px;
		border-bottom: 1px solid rgba(127, 156, 255, 0.16);
	}

	.harmony-account-menu--mobile summary {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr) auto;
		align-items: center;
		place-items: initial;
		gap: 12px;
		width: 100%;
		min-width: 0;
		max-width: none;
		height: auto;
		min-height: 58px;
		padding: 7px 12px 7px 7px;
		border: 1px solid rgba(127, 156, 255, 0.24);
		border-radius: 14px;
		background: #f8f6ff;
		box-shadow: none;
		overflow: visible;
	}

	.harmony-account-menu--mobile summary::-webkit-details-marker,
	.harmony-header-alert--menu summary::-webkit-details-marker {
		display: none;
	}

	.harmony-account-menu--mobile[open] summary,
	.harmony-header-alert--menu[open] > summary {
		border-color: rgba(99, 71, 186, 0.38);
		background: var(--harmony-lavender);
	}

	.harmony-account-menu--mobile .harmony-account-menu__avatar {
		width: 44px;
		height: 44px;
		border: 2px solid #eee8ff;
		border-radius: 50%;
		object-fit: cover;
	}

	.harmony-account-menu--mobile .harmony-account-menu__welcome,
	.harmony-account-menu--mobile .harmony-account-menu__chevron {
		display: inline-flex;
	}

	.harmony-account-menu--mobile .harmony-account-menu__welcome {
		min-width: 0;
		overflow: hidden;
		color: var(--harmony-navy);
		font-size: 15px;
		font-weight: 900;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.harmony-account-menu--mobile .harmony-account-menu__chevron {
		justify-self: end;
		color: #6f55bb;
		font-size: 12px;
		transition: transform 0.18s ease;
	}

	.harmony-account-menu--mobile[open] .harmony-account-menu__chevron {
		transform: rotate(180deg);
	}

	.harmony-account-menu--mobile .harmony-account-menu__dropdown {
		position: static;
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 7px;
		width: 100%;
		min-width: 0;
		margin-top: 8px;
		padding: 6px;
		border-radius: 13px;
		box-shadow: none;
	}

	.harmony-account-menu--mobile .harmony-account-menu__dropdown strong {
		display: none;
	}

	.harmony-account-menu--mobile .harmony-account-menu__dropdown a,
	.harmony-header-alert--menu > summary,
	.harmony-mobile-help-link {
		border: 1px solid rgba(127, 156, 255, 0.16);
		border-radius: 12px;
		background: rgba(255, 255, 255, 0.9);
		color: var(--harmony-ink);
		text-decoration: none;
	}

	.harmony-account-menu--mobile .harmony-account-menu__dropdown a {
		display: flex;
		align-items: center;
		gap: 9px;
		min-height: 42px;
		padding: 10px 12px;
		font-size: 13px;
		font-weight: 800;
	}

	.harmony-header-alert--menu {
		display: block;
		order: 2;
		min-width: 0;
		width: 100%;
	}

	.harmony-header-alert--menu > summary {
		display: grid;
		grid-template-columns: 22px minmax(0, 1fr) auto auto;
		align-items: center;
		gap: 9px;
		width: 100%;
		min-width: 0;
		max-width: none;
		height: auto;
		min-height: 46px;
		padding: 9px 10px;
		box-shadow: none;
	}

	.harmony-header-alert--menu .harmony-header-control__label,
	.harmony-header-alert--menu .harmony-header-control__chevron {
		display: inline-flex;
	}

	.harmony-header-alert--menu .harmony-header-control__label {
		min-width: 0;
		overflow: hidden;
		font-size: 13px;
		font-weight: 800;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.harmony-header-alert--menu .harmony-header-control__chevron,
	.harmony-mobile-help-link > i:last-child {
		color: var(--harmony-muted);
		font-size: 10px;
	}

	.harmony-header-alert--menu[open] .harmony-header-control__chevron {
		transform: rotate(180deg);
	}

	.harmony-header-alert--menu .harmony-header-alert__count {
		position: static;
		order: 3;
		margin-left: auto;
		border: 0;
		background: #d73f78;
	}

	.harmony-header-alert--menu .harmony-header-alert__dropdown {
		position: static;
		right: auto;
		width: calc(200% + 8px);
		margin-top: 8px;
		padding: 6px;
		border-radius: 13px;
		box-shadow: none;
	}

	.harmony-mobile-help-link {
		order: 3;
		display: grid;
		grid-template-columns: 22px minmax(0, 1fr) auto;
		align-items: center;
		gap: 9px;
		width: 100%;
		min-height: 46px;
		padding: 9px 10px;
		font-size: 13px;
		font-weight: 800;
	}

	.harmony-account-menu--mobile .harmony-account-menu__dropdown a i,
	.harmony-header-alert--menu > summary > i:first-child,
	.harmony-mobile-help-link > i:first-child {
		width: 18px;
		color: #7658c7;
		text-align: center;
	}
}

@media (max-width: 520px) {
	.harmony-menu--mobile-app,
	.harmony-account-menu--mobile .harmony-account-menu__dropdown,
	.harmony-mobile-account-panel {
		grid-template-columns: 1fr;
	}

	.harmony-header-alert--menu .harmony-header-alert__dropdown {
		width: 100%;
	}
}

/* Final Harmony mobile drawer alignment: mirror the Reflection header layout with Harmony colors. */
@media (max-width: 1040px) {
	.harmony-header > .harmony-container.harmony-header__inner {
		padding-right: clamp(30px, 8vw, 42px);
		padding-left: clamp(34px, 9vw, 46px);
	}

	.harmony-menu-toggle {
		border-color: rgba(127, 156, 255, 0.32);
		background: linear-gradient(135deg, #ffffff 0%, #f8f6ff 100%);
		color: #6f55bb;
		box-shadow: 0 10px 24px rgba(127, 156, 255, 0.12);
	}

	.harmony-menu-toggle:hover,
	.harmony-menu-toggle:focus-visible,
	.harmony-menu-toggle.is-active {
		border-color: rgba(215, 63, 120, 0.32);
		background: linear-gradient(135deg, #f7f3ff 0%, #fff4fb 100%);
		color: #6f55bb;
		outline: 3px solid rgba(127, 156, 255, 0.18);
		outline-offset: 2px;
	}

	.harmony-menu-toggle span {
		background: currentColor;
	}

	.harmony-header--authenticated .harmony-header__panel {
		display: grid !important;
		grid-template-columns: 1fr;
		align-items: stretch;
		align-content: start;
		justify-content: stretch;
		gap: 16px;
		padding: 24px clamp(30px, 8vw, 42px) 30px;
		border-color: rgba(127, 156, 255, 0.18);
		background: linear-gradient(180deg, #ffffff 0%, #fbf8ff 100%);
		box-shadow: 0 24px 50px rgba(67, 82, 145, 0.16);
	}

	.harmony-header--authenticated .harmony-nav--authenticated {
		order: 1;
		width: 100%;
	}

	.harmony-header--authenticated .harmony-header__actions {
		order: 2;
		display: block !important;
		width: 100%;
	}

	.harmony-header--authenticated .harmony-mobile-menu-label {
		display: none !important;
	}

	.harmony-header--authenticated .harmony-menu--mobile-app {
		display: grid !important;
		grid-template-columns: 1fr;
		gap: 12px;
		width: 100%;
	}

	.harmony-header--authenticated .harmony-menu--mobile-app a,
	.harmony-account-menu--mobile .harmony-account-menu__dropdown a,
	.harmony-header-alert--menu > summary,
	.harmony-mobile-help-link {
		border: 1px solid rgba(127, 156, 255, 0.18);
		background: rgba(255, 255, 255, 0.9);
		color: var(--harmony-navy);
		box-shadow: 0 10px 22px rgba(127, 156, 255, 0.07);
	}

	.harmony-header--authenticated .harmony-menu--mobile-app a {
		min-height: 66px;
		padding: 18px 20px;
		border-radius: 14px;
		font-size: 16px;
		font-weight: 900;
	}

	.harmony-header--authenticated .harmony-menu--mobile-app a:hover,
	.harmony-header--authenticated .harmony-menu--mobile-app a:focus-visible,
	.harmony-account-menu--mobile .harmony-account-menu__dropdown a:hover,
	.harmony-account-menu--mobile .harmony-account-menu__dropdown a:focus-visible,
	.harmony-header-alert--menu > summary:hover,
	.harmony-header-alert--menu > summary:focus-visible,
	.harmony-header-alert--menu[open] > summary,
	.harmony-mobile-help-link:hover,
	.harmony-mobile-help-link:focus-visible {
		border-color: rgba(215, 63, 120, 0.28);
		background: #f8f6ff;
		color: #6f55bb;
		outline: 2px solid rgba(127, 156, 255, 0.18);
	}

	.harmony-mobile-account-panel {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: start;
		gap: 12px;
		width: 100%;
	}

	.harmony-account-menu--mobile {
		grid-column: 1 / -1;
		padding-bottom: 18px;
		border-bottom: 1px solid rgba(127, 156, 255, 0.18);
	}

	.harmony-account-menu--mobile summary {
		border-color: rgba(127, 156, 255, 0.22);
		background: linear-gradient(135deg, #ffffff 0%, #f8f6ff 100%);
		color: var(--harmony-navy);
		box-shadow: 0 12px 28px rgba(127, 156, 255, 0.09);
	}

	.harmony-account-menu--mobile[open] summary {
		border-color: rgba(215, 63, 120, 0.3);
		background: #f8f6ff;
	}

	.harmony-account-menu__identity {
		display: grid;
		gap: 2px;
		min-width: 0;
	}

	.harmony-account-menu__kicker {
		display: none;
	}

	.harmony-account-menu--mobile .harmony-account-menu__kicker {
		display: block;
		color: var(--harmony-muted);
		font-size: 11px;
		font-weight: 900;
		letter-spacing: 0.03em;
		line-height: 1.15;
		text-transform: uppercase;
	}

	.harmony-account-menu--mobile .harmony-account-menu__welcome {
		display: block;
		font-size: 16px;
		font-weight: 900;
		line-height: 1.2;
	}

	.harmony-account-menu--mobile .harmony-account-menu__avatar {
		border-color: rgba(127, 156, 255, 0.28);
	}

	.harmony-account-menu--mobile .harmony-account-menu__chevron,
	.harmony-header-alert--menu .harmony-header-control__chevron,
	.harmony-header-alert--menu > summary > i:first-child,
	.harmony-mobile-help-link > i:first-child {
		color: #6f55bb;
	}

	.harmony-header-alert--menu .harmony-header-alert__count {
		background: #d73f78;
	}

	.harmony-header-alert--menu .harmony-header-alert__dropdown {
		width: calc(200% + 12px);
		border-color: rgba(127, 156, 255, 0.18);
		background: #ffffff;
		box-shadow: 0 16px 34px rgba(67, 82, 145, 0.12);
	}
}

@media (max-width: 520px) {
	.harmony-mobile-account-panel {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.harmony-header-alert--menu .harmony-header-alert__dropdown {
		width: calc(200% + 12px);
	}
}

@media (max-width: 380px) {
	.harmony-header > .harmony-container.harmony-header__inner {
		padding-right: 26px;
		padding-left: 30px;
	}

	.harmony-header--authenticated .harmony-header__panel {
		padding-right: 24px;
		padding-left: 24px;
	}
}

/* Tighten the final Harmony mobile drawer sizing and badge placement. */
@media (max-width: 1040px) {
	.harmony-header--authenticated .harmony-header__panel {
		padding-top: 18px;
	}

	.harmony-header--authenticated .harmony-menu--mobile-app {
		gap: 12px;
	}

	.harmony-header--authenticated .harmony-menu--mobile-app a {
		min-height: 52px;
		padding: 13px 20px;
		font-size: 15px;
		line-height: 1.25;
	}

	.harmony-header-alert--menu > summary {
		position: relative;
		grid-template-columns: 30px minmax(0, 1fr) auto;
		gap: 10px;
		min-height: 46px;
		padding: 9px 12px 9px 13px;
	}

	.harmony-header-alert--menu .harmony-header-alert__count {
		position: absolute !important;
		top: 6px;
		left: 29px;
		right: auto !important;
		order: initial;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 18px;
		min-width: 18px;
		max-width: 18px;
		height: 18px;
		min-height: 18px;
		max-height: 18px;
		margin: 0;
		padding: 0;
		border: 2px solid #ffffff;
		border-radius: 999px;
		background: #d73f78;
		box-sizing: border-box;
		color: #ffffff;
		font-size: 10px;
		font-weight: 900;
		line-height: 1;
		pointer-events: none;
		z-index: 2;
	}
}

/* Keep the create panel useful without crowding the saved work beside it. */
.harmony-tool-grid,
.harmony-module-layout {
	grid-template-columns: minmax(290px, 0.78fr) minmax(0, 1.32fr);
}

.harmony-action-list article > div:first-child,
.harmony-record-list article > div:first-child {
	flex: 1 1 auto;
	min-width: 0;
}

.harmony-action-list .harmony-row-actions,
.harmony-record-list .harmony-row-actions {
	flex: 0 0 auto;
	align-items: center;
	justify-content: flex-end;
}

@media (max-width: 1040px) {
	.harmony-tool-grid,
	.harmony-module-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 620px) {
	.harmony-inline-editor form {
		right: auto;
		left: 0;
		width: min(82vw, 360px);
	}

	.harmony-action-list .harmony-row-actions,
	.harmony-record-list .harmony-row-actions {
		width: 100%;
		justify-content: flex-start;
	}
}

/* Shared Dayzy desktop workspace contract: one focused column and one utility column. */
@media (min-width: 1041px) {
	.harmony-suite-content {
		padding-right: 32px;
		padding-left: 32px;
	}

	.harmony-suite-heading {
		padding-right: 0;
		padding-left: 0;
	}

	.harmony-suite-content > .harmony-container,
	.harmony-suite-heading > .harmony-container {
		width: 100%;
		max-width: none;
		margin-right: 0;
		margin-left: 0;
	}

	.harmony-today-grid,
	.harmony-calendar-workspace,
	.harmony-break-grid,
	.harmony-settings-grid {
		grid-template-columns: minmax(0, 1.58fr) minmax(300px, 0.72fr);
		gap: 24px;
	}

	.harmony-tool-grid,
	.harmony-module-layout {
		grid-template-columns: minmax(330px, 0.78fr) minmax(0, 1.48fr);
		gap: 24px;
	}

	.harmony-glance-grid {
		padding: 12px;
		border: 1px solid var(--harmony-suite-border);
		border-radius: 20px;
		background: rgba(255, 255, 255, 0.52);
	}

	.harmony-task-list article {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: 18px;
		padding: 18px 20px;
		background: #ffffff;
	}

	.harmony-task-list .harmony-task-card__body {
		display: block;
		width: auto;
		min-width: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	.harmony-task-list .harmony-task-card__type {
		display: block;
		grid-row: auto;
		width: auto;
		height: auto;
		margin: 0 0 5px;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	.harmony-task-list .harmony-item-meta {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 7px 12px;
		width: auto;
		margin-top: 8px;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	.harmony-task-list .harmony-item-meta > span {
		display: inline-flex;
		align-items: center;
		grid-row: auto;
		gap: 5px;
		width: auto;
		height: auto;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: var(--harmony-suite-muted);
		font-size: 12px;
		font-weight: 750;
		letter-spacing: 0;
		line-height: 1.35;
		text-transform: none;
		white-space: nowrap;
	}

	.harmony-task-list .harmony-row-actions {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: nowrap;
		gap: 7px;
		max-width: none;
	}

	.harmony-task-list .harmony-row-actions form {
		display: block;
		width: auto;
		margin: 0;
	}

	.harmony-task-list .harmony-row-actions button,
	.harmony-task-list .harmony-inline-editor summary {
		min-height: 36px;
		white-space: nowrap;
	}
}

/* Dayzy product header and sign-in standard — final cascade. */
.harmony-header {
	position: relative !important;
	inset: auto !important;
	top: auto !important;
}

.harmony-auth-modal__dialog {
	width: min(520px, calc(100% - 32px));
	max-height: calc(100dvh - 32px);
	overflow-y: auto;
	padding: 34px;
	border-radius: 26px;
}

.harmony-auth-modal__header {
	margin-bottom: 22px;
	text-align: left;
}

.harmony-auth-modal__header h2 {
	margin: 0 0 8px;
}

.harmony-auth-modal__header p:last-child {
	margin: 0;
}

.harmony-social-login-group {
	margin: 0 0 18px;
}

.harmony-social-login-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 100%;
	min-height: 54px;
	padding: 12px 18px;
	border: 1px solid rgba(38, 50, 68, 0.2);
	border-radius: 14px;
	background: #fff;
	color: var(--harmony-navy);
	font-weight: 700;
	text-decoration: none;
}

.harmony-google-login-button__icon,
.harmony-google-login-button__icon svg {
	display: block;
	width: 22px;
	height: 22px;
	flex: 0 0 22px;
}

.harmony-login-divider {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 18px;
	color: var(--harmony-muted);
	font-size: 12px;
	text-align: center;
}

.harmony-login-divider::before,
.harmony-login-divider::after {
	content: "";
	height: 1px;
	flex: 1;
	background: var(--harmony-line);
}

@media (min-width: 1041px) {
	.harmony-header__inner {
		width: 100%;
		max-width: none;
		padding: 10px 5%;
	}

	.harmony-header__panel {
		display: flex;
		flex: 1 1 auto;
		align-items: center;
		justify-content: flex-end;
		gap: 5%;
		margin-left: 0;
	}

	.harmony-nav,
	.harmony-header__actions {
		margin-top: 10px;
	}

	.harmony-menu,
	.harmony-menu--authenticated {
		display: flex;
		align-items: center;
		gap: 40px;
	}

	.harmony-menu a,
	.harmony-menu--authenticated a {
		min-height: auto;
		padding: 0;
		border-radius: 0;
		background: transparent;
		font: 400 16px/1.3 "Poppins", Arial, sans-serif;
		letter-spacing: 1px;
	}

	.harmony-header__actions {
		gap: 20px;
	}
}

@media (max-width: 560px) {
	.harmony-auth-modal__dialog {
		width: calc(100% - 24px);
		padding: 26px 20px;
		border-radius: 22px;
	}
}

/* Keep the desktop account greeting optically centered with the avatar. */
@media (min-width: 1041px) {
	.harmony-account-menu--desktop summary {
		align-items: center;
	}

	.harmony-account-menu--desktop .harmony-account-menu__identity {
		display: flex;
		align-items: center;
		align-self: center;
		height: 30px;
		min-height: 30px;
	}

	.harmony-account-menu--desktop .harmony-account-menu__welcome {
		display: flex;
		align-items: center;
		height: 100%;
		margin: 0;
		line-height: 1;
	}
}