/* Page layouts for the standalone routes. Builds on site.css. */

/* ------------------------------------------------------------- sky hero (the home hero's background, reused) */
.ae-sky { position: relative; isolation: isolate; padding: 170px var(--ae-gutter) 140px; text-align: center; overflow: hidden;
  background: linear-gradient(180deg, var(--ae-blue) 0%, var(--ae-blue) 18%, rgba(143, 163, 174, 0) 62%), url(/assets/img/cast/studio-sky.webp) center 70% / 160% auto no-repeat, var(--ae-white); }
.ae-sky::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 64px; background: url(/assets/img/scallop-edge.svg) bottom / 100% 100% no-repeat; z-index: -1; }
.ae-sky__cloud { position: absolute; z-index: -1; width: 74px; opacity: .95; animation: ae-drift 9s ease-in-out infinite alternate; }
.ae-sky__cloud--a { top: 120px; left: 9%; } .ae-sky__cloud--b { top: 170px; right: 11%; width: 64px; animation-duration: 11s; } .ae-sky__cloud--c { top: 330px; left: 22%; width: 46px; animation-duration: 13s; }
@keyframes ae-drift { to { transform: translateX(40px); } }
.ae-sky__title { position: relative; display: inline-block; }
.ae-sky__title .ae-sticker { position: absolute; width: clamp(56px, 7vw, 100px); }
.ae-sky__lead { max-width: 640px; margin: 26px auto 0; }
.ae-sky__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 34px; }
@media (max-width: 809px) { .ae-sky { padding: 130px var(--ae-gutter) 96px; background-size: auto, 300% auto, auto; } .ae-sky__cloud--c { display: none; } }

.ae-section { padding: 120px 0; }
.ae-section--tight { padding: 72px 0; }
@media (max-width: 809px) { .ae-section { padding: 80px 0; } }
.ae-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 56px; }
@media (max-width: 809px) { .ae-section__head { flex-direction: column; align-items: center; text-align: center; } }

/* ------------------------------------------------------------- explore */
.ae-toolbar { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: -40px; padding: 14px; border-radius: 22px; background: var(--ae-white); box-shadow: var(--ae-shadow); }
.ae-toolbar__tabs { display: flex; flex-wrap: wrap; gap: 10px; }
.ae-toolbar__tabs .ae-tab { height: 50px; padding: 0 16px; }
.ae-search { position: relative; flex: 1 1 260px; max-width: 380px; }
.ae-search .ae-icon { position: absolute; left: 18px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--ae-grey); pointer-events: none; }
.ae-search input { width: 100%; height: 50px; padding: 0 18px 0 48px; border: 2px solid var(--ae-navy); border-radius: 40px; background: var(--ae-white); font: 500 17px/1 var(--ae-sans); letter-spacing: -.02em; outline: none; transition: box-shadow .3s var(--ae-spring), transform .3s var(--ae-spring); }
.ae-search input::placeholder { color: var(--ae-muted); }
.ae-search input:focus { box-shadow: 0 5px 0 var(--ae-navy); transform: translateY(-2px); }
.ae-explore__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 40px 0 36px; font: 500 16px/1.3 var(--ae-sans); color: var(--ae-grey); }
@media (max-width: 809px) { .ae-toolbar { margin-top: -28px; } .ae-toolbar__tabs { overflow-x: auto; flex-wrap: nowrap; margin: -6px; padding: 6px; scrollbar-width: none; } .ae-toolbar__tabs::-webkit-scrollbar { display: none; } .ae-search { max-width: none; } }

/* ------------------------------------------------------------- big CTA (the "Ready to be famous?" block) */
.ae-cta { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; min-height: 560px; margin: 0 auto; padding: 80px 24px; border-radius: 32px; overflow: hidden; text-align: center; color: var(--ae-white); }
.ae-cta__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.ae-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(42, 29, 22, .38); }
.ae-cta__line { font: 700 clamp(56px, 7vw, 100px)/.8 var(--ae-title); text-transform: uppercase; margin: 0; color: var(--ae-white); }
.ae-cta__bubble { position: relative; display: inline-block; padding: 18px 38px 10px; border-radius: 999px; background: var(--ae-white); color: var(--ae-ink); font: 700 clamp(64px, 9vw, 130px)/.8 var(--ae-title); text-transform: uppercase; transform: rotate(-3deg); }
.ae-cta__bubble .ae-sticker { position: absolute; width: clamp(60px, 7vw, 96px); }
.ae-cta__bubble .ae-sticker--l { left: -46px; top: -10px; --r: -14deg; }
.ae-cta__bubble .ae-sticker--r { right: -50px; top: -26px; --r: 10deg; }
@media (max-width: 809px) { .ae-cta { min-height: 460px; border-radius: 24px; } .ae-cta__bubble { padding: 14px 24px 8px; } .ae-cta__bubble .ae-sticker--l { left: -24px; } .ae-cta__bubble .ae-sticker--r { right: -24px; } }

/* ------------------------------------------------------------- launch */
.ae-launch { padding: 150px 0 120px; background: linear-gradient(180deg, var(--ae-blue) 0, var(--ae-blue) 260px, var(--ae-white) 620px); }
.ae-launch__head { text-align: center; margin-bottom: 48px; }
.ae-launch__head .ae-h1 { color: var(--ae-ink); }
.ae-launch__head .ae-lead { margin-top: 18px; }
.ae-launch__grid { display: grid; grid-template-columns: minmax(280px, 400px) minmax(0, 1fr); gap: 40px; align-items: start; }
.ae-launch__aside { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 14px; }
.ae-launch__hint { margin: 0; text-align: center; font: 400 26px/1.1 var(--ae-hand); color: var(--ae-grey); }
@media (max-width: 999px) { .ae-launch__grid { grid-template-columns: minmax(0, 1fr); } .ae-launch__aside { position: relative; top: 0; order: -1; max-width: 420px; width: 100%; margin: 0 auto; } }
@media (max-width: 809px) { .ae-launch { padding-top: 120px; } }

.ae-stepper { display: flex; gap: 8px; margin-bottom: 22px; overflow-x: auto; padding: 8px 4px 10px; scrollbar-width: none; }
.ae-stepper::-webkit-scrollbar { display: none; }
.ae-stepper .ae-tab { flex-direction: column; gap: 4px; height: 66px; min-width: 92px; padding: 0 12px; background: var(--ae-white); }
.ae-stepper .ae-tab small { font: 500 11px/1 var(--ae-mono); opacity: .7; }
.ae-stepper .ae-tab.is-done::before { content: "✓"; position: absolute; top: -8px; right: -8px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ae-navy); color: var(--ae-white); font: 700 12px/1 var(--ae-sans); }
.ae-stepper .ae-tab.is-active { background: var(--c); }

.ae-panel { padding: 32px; border-radius: 28px; background: var(--ae-white); border: 2px solid var(--ae-navy); box-shadow: 0 10px 0 var(--ae-navy); }
@media (max-width: 599px) { .ae-panel { padding: 22px 18px; border-radius: 22px; } }
.ae-step__head { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.ae-step__num { display: grid; place-items: center; flex: none; width: 64px; height: 64px; border-radius: 16px; background: var(--c, var(--ae-blue)); color: var(--ae-navy); font: 700 40px/1 var(--ae-title); transform: rotate(-6deg); }
.ae-step__kicker { margin: 0; font: 500 13px/1 var(--ae-mono); text-transform: uppercase; color: var(--ae-grey); }
.ae-step__title { margin: 6px 0 0; font: 700 clamp(44px, 5vw, 64px)/.85 var(--ae-title); text-transform: uppercase; }
.ae-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.ae-field { display: flex; flex-direction: column; gap: 8px; }
.ae-field--full { grid-column: 1 / -1; }
@media (max-width: 599px) { .ae-fields { grid-template-columns: 1fr; } }
.ae-field__label { display: flex; justify-content: space-between; gap: 8px; font: 700 16px/1 var(--ae-sans); letter-spacing: -.03em; }
.ae-field__label small { font: 500 12px/1 var(--ae-mono); color: var(--ae-muted); text-transform: uppercase; }
.ae-input { width: 100%; height: 54px; padding: 0 16px; border: 2px solid var(--ae-line); border-radius: 16px; background: var(--ae-soft); font: 500 18px/1 var(--ae-sans); letter-spacing: -.03em; outline: none; transition: border-color .2s, background .2s, box-shadow .3s var(--ae-spring); }
.ae-input:focus { border-color: var(--ae-navy); background: var(--ae-white); box-shadow: 0 4px 0 var(--ae-navy); }
.ae-input.is-invalid { border-color: var(--ae-orange); }
textarea.ae-input { height: 116px; padding: 14px 16px; line-height: 1.4; resize: vertical; }
.ae-affix { position: relative; }
.ae-affix > span { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); font: 700 18px/1 var(--ae-sans); color: var(--ae-grey); pointer-events: none; }
.ae-affix .ae-input { padding-left: 36px; }
.ae-field__help { margin: 0; font: 400 14px/1.4 var(--ae-sans); color: var(--ae-grey); }
.ae-field__error { margin: 0; font: 500 14px/1.3 var(--ae-sans); color: #a3471c; }

.ae-options { display: flex; flex-wrap: wrap; gap: 8px; }
.ae-option { position: relative; }
.ae-option input { position: absolute; opacity: 0; pointer-events: none; }
.ae-option span { display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 16px; border: 2px solid var(--ae-line); border-radius: 14px; background: var(--ae-white); font: 700 16px/1 var(--ae-sans); letter-spacing: -.03em; transition: transform .35s var(--ae-spring), background .2s, border-color .2s; cursor: pointer; }
.ae-option span:hover { transform: translateY(-3px) rotate(-2deg); border-color: var(--ae-navy); }
.ae-option input:checked + span { background: var(--ae-navy); border-color: var(--ae-navy); color: var(--ae-white); }
.ae-option input:focus-visible + span { outline: 3px solid var(--ae-blue); outline-offset: 2px; }

.ae-aesthetics { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px; }
.ae-aesthetic { position: relative; }
.ae-aesthetic input { position: absolute; opacity: 0; pointer-events: none; }
.ae-aesthetic span { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: 132px; padding: 12px; border-radius: 18px; background: var(--c); color: var(--c-ink); font: 500 24px/1 var(--ae-sans); letter-spacing: -.06em; border: 2px solid transparent; overflow: hidden; transition: transform .4s var(--ae-spring), border-color .2s, box-shadow .3s; cursor: pointer; }
.ae-aesthetic img { position: absolute; top: 10px; right: 8px; width: 64px; transform: rotate(10deg); transition: transform .5s var(--ae-spring); }
.ae-aesthetic span:hover { transform: translateY(-4px) rotate(-2deg); }
.ae-aesthetic span:hover img { transform: rotate(-6deg) scale(1.1); }
.ae-aesthetic input:checked + span { border-color: var(--ae-navy); box-shadow: 0 6px 0 var(--ae-navy); transform: translateY(-4px); }
.ae-aesthetic input:checked + span::after { content: "✓"; position: absolute; left: 10px; top: 10px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ae-navy); color: var(--ae-white); font: 700 14px/1 var(--ae-sans); }
.ae-aesthetic input:focus-visible + span { outline: 3px solid var(--ae-navy); outline-offset: 3px; }

.ae-group { margin-top: 26px; }
.ae-group:first-child { margin-top: 0; }
.ae-group__label { display: flex; justify-content: space-between; margin: 0 0 12px; font: 700 18px/1 var(--ae-sans); letter-spacing: -.03em; }
.ae-group__label small { font: 500 12px/1 var(--ae-mono); color: var(--ae-muted); text-transform: uppercase; }

.ae-stepnav { display: flex; justify-content: space-between; gap: 12px; margin-top: 30px; padding-top: 24px; border-top: 2px dashed var(--ae-line); }
.ae-stepnav .ae-btn:only-child { margin-left: auto; }

/* generation studio */
.ae-studio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; }
@media (max-width: 699px) { .ae-studio { grid-template-columns: 1fr; } }
.ae-studio__frame { position: relative; aspect-ratio: 4 / 5; border-radius: 26px; overflow: hidden; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .18) 0 14px, transparent 14px 28px), var(--c, var(--ae-blue)); border: 2px solid var(--ae-navy); }
.ae-studio__frame > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; animation: ae-develop 1.1s var(--ae-ease) both; }
.ae-studio__state { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 20px; text-align: center; }
.ae-studio__state p { margin: 0; font: 400 32px/1 var(--ae-hand); color: var(--ae-navy); }
.ae-studio__state .ae-sticker { width: 120px; }
.ae-studio__progress { width: min(240px, 80%); height: 12px; border-radius: 12px; background: rgba(255, 255, 255, .6); border: 2px solid var(--ae-navy); overflow: hidden; }
.ae-studio__progress i { display: block; height: 100%; width: 0; background: var(--ae-navy); transition: width .45s var(--ae-ease); }
.ae-studio__scan { position: absolute; left: 0; right: 0; height: 30%; background: linear-gradient(transparent, rgba(255, 255, 255, .7), transparent); animation: ae-scan 1.4s linear infinite; }
@keyframes ae-scan { from { top: -30%; } to { top: 100%; } }
.ae-studio__flag { position: absolute; left: 12px; bottom: 12px; padding: 6px 10px; border-radius: 10px; background: rgba(42, 29, 22, .8); color: var(--ae-white); font: 500 12px/1 var(--ae-mono); text-transform: uppercase; }
.ae-studio__side { display: flex; flex-direction: column; gap: 14px; }
.ae-studio__spec { margin: 0; padding: 14px 16px; border-radius: 16px; background: var(--ae-soft); font: 500 14px/1.45 var(--ae-mono); color: var(--ae-slate); }
.ae-note { display: flex; gap: 12px; align-items: flex-start; margin: 0; padding: 14px 16px; border-radius: 16px; background: color-mix(in srgb, var(--ae-yellow) 55%, white); color: var(--ae-ink-yellow); font: 500 15px/1.45 var(--ae-sans); letter-spacing: -.01em; }
.ae-note strong { font-weight: 700; }

/* summary + success */
.ae-summary { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 26px; align-items: start; }
@media (max-width: 699px) { .ae-summary { grid-template-columns: 1fr; } }
.ae-summary__list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; }
.ae-summary__list > div { padding: 14px; border-radius: 16px; background: var(--ae-soft); }
.ae-summary__list > .ae-summary__wide { grid-column: 1 / -1; }
.ae-summary__list dt { font: 500 12px/1 var(--ae-mono); text-transform: uppercase; color: var(--ae-grey); }
.ae-summary__list dd { margin: 8px 0 0; font: 700 20px/1.2 var(--ae-sans); letter-spacing: -.04em; word-break: break-word; }
.ae-summary__list dd.is-soft { font-weight: 500; font-size: 16px; color: var(--ae-slate); }
.ae-success { position: relative; text-align: center; padding: 30px 10px 10px; }
.ae-success .ae-h2 { margin: 10px 0 18px; }
.ae-success__card { width: min(300px, 100%); margin: 28px auto; transform: rotate(-3deg); }
.ae-success__stickers .ae-sticker { position: absolute; width: 90px; animation: ae-pop .6s var(--ae-spring) both; }
.ae-success__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 10px; }

/* ------------------------------------------------------------- creator profile */
.ae-profile { padding: 150px 0 40px; background: linear-gradient(180deg, var(--c) 0, var(--c) 340px, var(--ae-white) 340px); }
@media (max-width: 809px) { .ae-profile { padding-top: 116px; background: linear-gradient(180deg, var(--c) 0, var(--c) 260px, var(--ae-white) 260px); } }
.ae-profile__top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; align-items: start; }
@media (max-width: 999px) { .ae-profile__top { grid-template-columns: minmax(0, 1fr); gap: 36px; } }
.ae-profile__visual { position: relative; }
.ae-profile__visual .ae-card__media { aspect-ratio: 4 / 5; border-radius: 40px 40px 0 0; transform: rotate(-2deg); box-shadow: none; }
.ae-profile__visual .ae-sticker { position: absolute; width: clamp(80px, 9vw, 120px); z-index: 2; }
.ae-profile__visual .s1 { top: -24px; right: -18px; --r: 10deg; }
.ae-profile__visual .s2 { bottom: 60px; left: -30px; --r: -12deg; }
@media (max-width: 999px) { .ae-profile__visual { max-width: 460px; width: 100%; margin: 0 auto; } }
.ae-profile__info { padding-top: 18px; }
@media (max-width: 999px) { .ae-profile__info { padding-top: 0; text-align: center; } }
.ae-profile__handle { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font: 500 20px/1 var(--ae-sans); color: var(--ae-grey); letter-spacing: -.03em; }
@media (max-width: 999px) { .ae-profile__handle { justify-content: center; } }
.ae-profile__ticker { padding: 8px 14px; border-radius: 12px; background: var(--ae-navy); color: var(--ae-white); font: 700 22px/1 var(--ae-sans); letter-spacing: -.04em; }
.ae-profile__name { margin: 18px 0 0; font: 700 clamp(84px, 10.5vw, 160px)/.8 var(--ae-title); text-transform: uppercase; color: var(--ae-ink); overflow-wrap: anywhere; }
.ae-profile__bio { margin: 22px 0 0; max-width: 560px; font: 500 clamp(20px, 2vw, 26px)/1.25 var(--ae-sans); letter-spacing: -.04em; color: var(--ae-slate); }
@media (max-width: 999px) { .ae-profile__bio { margin-inline: auto; } }
.ae-social { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.ae-social > div { padding: 18px 12px 14px; border-radius: 18px; text-align: center; background: var(--k); }
.ae-social dt { font: 700 13px/1 var(--ae-sans); text-transform: uppercase; color: var(--ae-ink); opacity: .75; }
.ae-social dd { margin: 0 0 6px; font: 700 clamp(44px, 4.6vw, 64px)/.85 var(--ae-title); color: var(--ae-ink); }
.ae-social { display: flex; flex-direction: row; }
.ae-social > div { flex: 1; display: flex; flex-direction: column-reverse; }
.ae-profile__token { margin-top: 16px; }
.ae-profile__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
@media (max-width: 999px) { .ae-profile__actions { justify-content: center; } }
.ae-profile__actions .ae-btn { flex: 1 1 160px; }

.ae-content-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 599px) { .ae-content-grid { gap: 4px; } }
.ae-post { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 18px; background: var(--ae-soft); }
@media (max-width: 599px) { .ae-post { border-radius: 8px; } }
.ae-post img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ae-ease); }
.ae-post:hover img { transform: scale(1.06); }
.ae-post__type { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .9); color: var(--ae-navy); }
.ae-post__type .ae-icon { width: 16px; height: 16px; }
.ae-post__meta { position: absolute; inset: auto 0 0; display: flex; gap: 12px; padding: 30px 12px 10px; background: linear-gradient(transparent, rgba(42, 29, 22, .65)); color: var(--ae-white); font: 700 14px/1 var(--ae-sans); opacity: 0; transition: opacity .25s; }
.ae-post__meta span { display: inline-flex; align-items: center; gap: 4px; }
.ae-post__meta .ae-icon { width: 14px; height: 14px; }
.ae-post:hover .ae-post__meta, .ae-post:focus-within .ae-post__meta { opacity: 1; }
@media (hover: none) { .ae-post__meta { opacity: 1; } }
.ae-post__sticker { position: absolute; width: 38%; left: 8%; bottom: 10%; transform: rotate(-10deg); }
.ae-post__tag { position: absolute; left: 10px; top: 10px; padding: 6px 10px; border-radius: 10px; background: var(--ae-white); font: 500 11px/1 var(--ae-mono); text-transform: uppercase; color: var(--ae-navy); }

.ae-about { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 999px) { .ae-about { grid-template-columns: 1fr 1fr; } }
@media (max-width: 499px) { .ae-about { grid-template-columns: 1fr; } }
.ae-about > div { padding: 22px; border-radius: 22px; background: var(--k); min-height: 180px; display: flex; flex-direction: column; justify-content: space-between; gap: 16px; }
.ae-about dt { font: 700 14px/1 var(--ae-sans); text-transform: uppercase; color: var(--ae-ink); opacity: .7; }
.ae-about dd { margin: 0; font: 500 26px/1.1 var(--ae-sans); letter-spacing: -.05em; color: var(--ae-ink); }
.ae-about dd .ae-chips { margin-top: 2px; }
.ae-about dd .ae-chip { background: rgba(255, 255, 255, .6); font-size: 15px; }
.ae-about .ae-mono { font: 500 18px/1.2 var(--ae-mono); letter-spacing: 0; overflow-wrap: anywhere; }
.ae-about small { display: block; margin-top: 8px; font: 400 13px/1.3 var(--ae-sans); color: var(--ae-slate); }
.ae-more { padding-top: 40px; }

.ae-404 { min-height: 70vh; display: grid; place-items: center; text-align: center; padding: 160px 16px 80px; }

/* ------------------------------------------------------------- how it works (service stack cards) */
.ae-stack { display: flex; flex-direction: column; gap: 0; }
.ae-scard { --k: var(--ae-blue); position: sticky; top: 90px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; min-height: 520px; margin-bottom: 70px; padding: 44px; border-radius: 32px; background: var(--k); color: var(--ae-ink); transform: rotate(var(--rot, -2deg)); box-shadow: 0 -10px 30px rgba(42, 29, 22, .06); }
.ae-scard:nth-child(2n) { --rot: 1.5deg; }
.ae-scard:last-child { margin-bottom: 0; }
.ae-scard__num { font: 700 28px/1 var(--ae-title); opacity: .65; }
.ae-scard__title { margin: 10px 0 0; font: 500 clamp(42px, 5vw, 72px)/1 var(--ae-sans); letter-spacing: -.06em; }
.ae-scard__text { max-width: 520px; margin: 18px 0 0; font: 400 19px/1.45 var(--ae-sans); letter-spacing: -.02em; color: var(--ae-ink); opacity: .85; }
.ae-scard__list { margin: 30px 0 0; padding: 0; list-style: none; max-width: 460px; border-top: 1.5px solid rgba(42, 29, 22, .35); }
.ae-scard__list li { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1.5px solid rgba(42, 29, 22, .35); font: 500 18px/1.25 var(--ae-sans); letter-spacing: -.03em; }
.ae-scard__list b { font: 500 13px/1.8 var(--ae-mono); opacity: .6; }
.ae-scard__media { position: relative; align-self: end; justify-self: end; width: min(340px, 100%); aspect-ratio: 4 / 5; border: 6px solid var(--ae-white); border-radius: 18px; overflow: hidden; transform: rotate(3deg); box-shadow: 0 16px 30px rgba(42, 29, 22, .18); }
.ae-scard__media img { width: 100%; height: 100%; object-fit: cover; }
.ae-scard__sticker { position: absolute; width: 110px; top: -30px; right: -20px; z-index: 2; }
.ae-scard__note { margin-top: 18px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 255, 255, .55); font: 500 14px/1.45 var(--ae-sans); max-width: 520px; }
@media (max-width: 899px) { .ae-scard { position: relative; top: 0; grid-template-columns: 1fr; padding: 28px 22px; min-height: 0; margin-bottom: 36px; transform: rotate(calc(var(--rot, -2deg) / 2)); } .ae-scard__media { justify-self: center; width: min(300px, 100%); } }

.ae-loop { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ae-loop > div { padding: 28px 22px; border-radius: 22px; background: var(--k); text-align: center; transition: transform .45s var(--ae-spring); }
.ae-loop > div:hover { transform: rotate(-3deg) translateY(-6px); }
.ae-loop .ae-sticker { width: 110px; margin: 6px auto 16px; }
.ae-loop h3 { margin: 0; font: 500 34px/1 var(--ae-sans); letter-spacing: -.06em; }
.ae-loop p { margin: 10px 0 0; font: 400 16px/1.45 var(--ae-sans); color: var(--ae-ink); opacity: .8; }
.ae-loop span { display: block; font: 500 14px/1 var(--ae-mono); opacity: .6; }
@media (max-width: 809px) { .ae-loop { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------- docs */
.ae-docs { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 56px; padding: 150px 0 120px; align-items: start; }
@media (max-width: 899px) { .ae-docs { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 120px; } }
.ae-docs__side { position: sticky; top: 24px; padding: 16px; border-radius: 22px; background: var(--ae-soft); }
.ae-docs__side p { margin: 4px 8px 12px; font: 500 12px/1 var(--ae-mono); text-transform: uppercase; color: var(--ae-grey); }
.ae-docs__side ol { margin: 0; padding: 0; list-style: none; counter-reset: d; }
.ae-docs__side a { display: flex; align-items: center; gap: 10px; padding: 10px 10px; border-radius: 12px; text-decoration: none; font: 500 16px/1.2 var(--ae-sans); letter-spacing: -.03em; color: var(--ae-slate); transition: background .2s, transform .35s var(--ae-spring); }
.ae-docs__side a::before { counter-increment: d; content: counter(d, decimal-leading-zero); font: 500 12px/1 var(--ae-mono); color: var(--ae-muted); }
.ae-docs__side a:hover { background: var(--ae-white); transform: translateX(4px); }
.ae-docs__side a.is-current { background: var(--ae-navy); color: var(--ae-white); }
.ae-docs__side a.is-current::before { color: rgba(255, 255, 255, .6); }
@media (max-width: 899px) {
  .ae-docs__side { position: sticky; top: 8px; z-index: 5; padding: 8px; box-shadow: var(--ae-shadow); background: var(--ae-white); }
  .ae-docs__side p { display: none; }
  .ae-docs__side ol { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .ae-docs__side ol::-webkit-scrollbar { display: none; }
  .ae-docs__side a { white-space: nowrap; background: var(--ae-soft); }
  .ae-docs__side a::before { display: none; }
}
.ae-docs__main { min-width: 0; }
.ae-docs__intro { margin-bottom: 40px; }
.ae-docs__intro .ae-h2 { position: relative; display: inline-block; }
.ae-docs__intro .ae-sticker { position: absolute; width: 90px; right: -96px; top: -30px; --r: 12deg; }
.ae-doc { padding: 40px 0; border-top: 2px dashed var(--ae-line); scroll-margin-top: 90px; }
.ae-doc:first-of-type { border-top: 0; padding-top: 10px; }
.ae-doc h2 { margin: 0 0 18px; font: 700 clamp(48px, 5vw, 72px)/.85 var(--ae-title); text-transform: uppercase; }
.ae-doc h3 { margin: 28px 0 10px; font: 700 22px/1.2 var(--ae-sans); letter-spacing: -.04em; }
.ae-doc p, .ae-doc li { font: 400 18px/1.6 var(--ae-sans); letter-spacing: -.015em; color: var(--ae-slate); max-width: 720px; }
.ae-doc p { margin: 0 0 14px; }
.ae-doc ul, .ae-doc ol { margin: 0 0 14px; padding-left: 22px; }
.ae-doc li { margin: 4px 0; }
.ae-doc strong { color: var(--ae-ink); }
.ae-doc a { color: var(--ae-ink); text-decoration-color: var(--ae-blue); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.ae-doc .ae-note { max-width: 720px; margin: 18px 0; }
.ae-doc details { max-width: 720px; margin: 10px 0; padding: 16px 18px; border-radius: 16px; background: var(--ae-soft); }
.ae-doc summary { font: 700 18px/1.3 var(--ae-sans); letter-spacing: -.03em; color: var(--ae-ink); list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.ae-doc summary::-webkit-details-marker { display: none; }
.ae-doc summary::after { content: "+"; font: 500 24px/1 var(--ae-sans); transition: transform .3s var(--ae-spring); }
.ae-doc details[open] summary::after { transform: rotate(45deg); }
.ae-doc details p { margin: 10px 0 0; }
.ae-doc-steps { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; max-width: 760px; margin: 18px 0; padding: 0; list-style: none; counter-reset: s; }
.ae-doc-steps li { margin: 0; padding: 16px; border-radius: 16px; background: var(--k, var(--ae-soft)); font-size: 16px; line-height: 1.4; color: var(--ae-ink); }
.ae-doc-steps li::before { counter-increment: s; content: "0" counter(s); display: block; margin-bottom: 8px; font: 700 28px/1 var(--ae-title); }
.ae-docs__pager { display: flex; justify-content: space-between; gap: 12px; margin-top: 30px; }

/* ------------------------------------------------------------- generation (live backend) */
.ae-studio__progress.is-indeterminate i { width: 40%; animation: ae-indet 1.3s var(--ae-ease) infinite; }
@keyframes ae-indet { from { transform: translateX(-100%); } to { transform: translateX(260%); } }
.ae-studio__side [data-studio-actions] { display: flex; flex-direction: column; gap: 10px; }
.ae-upload { cursor: pointer; align-self: flex-start; }
.ae-unlock { display: flex; flex-direction: column; gap: 10px; }
.ae-studio__state .ae-field__error { max-width: 260px; }

/* content studio (creator profile) */
.ae-studio-modal .ae-modal__card { width: min(620px, 100%); text-align: left; max-height: calc(100dvh - 32px); overflow-y: auto; }
.ae-studio-modal .ae-modal__title { font-size: 56px; text-align: center; }
.ae-cs { display: flex; flex-direction: column; gap: 18px; margin-top: 18px; }
.ae-cs__row { display: flex; flex-direction: column; gap: 10px; }
.ae-cs__row > span { font: 700 16px/1 var(--ae-sans); letter-spacing: -.03em; }
.ae-cs__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.ae-cs__status { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: var(--ae-soft); font: 500 15px/1.4 var(--ae-sans); }
.ae-cs__status .ae-studio__progress { flex: 1; }
.ae-identity { display: inline-flex; align-items: center; gap: 6px; }
.ae-post video { width: 100%; height: 100%; object-fit: cover; display: block; }
.ae-post--pending { display: grid; place-items: center; background: repeating-linear-gradient(45deg, rgba(255,255,255,.4) 0 12px, transparent 12px 24px), var(--ae-soft); }
.ae-post--pending p { margin: 0; padding: 12px; text-align: center; font: 400 26px/1 var(--ae-hand); color: var(--ae-grey); }
