.aas {
	--aas-navy: #1f2a44;
	--aas-red: #c8102e;
	--aas-ink: #1d2330;
	--aas-line: #d5dbe3;
	--aas-soft: #f4f6f9;
	--aas-muted: #5c6573;
	box-sizing: border-box;
	max-width: 1120px;
	margin: 0 auto;
	color: var(--aas-ink);
	font: 16px/1.45 "Segoe UI", Helvetica, Arial, sans-serif;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
	gap: 20px;
	align-items: start;
}
.aas *, .aas *::before, .aas *::after { box-sizing: border-box; }
.aas-chat, .aas-stage, .aas-lock {
	background: #fff;
	border: 1px solid var(--aas-line);
	border-radius: 16px;
	padding: 18px;
}
.aas-head-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.aas-fresh {
	flex: none; background: #fff; color: var(--aas-navy); border: 2px solid var(--aas-navy);
	border-radius: 999px; padding: 8px 14px; min-height: 44px; font: inherit; font-weight: 700; cursor: pointer;
}
.aas-fresh[hidden] { display: none; }
.aas-fresh:disabled { opacity: .5; cursor: default; }
.aas-kicker { margin: 0; letter-spacing: .14em; text-transform: uppercase; font-size: 12px; color: var(--aas-red); font-weight: 700; }
.aas h2 { margin: .15em 0 .3em; color: var(--aas-navy); font-size: 28px; line-height: 1.15; }
.aas h3 { margin: 0 0 .6em; color: var(--aas-navy); }
.aas-lede, .aas-empty { color: var(--aas-muted); margin: 0 0 12px; }
.aas-compose { display: flex; flex-direction: column; }
.aas-compose.has-design .aas-method,
.aas-compose.has-design .aas-logo,
.aas-compose.has-design .aas-thumbs,
.aas-compose.has-design .aas-tools { order: 10; }
.aas-compose.has-design .aas-log { order: 20; }
.aas-compose.has-design .aas-ask { order: 30; }
.aas-log { max-height: 480px; overflow: auto; display: flex; flex-direction: column; gap: 10px; padding: 4px 0 12px; }
.aas-log:empty { display: none; }
.aas-msg { max-width: 92%; padding: 8px 12px; border: 0; border-radius: 14px; white-space: pre-wrap; cursor: default; box-shadow: none; }
.aas-msg.user { margin-left: auto; background: var(--aas-navy); color: #fff; border-bottom-right-radius: 4px; }
.aas-msg.user::before { content: "You"; display: block; margin-bottom: 2px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .72); }
.aas-msg.assistant {
	align-self: flex-start; max-width: 100%; margin: 0; padding: 2px 0 2px 10px;
	background: transparent; color: var(--aas-muted); font-size: 15px; border-radius: 0;
	border-left: 3px solid var(--aas-red);
}
.aas-msg.assistant::before { content: "Art Studio"; display: block; margin-bottom: 2px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--aas-red); }
.aas-ask-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 4px; }
.aas-prompt { display: block; margin: 2px 0 16px; }
.aas-prompt .aas-label {
	display: block; margin-bottom: 6px;
	font-size: 18px; font-weight: 800; color: var(--aas-navy);
}
.aas-prompt textarea {
	display: block; width: 100%; min-height: 8.6rem; margin: 0;
	padding: 14px 14px; border: 2px solid var(--aas-navy); border-radius: 12px;
	background: #fff; color: var(--aas-ink); font: inherit; font-size: 16px; line-height: 1.45;
	resize: vertical;
}
.aas-prompt textarea:focus {
	outline: none; border-color: var(--aas-red);
	box-shadow: 0 0 0 3px rgba(200, 16, 46, .35);
}
.aas-method {
	border: 2px solid var(--aas-navy); border-radius: 12px;
	margin: 0 0 16px; padding: 12px 12px 8px; background: var(--aas-soft);
}
.aas-method legend {
	padding: 0 6px; font-size: 18px; font-weight: 800; color: var(--aas-navy);
}
.aas-method-why { margin: 4px 0 10px; font-weight: 700; color: var(--aas-ink); }
.aas-choice {
	display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px;
	align-items: start; margin: 0 0 6px; padding: 8px 10px; border-radius: 10px; cursor: pointer;
}
.aas-choice input { margin-top: 4px; width: auto; }
.aas-choice strong { display: block; color: var(--aas-navy); }
.aas-choice small { display: block; color: var(--aas-muted); font-size: 14px; line-height: 1.35; }
.aas-choice:has(input:checked) { background: #fff; outline: 2px solid var(--aas-navy); }
.aas-choice:has(input:focus-visible) { box-shadow: 0 0 0 3px rgba(200, 16, 46, .35); }
.aas-logo {
	display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(180px, .9fr);
	gap: 12px; align-items: center; margin: 0 0 8px;
}
.aas-optional { margin: 0; font-weight: 700; color: var(--aas-ink); }
.aas-drop {
	display: flex; align-items: center; gap: 12px;
	border: 2px dashed #aeb6c2; border-radius: 12px; padding: 16px;
	background: var(--aas-soft); cursor: pointer; margin: 0;
}
.aas-drop.over, .aas-drop:hover { border-color: var(--aas-navy); }
.aas-drop strong { display: block; color: var(--aas-navy); }
.aas-drop small { color: var(--aas-muted); }
.aas-thumbs { display: flex; gap: 8px; flex-wrap: wrap; }
.aas-thumbs figure { margin: 0; width: 72px; }
.aas-thumbs img, .aas-thumbs .aas-filetag {
	width: 72px; height: 72px; object-fit: cover; border-radius: 8px; border: 1px solid var(--aas-line); background: #fff;
	display: grid; place-items: center; font-size: 12px; font-weight: 700; color: var(--aas-navy);
}
.aas-thumbs figcaption { font-size: 11px; color: var(--aas-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aas textarea, .aas input[type="text"], .aas input[type="email"], .aas input[type="password"], .aas select {
	width: 100%; margin-top: 4px; padding: 10px 12px; border: 1px solid #b9c0cb; border-radius: 10px; font: inherit; background: #fff; color: inherit;
}
.aas .aas-prompt textarea {
	margin: 0; padding: 14px; border: 2px solid var(--aas-navy); border-radius: 12px;
	background: #fff; color: var(--aas-ink); font-size: 16px; line-height: 1.45; min-height: 8.6rem;
}
.aas .aas-prompt textarea:focus {
	outline: none; border-color: var(--aas-red);
	box-shadow: 0 0 0 3px rgba(200, 16, 46, .35);
}
.aas-tools { display: flex; gap: 10px; align-items: end; flex-wrap: wrap; margin-top: 8px; }
.aas-tools label { font-size: 13px; color: var(--aas-muted); font-weight: 600; }
.aas-tools select, .aas-tools input[type="color"] { margin-top: 4px; }
.aas-tools label.aas-find { flex: 1 1 160px; min-width: 140px; }
.aas-tools label.aas-product { flex: 1 1 240px; min-width: 200px; }
.aas-colorline { display: flex; align-items: end; gap: 8px; flex: 0 1 220px; }
.aas-tools label.aas-color { min-width: 140px; }
.aas-swatch { width: 28px; height: 28px; border-radius: 50%; border: 1px solid #b9c0cb; background: #1a1a1a; margin-bottom: 6px; flex: none; }
.aas-send, .aas-quote {
	background: var(--aas-red); color: #fff; border: 0; border-radius: 999px;
	padding: 12px 18px; min-height: 44px; font-weight: 700; cursor: pointer;
}
.aas-send:disabled, .aas-quote:disabled { opacity: .5; cursor: default; }
.aas-quote { width: 100%; margin-top: 12px; background: var(--aas-navy); }
.aas-note { min-height: 1.2em; color: var(--aas-navy); font-weight: 600; }
.aas-note.bad { color: #9d1024; }
.aas-onproduct {
	display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 10px;
	align-items: center; margin: 0 0 12px; padding: 10px 12px;
	border: 2px solid var(--aas-navy); border-radius: 12px; background: var(--aas-soft); cursor: pointer;
}
.aas-onproduct input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.aas-switch {
	width: 46px; height: 28px; border-radius: 999px; background: #c5ccd6; position: relative; flex: none;
}
.aas-switch::after {
	content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
	border-radius: 50%; background: #fff; transition: transform .15s ease;
}
.aas-onproduct input:checked + .aas-switch { background: var(--aas-red); }
.aas-onproduct input:checked + .aas-switch::after { transform: translateX(18px); }
.aas-onproduct input:focus-visible + .aas-switch { box-shadow: 0 0 0 3px rgba(200, 16, 46, .35); }
.aas-onproduct-copy strong { display: block; color: var(--aas-navy); font-size: 16px; }
.aas-onproduct-copy small { display: block; color: var(--aas-muted); font-size: 13px; line-height: 1.35; }
.aas-frame {
	background: #e2e7ee; border-radius: 12px; min-height: 320px;
	display: grid; place-items: center; overflow: hidden; position: relative;
}
.aas-frame img {
	width: 100%; height: auto; display: block; user-select: none; -webkit-user-drag: none;
}
.aas-frame.has-preview { cursor: zoom-in; }
.aas-frame.has-preview img { cursor: zoom-in; }
.aas-empty[hidden] { display: none; }
.aas-working, .aas-fail {
	position: absolute; inset: 0; z-index: 3;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 10px; padding: 18px 16px; background: #e8eef5; text-align: center;
}
.aas-working[hidden], .aas-fail[hidden] { display: none; }
.aas-spinner {
	width: 40px; height: 40px; border-radius: 50%; flex: none;
	border: 3px solid #c5ceda; border-top-color: var(--aas-red);
	animation: aas-spin .8s linear infinite;
}
@keyframes aas-spin { to { transform: rotate(360deg); } }
.aas-status { margin: 0; font-size: 18px; font-weight: 800; color: var(--aas-navy); }
.aas-progress { width: min(280px, 100%); height: 8px; border-radius: 999px; background: #d5dbe3; overflow: hidden; }
.aas-progress span {
	display: block; height: 100%; width: 0; border-radius: inherit;
	background: var(--aas-red); transition: width .6s ease;
}
.aas-wait { margin: 0; color: var(--aas-muted); font-size: 13px; }
.aas-placeholders { width: min(320px, 100%); display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.aas-card {
	display: block; height: 48px; border-radius: 10px;
	background: linear-gradient(90deg, #d3dbe6 25%, #f4f7fb 50%, #d3dbe6 75%);
	background-size: 200% 100%; animation: aas-shimmer 1.4s ease-in-out infinite;
}
.aas-card-lg { grid-column: 1 / -1; height: 92px; }
@keyframes aas-shimmer {
	0% { background-position: 100% 0; }
	100% { background-position: -100% 0; }
}
.aas-fail p { margin: 0; max-width: 280px; font-weight: 700; color: var(--aas-navy); }
.aas-retry {
	background: var(--aas-red); color: #fff; border: 0; border-radius: 999px;
	padding: 12px 18px; min-height: 44px; font-weight: 700; cursor: pointer;
}
.aas-frame.is-working, .aas-frame.is-working.has-preview, .aas-frame.is-working.has-preview img { cursor: progress; }
@media (prefers-reduced-motion: reduce) {
	.aas-spinner, .aas-card { animation: none; }
	.aas-progress span { transition: none; }
}
.aas-made { margin: 10px 0 0; }
.aas-made[hidden] { display: none; }
.aas-made-title { margin: 0; font-weight: 800; color: var(--aas-navy); }
.aas-made-why { margin: 2px 0 8px; color: var(--aas-muted); }
.aas-made-switch { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
.aas-made-switch span { font-weight: 700; color: var(--aas-navy); }
.aas-switch-method {
	min-height: 44px; padding: 8px 14px; border: 2px solid var(--aas-navy); border-radius: 999px;
	background: #fff; color: var(--aas-navy); font: inherit; font-weight: 700; cursor: pointer;
}
.aas-switch-method:disabled { opacity: .5; cursor: default; }
.aas-enlarge-hint { margin: 8px 0 0; color: var(--aas-muted); font-size: 13px; text-align: center; }
.aas-enlarge-hint[hidden] { display: none; }
html.aas-lightbox-open, html.aas-lightbox-open body { overflow: hidden; }
.aas-lightbox {
	position: fixed; inset: 0; z-index: 40; background: rgba(12, 18, 28, .88);
	display: flex; align-items: center; justify-content: center;
	padding: 64px 16px 24px; -webkit-touch-callout: none;
}
.aas-lightbox[hidden] { display: none; }
.aas-lightbox-stage { position: relative; max-width: min(1100px, 100%); max-height: calc(100dvh - 88px); }
.aas-lightbox-stage img {
	display: block; max-width: 100%; max-height: calc(100dvh - 88px);
	width: auto; height: auto; object-fit: contain;
	user-select: none; -webkit-user-drag: none; -webkit-touch-callout: none;
}
.aas-lightbox-shield { position: absolute; inset: 0; }
.aas-lightbox-close {
	position: absolute; top: 12px; right: 12px; width: 44px; height: 44px;
	border: 0; border-radius: 50%; background: #fff; color: var(--aas-navy);
	font-size: 28px; line-height: 1; cursor: pointer;
}
.aas-film { display: flex; gap: 8px; overflow: auto; margin-top: 10px; }
.aas-film button {
	border: 2px solid transparent; padding: 0; border-radius: 8px; background: none; cursor: pointer;
	display: flex; flex-direction: column; align-items: center;
}
.aas-film button.on { border-color: var(--aas-red); }
.aas-film img { width: 72px; height: 80px; object-fit: cover; border-radius: 6px; display: block; }
.aas-film-method { display: block; max-width: 88px; margin-top: 4px; font-size: 11px; font-weight: 800; line-height: 1.2; color: var(--aas-navy); text-align: center; }
.aas-qform, .aas-gate form, .aas-pass { display: grid; gap: 8px; margin-top: 12px; }
.aas-check { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.aas-gate {
	position: fixed; inset: 0; background: rgba(31, 42, 68, .55);
	display: grid; place-items: center; z-index: 20; padding: 16px;
}
.aas-gate[hidden], .aas-qform[hidden] { display: none; }
.aas-gate form { background: #fff; border-radius: 16px; padding: 20px; max-width: 420px; width: 100%; }
.aas-locked { display: block; }
.aas-lock { max-width: 460px; margin: 0 auto; }
.aas-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (prefers-color-scheme: dark) {
	.aas {
		--aas-ink: #e7edf6;
		--aas-line: #3c4a63;
		--aas-soft: #1a2333;
		--aas-muted: #b4c0d2;
		color: var(--aas-ink);
		color-scheme: dark;
	}
	.aas-chat, .aas-stage, .aas-lock, .aas-gate form, .aas-fresh { background: #101722; }
	.aas-fresh { color: #f5f7fb; border-color: #d5def0; }
	.aas h2, .aas h3, .aas-prompt .aas-label, .aas-method legend, .aas-drop strong, .aas-optional, .aas-method-why, .aas-note { color: #f5f7fb; }
	.aas .aas-prompt textarea, .aas textarea, .aas input, .aas select {
		background: #0c121b; color: #f5f7fb; border-color: #9eb0cb;
	}
	.aas .aas-prompt textarea { border-width: 2px; }
	.aas .aas-prompt textarea:focus { border-color: #ff6b7d; box-shadow: 0 0 0 3px rgba(255, 107, 125, .5); }
	.aas-method { background: #182232; border-color: #9eb0cb; }
	.aas-choice strong { color: #f5f7fb; }
	.aas-choice:has(input:checked) { background: #243044; outline-color: #d5def0; }
	.aas-drop { border-color: #8ea0bd; }
	.aas-msg.assistant { background: transparent; color: #b4c0d2; }
	.aas-made-title, .aas-made-switch span, .aas-film-method { color: #f5f7fb; }
	.aas-switch-method { background: transparent; color: #f5f7fb; border-color: #d5def0; }
	.aas-onproduct { background: #182232; border-color: #9eb0cb; }
	.aas-onproduct-copy strong { color: #f5f7fb; }
	.aas-switch { background: #3c4a63; }
	.aas-frame, .aas-working, .aas-fail { background: #1c2636; }
	.aas-status, .aas-fail p { color: #f5f7fb; }
	.aas-spinner { border-color: #3c4a63; border-top-color: #ff6b7d; }
	.aas-progress { background: #3c4a63; }
	.aas-card {
		background: linear-gradient(90deg, #2a364a 25%, #3c4a63 50%, #2a364a 75%);
		background-size: 200% 100%;
	}
	.aas-thumbs img, .aas-thumbs .aas-filetag { background: #0c121b; }
}
@media (max-width: 860px) {
	.aas { grid-template-columns: 1fr; }
	.aas-logo { grid-template-columns: 1fr; }
	.aas-prompt textarea { min-height: 9rem; }
}
