/* GenerateSelfie: warm, understated studio palette. */
:root{--green:#48543c;--line:#dcd6c9;--muted:#6d695e;--ink:#302c26;--paper:#f5f2e9;--surface:#fcfaf4;color:var(--ink);background:var(--paper);font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif}
body{background:var(--paper);color:var(--ink)}
header{background:#f8f6ef;border-color:var(--line);min-height:80px}
.brand{font-family:"Baskerville","Palatino Linotype",Georgia,serif;font-size:24px;letter-spacing:-.035em;color:#302c26}
header nav{font-size:13px;letter-spacing:0}header a{color:#655f53}header a[aria-current=page]{color:#384430;text-decoration-color:#758367;text-decoration-thickness:2px}
h1,h2,.feature-editor h3,.flow-mode-bar strong,.next-steps h3,.upscale-tool h3{font-family:Baskerville,"Palatino Linotype",Georgia,serif;color:#302c26;letter-spacing:-.025em}
h1{font-size:clamp(40px,4.7vw,64px);line-height:1.06;max-width:720px}h2{font-size:32px}.intro{color:var(--muted)}
.eyebrow,.step-label{color:#687358;letter-spacing:.14em}
a{color:#48543c}button,input,select,textarea{accent-color:#48543c}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #8b997b;outline-offset:3px}
.flow-block,.panel,details,aside,.editor,.setting{background:var(--surface);border-color:var(--line);border-radius:6px;box-shadow:none}
.flow-block{padding:34px;margin:32px 0}.flow-block>p,.flow-helper{color:var(--muted)}
.flow-mode-bar{background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;padding:22px 0}
.how-it-works{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.how-it-works div{border:0;border-radius:0;background:transparent;padding:18px 12px}.how-it-works span{font-family:Baskerville,Georgia,serif;color:#778267;font-style:normal}.how-it-works strong{color:#403d33}
.feature-unit{border-color:var(--line);border-radius:5px;background:#fcfaf4}.feature-unit .feature-choice{background:transparent}.feature-unit .feature-choice:has(input:checked){background:#e8ecdf}.feature-unit:has(input:checked){border-color:#89977a}.feature-choice strong,.feature-editor h3,.accessory-removals legend,.summary-label,.preserve-option strong,.saved-flow-look strong,.saved-flow-look>span{color:#343b2e}
.feature-editor label,.tool-fields label,.starting-ideas p{color:#514f43}.feature-editor select,.feature-editor textarea,.tool-fields input,.tool-fields textarea,.choice-name-input,.rename-flow-look input,.field input,.field select,.field textarea,.search,.setting textarea{background:#fffefb;color:#302c26;border:1px solid #cbc6b8;border-radius:4px}
.btn,.secondary,.collection{background:transparent;border:1px solid #b7b6a8;border-radius:4px;color:#414b37;font-weight:600}.btn:hover,.secondary:hover,.collection:hover{background:#e9ecdf;border-color:#89977a}.primary,.copy,.collection.active{background:#48543c;border-color:#48543c;color:#fffefa}.primary:hover,.copy:hover,.collection.active:hover{background:#343f2c;border-color:#343f2c;color:white}
summary{color:#343b2e}details[open] summary{background:#f0f1e9;border-color:var(--line)}
.starting-ideas,.flow-empty,.pose-support,.pose-suggestion,.upscale-tool,.next-steps,.advanced-notice{background:#eff0e7;border-color:#d5dacb;border-radius:5px;color:#444c3b}.upscale-tool p,.upscale-tool li,.pose-suggestion p,.next-steps ol{color:#5b6052}.upscale-tool h4,.flow-toast,#prompt-details summary{color:#414d37}.preserve-option{background:#f8f8f1;border-radius:5px}.summary-chip,.badge,.filter.active,.item.active{background:#e9eddf;border-color:#cbd2bd;color:#3c4a32}.summary-chip:hover,.item:hover{background:#dde5d2}.bottom{background:#f2f2e9;border-color:var(--line)}.prompt,.text{color:#49463e}.toast{background:#48543c}.upscale-tool details{background:#fcfaf4}.how-it-works small{color:var(--muted)}
@media(max-width:650px){header{min-height:0}.brand{font-size:21px}.flow-block{padding:22px}.how-it-works{gap:0}.how-it-works div{padding:12px 0}.how-it-works div+div{border-top:1px solid var(--line)}h1{font-size:42px}}

/* A softer, more welcoming Photo Flow. */
:root{--green:#76535d;--ink:#42343a;--muted:#71646a;--paper:#f8f2ed;--surface:#fffdf9;--line:#e8dcd8;font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif}
body{background:#f8f2ed;color:var(--ink)}
header{background:#fffaf6;border-bottom:1px solid #eddfda}
.brand{font-family:Georgia,"Times New Roman",serif;color:#523d45;font-size:23px;letter-spacing:-.04em}
header a{color:#6d5b61}header a[aria-current=page]{color:#654852;text-decoration-color:#bd8d91}
h1,h2,.feature-editor h3,.flow-mode-bar strong,.next-steps h3,.upscale-tool h3{font-family:Georgia,"Times New Roman",serif;color:#4e3942;letter-spacing:-.035em}
h1{font-size:clamp(39px,4.5vw,59px);line-height:1.12}h2{font-size:30px}
.eyebrow,.step-label{color:#98777d;letter-spacing:.14em}
a{color:#76535d}button,input,select,textarea{accent-color:#76535d}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#ac858c}
.flow-block,.panel,details,aside,.editor,.setting{background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:0 8px 28px #6a404608}
.flow-block{padding:34px;margin:28px 0}
.flow-mode-bar{background:#f2e7e4;border:1px solid #eadbd8;border-radius:20px;padding:22px 25px}
.how-it-works{gap:10px;border:0}.how-it-works div{border:1px solid #eedfdb;border-radius:16px;background:#fffaf6;padding:16px}.how-it-works span{font-family:Georgia,serif;color:#b58b8c;font-style:italic}.how-it-works strong{color:#57474d}
.feature-unit{border:1px solid #eadfda;border-radius:16px;background:#fffdf9}.feature-unit .feature-choice{background:#fffaf7}.feature-unit .feature-choice:has(input:checked){background:#f4e5e5}.feature-unit:has(input:checked){border-color:#c79da0}.feature-choice strong,.feature-editor h3,.accessory-removals legend,.summary-label,.preserve-option strong,.saved-flow-look strong,.saved-flow-look>span{color:#593f49}
.feature-editor label,.tool-fields label,.starting-ideas p{color:#6b555d}.feature-editor select,.feature-editor textarea,.tool-fields input,.tool-fields textarea,.choice-name-input,.rename-flow-look input,.field input,.field select,.field textarea,.search,.setting textarea{background:#fffefd;color:#493b40;border:1px solid #dfd1cf;border-radius:12px}
.btn,.secondary,.collection{background:#fffaf7;border:1px solid #dfcdcb;border-radius:12px;color:#694c56;font-weight:600}.btn:hover,.secondary:hover,.collection:hover{background:#f5e8e5;border-color:#cda9a9}.primary,.copy,.collection.active{background:#76535d;border-color:#76535d;color:#fffaf8}.primary:hover,.copy:hover,.collection.active:hover{background:#5e404b;border-color:#5e404b;color:white}
summary{color:#604851}details[open] summary{background:#faf1ed;border-color:#eaded9}
.starting-ideas,.flow-empty,.pose-support,.pose-suggestion,.upscale-tool,.next-steps,.advanced-notice{background:#f7ece8;border-color:#ecdbd6;border-radius:16px;color:#624d55}.upscale-tool p,.upscale-tool li,.pose-suggestion p,.next-steps ol{color:#705f64}.upscale-tool h4,.flow-toast,#prompt-details summary{color:#6c4e58}.preserve-option{background:#fffaf7;border-radius:14px}.summary-chip,.badge,.filter.active,.item.active{background:#f4e5e5;border-color:#e4c9cb;color:#694b55}.summary-chip:hover,.item:hover{background:#edd9d9}.bottom{background:#fbf3ef;border-color:var(--line)}.prompt,.text{color:#58494f}.toast{background:#76535d}.upscale-tool details{background:#fffaf7}.how-it-works small{color:var(--muted)}
@media(max-width:650px){.flow-block{padding:22px}.how-it-works{gap:8px}.how-it-works div{padding:12px 15px}.how-it-works div+div{border:1px solid #eedfdb}.flow-mode-bar{padding:20px}h1{font-size:40px}}

/* Keep native dropdown behavior while giving every selector a consistent appearance. */
select{font:inherit;color:#493b40;background-color:#fffefd;border:1px solid #d9c8c7;border-radius:12px;min-height:48px;padding:12px 42px 12px 15px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2376535d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;cursor:pointer}
select:hover{border-color:#b99094}select:focus-visible{outline:3px solid #ac858c;outline-offset:3px}select:disabled{opacity:.55;cursor:default}
.feature-editor select,.tool-fields select{padding:12px 42px 12px 15px;border:1px solid #d9c8c7;border-radius:12px;background-color:#fffefd;color:#493b40}
@media(max-width:650px){select,.feature-editor select,.tool-fields select{font-size:16px}}

.theme-toggle{white-space:nowrap;min-height:42px}
:root[data-theme=dark]{color-scheme:dark;--green:#d3acb6;--ink:#f3e8e9;--muted:#d0bec2;--paper:#211b20;--surface:#30262c;--line:#59464d}
:root[data-theme=dark] body{background:var(--paper);color:var(--ink)}
:root[data-theme=dark] header{background:#292127;border-color:var(--line)}
:root[data-theme=dark] .brand,:root[data-theme=dark] h1,:root[data-theme=dark] h2,:root[data-theme=dark] .feature-editor h3,:root[data-theme=dark] .flow-mode-bar strong,:root[data-theme=dark] .next-steps h3,:root[data-theme=dark] .upscale-tool h3{color:#f3e5e8}
:root[data-theme=dark] a,:root[data-theme=dark] header a,:root[data-theme=dark] .eyebrow,:root[data-theme=dark] .step-label{color:#e3bdc7}
:root[data-theme=dark] .flow-block,:root[data-theme=dark] details,:root[data-theme=dark] .feature-unit,:root[data-theme=dark] .upscale-tool details{background:var(--surface);border-color:var(--line)}
:root[data-theme=dark] .flow-mode-bar,:root[data-theme=dark] .starting-ideas,:root[data-theme=dark] .flow-empty,:root[data-theme=dark] .pose-support,:root[data-theme=dark] .pose-suggestion,:root[data-theme=dark] .upscale-tool,:root[data-theme=dark] .next-steps,:root[data-theme=dark] .advanced-notice,:root[data-theme=dark] .preserve-option{background:#3b3036;border-color:#634f57;color:#f1e4e6}
:root[data-theme=dark] .how-it-works div,:root[data-theme=dark] .feature-unit .feature-choice{background:#352b31;border-color:var(--line)}
:root[data-theme=dark] .feature-unit .feature-choice:has(input:checked){background:#59414b}
:root[data-theme=dark] .how-it-works strong,:root[data-theme=dark] .feature-choice strong,:root[data-theme=dark] .feature-editor label,:root[data-theme=dark] .tool-fields label,:root[data-theme=dark] .starting-ideas p,:root[data-theme=dark] .summary-label,:root[data-theme=dark] .preserve-option strong,:root[data-theme=dark] .saved-flow-look strong,:root[data-theme=dark] .saved-flow-look>span,:root[data-theme=dark] .upscale-tool h4,:root[data-theme=dark] summary,:root[data-theme=dark] #prompt-details summary{color:#f0e2e5}
:root[data-theme=dark] .upscale-tool p,:root[data-theme=dark] .upscale-tool li,:root[data-theme=dark] .pose-suggestion p,:root[data-theme=dark] .next-steps ol{color:var(--muted)}
:root[data-theme=dark] .feature-editor select,:root[data-theme=dark] .feature-editor textarea,:root[data-theme=dark] .tool-fields input,:root[data-theme=dark] .tool-fields textarea,:root[data-theme=dark] .tool-fields select,:root[data-theme=dark] .choice-name-input,:root[data-theme=dark] .rename-flow-look input,:root[data-theme=dark] select,:root[data-theme=dark] textarea{background-color:#241e22;color:#f3e8e9;border-color:#78616a}
:root[data-theme=dark] select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23e3bdc7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
:root[data-theme=dark] .btn,:root[data-theme=dark] .summary-chip{background:#46363e;border-color:#80616d;color:#f5e9eb}
:root[data-theme=dark] .btn:hover,:root[data-theme=dark] .summary-chip:hover{background:#604955}
:root[data-theme=dark] .primary,:root[data-theme=dark] .copy{background:#e2bac4;border-color:#e2bac4;color:#302128}
:root[data-theme=dark] .primary:hover,:root[data-theme=dark] .copy:hover{background:#f1d0d6;color:#302128}
:root[data-theme=dark] details[open] summary{background:#3b3036;border-color:var(--line)}
:root[data-theme=dark] .flow-prompt,:root[data-theme=dark] .flow-toast,:root[data-theme=dark] .remove-feature{color:#f0dbe0}
:root[data-theme=dark] .flow-conflict{background:#493a2d;border-color:#967556;color:#f8e6cf}
:root[data-theme=dark] dialog{background:#30262c;color:#f3e8e9;border-color:var(--line)}

/* Specificity must match the field styles that reset background shorthand. */
select,.feature-editor select,.tool-fields select,:root[data-theme=dark] select,:root[data-theme=dark] .feature-editor select,:root[data-theme=dark] .tool-fields select{background-repeat:no-repeat;background-position:right 15px center;background-size:16px 16px}
header nav{align-items:center}
.theme-toggle{position:relative;display:inline-flex;align-items:center;justify-content:space-around;flex-shrink:0;width:80px;height:44px;min-height:44px;padding:4px;border:1px solid #d9c5c5;border-radius:999px;background:#eee1dd;color:#82676c;cursor:pointer;isolation:isolate}
.theme-thumb{position:absolute;left:4px;top:4px;width:34px;height:34px;border-radius:50%;background:#fffdf8;box-shadow:0 2px 5px #50303c1c;z-index:-1}
.theme-toggle svg{flex-shrink:0;pointer-events:none}.theme-sun{color:#6f4b38}
:root[data-theme=dark] .theme-toggle{background:#382c34;border-color:#715660;color:#b397a3}
:root[data-theme=dark] .theme-thumb{transform:translateX(36px);background:#e3bdc9;box-shadow:0 2px 6px #0004}
:root[data-theme=dark] .theme-moon{color:#3a2633}:root[data-theme=dark] .theme-sun{color:#b397a3}
.theme-toggle:hover{border-color:#ad7d89}
@media(prefers-reduced-motion:no-preference){.theme-thumb{transition:transform .2s ease,background-color .2s ease}}

/* Feature controls open separately so the choices keep their position. */
.feature-unit{position:relative}.feature-unit .feature-choice{padding-right:54px}.feature-card-edit{position:absolute;right:14px;top:17px;border:0;background:transparent;color:#76535d;font-size:12px;text-decoration:underline;text-underline-offset:3px;padding:7px;cursor:pointer}.feature-card-edit[hidden]{display:none}
.feature-panel{position:fixed;inset:0 0 0 auto;margin:0;width:min(480px,100%);max-width:none;height:100%;max-height:none;border:0;border-left:1px solid var(--line);border-radius:20px 0 0 20px;background:var(--surface);color:var(--ink);padding:0;overflow-y:auto;box-shadow:-12px 0 45px #30212826}
.feature-panel::backdrop{background:#281b2680}.feature-panel-top{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:18px 24px;background:var(--surface);border-bottom:1px solid var(--line)}.feature-panel-top span{font-size:11px;letter-spacing:.14em;font-weight:600;color:var(--muted)}.feature-panel .feature-editor{padding:24px;border:0}.feature-panel .feature-editor[hidden]{display:none}.feature-panel .editor-title{margin-bottom:20px}.feature-panel .editor-title h3{margin:0}.feature-panel .feature-editor label{margin-top:14px}.feature-panel .feature-editor select,.feature-panel .feature-editor textarea{width:100%}
:root[data-theme=dark] .feature-panel{background:var(--surface);color:var(--ink);border-color:var(--line)}:root[data-theme=dark] .feature-card-edit{color:#ebc9d1}
@media(max-width:650px){.feature-panel{inset:auto 0 0;margin:0;width:100%;height:auto;max-height:88dvh;border-left:0;border-top:1px solid var(--line);border-radius:22px 22px 0 0}.feature-panel .feature-editor{padding:20px}.feature-panel-top{padding:15px 20px}}
.feature-unit .feature-choice small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.feature-panel .feature-editor select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2376535d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;background-size:16px 16px}
:root[data-theme=dark] .feature-panel .feature-editor select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23e3bdc7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}