:root {
	--bg: #080b0a;
	--bg-alt: #0a0f0d;
	--surface: #0d1412;
	--phone-bg: #080b0a;
	--text-secondary: #a8b8b2;
	--phone-border: #1a1f1d;
	--border: rgba(135, 154, 148, 0.22);
	--border-strong: rgba(135, 154, 148, 0.34);
	--text: #f2f7f5;
	--muted: #879a94;
	--accent: #2cc49d;
	--accent-deep: #168c73;
	--accent-dark: #0d4f43;
	--accent-glow: rgba(44, 196, 157, 0.16);
	--accent-border: rgba(44, 196, 157, 0.24);
	--tab-wash: rgba(22, 140, 115, 0.16);
	--tab-selected-pill: #a8d9cc;
	--tab-on-selected-pill: #168c73;
	--accent-subtle: rgba(22, 140, 115, 0.08);
	--phone-surface-mid: #0d1714;
	--stats-steel: #7a9bb5;
	--warning: #e8a030;
	--font: "Geist", system-ui, sans-serif;
	--wordmark: "Bebas Neue", "Geist", sans-serif;
	--phone-surface: #0a100e;
	--phone-surface-2: #101c18;
	--macro-protein: #3b82f6;
	--macro-carbs: #f59e0b;
	--macro-fat: #a855f7;
	--ease: cubic-bezier(0.4, 0, 0.2, 1);
	--pad-x: clamp(1.25rem, 4vw, 3.5rem);
	--max: 1360px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

[hidden] {
	display: none !important;
}

html {
	scroll-behavior: smooth;
	scroll-padding-top: 5.5rem;
}

html,
body,
* {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

*::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
	background: transparent;
}

body {
	margin: 0;
	min-height: 100vh;
	font-family: var(--font);
	font-weight: 400;
	color: var(--text);
	background: var(--bg);
	line-height: 1.5;
	overflow-x: hidden;
}

body.modal-open {
	overflow: hidden;
}

::selection {
	background: var(--accent);
	color: var(--bg);
}

a {
	color: var(--accent);
	text-decoration: none;
	transition: color 0.25s var(--ease);
}

a:hover {
	color: var(--text);
}

img,
svg {
	display: block;
	max-width: 100%;
}

input,
textarea,
button {
	font: inherit;
}

input::placeholder,
textarea::placeholder {
	color: var(--muted);
}

input:focus,
textarea:focus,
button:focus-visible {
	outline: none;
	border-color: var(--accent) !important;
	box-shadow: 0 0 0 3px rgba(44, 196, 157, 0.18);
}

/* Grain overlay */
.grain {
	position: fixed;
	inset: 0;
	z-index: 200;
	pointer-events: none;
	opacity: 0.05;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@keyframes pulse {
	0%,
	100% {
		opacity: 1;
	}
	50% {
		opacity: 0.55;
	}
}

/* Reveal animations */
.reveal {
	opacity: 0;
	transform: translateY(28px);
	transition:
		opacity 0.8s var(--ease),
		transform 0.8s var(--ease);
}

.reveal--visible {
	opacity: 1;
	transform: translateY(0);
}

/* Header */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding: 1.75rem var(--pad-x);
	background: rgba(8, 11, 10, 0.88);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--border);
}

.site-header--static {
	position: relative;
}

.brand {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	color: var(--text);
	text-decoration: none;
}

.brand:hover {
	color: var(--text);
}

.brand__mark {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	object-fit: contain;
	mix-blend-mode: screen;
}

.site-header--static .brand__mark {
	width: 32px;
	height: 32px;
}

.brand__word {
	font-size: 1.35rem;
	font-weight: 600;
	letter-spacing: 0.06em;
}

.site-nav {
	display: flex;
	align-items: center;
	gap: 2.75rem;
}

.site-nav a {
	font-size: 1.0625rem;
	color: var(--text);
	opacity: 0.85;
}

.site-nav a:hover {
	color: var(--accent);
	opacity: 1;
}

.header-actions {
	display: flex;
	align-items: center;
	gap: 1.5rem;
}

.nav-toggle {
	display: none;
	background: none;
	border: 1px solid var(--border-strong);
	color: var(--text);
	padding: 0.55rem 0.75rem;
	border-radius: 8px;
	cursor: pointer;
	font-size: 1.35rem;
	line-height: 1;
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	cursor: pointer;
	font-weight: 600;
	transition:
		background 0.25s var(--ease),
		color 0.25s var(--ease),
		transform 0.25s var(--ease),
		border-color 0.25s var(--ease);
}

.btn--ghost {
	background: none;
	border: 1px solid rgba(135, 154, 148, 0.35);
	color: var(--text);
	font-size: 0.875rem;
	padding: 0.55rem 1.125rem;
	border-radius: 100px;
	white-space: nowrap;
}

.btn--ghost:hover {
	border-color: var(--accent);
	color: var(--accent);
	transform: none;
}

.btn--primary {
	background: var(--accent-deep);
	color: var(--text);
	font-size: 0.875rem;
	padding: 0.7rem 1.375rem;
	border-radius: 100px;
}

.btn--primary:hover {
	background: var(--accent);
	color: var(--bg);
	transform: translateY(-1px);
}

.site-header .btn--ghost {
	font-size: 1rem;
	padding: 0.7rem 1.35rem;
}

.site-header .btn--primary {
	font-size: 1rem;
	padding: 0.8rem 1.5rem;
}

.btn--cta {
	background: var(--accent-deep);
	color: var(--text);
	font-size: 0.9375rem;
	padding: 1rem 1.75rem;
	border-radius: 10px;
}

.btn--cta:hover {
	background: var(--accent);
	color: var(--bg);
	transform: translateY(-2px);
}

.btn--submit {
	background: var(--accent-deep);
	color: var(--text);
	font-size: 0.875rem;
	padding: 0.875rem;
	border-radius: 10px;
	width: 100%;
	margin-top: 0.25rem;
}

.btn--submit:hover {
	background: var(--accent);
	color: var(--bg);
}

/* Modal */
.modal {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	background: rgba(8, 11, 10, 0.75);
	backdrop-filter: blur(4px);
}

.modal[hidden] {
	display: none;
}

.modal__dialog {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 400px;
	background: var(--surface);
	border: 1px solid rgba(135, 154, 148, 0.2);
	border-radius: 18px;
	padding: 2.25rem;
}

.modal__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.75rem;
}

.modal__title {
	font-size: 1.25rem;
	font-weight: 600;
}

.modal__close {
	background: none;
	border: none;
	color: var(--muted);
	font-size: 1.25rem;
	cursor: pointer;
	line-height: 1;
	padding: 0;
}

.modal__lead {
	font-size: 0.875rem;
	color: var(--muted);
	margin: 0 0 1.5rem;
	line-height: 1.6;
}

.modal__form {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.modal__error {
	margin: 0;
	font-size: 0.8125rem;
	color: #e5484d;
}

.btn--submit:disabled {
	opacity: 0.6;
	cursor: wait;
}

.modal__footer a {
	font-size: 0.8125rem;
	color: var(--muted);
}

.field {
	padding: 0.875rem 1rem;
	background: var(--bg);
	border: 1px solid var(--border-strong);
	border-radius: 10px;
	color: var(--text);
	font-size: 0.875rem;
	width: 100%;
}

.field--textarea {
	resize: none;
	min-height: 5rem;
}

/* Hero */
.hero {
	position: relative;
	display: flex;
	align-items: center;
	gap: 2.5rem;
	max-width: 1440px;
	margin: 0 auto;
	padding: 6rem var(--pad-x) 6.25rem;
}

.hero__glow {
	position: absolute;
	inset: 0;
	background: radial-gradient(
		ellipse 55% 55% at 68% 40%,
		var(--accent-glow),
		transparent 70%
	);
	pointer-events: none;
}

.hero__copy {
	flex: 1.05;
	min-width: min(100%, 400px);
	position: relative;
	z-index: 1;
}

.hero__visual {
	flex: 0.95;
	min-width: min(100%, 360px);
	max-width: 440px;
	position: relative;
	z-index: 1;
}

.badge {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.25rem 0.75rem;
	border: 1px solid rgba(44, 196, 157, 0.3);
	border-radius: 100px;
	font-size: 0.625rem;
	letter-spacing: 0.1em;
	color: var(--accent);
	margin-bottom: 2rem;
}

.badge__dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--accent);
	animation: pulse 2s infinite;
}

.hero__title {
	font-size: clamp(3.25rem, 6.4vw, 6rem);
	line-height: 0.94;
	font-weight: 700;
	margin: 0 0 1.75rem;
	letter-spacing: -0.02em;
	text-transform: uppercase;
}

.hero__title-accent {
	color: var(--accent);
}

.hero__lead {
	font-size: 1.1875rem;
	line-height: 1.6;
	color: var(--muted);
	max-width: 28.75rem;
	margin: 0 0 2.5rem;
}

.hero__actions {
	display: flex;
	align-items: center;
	gap: 1.75rem;
	margin-bottom: 1.125rem;
	flex-wrap: wrap;
}

.hero__link {
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--text);
	opacity: 0.8;
}

.hero__link:hover {
	color: var(--accent);
	opacity: 1;
}

.hero__note {
	font-size: 0.8125rem;
	color: var(--muted);
	margin: 0 0 1.625rem;
}

.hero__status {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	font-size: 0.8125rem;
	color: var(--muted);
}

.hero__status-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--accent-deep);
}

.success-banner {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding: 1rem 1.625rem;
	background: rgba(44, 196, 157, 0.1);
	border: 1px solid rgba(44, 196, 157, 0.4);
	border-radius: 10px;
	color: var(--accent);
	font-size: 0.9375rem;
}

/* Phone mockups */
.phones {
	position: relative;
	width: 100%;
	max-width: 480px;
}

.phone {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--phone-bg);
	border-radius: 42px;
	padding: 0.625rem 0.5625rem 0.5rem;
	overflow: hidden;
	box-shadow: 0 45px 110px rgba(0, 0, 0, 0.6);
}

.phone--back {
	position: absolute;
	top: 36px;
	right: -52px;
	width: 236px;
	border: 7px solid #171b19;
	border-radius: 34px;
	box-shadow: 0 30px 70px rgba(0, 0, 0, 0.5);
	padding: 0.5625rem 0.5rem 0.4375rem;
	transform: rotate(8deg);
	opacity: 0.8;
	z-index: 1;
}

.phone--front {
	position: relative;
	width: 270px;
	border: 8px solid var(--phone-border);
	box-shadow:
		0 45px 110px rgba(0, 0, 0, 0.6),
		0 0 0 1px rgba(44, 196, 157, 0.1);
	z-index: 2;
}

.phone--solo {
	width: 270px;
	border: 8px solid var(--phone-border);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

.phone__atmosphere {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 80% 36% at 18% 0%, rgba(22, 140, 115, 0.22), transparent 62%),
		radial-gradient(ellipse 55% 28% at 92% 8%, rgba(44, 196, 157, 0.1), transparent 55%);
	z-index: 0;
}

.phone__status {
	position: relative;
	z-index: 1;
	display: flex;
	justify-content: space-between;
	font-size: 0.625rem;
	color: var(--muted);
	padding: 0.125rem 0.5rem 0.5rem;
	flex-shrink: 0;
}

.phone--png-fallback .phone__status {
	display: none;
}

.phone--back .phone__status {
	font-size: 0.5625rem;
	padding-bottom: 0.375rem;
}

.phone-live {
	position: relative;
	z-index: 1;
	flex: 1;
	min-height: 0;
	overflow: hidden;
	background: var(--phone-bg);
	border-radius: 32px;
}

.phone--back .phone-live {
	border-radius: 24px;
}

.phone--png-fallback .phone-live {
	aspect-ratio: 430 / 932;
	flex: none;
}

.phone-live iframe {
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
	width: 390px;
	height: 844px;
	transform-origin: top left;
	pointer-events: none;
	background: var(--phone-bg);
	color-scheme: dark;
}

.phone-live__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
	object-position: top center;
	pointer-events: none;
	background: var(--phone-bg);
	-webkit-user-select: none;
	user-select: none;
}

.phone__body {
	position: relative;
	z-index: 1;
	flex: 1;
	min-height: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	gap: 0.4375rem;
	padding: 0 0.25rem;
}

.phone--back .phone__body {
	gap: 0.375rem;
}

.app-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.app-wordmark {
	display: flex;
	align-items: flex-end;
	gap: 0.3125rem;
}

.icon-sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.app-ico {
	width: 1em;
	height: 1em;
	display: block;
	flex-shrink: 0;
}

.app-ico--fill {
	fill: currentColor;
}

.app-ico--stroke {
	fill: none;
	stroke: currentColor;
	stroke-width: 32;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.app-ico--chev {
	fill: none;
	stroke: currentColor;
	stroke-width: 48;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.app-wordmark__img,
.app-tabs__mark,
.app-headline__img {
	object-fit: contain;
	mix-blend-mode: screen;
}

.app-wordmark__img {
	width: 14px;
	height: 12px;
}

.app-wordmark svg {
	width: 14px;
	height: 12px;
}

.app-wordmark span {
	font-family: var(--wordmark);
	font-size: 1.2rem;
	letter-spacing: 0.1em;
	line-height: 1;
	text-transform: lowercase;
	color: var(--text);
}

.app-header-actions {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.app-header-ico {
	width: 1.125rem;
	height: 1.125rem;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	justify-content: center;
}

.app-header-ico svg {
	width: 0.875rem;
	height: 0.875rem;
	display: block;
}

.app-cal {
	display: inline-block;
	width: 0.625rem;
	height: 0.625rem;
	margin-left: 0.25rem;
	border: 1px solid var(--accent);
	border-radius: 2px;
	vertical-align: middle;
	position: relative;
}

.app-cal::before {
	content: "";
	position: absolute;
	top: -2px;
	left: 1px;
	right: 1px;
	height: 2px;
	border-left: 1px solid var(--accent);
	border-right: 1px solid var(--accent);
}

.app-cal--on {
	border-color: var(--accent);
	margin: 0 0.25rem 0 0;
}

.app-trophy {
	display: inline-block;
	width: 0.5rem;
	height: 0.5rem;
	border: 1.2px solid var(--text-secondary);
	border-bottom-width: 2px;
	border-radius: 0 0 2px 2px;
	margin-right: 0.2rem;
	vertical-align: middle;
}

.app-goals {
	font-size: 0.5625rem;
	font-weight: 600;
	color: var(--accent);
	padding: 0.1875rem 0.5rem;
	border-radius: 999px;
	background: rgba(44, 196, 157, 0.12);
	border: 1px solid rgba(44, 196, 157, 0.3);
}

.app-headline {
	position: relative;
	min-height: 3.1rem;
}

.app-headline__img {
	position: absolute;
	right: -0.25rem;
	top: -0.35rem;
	width: 4.25rem;
	height: 3.6rem;
	opacity: 0.22;
}

.app-headline span {
	position: relative;
	font-family: var(--wordmark);
	font-size: 1.5rem;
	font-weight: 400;
	letter-spacing: 0.04em;
	line-height: 0.95;
}

.app-week-label {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.5625rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-week-label__lead {
	display: inline-flex;
	align-items: center;
}

.app-link {
	color: var(--accent);
	letter-spacing: 0.02em;
	text-transform: none;
	font-size: 0.5625rem;
}

.app-card {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 0.5rem 0.5625rem;
}

.app-card--tint {
	background: #131214;
	border-color: var(--border);
}

.app-card--strong {
	background: rgba(22, 140, 115, 0.14);
	border-color: rgba(44, 196, 157, 0.24);
}

.app-card__title {
	font-size: 0.9375rem;
	font-weight: 500;
	margin-top: 0.1875rem;
	letter-spacing: -0.02em;
}

.app-micro {
	font-size: 0.5rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-section-label {
	margin-top: 0.125rem;
}

.app-meta,
.app-meta-row {
	font-size: 0.625rem;
	color: var(--muted);
}

.app-meta-row {
	display: flex;
	gap: 0.625rem;
	margin-top: 0.1875rem;
}

.app-streak__hero {
	display: flex;
	align-items: center;
	gap: 0.3125rem;
}

.app-streak__fire {
	width: 14px;
	height: 14px;
	color: var(--accent-deep);
}

.app-streak__trophy {
	width: 0.55rem;
	height: 0.55rem;
	color: var(--text-secondary);
	margin-right: 0.15rem;
	margin-top: 0.1rem;
}

.app-week-cal {
	width: 0.7rem;
	height: 0.7rem;
	margin-left: 0.25rem;
	color: var(--accent);
}

.app-streak__count {
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.04em;
	color: var(--accent);
}

.app-streak__unit {
	font-size: 0.5rem;
	line-height: 1.15;
	color: var(--muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.app-streak__best {
	margin-left: auto;
	font-size: 0.5rem;
	color: var(--accent);
	text-align: right;
	line-height: 1.2;
	display: flex;
	align-items: flex-start;
}

.app-streak__best em {
	display: block;
	font-style: normal;
	color: var(--muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.app-days {
	display: flex;
	justify-content: space-between;
	margin-top: 0.4375rem;
}

.app-days span {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.1875rem;
	width: auto;
	height: auto;
	background: none;
	font-size: 0.4375rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-days i {
	width: 0.875rem;
	height: 0.875rem;
	border-radius: 50%;
	border: 1.5px solid rgba(135, 154, 148, 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
}

.app-days i .app-ico {
	width: 0.55rem;
	height: 0.55rem;
	color: #f2f7f5;
}

.app-days .is-done {
	color: var(--accent);
}

.app-days .is-done i {
	background: var(--accent-deep);
	border-color: var(--accent-deep);
}

.app-cta__bolt .app-ico {
	width: 0.7rem;
	height: 0.7rem;
}

.app-days .is-today {
	color: var(--text);
}

.app-days .is-today i {
	border-color: var(--text);
	border-width: 2px;
}

.app-week-strip {
	display: flex;
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 12px;
	overflow: hidden;
}

.app-week-strip div {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0.375rem 0.125rem;
	border-left: 1px solid var(--border);
}

.app-week-strip div:first-child {
	border-left: none;
}

.app-week-strip--tight {
	margin-bottom: 0.125rem;
}

.app-week-strip--five div {
	padding: 0.25rem 0.0625rem;
}

.app-week-strip--five strong {
	font-size: 0.5rem;
}

.app-week-strip--five span {
	font-size: 0.3125rem;
	letter-spacing: 0.02em;
}

.app-week-strip--five em {
	font-size: 0.3125rem;
	font-style: normal;
	color: var(--accent);
	margin-top: 0.0625rem;
}

.app-ios-bar {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.app-ios-bar__title {
	font-size: 0.8125rem;
	font-weight: 600;
}

.app-week-strip strong {
	font-size: 0.6875rem;
	line-height: 1.1;
}

.app-week-strip span {
	font-size: 0.4375rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--muted);
	margin-top: 0.125rem;
}

.app-today {
	position: relative;
	overflow: hidden;
	padding-top: 0.625rem;
	min-height: 5.75rem;
}

.app-today__heat {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	background: radial-gradient(ellipse 70% 80% at 78% 42%, rgba(22, 140, 115, 0.22), transparent 64%);
}

.app-today__heat::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(13, 20, 18, 0.92) 0%, rgba(13, 20, 18, 0.5) 42%, rgba(13, 20, 18, 0.22) 70%, rgba(13, 20, 18, 0.78) 100%),
		linear-gradient(180deg, rgba(13, 20, 18, 0.45) 0%, transparent 40%, rgba(13, 20, 18, 0.72) 100%);
}

.app-body--today {
	position: absolute;
	right: -8%;
	top: -38%;
	width: 7.25rem;
	max-width: none;
	height: auto;
	object-fit: cover;
	object-position: 50% 62%;
}

.app-today .app-micro,
.app-today .app-card__title,
.app-today .app-meta-row {
	position: relative;
}

.app-today .app-card__title {
	font-size: 1rem;
	font-weight: 500;
}

.app-meta-row {
	align-items: center;
}

.app-meta-row .app-ico {
	width: 0.55rem;
	height: 0.55rem;
	display: inline-block;
	vertical-align: middle;
	margin-right: 0.15rem;
}

.app-meta-ico {
	display: inline-block;
	width: 0.5rem;
	height: 0.5rem;
	margin-right: 0.2rem;
	border: 1px solid currentColor;
	vertical-align: middle;
	opacity: 0.8;
}

.app-meta-ico--bar {
	border-radius: 1px;
}

.app-meta-ico--clock {
	border-radius: 50%;
}

.app-cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.375rem;
	background: linear-gradient(180deg, #168c73 0%, #0d4f43 55%, #0a3d34 100%);
	color: #f2f7f5;
	text-align: center;
	font-size: 0.5625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 0.625rem 0.5rem;
	border-radius: 12px;
	border: 1px solid rgba(255, 255, 255, 0.07);
}

.app-cta__bolt {
	width: 0.875rem;
	height: 0.875rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.16);
	display: flex;
	align-items: center;
	justify-content: center;
}

.app-cta--sm {
	font-size: 0.5rem;
	padding: 0.4375rem 0.375rem;
	margin-top: 0.4375rem;
}

.app-micro--accent {
	color: var(--accent);
}

.app-nav {
	display: flex;
	align-items: center;
	gap: 0.375rem;
}

.app-nav__back {
	font-size: 1rem;
	line-height: 1;
	color: var(--text);
}

.app-nav__title {
	font-size: 0.875rem;
	font-weight: 600;
}

.app-screen-title {
	font-size: 1.25rem;
	font-weight: 500;
	letter-spacing: -0.03em;
	line-height: 1.1;
}

.app-chips,
.app-seg {
	display: flex;
	gap: 0.25rem;
}

.app-seg--stats span,
.app-chips--steel .app-chip {
	flex: 1;
	text-align: center;
	font-size: 0.4375rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 0.375rem 0.0625rem;
	border-radius: 8px;
	color: var(--muted);
	background: var(--phone-surface);
	border: 1px solid var(--border);
}

.app-seg--stats .is-active {
	background: var(--phone-surface-mid);
	border-color: var(--border-strong);
	border-bottom: 2px solid var(--accent-deep);
	color: var(--text);
}

.app-chips--steel .app-chip.is-active {
	background: var(--phone-surface-mid);
	border-color: var(--border-strong);
	border-bottom: 2px solid var(--stats-steel);
	color: var(--text);
}

.app-nutabs {
	display: flex;
	gap: 0.25rem;
	padding: 0.1875rem;
	background: var(--phone-surface-mid);
	border: 1px solid var(--border);
	border-radius: 12px;
}

.app-nutabs span {
	flex: 1;
	text-align: center;
	font-size: 0.625rem;
	font-weight: 500;
	padding: 0.4375rem 0.125rem;
	border-radius: 9px;
	color: var(--muted);
}

.app-nutabs .is-active {
	background: var(--tab-wash);
	border: 1px solid var(--accent-border);
	color: var(--text);
}

.app-stat-strip {
	display: flex;
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	overflow: hidden;
}

.app-stat-strip > div {
	flex: 1;
	padding: 0.4375rem 0.1875rem;
	border-left: 1px solid var(--border);
	text-align: center;
}

.app-stat-strip .app-micro {
	font-size: 0.4375rem;
	letter-spacing: 0.06em;
}

.app-stat-strip strong {
	display: block;
	font-size: 0.6875rem;
	font-weight: 600;
	margin-top: 0.125rem;
	line-height: 1.1;
}

.app-stat-strip em {
	display: block;
	font-size: 0.4375rem;
	font-style: normal;
	color: var(--accent);
}

.app-spark {
	width: 100%;
	height: 36px;
}

.app-chart-card {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 0.3125rem 0.4375rem 0.25rem;
}

.app-chart-peak {
	font-size: 0.4375rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--stats-steel);
}

.app-consistency {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 0.375rem 0.4375rem;
}

.app-consistency__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.app-consistency__top strong {
	font-size: 0.625rem;
}

.app-consistency__meta {
	font-size: 0.4375rem;
	color: var(--muted);
	margin: 0.125rem 0 0.3125rem;
}

.app-consistency .app-track i {
	background: var(--accent-deep);
}

.app-track--steel {
	height: 6px;
}

.app-track--steel i {
	background: var(--stats-steel);
}

.app-history-row {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 0.375rem 0.5rem;
}

.app-history-row__ico {
	width: 0.75rem;
	height: 0.75rem;
	color: var(--stats-steel);
	flex-shrink: 0;
}

.app-history-row b {
	display: block;
	font-size: 0.5rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.app-history-row em {
	display: block;
	font-size: 0.4375rem;
	font-style: normal;
	color: var(--muted);
}

.app-history-row__chev {
	margin-left: auto;
	color: var(--muted);
}

.phone__bars {
	display: flex;
	align-items: flex-end;
	gap: 3px;
	height: 34px;
	padding: 0 0.125rem;
}

.phone__bar {
	flex: 1;
	background: var(--accent-deep);
	opacity: 0.9;
	border-radius: 2px;
}

.phone__bars--steel .phone__bar {
	background: var(--phone-surface-mid);
	opacity: 0.55;
	border-radius: 3px;
}

.phone__bars--steel .phone__bar.is-peak {
	background: var(--stats-steel);
	opacity: 1;
}

.phone__body--flush {
	padding-left: 0;
	padding-right: 0;
	gap: 0;
}

.phone__body--focus {
	gap: 0.375rem;
}

.app-focus-head {
	display: flex;
	align-items: flex-start;
	gap: 0.375rem;
}

.app-focus-back {
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 7px;
	border: 1px solid var(--border);
	background: var(--phone-surface);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.875rem;
	line-height: 1;
	flex-shrink: 0;
}

.app-focus-title-wrap {
	flex: 1;
	text-align: left;
	min-width: 0;
}

.app-focus-title {
	font-size: 0.75rem;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.app-focus-hint {
	font-size: 0.4375rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-focus-actions,
.app-focus-ex-row {
	display: flex;
	align-items: center;
	gap: 0.125rem;
}

.app-icon-btn {
	width: 1.375rem;
	height: 1.375rem;
	border-radius: 6px;
	color: var(--text-secondary);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-icon-btn svg,
.app-icon-btn .app-ico,
.app-focus-back .app-ico {
	width: 0.875rem;
	height: 0.875rem;
	display: block;
}

.app-focus-art {
	position: relative;
	height: 7.5rem;
	margin: 0 -0.25rem;
	background: var(--phone-surface-mid);
	overflow: hidden;
}

.app-focus-glow {
	position: absolute;
	left: 50%;
	top: 12%;
	width: 72%;
	height: 78%;
	transform: translateX(-50%);
	border-radius: 999px;
	background: radial-gradient(ellipse at center, rgba(44, 196, 157, 0.28), transparent 68%);
}

.app-body--focus {
	position: absolute;
	left: 50%;
	top: 52%;
	width: 11.5rem;
	max-width: none;
	height: auto;
	transform: translate(-50%, -48%);
	pointer-events: none;
}

.app-focus-badge {
	position: absolute;
	top: 0.4375rem;
	right: 0.5rem;
	padding: 0.125rem 0.375rem;
	border-radius: 5px;
	border: 1px solid var(--accent);
	background: rgba(0, 0, 0, 0.55);
	font-size: 0.4375rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
}

.app-focus-ex-row {
	justify-content: space-between;
	margin: 0 -0.25rem;
	padding: 0.375rem 0.5rem 0.25rem;
	background: var(--phone-surface-mid);
}

.app-focus-ex {
	font-size: 0.9375rem;
	font-weight: 600;
}

.app-ex-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.3125rem 0.125rem;
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	color: var(--text-secondary);
	font-size: 0.875rem;
}

.app-ex-nav em {
	font-style: normal;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--text-secondary);
}

.app-set-pips {
	display: flex;
	gap: 0.3125rem;
	overflow: hidden;
}

.app-set-pips > div {
	min-width: 2.5rem;
	padding: 0.3125rem 0.25rem;
	border-radius: 10px;
	border: 1px solid var(--border);
	background: var(--phone-surface);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.0625rem;
}

.app-set-pips b {
	font-size: 0.625rem;
}

.app-set-pips span {
	font-size: 0.4375rem;
	color: var(--muted);
}

.app-set-pips .is-done {
	border-color: rgba(44, 196, 157, 0.45);
}

.app-pip-check {
	width: 0.5rem;
	height: 0.3125rem;
	border-left: 1.5px solid var(--accent);
	border-bottom: 1.5px solid var(--accent);
	transform: rotate(-45deg);
	margin-top: 0.0625rem;
}

.app-set-pips .is-current {
	border-color: var(--accent);
	background: rgba(22, 140, 115, 0.14);
}

.app-set-pips__add {
	min-width: 1.5rem !important;
	justify-content: center;
	color: var(--text-secondary);
	font-size: 0.875rem;
}

.app-set-hero {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 14px;
	padding: 0.625rem 0.625rem 0.75rem;
}

.app-set-hero__top {
	display: flex;
	align-items: center;
	gap: 0.3125rem;
	margin-bottom: 0.5rem;
}

.app-set-num {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	flex-shrink: 0;
}

.app-set-type {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	min-width: 0;
	height: 1.75rem;
	padding: 0 0.3125rem;
	border: 1px solid var(--border);
	border-radius: 8px;
	background: var(--phone-surface-2);
}

.app-set-type__icon {
	width: 1rem;
	height: 1rem;
	border-radius: 50%;
	background: var(--accent);
	color: #06110e;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-set-type__icon svg,
.app-set-type__icon .app-ico {
	width: 0.625rem;
	height: 0.625rem;
}

.app-set-type__copy {
	min-width: 0;
	display: flex;
	flex-direction: column;
	line-height: 1.05;
}

.app-set-type__copy em {
	font-style: normal;
	font-size: 0.375rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-set-type__copy b {
	font-size: 0.5rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.app-set-type__chev {
	color: var(--text-secondary);
	font-size: 0.75rem;
	line-height: 1;
	margin-left: auto;
}

.app-set-trash {
	width: 1.75rem;
	height: 1.75rem;
	margin-left: auto;
	border-radius: 7px;
	background: #e5484d;
	color: #f7ecec;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-set-trash svg,
.app-set-trash .app-ico {
	width: 0.75rem;
	height: 0.75rem;
}

.app-set-fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.5rem;
}

.app-set-well {
	background: var(--phone-surface-2);
	border-radius: 10px;
	text-align: center;
	font-size: 1.25rem;
	font-weight: 600;
	padding: 0.5rem 0.25rem;
}

.app-set-unit {
	text-align: center;
	font-size: 0.5rem;
	letter-spacing: 0.1em;
	color: var(--muted);
	margin-top: 0.25rem;
}

.app-set-last {
	font-size: 0.5625rem;
	color: var(--text-secondary);
	margin-top: 0.5rem;
}

.app-log-set {
	background: linear-gradient(90deg, #0d4f43, #2cc49d);
	color: #f2f7f5;
	text-align: center;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	padding: 0.625rem;
	border-radius: 12px;
}

.app-dock {
	margin-top: auto;
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
}

.app-dock__banner {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	border: 1px solid var(--border);
	border-radius: 10px;
	background: var(--phone-surface);
	padding: 0.375rem 0.625rem;
}

.app-dock__banner span {
	font-size: 0.5rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.app-dock__banner strong {
	font-size: 1.0625rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--text-secondary);
}

.app-dock__row {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 0.375rem;
}

.app-dock__mode {
	border: 1.5px solid var(--accent-deep);
	background: #0a2e27;
	border-radius: 10px;
	font-size: 0.5rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--accent-deep);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.25rem;
	min-height: 2.125rem;
}

.app-dock__mode svg,
.app-dock__mode .app-ico,
.app-dock__end .app-ico,
.app-dock__add .app-ico {
	width: 0.75rem;
	height: 0.75rem;
}

.app-dock__end {
	border-radius: 10px;
	border: 1.5px solid var(--accent-deep);
	background: var(--accent-deep);
	color: #f2f7f5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.app-dock__end svg {
	width: 0.875rem;
	height: 0.875rem;
}

.app-dock__add {
	border: 1.5px solid var(--border);
	border-radius: 10px;
	background: var(--phone-surface-mid);
	color: var(--accent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.125rem;
}

.app-session-head {
	display: flex;
	align-items: flex-start;
	gap: 0.375rem;
	padding: 0 0.375rem 0.5rem;
}

.app-session-copy {
	flex: 1;
	text-align: center;
}

.app-session-title {
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.15;
}

.app-ex-list {
	display: flex;
	flex-direction: column;
}

.app-timer {
	margin-left: auto;
	font-size: 0.75rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--accent);
}

.app-ex-card {
	display: flex;
	gap: 0.5rem;
	align-items: center;
	background: var(--phone-surface);
	border: none;
	border-top: 1px solid var(--border);
	border-radius: 0;
	padding: 0.625rem 0.5rem;
}

.app-ex-thumb {
	width: 2rem;
	height: 2rem;
	border-radius: 8px;
	flex-shrink: 0;
	background:
		radial-gradient(circle at 30% 30%, rgba(44, 196, 157, 0.45), transparent 55%),
		#101c18;
	border: 1px solid rgba(44, 196, 157, 0.2);
}

.app-ex-name {
	font-size: 0.75rem;
	font-weight: 600;
}

.app-ex-meta {
	font-size: 0.5625rem;
	color: var(--muted);
	margin-top: 0.0625rem;
}

.app-pips {
	display: flex;
	gap: 0.25rem;
	margin-top: 0.3125rem;
}

.app-pips span {
	width: 0.4375rem;
	height: 0.4375rem;
	border-radius: 50%;
	border: 1px solid var(--muted);
	background: transparent;
}

.app-pips .is-done {
	background: var(--accent);
	border-color: var(--accent);
}

.app-date-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 0.6875rem;
	color: var(--muted);
	padding: 0 0.125rem;
}

.app-date-step {
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var(--phone-surface-mid);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.75rem;
}

.app-date-label {
	color: var(--text-secondary);
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

.app-date-cal {
	width: 0.85rem;
	height: 0.85rem;
	color: var(--accent);
}

.app-date-step .app-ico {
	width: 0.7rem;
	height: 0.7rem;
}

.app-date-step--next {
	transform: scaleX(-1);
}

.app-protein {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
}

.app-protein__label {
	color: var(--macro-protein);
}

.app-protein__value {
	font-size: 1.125rem;
	font-weight: 600;
	margin-top: 0.125rem;
}

.app-protein__remain {
	font-size: 0.5625rem;
	color: var(--muted);
	margin-top: 0.125rem;
}

.app-targets {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.app-targets .app-calorie {
	padding-top: 0.4375rem;
	border-top: 1px solid var(--border);
}

.app-targets .app-macro-row > div {
	background: transparent;
	border: none;
	padding: 0;
}

.app-macro-row strong em {
	font-style: normal;
	font-weight: 400;
	color: var(--muted);
	font-size: 0.5rem;
}

.app-dot {
	display: inline-block;
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 50%;
	margin-right: 0.2rem;
	vertical-align: middle;
}

.app-logfood {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}

.app-logfood__field {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 0.5rem 0.625rem;
	font-size: 0.625rem;
	color: var(--muted);
}

.app-meals-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.75rem;
	font-weight: 500;
}

.app-protein-ring {
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: conic-gradient(var(--macro-protein) 79%, rgba(59, 130, 246, 0.2) 0);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-protein-ring__inner {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--phone-surface);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 0.5625rem;
	font-weight: 700;
	line-height: 1;
}

.app-protein-ring__inner em {
	font-size: 0.375rem;
	font-style: normal;
	font-weight: 400;
	color: var(--muted);
	margin-top: 0.0625rem;
}

.app-calorie__label {
	color: var(--accent-deep);
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.app-calorie__label .app-ico {
	width: 0.7rem;
	height: 0.7rem;
}

.app-calorie__value {
	font-size: 0.875rem;
	font-weight: 600;
	margin: 0.125rem 0 0.3125rem;
}

.app-calorie__value em {
	font-size: 0.5625rem;
	font-style: normal;
	font-weight: 400;
	color: var(--muted);
}

.app-macro-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.375rem;
}

.app-macro-row > div {
	background: var(--phone-surface);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 0.375rem 0.3125rem;
}

.app-macro-row span {
	display: block;
	font-size: 0.5rem;
	font-weight: 600;
}

.app-macro-row strong {
	display: block;
	font-size: 0.6875rem;
	margin: 0.125rem 0 0.25rem;
}

.app-track {
	grid-column: 1 / -1;
	height: 4px;
	border-radius: 99px;
	background: rgba(135, 154, 148, 0.16);
	overflow: hidden;
}

.app-track i {
	display: block;
	height: 100%;
	border-radius: inherit;
}

.app-meals {
	padding-bottom: 0.25rem;
}

.app-meal {
	display: flex;
	align-items: center;
	gap: 0.4375rem;
	font-size: 0.6875rem;
	padding: 0.375rem 0;
	border-top: 1px solid rgba(135, 154, 148, 0.1);
}

.app-meals .app-week-label {
	padding-bottom: 0.25rem;
}

.app-meal__icon {
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 6px;
	background: var(--phone-surface-2);
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-secondary);
}

.app-meal__icon .app-ico {
	width: 0.75rem;
	height: 0.75rem;
}

.app-meal__icon--sun::after {
	content: "";
	position: absolute;
	inset: 0.28rem;
	border-radius: 50%;
	background: var(--text-secondary);
	box-shadow: 0 -4px 0 -2px var(--text-secondary), 4px 0 0 -2px var(--text-secondary), 0 4px 0 -2px var(--text-secondary), -4px 0 0 -2px var(--text-secondary);
}

.app-meal__icon--fork::after,
.app-meal__icon--plate::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 0.22rem;
	width: 0.15rem;
	height: 0.75rem;
	background: var(--text-secondary);
	transform: translateX(-50%);
	border-radius: 1px;
}

.app-meal__icon--snack::after {
	content: "";
	position: absolute;
	inset: 0.28rem 0.22rem;
	border-radius: 40% 40% 50% 50%;
	background: var(--text-secondary);
}

.app-meal__copy {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.0625rem;
}

.app-meal__copy b {
	font-weight: 600;
	font-size: 0.6875rem;
}

.app-meal__copy em {
	font-size: 0.5rem;
	font-style: normal;
	color: var(--text-secondary);
}

.app-meal .is-empty,
.app-meal__copy em.is-empty {
	color: var(--muted);
}

.app-meal__add {
	color: var(--accent);
	font-size: 0.875rem;
	line-height: 1;
}

.app-hub {
	margin-bottom: 0.125rem;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5rem;
}

.app-hub__title {
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

.app-hub__tag {
	font-size: 0.4375rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
	margin-top: 0.25rem;
}

.app-hub__tag span {
	color: var(--accent);
}

.app-overview-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.375rem;
}

.app-overview-sub {
	font-size: 0.5rem;
	color: var(--muted);
	margin-top: 0.125rem;
	text-transform: none;
	letter-spacing: 0;
}

.app-review-btn {
	font-size: 0.4375rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--text-secondary);
	border: 1px solid var(--border);
	background: var(--phone-surface);
	border-radius: 8px;
	padding: 0.3125rem 0.375rem;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 0.2rem;
}

.app-review-btn .app-ico,
.app-ask__title .app-ico,
.app-edge-tiles__top .app-ico {
	width: 0.7rem;
	height: 0.7rem;
}

.app-ask {
	background: linear-gradient(180deg, #1aa884 0%, var(--accent-deep) 100%);
	color: #f2f7f5;
	padding: 0.5rem 0.625rem;
	border-radius: 9px;
	border: 1px solid rgba(255, 255, 255, 0.07);
}

.app-ask__title {
	font-size: 0.6875rem;
	font-weight: 600;
	display: flex;
	align-items: center;
	gap: 0.3rem;
}

.app-ask__sub {
	font-size: 0.5rem;
	opacity: 0.82;
	margin-top: 0.0625rem;
}

.app-finding__top {
	display: flex;
	gap: 0.5rem;
}

.app-gauge {
	flex-shrink: 0;
}

.app-gauge__ring {
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	background: conic-gradient(var(--accent) 69%, rgba(44, 196, 157, 0.15) 0);
	display: flex;
	align-items: center;
	justify-content: center;
}

.app-gauge__inner {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--phone-surface);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1;
}

.app-gauge__inner em {
	font-size: 0.3125rem;
	font-style: normal;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--muted);
	margin-top: 0.125rem;
	text-align: center;
}

.app-priority {
	display: inline-block;
	font-size: 0.4375rem;
	letter-spacing: 0.08em;
	color: var(--accent);
	margin-bottom: 0.25rem;
}

.app-finding__title {
	font-size: 0.6875rem;
	font-weight: 600;
	line-height: 1.25;
}

.app-finding__detail {
	font-size: 0.5rem;
	color: var(--muted);
	line-height: 1.35;
	margin-top: 0.25rem;
}

.app-callout {
	margin-top: 0.5rem;
	padding: 0.4375rem 0.5rem;
	border-radius: 8px;
	background: rgba(22, 140, 115, 0.14);
	border: 1px solid rgba(44, 196, 157, 0.25);
	font-size: 0.5625rem;
	line-height: 1.4;
}

.app-finding-actions {
	display: flex;
	flex-direction: column;
	gap: 0.3125rem;
	margin-top: 0.5rem;
}

.app-finding-primary {
	background: var(--accent-deep);
	color: #f2f7f5;
	text-align: center;
	font-size: 0.5rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.4375rem;
	border-radius: 8px;
}

.app-finding-ghost {
	text-align: center;
	font-size: 0.5rem;
	color: var(--text-secondary);
	padding: 0.25rem;
}

.app-edge-tiles {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.3125rem;
}

.app-edge-tiles > div {
	background: rgba(22, 140, 115, 0.1);
	border: 1px solid rgba(44, 196, 157, 0.28);
	border-radius: 10px;
	padding: 0.4375rem 0.3125rem;
}

.app-edge-tiles__top {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.app-edge-tiles strong {
	display: block;
	font-size: 0.875rem;
}

.app-edge-tiles span {
	display: block;
	font-size: 0.5rem;
	font-weight: 600;
	margin-top: 0.125rem;
}

.app-edge-tiles em {
	display: block;
	font-size: 0.4375rem;
	font-style: normal;
	color: var(--muted);
	line-height: 1.25;
	margin-top: 0.125rem;
}

.app-edge-tiles .is-attention {
	border-color: rgba(44, 196, 157, 0.5);
	background: rgba(22, 140, 115, 0.18);
}

.app-edge-tiles .is-attention span,
.app-edge-tiles .is-attention .app-ico {
	color: var(--accent-deep);
}

.app-edge-tiles .is-watch span,
.app-edge-tiles .is-watch .app-ico {
	color: var(--warning);
}

.app-edge-tiles .is-track span,
.app-edge-tiles .is-track .app-ico {
	color: var(--accent);
}

.app-tabs {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: flex-end;
	justify-content: space-around;
	gap: 0.0625rem;
	margin: auto -0.125rem 0;
	padding: 0.3125rem 0.125rem 0.25rem;
	border-top: 1px solid var(--border);
	flex-shrink: 0;
	background: var(--phone-bg);
}

.app-tabs__item {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	color: var(--muted);
}

.app-tabs__pill {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.125rem;
	min-width: 2.5rem;
	padding: 0.25rem 0.375rem;
	border-radius: 999px;
}

.app-tabs__item.is-active .app-tabs__pill {
	background: var(--tab-selected-pill);
	padding: 0.4375rem 0.5rem;
}

.app-tabs__item.is-active {
	color: var(--tab-on-selected-pill);
}

.app-tabs__pill svg,
.app-tabs__pill .app-tabs__mark {
	width: 0.8125rem;
	height: 0.8125rem;
}

.app-tabs__pill span {
	font-size: 0.375rem;
	line-height: 1.1;
	letter-spacing: 0.05em;
	font-weight: 500;
	text-transform: uppercase;
}

.app-tabs__label-brand {
	font-weight: 700;
}

/* Sections */
.section {
	padding: 7.5rem var(--pad-x);
	max-width: var(--max);
	margin: 0 auto;
}

.section--alt {
	background: var(--bg-alt);
	border-top: 1px solid rgba(135, 154, 148, 0.12);
	border-bottom: 1px solid rgba(135, 154, 148, 0.12);
	max-width: none;
}

.section__inner {
	max-width: var(--max);
	margin: 0 auto;
}

.section__eyebrow {
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	color: var(--accent);
	margin-bottom: 1rem;
}

.section__title {
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 600;
	margin: 0;
	letter-spacing: -0.01em;
	text-wrap: pretty;
}

.section__title--center {
	text-align: center;
	max-width: 40rem;
	margin: 0 auto;
}

.section__title-wrap {
	max-width: 40rem;
	margin: 0 auto 5rem;
	text-align: center;
}

.feature-row {
	display: flex;
	align-items: center;
	gap: 5rem;
	margin-bottom: 8.75rem;
}

.feature-row:last-child {
	margin-bottom: 0;
}

.feature-row--reverse {
	flex-direction: row-reverse;
}

.feature-copy {
	flex: 1;
	min-width: min(100%, 360px);
}

.feature-icon {
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: rgba(44, 196, 157, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.5rem;
}

.feature-copy h3 {
	font-size: 1.75rem;
	font-weight: 600;
	margin: 0 0 0.75rem;
}

.feature-copy p {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--muted);
	margin: 0 0 2rem;
	max-width: 26.25rem;
}

.feature-copy p:last-child {
	margin-bottom: 0;
}

.feature-visual {
	flex: 1;
	min-width: min(100%, 300px);
	display: flex;
	justify-content: center;
}

/* Edge */
.edge-row {
	display: flex;
	align-items: center;
	gap: 5rem;
}

.edge-copy {
	flex: 1;
	min-width: min(100%, 360px);
}

.edge-copy p {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--muted);
	margin: 0;
	max-width: 30rem;
}

/* Community */
.community-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}

.community-card {
	padding: 2rem;
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 18px;
	transition:
		transform 0.3s var(--ease),
		border-color 0.3s var(--ease);
}

.community-card:hover {
	transform: translateY(-4px);
	border-color: rgba(44, 196, 157, 0.4);
}

.community-card h3 {
	font-size: 1.25rem;
	font-weight: 600;
	margin: 0 0 0.75rem;
}

.community-card p {
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--muted);
	margin: 0 0 1rem;
}

.community-card p:last-child {
	margin-bottom: 0;
}

.community-card a {
	font-size: 0.8125rem;
	font-weight: 600;
}

/* Apply */
.apply-row {
	display: flex;
	align-items: flex-start;
	gap: 5rem;
}

.apply-copy {
	flex: 1;
	min-width: min(100%, 340px);
}

.apply-copy p {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--muted);
	margin: 0 0 2rem;
	max-width: 27.5rem;
}

.apply-bullets {
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
	max-width: 26.25rem;
}

.apply-bullet {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	font-size: 0.875rem;
	color: var(--muted);
}

.apply-bullet__dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--accent-deep);
	flex-shrink: 0;
}

.apply-form-wrap {
	flex: 1;
	min-width: min(100%, 360px);
	max-width: 460px;
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 20px;
	padding: 2.25rem;
}

.role-toggle {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}

.role-btn {
	flex: 1;
	padding: 0.625rem;
	border-radius: 8px;
	border: 1px solid var(--border-strong);
	background: transparent;
	color: var(--muted);
	font-size: 0.8125rem;
	font-weight: 600;
	cursor: pointer;
	transition:
		border-color 0.25s var(--ease),
		background 0.25s var(--ease),
		color 0.25s var(--ease);
}

.role-btn--active {
	border-color: var(--accent);
	background: rgba(44, 196, 157, 0.12);
	color: var(--accent);
}

.apply-form {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.apply-success {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 2.5rem 0.625rem;
	gap: 0.625rem;
}

.apply-success__title {
	color: var(--accent);
	font-size: 1.0625rem;
	font-weight: 600;
}

.apply-success__text {
	font-size: 0.875rem;
	color: var(--muted);
}

/* About / Careers */
.about-block,
.careers-block {
	max-width: 47.5rem;
	margin: 0 auto;
	text-align: center;
}

.about-block .section__title,
.careers-block .section__title {
	margin-bottom: 1.25rem;
}

.about-block p,
.careers-block p {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--muted);
	margin: 0;
}

.careers-block p {
	margin-bottom: 0.5rem;
}

.careers-block a {
	font-size: 1rem;
	font-weight: 600;
}

/* Final CTA */
.final-cta {
	padding: 6.875rem var(--pad-x);
	text-align: center;
	position: relative;
	scroll-margin-top: 5.5rem;
	scroll-margin-bottom: 2rem;
}

.final-cta__glow {
	position: absolute;
	inset: 0;
	background: radial-gradient(
		ellipse 50% 60% at 50% 50%,
		rgba(44, 196, 157, 0.1),
		transparent 70%
	);
	pointer-events: none;
}

.final-cta__inner {
	position: relative;
	z-index: 1;
}

.final-cta h2 {
	font-size: clamp(2rem, 4.5vw, 3.375rem);
	font-weight: 600;
	margin: 0 0 1.5rem;
	letter-spacing: -0.01em;
}

.final-cta p {
	font-size: 1rem;
	color: var(--muted);
	margin: 0 0 2.25rem;
}

.waitlist-form {
	display: flex;
	gap: 0.625rem;
	max-width: 27.5rem;
	margin: 0 auto;
}

.waitlist-form .field {
	flex: 1;
	background: #0d0f0e;
}

.waitlist-form .btn--submit {
	width: auto;
	margin-top: 0;
	padding: 0 1.5rem;
	white-space: nowrap;
}

.waitlist-success {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.875rem 1.125rem;
	background: rgba(44, 196, 157, 0.1);
	border: 1px solid rgba(44, 196, 157, 0.4);
	border-radius: 10px;
	color: var(--accent);
	font-size: 0.875rem;
	max-width: 27.5rem;
	margin: 0 auto;
}

.waitlist-error {
	max-width: 27.5rem;
	margin: 0 auto 1rem;
	color: #f87171;
	font-size: 0.875rem;
}

/* Footer */
.site-footer {
	padding: 3.5rem var(--pad-x);
	border-top: 1px solid rgba(135, 154, 148, 0.15);
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 1.5rem;
}

.site-footer__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 2rem;
}

.site-footer__nav a {
	font-size: 0.8125rem;
	color: var(--muted);
}

.site-footer__copy {
	font-size: 0.8125rem;
	color: var(--muted);
	margin: 0;
}

/* Legal pages */
.legal {
	max-width: 42rem;
	margin: 0 auto;
	padding: 3rem var(--pad-x) 4rem;
}

.legal h1 {
	font-size: clamp(1.75rem, 4vw, 2.25rem);
	font-weight: 600;
	margin: 0 0 0.75rem;
	letter-spacing: -0.01em;
}

.legal hr {
	border: none;
	border-top: 1px solid var(--border);
	margin: 1.25rem 0;
}

.legal__body h2 {
	font-size: 1.125rem;
	font-weight: 600;
	margin: 2rem 0 0.75rem;
	color: var(--text);
}

.legal__body h3 {
	font-size: 1rem;
	font-weight: 600;
	margin: 1.25rem 0 0.5rem;
	color: var(--text);
}

.legal__body p,
.legal__body li {
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--muted);
}

.legal__body ul {
	padding-left: 1.25rem;
}

.legal__body .important {
	padding: 1rem 1.25rem;
	background: rgba(44, 196, 157, 0.08);
	border: 1px solid rgba(44, 196, 157, 0.25);
	border-radius: 10px;
	margin: 1rem 0;
}

.legal__back {
	margin-top: 2.5rem;
}

.legal__back a {
	font-size: 0.875rem;
	color: var(--muted);
}

.legal__back a:hover {
	color: var(--accent);
}

/* Tab page header (Nutrition, Workout) */
.app-tab-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5rem;
	padding: 0 0.125rem 0.25rem;
}

.app-tab-header__title {
	font-family: var(--font);
	font-size: 1.35rem;
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: 1.05;
	text-transform: none;
	color: var(--text);
}

.app-tab-header__subtitle {
	font-size: 0.6875rem;
	color: var(--muted);
	margin-top: 0.125rem;
	letter-spacing: 0;
	text-transform: none;
}

/* Workout home hero */
.app-workout-hero {
	position: relative;
	overflow: hidden;
	padding: 0.5625rem;
	min-height: 7.25rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 0.5rem;
}

.app-workout-hero__map {
	position: absolute;
	inset: 0;
	pointer-events: none;
	overflow: hidden;
	background: radial-gradient(ellipse 70% 80% at 78% 42%, rgba(22, 140, 115, 0.22), transparent 64%);
}

.app-workout-hero__map .app-body--today {
	position: absolute;
	right: -10%;
	top: -42%;
	width: 7.5rem;
}

.app-workout-hero__info {
	position: relative;
	z-index: 1;
	max-width: 72%;
}

.app-workout-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.3125rem;
	font-size: 0.5625rem;
	font-weight: 500;
	color: var(--text);
}

.app-workout-dot {
	width: 0.4375rem;
	height: 0.4375rem;
	border-radius: 50%;
	background: var(--accent);
	flex-shrink: 0;
}

.app-workout-meta {
	font-size: 0.5625rem;
	color: var(--muted);
	margin-top: 0.1875rem;
	line-height: 1.3;
}

.app-hero-cta {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 2rem;
	padding: 0.4375rem 1.75rem 0.4375rem 0.875rem;
	border-radius: 999px;
	background: var(--tab-selected-pill);
	color: var(--tab-on-selected-pill);
	font-size: 0.6875rem;
	font-weight: 500;
}

.app-hero-cta__arrow {
	position: absolute;
	right: 0.625rem;
	width: 0.75rem;
	height: 0.75rem;
}

.app-secondary-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	padding: 0.125rem 0;
}

.app-secondary-links__item {
	font-size: 0.5625rem;
	color: var(--text-secondary);
	letter-spacing: 0.02em;
}

.app-secondary-links__divider {
	width: 1px;
	height: 0.75rem;
	background: var(--border);
}

.app-streak--compact {
	padding: 0.4375rem 0.5rem;
}

.app-streak--compact .app-streak__count {
	font-size: 1.125rem;
}

.app-streak--compact .app-days {
	margin-top: 0.3125rem;
}

/* Nutrition today */
.app-date-row--toolbar {
	gap: 0.25rem;
	margin-bottom: 0.125rem;
}

.app-date-row--toolbar .app-goals {
	margin-left: auto;
}

.app-calorie-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
}

.app-calorie-hero__value {
	font-size: 1.75rem;
	font-weight: 600;
	letter-spacing: -0.03em;
	margin-top: 0.125rem;
	line-height: 1;
}

.app-calorie-hero .app-calorie__label {
	font-size: 0.4375rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
}

.app-calorie-hero__eaten {
	font-size: 0.5625rem;
	color: var(--muted);
	margin-top: 0.1875rem;
}

.app-targets .app-macro-row > div {
	background: transparent;
	border: none;
	padding: 0;
	gap: 0.1875rem;
}

.app-targets .app-macro-row span {
	font-size: 0.4375rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	font-weight: 600;
}

.app-targets .app-macro-row strong {
	font-size: 0.6875rem;
	margin: 0.0625rem 0 0;
}

.app-targets-divider {
	height: 1px;
	background: var(--border);
	margin: 0.125rem 0;
}

.app-track--macro {
	grid-column: auto;
	height: 3px;
	margin-top: 0.125rem;
}

.app-calorie-ring {
	width: 3.25rem;
	height: 3.25rem;
	border-radius: 50%;
	background: conic-gradient(var(--accent-deep) 71%, rgba(22, 140, 115, 0.2) 0);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-calorie-ring__inner {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--phone-surface);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-size: 0.5625rem;
	font-weight: 700;
	line-height: 1;
}

.app-calorie-ring__inner em {
	font-size: 0.375rem;
	font-style: normal;
	font-weight: 400;
	color: var(--muted);
	margin-top: 0.0625rem;
}

.app-add-meal {
	display: flex;
	align-items: center;
	gap: 0.4375rem;
	padding: 0.5rem 0.5625rem;
	border-radius: 12px;
	background: rgba(22, 140, 115, 0.18);
	border: 1px solid rgba(44, 196, 157, 0.35);
}

.app-add-meal__icon {
	width: 1.75rem;
	height: 1.75rem;
	border-radius: 50%;
	background: var(--accent);
	color: #080b0a;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-add-meal__icon .app-ico {
	width: 0.85rem;
	height: 0.85rem;
}

.app-add-meal__copy {
	flex: 1;
	min-width: 0;
}

.app-add-meal__copy b {
	display: block;
	font-size: 0.75rem;
	font-weight: 500;
}

.app-add-meal__copy em {
	display: block;
	font-size: 0.5625rem;
	font-style: normal;
	color: var(--muted);
	margin-top: 0.0625rem;
}

.app-add-meal__chev {
	color: var(--accent);
	font-size: 0.875rem;
	line-height: 1;
}

.app-viris-insight {
	padding: 0.5rem 0.5625rem;
	background: rgba(44, 196, 157, 0.06);
	border-color: var(--accent-border);
}

.app-viris-insight__row {
	display: flex;
	align-items: flex-start;
	gap: 0.4375rem;
}

.app-viris-insight__icon {
	width: 1.375rem;
	height: 1.375rem;
	border-radius: 50%;
	background: rgba(44, 196, 157, 0.16);
	border: 1px solid var(--accent-border);
	color: var(--accent);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.app-viris-insight__icon .app-ico {
	width: 0.7rem;
	height: 0.7rem;
}

.app-viris-insight__copy {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
}

.app-viris-insight__eyebrow {
	font-size: 0.4375rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--accent);
}

.app-viris-insight__title {
	font-size: 0.6875rem;
	font-weight: 600;
}

.app-viris-insight__body {
	font-size: 0.5625rem;
	color: var(--muted);
	line-height: 1.35;
}

.app-viris-insight__link {
	font-size: 0.5625rem;
	font-weight: 500;
	color: var(--accent);
	margin-top: 0.125rem;
}

/* Viris hub */
.app-viris-coach {
	margin-bottom: 0.375rem;
}

.app-viris-coach__eyebrow {
	font-size: 0.4375rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--accent);
	margin-bottom: 0.1875rem;
}

.app-viris-coach__headline {
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.2;
	margin-bottom: 0.125rem;
}

.app-viris-coach__sub {
	font-size: 0.5625rem;
	color: var(--muted);
	line-height: 1.35;
}

.app-today-call {
	background: var(--accent-subtle);
	border-color: var(--accent-border);
	padding: 0.5625rem 0.625rem;
}

.app-today-call__row {
	display: flex;
	align-items: flex-start;
	gap: 0.4375rem;
}

.app-today-call__copy {
	flex: 1;
	min-width: 0;
}

.app-today-call__glyph {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: rgba(22, 140, 115, 0.18);
	border: 1px solid var(--accent-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--accent);
	flex-shrink: 0;
}

.app-today-call__glyph .app-ico {
	width: 1.125rem;
	height: 1.125rem;
}

.app-today-call__eyebrow {
	font-size: 0.4375rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--accent);
	margin-bottom: 0.25rem;
}

.app-today-call__title {
	font-size: 0.6875rem;
	font-weight: 600;
	line-height: 1.25;
	margin-bottom: 0.25rem;
}

.app-today-call__body {
	font-size: 0.5625rem;
	color: var(--muted);
	line-height: 1.35;
	margin-bottom: 0.3125rem;
}

.app-today-call__why {
	display: inline-block;
	font-size: 0.5rem;
	font-weight: 600;
	color: var(--accent);
	padding: 0.25rem 0.5rem;
	border-radius: 999px;
	border: 1px solid rgba(44, 196, 157, 0.4);
	background: var(--phone-surface);
}

.app-week-dash {
	padding: 0.5rem 0.5625rem;
}

.app-week-dash__title {
	font-size: 0.6875rem;
	font-weight: 600;
	margin-bottom: 0.375rem;
}

.app-track--week {
	height: 0.375rem;
	border-radius: 4px;
	margin-bottom: 0.3125rem;
	background: var(--phone-surface-mid);
}

.app-track--week i {
	background: var(--accent);
	border-radius: 4px;
}

.app-week-dash__footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.5625rem;
	color: var(--muted);
}

.app-week-dash__footer .is-on-track {
	color: var(--accent);
	font-weight: 600;
}

.app-watching-card {
	padding: 0.375rem 0.5rem 0.25rem;
}

.app-watching-card__title {
	font-size: 0.6875rem;
	font-weight: 600;
	padding: 0.25rem 0 0.375rem;
}

.app-watching-card__row {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.375rem 0;
	border-top: 1px solid var(--border);
}

.app-watching-card__icon {
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	background: var(--phone-surface-mid);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-secondary);
	flex-shrink: 0;
}

.app-watching-card__icon .app-ico {
	width: 0.75rem;
	height: 0.75rem;
}

.app-watching-card__label {
	flex: 1;
	min-width: 0;
	font-size: 0.625rem;
	line-height: 1.25;
}

.app-watching-card__status {
	font-size: 0.5625rem;
	font-weight: 500;
	color: var(--muted);
	white-space: nowrap;
}

.app-watching-card__status.is-warn {
	color: var(--warning);
}

.app-coach-composer {
	display: flex;
	align-items: center;
	gap: 0.375rem;
	margin-top: 0.125rem;
	padding: 0.3125rem 0.3125rem 0.3125rem 0.625rem;
	border-radius: 999px;
	background: var(--phone-surface);
	border: 1px solid var(--border);
}

.app-coach-composer__input {
	flex: 1;
	font-size: 0.5625rem;
	color: var(--muted);
}

.app-coach-composer__send {
	width: 1.375rem;
	height: 1.375rem;
	border-radius: 50%;
	background: var(--phone-surface-mid);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--muted);
	flex-shrink: 0;
}

.app-coach-composer__send .app-ico {
	width: 0.625rem;
	height: 0.625rem;
}

.phone--edge .phone__body {
	gap: 0.375rem;
}

.phone--nutrition .phone__body {
	gap: 0.4375rem;
}

/* Responsive */
@media (max-width: 1100px) {
	.site-nav {
		position: fixed;
		top: 0;
		right: 0;
		width: min(100%, 280px);
		height: 100vh;
		flex-direction: column;
		align-items: flex-start;
		gap: 1.5rem;
		padding: 5rem 1.5rem 1.5rem;
		background: rgba(8, 11, 10, 0.97);
		border-left: 1px solid var(--border);
		transform: translateX(100%);
		transition: transform 0.3s var(--ease);
		z-index: 60;
	}

	.site-nav--open {
		transform: translateX(0);
	}

	.nav-toggle {
		display: block;
		z-index: 70;
	}

	.header-actions .btn--ghost {
		display: none;
	}

	.hero {
		flex-direction: column;
		padding-top: 4rem;
	}

	.hero__visual {
		width: 100%;
	}

	.phones {
		margin: 0 auto;
	}

	.feature-row,
	.feature-row--reverse,
	.edge-row,
	.apply-row {
		flex-direction: column;
		gap: 3rem;
	}

	.community-grid {
		grid-template-columns: 1fr;
	}

	.phone--back {
		right: -20px;
	}
}

@media (max-width: 640px) {
	.site-header {
		flex-wrap: wrap;
	}

	.hero__title {
		font-size: clamp(2.75rem, 12vw, 3.5rem);
	}

	.phone--back {
		display: none;
	}

	.phone--front {
		position: relative;
		width: min(100%, 270px);
		margin: 0 auto;
	}

	.waitlist-form {
		flex-direction: column;
	}

	.waitlist-form .btn--submit {
		width: 100%;
		padding: 0.875rem;
	}

	.site-footer {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}

	.badge__dot {
		animation: none;
	}

	.community-card,
	.btn,
	a {
		transition: none;
	}
}