:root{--color-text:#333;--color-background:transparent;--color-surface:transparent;--color-border:#ddd;--color-shadow:#0000001a;--console-bg-primary:#1e1e1e;--console-bg-secondary:#2d2d2d;--console-bg-tertiary:#252526;--console-text-primary:#d4d4d4;--console-text-secondary:#888;--console-border:#333;--console-border-hover:#555;--log-info:#4caf50;--log-warn:#ff9800;--log-error:#f44336;--log-debug:#9c27b0;--font-system:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"SF Mono", "Monaco", "Inconsolata", "Roboto Mono", "Source Code Pro", monospace;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--spacing-xl:20px;--radius-sm:3px;--radius-md:4px;--radius-lg:6px;--radius-xl:8px}*{box-sizing:border-box}:root{font-family:var(--font-system);color:var(--color-text);background-color:var(--color-background);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;line-height:1.4}html,body{touch-action:pan-x pan-y;background:0 0;width:100%;height:100%;margin:0;padding:0;overflow:hidden}.hidden{display:none!important}#userContentSandbox-container{background:var(--color-surface);width:100%;height:100vh;position:relative}#loading{padding:var(--spacing-xl);background:0 0;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#loading .spinner{border:3px solid #f3f3f3;border-top-color:#666;border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}iframe{touch-action:pan-x pan-y;border:none;width:100%;height:100%;display:block}.console-logger{z-index:10000;font-family:var(--font-mono);position:fixed}.console-logger-button{padding:var(--spacing-sm) var(--spacing-md);background:var(--console-bg-secondary);border-radius:var(--radius-lg) var(--radius-lg) 0 0;cursor:pointer;box-shadow:0 -2px 8px var(--color-shadow);color:var(--console-text-primary);border:1px solid #ccc;border-bottom:none;justify-content:center;align-items:center;transition:all .3s;display:none;position:fixed;bottom:0;right:40px}.console-logger-button:hover{background:#3d3d3d;box-shadow:0 -4px 12px #00000026}.console-logger-button:focus-visible,.close-drawer-btn:focus-visible,.drawer-resize-handle:focus-visible{outline-offset:2px;outline:3px solid #fff}.console-logger-button .log-counts{gap:var(--spacing-md);align-items:center;display:flex}.console-logger-button .info-count-container,.console-logger-button .error-count-container{align-items:center;gap:var(--spacing-xs);font-size:12px;font-weight:600;display:flex}.console-logger-button .info-icon{color:#fff;width:14px;height:14px}.console-logger-button .error-icon{width:14px;height:14px;color:var(--log-error)}.console-logger-button .info-count,.console-logger-button .error-count{text-align:center;min-width:16px}.console-logger-drawer{background:var(--console-bg-primary);color:var(--console-text-primary);border-top:1px solid var(--console-border);visibility:hidden;z-index:9999;flex-direction:column;min-height:200px;max-height:80vh;transition:transform .3s,visibility 0s .3s;display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateY(100%)}.console-logger-drawer.open{visibility:visible;transition:transform .3s,visibility;transform:translateY(0)}.drawer-header{padding:var(--spacing-md) var(--spacing-lg);background:var(--console-bg-secondary);border-bottom:1px solid var(--console-border);justify-content:space-between;align-items:center;min-height:48px;display:flex}.drawer-header h3{color:#fff;margin:0;font-size:14px;font-weight:600}.drawer-controls{gap:var(--spacing-sm);align-items:center;display:flex}.close-drawer-btn{border:1px solid var(--console-border-hover);color:var(--console-text-primary);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-md);cursor:pointer;background:0 0;font-size:12px;transition:all .2s}.close-drawer-btn:hover{background:var(--console-border-hover);border-color:#777}.close-drawer-btn{justify-content:center;align-items:center;width:24px;height:24px;padding:0;font-size:16px;font-weight:700;display:flex}.drawer-resize-handle{background:var(--console-border);cursor:ns-resize;border-top:1px solid var(--console-border-hover);height:4px;transition:background .2s}.drawer-resize-handle:hover{background:#2196f3}.logs-container{padding:var(--spacing-sm);background:var(--console-bg-primary);flex:1;overflow-y:auto}.no-logs{text-align:center;color:var(--console-text-secondary);padding:40px var(--spacing-xl);font-style:italic}.log-entry{margin-bottom:var(--spacing-sm);padding:var(--spacing-sm);border-radius:var(--radius-md);border-left:3px solid var(--console-border-hover);background:var(--console-bg-tertiary);font-size:12px;line-height:1.4}.log-entry.log-level-info,.log-entry.log-level-log{border-left-color:var(--log-info)}.log-entry.log-level-warn{border-left-color:var(--log-warn);background:#2a2416}.log-entry.log-level-error{border-left-color:var(--log-error);background:#2a1616}.log-entry.log-level-debug{border-left-color:var(--log-debug);background:#221a2a}.log-header{margin-bottom:var(--spacing-xs);justify-content:space-between;align-items:center;display:flex}.log-level{border-radius:var(--radius-sm);background:var(--console-border);padding:2px 6px;font-size:10px;font-weight:700}.log-level-info .log-level,.log-level-log .log-level{background:var(--log-info);color:#111827}.log-level-warn .log-level{background:var(--log-warn);color:#111827}.log-level-error .log-level{background:var(--log-error);color:#111827}@media (forced-colors:active){.console-logger-button,.console-logger-drawer,.close-drawer-btn,.drawer-resize-handle,.log-entry{border-color:canvastext}.console-logger-button:focus-visible,.close-drawer-btn:focus-visible,.drawer-resize-handle:focus-visible{outline-color:highlight}}.log-level-debug .log-level{background:var(--log-debug);color:#fff}.log-timestamp{color:var(--console-text-secondary);font-size:10px}.log-message{color:var(--console-text-primary);word-break:break-word}.log-args,.log-stack{margin-top:var(--spacing-xs);font-size:11px}.log-args pre,.log-stack pre{padding:var(--spacing-sm);border-radius:var(--radius-sm);color:var(--console-text-primary);white-space:pre-wrap;word-break:break-word;background:#1a1a1a;margin:0;overflow-x:auto}.log-stack{color:var(--log-warn)}.logs-container::-webkit-scrollbar{width:8px}.logs-container::-webkit-scrollbar-track{background:var(--console-bg-primary)}.logs-container::-webkit-scrollbar-thumb{background:var(--console-border-hover);border-radius:var(--radius-md)}.logs-container::-webkit-scrollbar-thumb:hover{background:#666}@media (width<=768px){.console-logger-button{right:var(--spacing-lg);padding:6px 10px}.console-logger-button .log-counts{gap:var(--spacing-sm)}.console-logger-button .info-count-container,.console-logger-button .error-count-container{font-size:11px}.console-logger-button .info-icon,.console-logger-button .error-icon{width:12px;height:12px}.drawer-header{padding:var(--spacing-sm) var(--spacing-md)}.logs-container{padding:6px}.log-entry{padding:6px;font-size:11px}}
