*{box-sizing:border-box;margin:0}html,body,#root{height:100%}body{background:#e8eaed;font-family:system-ui,sans-serif;overflow:hidden}.studio{flex-direction:column;height:100%;display:flex}.kopf{background:#fff;border-bottom:1px solid #d0d3d8;justify-content:space-between;align-items:center;padding:8px 16px;display:flex}.kopf-aktionen{gap:8px;display:flex}.kopf button{cursor:pointer;background:#fff;border:1px solid #d0d3d8;border-radius:8px;padding:6px 12px}.kopf-aktionen button:first-child{color:#fff;background:#1f6feb;border-color:#1f6feb}.studio .app{flex:1;min-height:0}.auswahl{height:100%;padding:2rem;overflow-y:auto}.auswahl h1{margin-bottom:1.25rem}.kacheln{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;display:grid}.kachel{cursor:pointer;text-align:left;background:#fff;border:1px solid #d0d3d8;border-radius:12px;padding:0;overflow:hidden}.kachel img{aspect-ratio:640/420;object-fit:cover;background:#e0e2e6;width:100%;display:block}.kachel span{padding:10px 12px;font-weight:600;display:block}.app{height:100%;display:flex}.viewer{flex:1;min-width:0;min-height:0}.viewer canvas{width:100%;height:100%;display:block}.fehler,.laden{padding:2rem}.laden3d{white-space:nowrap;background:#ffffffe6;border-radius:8px;padding:10px 18px;font-size:.95rem}.panel{background:#fff;border-left:1px solid #d0d3d8;flex:0 0 300px;padding:1.25rem;overflow-y:auto}.panel h1{margin-bottom:1rem;font-size:1.1rem}.panel h2{text-transform:uppercase;letter-spacing:.05em;color:#666;margin:1rem 0 .5rem;font-size:.8rem}.farben{grid-template-columns:repeat(5,44px);gap:8px;display:grid}.farbe{cursor:pointer;border:2px solid #0000;border-radius:8px;width:44px;height:44px}.farbe.aktiv{border-color:#000}.farbe:disabled{opacity:.4;cursor:default}.freie-farbe{grid-column:1/-1;align-items:center;gap:8px;margin-top:4px;font-size:.85rem;display:flex}.freie-farbe input{width:44px;height:32px}.finishes{flex-direction:column;gap:6px;display:flex}.finish{text-align:left;cursor:pointer;background:#fff;border:1px solid #d0d3d8;border-radius:8px;padding:10px 12px;font-size:.95rem}.finish.aktiv{background:#f0f0f0;border-color:#000;font-weight:600}.hinweis{color:#666;margin-top:.5rem;font-size:.8rem}.zonen,.designs{flex-wrap:wrap;gap:6px;display:flex}.zone{cursor:pointer;background:#fff;border:1px solid #d0d3d8;border-radius:999px;padding:8px 12px;font-size:.85rem}.zone.aktiv{background:#f0f0f0;border-color:#000;font-weight:600}.design{cursor:pointer;background:#fff;border:1px solid #d0d3d8;border-radius:8px;align-items:center;gap:8px;padding:8px 12px;font-size:.9rem;display:flex}.design.aktiv{background:#f0f0f0;border-color:#000;font-weight:600}.design-swatches{gap:2px;display:flex}.design-swatch{border:1px solid #0002;border-radius:3px;width:14px;height:14px}.erben{align-items:center;gap:8px;margin-top:.75rem;font-size:.9rem;display:flex}.dialog-overlay{z-index:100;background:#00000073;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.dialog{background:#fff;border-radius:12px;width:100%;max-width:420px;max-height:90vh;padding:1.5rem;overflow-y:auto}.dialog h2{margin-bottom:1rem;font-size:1.1rem}.dialog form{flex-direction:column;gap:.75rem;display:flex}.dialog label{color:#333;flex-direction:column;gap:4px;font-size:.85rem;display:flex}.dialog input,.dialog textarea{font:inherit;resize:vertical;border:1px solid #d0d3d8;border-radius:8px;padding:8px 10px}.honeypot{position:absolute;left:-9999px}.dialog-fehler{color:#b3261e;font-size:.85rem}.dialog-erfolg{padding:1rem 0;font-size:.95rem}.dialog-aktionen{justify-content:flex-end;gap:8px;margin-top:.25rem;display:flex}.dialog-aktionen button{cursor:pointer;background:#fff;border:1px solid #d0d3d8;border-radius:8px;padding:8px 14px;font-size:.9rem}.dialog-aktionen button[type=submit]{color:#fff;background:#1f6feb;border-color:#1f6feb}.dialog-aktionen button:disabled{opacity:.6;cursor:default}.rechts-footer{flex-shrink:0;justify-content:center;gap:12px;padding:6px 16px;font-size:.75rem;display:flex}.auswahl .rechts-footer{justify-content:flex-start;padding:1.5rem 0 0}.rechts-footer a{color:#888;text-decoration:none}.rechts-footer a:hover{text-decoration:underline}@media (width<=900px){.app{flex-direction:column}.panel{border-top:1px solid #d0d3d8;border-left:none;flex:none;width:100%;max-height:40%}.farben{grid-template-columns:repeat(auto-fill,44px)}.finishes{flex-flow:wrap}}
