.demo-toolbar{height:var(--toolbar-height);padding:0 var(--space-4);background-color:var(--bg-secondary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.demo-toolbar-left,.demo-toolbar-right{flex:1;align-items:center;display:flex}.demo-toolbar-right{justify-content:flex-end}.demo-toolbar-center{justify-content:center;align-items:center;gap:var(--space-3);text-align:center;flex:2;display:flex}.demo-toolbar-title{white-space:nowrap;text-overflow:ellipsis;max-width:300px;margin:0;font-size:.95rem;font-weight:500;overflow:hidden}.demo-back-link{align-items:center;gap:var(--space-2);color:var(--text-secondary);font-size:.9rem;font-weight:500;display:flex}.demo-back-link:hover{color:var(--text-primary)}.demo-external-link{color:var(--text-secondary);border-radius:var(--radius-sm);justify-content:center;align-items:center;padding:4px;display:flex}.demo-external-link:hover{color:var(--text-primary);background-color:var(--bg-tertiary)}@media (width<=640px){.demo-toolbar-title{max-width:150px}}.project-demo-page{height:calc(100vh - var(--navbar-height));flex-direction:column;display:flex}.demo-not-found{padding-top:var(--space-12)}.demo-empty-state{padding:var(--space-16) var(--space-4);text-align:center;border:1px dashed var(--border);border-radius:var(--radius-lg);margin-top:var(--space-8);flex-direction:column;justify-content:center;align-items:center;display:flex}.demo-container{background-color:var(--bg-secondary);flex-grow:1;width:100%;position:relative}.demo-iframe{z-index:10;border:none;width:100%;height:100%;position:absolute;top:0;left:0}.demo-loading,.demo-error{align-items:center;gap:var(--space-4);z-index:5;color:var(--text-secondary);text-align:center;flex-direction:column;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}