body{font-family:"Arial",sans-serif;padding:20px;background-color:#f0f0f0}.current-screen-display{margin-bottom:20px}.current-screen-display h1{color:#333;font-size:24px;text-align:center}.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(255,255,255,.5);backdrop-filter:blur(5px);display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000}.spinner{border:4px solid rgba(0,0,0,.1);width:50px;height:50px;border-radius:50%;border-left-color:#09f;animation:spin 1s linear infinite}.loading-message{margin-top:20px;font-size:20px}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.config-pane{z-index:1000;position:fixed;right:0;top:0;width:300px;padding:20px;display:flex;flex-direction:column;gap:20px;background-color:rgba(0,0,0,.6);color:#fff;font-family:Arial,sans-serif;font-size:14px;transition:right .5s;border-radius:0 0 0 10px}.config-pane.collapsed{right:-320px}.collapse-toggle{background:rgba(0,0,0,0);border:none;color:#a4a4a4;cursor:pointer;position:absolute;top:-5px;left:-5px;width:30px;height:30px;font-size:20px;padding:0;outline:none}.collapse-toggle:hover{color:#eee;outline:none}.config-card{border:1px solid #fff;padding:10px;border-radius:5px}.config-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.config-card-title{margin-top:2px;margin-left:2px;font-size:x-small;font-weight:bold}.runtime-controls{display:flex;justify-content:center}.mock-controls{display:flex;justify-content:center;align-items:center;gap:5px}.index-input{width:60px;text-align:center}.button{border:none;padding:5px 10px;margin-left:5px;margin-right:5px;cursor:pointer;border-radius:5px;font-size:10px;transition:background-color .3s ease}.switch-button{background:rgba(0,0,0,0);border:none;color:#959595;cursor:pointer;font-size:x-small;padding:0;margin:0}.switch-button:hover{color:#f6f6f6;outline:none}.running{background-color:#4caf50}.paused{background-color:#f44336}.updating{animation:pulseAnimation 1.5s infinite}@keyframes pulseAnimation{0%{background-color:#008cba}50%{background-color:#58d3f7}100%{background-color:#008cba}}.metrics-table{width:100%;font-size:small;border-collapse:collapse}.metrics-table td{padding:5px;text-align:left}.metrics-table td:first-child{font-weight:bold;padding-right:20px}.inventory-wrapper{display:flex;justify-content:space-around;max-width:100%;gap:20px}.inventory-pane{display:grid;grid-template-columns:repeat(auto-fill, minmax(50vw, 1fr));grid-auto-rows:max-content;gap:10px;border:1px solid #ccc;padding:10px;overflow-x:hidden;overflow-y:auto;max-height:800px;background-color:#444}.inventory-pane h2{color:#444;border-bottom:1px solid #ddd;padding-bottom:5px;margin-bottom:10px}.container{position:relative;min-width:150px;width:100%;min-height:64px;display:flex;flex-direction:column;align-items:start}.container .class-label{position:absolute;top:0;left:0;background-color:#012144;color:#fff;padding:5px 10px;border-radius:0 0 10px 0;font-size:.8rem;box-shadow:0 2px 4px rgba(0,0,0,.2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80%}.container .container-items{margin-top:25px;margin-left:20px;display:grid;grid-template-columns:repeat(auto-fill, minmax(50px, 1fr));row-gap:5px;width:100%;align-self:stretch}@media(min-width: 300px){.container .container-items{grid-template-columns:repeat(auto-fill, minmax(50px, 1fr))}}.container .container-items .item{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;margin-top:5px;margin-bottom:0px;padding:5px}.container .container-items .item .item-image{aspect-ratio:1/1;display:block;max-width:100%;height:auto;margin-bottom:2px}.container .container-items .item .item-price{display:block;text-align:center;font-family:Verdana,Geneva,Tahoma,sans-serif;width:100%;font-size:.75rem;width:100%;margin-top:2px}.container .container-items .item .tooltip{display:none;position:absolute;background-color:#333;color:#fff;border:1px solid #555;border-radius:4px;padding:10px;z-index:1000;width:200px;top:-10px;right:-60px;transform:translateY(-100%);box-shadow:2px 2px 5px rgba(0,0,0,.3)}.container .container-items .item:hover .tooltip{display:block}.debug-section{margin-top:20px;text-align:center}.debug-section .canvas-container{display:flex;justify-content:space-around;padding:20px}.debug-section .canvas-container canvas{border:1px solid #000}
