@property --yo2-spot-radius {
	syntax: "<length>";
	inherits: false;
	initial-value: 0px;
}

:root {
	--yo2-paper: #000000;
	--yo2-ink: #f7f7f4;
	--yo2-acid: #4fc1c6;
	--yo2-line: rgba(255, 255, 255, .17);
	--yo2-glass: rgba(12, 15, 15, .62);
	--yo2-ease: cubic-bezier(.16, 1, .3, 1);
}

html,
body.fs-yo2-portfolio {
	background: var(--yo2-paper);
	color: var(--yo2-ink);
	height: 100%;
	margin: 0;
	overflow: hidden;
	width: 100%;
}

body.fs-yo2-portfolio {
	font-family: 'BaiJamjuree-Regular', Arial, sans-serif;
	min-height: 100dvh;
}

body.fs-yo2-portfolio::before {
	background: #000000;
	content: "";
	inset: 0;
	pointer-events: none;
	position: fixed;
	z-index: 0;
}

.yo2-skip-link {
	background: #fff;
	color: #050606;
	left: 12px;
	padding: 10px 14px;
	position: fixed;
	top: 12px;
	transform: translateY(-180%);
	z-index: 1000001;
}

.yo2-skip-link:focus {
	transform: none;
}

.yo2-identity {
	left: clamp(22px, 3vw, 60px);
	opacity: 0;
	pointer-events: none;
	position: fixed;
	top: clamp(22px, 3vw, 60px);
	transition: opacity .7s cubic-bezier(.23, 1, .32, 1);
	visibility: hidden;
	z-index: 80;
}

body.is-copy-complete .yo2-identity {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}

.yo2-identity__logo {
	color: #fff;
	display: block;
	height: auto;
	transition: transform .35s var(--yo2-ease), opacity .25s ease;
	width: 38px;
}

.yo2-identity__logo:hover,
.yo2-identity__logo:focus-visible {
	opacity: .9;
	transform: rotate(-5deg) scale(1.07);
}

.yo2-identity__svg {
	display: block;
	height: auto;
	width: 100%;
}

.yo2-page,
.yo2-hero,
.yo2-stage {
	inset: 0;
	position: fixed;
}

.yo2-page {
	isolation: isolate;
	z-index: 1;
}

.yo2-hero {
	color: #fff;
	pointer-events: none;
	z-index: 3;
}

.yo2-hero__center {
	left: 50%;
	position: absolute;
	text-align: left;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 35.3vw;
}

.yo2-hero__message {
	height: 8vw;
	opacity: 0;
	width: 35.1vw;
}

.yo2-hero__message h1 {
	font-family: 'BaiJamjuree-Light', Arial, sans-serif;
	font-size: 3.58vw;
	font-weight: normal;
	letter-spacing: .70vh;
	line-height: 4.026vw;
	margin: 0;
	text-transform: uppercase;
}

.yo2-hero__message h1 strong {
	display: inline-block;
	font-family: 'BaiJamjuree-Bold', Arial, sans-serif;
	font-weight: normal;
	margin-right: 0;
}

.yo2-hero__message h1 label {
	display: block;
	font-size: 3.87vw;
	letter-spacing: .06vw;
}

.yo2-hero__message h1 label span {
	color: var(--yo2-acid);
}

.yo2-hero__roles {
	display: flex;
	justify-content: space-between;
	padding: 0 0 0 .2vw;
	text-transform: uppercase;
	width: var(--yo2-role-line-width, 35.1vw);
}

.yo2-hero__roles span {
	font-size: 1.2vw;
	opacity: 0;
	padding: .54vw 0;
	transition: opacity .7s cubic-bezier(.23, 1, .32, 1);
	visibility: hidden;
}

.yo2-hero.is-copy-complete .yo2-hero__roles span {
	opacity: 1;
	visibility: visible;
}

.yo2-stage {
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	transition: opacity .75s var(--yo2-ease);
	visibility: hidden;
	z-index: 6;
}

body.is-work-revealed .yo2-stage {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}

.yo2-fall-field,
.yo2-media-trail {
	inset: 0;
	position: absolute;
}

.yo2-fall-field {
	overflow: hidden;
	touch-action: none;
}

.fall-card {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	cursor: grab;
	left: 0;
	margin: 0;
	opacity: 0;
	overflow: visible;
	padding: 0;
	position: absolute;
	top: 0;
	transform-origin: center;
	width: var(--fall-width);
}

.fall-card.is-spawned {
	opacity: .99;
}

.fall-card.is-dragging {
	cursor: grabbing;
	z-index: 45;
}

.fall-card.is-dragging .project-device {
	transform: scale(1.025);
}

.fall-card.is-dragging .project-device__frame {
	filter: drop-shadow(0 30px 45px rgba(0, 0, 0, .82)) brightness(1.08);
}

.project-device-host {
	--device-shadow: drop-shadow(0 22px 28px rgba(0, 0, 0, .62));
	aspect-ratio: var(--device-aspect);
	position: relative;
}

.project-device {
	display: block;
	inset: 0;
	overflow: visible;
	pointer-events: none;
	position: absolute;
	transform-origin: center;
	transition: transform .22s var(--yo2-ease);
	user-select: none;
}

.project-device__frame {
	border: 0;
	border-radius: 0;
	filter: var(--device-shadow);
	height: 100%;
	inset: 0;
	object-fit: fill;
	pointer-events: none;
	position: absolute;
	transition: filter .22s ease;
	user-select: none;
	width: 100%;
	z-index: 2;
}

.project-device__screen {
	backface-visibility: visible;
	background: #050606;
	display: block;
	overflow: hidden;
	position: absolute;
	transform-origin: 0 0;
	z-index: 1;
}

.project-device__screen-inner {
	background: #050606;
	display: block;
	height: 100%;
	image-rendering: auto;
	image-rendering: smooth;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.project-device__screen-inner > img,
.project-device__screen-inner > video {
	border: 0;
	border-radius: 0;
	display: block;
	height: auto;
	image-rendering: auto;
	image-rendering: smooth;
	max-height: none;
	object-fit: contain;
	object-position: top center;
	pointer-events: none;
	width: 100%;
}

.project-device--macbook .project-device__screen {
	border-radius: 2% 2% 0 0;
	height: 53.852%;
	left: .947%;
	top: 42.691%;
	transform: rotate(-30.03deg);
	width: 74.25%;
}

.project-device--imac .project-device__screen {
	height: 47.796%;
	left: 3.985%;
	top: 47.022%;
	transform: rotate(-30.10deg);
	width: 76.991%;
}

.project-device--ipad .project-device__screen {
	border-radius: 2.5%;
	height: 76.726%;
	left: 2.557%;
	top: 30.894%;
	transform: rotate(-29.65deg);
	width: 62.056%;
}

.project-device--iphone {
	--device-safe-area-background: #fff;
	--device-safe-area-top: 0%;
}

.project-device--iphone .project-device__screen {
	border-radius: 14% / 6%;
	height: 92.332%;
	left: -.394%;
	top: 20.703%;
	transform: rotate(-30.26deg);
	width: 51.287%;
}

.project-device--iphone .project-device__screen-inner {
	background: #fff;
}

.project-device--iphone .project-device__screen-inner::before {
	background: var(--device-safe-area-background);
	box-shadow: 0 1px 0 rgba(0, 0, 0, .055);
	content: none;
	height: var(--device-safe-area-top);
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
}

.project-device--iphone.project-device--renderer-safe-area .project-device__screen-inner::before {
	content: "";
}

.project-device--iphone .project-device__screen-inner > img,
.project-device--iphone .project-device__screen-inner > video {
	height: auto;
	left: 0;
	position: absolute;
	top: 0;
	transform: none;
}

.project-device--iphone.project-device--renderer-safe-area .project-device__screen-inner > img,
.project-device--iphone.project-device--renderer-safe-area .project-device__screen-inner > video {
	top: var(--device-safe-area-top);
}

.media-placeholder {
	background: linear-gradient(135deg, #151919, #080909);
	display: block;
	height: 100%;
	width: 100%;
}

.yo2-spotlight-grid {
	--yo2-spot-radius: 0px;
	--yo2-spot-open-radius: 220px;
	display: grid;
	gap: clamp(5px, .6vw, 10px);
	grid-template-columns: repeat(7, minmax(0, 1fr));
	grid-template-rows: repeat(5, minmax(0, 1fr));
	inset: clamp(6px, .8vw, 14px);
	-webkit-mask-image: radial-gradient(circle var(--yo2-spot-radius) at var(--yo2-spot-x, 50%) var(--yo2-spot-y, 50%), #000 0 46%, rgba(0, 0, 0, .22) 76%, transparent 100%);
	mask-image: radial-gradient(circle var(--yo2-spot-radius) at var(--yo2-spot-x, 50%) var(--yo2-spot-y, 50%), #000 0 46%, rgba(0, 0, 0, .22) 76%, transparent 100%);
	position: absolute;
	transition: --yo2-spot-radius .09s cubic-bezier(.55, 0, 1, .45);
}

.yo2-spotlight-grid.is-lit {
	--yo2-spot-radius: var(--yo2-spot-open-radius);
}

.yo2-spotlight-item {
	background: #111515;
	border: 1px solid rgba(255, 255, 255, .15);
	border-radius: 7px;
	cursor: pointer;
	margin: 0;
	min-height: 0;
	min-width: 0;
	overflow: hidden;
	padding: 0;
	position: relative;
}

.yo2-spotlight-item:hover,
.yo2-spotlight-item:focus-visible {
	border-color: var(--yo2-acid);
}

.yo2-spotlight-item[aria-disabled="true"] {
	cursor: default;
}

.yo2-spotlight-item > span,
.yo2-spotlight-item img,
.yo2-spotlight-item video {
	display: block;
	height: 100%;
	width: 100%;
}

.yo2-spotlight-item img,
.yo2-spotlight-item video {
	object-fit: cover;
}

.yo2-media-trail {
	pointer-events: auto;
}

.yo2-trail-card {
	background: transparent;
	border: 0;
	box-shadow: none;
	cursor: pointer;
	left: 0;
	margin: 0;
	overflow: visible;
	padding: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	top: 0;
	transform: translate(-50%, -50%);
	transition: none;
	will-change: transform, opacity;
}

.yo2-trail-card.is-life-held {
	opacity: 1 !important;
}

.yo2-trail-card.project-device-host--desktop,
.yo2-trail-card.project-device-host--tablet,
.yo2-trail-card.project-device-host--phone {
	width: clamp(150px, 15vw, 240px);
}

.yo2-trail-card.is-treboro-dismissing,
.yo2-trail-card.is-project-dismissing,
.yo2-trail-card.is-project-restoring {
	pointer-events: none;
}

.yo2-project-modal {
	align-items: center;
	backdrop-filter: blur(6px);
	background: rgba(0, 0, 0, .74);
	display: grid;
	inset: 0;
	justify-items: center;
	padding: clamp(16px, 4vw, 52px);
	position: fixed;
	z-index: 900000;
}

.yo2-project-modal[hidden] {
	display: none;
}

.yo2-project-modal__panel {
	animation: yo2-project-modal-in .32s var(--yo2-ease) both;
	background: rgba(8, 10, 10, .96);
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 12px;
	box-shadow: 0 28px 88px rgba(0, 0, 0, .62);
	display: grid;
	grid-template-columns: minmax(190px, 230px) minmax(0, 1fr);
	max-height: calc(100dvh - 32px);
	overscroll-behavior: contain;
	overflow: auto;
	position: relative;
	width: min(660px, 100%);
}

.yo2-project-modal__close {
	align-items: center;
	backdrop-filter: blur(8px);
	background: rgba(7, 9, 9, .78);
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 999px;
	color: #fff;
	cursor: pointer;
	display: flex;
	font: 28px/1 Arial, sans-serif;
	font-weight: 200;
	height: 44px;
	justify-content: center;
	min-height: 44px;
	min-width: 44px;
	padding: 0;
	position: absolute;
	right: 10px;
	top: 10px;
	transition: background-color .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
	width: 44px;
	z-index: 3;
}

.yo2-project-modal__close:hover {
	background: #fff;
	border-color: #fff;
	color: #000;
	outline: none;
	transform: scale(1.04);
}

.yo2-project-modal__close:focus-visible {
	background: rgba(7, 9, 9, .9);
	border-color: rgba(255, 255, 255, .72);
	color: #fff;
	outline: 2px solid rgba(255, 255, 255, .9);
	outline-offset: 2px;
}

.yo2-project-modal__visual {
	align-self: stretch;
	background: rgba(0, 0, 0, .5);
	border-right: 1px solid rgba(255, 255, 255, .11);
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	padding: 18px;
	position: relative;
}

.yo2-project-modal__media {
	aspect-ratio: 16 / 9;
	background: #000;
	border: 1px solid rgba(255, 255, 255, .1);
	display: grid;
	overflow: hidden;
	place-items: center;
	position: relative;
	width: 100%;
}

.yo2-project-modal__slides {
	display: flex;
	height: 100%;
	overflow: hidden;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	width: 100%;
}

.yo2-project-modal__slides::-webkit-scrollbar {
	display: none;
}

.yo2-project-modal__slide {
	background: #000;
	display: grid;
	flex: 0 0 100%;
	height: 100%;
	margin: 0;
	min-width: 0;
	overflow: hidden;
	place-items: center;
	position: relative;
	scroll-snap-align: start;
}

.yo2-project-modal__slide > img,
.yo2-project-modal__slide > video,
.yo2-project-modal__slide > .media-placeholder {
	display: block;
	height: 100%;
	object-fit: contain;
	width: 100%;
}

.yo2-project-modal__slide figcaption {
	background: rgba(0, 0, 0, .72);
	bottom: 8px;
	color: rgba(255, 255, 255, .78);
	display: none;
	font-size: 9px;
	left: 8px;
	letter-spacing: .11em;
	padding: 5px 7px;
	position: absolute;
	text-transform: uppercase;
}

.yo2-project-modal__gallery-controls {
	align-items: center;
	border-top: 1px solid rgba(255, 255, 255, .1);
	display: grid;
	grid-template-columns: 44px minmax(0, 1fr) 44px;
	min-height: 52px;
}

.yo2-project-modal__gallery-controls[hidden] {
	display: none;
}

.yo2-project-modal__gallery-controls button {
	align-items: center;
	background: transparent;
	border: 0;
	color: #fff;
	cursor: pointer;
	display: flex;
	font: 17px/1 Arial, sans-serif;
	height: 44px;
	justify-content: center;
	min-width: 44px;
	padding: 0;
}

.yo2-project-modal__gallery-controls button:hover,
.yo2-project-modal__gallery-controls button:focus-visible {
	background: rgba(255, 255, 255, .1);
	outline: 1px solid rgba(255, 255, 255, .65);
	outline-offset: -1px;
}

.yo2-project-modal__gallery-controls button:disabled {
	cursor: default;
	opacity: .25;
}

.yo2-project-modal__gallery-controls > span {
	color: rgba(255, 255, 255, .62);
	font-size: 10px;
	letter-spacing: .12em;
	text-align: center;
}

.yo2-project-modal__copy {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	padding: 27px 28px 25px;
}

.yo2-project-modal__copy h2 {
	color: #fff;
	font-family: 'BaiJamjuree-Light', Arial, sans-serif;
	font-size: clamp(26px, 3.2vw, 36px);
	font-weight: normal;
	letter-spacing: -.035em;
	line-height: 1.02;
	margin: 0;
}

.yo2-project-modal__copy p {
	color: rgba(255, 255, 255, .68);
	font-size: clamp(13px, 1.15vw, 15px);
	line-height: 1.42;
	margin: 14px 0 0;
	max-width: 62ch;
}

.yo2-project-modal__editorial {
	align-items: end;
	display: grid;
	gap: 24px;
	grid-template-columns: minmax(0, 1fr) auto;
	min-width: 0;
}

.yo2-project-modal__primary {
	min-width: 0;
}

.yo2-project-modal__meta {
	align-items: baseline;
	border-top: 1px solid rgba(255, 255, 255, .11);
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	margin-top: 17px;
	padding-top: 11px;
}

.yo2-project-modal__meta > span {
	color: rgba(255, 255, 255, .48);
	font-size: 10px;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.yo2-project-modal__copy .yo2-project-modal__credit {
	color: rgba(255, 255, 255, .5);
	font-size: 10px;
	letter-spacing: .08em;
	line-height: 1.3;
	margin: 0;
	text-transform: uppercase;
}

.yo2-project-modal__credit[hidden] {
	display: none;
}

.yo2-project-modal__credit a {
	color: rgba(255, 255, 255, .86);
	text-decoration-color: rgba(255, 255, 255, .4);
	text-underline-offset: 3px;
}

.yo2-project-modal__credit a:hover,
.yo2-project-modal__credit a:focus-visible {
	color: #fff;
	outline: 1px solid rgba(255, 255, 255, .5);
	outline-offset: 3px;
}

.yo2-project-modal__footer {
	align-items: center;
	border-top: 1px solid rgba(255, 255, 255, .11);
	display: flex;
	justify-content: flex-end;
	margin-top: 19px;
	padding-top: 12px;
}

.yo2-project-modal__footer[hidden] {
	display: none;
}

.yo2-project-modal__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.yo2-project-modal__link {
	align-items: center;
	border: 1px solid rgba(255, 255, 255, .34);
	border-radius: 999px;
	color: #fff;
	display: inline-flex;
	font: 11px/1 'BaiJamjuree-Regular', Arial, sans-serif;
	gap: 9px;
	letter-spacing: .1em;
	margin-top: 16px;
	min-height: 44px;
	padding: 0 17px;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

.yo2-project-modal__link[hidden] {
	display: none;
}

.yo2-project-modal__link:hover,
.yo2-project-modal__link:focus-visible {
	background: #fff;
	border-color: #fff;
	color: #000;
	outline: none;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__panel {
	display: flex;
	flex-direction: column;
	width: min(640px, 100%);
}

body[data-yo2-project-view="caption"] .yo2-project-modal__visual {
	background: #000;
	border-bottom: 1px solid rgba(255, 255, 255, .11);
	border-right: 0;
	display: block;
	flex: 0 0 auto;
	padding: 0;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__media {
	aspect-ratio: 16 / 9;
	border: 0;
	width: 100%;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__copy {
	justify-content: flex-start;
	padding: 22px 26px 20px;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__editorial {
	gap: clamp(24px, 4vw, 52px);
}

body[data-yo2-project-view="caption"] .yo2-project-modal__link {
	margin-top: 0;
}

body[data-yo2-project-view="gallery"] .yo2-project-modal__panel {
	grid-template-columns: minmax(320px, 430px) minmax(270px, 1fr);
	height: min(390px, calc(100dvh - 32px));
	min-height: 0;
	width: min(790px, 100%);
}

body[data-yo2-project-view="gallery"] .yo2-project-modal__visual {
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	min-height: 0;
	overflow: hidden;
	padding: 0;
}

body[data-yo2-project-view="gallery"] .yo2-project-modal__media {
	aspect-ratio: auto;
	border: 0;
	height: auto;
	min-height: 0;
}

body[data-yo2-project-view="gallery"] .yo2-project-modal__slides {
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
}

body[data-yo2-project-view="gallery"] .yo2-project-modal__slide figcaption,
body[data-yo2-project-view="inspector"] .yo2-project-modal__slide figcaption {
	display: block;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__slides {
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
}

body[data-yo2-project-view="caption"] .yo2-project-modal__gallery-controls {
	border: 1px solid rgba(255, 255, 255, .1);
	margin-top: 8px;
	min-height: 44px;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal {
	background: rgba(0, 0, 0, .62);
	justify-items: end;
	padding: 14px;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__panel {
	display: flex;
	flex-direction: column;
	height: calc(100dvh - 28px);
	width: min(410px, 100%);
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__copy {
	flex: 0 0 auto;
	justify-content: flex-start;
	order: 1;
	padding: 30px 28px 22px;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__visual {
	border-right: 0;
	border-top: 1px solid rgba(255, 255, 255, .11);
	display: block;
	justify-content: initial;
	order: 2;
	overflow: auto;
	padding: 14px;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__media {
	aspect-ratio: auto;
	background: transparent;
	border: 0;
	display: block;
	overflow: visible;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__slides {
	display: grid;
	gap: 9px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	height: auto;
	overflow: visible;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__slide {
	aspect-ratio: 4 / 3;
	border: 1px solid rgba(255, 255, 255, .11);
	min-height: 0;
}

body[data-yo2-project-view="inspector"] .yo2-project-modal__slide:first-child {
	aspect-ratio: 16 / 9;
	grid-column: 1 / -1;
}

body.is-project-open .yo2-identity,
body.is-project-open .yo2-hero,
body.is-project-open .yo2-stage {
	pointer-events: none;
}

body.is-project-open .fs-treboro-home {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}

body.is-background-paused .yo2-stage * {
	animation-play-state: paused !important;
}

@keyframes yo2-project-modal-in {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}

.fs-treboro-home {
	background: transparent;
	border: 0;
	bottom: clamp(18px, 3vw, 38px);
	color: #fff;
	cursor: pointer;
	height: 112px;
	margin: 0;
	opacity: 0;
	overflow: visible;
	padding: 0;
	pointer-events: none;
	position: fixed;
	right: clamp(18px, 3vw, 46px);
	transition: opacity .7s cubic-bezier(.23, 1, .32, 1);
	visibility: hidden;
	width: 104px;
	z-index: 1000000;
}

body.is-copy-complete:not(.is-project-open):not(.is-treboro-open) .fs-treboro-home:not([hidden]) {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}

.fs-treboro-home[hidden] {
	display: none !important;
}

.fs-treboro-shell {
	align-items: center;
	display: flex;
	height: 112px;
	justify-content: center;
	position: relative;
	width: 104px;
}

body.is-copy-complete:not(.is-background-paused) .fs-treboro-home:not([hidden]) .fs-treboro-shell {
	animation: yo2-treboro-float 3.2s ease-in-out infinite;
}

.fs-treboro-shell .fs-quote-terminal-avatar-canvas {
	display: block;
	height: 102px;
	image-rendering: pixelated;
	width: 88px;
}

.fs-treboro-home-label {
	backdrop-filter: blur(14px);
	background: rgba(5, 6, 6, .75);
	border: 1px solid var(--yo2-line);
	border-radius: 999px;
	font-size: 9px;
	letter-spacing: .1em;
	max-width: 230px;
	opacity: 0;
	padding: 9px 12px;
	pointer-events: none;
	position: absolute;
	right: calc(100% + 4px);
	top: 50%;
	transform: translate(10px, -50%) scale(.78);
	transform-origin: right center;
	transition: opacity .12s ease, transform .14s var(--yo2-ease);
	white-space: nowrap;
}

.fs-treboro-home:hover .fs-treboro-home-label,
.fs-treboro-home:focus-visible .fs-treboro-home-label {
	opacity: 1;
	transform: translate(0, -50%) scale(1);
}

.fs-quote-terminal-avatar .fs-treboro-shell {
	height: 112px;
	width: 104px;
}

.fs-treboro-shell.has-avatar-error {
	display: none;
}

@keyframes yo2-treboro-float {
	0%, 100% { transform: translateY(-4px) rotate(-1deg); }
	50% { transform: translateY(5px) rotate(1deg); }
}

body.is-treboro-open .yo2-identity,
body.is-treboro-open .yo2-hero,
body.is-treboro-open .yo2-stage {
	pointer-events: none;
}

body.is-treboro-open .yo2-identity *,
body.is-treboro-open .yo2-hero *,
body.is-treboro-open .yo2-stage * {
	animation-play-state: paused !important;
}

body.is-treboro-open .yo2-spotlight-grid {
	--yo2-spot-radius: 0px !important;
	transition: none;
}

@media (max-width: 1600px) and (min-width: 761px) {
	.yo2-hero__message h1 { letter-spacing: .42vh; }
}

@media (max-width: 760px) {
	.yo2-identity { left: 24px; top: 24px; }
	.yo2-identity__logo { width: 30px; }
	.yo2-hero__center { width: 86vw; }
	.yo2-hero__message { height: 22vw; width: 86vw; }
	.yo2-hero__message h1 { font-size: 9.2vw; letter-spacing: .18vh; line-height: 10.6vw; }
	.yo2-hero__message h1 label { font-size: 8.6vw; letter-spacing: .08vw; }
	.yo2-hero__roles { padding: 0; width: var(--yo2-role-line-width, 86vw); }
	.yo2-hero__roles span { font-size: 2.75vw; padding: 1.8vw 0; }
	.yo2-spotlight-grid { --yo2-spot-open-radius: 140px; gap: 5px; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(12, minmax(0, 1fr)); inset: 8vh 4vw 17vh; }
	.yo2-project-modal { align-items: center; padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
	.yo2-project-modal__panel { border-radius: 14px; display: flex; flex-direction: column; max-height: calc(88dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); width: 100%; }
	.yo2-project-modal__copy { justify-content: flex-start; order: 1; padding: 25px 58px 19px 20px; }
	.yo2-project-modal__copy h2 { font-size: clamp(25px, 8vw, 34px); }
	.yo2-project-modal__copy p { font-size: 13px; }
	.yo2-project-modal__visual { border-right: 0; border-top: 1px solid rgba(255, 255, 255, .11); order: 2; padding: 10px; }
	.yo2-project-modal__media { aspect-ratio: 16 / 9; margin: 0 auto; max-width: 230px; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__panel { max-height: calc(92dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
	body[data-yo2-project-view="caption"] .yo2-project-modal__visual { border-top: 0; order: 1; padding: 0; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__media { margin: 0; max-width: none; width: 100%; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__copy { order: 2; padding: 18px 20px 20px; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__editorial { display: block; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__actions { margin-top: 17px; }
	body[data-yo2-project-view="caption"] .yo2-project-modal__footer { justify-content: flex-start; margin-top: 17px; }
	body[data-yo2-project-view="gallery"] .yo2-project-modal__panel { display: flex; height: auto; min-height: 0; width: 100%; }
	body[data-yo2-project-view="gallery"] .yo2-project-modal__visual { border-top: 0; order: 1; padding: 0; }
	body[data-yo2-project-view="gallery"] .yo2-project-modal__media { height: min(54vw, 220px); min-height: 190px; max-width: none; width: 100%; }
	body[data-yo2-project-view="gallery"] .yo2-project-modal__copy { order: 2; }
	body[data-yo2-project-view="inspector"] .yo2-project-modal { justify-items: center; padding: max(8px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
	body[data-yo2-project-view="inspector"] .yo2-project-modal__panel { display: flex; height: auto; max-height: calc(88dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); width: 100%; }
	body[data-yo2-project-view="inspector"] .yo2-project-modal__copy { padding: 25px 58px 19px 20px; }
	body[data-yo2-project-view="inspector"] .yo2-project-modal__visual { max-height: 42dvh; padding: 10px; }
	.fs-treboro-home { bottom: 12px; right: 8px; }
	.fs-quote-terminal-window { border-radius: 14px; height: calc(var(--fs-quote-visual-height, 100dvh) - 16px) !important; inset: calc(var(--fs-quote-visual-offset-top, 0px) + 8px) 8px auto !important; min-height: 0; min-width: 0; width: auto !important; }
	.fs-quote-terminal-window.is-minimized { height: 42px !important; top: auto !important; }
	.fs-quote-terminal-titlebar { cursor: default; grid-template-columns: 78px minmax(0, 1fr) auto; padding: 0 10px; }
	.fs-quote-terminal-actions { gap: 4px; }
	.fs-quote-terminal-resources-toggle { font-size: 10px; padding-left: 7px; padding-right: 7px; }
	.fs-quote-terminal-output { font-size: 12px; line-height: 18px; padding: 18px 13px 158px; }
	.fs-quote-terminal-text { line-height: 16px; }
	.fs-quote-terminal-line { gap: 8px; grid-template-columns: 62px minmax(0, 1fr); margin-bottom: 8px; }
	.fs-quote-terminal-mobile-composer:not([hidden]) { background: rgba(8, 11, 14, .94); backdrop-filter: blur(18px) saturate(135%); -webkit-backdrop-filter: blur(18px) saturate(135%); border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px; bottom: max(10px, env(safe-area-inset-bottom)); box-shadow: 0 14px 40px rgba(0, 0, 0, .36); display: block; left: 10px; padding: 8px; position: absolute; right: 10px; z-index: 6; }
	.fs-quote-terminal-line.is-mobile-composer { align-items: end; gap: 7px; grid-template-columns: auto minmax(0, 1fr) auto; margin: 0; }
	.fs-quote-terminal-line.is-mobile-composer .fs-quote-terminal-prompt { align-self: center; font-size: 11px; max-width: 54px; }
	.fs-quote-terminal-line.is-mobile-composer .fs-quote-terminal-input { background: rgba(255, 255, 255, .055) !important; border: 1px solid rgba(255, 255, 255, .13) !important; border-radius: 10px; box-sizing: border-box; font-size: 16px; height: 40px; line-height: 22px; min-height: 40px; overflow-y: auto; padding: 8px 10px; }
	.fs-quote-terminal-line.is-mobile-composer .fs-quote-terminal-input:focus { border-color: rgba(0, 229, 255, .52) !important; box-shadow: 0 0 0 2px rgba(0, 229, 255, .11) !important; }
	.fs-quote-terminal-line.is-mobile-composer .fs-quote-terminal-input::placeholder { color: rgba(238, 248, 250, .42); }
	.fs-quote-terminal-send { appearance: none; background: #00E5FF; border: 0; border-radius: 10px; color: #071215; cursor: pointer; font-family: 'BaiJamjuree-Medium', 'BaiJamjuree-Regular', sans-serif; font-size: 12px; height: 40px; line-height: 40px; margin: 0; min-width: 57px; padding: 0 10px; }
	.fs-quote-terminal-send:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 2px; }
	.fs-quote-terminal-window.has-mobile-composer .fs-quote-terminal-output { padding-bottom: calc(var(--fs-quote-mobile-composer-height, 58px) + 142px); }
	.fs-quote-terminal-window.has-mobile-composer .fs-quote-terminal-avatar { bottom: calc(var(--fs-quote-mobile-composer-height, 58px) + 10px); height: 94px; right: 10px; width: 86px; }
	.fs-quote-terminal-window.has-mobile-composer .fs-quote-terminal-avatar-canvas { height: 86px; width: 74px; }
	.fs-quote-terminal-window.has-mobile-composer .fs-quote-terminal-live-summary { bottom: calc(var(--fs-quote-mobile-composer-height, 58px) + 10px); left: 10px; max-height: 74px; right: 101px; }
	.fs-quote-terminal-window.is-mobile-keyboard-open .fs-quote-terminal-output { padding-bottom: calc(var(--fs-quote-mobile-composer-height, 58px) + 22px); }
	.fs-quote-terminal-window.is-mobile-keyboard-open .fs-quote-terminal-avatar,
	.fs-quote-terminal-window.is-mobile-keyboard-open .fs-quote-terminal-live-summary { display: none; }
	.fs-quote-terminal-resize { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .001ms !important;
	}
	.fs-treboro-home:not([hidden]) .fs-treboro-shell { animation: none; }
	.yo2-spotlight-grid { --yo2-spot-radius: 0px; -webkit-mask-image: none; mask-image: none; opacity: .42; }
	.yo2-trail-card { animation: none; opacity: .94; }
}
