.app-shell { margin: 0; padding: 0; }
.minimal-topbar { height: 84px; padding: 0 30px; border-bottom: 1px solid #242329; }
.minimal-topbar .brand { margin: 0; display: block; }
.minimal-topbar .brand > span { display: inline; font-size: 37px; }
.brand-home { align-self: stretch; min-width: 138px; padding: 0 12px 0 0; display: flex !important; align-items: center; white-space: nowrap; cursor: pointer; }
.google-login { background: #24212c; color: var(--text); border: 1px solid #3b3843; min-height: 39px; padding: 10px 16px; font-size: 12px; font-weight: 600; }
.google-login:hover:not(:disabled) { border-color: var(--purple); background: #31283e; }
.google-login img { flex: 0 0 18px; }
main { padding: 22px 24px 28px; margin: 0; max-width: none; }
.portfolio-studio { grid-template-columns: 292px minmax(0,1fr); gap: 24px; }
.visual-configurator { top: 18px; max-height: calc(100dvh - 36px); }
.visual-options { max-height: calc(100dvh - 320px); min-height: 250px; padding-top: 4px; }
.creation-modes { display: flex; gap: 4px; margin: 12px; padding: 4px; background: #121115; border-radius: 8px; }
.creation-modes button { width: 50%; border-radius: 5px; min-height: 34px; font-size: 12px; font-weight: 600; color: #a99bb7; }
.creation-modes button.active { color: #e6d4ff; background: #332a40; }
.creation-modes button:hover { color: #ecddfc; }
.portfolio-masonry, .motion-masonry { columns: 3; column-gap: 16px; }
.portfolio-card { margin-bottom: 16px; }
.generated-pick { display: block; width: 100%; padding: 0; }
.generated-pick img { display: block; width: 100%; height: auto; }
.actor-image { object-fit: cover; object-position: right center; border-radius: 8px; }
.portfolio-open { top: auto; bottom: 12px; }
.portfolio-card > .portrait { aspect-ratio: 3/4; }
.portfolio-card:nth-of-type(3n+2) > .portrait { aspect-ratio: 1/1.12; }
.portfolio-card:nth-of-type(4n+3) > .portrait { aspect-ratio: 3/4.4; }
.portfolio-card:nth-of-type(4n+3) > .portrait::before { width: 110%; margin-left: -5%; }
.combination-caption .round-button { margin-left: 0; }
.combination-caption .round-button:first-of-type { margin-left: auto; }
.minimal-footer { padding: 22px 30px; border-top: 1px solid #252229; margin: 0; max-width: none; font-size: 11px; align-items: center; gap: 20px; }
.minimal-footer > span { color: #97899f; }
.minimal-footer nav { display: flex; align-items: center; gap: 22px; }
.minimal-footer a, .minimal-footer button { font-size: 11px; color: #b7a4c7; padding: 5px 0; }
.minimal-footer a:hover, .minimal-footer button:hover { color: #ddc4fb; }
.minimal-footer a[aria-current=page] { color: #ddc4fb; }
.video-config-body { padding: 6px 14px 16px; }
.video-configurator .upload-zone { min-height: 182px; padding: 22px 10px; }
.video-configurator .upload-zone strong { font-size: 12px; }
.video-configurator .upload-zone > span:not(.upload-icon) { font-size: 11px; }
.video-configurator .upload-zone small { font-size: 11px; }
.video-config-label { color: #b9a6c5; font-size: 11px; margin-top: 24px; }
.video-configurator .cast-row { margin: 11px 0 21px; }
.video-configurator .cast-row > span { font-size: 11px; color: #cfbedb; flex: 1; }
.video-configurator .selected-video { max-width: none; }
.video-configurator .selected-video video { max-height: 165px; }
.empty-motion-note { color: #a792b7; font-size: 11px; margin-top: 18px; }
.motion-card { display: block; width: 100%; padding: 0; margin-bottom: 16px; border-radius: 13px; overflow: hidden; break-inside: avoid; position: relative; background: #211b26; }
.motion-card video { display: block; width: 100%; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.motion-card:nth-child(4) video { aspect-ratio: 3/2; }
.motion-card:nth-child(3n+2) video { aspect-ratio: 1/1.12; }
.motion-card.selected { outline: 2px solid var(--purple); outline-offset: 3px; }
#toast { left: 50%; }
.review-layout { grid-template-columns: 300px minmax(0,1fr); }
.review-options { grid-column: 1; grid-row: 1; }
.review-canvas { grid-column: 2; grid-row: 1; }
@media (min-width: 1800px) { .portfolio-masonry, .motion-masonry { columns: 4; } }
@media (max-width: 1050px) { .portfolio-masonry, .motion-masonry { columns: 2; } }