/* ==========================================================================
   Neon Adda — WordPress & WooCommerce layer.
   The foundation stylesheets carry the design; this file dresses what
   WordPress and WooCommerce print themselves: content pages, notices, the
   add-to-cart form, cart and checkout (classic and blocks), account, comments.
   ========================================================================== */

/* 1. Small additions ------------------------------------------------------- */
.btn--lg {
	padding: 1.1em 1.9em;
	font-size: 1rem;
}

.ph--photo {
	background: var(--ink-850);
}

.ph--photo img,
.polaroid__photo--img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.polaroid__photo--img {
	position: relative;
	overflow: hidden;
}

.starter-note {
	margin: 0 0 1.2rem;
	padding: .7rem 1rem;
	border: 1px dashed color-mix(in srgb, var(--n-amber) 55%, transparent);
	border-radius: var(--r-sm);
	background: color-mix(in srgb, var(--n-amber) 7%, transparent);
	color: var(--text-2);
	font-size: .86rem;
}

.starter-note b {
	color: var(--n-amber);
	margin-right: .4em;
}

.bag.is-bump .bag__n {
	animation: bagbump .6s var(--ease-out, ease-out);
}

@keyframes bagbump {
	30% { transform: scale(1.45); box-shadow: 0 0 18px var(--n-pink); }
}

.enquiry__hp {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.shop.is-loading .pgrid {
	opacity: .45;
	transition: opacity .2s;
}

.fcheck small {
	margin-left: auto;
	color: var(--muted);
	font-size: .78rem;
}

[data-add].is-busy {
	opacity: .6;
	pointer-events: none;
}

.greviews--solo {
	grid-template-columns: minmax(0, 420px);
}

.gsum__score {
	display: flex;
	align-items: baseline;
	gap: .6rem;
}

.gsum__score b {
	font-family: var(--f-display);
	font-size: 3.2rem;
	line-height: 1;
	font-weight: 400;
}

.insta--feed {
	display: block;
}

/* 2. Content pages --------------------------------------------------------- */
.wp-page {
	padding-top: clamp(7rem, 12vw, 9.5rem);
	padding-bottom: var(--section);
}

.page__head {
	display: grid;
	gap: 1rem;
	margin-bottom: clamp(2rem, 5vw, 3.5rem);
}

.page__head .crumbs {
	margin-bottom: .4rem;
}

.page__hero {
	margin-bottom: 2.5rem;
}

.page__hero img {
	width: 100%;
	height: auto;
	border-radius: var(--r-md);
}

.prose {
	max-width: 72ch;
	color: var(--text-2);
	font-size: 1.06rem;
	line-height: 1.75;
}

.prose > * + * {
	margin-top: 1.1em;
}

.prose h2,
.prose h3,
.prose h4 {
	color: var(--text);
	font-family: var(--f-display);
	font-weight: 400;
	line-height: 1.1;
	margin-top: 1.8em;
}

.prose h2 { font-size: var(--fs-3); }
.prose h3 { font-size: 1.45rem; }

.prose a {
	color: var(--text);
	text-decoration: underline;
	text-decoration-color: var(--n-pink);
	text-underline-offset: 3px;
}

.prose ul,
.prose ol {
	padding-left: 1.3em;
}

.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }

.prose li + li {
	margin-top: .35em;
}

.prose img,
.prose figure {
	max-width: 100%;
	height: auto;
	border-radius: var(--r-sm);
}

.prose blockquote {
	padding-left: 1.2em;
	border-left: 2px solid var(--n-pink);
	font-family: var(--f-display);
	font-size: 1.4rem;
	color: var(--text);
}

.prose table {
	width: 100%;
	border-collapse: collapse;
}

.prose th,
.prose td {
	padding: .6em .8em;
	border-bottom: 1px solid var(--line);
	text-align: left;
}

.postnav {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	max-width: 72ch;
	margin: 3rem 0;
	padding-top: 1.4rem;
	border-top: 1px solid var(--line);
}

.cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: clamp(1.2rem, 3vw, 2.2rem);
}

.card {
	display: grid;
	gap: .55rem;
	align-content: start;
}

.card__media .ph {
	aspect-ratio: 4 / 3;
	border-radius: var(--r-md);
	margin-bottom: .4rem;
}

.card__title {
	font-family: var(--f-display);
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.1;
}

.card p:last-child {
	color: var(--text-2);
}

.lost {
	display: grid;
	justify-items: center;
	gap: 1.2rem;
	text-align: center;
	padding-block: 2rem 4rem;
}

.lost__sign {
	font-size: clamp(6rem, 22vw, 15rem);
	line-height: 1;
}

.lost__dead {
	opacity: .14;
	text-shadow: none;
	animation: dead 4s steps(1) infinite;
}

@keyframes dead {
	0%, 92%, 100% { opacity: .14; }
	93%, 95% { opacity: .9; }
}

.lost__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .7rem;
}

/* Search form (core markup) */
.search-form,
.woocommerce-product-search {
	display: flex;
	gap: .5rem;
	max-width: 520px;
	width: 100%;
}

.search-form label {
	flex: 1;
}

.search-field,
.woocommerce-product-search input[type="search"] {
	width: 100%;
}

/* 3. Form fields (WordPress & WooCommerce) --------------------------------- */
.wp-page input[type="text"],
.wp-page input[type="email"],
.wp-page input[type="tel"],
.wp-page input[type="password"],
.wp-page input[type="number"],
.wp-page input[type="search"],
.wp-page input[type="url"],
.wp-page select,
.wp-page textarea,
.pdp textarea,
.pdp .comment-form input[type="text"],
.pdp .comment-form input[type="email"],
.search-field,
.lost input[type="search"] {
	min-height: 48px;
	padding: .7em 1em;
	border: 1px solid var(--line-2);
	border-radius: var(--r-sm);
	background: var(--ink-850);
	color: var(--text);
	font: inherit;
	transition: border-color .2s, box-shadow .2s;
}

.wp-page textarea,
.pdp textarea {
	min-height: 120px;
	width: 100%;
}

.wp-page input:focus,
.wp-page select:focus,
.wp-page textarea:focus,
.pdp textarea:focus,
.search-field:focus {
	outline: none;
	border-color: var(--n-pink);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--n-pink) 25%, transparent);
}

.wp-page label,
.pdp .comment-form label {
	display: block;
	margin-bottom: .35rem;
	color: var(--text-2);
	font-size: .9rem;
}

.search-submit,
.wp-page button[type="submit"]:not(.btn):not(.wc-block-components-button),
.wp-page .button:not(.wc-block-components-button),
.pdp .comment-form .submit,
.woocommerce-product-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: .8em 1.5em;
	border-radius: 999px;
	background: var(--text);
	color: var(--ink-900);
	font-weight: 600;
	border: 0;
	cursor: pointer;
	transition: background-color .2s, box-shadow .3s;
}

.search-submit:hover,
.wp-page .button:not(.wc-block-components-button):hover,
.wp-page button[type="submit"]:not(.btn):not(.wc-block-components-button):hover {
	background: #fff;
	box-shadow: 0 10px 40px -10px rgba(255, 255, 255, .45);
}

.wp-page .button.alt,
.wp-page .checkout-button,
.wp-page #place_order {
	background: var(--n-pink);
	color: #fff;
	box-shadow: 0 0 22px color-mix(in srgb, var(--n-pink) 55%, transparent);
}

/* 4. Notices --------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty {
	display: none;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .8rem 1.4rem;
	margin: 0 0 1.4rem !important;
	padding: 1rem 1.2rem !important;
	list-style: none;
	border-radius: var(--r-sm) !important;
	border: 1px solid var(--line-2) !important;
	background: var(--ink-850) !important;
	color: var(--text) !important;
	font-size: .95rem;
}

.woocommerce-message,
.wc-block-components-notice-banner.is-success {
	border-color: color-mix(in srgb, var(--n-lime) 45%, transparent) !important;
}

.woocommerce-error,
.wc-block-components-notice-banner.is-error {
	border-color: color-mix(in srgb, var(--n-red) 55%, transparent) !important;
}

.woocommerce-message .button,
.woocommerce-info .button,
.wc-forward {
	order: 2;
	color: var(--text) !important;
	background: transparent !important;
	border: 1px solid var(--line-2) !important;
	border-radius: 999px;
	padding: .55em 1.1em !important;
	min-height: 0 !important;
	font-size: .86rem;
	font-weight: 600;
}

.wc-block-components-notice-banner > svg {
	fill: currentColor;
	background: transparent !important;
}

.shop > .woocommerce-notices-wrapper,
.pdp .woocommerce-notices-wrapper {
	margin-top: 1rem;
}

.shop > .woocommerce-notices-wrapper {
	width: min(100% - 2 * var(--gutter), var(--max));
	margin-inline: auto;
}

/* 5. Product page: the add-to-cart form ------------------------------------ */
.buy__form form.cart {
	display: grid;
	gap: 1.1rem;
	margin: 0;
}

.buy__form table.variations {
	width: 100%;
	border-collapse: collapse;
}

.buy__form table.variations tr {
	display: grid;
	gap: .6rem;
	padding-bottom: 1.1rem;
	margin-bottom: 1.1rem;
	border-bottom: 1px solid var(--line);
}

.buy__form table.variations th,
.buy__form table.variations td {
	display: block;
	padding: 0;
	text-align: left;
}

.buy__form table.variations label {
	font-family: var(--f-mono);
	font-size: .74rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 400;
}

.buy__form table.variations label b {
	margin-left: .5em;
	color: var(--text);
	font-family: var(--f-body);
	font-size: .92rem;
	letter-spacing: 0;
	text-transform: none;
	font-weight: 600;
}

.buy__form select {
	min-height: 46px;
	padding: .6em .9em;
	border: 1px solid var(--line-2);
	border-radius: var(--r-sm);
	background: var(--ink-850);
	color: var(--text);
}

.buy__form select.is-enhanced {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.buy__form .reset_variations {
	display: inline-block;
	margin-top: .6rem;
	color: var(--muted);
	font-size: .84rem;
	text-decoration: underline;
}

.buy__form .chips {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.buy__form .chip {
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .1em;
	padding: .6em 1em;
	border-radius: var(--r-sm);
	border: 1px solid var(--line-2);
	font-size: .9rem;
	font-weight: 600;
	text-align: left;
	transition: border-color .2s, background-color .2s;
}

.buy__form .chip small {
	color: var(--muted);
	font-weight: 400;
	font-size: .78rem;
}

.buy__form .chip[aria-checked="true"] {
	border-color: var(--text);
	background: rgba(255, 255, 255, .06);
}

.buy__form .swatchbtn:disabled,
.buy__form .sizebtn:disabled,
.buy__form .chip:disabled {
	opacity: .3;
	cursor: not-allowed;
}

.buy__form .woocommerce-variation-price,
.buy__form .woocommerce-variation-availability:empty {
	display: none;
}

.buy__form .woocommerce-variation-description {
	color: var(--text-2);
	font-size: .92rem;
}

.buy__form .stock {
	color: var(--n-lime);
	font-size: .9rem;
}

.buy__form .stock.out-of-stock {
	color: var(--n-red);
}

.buy__form .woocommerce-variation-add-to-cart,
.buy__form form.cart:not(.variations_form) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .7rem;
}

.buy__form .nna-addons,
.buy__form .nna-config {
	flex-basis: 100%;
}

.buy__form .quantity {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--line-2);
	border-radius: 999px;
	overflow: hidden;
}

.buy__form .quantity .qty__btn {
	width: 40px;
	height: 50px;
	font-size: 1.1rem;
}

.buy__form .quantity input.qty {
	width: 44px;
	height: 50px;
	border: 0;
	background: transparent;
	color: var(--text);
	text-align: center;
	font: inherit;
	-moz-appearance: textfield;
}

.buy__form .quantity input.qty::-webkit-outer-spin-button,
.buy__form .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.buy__form .single_add_to_cart_button,
.buy__form .nna-buy-now {
	flex: 1 1 150px;
	min-height: 52px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 1rem;
	padding: .9em 1.4em;
	cursor: pointer;
}

.buy__form .single_add_to_cart_button {
	--c: var(--n-pink);
	color: #fff;
	background: transparent;
	border: 2px solid color-mix(in srgb, var(--c) 40%, #fff);
	box-shadow:
		0 0 0 1px color-mix(in srgb, var(--c) 60%, transparent),
		0 0 12px color-mix(in srgb, var(--c) 70%, transparent),
		inset 0 0 12px color-mix(in srgb, var(--c) 45%, transparent);
	text-shadow: 0 0 10px color-mix(in srgb, var(--c) 80%, transparent);
	transition: box-shadow .4s;
}

.buy__form .single_add_to_cart_button:hover {
	box-shadow: 0 0 0 1px var(--c), 0 0 22px var(--c), inset 0 0 18px color-mix(in srgb, var(--c) 60%, transparent);
}

.buy__form .single_add_to_cart_button.disabled,
.buy__form .single_add_to_cart_button:disabled {
	opacity: .45;
	cursor: not-allowed;
}

.buy__form .nna-buy-now {
	background: var(--text);
	color: var(--ink-900);
	border: 0;
}

.buy__form .buy__total {
	margin: 0;
}

.buy__sub > p {
	margin: 0;
}

.buy__rating {
	display: inline-flex;
	gap: .5rem;
	color: var(--n-amber);
	font-size: .9rem;
}

.nna-config {
	display: grid;
	gap: 1.1rem;
}

.keys--sm {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.keys--sm .fontkey {
	min-width: 76px;
}

.nna-config__estimate {
	color: var(--text-2);
	font-size: .9rem;
}

.nna-config__estimate:empty {
	display: none;
}

.nna-config__note {
	color: var(--muted);
	font-size: .84rem;
}

/* Product photos */
.gallery__photos {
	position: relative;
	border-radius: var(--r-lg);
	overflow: hidden;
	background: var(--ink-850);
	aspect-ratio: 4 / 5;
}

.gallery__photo {
	position: absolute;
	inset: 0;
	margin: 0;
}

.gallery__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.thumb__ph--img {
	position: relative;
	overflow: hidden;
}

.thumb__ph--img img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.gallery__stage[hidden],
.gallery__photos[hidden] {
	display: none;
}

/* Product reviews (WooCommerce comments) */
#reviews .commentlist {
	display: grid;
	gap: 1rem;
	margin-bottom: 2rem;
}

#reviews .comment_container {
	display: flex;
	gap: 1rem;
	padding: 1.2rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	border: 1px solid var(--line);
}

#reviews .avatar {
	border-radius: 50%;
	width: 44px;
	height: 44px;
}

#reviews .star-rating,
.star-rating {
	position: relative;
	display: inline-block;
	width: 5.4em;
	height: 1.1em;
	font-size: .9rem;
	overflow: hidden;
	color: var(--n-amber);
}

.star-rating::before {
	content: "☆☆☆☆☆";
	position: absolute;
	inset: 0;
	letter-spacing: .1em;
}

.star-rating span {
	position: absolute;
	inset: 0 auto 0 0;
	overflow: hidden;
	padding-top: 1.5em;
}

.star-rating span::before {
	content: "★★★★★";
	position: absolute;
	top: 0;
	left: 0;
	letter-spacing: .1em;
}

.comment-form-rating .stars a {
	color: var(--n-amber);
	margin-right: .3em;
	font-size: 1.2rem;
}

#reviews .comment-reply-title {
	display: block;
	font-family: var(--f-display);
	font-size: 1.6rem;
	margin-bottom: 1rem;
}

.comment-form > p {
	margin-bottom: 1rem;
}

/* 6. Cart, checkout and account -------------------------------------------- */
.store-content {
	--wc-text: var(--text);
}

/* Blocks (default for new stores) */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wc-block-components-sidebar-layout {
	color: var(--text);
}

.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-textarea,
.wc-block-components-form .wc-block-components-text-input input[type] {
	background: var(--ink-850) !important;
	color: var(--text) !important;
	border-color: var(--line-2) !important;
	border-radius: var(--r-sm) !important;
}

.wc-block-components-text-input label,
.wc-blocks-components-select__label,
.wc-block-components-combobox .wc-block-components-combobox-control label {
	color: var(--muted) !important;
}

.wc-block-components-text-input.is-active input,
.wc-block-components-text-input input:focus {
	border-color: var(--n-pink) !important;
	box-shadow: 0 0 0 1px var(--n-pink) !important;
}

.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	min-height: 52px;
	border-radius: 999px !important;
	background: var(--n-pink) !important;
	color: #fff !important;
	border: 0 !important;
	font-weight: 600 !important;
	box-shadow: 0 0 24px color-mix(in srgb, var(--n-pink) 50%, transparent);
	transition: box-shadow .3s;
}

.wc-block-components-button:not(.is-link):hover {
	box-shadow: 0 0 40px color-mix(in srgb, var(--n-pink) 70%, transparent);
}

.wc-block-components-totals-wrapper,
.wc-block-components-order-summary,
.wc-block-cart-items,
.wc-block-cart-items td,
.wc-block-cart-items th,
.wc-block-components-panel,
.wc-block-components-checkout-step,
.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-components-sidebar .wc-block-components-panel {
	border-color: var(--line) !important;
}

.wp-block-woocommerce-cart-order-summary-block,
.wp-block-woocommerce-checkout-order-summary-block {
	border-radius: var(--r-md);
	background: var(--ink-850);
	padding: 1rem 1.2rem !important;
	border: 1px solid var(--line) !important;
}

.wc-block-components-product-name,
.wc-block-components-totals-item__label,
.wc-block-components-title,
.wc-block-components-checkout-step__title {
	color: var(--text) !important;
}

.wc-block-components-checkout-step__title,
.wc-block-cart__totals-title,
.wc-block-components-title.wc-block-components-title {
	font-family: var(--f-display) !important;
	font-weight: 400 !important;
	font-size: 1.6rem !important;
	text-transform: none !important;
}

.wc-block-components-product-metadata,
.wc-block-components-checkout-step__description,
.wc-block-components-formatted-money-amount + *,
.wc-block-components-product-details {
	color: var(--text-2) !important;
}

.wc-block-components-quantity-selector {
	border-color: var(--line-2) !important;
	border-radius: 999px !important;
}

.wc-block-components-quantity-selector input,
.wc-block-components-quantity-selector__button {
	color: var(--text) !important;
	background: transparent !important;
}

.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option {
	border-color: var(--line-2) !important;
	border-radius: var(--r-sm) !important;
}

.wc-block-components-radio-control__input,
.wc-block-components-checkbox__input {
	background: var(--ink-800) !important;
	border-color: var(--line-2) !important;
}

.wc-block-components-checkbox__mark {
	fill: var(--n-pink) !important;
}

.wc-block-components-order-summary-item__quantity {
	background: var(--n-pink) !important;
	color: #fff !important;
	border: 0 !important;
	box-shadow: 0 0 10px color-mix(in srgb, var(--n-pink) 60%, transparent) !important;
}

.wc-block-components-product-image img {
	border-radius: var(--r-sm);
}

.wc-block-cart__empty-cart__title,
.wp-block-woocommerce-empty-cart-block h2 {
	font-family: var(--f-display);
	font-weight: 400;
}

.wc-block-components-totals-coupon__button,
.wc-block-components-totals-coupon-link {
	color: var(--text) !important;
}

.wc-block-components-address-card,
.wc-block-components-address-form {
	color: var(--text);
}

.store-content .wp-block-woocommerce-empty-cart-block .wp-block-separator {
	border-color: var(--line);
}

.store-content .wc-block-grid__product-title,
.store-content .wc-block-grid__product-price {
	color: var(--text);
}

/* Classic (shortcode) cart and checkout */
.store-content table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--line);
	border-radius: var(--r-md);
	overflow: hidden;
	margin-bottom: 2rem;
}

.store-content table.shop_table th,
.store-content table.shop_table td {
	padding: 1rem;
	border-bottom: 1px solid var(--line);
	text-align: left;
	vertical-align: middle;
}

.store-content table.shop_table thead th {
	font-family: var(--f-mono);
	font-size: .74rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 400;
}

.store-content .product-thumbnail img {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: var(--r-xs);
}

.store-content .product-remove a {
	font-size: 1.4rem;
	color: var(--muted);
}

.store-content .cart-collaterals,
.store-content #order_review,
.store-content .woocommerce-checkout-review-order {
	padding: 1.4rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	border: 1px solid var(--line);
}

.store-content .col2-set {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
	gap: 2rem;
	margin-bottom: 2rem;
}

.store-content .form-row {
	margin-bottom: 1rem;
}

.store-content .form-row input,
.store-content .form-row select,
.store-content .form-row textarea {
	width: 100%;
}

.store-content .woocommerce-checkout #payment ul.payment_methods {
	list-style: none;
	padding: 0;
	display: grid;
	gap: .7rem;
	margin-bottom: 1.2rem;
}

.store-content h3 {
	font-family: var(--f-display);
	font-weight: 400;
	font-size: 1.7rem;
	margin: 1.4rem 0 1rem;
}

.store-content .select2-container--default .select2-selection--single {
	height: 48px;
	background: var(--ink-850);
	border: 1px solid var(--line-2);
	border-radius: var(--r-sm);
}

.store-content .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 46px;
	color: var(--text);
}

.select2-dropdown {
	background: var(--ink-800);
	color: var(--text);
	border-color: var(--line-2);
}

/* My account */
.woocommerce-account .store-content .woocommerce {
	display: grid;
	grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
	gap: clamp(1.5rem, 4vw, 3rem);
	align-items: start;
}

.woocommerce-MyAccount-navigation ul {
	display: grid;
	gap: .2rem;
	padding: .6rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	border: 1px solid var(--line);
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: .7em 1em;
	border-radius: var(--r-sm);
	color: var(--text-2);
}

.woocommerce-MyAccount-navigation .is-active a,
.woocommerce-MyAccount-navigation a:hover {
	background: rgba(255, 255, 255, .06);
	color: var(--text);
}

.woocommerce-MyAccount-content {
	color: var(--text-2);
	line-height: 1.7;
}

.woocommerce-MyAccount-content a {
	color: var(--text);
	text-decoration: underline;
	text-decoration-color: var(--n-pink);
}

.woocommerce-account:not(.logged-in) .store-content .woocommerce {
	grid-template-columns: 1fr;
}

.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword {
	max-width: 460px;
	padding: 1.6rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	border: 1px solid var(--line);
}

.woocommerce-form-login .woocommerce-form-login__rememberme {
	display: flex;
	align-items: center;
	gap: .5rem;
}

.woocommerce-order-overview {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	list-style: none;
	padding: 1.2rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	margin-bottom: 2rem;
}

/* 7. Comments (journal) ---------------------------------------------------- */
.comment-list {
	display: grid;
	gap: 1rem;
	list-style: none;
	padding: 0;
}

.comment-body {
	padding: 1.1rem;
	border-radius: var(--r-md);
	background: var(--ink-850);
	border: 1px solid var(--line);
}

.comment-meta {
	font-size: .86rem;
	color: var(--muted);
	margin-bottom: .5rem;
}

/* 8. Responsive ------------------------------------------------------------ */
@media (max-width: 760px) {
	.woocommerce-account .store-content .woocommerce {
		grid-template-columns: 1fr;
	}

	.store-content table.shop_table_responsive thead {
		display: none;
	}

	.store-content table.shop_table_responsive tr td {
		display: flex;
		justify-content: space-between;
		gap: 1rem;
	}

	.store-content table.shop_table_responsive tr td::before {
		content: attr(data-title);
		color: var(--muted);
		font-size: .84rem;
	}

	.buy__form .single_add_to_cart_button,
	.buy__form .nna-buy-now {
		flex-basis: 100%;
	}
}

/* 9. Fixes ----------------------------------------------------------------- */
/* Logged-in staff: keep the header below the WordPress admin bar. */
.admin-bar .hdr {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .hdr {
		top: 46px;
	}
}

/* Product cards: the quick "Add to bag" and badges sit on the photo, never over the name and price. */
.pcard__frame {
	position: relative;
}

.pgrid {
	row-gap: clamp(2.2rem, 4vw, 3.2rem);
}

.pcard__body {
	display: grid;
	gap: .45rem;
}

/* The wall: two rows, each on its own rail. */
.wall__grid + .rail {
	margin-top: clamp(2.4rem, 5vw, 4rem);
}

/* Price tags tucked on the lower corner, clear of the chains. */
.sign .tag {
	top: auto;
	bottom: -1%;
	right: -9%;
	transform: rotate(-6deg);
	transform-origin: 12px 50%;
}

.sign:hover .tag {
	transform: rotate(3deg);
}

/* Hero sign 10% larger on desktop (phones keep their layout). */
@media (min-width: 861px) {
	.hero__sign {
		width: min(704px, 50.6vw, calc(48.4svh * 2.3));
	}

	.hero__reflect {
		width: min(704px, 50.6vw);
	}
}

/* Seasonal sign on the hero plate (Neon Adda → Settings → Seasonal hero sign). */
.plate__slide .hero__season {
	display: grid;
	justify-items: center;
	gap: .1em;
	margin: 0;
	text-align: center;
	line-height: 1;
}

.hero__season-word {
	font-size: 10.5cqw;
	white-space: nowrap;
}

.hero__season-word.tube--script {
	font-size: 13cqw;
}

.hero__season-sub {
	font-family: var(--f-tube);
	font-size: 3.4cqw;
	letter-spacing: .08em;
	white-space: nowrap;
}

.plate__badge {
	position: absolute;
	right: 4.5%;
	bottom: 9%;
	width: 6.5%;
	height: auto;
	opacity: .9;
}

.hero__reflect-word {
	margin: 0;
	padding-top: 6%;
	text-align: center;
	font-size: clamp(2.5rem, 6vw, 5rem);
	color: var(--c);
	text-shadow: 0 0 18px var(--c);
	white-space: nowrap;
}

@media (max-width: 860px) {
	.hero__season-word { font-size: 11cqw; }
	.hero__season-word.tube--script { font-size: 14cqw; }
}

/* Offer banner across the top of the header (Neon Adda → Settings → Offers). */
.hdr.has-offer {
	padding-top: 0;
}

.offerbar {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 34px;
	margin: 0 calc(-1 * var(--gutter)) 10px;
	padding: 5px 48px;
	background: linear-gradient(90deg, rgba(230, 0, 126, .22), rgba(59, 42, 133, .3) 50%, rgba(0, 160, 227, .2));
	border-bottom: 1px solid rgba(255, 46, 154, .35);
	font-size: .84rem;
	text-align: center;
}

.offerbar[hidden],
.offerbar__item[hidden] {
	display: none;
}

.offerbar__item {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: .3rem .7rem;
	margin: 0;
	animation: offer-in .5s var(--ease-out, ease-out);
}

@keyframes offer-in {
	from { opacity: 0; transform: translateY(4px); }
}

.offerbar__item b {
	color: #fff;
	text-shadow: 0 0 10px rgba(255, 46, 154, .8);
}

.offerbar__what,
.offerbar__auto {
	color: var(--text-2);
}

.offerbar__code,
.offers__code {
	padding: .15em .7em;
	border: 1px dashed rgba(255, 255, 255, .55);
	border-radius: 6px;
	font-family: var(--f-mono);
	font-size: .8rem;
	letter-spacing: .08em;
	color: #fff;
	cursor: copy;
	transition: background-color .2s, border-color .2s;
}

.offerbar__code:hover,
.offers__code:hover,
.is-copied {
	background: rgba(255, 46, 154, .25);
	border-color: var(--n-pink);
}

.offerbar__close {
	position: absolute;
	right: var(--gutter);
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 26px;
	color: var(--muted);
	font-size: .8rem;
}

.offers {
	display: grid;
	gap: .6rem;
	padding: 1rem 1.1rem;
	border-radius: var(--r-md);
	border: 1px dashed rgba(255, 46, 154, .45);
	background: rgba(255, 46, 154, .06);
}

.offers ul {
	display: grid;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.offers li {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: .5rem 1rem;
	font-size: .92rem;
	color: var(--text-2);
}

.offers li b {
	color: var(--text);
}

.offers__code small {
	margin-left: .4em;
	color: var(--muted);
	letter-spacing: 0;
	font-family: var(--f-body);
}

.offers__auto {
	color: var(--n-lime);
	font-size: .84rem;
}

@media (max-width: 640px) {
	.offerbar {
		font-size: .76rem;
		padding-inline: 12px 40px;
	}

	.offerbar__what {
		display: none;
	}
}

/* Studio: size heading with the ft / cm switch. */
.drawer__titlerow {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: .6rem 1rem;
}

.drawer__titlerow .drawer__title {
	margin: 0;
}

.unitswitch {
	position: static;
}

.unitswitch .dayswitch__opt {
	min-width: 44px;
	text-transform: none;
}

/* WooCommerce paints .button.alt purple; keep the neon tube button. */
.woocommerce .buy__form button.single_add_to_cart_button.button.alt,
.buy__form button.single_add_to_cart_button {
	background: transparent !important;
	color: #fff !important;
	border: 2px solid color-mix(in srgb, var(--n-pink) 40%, #fff) !important;
	border-radius: 999px !important;
	padding: .9em 1.4em !important;
	font-size: 1rem !important;
	line-height: 1.2 !important;
}

.woocommerce .buy__form button.single_add_to_cart_button.button.alt:hover {
	background: rgba(255, 46, 154, .12) !important;
}


/* The hero plate: smoked acrylic, so the sign reads clearly against the lit bricks. */
.plate--slides {
	display: grid;
	container-type: inline-size;
	background:
		linear-gradient(125deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .02) 34%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, .07)),
		rgba(9, 7, 14, .62);
	border-color: rgba(255, 255, 255, .16);
	-webkit-backdrop-filter: blur(5px) brightness(.7);
	backdrop-filter: blur(5px) brightness(.7);
	box-shadow:
		0 40px 70px -36px #000,
		0 0 0 1px rgba(0, 0, 0, .45),
		inset 0 1px 0 rgba(255, 255, 255, .22),
		inset 0 0 40px rgba(0, 0, 0, .35);
}

/* Slides share one cell; only the current one is shown. */
.plate__slide {
	grid-area: 1 / 1;
	position: relative;
	display: grid;
	place-items: center;
	aspect-ratio: 2496 / 920;
	visibility: hidden;
	opacity: 0;
}

.plate__slide.is-current {
	visibility: visible;
	opacity: 1;
}

.plate__slide .glowimg {
	width: 100%;
	height: 100%;
}

.plate__slide .glowimg > img {
	height: 100%;
	object-fit: contain;
}

/* Clearer tubes: a tighter halo, a softer bloom, and a white-hot centre line like real neon. */
[data-power="on"] .plate__slide .glowimg__core {
	filter: saturate(1.25) brightness(1.3) contrast(1.15);
}

[data-power="on"] .plate__slide .glowimg__bloom {
	opacity: .5;
}

.glowimg__hot {
	opacity: 0;
	mix-blend-mode: screen;
	filter: brightness(2.4) saturate(.35) blur(.4px);
	pointer-events: none;
}

[data-power="on"] .plate__slide .glowimg__hot {
	opacity: .55;
}

/* Switching slides: the tubes die with a stutter, then the next sign lights up. */
.plate__slide.is-dying .tube__ch,
.plate__slide.is-dying .glowimg > img,
.plate__slide.is-dying .plate__badge {
	animation: die .55s steps(1, end) forwards;
}

@keyframes die {
	0% { opacity: 1; }
	20% { opacity: .2; }
	35% { opacity: .9; }
	55% { opacity: .15; }
	70% { opacity: .5; }
	100% { opacity: .06; }
}

.hero__spill {
	transition: opacity 1.2s var(--ease-out), background .6s;
}

/* Lettering on contour-cut acrylic: the canvas tracer (NA.contour) replaces the SVG filter fallback. */
.tube--cut.has-contour::before {
	content: none;
}

.tube > .contour {
	display: block;
	max-width: none;
}

/* Intro loader: the brand symbol warms up like a tube, then the overlay powers off. */
.loader {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: grid;
	place-items: center;
	background: radial-gradient(60% 50% at 50% 45%, #140f20, #050409 70%);
	transition: opacity .7s var(--ease-out, ease-out), visibility .7s;
}

.no-loader .loader {
	display: none;
}

.loader.is-done {
	opacity: 0;
	visibility: hidden;
	animation: power-off .45s steps(1, end);
}

@keyframes power-off {
	0% { opacity: 1; }
	30% { opacity: .35; }
	45% { opacity: .9; }
	70% { opacity: .2; }
	100% { opacity: 0; }
}

.loader__inner {
	display: grid;
	justify-items: center;
	gap: 1rem;
	width: min(320px, 80vw);
}

.loader__mark {
	width: 92px;
	margin-bottom: .6rem;
}

.loader__count {
	margin: 0;
	font-family: var(--f-display);
	font-size: 3.2rem;
	line-height: 1;
	color: var(--text);
	font-variant-numeric: tabular-nums;
}

.loader__line {
	width: 100%;
	height: 2px;
	background: rgba(255, 255, 255, .08);
	border-radius: 2px;
	overflow: hidden;
}

.loader__line span {
	display: block;
	width: 0;
	height: 100%;
	background: var(--n-pink);
	box-shadow: 0 0 8px var(--n-pink), 0 0 18px var(--n-pink);
}

.loader__msg {
	margin: 0;
	font-family: var(--f-mono);
	font-size: .72rem;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--muted);
}

/* Page change: a short power cut with a scan line, then the lights come back on. */
.curtain {
	position: fixed;
	inset: 0;
	z-index: 9999;
	pointer-events: none;
	background: #050409;
	opacity: 0;
	visibility: hidden;
	transition: opacity .45s var(--ease-out, ease-out), visibility .45s;
}

.curtain.is-on,
.is-arriving .curtain {
	opacity: 1;
	visibility: visible;
}

.curtain.is-on {
	pointer-events: auto;
	transition: none;
	animation: cut .5s steps(1, end) both;
}

@keyframes cut {
	0% { opacity: 0; }
	15% { opacity: .55; }
	25% { opacity: .1; }
	40% { opacity: .8; }
	55% { opacity: .35; }
	70%, 100% { opacity: 1; }
}

/* Lights back on: a flicker as the dark lifts (only after a page change). */
.curtain.is-relight {
	animation: relight .6s steps(1, end);
}

.is-arriving .curtain {
	animation: none;
	transition: none;
}

@keyframes relight {
	0% { opacity: 1; visibility: visible; }
	20% { opacity: .3; visibility: visible; }
	32% { opacity: .85; visibility: visible; }
	50% { opacity: .15; visibility: visible; }
	100% { opacity: 0; }
}

.curtain__scan {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 2px;
	background: var(--n-pink);
	box-shadow: 0 0 10px var(--n-pink), 0 0 30px var(--n-pink), 0 0 60px rgba(255, 46, 154, .6);
	opacity: 0;
}

.curtain.is-on .curtain__scan {
	animation: scan .5s var(--ease-out, ease-out) both;
}

@keyframes scan {
	0% { top: 0; opacity: 1; }
	100% { top: 100%; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.curtain,
	.loader {
		display: none;
	}
}

/* Phones: WordPress's admin bar scrolls away below 600px, so the header sits at the very top. */
@media (max-width: 600px) {
	.admin-bar .hdr {
		top: var(--abar, 46px);
	}
}

/* Phones: hanging signs fit their column (the foundation's fixed 240px height made them overflow). */
@media (max-width: 640px) {
	.sign__face {
		width: 100%;
		height: auto;
	}

	.sign--hang .sign__hang {
		margin-top: 54px;
	}

	.sign .tag {
		font-size: .95rem;
		right: -4%;
	}

	.sign__meta {
		gap: .3rem;
	}

	.sign__meta span {
		display: none;
	}

	/* Wall of fame: a swipeable row of upright polaroids, one and a bit on screen. */
	.board {
		margin-inline: calc(-1 * var(--gutter));
		padding-inline: var(--gutter);
		scroll-padding-inline: var(--gutter);
	}

	.polaroid {
		flex: 0 0 72%;
		transform: rotate(calc(var(--r, 0deg) * .4));
	}
}

/* Studio mini preview: only on phones and tablets, where the wall scrolls away. */
.minibar {
	display: none;
}

@media (max-width: 1080px) {
	.minibar {
		--c: var(--n-pink);
		position: fixed;
		top: var(--mini-top, 72px);
		left: 12px;
		right: 12px;
		z-index: 55;
		display: flex;
		align-items: center;
		gap: .7rem;
		padding: 6px 8px 6px 6px;
		border-radius: 16px;
		border: 1px solid var(--line-2);
		background: rgba(8, 7, 13, .9);
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		box-shadow: 0 18px 40px -18px #000;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-14px);
		transition: opacity .35s var(--ease-out, ease-out), transform .35s var(--ease-out, ease-out), visibility .35s;
	}

	.minibar.is-in {
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.minibar__wall {
		flex: 1 1 auto;
		min-width: 0;
		height: 58px;
		display: grid;
		place-items: center;
		overflow: hidden;
		border-radius: 11px;
		background:
			radial-gradient(60% 80% at 50% 50%, color-mix(in srgb, var(--c) 34%, transparent), transparent 75%),
			linear-gradient(180deg, #2a1c20, #140d12);
	}

	.minibar__sign {
		font-size: 26px;
		white-space: nowrap;
	}

	.minibar__info {
		display: grid;
		justify-items: end;
		line-height: 1.15;
		flex: 0 0 auto;
	}

	.minibar__info b {
		font-size: 1.25rem;
		font-weight: 400;
		color: var(--text);
	}

	.minibar__info span {
		font-family: var(--f-mono);
		font-size: .62rem;
		letter-spacing: .1em;
		text-transform: uppercase;
		color: var(--muted);
	}

	.minibar__up {
		flex: 0 0 auto;
		padding: .5em .7em;
		border-radius: 999px;
		border: 1px solid var(--line-2);
		font-size: .74rem;
	}
}

/* Phones: a shorter preview wall, so the tools are closer. */
@media (max-width: 640px) {
	.stagewall {
		height: clamp(330px, 46svh, 400px);
	}

	.mount,
	.stagewall[data-view="scale"] .mount {
		top: 30%;
	}

	.sofa {
		bottom: 32%;
	}

	.sofa__label {
		bottom: calc(32% - 22px);
	}
}

/* Popup banner (Neon Adda → Settings → Popup banner). */
.popup {
	position: fixed;
	inset: 0;
	z-index: 9000;
	display: grid;
	place-items: center;
	padding: 20px;
}

.popup[hidden] {
	display: none;
}

.popup__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(5, 4, 9, .78);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity .45s var(--ease-out, ease-out);
}

.popup__card {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 1rem;
	width: min(760px, 100%);
	max-height: calc(100svh - 40px);
	padding: 10px;
	border-radius: var(--r-lg);
	border: 2px solid color-mix(in srgb, var(--n-pink) 45%, #fff);
	background: var(--ink-850);
	box-shadow:
		0 0 0 1px rgba(255, 46, 154, .5),
		0 0 24px rgba(255, 46, 154, .55),
		0 0 70px rgba(255, 46, 154, .25),
		0 40px 90px -30px #000;
	opacity: 0;
	transform: translateY(18px) scale(.97);
	transition: opacity .45s var(--ease-out, ease-out), transform .55s var(--ease-out, ease-out);
}

.popup.is-open .popup__backdrop,
.popup.is-open .popup__card {
	opacity: 1;
	transform: none;
}

.popup.is-open .popup__card {
	animation: popup-flicker .9s steps(1, end);
}

@keyframes popup-flicker {
	0% { box-shadow: none; }
	12% { box-shadow: 0 0 24px rgba(255, 46, 154, .55); }
	20% { box-shadow: none; }
	34%, 100% { box-shadow: 0 0 0 1px rgba(255, 46, 154, .5), 0 0 24px rgba(255, 46, 154, .55), 0 0 70px rgba(255, 46, 154, .25), 0 40px 90px -30px #000; }
}

.popup__media {
	display: block;
	width: 100%;
	overflow: hidden;
	border-radius: calc(var(--r-lg) - 8px);
}

.popup__media img {
	width: 100%;
	height: auto;
	max-height: calc(100svh - 150px);
	object-fit: contain;
	background: #000;
}

.popup__cta {
	margin-bottom: .4rem;
}

.popup__close {
	position: absolute;
	top: -14px;
	right: -14px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--text);
	color: var(--ink-900);
	font-size: .9rem;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .5);
}

body.has-popup {
	overflow: hidden;
}

@media (max-width: 640px) {
	.popup__close {
		top: -10px;
		right: -6px;
	}
}

/* Header: the title lockup alone, larger (the symbol now floats in the hero). */
.hdr__title {
	width: 125px;
}

@media (max-width: 640px) {
	.hdr__title {
		width: 104px;
	}
}

/* The brand symbol above "Light up your world", drifting slowly like a sign on its chains. */
.hero__mark {
	width: clamp(64px, min(9vw, 11svh), 128px);
	height: auto;
	margin-bottom: -.6rem;
	filter: drop-shadow(0 0 18px rgba(230, 0, 126, .45)) drop-shadow(0 0 40px rgba(59, 42, 133, .35));
	animation: float 6.5s ease-in-out infinite;
	will-change: transform;
}

@keyframes float {
	0%, 100% { transform: translateY(0) rotate(-2deg); }
	50% { transform: translateY(-14px) rotate(2deg); }
}

@media (max-width: 860px) {
	.hero__mark {
		width: 76px;
		margin-bottom: -.4rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hero__mark {
		animation: none;
	}
}

/* Desktop hero: the heading and symbol also scale with screen height, so short screens keep clear of the header. */
@media (min-width: 861px) {
	.hero__copy {
		gap: 1.3rem;
	}

	.hero__title {
		font-size: clamp(3rem, min(1rem + 5.2vw, 9svh), 7.4rem);
	}
}

/* Popup: the card hugs the image. */
.popup__card {
	width: auto;
	max-width: min(760px, 100%);
}

.popup__media img {
	width: auto;
	max-width: 100%;
	max-height: calc(100svh - 190px);
	margin-inline: auto;
	background: transparent;
}

/* Headline lines start fully hidden: the mask's bottom padding no longer shows the tops of the letters. */
.rise > span {
	transform: translateY(calc(105% + .4em));
	opacity: 0;
	transition: transform 1.2s var(--ease-out) var(--delay, 0ms), opacity .5s ease var(--delay, 0ms);
}

.rise.is-in > span,
.is-in .rise > span,
.no-js .rise > span {
	transform: none;
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.rise > span {
		transform: none;
		opacity: 1;
	}
}

/* Arriving: the dark lifts by itself (no waiting for scripts on a slow connection). */
.is-arriving .curtain {
	opacity: 0;
	visibility: hidden;
	animation: arrive .7s steps(1, end);
}

@keyframes arrive {
	0% { opacity: 1; visibility: visible; }
	25% { opacity: .35; visibility: visible; }
	38% { opacity: .9; visibility: visible; }
	60% { opacity: .2; visibility: visible; }
	100% { opacity: 0; visibility: hidden; }
}

/* Leaving: while the next page loads, a small sign switches on in the dark. */
.curtain__load {
	position: absolute;
	left: 50%;
	top: 50%;
	display: grid;
	justify-items: center;
	gap: .7rem;
	transform: translate(-50%, -50%);
	opacity: 0;
	transition: opacity .3s;
}

.curtain.is-on .curtain__load {
	opacity: 1;
	transition-delay: .25s;
}

.curtain__load img {
	width: 56px;
	height: auto;
	filter: drop-shadow(0 0 10px rgba(230, 0, 126, .8)) drop-shadow(0 0 24px rgba(59, 42, 133, .6));
	animation: flick 1.6s steps(1, end) infinite;
}

@keyframes flick {
	0%, 18%, 22%, 60%, 100% { opacity: 1; }
	20%, 61% { opacity: .35; }
}

.curtain__text {
	font-family: var(--f-mono);
	font-size: .7rem;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--text-2);
}

.curtain__bar {
	position: relative;
	width: 120px;
	height: 2px;
	overflow: hidden;
	border-radius: 2px;
	background: rgba(255, 255, 255, .1);
}

.curtain__bar i {
	position: absolute;
	inset: 0 auto 0 0;
	width: 40%;
	background: var(--n-pink);
	box-shadow: 0 0 8px var(--n-pink);
	animation: sweep 1s ease-in-out infinite;
}

@keyframes sweep {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(260%); }
}

/* ---------------------------------------------------------------------------
   Pixel flow: addressable (pixel) LED neon that changes colour and runs effects.
   Every letter is its own strip, so colours can chase from letter to letter.
   ------------------------------------------------------------------------- */
.tube.is-pixel {
	--tc: #ff2d55;
}

.tube.is-pixel .tube__ch {
	animation: px-hue 3.2s linear infinite;
	animation-delay: calc(var(--i, 0) * -.18s);
}

.tube.is-pixel[data-flow="fade"] .tube__ch {
	animation-duration: 6s;
	animation-delay: 0s;
}

.tube.is-pixel[data-flow="pulse"] .tube__ch {
	animation: px-pulse 2.4s ease-in-out infinite;
	animation-delay: calc(var(--i, 0) * -.06s);
}

@keyframes px-hue {
	from { filter: hue-rotate(0deg) saturate(1.3); }
	to { filter: hue-rotate(360deg) saturate(1.3); }
}

@keyframes px-pulse {
	0% { filter: hue-rotate(0deg) brightness(1.15) saturate(1.3); }
	20% { filter: hue-rotate(0deg) brightness(.35) saturate(1.3); }
	25% { filter: hue-rotate(120deg) brightness(.35) saturate(1.3); }
	45% { filter: hue-rotate(120deg) brightness(1.15) saturate(1.3); }
	70% { filter: hue-rotate(120deg) brightness(.35) saturate(1.3); }
	75% { filter: hue-rotate(240deg) brightness(.35) saturate(1.3); }
	100% { filter: hue-rotate(240deg) brightness(1.15) saturate(1.3); }
}

/* The words "Pixel flow" wherever they are offered: a moving rainbow. */
.pixel-word {
	background: linear-gradient(90deg, #ff2d55, #ffb13d, #b9ff4a, #27d4ff, #a35bff, #ff2d55);
	background-size: 200% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	animation: px-slide 3s linear infinite;
	font-weight: 700;
}

@keyframes px-slide {
	to { background-position: -200% 0; }
}

.lightmode {
	margin-bottom: .9rem;
}

.chip--pixel[aria-checked="true"] {
	border-color: transparent;
	background:
		linear-gradient(var(--ink-850), var(--ink-850)) padding-box,
		linear-gradient(90deg, #ff2d55, #ffb13d, #b9ff4a, #27d4ff, #a35bff) border-box;
	border: 1px solid transparent;
}

.flowpick {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .4rem .5rem;
	margin-bottom: .9rem;
}

.flowpick[hidden] {
	display: none;
}

.flowpick .label {
	margin-right: .3rem;
}

.flowpick .dayswitch__opt {
	border: 1px solid var(--line-2);
	border-radius: 999px;
}

.flowpick .dayswitch__opt[aria-checked="true"] {
	background: var(--text);
	color: var(--ink-900);
}

.flowpick .drawer__hint {
	flex-basis: 100%;
	margin: .2rem 0 0;
}

[data-single-controls].is-muted {
	opacity: .35;
	pointer-events: none;
	filter: grayscale(.6);
}

@media (prefers-reduced-motion: reduce) {
	.tube.is-pixel .tube__ch,
	.pixel-word {
		animation: none;
	}
}

/* Four specialties side by side on wide screens. */
@media (min-width: 1081px) {
	.specs {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.spec__vis--pixel {
	display: grid;
	place-items: center;
	background: radial-gradient(60% 60% at 50% 50%, rgba(163, 91, 255, .25), transparent 70%), #0d0b14;
}

.spec__vis--pixel .tube {
	font-size: clamp(3rem, 5vw, 4.4rem);
}

.badge--pixel {
	color: #fff;
	background: linear-gradient(90deg, #ff2d55, #ffb13d, #27d4ff, #a35bff);
}

/* "Also available on" marketplaces */
.markets {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	align-items: center;
	gap: clamp(1.2rem, 4vw, 3rem);
	margin-block: clamp(1rem, 3vw, 2rem) clamp(2rem, 5vw, 3.5rem);
	padding: clamp(1.2rem, 3vw, 2rem);
	border-radius: var(--r-lg);
	border: 1px solid var(--line);
	background: linear-gradient(120deg, rgba(255, 46, 154, .08), rgba(39, 212, 255, .06));
}

.markets__copy p:not(.stamp) {
	color: var(--text-2);
	margin: .4rem 0 0;
}

.markets__list {
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
	justify-content: flex-end;
}

.market {
	display: inline-flex;
	align-items: center;
	gap: .8rem;
	min-height: 64px;
	padding: .7rem 1.2rem;
	border-radius: var(--r-md);
	background: #fff;
	color: #111;
	font-weight: 700;
	box-shadow: 0 10px 30px -14px #000;
	transition: transform .3s var(--ease-out), box-shadow .3s;
}

.market:hover {
	transform: translateY(-3px);
	box-shadow: 0 0 0 2px var(--n-pink), 0 14px 40px -14px var(--n-pink);
}

.market img {
	height: 34px;
	width: auto;
}

.market__name {
	font-size: 1.25rem;
	letter-spacing: -.01em;
}

.market__go {
	font-size: .82rem;
	color: #555;
	font-weight: 600;
}

.markets--compact {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .6rem;
	grid-template-columns: none;
	margin: 0 0 1.4rem;
	padding: 0;
	border: 0;
	background: none;
}

.markets--compact .market {
	min-height: 40px;
	padding: .4rem .9rem;
	border-radius: 999px;
	font-size: .9rem;
}

.markets--compact .market img {
	height: 22px;
}

@media (max-width: 760px) {
	.markets {
		grid-template-columns: 1fr;
	}

	.markets__list {
		justify-content: flex-start;
	}
}

/* Journal comments */
.comments {
	max-width: 72ch;
	margin-top: 3rem;
}

.comments__title {
	margin-bottom: 1rem;
}

.comment-form {
	display: grid;
	gap: .9rem;
	margin-top: 1rem;
}

.comment-form label {
	display: block;
	margin-bottom: .3rem;
	color: var(--text-2);
	font-size: .9rem;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	min-height: 46px;
	padding: .7em 1em;
	border: 1px solid var(--line-2);
	border-radius: var(--r-sm);
	background: var(--ink-850);
	color: var(--text);
	font: inherit;
}

.comment-notes,
.logged-in-as {
	color: var(--muted);
	font-size: .86rem;
}

/* ---------------------------------------------------------------------------
   Performance: keep scrolling smooth.
   ------------------------------------------------------------------------- */
/* Film grain: static and unblended. A full-screen blended, animated layer forced a
   full repaint on every scroll frame. */
.grain {
	animation: none;
	mix-blend-mode: normal;
	opacity: .045;
}

/* A fixed page background repaints on every scroll; the dusk gradient now scrolls with the page. */
body {
	background-attachment: scroll;
}

/* Frosted-glass blur on many small elements is costly; solid tints look the same here. */
.pcard__fav,
.space__name,
.reel__play {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}

.pcard__fav {
	background: rgba(8, 7, 13, .78);
}

.space__name {
	background: rgba(8, 7, 13, .72);
}

.reel__play {
	background: rgba(8, 7, 13, .7);
}

/* Moving marquees on their own layer, so they never repaint the page. */
.usp__track,
.strip__track {
	will-change: transform;
}

/* Sections far below the fold are not rendered until they are close to the screen. */
#spaces,
#specialties,
#words,
#projects,
#videos,
#reviews,
#social,
#about,
#faq,
#visit,
.strip,
.ftr {
	content-visibility: auto;
	contain-intrinsic-size: auto 900px;
}

.strip {
	contain-intrinsic-size: auto 160px;
}
