*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f0f9ff}.app{display:flex;flex-direction:column;height:100vh;overflow:hidden;position:relative}.main-content{display:flex;flex:1;overflow:hidden}.preview-stack{flex:1;display:flex;flex-direction:column;gap:4px;overflow-y:auto;overflow-x:hidden;min-width:0;min-height:0;scrollbar-gutter:stable;padding:0 24px;background:linear-gradient(135deg,#f0f9ff,#e0f2fe)}.app-copyright{position:absolute;left:12px;bottom:8px;font-size:12px;color:#0284c7;letter-spacing:.4px;background:#ffffffb3;padding:4px 8px;border:1px solid #e0f2fe;border-radius:4px;z-index:5;pointer-events:none}.header{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;padding:8px 16px;flex-shrink:0;box-shadow:0 2px 4px #0ea5e94d}.header-title{margin:0;font-size:14px;font-weight:600;color:#fff;letter-spacing:.5px}.sidebar{width:240px;background:#fff;border-right:1px solid #e0f2fe;display:flex;flex-direction:column;overflow:hidden}.sidebar-header{padding:8px 12px;font-weight:600;font-size:12px;color:#0ea5e9;background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border-bottom:1px solid #e0f2fe;letter-spacing:.3px}.tree-view{flex:1;overflow-y:auto;padding:4px}.tree-node{-webkit-user-select:none;user-select:none}.tree-item{display:flex;align-items:center;padding:4px 8px;margin:1px 0;cursor:pointer;transition:all .15s ease;font-size:13px;gap:6px;border-radius:4px;text-decoration:none;color:inherit}.tree-item:visited{color:inherit}.tree-item:hover{background:#0ea5e91a}.tree-item.category{font-weight:600;color:#0284c7;font-size:12px}.tree-item.category:hover{background:#0ea5e926}.tree-item.leaf{font-weight:400;color:#475569;font-size:13px;display:flex;margin:1px 4px;width:auto}.tree-item.leaf:before{display:none}.tree-item.selected{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;box-shadow:0 2px 4px #0ea5e94d}.tree-item.selected:hover{background:linear-gradient(135deg,#0284c7,#0369a1)}.expand-icon{font-size:8px;width:10px;text-align:center;color:#7dd3fc}.tree-item:hover .expand-icon{color:#0ea5e9}.tree-item.selected .expand-icon{color:#ffffffe6}.node-label{flex:1}.tree-children{margin-left:0;border-left:none;padding-left:16px}.preview-area{flex:0 0 auto;width:100%;display:flex;align-items:stretch;justify-content:flex-start;padding:24px 0 12px;background:transparent;overflow:visible;min-height:0}.preview-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%}.preview-header{display:flex;justify-content:space-between;align-items:center;padding-right:2px}.frame-aspect-label{font-size:10px;color:#0ea5e9;font-weight:600;letter-spacing:.5px;background:#0ea5e91f;border:1px solid rgba(14,165,233,.2);padding:2px 6px;border-radius:4px}.preview-path{font-size:11px;font-weight:500}.path-category{color:#94a3b8;font-weight:400}.path-separator{color:#94a3b8}.path-current{color:#0ea5e9;font-weight:500}.preview-path-link{text-decoration:none}.path-current.preview-path-link,.path-current.preview-path-link:visited{color:#0ea5e9}.preview-path-link:hover{text-decoration:underline}.game-screen-viewport{flex:0 0 auto;min-height:0;width:100%;display:flex;align-items:flex-start;justify-content:center;overflow:visible}.frame-stack{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:4px}.game-screen-frame{position:relative;background:#fff;border:2px solid #000000;box-shadow:0 4px 20px #00000026;overflow:hidden;border-radius:0}.game-screen{background:#fff;position:absolute;top:0;left:0}.game-content{width:100%;height:100%;overflow:hidden}.loading{display:flex;align-items:center;justify-content:center;height:100%;font-size:16px;color:#666}.empty-state{display:flex;align-items:center;justify-content:center;height:100%;font-size:18px;color:#999;text-align:center;padding:40px}.fullscreen-toggle{position:absolute;bottom:8px;right:8px;width:28px;height:28px;padding:4px;border:none;background:#c8c8c84d;cursor:pointer;opacity:0;transition:opacity .2s ease,background .2s ease;z-index:10;display:flex;align-items:center;justify-content:center}.game-screen-frame:hover .fullscreen-toggle,.fullscreen-toggle--active{opacity:1}.fullscreen-toggle:focus-visible{opacity:1;background:#c8c8c899}.fullscreen-toggle:hover{background:#c8c8c899}.fullscreen-toggle svg{width:100%;height:100%;color:#94a3b8}.fullscreen-toggle:hover svg{color:#64748b}.fullscreen-toggle:focus-visible svg{color:#64748b}.debug-panel{margin:0 0 24px;padding:10px 12px 12px;border-radius:4px;background:#fff;border:1px solid #e0f2fe;box-shadow:0 6px 16px #0284c71f;display:flex;flex-direction:column;gap:10px;flex-shrink:0;width:100%}.debug-panel__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.debug-panel__title{margin:0;font-size:12px;font-weight:600;color:#0284c7;letter-spacing:.4px}.debug-reset{border:1px solid #f87171;background:#fee2e2;color:#b91c1c;border-radius:4px;padding:5px 10px;font-size:11px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}.debug-reset:hover{background:#fecaca;border-color:#ef4444;color:#991b1b}.debug-reset:active{transform:translateY(1px)}.debug-reset:focus-visible{outline:2px solid rgba(239,68,68,.6);outline-offset:2px}.debug-panel__hint{font-size:11px;color:#94a3b8}.debug-panel__groups{display:flex;flex-direction:column;gap:12px}.debug-panel__groups:empty{display:none}.debug-group{display:flex;flex-direction:column;gap:8px}.debug-group__title{font-size:11px;font-weight:600;color:#64748b}.debug-group__commands{display:flex;flex-wrap:wrap;gap:8px}.debug-input{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#0ea5e9}.debug-input__label{-webkit-user-select:none;user-select:none}.debug-input__control{width:64px;border:1px solid #bae6fd;background:#f0f9ff;color:#0284c7;padding:4px 6px;font-size:12px;font-weight:600;border-radius:4px}.debug-input__control:focus-visible{outline:2px solid rgba(14,165,233,.6);outline-offset:2px}.debug-range{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#0ea5e9}.debug-range__label{-webkit-user-select:none;user-select:none}.debug-range__controls{display:inline-flex;align-items:center;gap:6px}.debug-range__control{width:160px;accent-color:#0ea5e9}.debug-range__value{min-width:44px;text-align:right;color:#0284c7}.debug-file{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#0ea5e9}.debug-file__label{-webkit-user-select:none;user-select:none}.debug-file__control{max-width:240px;font-size:12px;color:#0284c7}.debug-file__control::file-selector-button{border:1px solid #bae6fd;background:#f0f9ff;color:#0284c7;border-radius:4px;padding:4px 8px;margin-right:8px;font-size:11px;font-weight:600;cursor:pointer}.debug-file__control::file-selector-button:hover{background:#e0f2fe;border-color:#7dd3fc}.debug-toggle{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;color:#0ea5e9;cursor:pointer}.debug-toggle__input{width:14px;height:14px;accent-color:#0ea5e9;cursor:pointer}.debug-toggle__label{-webkit-user-select:none;user-select:none}.debug-command{border:1px solid #bae6fd;background:#f0f9ff;color:#0ea5e9;border-radius:4px;padding:6px 10px;font-size:12px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}.debug-command:hover{background:#e0f2fe;border-color:#7dd3fc;color:#0284c7}.debug-command:active{transform:translateY(1px)}.debug-command:focus-visible{outline:2px solid rgba(14,165,233,.6);outline-offset:2px}
