*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}@keyframes sushiBelt{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes sushiBeltReverse{0%{transform:translate(0)}to{transform:translate(-100%)}}h1{font-size:3rem;margin-bottom:1.5rem;text-shadow:0 0 20px rgba(255,107,107,.5);animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}p{max-width:600px;text-align:center;line-height:1.8;margin-bottom:2rem;color:#b8c5d6}p strong{color:#ff6b6b;font-weight:600}p code{background:#ff6b6b33;padding:.2em .5em;border-radius:4px;font-family:Fira Code,Consolas,monospace;color:#ffd93d}@keyframes plateSlide{0%{transform:translate(-100vw) rotate(0)}to{transform:translate(100vw) rotate(360deg)}}@media (max-width: 600px){h1{font-size:2rem}p{font-size:.9rem;padding:0 1rem}}#sushi-app{display:flex;flex-direction:column;width:100%;max-width:1200px;min-height:80vh;gap:1.5rem;padding:1rem}#sushi-belt-container{position:relative;width:100vw;margin-left:calc(-50vw + 50%);height:120px;background:linear-gradient(180deg,#2d2d44,#1a1a2e);border-radius:0;overflow:hidden;box-shadow:0 4px 20px #0000004d,inset 0 2px 4px #ffffff1a;border-top:2px solid #3d3d5c;border-bottom:2px solid #3d3d5c;border-left:none;border-right:none}#sushi-belt-container:before{content:"";position:absolute;top:50%;left:0;right:0;height:8px;background:linear-gradient(90deg,#4a4a6a,#5a5a7a,#4a4a6a,#5a5a7a,#4a4a6a);background-size:40px 100%;transform:translateY(-50%);animation:beltMove 2s linear infinite;z-index:0}@keyframes beltMove{0%{background-position:0 0}to{background-position:40px 0}}#sushi-belt{position:relative;width:100%;height:100%;overflow:hidden}.plate-visual{position:absolute;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;width:100px;height:90px;background:linear-gradient(145deg,#fff,#e8e8e8);border-radius:50%;box-shadow:0 4px 12px #0000004d,inset 0 -2px 4px #0000001a;border:3px solid #d0d0d0;z-index:1;transition:border-color .3s ease,box-shadow .3s ease}.plate-visual .plate-id{font-size:.7rem;font-weight:700;color:#666;margin-bottom:2px}.plate-visual .plate-contents{font-size:1.2rem;text-align:center;line-height:1.2}.plate-visual.animate{animation:plateSlideAcross 16s linear forwards}@keyframes plateSlideAcross{0%{left:-150px}to{left:calc(100% + 50px)}}.plate-visual.selected{border-color:#4ecdc4;box-shadow:0 0 20px #4ecdc499,0 0 40px #4ecdc466,0 4px 12px #0000004d,inset 0 -2px 4px #0000001a;animation:plateSlideAcross 16s linear forwards,selectedPulse 1s ease-in-out infinite}@keyframes selectedPulse{0%,to{box-shadow:0 0 20px #4ecdc499,0 0 40px #4ecdc466,0 4px 12px #0000004d}50%{box-shadow:0 0 30px #4ecdc4cc,0 0 60px #4ecdc480,0 4px 12px #0000004d}}#table-area{display:flex;flex-direction:column;width:100%;background:linear-gradient(180deg,#2d2d44,#1a1a2e);border-radius:12px;padding:1rem;border:2px solid #3d3d5c;box-shadow:0 4px 20px #0000004d,inset 0 2px 4px #ffffff1a}#table-area h3{font-size:1rem;color:#b8c5d6;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #3d3d5c}#table-surface{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;align-content:flex-start;gap:1rem;padding:1.5rem;min-height:140px;border-radius:10px;background:linear-gradient(90deg,#8b5a2b26,#a06e3c33,#8b5a2b26,#a06e3c33,#8b5a2b26,#a06e3c33),linear-gradient(180deg,#5d4037,#6d4c41,#795548,#6d4c41,#5d4037);background-size:60px 100%,100% 100%;box-shadow:inset 0 2px 8px #0006,inset 0 -2px 8px #ffffff0d,0 2px 4px #0003;border:3px solid #4e342e;background-blend-mode:overlay}#table-surface:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:8px;background:repeating-linear-gradient(90deg,transparent 0px,transparent 8px,rgba(0,0,0,.03) 8px,rgba(0,0,0,.03) 10px),repeating-linear-gradient(0deg,transparent 0px,transparent 30px,rgba(0,0,0,.02) 30px,rgba(0,0,0,.02) 32px);pointer-events:none;z-index:0}#table-surface:empty:after{content:"🪑 Warte auf Teller...";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#ffffff4d;font-size:.9rem;font-style:italic;z-index:1}.plate-visual.on-table{position:relative;z-index:2;animation:plateOnTableAppear .3s ease-out;top:auto;left:auto;transform:none}@keyframes plateOnTableAppear{0%{opacity:0;transform:scale(.8) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}.plate-visual.moving-to-table{position:fixed!important;z-index:9999;transition:transform .5s ease-in-out;transform:translate(var(--target-x, 0),var(--target-y, 0))!important}#bottom-section{display:flex;flex-direction:row;gap:1.5rem;min-height:200px;max-height:300px}#technical-log{flex:2;display:flex;flex-direction:column;background:#1a1a2ecc;border-radius:12px;padding:1rem;border:1px solid #3d3d5c;box-shadow:0 4px 15px #0003;overflow:hidden}#technical-log h3{font-size:1rem;color:#b8c5d6;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #3d3d5c}#log-entries{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.4rem;padding-right:.5rem}#log-entries::-webkit-scrollbar{width:6px}#log-entries::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}#log-entries::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}#log-entries::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.log-entry{font-family:Fira Code,Consolas,monospace;font-size:.8rem;padding:.5rem .75rem;border-radius:6px;background:#ffffff0d;color:#b8c5d6;border-left:3px solid transparent;word-break:break-word}.log-entry.info{border-left-color:#4a9eff;background:#4a9eff1a}.log-entry.success{border-left-color:#4ecdc4;background:#4ecdc41a;color:#6bcf7f}.log-entry.warning{border-left-color:#ffd93d;background:#ffd93d1a;color:#ffd93d}#consumed-sushi{flex:1;display:flex;flex-direction:column;background:#1a1a2ecc;border-radius:12px;padding:1rem;border:1px solid #3d3d5c;box-shadow:0 4px 15px #0003;overflow:hidden}#consumed-sushi h3{font-size:1rem;color:#b8c5d6;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #3d3d5c}#consumed-entries{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;padding-right:.5rem}#consumed-entries::-webkit-scrollbar{width:6px}#consumed-entries::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}#consumed-entries::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}#consumed-entries::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.consumed-item{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;background:linear-gradient(135deg,#4ecdc426,#6bcf7f26);border-radius:8px;border:1px solid rgba(78,205,196,.3);font-size:.9rem;color:#fff;animation:consumedAppear .3s ease-out}@keyframes consumedAppear{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.consumed-item:hover{background:linear-gradient(135deg,#4ecdc440,#6bcf7f40);border-color:#4ecdc480}@media (max-width: 767px){#sushi-app{min-height:auto;gap:1rem;padding:.75rem}#sushi-belt-container{height:100px}.plate-visual{width:80px;height:72px}.plate-visual .plate-id{font-size:.6rem}.plate-visual .plate-contents{font-size:1rem}#table-area{padding:.75rem}#table-area h3{font-size:.9rem}#table-surface{min-height:120px;padding:1rem;gap:.75rem}#table-surface:empty:after{font-size:.8rem}#bottom-section{flex-direction:column;gap:1rem;min-height:auto}#technical-log{flex:none;min-height:200px;max-height:250px}#technical-log h3{font-size:.9rem}.log-entry{font-size:.75rem;padding:.4rem .6rem}#consumed-sushi{flex:none;min-height:150px;max-height:200px}#consumed-sushi h3{font-size:.9rem}.consumed-item{font-size:.85rem;padding:.5rem .6rem}}@media (max-width: 479px){#sushi-app{padding:.5rem;gap:.75rem}#sushi-belt-container{height:90px;border-radius:0}.plate-visual{width:70px;height:64px}.plate-visual .plate-contents{font-size:.9rem}#table-area{padding:.5rem;border-radius:8px}#table-area h3{font-size:.85rem;margin-bottom:.5rem}#table-surface{min-height:100px;padding:.75rem;gap:.5rem;border-radius:6px}#table-surface:empty:after{font-size:.75rem}.plate-visual.on-table{width:70px;height:64px}.plate-visual.on-table .plate-contents{font-size:.9rem}#technical-log,#consumed-sushi{border-radius:8px;padding:.75rem}.log-entry{font-size:.7rem}.consumed-item{font-size:.8rem}}