:root{font-family:Arial,sans-serif;color-scheme:dark;background:#10141e;color:#edf2fb}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px}.panel{width:min(100%,520px);background:#1b2332;border:1px solid #364357;border-radius:18px;padding:30px;box-shadow:0 18px 70px #0005}h1{color:#7dbdb5;margin:0}header p{color:#b5c2d4;margin:8px 0 26px}label{display:block;margin:15px 0 6px}input{width:100%;padding:12px;border:1px solid #506077;background:#101722;color:white;border-radius:8px;font:inherit}button,.btn{display:inline-block;background:#0e518d;border:0;border-radius:8px;padding:12px 17px;color:white;text-decoration:none;font:inherit;cursor:pointer;margin-top:18px}button:hover,.btn:hover{background:#146aa9}a{color:#8fd6d0}.notice{padding:12px;border-radius:8px;background:#25374a;margin:12px 0}.error{background:#572a35}.nav{display:flex;gap:14px;flex-wrap:wrap;margin-top:25px}.small{color:#b5c2d4;font-size:14px}

/* Paket 1.2: Charakterstudio */
body:has(.studio){display:block;padding:24px}.panel:has(.studio){width:min(1200px,100%);margin:24px auto}.studio{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:24px}.studio section{min-width:0}.studio select,.studio textarea{width:100%;padding:12px;background:#101722;color:#fff;border:1px solid #506077;border-radius:8px;font:inherit}.studio textarea{min-height:90px;resize:vertical}.studio .choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:9px;margin:10px 0 20px}.studio .choice{display:block;cursor:pointer;position:relative;margin:0}.studio .choice input{position:absolute;opacity:0;width:1px;height:1px}.studio .choice-face{border:2px solid #42536a;border-radius:12px;padding:12px 7px;text-align:center;background:#151e2c;min-height:102px;display:flex;flex-direction:column;justify-content:center;gap:8px}.studio .choice input:checked+.choice-face{border-color:#7dbdb5;background:#254447}.studio .choice input:focus-visible+.choice-face{outline:2px solid #fff;outline-offset:2px}.studio .choice-figure{display:block;margin:auto;width:54px;height:56px;border-radius:28px 28px 15px 15px;background:linear-gradient(130deg,#7dbdb5,#0e518d);position:relative}.studio .choice-figure:before{content:'';position:absolute;top:-9px;left:16px;width:22px;height:22px;border-radius:50%;background:#dfb49e}.studio .choice-figure.slim{transform:scaleX(.75)}.studio .choice-figure.athletic{transform:scaleX(.92)}.studio .choice-figure.curvy{transform:scaleX(1.13)}.studio .choice-figure.strong{transform:scaleX(1.28)}.studio .preview{position:sticky;top:20px;border:1px solid #42536a;border-radius:15px;padding:20px;background:#151e2c}.studio .preview-figure{height:280px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at center,#30485a,#111b28);border-radius:12px}.studio .preview-figure .avatar{width:110px;height:175px;border-radius:60px 60px 35px 35px;background:linear-gradient(130deg,#7dbdb5,#0e518d);position:relative}.studio .preview-figure .avatar:before{content:'';position:absolute;top:-48px;left:27px;width:56px;height:65px;border-radius:50%;background:#d9ad94}.studio .preview-figure .avatar[data-body=slim]{transform:scaleX(.75)}.studio .preview-figure .avatar[data-body=curvy]{transform:scaleX(1.18)}.studio .preview-figure .avatar[data-body=strong]{transform:scaleX(1.3)}.studio .muted{color:#b5c2d4;font-size:14px}.studio .actions{display:flex;gap:10px;flex-wrap:wrap}.studio .actions a{align-self:end}.studio .saved{margin-top:20px;border-top:1px solid #364357;padding-top:14px}.studio .saved a{margin-left:8px}.studio h2{margin-top:28px}@media(max-width:760px){.studio{grid-template-columns:1fr}.studio .preview{position:static}}

/* Paket 1.3 – Stilwahl, ohne externe Bilder oder KI-Abhängigkeit */
.studio .render-grid{grid-template-columns:repeat(auto-fit,minmax(135px,1fr))}
.studio .render-grid .choice-face{min-height:140px;line-height:1.3;font-size:14px}
.studio .render-swatch{display:block;width:72px;height:78px;margin:0 auto 8px;border-radius:12px;position:relative;background:linear-gradient(145deg,#3e6879,#1a2e48)}
.studio .render-swatch:before{content:'';position:absolute;width:35px;height:43px;left:19px;top:10px;border-radius:50% 50% 43% 43%;background:#dbac93;box-shadow:0 32px 0 7px #467f98}
.studio .render-three_d{background:linear-gradient(140deg,#42576f,#6a7d9b);box-shadow:inset -9px -9px 15px #172435}
.studio .render-cinema{background:linear-gradient(150deg,#4c372e,#152333)}
.studio .render-virtual{background:linear-gradient(145deg,#25475a,#164e62);border:1px solid #69b4bd}
.studio .render-anime{background:linear-gradient(145deg,#55446b,#29415f)}
.studio .render-anime:before{border-radius:42% 42% 54% 54%;box-shadow:0 32px 0 7px #685f9e, -7px -5px 0 1px #31263f, 7px -5px 0 1px #31263f}
.studio [data-anime-options][hidden]{display:none}
.studio .preview-figure[data-render="anime"]{background:radial-gradient(circle,#524e72,#141e33)}
.studio .preview-figure[data-render="cinema"]{background:radial-gradient(circle,#544438,#111923)}
.studio .preview-figure[data-render="three_d"]{background:radial-gradient(circle,#536276,#121b2d)}
.studio .preview-figure[data-render="virtual"]{background:radial-gradient(circle,#286575,#102536)}

/* Paket 1.5.2a – visuelle Merkmalsauswahl */
.studio .visual-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
.studio .visual-choice .choice-face{padding:6px;min-height:155px;justify-content:start;gap:7px}
.studio .visual-choice img{display:block;width:100%;height:125px;object-fit:cover;border-radius:9px}
.studio .example-pending{display:grid;place-items:center;width:100%;height:125px;padding:12px;border-radius:9px;background:#263549;color:#c4d2e4;font-size:12px;text-align:center}
.studio .visual-choice input:checked+.choice-face{box-shadow:0 0 0 2px #7dbdb5}
.studio .generated-preview{width:100%;height:100%;object-fit:contain;border-radius:12px}
.studio .reference-panel{border-top:1px solid #42536a;margin-top:30px;padding-top:15px}
.studio .reference-panel input[type=file]{width:100%}
.studio .consent{display:flex;gap:10px;align-items:start;line-height:1.45}
.studio .consent input{width:auto;margin-top:4px}
.studio .reference-row{display:flex;align-items:center;gap:14px;margin:12px 0;padding:10px;background:#1a2838;border-radius:10px}
.studio .reference-row img{width:75px;height:90px;object-fit:cover;border-radius:8px}
.studio .reference-row form{margin-left:auto}
.studio .reference-row button{margin:0}

/* Paket 1.5.2b – Vorschau strikt begrenzen, Editor bedienbar halten */
.studio{width:100%;min-width:0;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:start}
.studio>section,.studio>aside{min-width:0;max-width:100%}
.studio>aside{width:100%;overflow:hidden}
.studio .preview{width:100%;min-width:0;max-width:100%;overflow:hidden;position:sticky;top:20px}
.studio .preview-figure{width:100%;max-width:100%;height:auto;aspect-ratio:3/4;max-height:360px;min-width:0;overflow:hidden}
.studio .preview-figure .generated-preview{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;object-position:center}
.studio [data-character-form],.studio [data-character-form] #age{min-width:0;max-width:100%}
.studio [data-character-form] #age{position:relative;z-index:1}
@media(max-width:760px){.studio{grid-template-columns:minmax(0,1fr)}.studio .preview{position:static}.studio .preview-figure{max-height:320px}}

/* Paket 1.5.3: Bildkacheln bei Geschlechtswechsel */
.studio .visual-choice img[hidden],.studio .visual-choice .example-pending[hidden]{display:none!important}
.studio .visual-choice img{aspect-ratio:4/5;object-fit:cover;object-position:center top}