.customer-generation-gallery {box-sizing:border-box;width:min(68rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);padding:1.25rem;margin:auto;overflow:hidden;border:1px solid #ffffff30;border-radius:.6rem;color:#fff;background:rgba(0,0,0,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:14px/1.5 Inter,Arial,sans-serif}
.customer-generation-gallery::backdrop {background:rgba(0,0,0,.8);backdrop-filter:blur(4px)}
.customer-generation-gallery[open] {display:flex;flex-direction:column;height:min(86dvh,56rem)}
.customer-generation-gallery > header,.customer-generation-gallery > footer,.generation-status {flex-shrink:0}
.customer-generation-gallery header {display:flex;align-items:center;justify-content:space-between;gap:1rem}
.customer-generation-gallery h2 {margin:0;font-size:1rem}
.customer-generation-gallery button,.generation-open,#account-generations-view-all {border:1px solid #ffffff40;border-radius:.25rem;padding:.35rem .7rem;color:#eee;background:#000c;font:inherit;cursor:pointer;text-decoration:none}
.customer-generation-gallery header button {min-width:44px;min-height:44px;font-size:1.3rem}
.customer-generation-gallery button:disabled {opacity:.4;cursor:default}
.customer-generation-gallery :focus-visible,#account-generations :focus-visible {outline:2px solid #9acbff;outline-offset:3px}
:is(#recent-gallery-close,#customer-generation-gallery > header > button),
:is(#recent-gallery-close,#customer-generation-gallery > header > button):is(:hover,:active) {border:0;background:transparent;box-shadow:none;color:#bbb;transform:none}
:is(#recent-gallery-close,#customer-generation-gallery > header > button):focus-visible {outline:1px dotted #888;outline-offset:2px}
.customer-generation-gallery footer {display:flex;justify-content:space-between;gap:1rem;margin-top:1rem}
.generation-grid {display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));grid-auto-rows:max-content;gap:1rem;min-height:0;overflow-x:hidden;overflow-y:scroll;scrollbar-gutter:stable;overscroll-behavior:contain;align-content:start;align-items:start;flex:1;padding:.2rem}
.generation-card {min-width:0;display:flex;flex-direction:column;gap:0}
.generation-card .recent-work-preview {position:relative;aspect-ratio:4/3;flex:none;display:grid;place-items:center;border:1px solid #ffffff20;background:#070b10;overflow:hidden}
.generation-card .recent-work-preview-media {width:100%;height:100%;display:grid;place-items:center;color:#fff;text-align:center}
.generation-card img {width:100%;height:100%;object-fit:contain}
.generation-date,.generation-status,.generation-empty {color:#fff;font-size:.75rem}
.generation-grid .generation-card .generation-date {display:block;margin:0;padding:.2rem .8rem;line-height:1.4;color:#fff;background:rgb(0 0 0 / 80%);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.generation-card > .generation-open {margin-top:.5rem}
.generation-open {text-align:center}
#account-generations-view-all {justify-self:center;padding:.2rem .65rem;font-size:.7rem;white-space:nowrap}
#account-generations-view-all:hover {border-color:#ffffff80}
.landing-page #account-generations,.landing-page #recent-work {grid-column:1/-1;grid-row:2;width:calc(50% - .5rem);box-sizing:border-box;margin:0;align-self:stretch;display:flex;flex-direction:column}
.landing-page #account-generations .recent-work-body,.landing-page #recent-work .recent-work-body {flex:1;grid-template-rows:1fr auto}
.landing-page #account-generations .recent-work-carousel,.landing-page #recent-work .recent-work-carousel {align-self:start}
.landing-page #account-generations {justify-self:start}
.landing-page #recent-work {justify-self:end}
#account-generations .generation-empty {padding:.35rem 0;margin:0;line-height:1.5}
#account-generations .recent-work-preview-media {font-size:.65rem}
.generator-history-button {align-self:flex-end;padding:.3rem .55rem;border:1px solid #465566;border-radius:.3rem;color:#c7d9e8;background:#111a24;font:inherit;font-size:.7rem;cursor:pointer}
@container landing-content (max-width:48rem) {.landing-page #account-generations,.landing-page #recent-work {grid-column:1;grid-row:auto;width:auto;justify-self:stretch}}
@media(max-width:400px) {.generation-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.customer-generation-gallery {padding:.75rem}.generation-date {font-size:.65rem}.generation-open {font-size:.75rem}}