@font-face{font-family:Poppins;src:url(../fonts/Poppins-Regular.ttf) format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Poppins;src:url(../fonts/Poppins-SemiBold.ttf) format("truetype");font-weight:600;font-display:swap}:root{color:#f7f5f0;background:#000;font-family:Poppins,Arial,sans-serif;font-synthesis:none;color-scheme:dark;-webkit-font-smoothing:antialiased;--ink: #050505;--paper: #ebe6dc;--paper-selected: #f5f1e8;--olive: #2f3f25;--olive-light: #b8c6aa;--line: #2d302b}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%}body{margin:0;background:#000}button{font:inherit}.wannado-widget{width:100%;max-width:1180px;height:760px;margin-inline:auto;padding:16px;display:grid;grid-template-columns:minmax(310px,360px) minmax(0,1fr);gap:16px;overflow:hidden;background:#000}.gallery{min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-content:start;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#526146 #111;padding:0 8px 0 0}.gallery::-webkit-scrollbar{width:5px}.gallery::-webkit-scrollbar-track{background:#111}.gallery::-webkit-scrollbar-thumb{background:#526146}.motif{position:relative;width:100%;aspect-ratio:5 / 6;overflow:hidden;border:1px solid transparent;border-radius:0;padding:clamp(7px,1vw,11px);display:grid;grid-template-rows:minmax(0,1fr) 28px;gap:10px;background:var(--paper);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}.motif:after{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--olive);transform:scaleX(0);transform-origin:left;transition:transform .16s ease}@media(hover:hover){.motif:hover{background:#f3eee5;transform:translateY(-2px)}}.motif:active{cursor:grabbing;transform:scale(.985)}.motif.selected{border-color:var(--olive-light);background:var(--paper-selected)}.motif.selected:after{transform:scaleX(1)}.motif:focus-visible{outline:2px solid #fff;outline-offset:-4px}.motif:disabled{opacity:.38;cursor:not-allowed;filter:grayscale(1)}.motif-art{width:100%;height:auto;min-height:0;display:grid;place-items:center;padding:0;overflow:hidden}.motif-name{min-width:0;align-self:center;overflow:hidden;color:#181a17;font-size:9px;font-weight:600;line-height:1.08;letter-spacing:.02em;text-align:center;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.motif-art img{width:100%;height:100%;display:block;object-fit:contain;object-position:center;mix-blend-mode:multiply;pointer-events:none}.motif-blume-klein .motif-art img{transform:translate(-7.25%)}.status-icon{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;color:#1d2814}.missing-art:after{content:"Bild fehlt";position:static;height:auto;transform:none;color:#222;font-size:12px}.stage{position:relative;min-width:0;height:100%;overflow:hidden;border:1px solid var(--line);touch-action:none;cursor:grab;isolation:isolate;background:radial-gradient(circle at 50% 38%,rgb(78 79 71 / .52),transparent 39%),radial-gradient(ellipse at 50% 56%,#30332d 0,#181a17 48%,#080908 86%);box-shadow:inset 0 0 80px #00000047}.stage:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;opacity:.2;background-image:linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px);background-size:100% 64px;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 15%,#000 85%,transparent)}.stage:active{cursor:grabbing}.stage.awaiting{cursor:crosshair}.stage-help{position:absolute;left:50%;bottom:22px;z-index:2;transform:translate(-50%);width:max-content;max-width:calc(100% - 32px);padding:10px 16px;border:1px solid #65745a;background:#182113e6;color:#f7f5f0;font-size:11px;font-weight:600;letter-spacing:.08em;text-align:center;text-transform:uppercase;pointer-events:none;box-shadow:0 8px 30px #0000004d}.body-rotate-handle{position:absolute;right:18px;top:18px;z-index:5;width:48px;height:48px;padding:0;display:grid;place-items:center;border:1px solid #8c9c80;border-radius:50%;background:#24311cf5;color:#fff;cursor:grab;touch-action:none;box-shadow:0 5px 20px #00000080;transition:background-color .14s ease,transform .14s ease}@media(hover:hover){.body-rotate-handle:hover{background:#526146;transform:scale(1.06)}}.body-rotate-handle:active{cursor:grabbing}.body-rotate-handle:focus-visible{outline:2px solid #fff;outline-offset:3px}.tattoo-selection{position:absolute;z-index:3;border:1px dashed rgb(238 242 232 / .88);border-radius:1px;pointer-events:none;filter:drop-shadow(0 2px 5px rgb(0 0 0 / .55))}.tattoo-selection.editing{border-color:#d8e5cb80}.handle{position:absolute;width:38px;height:38px;padding:0;border:1px solid #8c9c80;border-radius:50%;background:#24311cf5;color:#fff;display:grid;place-items:center;pointer-events:auto;touch-action:none;cursor:grab;box-shadow:0 4px 16px #0000008c;transition:background-color .14s ease,transform .14s ease}@media(hover:hover){.handle:hover{background:#526146;transform:scale(1.06)}}.handle:focus-visible{outline:2px solid #fff;outline-offset:3px}.handle:active{cursor:grabbing}.handle.delete{left:-19px;top:-19px;cursor:pointer}.handle.rotate{right:-19px;top:-19px}.handle.size{right:-19px;bottom:-19px;cursor:nwse-resize}.drag-ghost{position:fixed;z-index:100;width:104px;height:104px;padding:12px;border:1px solid #8b9880;background:#f4efe5f0;pointer-events:none;transform:translate(-50%,-50%);box-shadow:0 12px 35px #0000007a}.drag-ghost img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}.loading-state{position:absolute;top:50%;left:50%;z-index:2;transform:translate(-50%,-50%);color:#e0e3db;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;pointer-events:none}.feedback{position:absolute;bottom:20px;left:50%;z-index:6;width:max-content;max-width:calc(100% - 32px);padding:10px 14px;transform:translate(-50%);border:1px solid #65745a;background:#182113f0;color:#fff;font-size:12px;text-align:center;box-shadow:0 8px 30px #00000059}.error-state{position:absolute;top:0;right:0;bottom:0;left:0;z-index:8;padding:24px;background:#111;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.error-state h3{margin:0 0 10px;font:600 18px Poppins,Arial,sans-serif}.error-state p{max-width:460px;margin:0 0 16px;color:#d3d4d0;font-size:13px;line-height:1.6}.error-state button{border:1px solid #6a775b;border-radius:0;padding:11px 17px;background:var(--olive);color:#fff;cursor:pointer}@media(max-width:900px){.wannado-widget{grid-template-columns:minmax(270px,315px) minmax(0,1fr);gap:12px;padding:12px;height:700px}.gallery{gap:7px;padding-right:6px}.motif{padding:7px}}@media(max-width:700px){.wannado-widget{height:930px;padding:8px;grid-template-columns:minmax(0,1fr);grid-template-rows:306px 600px;gap:8px}.gallery{grid-template-columns:none;grid-template-rows:repeat(3,96px);grid-auto-columns:82px;grid-auto-flow:column;gap:6px;overflow-x:auto;overflow-y:hidden;padding:0 0 6px;scrollbar-width:thin;scroll-snap-type:x proximity}.gallery::-webkit-scrollbar{width:auto;height:4px}.motif{width:82px;height:96px;padding:5px;grid-template-rows:minmax(0,1fr) 24px;gap:8px;scroll-snap-align:start}.motif-name{font-size:8px}.stage{height:600px}.stage-help{bottom:14px;padding:9px 12px;font-size:10px}.body-rotate-handle{display:none}.handle{width:42px;height:42px}.handle.delete{left:-21px;top:-21px}.handle.rotate{right:-21px;top:-21px}.handle.size{right:-21px;bottom:-21px}.drag-ghost{width:88px;height:88px;padding:9px}}@media(max-width:380px){.wannado-widget{height:868px;grid-template-rows:288px 556px}.gallery{grid-template-rows:repeat(3,90px);grid-auto-columns:74px;gap:5px}.motif{width:74px;height:90px;padding:4px;grid-template-rows:minmax(0,1fr) 22px;gap:7px}.motif-name{font-size:7.5px}.stage{height:556px}}@media(prefers-reduced-motion:reduce){.motif,.motif:after,.handle,.body-rotate-handle{transition:none}}