.performance-chart[data-v-ee47cda3]{padding:15px;background:#1a1a1a;border-radius:8px;margin-top:20px}.performance-chart h3[data-v-ee47cda3]{margin:0 0 15px;color:#4caf50;font-size:16px}.metrics-grid[data-v-ee47cda3]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:15px}.metric-card[data-v-ee47cda3]{background:#2a2a2a;padding:10px;border-radius:4px;text-align:center}.metric-label[data-v-ee47cda3]{font-size:12px;color:#888;margin-bottom:5px}.metric-value[data-v-ee47cda3]{font-size:20px;font-weight:700;color:#fff}.fps-good[data-v-ee47cda3]{color:#4caf50!important}.fps-warning[data-v-ee47cda3]{color:#ffa726!important}.fps-bad[data-v-ee47cda3]{color:#ef5350!important}.chart-container[data-v-ee47cda3]{background:#0a0a0a;border-radius:4px;padding:10px;margin-bottom:15px}.chart-container canvas[data-v-ee47cda3]{width:100%;height:150px}.issues-panel[data-v-ee47cda3]{background:#2a2a2a;border-radius:4px;padding:10px;margin-bottom:15px}.issues-panel h4[data-v-ee47cda3]{margin:0 0 10px;color:#ffa726;font-size:14px}.issue-item[data-v-ee47cda3]{padding:5px;margin-bottom:5px;border-radius:3px;font-size:12px}.issue-high[data-v-ee47cda3]{background:rgba(239,83,80,.2);color:#ef5350}.issue-medium[data-v-ee47cda3]{background:rgba(255,167,38,.2);color:#ffa726}.issue-low[data-v-ee47cda3]{background:rgba(66,165,245,.2);color:#42a5f5}.actions[data-v-ee47cda3]{display:flex;gap:10px}.actions button[data-v-ee47cda3]{flex:1;padding:8px;background:#333;color:#fff;border:1px solid #444;border-radius:4px;cursor:pointer;font-size:12px;transition:background .3s}.actions button[data-v-ee47cda3]:hover{background:#444}.actions button[data-v-ee47cda3]:disabled{opacity:.5;cursor:not-allowed}.app-container{display:flex;width:100vw;height:100vh;background:#1a1a1a}.canvas-container{flex:1;position:relative;overflow:hidden;background:#2a2a2a}.webgl-canvas{position:absolute;top:0;left:0;z-index:1}.konva-container{position:absolute;top:0;left:0;z-index:2;pointer-events:all}.control-panel{width:300px;background:#1e1e1e;color:#fff;padding:20px;overflow-y:auto;overflow-x:hidden;border-left:1px solid #333;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.control-panel h3{margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid #333}.control-group{margin-bottom:15px}.control-group label{display:block;margin-bottom:5px;font-size:14px;color:#aaa}.control-group input[type=number],.control-group select{width:100%;padding:8px;background:#2a2a2a;color:#fff;border:1px solid #444;border-radius:4px}.control-group input[type=range]{width:calc(100% - 50px);vertical-align:middle}.control-group button{width:100%;padding:10px;background:#4caf50;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background .3s}.control-group button:hover{background:#45a049}.control-group button.active{background:#f44336}.control-group button.active:hover{background:#da190b}.stats{margin:20px 0;padding:15px;background:#2a2a2a;border-radius:4px}.stats h4{margin-bottom:10px;color:#4caf50}.stats div{margin:5px 0;font-size:14px;color:#aaa}@media screen and (max-width: 768px){.app-container{flex-direction:column}.canvas-container{height:60vh;min-height:300px}.control-panel{width:100%;height:40vh;border-left:none;border-top:2px solid #333;padding:15px;max-height:40vh}.control-panel h3{font-size:16px;margin-bottom:10px;padding-bottom:8px}.control-group{margin-bottom:10px}.control-group label{font-size:13px}.control-group input[type=number],.control-group select{padding:6px;font-size:14px}.control-group button{padding:8px;font-size:13px}.stats{padding:10px;margin:10px 0}.stats h4{font-size:14px;margin-bottom:6px}.stats div{font-size:12px;margin:3px 0}.control-group small{font-size:11px}}@media screen and (max-width: 480px){.control-panel{padding:10px}.control-panel h3{font-size:14px}.control-group label{font-size:12px}.stats{padding:8px}.stats h4{font-size:13px}.stats div{font-size:11px}}@media screen and (max-width: 768px) and (orientation: landscape){.app-container{flex-direction:row}.canvas-container{height:100vh}.control-panel{width:280px;height:100vh;border-top:none;border-left:2px solid #333}}