*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.7 system-ui,sans-serif}header{background:var(--navy);color:var(--gold);display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding:1.2rem 5%}header a,footer a{color:inherit}.brand{letter-spacing:.25em;text-decoration:none}nav{display:flex;gap:1rem;flex-wrap:wrap}section{max-width:1100px;margin:auto;padding:3rem 5%}.hero{max-width:none;background:var(--navy);color:var(--ivory);text-align:center;padding:4rem 5%}.eyebrow{letter-spacing:.18em;font-size:.78rem;color:var(--jade);font-weight:600}.hero .eyebrow{color:var(--gold)}h1,h2,h3{font-family:Georgia,serif;line-height:1.2;font-weight:400}h1{font-size:clamp(2.5rem,6vw,5rem);margin:.5rem 0}h2{font-size:clamp(1.8rem,4vw,2.8rem)}a{color:var(--jade)}.button{display:inline-block;padding:.8rem 1.4rem;border:1px solid currentColor;text-decoration:none;color:inherit}.products{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.product{border:1px solid var(--line);padding:1rem;background:var(--ivory)}.product img{width:100%;aspect-ratio:1;object-fit:contain}.placeholder{min-height:130px;display:grid;place-items:center;background:var(--champagne);color:var(--bordeaux);text-align:center;padding:1rem;font-size:.8rem}details{border-bottom:1px solid var(--line);padding:1rem 0}summary{cursor:pointer;font-weight:600}details p{max-width:80ch}footer{padding:2rem;text-align:center;background:var(--navy);color:var(--gold);font-size:.85rem}a:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}

[hidden]{display:none!important}.animated{background:linear-gradient(120deg,var(--navy),var(--jade),var(--navy));background-size:250% 250%;animation:glow var(--speed) ease-in-out infinite alternate}@keyframes glow{to{background-position:100% 50%}}.track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory}.track .product{flex:0 0 230px;scroll-snap-align:start}.product img{transition:transform .4s}.product:hover img{transform:scale(var(--zoom))}.product{overflow:hidden}button{font:inherit;border:1px solid var(--gold);background:transparent;padding:.4rem .8rem;cursor:pointer;margin:.25rem;color:inherit}button[aria-pressed=true]{background:var(--jade);color:var(--ivory)}#color-results{display:flex;gap:1rem;flex-wrap:wrap}#color-results .product{width:230px}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

header,footer{background:var(--navy);color:var(--ivory);border-block-end:3px double var(--gold)} .brand{color:var(--gold-light)} .hero{position:relative;isolation:isolate;overflow:hidden;border-bottom:4px double var(--gold)} .animated{background:radial-gradient(ellipse at 15% 25%,var(--jade),transparent 50%),radial-gradient(ellipse at 85% 80%,var(--china-red),transparent 48%),var(--navy);background-size:160% 160%;animation:glow var(--speed) ease-in-out infinite alternate} .hero::before,.hero::after{content:"";position:absolute;inset:12px;pointer-events:none;border:1px solid var(--gold);z-index:-1;opacity:.65}.hero::after{inset:17px;opacity:.35} .hero .eyebrow{color:var(--gold-light)} .button{border:3px double var(--gold);color:var(--ivory);transition:background .3s,color .3s}.button:hover{background:var(--gold);color:var(--navy)} h2{color:var(--navy)} h3{color:var(--bordeaux)} .eyebrow,a{color:var(--jade-dark)} .product{border:1px solid var(--gold);border-top:3px double var(--gold)} button{border:3px double var(--gold)} button[aria-pressed=true]{background:var(--jade-dark)} .hero a:focus-visible{outline-color:var(--ivory)}

header .brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:0}header .brand img{display:block;width:clamp(76px,9vw,112px);height:auto;object-fit:contain} @media(max-width:520px){header .brand img{width:76px}header{gap:.75rem}}

/* Enzyklopaedie: lesbarer Button auf hellem Hintergrund */
#wissen a.button{color:var(--navy);background:transparent}
#wissen a.button:hover,#wissen a.button:focus-visible{background:var(--navy);color:var(--gold-light)}

/* Sinodreams: rounded button frames */
.button, button { border-radius: 12px; }

.hero h2{color:var(--ivory)}
button:focus-visible{outline:3px solid var(--jade-dark);outline-offset:3px}
.product-image{display:block;overflow:hidden}.product-image img{display:block;height:auto;aspect-ratio:1;object-fit:contain}
#color-results .product{max-width:100%}

/* V0.7 Stilwelten */
.world-controls{display:none;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6rem}.world-controls.ready{display:grid}.world-controls button{margin:0;min-height:48px;color:var(--navy)}.world-controls button[aria-pressed=true]{color:var(--ivory)}.world-panel{margin-top:1.5rem;border-top:3px double var(--gold);padding-top:1rem}.world-products{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:1rem;max-width:540px}.world-link{color:var(--navy);margin:.25rem .25rem .25rem 0}.world-hero{margin:.25rem}.world-panel .product{min-width:0}
.cfd-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:1rem}.cfd-fields label{display:flex;flex-direction:column;gap:.35rem}.cfd-fields select{font:inherit;color:var(--navy);background:var(--ivory);border:1px solid var(--gold);border-radius:12px;padding:.6rem;width:100%}#swatches{display:flex;gap:.6rem;margin:1rem 0}.swatch{width:64px;height:64px;border:1px solid var(--gold);border-radius:12px}#run{background:var(--jade-dark);color:var(--ivory);padding:.8rem 1.2rem}#run:disabled{opacity:.6;cursor:wait}#results{margin-top:1rem}#results:empty{display:none}#cfd-fallback{margin-top:1rem}
[hidden]{display:none!important}.cfd-fields>*{min-width:0}.cfd-fields select{box-sizing:border-box;max-width:100%}

/* V1.0 shared product presentation */
.product{border-radius:12px;display:flex;flex-direction:column;gap:.55rem;min-width:0}.product h3,.product p{margin:0}.product-image{aspect-ratio:1;width:100%;border-radius:7px}.product-image img{width:100%;height:100%;object-fit:contain}.product-link{margin-top:auto;align-self:flex-start;padding:.45rem .8rem;border:3px double var(--gold);border-radius:12px;text-decoration:none;color:var(--jade-dark)}.products:not(.track),.world-products{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));max-width:none}.track .product{flex-basis:230px}#results{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}#results .product{max-width:340px;width:100%}
/* V1.2 selected outfit colors */
.chosen-color{display:flex;flex-direction:column;gap:.35rem;flex:1;min-width:0}.chosen-color:first-child{flex:3}.chosen-color .swatch{width:100%;height:55px;box-sizing:border-box}.chosen-color span{font-size:.85rem}#swatches{max-width:540px}.cfd-fields select optgroup{font-weight:600}
